/* deckhaus — selected pieces, as a stage.
   Paper section, so depth is carried by scale, soft shadow and a hairline —
   never by a heavy drop shadow. One accent gesture: the lime index. */

.csheet--stage{position:relative;perspective:1300px;perspective-origin:50% 38%}
.csheet--stage figure{position:absolute;left:var(--x);top:var(--y);width:var(--w);margin:0;z-index:var(--z,2);cursor:pointer;transform-style:preserve-3d;will-change:transform;transform:none;transition:filter .34s cubic-bezier(.16,1,.3,1),opacity .34s cubic-bezier(.16,1,.3,1)}
.csheet--stage figure .fr{display:block;position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;border:1px solid var(--border-default);background:var(--surface-card);box-shadow:0 1px 2px rgba(10,10,11,.05),0 18px 40px -22px rgba(10,10,11,.34);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1),border-color .5s cubic-bezier(.16,1,.3,1)}
.csheet--stage figure .fr::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.csheet--stage figure img{display:block;width:100%;height:100%;object-fit:cover;opacity:var(--o,1);transform:none;transition:opacity .34s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)}
.csheet--stage figure{gap:9px}
.csheet--stage figcaption{display:flex;align-items:baseline;gap:11px;margin-top:0;line-height:1.2;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.csheet--stage figcaption b{color:var(--text-accent);font-weight:400;font-variant-numeric:tabular-nums}
.csheet--stage figcaption span{display:flex;flex-direction:column;gap:5px;color:var(--text-primary)}
.csheet--stage figcaption>span{font-family:var(--font-sans);font-size:15px;letter-spacing:0;text-transform:none;line-height:1.25}
.csheet--stage figcaption em{margin-top:0;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);line-height:1.2}
.csheet--stage figcaption em{font-style:normal;color:var(--text-muted)}

.csheet--stage:hover figure{opacity:.5}
.csheet--stage:hover figure:hover,.csheet--stage figure:focus-visible{opacity:1;z-index:30}
.csheet--stage:hover figure:hover .fr,.csheet--stage figure:focus-visible .fr{filter:none}
#view-sit .csheet--stage figure:hover .fr,#view-sit .csheet--stage figure:focus-visible .fr,#view-work .csheet--stage figure:hover .fr,#view-work .csheet--stage figure:focus-visible .fr{transform:translateZ(60px) scale(1.035);border-color:rgba(183,201,74,.7);box-shadow:0 2px 4px rgba(10,10,11,.06),0 40px 80px -28px rgba(10,10,11,.42)}
.csheet--stage figure:hover img,.csheet--stage figure:focus-visible img{opacity:1}
.csheet--stage figure:focus-visible{outline:none}
.csheet--stage figure:focus-visible .fr{box-shadow:var(--ring-focus),0 44px 90px -30px rgba(10,10,11,.5)}

.csheet--stage figure .fr::before{content:"Open";position:absolute;z-index:2;right:10px;top:10px;padding:6px 10px;border-radius:6px;background:rgba(10,10,11,.82);color:var(--paper);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;opacity:0;transform:translateY(-4px);transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.csheet--stage figure:hover .fr::before,.csheet--stage figure:focus-visible .fr::before{opacity:1;transform:none}

@keyframes st-float{from{translate:0 0}to{translate:0 -9px}}
.csheet--stage figure{animation:st-float var(--fd,10s) ease-in-out var(--fdl,0s) infinite alternate}
.csheet--stage:hover figure{animation-play-state:paused}

.csheet-hint{display:flex;align-items:center;gap:10px;margin-top:16px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted)}
.csheet-hint i{display:block;width:20px;height:1px;background:var(--lime-text);font-style:normal}
/* v6-inner.css hides .csheet .fr until v6-motion adds .min; the stage opts out
   of that scroll parallax, so it owns its own reveal and must be visible. */
#view-sit .csheet--stage .fr,#view-work .csheet--stage .fr{opacity:1;transform:none}
#view-sit .csheet--stage .fr img,#view-work .csheet--stage .fr img{height:100%;margin-top:0}
#view-sit .csheet--stage .fr,#view-work .csheet--stage .fr{aspect-ratio:16/9}

