/* Nutrient material chapter. Isolated from the completed sports story. */
#inside.material-story{position:relative;height:650svh;background:#080604;color:#f4ebd6;isolation:isolate}
#inside .material-stage{position:sticky;top:0;height:100svh;min-height:480px;overflow:hidden;background:#080604}
#inside .material-canvas{position:absolute;inset:0;width:100%;height:100%}
#inside .material-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#08060455,transparent 28%,transparent 58%,#080604c9),radial-gradient(ellipse,transparent 45%,#08060466)}
#inside .material-eyebrow{position:absolute;top:15%;left:6%;font-size:10px;letter-spacing:.23em;opacity:0}
#inside .material-words{position:absolute;inset:0;perspective:1000px;pointer-events:none}
#inside .material-word{position:absolute;left:50%;top:43%;width:90%;text-align:center;opacity:0;font:800 clamp(60px,9vw,146px)/1 Display,Impact,sans-serif;letter-spacing:-.025em;transform-origin:50% 80%;will-change:transform,opacity,filter;text-shadow:0 12px 32px #170b06b3}
#inside .jaggery{font-size:clamp(58px,8vw,126px);letter-spacing:.025em;color:#efd2a0;text-shadow:0 2px 1px #78502b,0 12px 32px #170b06b3}
#inside .whey{font-size:clamp(52px,8.7vw,132px);background:linear-gradient(160deg,#fff2c1 8%,#be934d 36%,#f8df98 47%,#9f713d 66%,#f6d488 90%);background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 3px 1px #53351f) drop-shadow(0 15px 24px #16080499)}
#inside .cocoa{letter-spacing:.015em;color:#b87d55;text-shadow:0 1px 0 #f1c897,0 3px 2px #32150b,0 0 28px #edb57d45}
#inside .nutrients{color:#d6f66b;letter-spacing:.015em}
#inside .material-final{position:absolute;inset:0;pointer-events:none}
#inside .material-graph{position:absolute;width:min(84%,1100px);height:220px;left:50%;bottom:22%;transform:translateX(-50%)}
#inside .material-arrow{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#inside .arrow-line{fill:none;stroke:url(#material-gradient);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
#inside .arrow-head{fill:none;stroke:#ee9a48;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
#inside .material-badge{position:absolute;left:20%;top:54.545%;width:78px;height:78px;transform:translate(-50%,-50%);opacity:0}
#inside .material-badge:nth-of-type(2){left:53%;top:29.545%}
#inside .material-badge:nth-of-type(3){left:82%;top:36.364%}
#inside .material-badge svg{width:100%;height:100%;overflow:visible;fill:#153d2ee8;stroke:#f3e7c8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 8px 18px #160b0860)}
#inside .material-badge svg path{fill:none}
#inside .badge-ring{stroke:#d6f66b;stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1}
#inside .material-badge span{position:absolute;top:calc(100% + 17px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:clamp(13px,1.3vw,18px);font-weight:600;letter-spacing:-.025em;text-shadow:0 2px 10px #000}
#inside .material-fine{position:absolute;bottom:7%;left:50%;transform:translateX(-50%);width:min(670px,82%);font-size:11px;line-height:1.65;text-align:center;color:#f0e7d5;opacity:0;text-shadow:0 1px 8px #080604}
#inside .material-progress{position:absolute;left:6%;right:6%;bottom:3.5%;height:1px;background:#eee4c61a;opacity:0}
#inside .material-progress span{display:block;height:1px;background:#c9e881;transform-origin:left}
#inside .material-cue{position:absolute;bottom:7%;left:6%;font-size:9px;letter-spacing:.2em;opacity:0}
#inside .material-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.material-handoff{position:fixed;inset:0;pointer-events:none;background:#080604;z-index:110;opacity:0;visibility:hidden}
#inside .material-nojs{position:relative;padding:25vh 8%;font-size:24px;background:#080604}
@media(max-width:700px) and (orientation:portrait){
 #inside .material-stage{min-height:560px}
 #inside .material-eyebrow{top:17%;font-size:9px}
 #inside .material-word{top:42%;font-size:15vw;width:94%}
 #inside .jaggery{font-size:11.5vw}
 #inside .whey{font-size:13vw;max-width:85%}
 #inside .cocoa{font-size:17vw}
 #inside .material-graph{width:90%;height:300px;bottom:20%}
 #inside .material-badge{left:22.222%;top:18.75%;width:58px;height:58px}
 #inside .material-badge:nth-of-type(2){left:69.444%;top:45.833%}
 #inside .material-badge:nth-of-type(3){left:27.778%;top:75%}
 #inside .material-badge span{font-size:12px;top:calc(100% + 8px)}
 #inside .material-fine{bottom:7%;font-size:10px;width:86%;line-height:1.55}
 #inside .material-cue{bottom:7%;font-size:8px}
}
@media(max-height:550px) and (min-width:701px){
 #inside .material-stage{min-height:360px}
 #inside .material-graph{height:140px;bottom:25%}
 #inside .material-badge{width:55px;height:55px}
 #inside .material-badge span{top:calc(100% + 8px);font-size:12px}
 #inside .material-fine{font-size:10px;bottom:6%}
}
/* Static, fully readable narrative for LESS MOTION and system preference. */
#inside.material-reduced{height:auto}
#inside.material-reduced .material-stage{height:auto;min-height:0;position:relative}
#inside.material-reduced .material-canvas,#inside.material-reduced .material-vignette,#inside.material-reduced .material-progress,#inside.material-reduced .material-cue,#inside.material-reduced .material-eyebrow{display:none}
#inside.material-reduced .material-words{position:relative;inset:auto;min-height:75svh;padding:100px 6% 70px;display:flex;flex-direction:column;justify-content:center;gap:28px;background:linear-gradient(#08060488,#08060488),url('../media/v3-418abd3b46b245f3/assets/inside/keyframe-1.webp') center/cover;perspective:none}
#inside.material-reduced .material-word{position:relative;inset:auto;width:100%;max-width:none;opacity:1!important;transform:none!important;filter:none!important;mask-image:none!important;font-size:clamp(32px,6vw,70px)}
#inside.material-reduced .material-final{position:relative;min-height:85svh;background:linear-gradient(transparent,#080604dd),url('../media/v3-418abd3b46b245f3/assets/inside/keyframe-2.webp') center/cover}
#inside.material-reduced .material-badge,#inside.material-reduced .material-fine,#inside.material-reduced .arrow-head{opacity:1!important}
#inside.material-reduced .badge-ring,#inside.material-reduced .arrow-line{stroke-dashoffset:0!important}
