.foil-materials-section{--foil-gutter:clamp(24px,6vw,100px);--foil-card-width:clamp(208px,24vw,310px);position:relative;isolation:isolate;background:#e7e7e0;color:#152030}
.foil-materials-sticky{position:relative;z-index:1;background:#e7e7e0;padding:64px 0;display:flex;flex-direction:column;justify-content:center;gap:32px}
.foil-materials-section.is-scroll-linked .foil-materials-sticky{position:sticky;top:0;padding:clamp(24px,4svh,48px) 0}
.foil-materials-heading,.foil-materials-footer{margin-inline:var(--foil-gutter)}
.foil-materials-heading .eyebrow{color:#5a6e83}
.foil-materials-heading h2{font-size:clamp(44px,6.5vw,90px);line-height:1.04;letter-spacing:-.05em;margin-top:16px}
.foil-materials-heading h2 em{display:inline-block}
.foil-carousel{width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding-inline:var(--foil-gutter);touch-action:pan-x pan-y;outline-offset:-5px}
.foil-carousel::-webkit-scrollbar{display:none}
.foil-materials-track{list-style:none;display:flex;gap:clamp(16px,2.5vw,32px);width:max-content;padding:0;margin:0}
.foil-materials-track>li{flex:0 0 var(--foil-card-width);width:var(--foil-card-width)}
.foil-material-card{display:block;width:100%;padding:0;border:0;border-radius:0;background:none;color:inherit;text-align:left;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.foil-material-media{position:relative;display:block;aspect-ratio:10/13;overflow:hidden;background:#10141c}
.foil-material-media img,.foil-material-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.foil-material-media img{opacity:1}
.foil-material-media video{opacity:0;transition:opacity .24s ease-out}
.foil-material-card.is-playing video{opacity:1}
/* Keep the poster beneath the fading video; no flash through the empty background. */
.foil-preview-cue{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:7px;color:#eeeae2;background:#090e16d9;border:1px solid #ffffff24;border-radius:20px;padding:5px 9px;font-size:9px;letter-spacing:.04em;pointer-events:none}
.foil-preview-dot{width:5px;height:5px;border:1px solid currentColor;border-radius:50%}
.is-playing .foil-preview-dot{background:#c7e4cf;border-color:#c7e4cf}
.foil-material-caption{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:baseline;padding-top:14px}
.foil-material-number{font-size:9px;color:#69737b;letter-spacing:.06em}
.foil-material-name{font-size:15px;line-height:1.3;letter-spacing:-.02em}
.foil-materials-footer{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.foil-materials-position{display:flex;align-items:center;gap:16px;max-width:420px}
.foil-materials-count{font-size:10px;letter-spacing:.1em;white-space:nowrap;font-variant-numeric:tabular-nums}
.foil-materials-meter{height:1px;flex:1;background:#15203030;overflow:hidden}
.foil-materials-meter>span{display:block;height:100%;background:#152030;transform:scaleX(var(--foil-progress,.05));transform-origin:left}
.foil-materials-help{margin-top:10px;color:#5a6470;font-size:11px}
.foil-materials-nav{display:grid;grid-template-columns:repeat(2,44px);gap:8px;align-self:start}
.foil-materials-nav button{width:44px;height:44px;border:1px solid #15203040;background:transparent;color:#152030;font:20px/1 Arial,sans-serif;cursor:pointer}
.foil-materials-nav button:disabled{opacity:.25;cursor:default}
.foil-materials-section :focus-visible{outline:2px solid #152030;outline-offset:5px}
@media(max-width:700px){.foil-materials-section{--foil-card-width:min(70vw,34svh)}.foil-materials-sticky{gap:26px;padding:48px 0}.foil-materials-heading h2{font-size:46px;max-width:330px}.foil-materials-footer{gap:18px}.foil-material-name{font-size:14px}.foil-materials-help{max-width:210px}.foil-materials-track{gap:18px}}
@media(max-height:650px) and (min-width:701px){.foil-materials-section{--foil-card-width:min(24vw,31svh)}.foil-materials-heading h2{font-size:44px}.foil-materials-sticky{gap:20px}}
@media(prefers-reduced-motion:reduce){.foil-materials-sticky{position:static!important;height:auto!important}.foil-materials-section{height:auto!important}.foil-carousel{scroll-snap-type:x mandatory}.foil-materials-track>li{scroll-snap-align:start}.foil-material-media img,.foil-material-media video{transition:none}}

.foil-materials-actions{display:flex;align-items:center;gap:24px}.foil-materials-continue{font-size:11px;white-space:nowrap;padding:12px 0;border-bottom:1px solid #15203040}@media(max-width:700px){.foil-materials-actions{gap:16px}.foil-materials-footer{grid-template-columns:1fr}.foil-materials-actions{justify-content:space-between}.foil-carousel{scroll-snap-type:x proximity}.foil-materials-track>li{scroll-snap-align:start}}

.foil-materials-nav button,.foil-materials-continue{transition:background-color .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease}@media(hover:hover){.foil-materials-nav button:hover:enabled{background:#1520300b;border-color:#15203080}.foil-materials-continue:hover{border-color:#152030}}@media(prefers-reduced-motion:reduce){.foil-materials-nav button,.foil-materials-continue{transition:none}}

/* Decorative optical layers occupy the existing scroll runway, outside the card/control plane. */
.foil-depth{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.foil-depth-field{position:absolute;inset:auto -8% -24px;height:clamp(280px,42svh,520px);overflow:hidden;mask-image:linear-gradient(transparent,#000 24%,#000 90%,transparent)}
.foil-depth-layer{position:absolute;inset:-12%;width:124%;height:124%;transform-origin:center;mix-blend-mode:multiply}
.foil-depth-far{opacity:.3;transform:translate3d(calc((var(--foil-depth-progress,.5) - .5)*-32px),calc((var(--foil-depth-progress,.5) - .5)*16px),0) scale(1.13)}
.foil-depth-near{opacity:.78;transform:translate3d(calc((var(--foil-depth-progress,.5) - .5)*100px),calc((var(--foil-depth-progress,.5) - .5)*-48px),0)}
.foil-depth-shine{position:absolute;inset:-20% -40%;background:linear-gradient(112deg,transparent 24%,#ffffffa6 42%,#b7dce05e 47%,#e3bbd84a 53%,transparent 66%);mix-blend-mode:screen;transform:translate3d(calc((var(--foil-depth-progress,.5) - .5)*38%),0,0)}
@media(orientation:landscape){.foil-depth{display:none}}
@media(prefers-reduced-motion:reduce){.foil-depth-layer,.foil-depth-shine{transform:none}}

/* One visible navigation group sits beside the section label, above the films. */
.foil-materials-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 24px;}
.foil-materials-heading h2{grid-column:1/-1;margin-top:0;}
.foil-materials-nav{display:flex;gap:8px;align-self:center;}
.foil-materials-nav button{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:auto;min-width:50px;height:50px;padding:0 16px;border-color:#15203080;background:#f4f4ed;}
.foil-materials-nav button>span:not(.foil-nav-label){font-size:22px;}
.foil-nav-label{font:12px/1.2 Arial,Helvetica,sans-serif;}
.foil-materials-nav button:disabled{opacity:.35;}
.foil-materials-help{font-size:12px;line-height:1.5;}
@media(max-width:700px){
 .foil-materials-heading{gap:10px 12px;}
 .foil-materials-nav button{padding:0;width:50px;}
 .foil-nav-label{display:none;}
 .foil-materials-help{max-width:none;}
 .foil-materials-footer{grid-template-columns:minmax(0,1fr) auto;gap:16px;}
 .foil-materials-actions{justify-content:flex-end;}
}