@import url('/assets/front/site-surfaces.css?v=2');
@import url('/assets/front/site-spacing.css?v=1');
#pads-detail{--pd-ink:#594335;--pd-muted:#807267;display:block;margin:0;padding:0;background:var(--lonhow-surface-page);color:var(--pd-ink);font-family:'Noto Serif Variable',Georgia,serif}
#pads-detail *{box-sizing:border-box;min-width:0}
#pads-detail :is(h1,h2,h3){font-family:Georgia,'Noto Serif Variable',serif!important;font-weight:400!important;color:var(--pd-ink);letter-spacing:-.6px}
#pads-detail h1{font-size:clamp(38px,3.6vw,54px);line-height:1.17;letter-spacing:-.9px;margin:24px 0 0}
#pads-detail h2{font-size:clamp(31px,2.9vw,43px);line-height:1.2;margin:18px 0 0}
#pads-detail h3{font-size:24px;line-height:1.3;margin:0}
#pads-detail p{font-size:14px;line-height:1.9;color:var(--pd-muted);margin:0;max-width:550px}
#pads-detail a{color:#795747;text-decoration:none}
#pads-detail a:hover{color:#a94b5b}
#pads-detail a:focus-visible{outline:2px solid #a94b5b;outline-offset:5px}
#pads-detail .pd-wrap{margin-inline:auto}
#pads-detail .pd-section{padding-block:var(--lonhow-section-space);margin:0;scroll-margin-top:110px}
#pads-detail .pd-tint{background:var(--lonhow-surface-band)}
#pads-detail .pd-label{display:block;font-size:10px;line-height:1.7;letter-spacing:1.7px;text-transform:uppercase;color:#997e70}
#pads-detail .pd-link{display:inline-flex;align-items:center;gap:24px;font-size:14px;line-height:1.6;min-height:44px}
#pads-detail svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.2}
#pads-detail .pd-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #e1d5c9;min-height:66px;font-size:12px}
#pads-detail .pd-nav>div{display:flex;gap:32px}
#pads-detail .pd-split{display:grid;grid-template-columns:1fr 1.04fr;gap:8%;align-items:stretch}
#pads-detail .pd-hero-copy{display:flex;flex-direction:column;justify-content:space-between;gap:26px;padding-block:0}
#pads-detail p.pd-concept{font:400 27px/1.3 Georgia,'Noto Serif Variable',serif;color:#795747;margin:0 0 17px}
#pads-detail .pd-hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #dfd3c6;padding-top:20px}
#pads-detail .pd-hero-sizes{display:grid;gap:6px;font-size:16px}
#pads-detail .pd-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;align-items:end;margin-bottom:44px}
#pads-detail figure{margin:0}
#pads-detail .pd-placeholder{width:100%;position:relative;aspect-ratio:var(--image-ratio);background:#f0efeb;overflow:hidden;isolation:isolate}
#pads-detail .pd-placeholder img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
#pads-detail .pd-placeholder figcaption{position:absolute;bottom:0;left:0;right:0;padding:18px 24px;display:flex;justify-content:space-between;gap:16px;align-items:baseline;background:#f7f7f2d9;border-top:1px solid #deded699;color:#817b71;font-size:12px;line-height:1.5}
#pads-detail .pd-placeholder small{font:10px/1.5 Georgia,serif;color:#a09a90}
#pads-detail .pd-comparison{display:grid;grid-template-columns:1fr 1fr;gap:8%}
#pads-detail .pd-scale-stage{height:410px;display:flex;align-items:flex-end;justify-content:center;background:#f5f5f0;padding:28px 0}
#pads-detail .pd-scale-product{height:calc(350px * var(--scale));aspect-ratio:1 / 2;position:relative}
#pads-detail .pd-scale-product figure{height:100%;width:100%;background:none}
#pads-detail .pd-scale-product figcaption{display:none}
#pads-detail .pd-ruler{position:absolute;top:0;bottom:0;right:-35px;border-block:1px solid #bfb9ae;border-right:1px solid #bfb9ae;writing-mode:vertical-rl;padding:0 8px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#8f887d}
#pads-detail .pd-format-caption{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-top:24px}
#pads-detail .pd-format-caption h3{font-size:50px;line-height:1;font-variant-numeric:lining-nums tabular-nums}
#pads-detail .pd-format-caption small{font-size:22px}
#pads-detail .pd-caption{font-size:11px;line-height:1.6;color:#a08e7d;margin-top:32px;max-width:none}
#pads-detail .pd-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
#pads-detail .pd-macros figcaption{display:block;padding:14px 18px}
#pads-detail .pd-macros figcaption small{display:block;margin-top:4px}
#pads-detail .pd-macro-caption{display:flex;gap:20px;margin-top:24px}
#pads-detail .pd-macro-caption>span{font-size:11px;color:#ad8a73;padding-top:6px}
#pads-detail .pd-macro-caption p{font-size:13px;margin-top:10px}
#pads-detail .pd-visual-first{grid-template-columns:1.12fr 1fr;align-items:center}
#pads-detail .pd-editorial>p{margin-top:24px}
#pads-detail .pd-zone-list{margin:28px 0 0;padding:0;list-style:none}
#pads-detail .pd-zone-list li{display:flex;gap:28px;border-top:1px solid #dfd3c6;padding:14px 0;font-size:17px}
#pads-detail .pd-zone-list span{font-size:11px;color:#ad8a73;padding-top:3px}
#pads-detail .pd-packages{display:grid;grid-template-columns:1fr 1fr;gap:36px}
#pads-detail .pd-pack-composition{margin-top:48px}
#pads-detail .pd-choice{display:grid;grid-template-columns:1.1fr 1fr;gap:10%;align-items:center}
#pads-detail .pd-choice p{margin-top:24px}
#pads-detail .pd-choice-options{border-top:1px solid #d9cbbf;margin-bottom:24px}
#pads-detail .pd-choice-options a{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d9cbbf;padding:20px 0}
#pads-detail .pd-choice-options a>span:first-child{font:42px/1 Georgia,serif}
#pads-detail .pd-choice-options small{font-size:20px}
#pads-detail .pd-choice-options a>span:last-child{display:flex;align-items:center;gap:36px;font-size:15px}
#pads-detail .pd-cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%}
#pads-detail .pd-cta-grid article+article{border-left:1px solid #dfd3c6;padding-left:14%}
#pads-detail .pd-cta-grid p{margin:28px 0 24px}
#pads-detail .pd-cta-links{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
@media(max-width:1100px){
#pads-detail .pd-wrap{width:calc(100% - 64px)}
#pads-detail .pd-split,#pads-detail .pd-heading{gap:5%}
#pads-detail h1{font-size:38px}
#pads-detail .pd-hero-bottom{align-items:flex-start;flex-direction:column;gap:8px}
#pads-detail .pd-macros{gap:20px}
#pads-detail .pd-placeholder figcaption{flex-direction:column;gap:4px;padding:15px 18px}
#pads-detail .pd-format-caption{align-items:flex-start;flex-direction:column;gap:14px}
}
@media(max-width:760px){
#pads-detail .pd-wrap{width:calc(100% - 40px)}
#pads-detail .pd-nav{align-items:flex-start;flex-direction:column;gap:14px;padding-block:18px}
#pads-detail .pd-nav>div{gap:26px;flex-wrap:wrap}
#pads-detail .pd-split,#pads-detail .pd-heading,#pads-detail .pd-choice,#pads-detail .pd-cta-grid{grid-template-columns:1fr;gap:28px}
#pads-detail h1{font-size:37px;overflow-wrap:break-word}
#pads-detail h2{font-size:32px}
#pads-detail .pd-hero-copy{gap:28px}
#pads-detail .pd-hero-bottom{flex-direction:row;align-items:center;gap:12px}
#pads-detail .pd-hero-sizes{font-size:14px}
#pads-detail .pd-hero-bottom .pd-link{font-size:12px;gap:8px}
#pads-detail .pd-heading{margin-bottom:28px}
#pads-detail :is(#pad-form,#pad-absorption) .pd-placeholder{aspect-ratio:4/3}
#pads-detail .pd-comparison{gap:20px}
#pads-detail .pd-scale-stage{height:270px;padding:24px 18px 24px 0}
#pads-detail .pd-scale-product{height:calc(210px * var(--scale));max-width:calc(100% - 15px)}
#pads-detail .pd-ruler{right:-23px;padding:0 4px;font-size:10px}
#pads-detail .pd-format-caption h3{font-size:37px}
#pads-detail .pd-format-caption small{font-size:18px}
#pads-detail .pd-format-caption p{font-size:12px}
#pads-detail .pd-macros{grid-template-columns:1fr;gap:32px}
#pads-detail .pd-macro-caption{margin-top:18px}
#pads-detail .pd-visual-first .pd-placeholder{order:2}
#pads-detail .pd-packages{grid-template-columns:1fr;gap:36px}
#pads-detail .pd-packages .pd-format-caption{flex-direction:row;align-items:baseline}
#pads-detail .pd-pack-composition{margin-top:36px}
#pads-detail .pd-pack-composition .pd-placeholder{aspect-ratio:4/3}
#pads-detail .pd-cta-grid article+article{border-left:0;border-top:1px solid #dfd3c6;padding:36px 0 0;margin-top:8px}
}
@media(max-width:360px){#pads-detail .pd-scale-product{height:calc(180px * var(--scale))}#pads-detail .pd-scale-stage{height:240px}}

/* Confirmed subpage master: quality-documents. Desktop only in this revision. */
@media(min-width:1101px){
.pd-chapter-nav .about-chapter-links{grid-template-columns:repeat(3,auto)}
#pads-detail #pad-hero{border-bottom:1px solid #e6dbd0}
#pads-detail #pad-hero .pd-placeholder{align-self:start;aspect-ratio:4/3}
#pads-detail #pad-hero .pd-hero-copy>div:nth-child(2)>p:not(.pd-concept){font-size:15px;line-height:1.9;max-width:550px}
#pads-detail .pd-hero-bottom{padding-top:15px;gap:12px 28px}
#pads-detail .pd-hero-bottom .pd-link{font-size:12px;line-height:1.7;min-height:0;padding:9px 0}
#pads-detail .pd-heading{margin-bottom:38px}
#pads-detail .pd-heading>p{font-size:13px;line-height:1.9}
#pads-detail .pd-section{scroll-margin-top:12px}
}
/* Keep the approved 4:3 visual and align both hero columns at top and bottom. */
@media(min-width:1101px){
#pads-detail #pad-hero .pd-hero-copy{gap:15px}
#pads-detail #pad-hero .pd-concept{font-size:24px;line-height:1.25;margin-bottom:12px}
#pads-detail #pad-hero .pd-hero-sizes{display:grid;grid-template-columns:1fr;gap:6px;font-size:14px;line-height:1.5}
#pads-detail #pad-hero .pd-hero-sizes>span{display:block;white-space:nowrap}
}


/* Desktop: balance the hygiene editorial header without changing approved copy. */
@media(min-width:1101px){
#pads-detail #pad-surface .pd-hygiene-aside{align-self:stretch;margin-top:32px;padding:26px 0;display:flex;align-items:center;gap:24px;border-block:1px solid #dfd3c6}
#pads-detail #pad-surface .pd-hygiene-icon{width:64px;height:64px;stroke:#a87e78;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;flex:none}
#pads-detail #pad-surface .pd-hygiene-aside h3{font-size:clamp(28px,2.4vw,36px);line-height:1.2}
#pads-detail #pad-surface .pd-hygiene-aside p{font-size:17px;line-height:1.7;max-width:420px;margin-top:18px}
}

/* Desktop fourth-screen copy uses the approved editorial callout treatment. */
@media(min-width:1101px){
#pads-detail #pad-details .pd-texture-heading{align-items:stretch}
#pads-detail #pad-details .pd-texture-intro{margin-top:26px;padding:24px 0;display:flex;align-items:center;gap:24px;border-block:1px solid #dfd3c6}
#pads-detail #pad-details .pd-texture-intro svg{width:64px;height:64px;flex:none;stroke:#a87e78;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
#pads-detail #pad-details .pd-texture-intro p{font-size:16px;line-height:1.8;max-width:460px}
#pads-detail #pad-details .pd-macro-caption h3{font-size:clamp(22px,1.7vw,27px);line-height:1.3}
#pads-detail #pad-details .pd-macro-caption p{font-size:14px;line-height:1.8;margin-top:12px}
}

/* Desktop fifth screen: image and copy share top/bottom edges; retain numbered text. */
@media(min-width:1101px){
#pads-detail #pad-structure .pd-split{align-items:stretch}
#pads-detail #pad-structure .pd-render{align-self:start}
#pads-detail #pad-structure .pd-editorial{display:flex;flex-direction:column;justify-content:space-between;gap:0}
#pads-detail #pad-structure .pd-editorial h2{font-size:clamp(31px,2.7vw,43px);line-height:1.17;margin:14px 0 0}
#pads-detail #pad-structure .pd-editorial>p{font-size:14px;line-height:1.75;margin-top:16px}
#pads-detail #pad-structure .pd-zone-list{margin:18px 0 0}
#pads-detail #pad-structure .pd-zone-list li{padding:11px 0;line-height:1.5}
#pads-detail #pad-structure .pd-zone-list li:last-child{padding-bottom:0}
}

@media(min-width:1101px){
#pads-detail #pad-structure .pd-comfort-icons li{gap:20px;align-items:center}
#pads-detail #pad-structure .pd-comfort-icons svg{width:22px;height:22px;stroke:#a87e78;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;flex:none}
}

/* Desktop screens 02 and 06 share the approved hygiene editorial layout. */
@media(min-width:1101px){
#pads-detail :is(#pad-form,#pad-absorption) .pd-airflow-body{margin-top:20px}
#pads-detail :is(#pad-form,#pad-absorption) .pd-airflow-aside{align-self:stretch;margin-top:32px;padding:26px 0;display:flex;align-items:center;gap:24px;border-block:1px solid #dfd3c6}
#pads-detail :is(#pad-form,#pad-absorption) .pd-airflow-aside svg{width:64px;height:64px;flex:none;stroke:#a87e78;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
#pads-detail :is(#pad-form,#pad-absorption) .pd-airflow-aside ul{list-style:none;margin:0;padding:0;display:grid;gap:16px}
#pads-detail :is(#pad-form,#pad-absorption) .pd-airflow-aside li{font-size:clamp(19px,1.55vw,25px);line-height:1.45}
}


/* Desktop fit: left copy / right portrait, alternating content bands. */
@media(min-width:1101px){
#pads-detail #pad-fit{background:var(--lonhow-surface-page)!important}
#pads-detail > section#pad-resources{--lonhow-current-section:var(--lonhow-surface-band);background:var(--lonhow-surface-band)!important}
#pads-detail #pad-fit .pd-fit-copy{display:flex;flex-direction:column;justify-content:space-between;gap:28px}
#pads-detail #pad-fit .pd-zone-list{margin:0}
#pads-detail #pad-fit .pd-zone-list li:last-child{padding-bottom:0}
}


/* Desktop closing: equal editorial columns, aligned headings and action baselines. */
@media(min-width:1101px){
#pads-detail #pad-resources .pd-cta-grid{gap:8%;align-items:stretch}
#pads-detail #pad-resources .pd-cta-grid article{display:grid;grid-template-rows:auto auto 1fr auto;border-top:1px solid #dfd3c6;padding:24px 0 0}
#pads-detail #pad-resources .pd-cta-grid article+article{border-left:0;margin:0;padding-left:0}
#pads-detail #pad-resources h2{font-size:clamp(34px,2.9vw,48px);line-height:1.18;margin:22px 0 26px}
#pads-detail #pad-resources .pd-cta-grid p{margin:0;max-width:520px;font-size:14px;line-height:1.9}
#pads-detail #pad-resources .pd-closing-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #dfd3c6;padding-top:18px;margin-top:34px}
#pads-detail #pad-resources .pd-link{font-size:13px;gap:18px}
#pads-detail #pad-resources .pd-closing-actions .pd-link+ .pd-link{color:#927b6c}
}

/* Desktop fit copy with three understated SVG benefit icons. */
@media(min-width:1101px){
#pads-detail #pad-fit .pd-fit-copy{gap:12px}
#pads-detail #pad-fit h2{font-size:clamp(30px,2.5vw,44px);line-height:1.17;margin-top:12px}
#pads-detail #pad-fit .pd-fit-copy>p{font-size:13px;line-height:1.75}
#pads-detail #pad-fit .pd-fit-benefits li{gap:18px;padding:10px 0;align-items:center}
#pads-detail #pad-fit .pd-fit-benefits li:last-child{padding-bottom:0}
#pads-detail #pad-fit .pd-fit-benefits svg{width:30px;height:30px;stroke:#a87e78;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;flex:none}
#pads-detail #pad-fit .pd-fit-benefits h3{font-size:19px;line-height:1.3;letter-spacing:0}
#pads-detail #pad-fit .pd-fit-benefits p{font-size:12px;line-height:1.6;margin-top:5px}
}
