/* =====================================================================
   Showdeck theme: light, editorial, with one 3D stage window.
   Type: Bricolage Grotesque (display), Instrument Serif (accent italics),
   Geist (text), Geist Mono (labels).
   ===================================================================== */
@view-transition { navigation: auto; }

:root{
  --bg:#F6F4FA; --paper:#FFFFFF; --tint:#EEE9F8; --tint2:#E5DDF6;
  --ink:#130A2B; --txt:#3D3657; --mut:#7A7194; --line:#E2DCEF; --line2:#D3CAE8;
  --vio:#6D28D9; --vio2:#8B5CF6; --pink:#D61F69; --stage:#0F0728; --stage2:#1E0F4A;
  --d:'Bricolage Grotesque',system-ui,sans-serif; --s:'Instrument Serif',Georgia,serif;
  --b:'Geist',system-ui,sans-serif; --m:'Geist Mono',ui-monospace,monospace;
  --r:28px; --r2:18px; --gut:clamp(18px,4vw,56px); --max:1320px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--txt);font:18px/1.6 var(--b);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--d);color:var(--ink);margin:0 0 .45em;font-weight:700;font-optical-sizing:auto}
h1{font-size:clamp(52px,9vw,140px);line-height:.9;letter-spacing:-.045em;font-weight:800}
h2{font-size:clamp(40px,6vw,88px);line-height:.95;letter-spacing:-.04em;font-weight:800}
h3{font-size:clamp(22px,2vw,28px);line-height:1.1;letter-spacing:-.02em}
h1 em,h2 em,h3 em,.em{font-family:var(--s);font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--vio)}
p{margin:0 0 1em}
::selection{background:var(--vio);color:#fff}
:focus-visible{outline:2px solid var(--vio);outline-offset:3px;border-radius:6px}
.k{display:block;font:500 13px/1.2 var(--m);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-bottom:22px}
.k b{color:var(--vio);font-weight:500}
.lede{font-size:clamp(19px,1.6vw,23px);line-height:1.5;color:var(--txt);max-width:44ch}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- nav ---------- */
header.site{position:fixed;top:0;left:0;right:0;z-index:50;padding:16px var(--gut);transition:background .35s,padding .35s,border-color .35s;border-bottom:1px solid transparent}
header.site.solid{background:rgba(246,244,250,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:10px var(--gut);border-bottom-color:var(--line)}
.nin{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{height:30px;width:auto}
.brand b{font:800 19px var(--d);letter-spacing:.06em}
.nl{display:flex;gap:2px;margin-left:auto;align-items:center}
.nl a,.nl .tools>button{font:500 15px var(--b);color:var(--txt);text-decoration:none;padding:9px 14px;border-radius:30px;background:none;border:0;cursor:pointer;transition:color .2s,background .2s}
.nl a:hover,.nl a.on,.nl .tools>button:hover{color:var(--ink);background:var(--tint)}
.nl .tools{position:relative}
.nl .dd{position:absolute;top:100%;right:0;min-width:270px;padding:8px;margin-top:8px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);display:none;box-shadow:0 24px 60px -24px rgba(19,10,43,.25)}
.nl .tools:hover .dd,.nl .tools:focus-within .dd,.nl .tools.open .dd{display:block}
.nl .dd a{display:block;padding:11px 12px;border-radius:12px;color:var(--ink);font-weight:600}
.nl .dd a small{display:block;font:400 13.5px var(--b);color:var(--mut)}
.menu-btn{display:none;margin-left:auto;background:var(--paper);border:1px solid var(--line);color:var(--ink);border-radius:30px;padding:9px 18px;font:600 15px var(--b);cursor:pointer}
@media (max-width:1020px){
  .menu-btn{display:block}
  .nl{position:fixed;inset:66px 12px auto 12px;flex-direction:column;align-items:stretch;padding:12px;background:var(--paper);border:1px solid var(--line);border-radius:22px;display:none;max-height:calc(100vh - 80px);overflow:auto;box-shadow:0 30px 60px -30px rgba(19,10,43,.35)}
  .nl.open{display:flex}
  .nl a{font-size:18px;padding:12px 14px}
  .nl .tools .dd{position:static;display:block;border:0;box-shadow:none;padding:0;margin:0}
  .nl .tools>button{display:none}
  header.site .btn.cta{display:none}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 16px var(--b);color:#fff;text-decoration:none;padding:16px 26px;border-radius:40px;border:1px solid var(--ink);cursor:pointer;background:var(--ink);transition:transform .2s,background .2s,color .2s}
.btn:hover{background:var(--vio);border-color:var(--vio);transform:translateY(-1px)}
.btn.sm{padding:11px 18px;font-size:14.5px}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line2)}
.btn.ghost:hover{background:var(--paper);border-color:var(--ink);color:var(--ink)}
.btn.light{background:#fff;color:var(--ink);border-color:#fff}
.btn.light:hover{background:var(--tint);border-color:var(--tint)}
.btn.dark-ghost{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.28);backdrop-filter:blur(8px)}
.btn.dark-ghost:hover{background:rgba(255,255,255,.2);border-color:#fff}
.btn[disabled]{opacity:.55;cursor:wait;transform:none}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.more{display:inline-flex;gap:8px;align-items:center;font:600 16px var(--b);color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--ink);padding-bottom:2px}
.more:hover{color:var(--vio);border-color:var(--vio)}

/* ---------- home journey: text column + sticky 3D window ---------- */
.journey{max-width:var(--max);margin:0 auto;padding:0 var(--gut);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(24px,4vw,64px)}
.j-text{padding-top:130px}
.j-stage{position:sticky;top:90px;height:calc(100vh - 116px);align-self:start;border-radius:var(--r);overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#3a1d86 0%,var(--stage2) 38%,var(--stage) 100%);box-shadow:0 40px 90px -40px rgba(40,15,100,.55)}
#stage3d{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.2s ease}
#stage3d.on{opacity:1}
.j-stage .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6;transition:opacity 1.2s}
.j-stage.live .poster{opacity:0}
.j-stage .cap{position:absolute;left:18px;bottom:16px;right:18px;display:flex;justify-content:space-between;gap:10px;font:500 12px var(--m);letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.75);pointer-events:none}
.j-stage .cap b{color:#fff;font-weight:500}
.prog{position:absolute;top:16px;left:18px;right:18px;display:flex;gap:6px;pointer-events:none}
.prog i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden}
.prog i b{display:block;height:100%;width:0;background:#fff;transition:width .25s}
.intro{min-height:calc(100vh - 130px);display:flex;flex-direction:column;justify-content:center;padding-bottom:60px}
.intro h1{margin-bottom:28px}
.act{min-height:125vh;display:flex;flex-direction:column;justify-content:center;padding:60px 0;border-top:1px solid var(--line)}
.act h2{font-size:clamp(40px,5vw,76px)}
.act p{font-size:clamp(17px,1.25vw,19px);max-width:46ch}
.act .ph{margin:26px 0 0;max-width:520px}
.act .ph div{border-radius:var(--r2);overflow:hidden;aspect-ratio:16/10;background:var(--tint)}
.act .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.act .ph.in img{transform:scale(1.05)}
.act .ph figcaption{font:500 12px var(--m);color:var(--mut);padding:10px 2px 0;letter-spacing:.04em}
.act ul{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.act ul li{font:500 14px var(--b);padding:7px 13px;border-radius:30px;background:var(--paper);border:1px solid var(--line);color:var(--ink)}
.act .more{margin-top:26px;align-self:flex-start}
.scroll-hint{margin-top:44px;font:500 13px var(--m);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);display:flex;align-items:center;gap:12px}
.scroll-hint:before{content:"";width:1px;height:42px;background:linear-gradient(var(--vio),transparent)}
@media (max-width:900px){
  .journey{grid-template-columns:1fr;gap:0}
  .j-stage{position:sticky;top:60px;height:42vh;order:-1;margin:0 calc(var(--gut) * -1);border-radius:0 0 24px 24px;z-index:3}
  .j-text{padding-top:0}
  .intro{min-height:auto;padding:36px 0 60px}
  .act{min-height:88vh;padding:44px 0}
  .act .ph{max-width:none}
}

/* ---------- sections ---------- */
.sec{padding:clamp(90px,13vh,150px) 0}
.sec.paper{background:var(--paper)}
.sec.tint{background:var(--tint)}
.head{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:end;margin-bottom:56px}
.head h2{margin:0}
.head p{margin:0;justify-self:end;max-width:42ch}
@media (max-width:800px){.head{grid-template-columns:1fr}.head p{justify-self:start}}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{padding:30px;border-radius:var(--r2);background:var(--paper);border:1px solid var(--line);position:relative;transition:transform .3s,border-color .3s,box-shadow .3s}
a.card{text-decoration:none;display:block;color:inherit}
a.card:hover{transform:translateY(-3px);border-color:var(--line2);box-shadow:0 26px 50px -30px rgba(19,10,43,.3)}
.card p{margin:0;color:var(--txt);font-size:16.5px}
.card .n{font:500 13px var(--m);color:var(--vio);margin-bottom:28px;display:block}
.tool{min-height:280px;display:flex!important;flex-direction:column}
.tool .go{margin-top:auto;padding-top:26px;font:600 15px var(--b);color:var(--ink)}
.tool.dark{background:var(--stage);border-color:var(--stage)}
.tool.dark h3{color:#fff}.tool.dark p{color:#BDB3DC}.tool.dark .go{color:#fff}.tool.dark .n{color:#C4B5FD}

/* numbered service list */
.svc{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.svc li{border-top:1px solid var(--line);padding:22px 0;display:grid;grid-template-columns:52px 1fr;gap:6px 14px}
.svc li .n{font:500 13px var(--m);color:var(--vio);padding-top:7px}
.svc li h3{margin:0;font-size:clamp(21px,1.7vw,25px)}
.svc li h3 a{text-decoration:none}
.svc li h3 a:hover{color:var(--vio)}
.svc li p{grid-column:2;margin:0;color:var(--mut);font-size:16px}
@media (max-width:760px){.svc{grid-template-columns:1fr}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.stats div{padding:28px 20px 0 0}
.stats b{display:block;font:800 clamp(52px,6vw,96px)/.9 var(--d);letter-spacing:-.05em;color:var(--ink)}
.stats span{display:block;margin-top:10px;color:var(--mut);font-size:15px}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr);row-gap:24px}}

/* client logos: infinite marquee */
.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .tr{display:flex;gap:18px;width:max-content;animation:mq 40s linear infinite}
.marquee:hover .tr{animation-play-state:paused}
.marquee figure{margin:0;width:190px;height:116px;flex:none;background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);display:grid;place-items:center;padding:18px}
.marquee img{max-height:70px;max-width:150px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.8;transition:filter .3s,opacity .3s}
.marquee figure:hover img{filter:none;opacity:1}
.marquee figure.txt{font:700 15px var(--d);color:var(--mut);letter-spacing:.02em;text-align:center}
@keyframes mq{to{transform:translateX(calc(-50% - 9px))}}

