/* v3 · quiet depth + After dusk */
.tt3d{position:absolute;display:block;pointer-events:none}
.lb .tt3d{display:none}

/* After dusk: a pinned section; scrolling turns the stepping-stone path from day to night */
.dusk{height:280vh}
.dusk-pin{position:sticky;top:0;height:100vh;height:100svh;display:grid;grid-template-rows:auto 1fr;gap:clamp(18px,2.4vw,32px);padding:clamp(48px,6vw,88px) var(--m) var(--m);max-width:1480px;margin:0 auto}
.dusk-head{display:grid;grid-template-columns:1fr minmax(0,360px);align-items:end;gap:24px}
.dusk-head .num-lab{margin-bottom:18px}
.dusk-head h2{font-size:clamp(36px,5vw,80px)}
.dusk-side{color:var(--smoke);max-width:36ch}
.dusk-ph{min-height:0;margin:0}
.dusk-ph img{position:absolute;inset:0;transform:scale(calc(1 + var(--dk,0) * .08));transform-origin:50% 50%}
.dusk-ph .dusk-night{opacity:var(--dkm,0)}
.dusk-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(40,33,28,.5))}
.dusk-scale{position:absolute;left:20px;right:20px;bottom:18px;z-index:2;display:flex;align-items:center;gap:14px;color:var(--lime);font-size:13px}
.dusk-scale i{flex:1;height:1px;background:rgba(248,244,237,.35);position:relative}
.dusk-scale b{position:absolute;left:0;top:0;height:1px;width:calc(var(--dk,0) * 100%);background:var(--lime)}
.dusk-scale span:last-child{opacity:calc(.5 + var(--dkm,0) * .5)}
.dusk-scale span:first-child{opacity:calc(1 - var(--dkm,0) * .5)}
@media (max-width:760px){
  .dusk{height:240vh}
  .dusk-head{grid-template-columns:1fr}
  .dusk-side{font-size:15px}
}
@media (prefers-reduced-motion:reduce){.dusk-ph img{transform:none}}
