/* Nutrient education: one layout and finite-motion owner; shared glass tokens. */
body.dhd #main .nutrient-atlas{
 --na-ink:#fff9eb;--na-muted:#e4ddcf;--na-gold:#e2c88d;--na-line:rgba(226,200,141,.42);
 color:var(--na-ink);font-family:inherit;box-sizing:border-box;min-width:0;text-align:left;
}
body.dhd #main .nutrient-atlas *,body.dhd #main .nutrient-atlas *::before,body.dhd #main .nutrient-atlas *::after{box-sizing:border-box}
body.dhd #main .nutrient-atlas :is(h2,h3,p,a,button,summary,output){color:inherit}
body.dhd #main .nutrient-atlas :is(h2,h3){text-wrap:balance;overflow-wrap:normal;word-break:normal}
body.dhd #main .nutrient-atlas p{max-width:65ch;line-height:1.65;font-size:clamp(17px,1.25vw,21px);margin:0}
body.dhd #main .nutrient-atlas .na-eyebrow{font-family:"Barlow Condensed",sans-serif;letter-spacing:.17em;text-transform:uppercase;font-weight:500;font-size:14px;line-height:1.5;color:var(--na-gold);margin:0 0 16px}
body.dhd #main .na-full{margin:clamp(48px,7vw,110px) auto;padding:0 clamp(18px,5vw,90px);max-width:1920px;scroll-margin-top:170px}
body.dhd #main .na-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end;margin:0 0 34px}
body.dhd #main .na-heading h2{font-size:clamp(32px,4.2vw,70px);line-height:1.12;margin:0}
body.dhd #main .na-heading h2 em{display:block;font-style:normal;color:var(--na-gold)}
body.dhd #main .na-heading>p{color:var(--na-muted);padding-bottom:4px}
body.dhd #main .na-guide{display:flex;align-items:flex-start;justify-content:space-between;gap:32px;border-top:1px solid var(--na-line);padding:24px 0}
body.dhd #main .na-guide>span{font-weight:600;font-size:18px;max-width:23ch}
body.dhd #main .na-guide>p{font-size:16px;max-width:65ch;color:var(--na-muted)}
body.dhd #main .na-tabs{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 2px 16px;margin-bottom:4px;scrollbar-color:#c8b27f #383a35;scrollbar-width:thin}
body.dhd #main .na-tabs a{display:flex;gap:12px;align-items:center;flex:0 0 auto;padding:13px 18px;border:1px solid var(--na-line);text-decoration:none;color:var(--na-ink);font-size:16px;line-height:1.25;min-height:48px;background:rgba(23,26,24,.32);border-radius:0}
body.dhd #main .na-tabs a span{font-size:11px;letter-spacing:.1em;color:var(--na-gold)}
body.dhd #main .na-tabs a[aria-current="true"]{background:#e2c88d;color:#242a26;border-color:#f3dfb7}
body.dhd #main .na-tabs a[aria-current="true"] span{color:#4e442e}
body.dhd #main .nutrient-atlas :is(a,button,summary):focus-visible{outline:3px solid var(--na-gold);outline-offset:5px}
body.dhd #main .na-panels{display:grid;gap:24px}
body.dhd #main .na-panel{
 position:relative;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;min-width:0;min-height:490px;
 background:var(--dhd-glass-dark);border:1px solid var(--na-line);border-radius:0;
 box-shadow:var(--dhd-glass-shadow);-webkit-backdrop-filter:var(--dhd-glass-filter);backdrop-filter:var(--dhd-glass-filter);
 scroll-margin-top:160px;isolation:isolate;
}
body.dhd #main .na-panel[hidden]{display:none}
body.dhd #main .na-art{position:relative;min-width:0;min-height:330px;display:grid;place-items:center;padding:20px 6px 12px;overflow:hidden}
body.dhd #main .na-art>svg{display:block;width:100%;height:auto;max-height:480px;overflow:visible}
body.dhd #main .na-art-index{position:absolute;top:24px;left:28px;font-family:"Barlow Condensed",sans-serif;font-size:14px;letter-spacing:.14em;color:var(--na-gold)}
body.dhd #main .na-copy{padding:clamp(26px,3.1vw,56px) clamp(24px,3vw,52px) clamp(26px,3.1vw,56px) 20px;min-width:0}
body.dhd #main .na-copy h3{max-width:none;font-size:clamp(28px,3.25vw,51px);line-height:1.17;margin:0 0 23px}
body.dhd #main .na-copy .na-role{color:var(--na-gold);font-size:clamp(18px,1.65vw,25px);line-height:1.4;margin-bottom:18px}
body.dhd #main .na-copy .na-intro{color:var(--na-muted)}
body.dhd #main .na-details{border-top:1px solid var(--na-line);margin-top:25px}
body.dhd #main .na-details summary{display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;list-style:none;padding:18px 0;min-height:48px;font-size:17px}
body.dhd #main .na-details summary::-webkit-details-marker{display:none}
body.dhd #main .na-details summary svg{width:18px;height:18px}
body.dhd #main .na-details[open] summary svg{transform:rotate(45deg)}
body.dhd #main .na-details>div{display:grid;gap:16px;padding:0 0 8px}
body.dhd #main .na-details p{font-size:17px;color:var(--na-muted)}
body.dhd #main .na-details .na-label-note{font-size:15px;padding-left:16px;border-left:2px solid var(--na-gold)}
body.dhd #main .na-navigation{display:flex;justify-content:flex-end;align-items:center;gap:20px;padding:18px 0}
body.dhd #main .na-navigation[hidden]{display:none}
body.dhd #main .na-navigation button{display:flex;align-items:center;gap:20px;min-height:48px;min-width:48px;border:1px solid var(--na-line);border-radius:0;padding:11px 18px;background:transparent;color:var(--na-ink);font:inherit;cursor:pointer}
body.dhd #main .na-navigation button:hover{background:rgba(255,247,222,.08)}
body.dhd #main .na-navigation button>svg,body.dhd #main .na-navigation button span svg{width:20px;height:20px}
body.dhd #main .na-navigation output{font-variant-numeric:tabular-nums;white-space:nowrap}
body.dhd #main .na-footer{display:flex;justify-content:space-between;gap:36px;align-items:center;padding:24px 0 32px;border-bottom:1px solid var(--na-line)}
body.dhd #main .na-footer p{max-width:69ch;color:var(--na-muted);font-size:17px}
body.dhd #main .nutrient-atlas :is(.na-link,.na-footer>a){display:inline-flex;align-items:center;gap:24px;font-size:18px;line-height:1.35;min-height:48px;text-decoration:none;border-bottom:1px solid var(--na-line);padding:12px 0;color:var(--na-ink)}
body.dhd #main .nutrient-atlas a span svg{width:21px;height:21px;flex:none}
body.dhd #main .na-sources{padding:20px 0}
body.dhd #main .na-sources summary{cursor:pointer;font-size:16px;min-height:44px;padding:10px 0}
body.dhd #main .na-sources>div{padding:14px 0 10px}
body.dhd #main .na-sources p,body.dhd #main .na-sources a{font-size:16px;color:var(--na-muted)}
body.dhd #main .na-sources ul{padding-left:20px;display:grid;gap:12px}
body.dhd #main .na-sources a{display:inline-flex;gap:12px}
body.dhd #main .na-product{padding:32px 0 26px;border-top:1px solid var(--na-line);margin-top:26px}
body.dhd #main .na-product>header{margin-bottom:24px}
body.dhd #main .na-product>header h3{font-size:clamp(27px,2.6vw,40px);line-height:1.2;margin:0 0 16px}
body.dhd #main .na-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
body.dhd #main .na-panel--small{display:flex;flex-direction:column;min-height:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;border-top:1px solid var(--na-line);align-items:stretch}
body.dhd #main .na-panel--small .na-art{padding:12px 0 0;min-height:0}
body.dhd #main .na-panel--small .na-art-index{top:15px;left:0;font-size:12px}
body.dhd #main .na-panel--small .na-art>svg{max-height:280px;aspect-ratio:1.2}
body.dhd #main .na-panel--small .na-copy{padding:5px 10px 18px 0}
body.dhd #main .na-panel--small .na-copy h3{font-size:clamp(22px,1.8vw,30px);line-height:1.25;margin-bottom:14px}
body.dhd #main .na-panel--small .na-copy .na-role{font-size:17px;margin:0;color:var(--na-muted)}
body.dhd #main .na-panel--small .na-eyebrow{font-size:12px;margin:0 0 10px}
body.dhd #main .na-product .na-pack-links{font-size:15px;line-height:1.9;margin-top:18px;color:var(--na-muted)}
body.dhd #main .na-pack-links>span:first-child{display:block}
body.dhd #main .na-pack-links a{color:var(--na-gold);text-decoration-thickness:1px;text-underline-offset:4px}
body.dhd #main .na-teaser{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:32px;margin:40px 0 20px;padding:clamp(22px,3vw,48px);background:var(--dhd-glass-dark);border:1px solid var(--na-line);border-radius:0;box-shadow:var(--dhd-glass-shadow);-webkit-backdrop-filter:var(--dhd-glass-filter);backdrop-filter:var(--dhd-glass-filter)}
body.dhd #main .na-teaser h2{font-size:clamp(27px,2.8vw,44px);line-height:1.17;margin:0 0 20px}
body.dhd #main .na-teaser p:not(.na-eyebrow){font-size:18px;color:var(--na-muted)}
body.dhd #main .na-teaser-art{display:grid;grid-template-columns:1fr 1fr;gap:10px;min-width:0}
body.dhd #main .na-teaser-art svg{display:block;width:100%;height:auto}
/* Nine finite semantic sequences. Anatomy and copy remain stable; decorative signals rest after 4.6s. */
body.dhd #main .nutrient-atlas :is(.na-art__motion-trace,.na-art__mineral-arrival>*,.na-art__oxygen-ride,.na-art__follicle-rings>*,.na-art__hair-routes>*,.na-art__thyroid-arrival>*,.na-art__binding-bonds>*,.na-art__retina-catch){opacity:0}
body.dhd #main .na-motion :is(.na-art__motion-trace,.na-art__hair-routes>*,.na-art__binding-bonds>*){stroke-dasharray:.15 .85;stroke-dashoffset:1}
@keyframes na-focus{0%,100%{scale:1}18%{scale:.93}44%{scale:.98}66%{scale:.955}}
@keyframes na-eye-catch{0%,100%{translate:0 0;opacity:.75}30%{translate:2px -2px;opacity:1}68%{translate:-1px 1px;opacity:.9}}
@keyframes na-trace-light{0%{opacity:0;stroke-dashoffset:1}4%{opacity:1}82%{opacity:1;stroke-dashoffset:-.1}100%{opacity:0;stroke-dashoffset:-.2}}
@keyframes na-mineral-arrive{0%{opacity:0;translate:10px -17px;scale:.65}12%{opacity:1}42%{translate:0 0;scale:1}70%{opacity:.85;scale:1.12}100%{opacity:0;translate:0 0;scale:1}}
@keyframes na-guard-wave{0%{opacity:0;stroke-dashoffset:1}3%{opacity:.95}88%{opacity:.9;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:-.08}}
@keyframes na-oxygen-ride{0%{opacity:0;translate:-8px 0}3%{opacity:1}25%{translate:37px 11px}50%{translate:91px 46px}75%{translate:151px 81px;opacity:1}100%{translate:194px 106px;opacity:0}}
@keyframes na-follicle-pulse{0%{opacity:0;scale:.7}12%{opacity:.9;scale:1}45%{opacity:.45;scale:1.4}70%,100%{opacity:0;scale:1.7}}
@keyframes na-thyroid-left{0%{opacity:0;translate:-23px -57px}5%{opacity:1}55%{translate:0 0;opacity:1}76%{opacity:.7}100%{translate:0 0;opacity:0}}
@keyframes na-thyroid-right{0%{opacity:0;translate:23px -57px}5%{opacity:1}55%{translate:0 0;opacity:1}76%{opacity:.7}100%{translate:0 0;opacity:0}}
@keyframes na-thyroid-centre{0%{opacity:0;translate:0 -47px}5%{opacity:1}55%{translate:0 0;opacity:1}76%{opacity:.7}100%{translate:0 0;opacity:0}}
@keyframes na-binding-lock{0%{opacity:0;stroke-dashoffset:1}5%{opacity:1}45%{stroke-dashoffset:0;opacity:1}76%{opacity:1}100%{opacity:0;stroke-dashoffset:0}}
@keyframes na-binding-bond{0%{opacity:0;stroke-dashoffset:1}12%{opacity:1}48%{stroke-dashoffset:0;opacity:1}78%{opacity:1}100%{opacity:0;stroke-dashoffset:0}}
@keyframes na-heart-beat{0%,30%,62%,100%{scale:1}10%,43%{scale:1.016}17%,50%{scale:1.004}22%,55%{scale:1.011}}
@keyframes na-retina-catch{0%,100%{opacity:0}12%,44%{opacity:1}28%,65%{opacity:.25}}
body.dhd #main .na-motion .na-art--vision .na-art__iris>circle:nth-of-type(3),
body.dhd #main .na-motion .na-art--vision .na-art__iris>circle:nth-of-type(4){animation:na-focus 4.2s ease-in-out 1;transform-box:fill-box;transform-origin:center}
body.dhd #main .na-motion .na-art--vision .na-art__iris>ellipse{animation:na-eye-catch 4.2s ease-in-out 1}
body.dhd #main .na-motion .na-art__focus-light{animation:na-trace-light 4.2s linear 1}
body.dhd #main .na-motion .na-art__mineral-arrival>*{animation:na-mineral-arrive 3.8s cubic-bezier(.2,.7,.25,1) 1;transform-box:fill-box;transform-origin:center}
body.dhd #main .na-motion .na-art__mineral-arrival>:nth-child(2){animation-delay:.16s}
body.dhd #main .na-motion .na-art__mineral-arrival>:nth-child(3){animation-delay:.32s}
body.dhd #main .na-motion .na-art__guard-wave{animation:na-guard-wave 4.4s linear 1;stroke-dasharray:.22 .78}
body.dhd #main .na-motion .na-art__nerve-route{animation:na-trace-light 4.35s linear 1;stroke-dasharray:.095 .905}
body.dhd #main .na-motion .na-art__oxygen-ride{animation:na-oxygen-ride 4.3s linear 1}
body.dhd #main .na-motion .na-art__oxygen-ride--two{animation-delay:.22s}
body.dhd #main .na-motion .na-art__follicle-rings>*{animation:na-follicle-pulse 3.9s ease-out 1;transform-box:fill-box;transform-origin:center}
body.dhd #main .na-motion .na-art__follicle-rings>:nth-child(2){animation-delay:.16s}
body.dhd #main .na-motion .na-art__follicle-rings>:nth-child(3){animation-delay:.32s}
body.dhd #main .na-motion .na-art__hair-routes>*{animation:na-trace-light 4.1s linear 1;stroke-dasharray:.09 .91}
body.dhd #main .na-motion .na-art__hair-routes>:nth-child(2){animation-delay:.15s}
body.dhd #main .na-motion .na-art__hair-routes>:nth-child(3){animation-delay:.3s}
body.dhd #main .na-motion .na-art__thyroid-arrival>:nth-child(1){animation:na-thyroid-left 4.05s ease-in-out 1}
body.dhd #main .na-motion .na-art__thyroid-arrival>:nth-child(2){animation:na-thyroid-right 4.05s ease-in-out .16s 1}
body.dhd #main .na-motion .na-art__thyroid-arrival>:nth-child(3){animation:na-thyroid-centre 4.05s ease-in-out .32s 1}
body.dhd #main .na-motion .na-art__binding-lock{animation:na-binding-lock 4.4s ease-in-out 1;stroke-dasharray:.84 .16}
body.dhd #main .na-motion .na-art__binding-bonds>*{animation:na-binding-bond 4.1s ease-out 1;stroke-dasharray:1 1}
body.dhd #main .na-motion .na-art__binding-bonds>:nth-child(2){animation-delay:.12s}
body.dhd #main .na-motion .na-art__binding-bonds>:nth-child(3){animation-delay:.24s}
body.dhd #main .na-motion .na-art--taurine :is(.na-art__body,.na-art__microdetail>g:not(:last-child)){animation:na-heart-beat 4.3s ease-in-out 1;transform-box:view-box;transform-origin:300px 245px}
body.dhd #main .na-motion .na-art__heart-route{animation:na-trace-light 4.3s linear 1;stroke-dasharray:.14 .86}
body.dhd #main .na-motion .na-art__retina-catch{animation:na-retina-catch 4.3s ease-in-out 1}
@media(max-width:1000px){
 body.dhd #main .na-heading{gap:28px;grid-template-columns:1fr}
 body.dhd #main .na-heading>p{max-width:66ch}
 body.dhd #main .na-full{padding:0 24px;scroll-margin-top:100px}
 body.dhd #main .na-panel{grid-template-columns:1fr 1fr;min-height:410px}
 body.dhd #main .na-copy{padding:30px 25px 30px 8px}
 body.dhd #main .na-art{min-height:270px}
 body.dhd #main .na-guide{gap:24px}
}
@media(max-width:640px){
 body.dhd #main .na-full{padding:0 16px;margin:44px auto;scroll-margin-top:92px}
 body.dhd #main .na-heading{gap:20px;margin-bottom:25px}
 body.dhd #main .na-heading h2{font-size:35px;line-height:1.16}
 body.dhd #main .na-guide{display:block;padding:20px 0}
 body.dhd #main .na-guide>p{margin-top:10px;font-size:15px}
 body.dhd #main .na-tabs{margin-right:-16px;padding-right:16px}
 body.dhd #main .na-tabs a{font-size:15px;padding:12px;gap:8px}
 body.dhd #main .na-panel{grid-template-columns:1fr;min-height:0}
 body.dhd #main .na-art{min-height:0;padding:10px 4px 0}
 body.dhd #main .na-art>svg{max-height:320px}
 body.dhd #main .na-art-index{top:20px;left:20px}
 body.dhd #main .na-copy{padding:8px 24px 26px}
 body.dhd #main .na-copy h3{max-width:none;font-size:31px;margin-bottom:17px}
 body.dhd #main .na-copy .na-role{font-size:21px}
 body.dhd #main .na-copy .na-intro{font-size:17px}
 body.dhd #main .na-footer{display:block}
 body.dhd #main .na-footer>a{margin-top:18px}
 body.dhd #main .na-navigation{justify-content:space-between;gap:12px}
 body.dhd #main .na-navigation button{padding:10px 12px;font-size:16px}
 body.dhd #main .na-product-grid{grid-template-columns:1fr;gap:22px}
 body.dhd #main .na-panel--small{display:flex;flex-direction:column;gap:0;align-items:stretch;padding-top:14px}
 body.dhd #main .na-panel--small .na-art{width:100%}
 body.dhd #main .na-panel--small .na-art>svg{max-height:235px}
 body.dhd #main .na-panel--small .na-copy{padding:8px 0}
 body.dhd #main .na-panel--small .na-copy h3{font-size:27px}
 body.dhd #main .na-panel--small .na-art-index{display:none}
 body.dhd #main .na-panel--small .na-copy .na-role{font-size:16px}
 body.dhd #main .na-product .na-eyebrow{font-size:12px}
 body.dhd #main .na-teaser{grid-template-columns:1fr;gap:0;padding:24px;margin-top:28px}
 body.dhd #main .na-teaser-art{grid-row:1;max-width:360px}
 body.dhd #main .na-teaser h2{font-size:29px}
}
@media(prefers-reduced-motion:reduce){body.dhd #main .nutrient-atlas *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){body.dhd #main .nutrient-atlas{--na-ink:CanvasText;--na-muted:CanvasText;--na-gold:LinkText;--na-line:CanvasText}body.dhd #main .nutrient-atlas :is(.na-panel,.na-teaser,.na-tabs a){background:Canvas;color:CanvasText;box-shadow:none}}
@media print{body.dhd #main .nutrient-atlas{--na-ink:#111;--na-muted:#222;--na-gold:#42371e;--na-line:#777}body.dhd #main .na-panel[hidden]{display:grid}body.dhd #main .nutrient-atlas :is(.na-panel,.na-teaser){background:#fff;backdrop-filter:none;box-shadow:none;break-inside:avoid}body.dhd #main .nutrient-atlas :is(.na-navigation,.na-tabs){display:none}}
