/* ═══ SECTION 7 — PRODUCTION STRIP ═══ */
.production{position:relative;background:var(--bg);border-top:1px solid var(--border)}
.prod-sticky{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;
  display:grid;grid-template-columns:minmax(280px,30vw) 1fr;align-items:center;padding-top:var(--nav-h)}
@media(max-width:900px){
  .production{height:auto!important}
  .prod-sticky{position:static;height:auto;min-height:0;grid-template-columns:1fr;
    padding:clamp(64px,10vh,100px) 0 clamp(56px,9vh,90px);gap:28px}
}
.prod-copy{padding:0 clamp(20px,3vw,44px) 0 var(--gut);position:relative;z-index:3}
.prod-copy .eyebrow{display:flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.2em;
  font-weight:600;color:var(--dim);margin-bottom:22px}
.prod-copy .eyebrow::before{content:"";width:7px;height:7px;background:var(--cut);flex-shrink:0}
.prod-copy h2{font-family:'Archivo Expanded',Archivo,sans-serif;font-weight:900;
  font-size:clamp(1.7rem,3.6vw,3.1rem);line-height:.98;letter-spacing:-.03em}
.prod-copy p{margin-top:20px;font-size:clamp(.92rem,1.02vw,1.02rem);line-height:1.65;color:var(--muted);max-width:34ch}
.prod-copy .rule{margin-top:26px;width:64px;height:2px;background:var(--cut)}
@media(max-width:900px){.prod-copy{padding:0 var(--gut)}}
.prod-viewport{overflow:hidden;height:100%;display:flex;align-items:center}
@media(max-width:900px){
  .prod-viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;padding:0 var(--gut)}
  .prod-viewport::-webkit-scrollbar{display:none}
}
.prod-track{display:flex;gap:clamp(14px,1.8vw,26px);align-items:center;
  padding-right:clamp(20px,6vw,120px);will-change:transform}
@media(max-width:900px){.prod-track{padding-right:var(--gut)}}
.frame{position:relative;flex-shrink:0;background:var(--surface-alt);overflow:hidden;
  height:clamp(280px,54vh,520px);scroll-snap-align:center}
.frame img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.4) brightness(.8)}
.frame.wide{aspect-ratio:16/9}
.frame.tall{aspect-ratio:3/4}
.frame.square{aspect-ratio:1}
.frame .ph{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;
  background:repeating-linear-gradient(36.5deg,#141414 0 12px,#111 12px 24px)}
.frame .ph span{font-size:10.5px;letter-spacing:.16em;font-weight:600;color:var(--dim);line-height:1.7}
.frame .idx{position:absolute;left:14px;top:12px;z-index:2;font-size:10.5px;letter-spacing:.14em;font-weight:700;color:var(--muted)}
.frame .cap{position:absolute;left:14px;right:14px;bottom:12px;z-index:2;font-size:11px;color:var(--text);
  text-shadow:0 1px 12px rgba(0,0,0,.9)}
.frame.slot{border:1px solid rgba(200,255,0,.32)}
.frame.slot .ph{background:radial-gradient(90% 80% at 50% 45%,#1c1c17 0%,#101010 70%)}
/* frame 01 — production video, same treatment as the photo frames; sits over the .ph fallback */
.frame .prod-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  filter:grayscale(.4) brightness(.8)}
/* soft dark fade at the bottom so the lime caption stays readable over the footage */
.frame.slot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;z-index:2;pointer-events:none;
  background:linear-gradient(to top,rgba(10,10,10,.75),transparent)}
.slot-note{position:absolute;left:0;right:0;bottom:14px;z-index:3;text-align:center;
  font-size:10px;letter-spacing:.16em;color:var(--cut);font-weight:600}
.frame.stats{background:var(--surface);display:grid;align-content:center;gap:22px;
  padding:clamp(24px,3vw,44px);width:clamp(260px,26vw,380px);aspect-ratio:auto}
.stat b{display:block;font-family:'Archivo Expanded',Archivo,sans-serif;font-weight:900;
  font-size:clamp(1.8rem,3.2vw,2.9rem);line-height:1;letter-spacing:-.03em}
.stat i{display:block;font-style:normal;font-size:10.5px;letter-spacing:.16em;color:var(--dim);margin-top:8px}
.stat + .stat{border-top:1px solid var(--border);padding-top:20px}
.prod-progress{position:absolute;left:var(--gut);right:var(--gut);bottom:clamp(22px,4vh,40px);
  height:1px;background:var(--border);z-index:4}
.prod-progress i{display:block;height:100%;width:0;background:var(--cut)}
@media(max-width:900px){.prod-progress{display:none}}

@media(prefers-reduced-motion:reduce){
  .production{height:auto!important}
  .prod-sticky{position:static;height:auto;grid-template-columns:1fr;padding:80px 0}
  .prod-viewport{overflow-x:auto}
  .prod-track{transform:none!important}
}