/* ---------- open: the piece becomes the page ---------- */
.wlift{position:fixed;inset:0;z-index:380;display:flex;align-items:center;justify-content:center;padding:clamp(20px,5vw,72px);background:rgba(8,8,10,.94);opacity:0;transition:opacity .3s ease}
.wlift[hidden]{display:none}
.wlift.on{opacity:1}
.wlift figure{margin:0;max-width:min(1180px,92vw);display:flex;flex-direction:column;gap:16px;will-change:transform}
.wlift img{display:block;width:100%;max-height:78vh;object-fit:contain;border-radius:10px;border:1px solid rgba(244,244,239,.18);box-shadow:0 80px 160px -60px rgba(0,0,0,1);background:#0A0A0B}
.wlift figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#9A9AA4}
.wlift figcaption b{color:var(--paper);font-weight:400}
.wlift__x{position:absolute;top:clamp(14px,2vw,26px);right:clamp(14px,2vw,26px);appearance:none;background:transparent;border:1px solid rgba(244,244,239,.24);color:var(--paper);border-radius:8px;padding:9px 15px;font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.wlift__x:hover{background:rgba(244,244,239,.08);border-color:rgba(183,201,74,.6)}
.wlift__x:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.wlift__nav{position:absolute;bottom:clamp(14px,2vw,26px);left:50%;transform:translateX(-50%);display:flex;gap:10px}
.wlift__nav button{appearance:none;background:transparent;border:1px solid rgba(244,244,239,.24);color:var(--paper);border-radius:8px;width:44px;height:44px;font-size:16px;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.wlift__nav button:hover{background:rgba(244,244,239,.08);border-color:rgba(183,201,74,.6)}
.wlift__nav button:focus-visible{outline:none;box-shadow:var(--ring-focus)}

/* ---------- below the depth breakpoint: an honest grid ---------- */
@media (max-width:1100px){
  .csheet-hint{display:none}
  .csheet--stage{height:auto!important;display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,28px);perspective:none}
  .csheet--stage figure{position:static;width:auto;transform:none!important;opacity:1!important;animation:none!important;translate:none!important}
  .csheet--stage figure .fr{filter:none!important}
  .csheet--stage figure img{opacity:1}
  .csheet--stage:hover figure{opacity:1}
  #view-sit .csheet--stage figure:hover .fr,#view-work .csheet--stage figure:hover .fr{transform:none}
}
@media (max-width:600px){.csheet--stage{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
  .csheet--stage figure{animation:none;translate:none}
  .csheet--stage figure,.csheet--stage .fr,.csheet--stage img{transition:none}
  .csheet--stage:hover figure{opacity:1}
  .csheet--stage:hover figure .fr{filter:none}
  .wlift{transition:none}
}

/* ---------- the price rides the cursor ---------- */
.pcur{position:fixed;left:0;top:0;z-index:340;pointer-events:none;display:flex;flex-direction:column;gap:5px;padding:13px 16px;margin:18px 0 0 18px;border-radius:8px;background:var(--ink-900);border:1px solid rgba(244,244,239,.16);box-shadow:0 22px 48px -20px rgba(10,10,11,.6);opacity:0;scale:.92;transition:opacity .16s ease,scale .24s cubic-bezier(.16,1,.3,1);transform-origin:0 0;will-change:transform}
.pcur.on{opacity:1;scale:1}
.pcur b{font-family:var(--font-display);font-weight:400;font-size:26px;line-height:1;letter-spacing:0;color:var(--lime-500);font-variant-numeric:tabular-nums}
.pcur span{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-100);white-space:nowrap}
#stList .drow{transition:color .2s ease}
@media (hover:hover) and (min-width:1101px){
  #stList .drow[data-price]{cursor:none}
  #stList:hover .drow{opacity:.45;transition:opacity .22s ease}
  #stList:hover .drow:hover{opacity:1}
  #stList .drow:hover .n{color:var(--text-accent)}
}
@media (max-width:1100px){.pcur{display:none}}
@media (prefers-reduced-motion:reduce){.pcur{transition:none}#stList:hover .drow{opacity:1}}

/* ============ situation page: covers behind the masthead ============ */
.ihead--covers{position:relative;overflow:hidden}
.ihead--covers>.wrap{position:relative;z-index:3}
.sfield{opacity:.5}
.sfield figure{transform:none}
.sfield img{aspect-ratio:16/9;object-fit:cover;border-radius:8px;border:1px solid rgba(244,244,239,.14);box-shadow:0 34px 76px -34px rgba(0,0,0,.9)}
.ihead--covers::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(104deg,#08080A 30%,rgba(8,8,10,.9) 52%,rgba(8,8,10,.52) 78%,rgba(8,8,10,.7) 100%)}
@media (max-width:1100px){.sfield{opacity:.22}}
@media (max-width:760px){.sfield{display:none}.ihead--covers::after{background:rgba(8,8,10,.86)}}

/* ============ what it actually costs ============ */
.sprods{margin-top:clamp(24px,2.8vw,38px);border-top:1px solid var(--border-default)}
.sprods__k{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 4px;padding-top:18px}
.sprods__k em{font-style:normal;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.sprod{border-bottom:1px solid var(--border-subtle)}
.sprod__h{display:grid;grid-template-columns:34px 1fr auto 18px;align-items:baseline;gap:14px;width:100%;padding:17px 0;background:none;border:0;text-align:left;cursor:pointer;font:inherit;color:var(--text-primary)}
.sprod__h:focus-visible{outline:none;box-shadow:var(--ring-focus);border-radius:6px}
.sprod__h .n{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;color:var(--text-accent);font-variant-numeric:tabular-nums}
.sprod__h .nm{font-size:17px;line-height:1.3}
.sprod__h .pz{font-family:var(--font-mono);font-size:14px;letter-spacing:.04em;color:var(--text-primary);font-variant-numeric:tabular-nums}
.sprod__h .ar{position:relative;width:11px;height:11px;align-self:center}
.sprod__h .ar::before,.sprod__h .ar::after{content:"";position:absolute;background:var(--text-muted);transition:transform .3s cubic-bezier(.16,1,.3,1),opacity .3s ease}
.sprod__h .ar::before{left:0;top:5px;width:11px;height:1px}
.sprod__h .ar::after{left:5px;top:0;width:1px;height:11px}
.sprod.on .sprod__h .ar::after{transform:scaleY(0);opacity:0}
.sprod.on .sprod__h .nm{font-weight:700}
.sprod__h:hover .nm{color:var(--text-accent)}
.sprod__b{height:0;overflow:clip;transition:height .42s cubic-bezier(.16,1,.3,1)}
.sprod__b[inert]{visibility:hidden}
.sprod__b .sprod__k{display:block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);padding:0 0 10px 48px}
.sprod__b .sprod__k--ex{padding-top:14px}
.sprod__b ul{list-style:none;margin:0;padding:0 0 0 48px;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}
.sprod__b li{font-size:14.5px;line-height:1.45;color:var(--text-secondary);position:relative;padding-left:14px}
.sprod__b li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:1px;background:var(--lime-text)}
.sprod__b .exc li{color:var(--text-muted)}
.sprod__b .exc li::before{background:var(--border-strong)}
.sprod__go{margin:20px 0 22px 48px}
@media (max-width:640px){.sprod__b ul{grid-template-columns:1fr}.sprod__b ul,.sprod__b .sprod__k,.sprod__go{padding-left:0;margin-left:0}}

/* ============ the other five situations ============ */
.sitnav{margin-top:clamp(40px,5vw,72px);padding-top:clamp(20px,2.2vw,28px);border-top:1px solid var(--border-default)}
.sitnav__k{display:block;margin-bottom:16px}
.sitnav__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sitpill{display:flex;align-items:baseline;gap:12px;padding:15px 18px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--surface-card);text-decoration:none;color:var(--text-primary);transition:border-color .2s ease,transform .2s cubic-bezier(.16,1,.3,1),background .2s ease}
.sitpill .n{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--text-accent);font-variant-numeric:tabular-nums}
.sitpill .t{font-size:15.5px}
.sitpill:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.sitpill:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.sitpill.on{background:var(--ink-900);border-color:var(--ink-900);color:var(--paper);pointer-events:none}
.sitpill.on .n{color:var(--lime-500)}
@media (max-width:860px){.sitnav__row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.sitnav__row{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.sprod__b{transition:none}.sitpill{transition:none}}
.sprod__b>.in{min-height:0}