/* photo grid of recent shows */
.shots{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-auto-rows:250px;gap:14px}
.shots a{position:relative;border-radius:var(--r2);overflow:hidden;display:block;text-decoration:none;background:var(--tint)}
.shots a:first-child{grid-row:span 2}
.shots img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.shots a:hover img{transform:scale(1.05)}
.shots span{position:absolute;left:12px;bottom:12px;right:12px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.94);font:600 15px var(--b);color:var(--ink)}
.shots span small{display:block;font:500 11.5px var(--m);color:var(--mut);letter-spacing:.04em;text-transform:uppercase}
@media (max-width:860px){.shots{grid-template-columns:1fr 1fr;grid-auto-rows:200px}.shots a:first-child{grid-column:span 2;grid-row:span 1}}

/* testimonials */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.quote{margin:0;padding:34px;border-radius:var(--r2);background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column}
.quote blockquote{margin:0 0 24px;font:400 clamp(22px,2vw,28px)/1.3 var(--s);color:var(--ink)}
.quote figcaption{margin-top:auto;font-size:15px;color:var(--mut)}
.quote figcaption b{display:block;color:var(--ink);font-weight:600}

/* ---------- forms ---------- */
.form{display:grid;gap:16px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:600px){.f2{grid-template-columns:1fr}}
.fld label,.lbl{display:block;font:500 14px var(--b);color:var(--ink);margin-bottom:7px}
.fld input,.fld select,.fld textarea{width:100%;font:16px var(--b);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:14px 15px;transition:border-color .2s,background .2s}
.fld select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mut) 50%),linear-gradient(135deg,var(--mut) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--vio);background:#fff}
.fld textarea{min-height:120px;resize:vertical}
.hp{position:absolute;left:-9999px}
.fmsg{font-size:15px;min-height:22px;margin:4px 0 0;color:var(--mut)}
.fmsg.ok{color:#15803D}.fmsg.err{color:var(--pink)}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,3vw,40px)}
.panel h3{margin-top:4px}
.panel hr{border:0;border-top:1px solid var(--line);margin:24px 0}

/* range + toggles */
.ctrl{margin-bottom:20px}
.ctrl .row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}
.ctrl output{font:500 14px var(--m);color:var(--vio)}
input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--ink) var(--p,50%),var(--line2) var(--p,50%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--ink);cursor:pointer;box-shadow:0 4px 12px rgba(19,10,43,.2)}
input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--ink);cursor:pointer}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{cursor:pointer}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg span{display:inline-block;font:500 14px var(--b);padding:9px 15px;border-radius:30px;border:1px solid var(--line);background:var(--bg);color:var(--txt);transition:all .2s}
.seg span:hover{border-color:var(--line2)}
.seg input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.seg input:focus-visible+span{outline:2px solid var(--vio);outline-offset:2px}
.swatches{display:flex;gap:10px}
.swatches label{cursor:pointer}
.swatches input{position:absolute;opacity:0}
.swatches span{display:block;width:34px;height:34px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px var(--line2)}
.swatches input:checked+span{box-shadow:0 0 0 2px var(--ink)}
.swatches input:focus-visible+span{outline:2px solid var(--vio);outline-offset:3px}

