/* ===== STUDIOS ===== */
.s-hero{position:relative;min-height:100svh;display:flex;align-items:flex-start;overflow:hidden;padding:calc(var(--nav-h) + clamp(50px,6vw,90px)) 0 34svh;background:var(--void)}
.sun{position:absolute;left:50%;top:calc(100% - 26svh);width:150vw;height:150vw;margin-left:-75vw;pointer-events:none;will-change:transform}
.sun-core{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at var(--lx,50%) var(--ly,12%),#FFD2BF 0%,#FF8A5E 12%,var(--signal) 26%,#C2441C 48%,#4A1A0A 72%,#140806 100%);
  box-shadow:0 -40px 160px 20px rgba(255,106,61,.35),0 -10px 60px rgba(255,106,61,.4)}
.sun-rings i{position:absolute;border-radius:50%;border:1px solid rgba(255,106,61,.18);animation:ripple 6s var(--ease) infinite}
.sun-rings i{inset:-4%}.sun-rings i:nth-child(2){inset:-9%;animation-delay:2s}.sun-rings i:nth-child(3){inset:-15%;animation-delay:4s}
@keyframes ripple{0%{opacity:0;transform:scale(.98)}30%{opacity:1}100%{opacity:0;transform:scale(1.04)}}
.s-hero-inner{position:relative;z-index:1}
.s-title{margin:24px 0 40px;max-width:14ch;font-size:clamp(2.8rem,8.2vw,9rem)}
.s-title .serif{color:var(--signal)}
.s-hero-foot{display:flex;justify-content:space-between;align-items:end;gap:40px;flex-wrap:wrap}
.s-hero-foot .lede{color:#B5B2AB}

/* diptych */
.diptych{padding:clamp(100px,12vw,180px) 0 clamp(80px,9vw,130px)}
.dip{display:grid;grid-template-columns:1fr 1fr;margin:40px 0 clamp(40px,5vw,70px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dip>div{padding:clamp(40px,6vw,90px) var(--gutter);display:flex;flex-direction:column;gap:30px;min-height:52vh;justify-content:space-between}
.dip p{margin:0;font-size:clamp(2rem,4.2vw,4.4rem);font-weight:600;letter-spacing:-.05em;line-height:.98}
.dip-l{color:var(--mute-2);border-right:1px solid var(--line)}
.dip-l .mono{color:var(--mute-2)}
.dip-r{background:linear-gradient(180deg,rgba(255,106,61,.08),rgba(255,106,61,0));}
.dip-r .mono{color:var(--signal)}
.dip-r .serif{color:var(--signal)}
.dip-foot{font-size:clamp(1.15rem,1.6vw,1.5rem);color:var(--text);max-width:30em;margin-left:auto}

/* stairs */
.stairs{padding:0 0 clamp(100px,12vw,170px)}
.stair-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);align-items:end;height:min(92vh,860px);gap:0;border-bottom:1px solid var(--line-2)}
.stair-row li{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.step-top{padding:0 22px 22px 22px}
.step-top h3{font-size:clamp(2rem,4vw,4rem);font-weight:600;letter-spacing:-.05em;margin:10px 0 12px;line-height:1}
.step-top p{margin:0;color:var(--mute);font-size:15px;max-width:22em}
.riser{position:relative;height:0;background:linear-gradient(180deg,rgba(255,106,61,.2),rgba(255,106,61,.03));border-top:2px solid var(--signal);border-left:1px solid rgba(255,106,61,.2);transition:height 1.4s var(--ease)}
.stair-row.in li .riser{height:var(--h)}
.stair-row.in li:nth-child(2) .riser{transition-delay:.15s}.stair-row.in li:nth-child(3) .riser{transition-delay:.3s}.stair-row.in li:nth-child(4) .riser{transition-delay:.45s}
.stair-row li:last-child .riser{background:linear-gradient(180deg,var(--signal),rgba(255,106,61,.25))}
.flag{position:absolute;top:-2px;right:0;width:2px;height:70px;background:var(--text);transform:translateY(-100%)}
.flag::after{content:"";position:absolute;left:2px;top:0;width:36px;height:24px;background:var(--text);clip-path:polygon(0 0,100% 50%,0 100%)}

/* term */
.loop-sec{padding:clamp(100px,12vw,170px) 0;background:var(--ink);border-top:1px solid var(--line)}
.loop-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,100px);align-items:center}
.loop-grid .serif{color:var(--signal)}
.term{border-radius:18px;background:#0B0B0A;border:1px solid var(--line-2);font-family:var(--f-mono);overflow:hidden;box-shadow:0 50px 100px -50px rgba(0,0,0,.8)}
.term-bar{display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid var(--line)}
.term-bar .mono{flex:1;color:var(--mute);text-transform:none;letter-spacing:.02em}
.chip i{background:#58D68D!important;box-shadow:0 0 8px #58D68D}
.term-body{list-style:none;margin:0;padding:12px 0}
.term-body li{display:grid;grid-template-columns:44px 1fr auto;grid-template-rows:auto auto;column-gap:14px;padding:14px 22px;border-left:2px solid transparent;opacity:.35;transition:opacity .4s,background .4s,border-color .4s}
.t-n{grid-row:1/3;color:var(--mute-2);font-size:12px;padding-top:4px}
.t-main{font-family:var(--f-sans);font-size:clamp(1.05rem,1.5vw,1.3rem);font-weight:560;letter-spacing:-.02em}
.t-sub{grid-column:2;font-size:12.5px;color:var(--mute)}
.t-tag{grid-row:1/3;grid-column:3;align-self:center;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:6px;border:1px solid var(--line-2);color:var(--mute)}
.term-body li.on{opacity:1;background:rgba(255,106,61,.06);border-left-color:var(--signal)}
.term-body li.on .t-tag{background:var(--signal);border-color:var(--signal);color:var(--void)}
.term-body li.done{opacity:.8}
.term-body li.done .t-tag::before{content:"✓ "}
.term-foot{display:flex;align-items:center;gap:12px;padding:16px 22px;border-top:1px dashed var(--line-2);font-size:12.5px;color:var(--mute)}
.ret{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--signal);color:var(--void);font-size:15px;animation:spin 3s linear infinite}
@keyframes spin{to{transform:rotate(-360deg)}}

/* in-house */
.inhouse{padding:clamp(110px,13vw,190px) 0;border-radius:32px 32px 0 0}
.inhouse h2{margin:26px 0 clamp(50px,6vw,90px);max-width:14ch}
.inhouse .serif{color:var(--signal-ink)}
.handoff{position:relative;display:flex;align-items:center;justify-content:center;gap:0;height:160px;margin-bottom:clamp(50px,6vw,90px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ho{padding:16px 22px;border-radius:14px;border:1px solid rgba(19,19,17,.25);font-weight:500;font-size:clamp(.95rem,1.4vw,1.2rem);background:#fff;transition:transform 1s var(--ease),opacity .6s}
.ho-line{width:clamp(60px,16vw,240px);height:2px;background:repeating-linear-gradient(90deg,var(--ink) 0 6px,transparent 6px 12px);transition:opacity .5s}
.ho-x{position:absolute;left:50%;top:50%;width:clamp(200px,42vw,640px);height:3px;margin-left:calc(clamp(200px,42vw,640px) / -2);background:var(--signal);transform:rotate(-8deg) scaleX(0);transition:transform .7s var(--ease) .6s}
.ho-one{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;padding:18px 30px;border-radius:99px;background:var(--ink);color:var(--paper);font-weight:600;font-size:clamp(1.1rem,1.8vw,1.6rem);letter-spacing:-.02em;transition:all .8s var(--ease) 1.8s;box-shadow:0 0 0 8px rgba(255,106,61,.2)}
.ho-one::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--signal);margin-right:12px;vertical-align:.1em}
.handoff.in .ho-x{transform:rotate(-8deg) scaleX(1)}
.handoff.in .ho.a{transform:translateX(40%);opacity:0;transition-delay:1.4s}
.handoff.in .ho.b{transform:translateX(-40%);opacity:0;transition-delay:1.4s}
.handoff.in .ho-line{opacity:0;transition-delay:1.4s}
.handoff.in .ho-x{animation:xout .4s 1.4s forwards}
@keyframes xout{to{opacity:0}}
.handoff.in .ho-one{transform:translate(-50%,-50%) scale(1);opacity:1}
.ih-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,100px)}
.ih-points{list-style:none;margin:0;padding:0}
.ih-points li{display:grid;grid-template-columns:48px 1fr;padding:18px 0;border-top:1px solid var(--line);font-size:clamp(1.05rem,1.4vw,1.25rem);font-weight:500;letter-spacing:-.02em}
.ih-points .num{padding-top:.3em}

