/* deckhaus v1.2 — service pages (four doors) + lightbox. Builds on v12-case.css. */
.sv-hero .k-h1{font-size:clamp(56px,9.4vw,168px);max-width:12ch}
.sv-hero .k-sub{max-width:40ch}
.sv-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.sv-chips span{padding:8px 13px;border:1px solid rgba(244,244,239,.26);border-radius:99px;font-size:14px;color:rgba(244,244,239,.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(8,8,10,.18)}
.sv-num{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--lime-500)}
/* deliverables */
.sv-get{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border-default);border:1px solid var(--border-default);margin-top:clamp(40px,5vw,72px);border-radius:10px;overflow:hidden}
.sv-get>div{background:var(--sand-100);padding:clamp(22px,2.4vw,34px);display:flex;flex-direction:column;gap:12px;min-height:200px}
.sv-get b{font-family:var(--font-mono);font-weight:400;font-size:11px;letter-spacing:.16em;color:var(--lime-text)}
.sv-get h4{margin:0;font-family:var(--font-display);font-weight:400;font-size:clamp(22px,1.9vw,30px);line-height:1.1}
.sv-get p{margin:0;font-size:15.5px;line-height:1.55;color:var(--text-secondary)}
@media(max-width:900px){.sv-get{grid-template-columns:1fr 1fr}}@media(max-width:560px){.sv-get{grid-template-columns:1fr}}
/* covers wall */
.sv-covers{display:grid;grid-auto-flow:dense;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.2vw,20px);margin-top:clamp(40px,5vw,72px)}
.sv-covers figure{margin:0;cursor:zoom-in}
.sv-covers .ph{aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#141416;box-shadow:0 1px 0 rgba(255,255,255,.04),0 18px 40px -24px rgba(0,0,0,.6)}
.sv-covers img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.sv-covers figure:hover img{transform:scale(1.035)}
.sv-covers figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-size:15px;color:rgba(244,244,239,.9)}
.sv-covers figcaption span{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,244,239,.48);padding-top:3px}
.sv-covers .big{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column}.sv-covers .big .ph{flex:1;aspect-ratio:auto;min-height:0}
@media(max-width:900px){.sv-covers{grid-template-columns:1fr 1fr}.sv-covers .big{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column}.sv-covers .big .ph{flex:1;aspect-ratio:auto;min-height:0}}
@media(max-width:560px){.sv-covers{grid-template-columns:1fr}.sv-covers .big{grid-column:span 1}}
.sv-logos img[alt=Rolex]{max-height:58px}.sv-logos img[alt=TEDx]{max-height:28px}
/* clients */
.sv-clients{margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--k-line)}
.sv-logos{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;border-bottom:1px solid var(--k-line)}
.sv-logos div{height:110px;display:flex;align-items:center;justify-content:center;padding:0 18px;border-left:1px solid var(--k-line)}
.sv-logos div:first-child{border-left:0}
.sv-logos img{max-height:34px;max-width:100%;object-fit:contain;filter:invert(1) grayscale(1);opacity:.78}
.sv-names{display:flex;flex-wrap:wrap;gap:10px 28px;padding:26px 0 0;font-family:var(--font-display);font-size:clamp(22px,2.2vw,36px);line-height:1.2;color:rgba(244,244,239,.9)}
.sv-names span{white-space:nowrap}.sv-names span:after{content:'·';margin-left:28px;color:rgba(244,244,239,.3)}.sv-names span:last-child:after{content:''}
@media(max-width:900px){.sv-logos{grid-template-columns:repeat(4,1fr)}.sv-logos div{border-bottom:1px solid var(--k-line)}.sv-logos div:nth-child(4n+1){border-left:0}}
/* featured cases */
.sv-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);margin-top:clamp(40px,5vw,72px)}
.sv-cases.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-case{display:block;text-decoration:none;color:inherit}
.sv-case .ph{aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#141416;position:relative}
.sv-case .ph img,.sv-case .ph video{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.sv-case:hover .ph img,.sv-case:hover .ph video{transform:scale(1.03)}
.sv-case .row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-top:16px}
.sv-case h3{margin:0;font-family:var(--font-display);font-weight:400;font-size:clamp(26px,2.4vw,40px)}
.sv-case p{margin:6px 0 0;font-size:16px;line-height:1.5;color:var(--text-secondary);max-width:44ch}
.k-dark .sv-case p{color:rgba(244,244,239,.66)}
.sv-case .go{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--lime-text);white-space:nowrap}
.k-dark .sv-case .go{color:var(--lime-500)}
.sv-case .pill{position:absolute;left:12px;top:12px;padding:6px 10px;border-radius:99px;background:rgba(8,8,10,.6);color:#F4F4EF;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;backdrop-filter:blur(6px)}
@media(max-width:900px){.sv-cases,.sv-cases.three{grid-template-columns:1fr}}
/* process */
.sv-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,30px);margin-top:clamp(40px,5vw,72px)}
.sv-steps>div{border-top:1px solid var(--border-default);padding-top:22px}
.k-dark .sv-steps>div{border-color:var(--k-line)}
.sv-steps b{font-family:var(--font-display);font-weight:400;font-size:clamp(44px,4.6vw,72px);line-height:1;color:var(--lime-text);display:block}
.k-dark .sv-steps b{color:var(--lime-500)}
.sv-steps h4{margin:18px 0 0;font-size:19px}
.sv-steps p{margin:10px 0 0;font-size:15.5px;line-height:1.55;color:var(--text-secondary)}
.k-dark .sv-steps p{color:rgba(244,244,239,.66)}
@media(max-width:900px){.sv-steps{grid-template-columns:1fr 1fr}}@media(max-width:560px){.sv-steps{grid-template-columns:1fr}}
/* big film */
.sv-film{margin-top:clamp(36px,4vw,60px);border-radius:10px;overflow:hidden;background:#000;position:relative}
.sv-film video{width:100%;height:auto;display:block}
.sv-film-cap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:16px;color:rgba(244,244,239,.55)}
/* other doors */
.sv-doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.2vw,18px);margin-top:clamp(36px,4vw,56px)}
.sv-door{position:relative;display:block;aspect-ratio:4/5;border-radius:10px;overflow:hidden;color:#F4F4EF;text-decoration:none;background:#111}
.sv-door video,.sv-door img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78;transition:opacity .5s,transform 1.4s cubic-bezier(.16,1,.3,1)}
.sv-door:hover video,.sv-door:hover img{opacity:.95;transform:scale(1.03)}
.sv-door:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,10,0) 40%,rgba(8,8,10,.86))}
.sv-door .tx{position:absolute;left:22px;right:22px;bottom:20px;z-index:1}
.sv-door h3{margin:8px 0 0;font-family:var(--font-display);font-weight:400;font-size:clamp(26px,2.4vw,38px);line-height:1.04}
@media(max-width:900px){.sv-doors{grid-template-columns:1fr}.sv-door{aspect-ratio:16/10}}
/* lightbox */
[data-lb]{cursor:zoom-in}
.lb{position:fixed;inset:0;z-index:200;background:rgba(6,6,8,.94);display:none;align-items:center;justify-content:center;flex-direction:column;padding:clamp(16px,4vw,64px)}
.lb.on{display:flex;animation:lbIn .35s ease both}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lb img{max-width:min(1600px,100%);max-height:calc(100vh - 140px);object-fit:contain;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lb .cap{margin-top:18px;color:rgba(244,244,239,.75);font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-align:center}
.lb button{position:absolute;background:rgba(244,244,239,.08);border:1px solid rgba(244,244,239,.18);color:#F4F4EF;width:52px;height:52px;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb button:hover{background:rgba(244,244,239,.18)}
.lb .x{top:20px;right:20px}.lb .pv{left:20px;top:50%;transform:translateY(-50%)}.lb .nx{right:20px;top:50%;transform:translateY(-50%)}
@media(max-width:700px){.lb .pv,.lb .nx{top:auto;bottom:20px;transform:none}.lb .pv{left:calc(50% - 64px)}.lb .nx{right:calc(50% - 64px)}}
/* slide reel (case decks) */
.sv-deck{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.2vw,20px);margin-top:clamp(40px,5vw,72px)}
.sv-deck figure{margin:0;border-radius:8px;overflow:hidden;aspect-ratio:16/9;background:#141416;box-shadow:0 18px 40px -26px rgba(0,0,0,.55)}
.sv-deck figure.w{grid-column:span 2}
.sv-deck img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.sv-deck figure:hover img{transform:scale(1.02)}
@media(max-width:700px){.sv-deck{grid-template-columns:1fr}.sv-deck figure.w{grid-column:span 1}}

/* v1.2e — service hero: a floating collage of the work */
.sv-fhero{min-height:100vh;min-height:100svh;background:#08080A;overflow:hidden}
.sv-float{position:absolute;inset:0;overflow:hidden;z-index:0}
.sv-float .fl{position:absolute;inset:0}
.sv-float .ft{position:absolute;left:0;top:0;display:block;border-radius:6px;overflow:visible;will-change:transform;pointer-events:auto}
.sv-float .ft img,.sv-float .ft video{width:100%;display:block;border-radius:6px;box-shadow:0 30px 70px -30px rgba(0,0,0,.9);background:#141418;transition:transform .7s cubic-bezier(.16,1,.3,1),filter .5s;filter:brightness(.78) saturate(.92)}
.sv-float .ft:hover img,.sv-float .ft:hover video{transform:scale(1.04);filter:none}
.sv-float .ft span{position:absolute;left:0;top:calc(100% + 10px);font-family:var(--font-mono,ui-monospace);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,244,239,.0);transition:color .4s;white-space:nowrap}
.sv-float .ft:hover span{color:rgba(244,244,239,.75)}
.sv-fscrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(8,8,10,.94) 0%,rgba(8,8,10,.78) 32%,rgba(8,8,10,.15) 62%,rgba(8,8,10,0) 80%),linear-gradient(0deg,rgba(8,8,10,.9) 0%,rgba(8,8,10,0) 38%),linear-gradient(180deg,rgba(8,8,10,.7) 0%,rgba(8,8,10,0) 18%)!important}
.sv-fhero .in{position:relative;z-index:2;pointer-events:none}
.sv-fhero .in a,.sv-fhero .in .sv-chips{pointer-events:auto}
@media(max-width:820px){.sv-fscrim{background:linear-gradient(0deg,rgba(8,8,10,.96) 0%,rgba(8,8,10,.85) 45%,rgba(8,8,10,.2) 75%,rgba(8,8,10,.5) 100%)!important}}
