@import url('/assets/front/site-spacing.css?v=1');
/* Desktop framework only. No tablet/mobile adaptation in this phase. */
#diapers-detail{--dd-ink:#594335;--dd-muted:#807267;margin:0;padding:0;color:var(--dd-ink);font-family:'Noto Serif Variable',Georgia,serif}
#diapers-detail *{box-sizing:border-box;min-width:0}
#diapers-detail>.dd-section{padding-block:80px;margin:0;background:#fffefb;scroll-margin-top:175px}
#diapers-detail>.dd-section:nth-of-type(even){background:#f7f3ed}
#diapers-detail :is(h1,h2,h3){font-family:Georgia,'Noto Serif Variable',serif!important;font-weight:400!important;color:var(--dd-ink);letter-spacing:-.6px;margin:0}
#diapers-detail h1{font-size:clamp(38px,3.6vw,64px);line-height:1.17;margin-top:24px}
#diapers-detail h2{font-size:clamp(31px,2.9vw,50px);line-height:1.2;margin-top:18px}
#diapers-detail h3{font-size:24px;line-height:1.3}
#diapers-detail p{font-size:14px;line-height:1.9;color:var(--dd-muted);margin:0;max-width:550px}
#diapers-detail .dd-label{display:block;font-size:10px;line-height:1.7;letter-spacing:1.7px;text-transform:uppercase;color:#997e70}
#diapers-detail svg{fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px;flex:none}
#diapers-detail .dd-link{display:inline-flex;gap:18px;align-items:center;text-decoration:none;color:#795747;font-size:13px;line-height:1.6;min-height:44px}
#diapers-detail a:hover{color:#a94b5b}
#diapers-detail a:focus-visible{outline:2px solid #a94b5b;outline-offset:4px}
#diapers-detail .dd-split{display:grid;grid-template-columns:1fr 1.04fr;gap:8%;align-items:stretch}
#diapers-detail .dd-copy{display:flex;flex-direction:column;justify-content:space-between;gap:24px}
#diapers-detail .dd-concept{font-size:25px;color:#795747;margin-bottom:16px}
#diapers-detail .dd-hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #dfd3c6;padding-top:14px;font-size:14px}
#diapers-detail .dd-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;align-items:end;margin-bottom:40px}
#diapers-detail .dd-placeholder{width:100%;aspect-ratio:var(--image-ratio);position:relative;margin:0;background:#f1efea;overflow:hidden}
#diapers-detail .dd-placeholder img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
#diapers-detail figcaption{position:absolute;inset:auto 0 0;padding:15px 20px;display:flex;justify-content:space-between;gap:15px;background:#faf9f5e8;border-top:1px solid #ded7cd;color:#958576;font-size:11px;line-height:1.6}
#diapers-detail figcaption small{font:10px/1.6 Georgia,serif;white-space:nowrap}
#diapers-detail .dd-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
#diapers-detail .dd-macros h3{margin-top:24px;font-size:23px}
#diapers-detail .dd-macros p{margin-top:10px;font-size:13px}
#diapers-detail .dd-macros figcaption{display:block}
#diapers-detail .dd-macros small{display:block;margin-top:3px}
#diapers-detail .dd-features{padding:0;margin:0;list-style:none}
#diapers-detail .dd-features li{display:flex;gap:20px;align-items:center;border-top:1px solid #dfd3c6;padding:16px 0;font-size:17px}
#diapers-detail .dd-features li:last-child{padding-bottom:0}
#diapers-detail .dd-features svg{color:#a87e78}
#diapers-detail .dd-story-note{border-top:1px solid #dfd3c6;padding-top:24px;font-size:21px;line-height:1.6;color:#927b6c;display:flex;align-items:flex-start;gap:16px}
#diapers-detail .dd-story-note svg{width:28px;height:28px;flex:none;margin-top:3px;fill:none;stroke:#a87e78;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
#diapers-detail .dd-sizes{display:grid;grid-template-columns:repeat(5,1fr);border-block:1px solid #dfd3c6;padding:30px 0}
#diapers-detail .dd-sizes article{padding:0 25px;border-left:1px solid #dfd3c6}
#diapers-detail .dd-sizes article:first-child{padding-left:0;border:0}
#diapers-detail .dd-sizes h3{font-size:clamp(42px,4vw,64px);line-height:1.15;margin:18px 0}
#diapers-detail .dd-sizes .dd-weight{font-size:20px;color:#795747;margin-bottom:9px}
#diapers-detail .dd-sizes p{font-size:12px}
#diapers-detail .dd-size-note{margin-top:24px;font-size:12px;max-width:none}
#diapers-detail .dd-choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
#diapers-detail .dd-choice-grid article{border-top:1px solid #dfd3c6;padding-top:25px}
#diapers-detail .dd-choice-grid svg{width:32px;height:32px;color:#a87e78;margin-bottom:24px}
#diapers-detail .dd-choice-grid h3{font-size:22px;margin-bottom:14px}
#diapers-detail .dd-closing{display:grid;grid-template-columns:1fr 1fr;gap:8%}
#diapers-detail .dd-closing article{display:grid;grid-template-rows:auto auto 1fr auto;border-top:1px solid #dfd3c6;padding-top:24px}
#diapers-detail .dd-closing h2{margin:22px 0 26px}
#diapers-detail .dd-actions{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #dfd3c6;padding-top:18px;margin-top:34px}
#diapers-detail .dd-actions a+a{color:#927b6c}
.diaper-chapter-nav .about-chapter-links{grid-template-columns:repeat(3,auto)}
/* Approved hero copy and airy-material concepts. */
#diapers-detail #diaper-hero .dd-copy{gap:14px}
#diapers-detail #diaper-hero h1{margin-top:14px}
#diapers-detail #diaper-hero .dd-concept{font-size:23px;margin-bottom:12px}
#diapers-detail #diaper-hero p{font-size:13px;line-height:1.75}
#diapers-detail .dd-concepts{list-style:none;margin:0;padding:0;border-top:1px solid #dfd3c6}
#diapers-detail .dd-concepts li{display:flex;align-items:center;gap:20px;padding:21px 0;border-bottom:1px solid #dfd3c6;font-size:20px;line-height:1.5}
#diapers-detail .dd-concepts svg{width:27px;height:27px;color:#a87e78}
#diapers-detail .dd-concepts-compact{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border:0}
#diapers-detail .dd-concepts-compact li{padding:0;gap:8px;font-size:11px;line-height:1.5;border:0}
#diapers-detail .dd-concepts-compact svg{width:21px;height:21px}
#diapers-detail .dd-airflow-heading{align-items:center}
#diapers-detail .dd-airflow-heading p{margin-top:24px}
#diapers-detail .dd-sizes{grid-template-columns:repeat(6,1fr)}
#diapers-detail .dd-sizes article{padding-inline:20px}
#diapers-detail .dd-sizes article:first-child{padding-left:0}
/* Three microscopic detail captions share an aligned heading row. */
#diapers-detail .dd-macros h3{display:flex;gap:12px;align-items:flex-start;min-height:2.6em;font-size:22px}
#diapers-detail .dd-macros h3 svg{width:25px;height:25px;margin-top:2px;color:#a87e78}
/* Fourth screen: texture copy with descriptive SVG rows. */
#diapers-detail #diaper-structure .dd-copy{gap:18px}
#diapers-detail #diaper-structure h2{font-size:clamp(30px,2.7vw,46px);margin-top:14px}
#diapers-detail .dd-structure-features li{gap:16px;padding:12px 0;align-items:flex-start}
#diapers-detail .dd-structure-features li:last-child{padding-bottom:0}
#diapers-detail .dd-structure-features svg{width:25px;height:25px;margin-top:3px}
#diapers-detail .dd-structure-features h3{font-size:17px;line-height:1.4;letter-spacing:0;margin-bottom:4px}
#diapers-detail .dd-structure-features p{font-size:12px;line-height:1.65}