/* ---------- tool pages ---------- */
.page-head{padding:150px 0 50px}
.page-head h1{font-size:clamp(48px,7.5vw,112px);max-width:14ch}
.split{max-width:var(--max);margin:0 auto;padding:0 var(--gut);display:grid;grid-template-columns:1.5fr 1fr;gap:22px;align-items:start}
.split>*{min-width:0}
@media (max-width:980px){.split{grid-template-columns:1fr!important}.split [style*="sticky"]{position:static!important}}
.viewport{position:sticky;top:90px;height:min(72vh,680px);border-radius:var(--r);overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#3a1d86 0%,var(--stage2) 38%,var(--stage) 100%)}
.viewport canvas{width:100%!important;height:100%!important;display:block;touch-action:none}
.viewport .vbar{position:absolute;left:14px;right:14px;bottom:14px;display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between;pointer-events:none}
.viewport .vbar>*{pointer-events:auto}
.viewport .hint{position:absolute;top:14px;left:14px;font:500 12px var(--m);color:rgba(255,255,255,.8);background:rgba(15,7,40,.55);padding:6px 12px;border-radius:20px}
@media (max-width:980px){.viewport{position:relative;top:0;height:56vh}}
.total{padding:22px;border-radius:var(--r2);background:var(--ink);color:#CFC8E6}
.total b{display:block;font:800 clamp(30px,3.4vw,44px)/1.05 var(--d);letter-spacing:-.03em;color:#fff;overflow-wrap:anywhere}
.total small{font:500 12.5px var(--m);letter-spacing:.04em}
.breakdown{list-style:none;padding:0;margin:14px 0 0;font-size:15px}
.breakdown li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line)}
.breakdown li span:last-child{color:var(--ink);font-weight:600;white-space:nowrap}
.note{font-size:13.5px;color:var(--mut);margin-top:12px}

/* ---------- portfolio ---------- */
.pf-stage{position:relative;height:min(78vh,760px);border-radius:var(--r);overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#3a1d86 0%,var(--stage2) 38%,var(--stage) 100%)}
.pf-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}
.pf-ui{position:absolute;left:0;right:0;bottom:22px;z-index:3;text-align:center;padding:0 16px}
.pf-ui .seg{justify-content:center}
.pf-ui .hint{color:rgba(255,255,255,.75);font:500 12.5px var(--m);margin-top:12px}
.pf-ui .seg span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}
.pf-ui .seg input:checked+span{background:#fff;color:var(--ink);border-color:#fff}
.pf-detail{position:fixed;inset:auto 20px 20px auto;width:min(440px,calc(100vw - 40px));z-index:60;padding:0;overflow:hidden;transform:translateY(30px);opacity:0;visibility:hidden;transition:all .35s;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 40px 80px -30px rgba(19,10,43,.45)}
.pf-detail.on{transform:none;opacity:1;visibility:visible}
.pf-detail .im{aspect-ratio:16/9;background:var(--tint)}
.pf-detail .im img{width:100%;height:100%;object-fit:cover}
.pf-detail .tx{padding:24px}
.pf-detail .meta{font:500 12.5px var(--m);color:var(--vio);margin-bottom:8px;letter-spacing:.03em}
.pf-detail .x{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:18px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tags span,.tag{font:500 13px var(--b);padding:6px 12px;border-radius:30px;background:var(--tint);color:var(--ink)}
.no3d .pf-stage{display:none}

/* ---------- events ---------- */
.ev{display:grid;grid-template-columns:1.05fr 1fr;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.ev .im{min-height:320px;background:var(--tint);position:relative}
.ev .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ev .im .st{position:absolute;top:16px;left:16px;font:500 12px var(--m);letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:30px;background:#fff;color:var(--ink)}
.ev .im .st.live{background:var(--pink);color:#fff}
.ev .tx{padding:clamp(24px,3vw,44px)}
.ev .meta{font:500 13px var(--m);color:var(--vio);margin-bottom:12px;letter-spacing:.03em}
.cd{display:flex;gap:10px;margin:22px 0}
.cd div{flex:1;text-align:center;padding:14px 6px;border-radius:16px;background:var(--bg);border:1px solid var(--line)}
.cd b{display:block;font:800 clamp(28px,3.2vw,40px)/1 var(--d);color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.cd small{font:500 11px var(--m);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.add-cal{font:500 14px var(--b);color:var(--ink);background:none;border:1px solid var(--line2);border-radius:30px;padding:10px 16px;cursor:pointer}
details>summary{list-style:none}details>summary::-webkit-details-marker{display:none}
@media (max-width:860px){.ev{grid-template-columns:1fr}}
.faq details{border-top:1px solid var(--line);padding:22px 0}
.faq summary{cursor:pointer;font:700 clamp(19px,1.6vw,23px) var(--d);color:var(--ink);display:flex;justify-content:space-between;gap:20px}
.faq summary:after{content:"+";font-weight:400;color:var(--vio)}
.faq details[open] summary:after{content:"–"}
.faq p{margin:14px 0 0;max-width:70ch}

/* ---------- inner page hero ---------- */
.hero2{padding:160px 0 70px}
.hero2 h1{font-size:clamp(48px,7.6vw,118px);max-width:15ch}
.hero2 .lede{margin-top:10px}
.hero2 .photo{margin-top:56px;border-radius:var(--r);overflow:hidden;aspect-ratio:21/9;background:var(--tint)}
.hero2 .photo img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.hero2 .photo{aspect-ratio:4/3}}
.prose{max-width:820px}
.prose p{font-size:clamp(18px,1.4vw,21px);line-height:1.65}

/* ---------- footer ---------- */
footer.site{background:var(--ink);color:#B9B0D6;padding:90px var(--gut) 30px}
.fcta{max-width:var(--max);margin:0 auto 70px;display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.12)}
.fcta h2{color:#fff;margin:0;max-width:12ch}
.fcta h2 em{color:#C4B5FD}
.fgrid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:28px}
.fgrid h4{font:500 12.5px var(--m);letter-spacing:.08em;text-transform:uppercase;color:#8D83B0;margin-bottom:16px}
.fgrid a{display:block;color:#D9D3EC;text-decoration:none;padding:4px 0;font-size:15.5px}
.fgrid a:hover{color:#fff}
.fgrid .brand{color:#fff}
.fsoc{display:flex;gap:10px;margin-top:18px}
.fsoc a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);padding:0}
.fsoc a:hover{background:rgba(255,255,255,.08)}
.fbot{max-width:var(--max);margin:50px auto 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px;color:#8D83B0}
.fbot a{color:#B9B0D6}
@media (max-width:900px){.fgrid{grid-template-columns:1fr 1fr}.fgrid>div:first-child{grid-column:1/-1}}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,40px);opacity:0;z-index:90;padding:12px 20px;border-radius:30px;background:var(--ink);color:#fff;font:500 15px var(--b);transition:all .3s}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* WhatsApp button from addons.css: use this theme's font */
#sdx-wa{font-family:var(--b)!important;font-weight:600}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

/* ---------- case studies ---------- */
.cases{display:grid;gap:22px}
.case{display:grid;grid-template-columns:1fr 1.25fr;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.case .im{min-height:280px;background:var(--tint);position:relative}
.case .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case .im .ph{position:absolute;inset:0;display:grid;place-items:center;padding:30px;text-align:center;font:700 26px/1.1 var(--d);color:#fff;background:radial-gradient(120% 90% at 50% 0%,#3a1d86 0%,var(--stage2) 45%,var(--stage) 100%)}
.case .tx{padding:clamp(24px,3vw,40px)}
.case .meta{font:500 13px var(--m);color:var(--vio);margin-bottom:12px;letter-spacing:.03em}
.case h2{font-size:clamp(28px,3vw,42px);margin-bottom:16px}
.case dl{display:grid;grid-template-columns:120px 1fr;gap:10px 16px;margin:0 0 16px;font-size:16.5px}
.case dt{font:500 13px var(--m);color:var(--mut);text-transform:uppercase;letter-spacing:.05em;padding-top:3px}
.case dd{margin:0;color:var(--txt)}
@media (max-width:860px){.case{grid-template-columns:1fr}.case dl{grid-template-columns:1fr;gap:2px}.case dd{margin-bottom:10px}}

/* ---------- long-form articles (privacy, blog posts) ---------- */
.article{max-width:780px}
.article h2{font-size:clamp(28px,3vw,40px);margin:46px 0 14px}
.article h3{font-size:clamp(21px,2vw,26px);margin:32px 0 10px}
.article p,.article li{font-size:clamp(17.5px,1.3vw,19.5px);line-height:1.75}
.article ul,.article ol{padding-left:22px}
.article a{color:var(--vio);font-weight:600}
.article blockquote{margin:28px 0;padding:6px 0 6px 22px;border-left:3px solid var(--vio);font:400 clamp(22px,2vw,28px)/1.35 var(--s);color:var(--ink)}
.article table{width:100%;border-collapse:collapse;margin:24px 0;font-size:16px}
.article th,.article td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:top}
.article th{font:500 13px var(--m);text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}

/* ---------- blog ---------- */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.post{display:flex;flex-direction:column;border-radius:var(--r2);overflow:hidden;border:1px solid var(--line);background:var(--paper);text-decoration:none;color:inherit;transition:transform .3s,box-shadow .3s}
.post:hover{transform:translateY(-3px);box-shadow:0 26px 50px -30px rgba(19,10,43,.3)}
.post .im{aspect-ratio:16/10;background:var(--tint)}
.post .im img{width:100%;height:100%;object-fit:cover}
.post .tx{padding:24px}
.post .meta{font:500 12.5px var(--m);color:var(--vio);margin-bottom:10px;letter-spacing:.03em}
.post h2,.post h3{font-size:clamp(21px,1.7vw,25px);margin:0 0 10px}
.post p{margin:0;font-size:16px;color:var(--mut)}
@media (max-width:980px){.posts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.posts{grid-template-columns:1fr}}
.cats{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.cats a{font:500 14px var(--b);padding:9px 15px;border-radius:30px;border:1px solid var(--line);background:var(--paper);color:var(--txt);text-decoration:none}
.cats a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.crumbs{font:500 13px var(--m);color:var(--mut);margin-bottom:22px}
.crumbs a{color:var(--mut);text-decoration:none}.crumbs a:hover{color:var(--vio)}
.evbox{border:1px solid var(--line);background:var(--paper);border-radius:var(--r2);padding:22px 26px;margin:0 0 34px}
.evbox dl{display:grid;grid-template-columns:120px 1fr;gap:8px 16px;margin:0;font-size:16.5px}
.evbox dt{font:500 13px var(--m);color:var(--mut);text-transform:uppercase;letter-spacing:.05em;padding-top:3px}
.evbox dd{margin:0}
.evbox p{margin:14px 0 0;font-size:14px;color:var(--mut)}
.cover{border-radius:var(--r);overflow:hidden;margin:0 0 40px;aspect-ratio:16/8;background:var(--tint)}
.cover img{width:100%;height:100%;object-fit:cover}
.post-cta{margin:56px 0 0;padding:clamp(26px,3vw,40px);border-radius:var(--r);background:var(--ink);color:#CFC8E6}
.post-cta h2{color:#fff;margin:0 0 10px;font-size:clamp(28px,3vw,40px)}
.post-cta h2 em{color:#C4B5FD}
.pager{display:flex;gap:12px;justify-content:center;margin-top:44px}
.preview-bar{position:sticky;top:0;z-index:100;background:var(--pink);color:#fff;text-align:center;padding:10px;font:600 14px var(--b)}
.preview-bar a{color:#fff}
@media (max-width:600px){.evbox dl{grid-template-columns:1fr;gap:2px}}

/* ---------- 3D services turntable ---------- */
.s3{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:start}
.s3-list{list-style:none;margin:0;padding:0;counter-reset:none}
.s3-item{width:100%;display:grid;grid-template-columns:44px 1fr;gap:2px 12px;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:16px 10px 16px 0;cursor:pointer;font:inherit;color:inherit;transition:background .25s,padding .25s}
.s3-list li:last-child .s3-item{border-bottom:1px solid var(--line)}
.s3-item .n{font:500 13px var(--m);color:var(--mut);padding-top:6px;transition:color .25s}
.s3-item .t{font:700 clamp(19px,1.6vw,23px)/1.15 var(--d);color:var(--ink);letter-spacing:-.02em;transition:color .25s}
.s3-item .d{grid-column:2;font-size:15px;color:var(--mut);max-height:0;overflow:hidden;opacity:0;transition:max-height .35s,opacity .35s}
.s3-item:hover .t,.s3-item.on .t{color:var(--vio)}
.s3-item.on{padding-left:12px;background:linear-gradient(90deg,var(--tint),transparent)}
.s3-item.on .n{color:var(--vio)}
.s3-item.on .d{max-height:40px;opacity:1}
.s3-stage{position:sticky;top:96px;display:grid;gap:14px}
.s3-view{position:relative;aspect-ratio:1/0.82;border-radius:var(--r);overflow:hidden;background:radial-gradient(90% 80% at 50% 25%,#4a24a6 0%,var(--stage2) 45%,var(--stage) 100%)}
.s3-view canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.s3-tag{position:absolute;top:16px;left:16px;z-index:2;font:500 11.5px var(--m);letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);padding:6px 10px;border-radius:20px;display:flex;align-items:center;gap:7px}
.s3-tag:before{content:"";width:6px;height:6px;border-radius:50%;background:#F472B6;box-shadow:0 0 0 3px rgba(244,114,182,.25)}
.s3-photo{position:absolute;right:-14px;bottom:-22px;width:42%;margin:0;z-index:3;transform:rotate(2.5deg)}
.s3-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;border:5px solid #fff;box-shadow:0 24px 50px -20px rgba(19,10,43,.55);opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.s3-photo img.in{opacity:1;transform:none}
.s3-photo figcaption{font:500 11px/1.4 var(--m);color:var(--mut);padding:8px 4px 0;text-align:right}
.s3-photo figcaption a{color:var(--mut)}
.s3-stage>.s3-view{grid-row:1}
.s3-stage{position:sticky}
.s3-stage .s3-view+.s3-photo{position:absolute}
.s3-cap{padding:30px 46% 0 4px;min-height:190px}
.s3-cap .n{font:500 13px var(--m);color:var(--vio)}
.s3-cap h3{font-size:clamp(26px,2.6vw,38px);margin:8px 0 10px}
.s3-cap p{color:var(--txt);font-size:16.5px;margin-bottom:16px}
.no3d .s3-view{background:var(--tint)}
@media (max-width:900px){
  .s3{grid-template-columns:1fr}
  .s3-stage{position:relative;top:0;order:-1}
  .s3-photo{width:46%;right:8px;bottom:auto;top:calc(min(82vw,520px) * .82 - 40px)}
  .s3-cap{padding:30px 0 0;min-height:0}
  .s3-cap{padding-right:50%}
  .s3-item .d{display:none}
}
@media (max-width:560px){.s3-cap{padding-right:0;padding-top:86px}.s3-photo{width:52%}}