/* fork */
.fork{padding:clamp(110px,13vw,190px) 0}
.fork-title{text-align:center;margin:0 auto 40px;max-width:14ch}
.fork-title .serif{color:var(--signal)}
.fork-vis{position:relative;height:clamp(140px,22vw,300px);margin-top:110px}
.fork-vis>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fork-vis>svg path{fill:none;stroke:var(--line-2);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}
.fork-vis.in>svg path{stroke:var(--signal);animation:drawp 1.6s var(--ease) forwards}
.fork-vis>svg path:nth-child(2){animation-delay:.5s!important}
@keyframes drawp{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.f-node{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);display:grid;place-items:center;width:110px;height:64px;border-radius:99px;background:var(--ink-2);border:1px solid var(--line-2)}
.f-node svg{height:22px;width:44px}
.f-node .wm{fill:var(--text)}.f-node .dot{fill:var(--signal)}
.fork-ends{display:grid;grid-template-columns:1fr 1fr;text-align:center}
.fe{display:flex;flex-direction:column;align-items:center;gap:12px;padding:28px 20px 0}
.fe b{font-size:clamp(1.4rem,2.6vw,2.4rem);font-weight:600;letter-spacing:-.04em;line-height:1.05;max-width:12ch}
.fe .mono{color:var(--mute)}
.fe-hot .mono{color:var(--signal)}
.fork-foot{display:flex;justify-content:space-between;align-items:end;gap:40px;flex-wrap:wrap;margin-top:clamp(70px,8vw,120px);padding-top:36px;border-top:1px solid var(--line)}

@media (max-width:980px){
  .sun{top:calc(100% - 20svh);width:220vw;height:220vw;margin-left:-110vw}
  .dip{grid-template-columns:1fr}
  .dip>div{min-height:0}
  .dip-l{border-right:0;border-bottom:1px solid var(--line)}
  .stair-row{grid-template-columns:1fr 1fr;height:auto;gap:40px 0;border-bottom:0}
  .stair-row li{height:auto}
  .riser{height:24px!important;margin-top:10px}
  .flag{display:none}
  .loop-grid,.ih-grid{grid-template-columns:1fr}
  .handoff{flex-direction:column;height:auto;padding:40px 0;gap:14px}
  .ho-line{width:2px;height:40px;background:repeating-linear-gradient(180deg,var(--ink) 0 6px,transparent 6px 12px)}
}
@media (max-width:560px){
  .stair-row{grid-template-columns:1fr}
  .term-body li{grid-template-columns:32px 1fr;padding:12px 16px}
  .t-tag{grid-row:auto;grid-column:2;justify-self:start;margin-top:8px}
  .fork-ends{grid-template-columns:1fr}
}
