/* fonts-premium.css */
@font-face{font-family:'Switzer';src:url(fonts/Switzer-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url(fonts/Switzer-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url(fonts/Switzer-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url(fonts/Switzer-700.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url(fonts/Switzer-300.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}

/* style.css */
:root{
  --bg:#05060a; --bg2:#0a0d15; --panel:rgba(11,15,25,.72); --line:rgba(170,190,235,.14); --line2:rgba(216,176,106,.38);
  --ink:#eef1f8; --muted:#98a3b9; --dim:#7a849a;
  --gold:#d8b06a; --gold2:#f3d9a0; --blue:#7fb0ff;
  --f:'Switzer',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --pad:clamp(20px,4vw,56px); --maxw:1320px; --r:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font:400 16px/1.65 var(--f);overflow-x:hidden;-webkit-font-smoothing:antialiased;background:var(--bg)}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--gold);color:#140c00}
:focus-visible{outline:1px solid var(--gold2);outline-offset:4px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;z-index:90;background:var(--ink);color:var(--bg);padding:8px 14px}
.skip:focus{left:8px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);position:relative;z-index:2}
.narrow{max-width:900px}
.gold{background:linear-gradient(95deg,#f6e2ad 0%,#e3b66c 45%,#b9853f 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* film grain over everything */
body::after{content:"";position:fixed;inset:-50%;z-index:80;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%,100%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(3%,3%)}}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:calc(18px + env(safe-area-inset-top)) var(--pad) 18px;transition:background .4s,border-color .4s,padding .4s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(5,6,10,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:var(--line);padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:12px}
.logo{display:flex;align-items:baseline;gap:10px;text-decoration:none}
.logo-vl{font:300 30px/1 var(--f);letter-spacing:-.04em}
.logo-st{font:400 11px/1 var(--f);letter-spacing:.42em;color:var(--muted)}
.nav-links{display:flex;gap:34px}
.nav-links a{text-decoration:none;font:500 11px/1 var(--f);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.nav-links a:hover{color:var(--gold2)}
.nav-right{display:flex;align-items:center;gap:14px}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:none;cursor:pointer;position:relative}
.burger span{position:absolute;left:13px;right:13px;height:1px;background:var(--ink);transition:transform .3s}
.burger span:first-child{top:18px}.burger span:last-child{top:25px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:55;background:rgba(5,6,10,.96);backdrop-filter:blur(18px);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 var(--pad)}
.mnav[hidden]{display:none}
.mnav a{font:300 34px/1.5 var(--f);text-transform:uppercase;letter-spacing:.02em;text-decoration:none}
.mnav .btn{margin-top:24px;align-self:flex-start;font-size:13px}

/* ---------- buttons ---------- */
.btn,.btn-line{display:inline-flex;align-items:center;gap:14px;min-height:52px;padding:0 26px;border-radius:999px;
  font:500 12px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;cursor:pointer;
  transition:background .25s,color .25s,border-color .25s,box-shadow .25s}
.btn{background:linear-gradient(95deg,#f3d9a0,#d8a957 60%,#b98238);color:#1a1004;border:0;
  box-shadow:0 12px 40px -14px rgba(216,169,87,.8)}
.btn:hover{box-shadow:0 16px 52px -12px rgba(216,169,87,1)}
.btn-line{background:rgba(5,6,10,.25);color:var(--gold2);border:1px solid var(--line2);backdrop-filter:blur(6px)}
.btn-line:hover{border-color:var(--gold2);background:rgba(216,176,106,.08)}
.btn i,.btn-line i{font-style:normal;font-size:14px;letter-spacing:0}
.nav-cta{min-height:42px;padding:0 20px}

/* ---------- type ---------- */
.kicker,.eyebrow{font:500 11px/1 var(--f);letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.kicker b{color:var(--gold);font-weight:500}.kicker span{color:var(--dim);margin:0 6px}
.eyebrow{color:var(--gold);margin-bottom:24px;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.eyebrow.center{justify-content:center}
.h-hero{font:300 clamp(44px,5.6vw,96px)/.98 var(--f);text-transform:uppercase;letter-spacing:-.01em;margin:26px 0 0}
.h-sec{font:300 clamp(34px,4.6vw,66px)/1.02 var(--f);text-transform:uppercase;letter-spacing:-.005em}
.h-sub{font:300 clamp(24px,2.4vw,32px)/1.1 var(--f);text-transform:uppercase;letter-spacing:.02em;margin:84px 0 24px}
.center{text-align:center}
.body{color:var(--muted);font-size:17px;max-width:52ch;margin-top:24px}
.body.center{margin-left:auto;margin-right:auto}
.link-arrow{display:inline-block;margin-top:30px;font:500 12px/1 var(--f);letter-spacing:.2em;text-transform:uppercase;color:var(--gold2);text-decoration:none;padding-bottom:8px;border-bottom:1px solid var(--line2)}

/* split-word mask reveal */
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split .w>span{display:inline-block;will-change:transform}
.split .gold{background:none;color:inherit}
.split .gold .w>span{background:linear-gradient(180deg,#f6e2ad 0%,#e3b66c 55%,#b9853f 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:0;background:#05060a url(img/hero_portal.webp) 0% 50%/cover no-repeat;transform-origin:56% 45%;will-change:transform}
#hero3d{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(5,6,10,.92) 0%,rgba(5,6,10,.7) 26%,rgba(5,6,10,0) 52%),
             linear-gradient(0deg,#05060a 0%,rgba(5,6,10,0) 22%),linear-gradient(180deg,rgba(5,6,10,.6) 0%,rgba(5,6,10,0) 18%)}
.hero-inner{width:100%;padding-top:110px;padding-bottom:110px}
.hero-sub{color:#b9c2d4;font-size:18px;max-width:46ch;margin-top:30px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.offer{display:block;margin-top:26px;font-size:14px;color:var(--muted)}
.offer b{color:var(--gold2);font-weight:500}
.offer .dot{display:inline-block;margin-right:10px;vertical-align:middle}
.dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(216,176,106,.6);animation:pulse 2.2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(216,176,106,0)}100%{box-shadow:0 0 0 0 rgba(216,176,106,0)}}
.hero-side{position:absolute;right:var(--pad);top:22%;z-index:3;list-style:none;text-align:right;font:500 10px/2.1 var(--f);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.hero-side li:first-child{color:var(--gold2)}
.hero-scroll{position:absolute;right:var(--pad);bottom:40px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:12px;font:500 10px/1 var(--f);letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.hero-scroll i{width:1px;height:56px;background:linear-gradient(var(--gold),transparent);animation:drip 2.4s infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- services ---------- */
.services{padding:150px 0 130px;background:radial-gradient(60% 60% at 80% 30%,rgba(60,100,200,.10),transparent 70%)}
.svc-layout{display:grid;grid-template-columns:minmax(260px,.75fr) 2fr;gap:56px;align-items:start}
.svc-intro{position:sticky;top:120px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:330px;padding:22px 20px;border-radius:var(--r);
  border:1px solid var(--line);overflow:hidden;text-decoration:none;isolation:isolate;background:var(--bg2);
  transition:border-color .4s,transform .4s,box-shadow .4s}
.card.tilt{transition:border-color .4s,box-shadow .4s;will-change:transform}
.card.tilt:hover{transform:none}
.card::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--img) center 30%/cover no-repeat;transition:transform 1.1s cubic-bezier(.2,.7,.2,1);opacity:.9}
.card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,6,10,.05) 0%,rgba(5,6,10,.55) 45%,rgba(5,6,10,.96) 78%)}
.card:hover{border-color:var(--line2);transform:translateY(-6px);box-shadow:0 30px 70px -40px rgba(216,176,106,.55)}
.card:hover::before{transform:scale(1.08)}
.c-num{position:absolute;top:18px;left:20px;font:500 11px/1 var(--f);letter-spacing:.2em;color:var(--gold)}
.card h3{font:400 17px/1.2 var(--f);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.card p{color:var(--muted);font-size:13.5px;line-height:1.55}
.c-from{margin-top:16px;font:500 11px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);display:flex;justify-content:space-between;padding-top:14px;border-top:1px solid var(--line)}
.c-from i{font-style:normal}
.card-cta::before{background:var(--img) center 40%/62% no-repeat,radial-gradient(circle at 50% 38%,rgba(60,100,200,.25),transparent 60%);opacity:1}

/* ---------- why ---------- */
.why{position:relative;min-height:560px;display:flex;align-items:center;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.why-bg{position:absolute;inset:-10% 0;z-index:0;background:url(img/why_city.webp) center/cover no-repeat;will-change:transform}
.why::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,6,10,.85) 0%,rgba(5,6,10,.25) 50%,rgba(5,6,10,.85) 100%),linear-gradient(0deg,rgba(5,6,10,.7),transparent 40%)}
.why-inner{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center;width:100%;padding-top:100px;padding-bottom:100px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stat{padding:0 22px;border-left:1px solid var(--line2)}
.stat b{display:block;white-space:nowrap;font:300 clamp(34px,3.1vw,50px)/1 var(--f);letter-spacing:-.02em}
.stat span{display:block;margin-top:14px;font:500 10.5px/1.6 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ---------- work ---------- */
.work{padding:140px 0 120px}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:60px}
.case{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:border-color .4s}
.case:hover{border-color:var(--line2)}
.case-wide{grid-column:span 2}
.case-media{aspect-ratio:1024/500;overflow:hidden;background:#000}
.case-media img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.case:hover .case-media img{transform:scale(1.05)}
.case-phones{display:flex;gap:10px;justify-content:center;padding:16px;background:radial-gradient(circle at 50% 30%,#1c2440,#07090f)}
.case-phones img{width:36%;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 20px 40px -10px #000}
.case-body{padding:22px 24px 26px}
.case h3{font:400 20px/1.2 var(--f);text-transform:uppercase;letter-spacing:.04em;margin:12px 0 8px}
.case p{color:var(--muted);font-size:14.5px}
.case-text{padding:26px 24px}
.tag{font:500 10.5px/1 var(--f);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.soon{display:inline-block;margin-top:16px;font:500 10px/1 var(--f);color:var(--dim);letter-spacing:.18em;text-transform:uppercase}

/* ---------- process ---------- */
.process{padding:130px 0;border-top:1px solid var(--line);background:radial-gradient(50% 70% at 20% 50%,rgba(216,176,106,.06),transparent 70%)}
.proc-layout{display:grid;grid-template-columns:.8fr 2fr;gap:56px;align-items:center}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}
.steps::before{content:"";position:absolute;top:66px;left:12%;right:12%;border-top:1px dashed var(--line2)}
.steps li{position:relative;text-align:left}
.steps img{width:132px;height:132px;border-radius:50%;mix-blend-mode:screen;margin:0 0 18px -10px}
.steps span{font:500 11px/1 var(--f);color:var(--gold);letter-spacing:.2em}
.steps h3{font:400 16px/1.25 var(--f);text-transform:uppercase;letter-spacing:.06em;margin:10px 0 8px}
.steps p{color:var(--muted);font-size:14px}

/* ---------- pricing ---------- */
.pricing{padding:130px 0;border-top:1px solid var(--line)}
.promo{margin-top:30px;padding:18px 22px;border-radius:12px;border:1px solid var(--line2);background:rgba(216,176,106,.06);color:var(--muted);max-width:780px}
.promo b{color:var(--gold2);font-weight:500}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:44px}
.tab{background:none;border:1px solid var(--line);color:var(--muted);font:500 11px/1 var(--f);letter-spacing:.16em;text-transform:uppercase;padding:14px 18px;border-radius:999px;cursor:pointer;min-height:44px;transition:all .2s}
.tab:hover{color:var(--ink);border-color:var(--line2)}
.tab[aria-selected="true"]{background:linear-gradient(95deg,#f3d9a0,#d8a957);color:#1a1004;border-color:transparent}
.price-list{margin-top:26px;border-top:1px solid var(--line)}
.price-row{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.price-row h4{font:400 18px/1.3 var(--f);letter-spacing:.02em}
.price-row p{color:var(--muted);font-size:14px;margin-top:4px}
.price-tag{text-align:right;white-space:nowrap}
.price-tag .p{font:300 30px/1 var(--f);letter-spacing:-.01em}
.price-tag .p small{font:400 14px var(--f);color:var(--muted)}
.price-tag .n{display:block;margin-top:8px;font:500 11px/1 var(--f);color:var(--gold2);letter-spacing:.08em}
.bundles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bundle{border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;background:var(--panel);display:flex;flex-direction:column}
.bundle.hot{border-color:var(--line2);box-shadow:0 30px 80px -50px rgba(216,176,106,.7)}
.bundle .badge{align-self:flex-start;font:500 10px/1 var(--f);text-transform:uppercase;letter-spacing:.18em;color:#1a1004;background:linear-gradient(95deg,#f3d9a0,#d8a957);padding:7px 11px;border-radius:999px;margin-bottom:16px}
.bundle h4{font:300 28px/1 var(--f);text-transform:uppercase;letter-spacing:.01em}
.bundle .for{color:var(--gold);font-size:13px;margin:10px 0 18px}
.bundle ul{list-style:none;margin-bottom:22px;flex:1}
.bundle li{padding:7px 0 7px 22px;position:relative;color:var(--muted);font-size:14.5px}
.bundle li::before{content:"";position:absolute;left:2px;top:15px;width:6px;height:6px;border:1px solid var(--gold);transform:rotate(45deg)}
.bundle .p{font:300 30px/1 var(--f)}
.bundle .p small{font:400 14px var(--f);color:var(--muted)}
.bundle .n{font:500 11px/1 var(--f);color:var(--gold2);margin:10px 0 22px;letter-spacing:.06em}

/* ---------- faq ---------- */
.faq{padding:130px 0;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{margin-top:40px;border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;font:400 18px/1.4 var(--f);position:relative;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:18px;font:200 28px/1 var(--f);color:var(--gold);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted);padding:0 0 22px;max-width:72ch}

/* ---------- contact ---------- */
.contact{position:relative;padding:160px 0 130px;overflow:hidden;border-top:1px solid var(--line)}
.contact-bg{position:absolute;inset:0;z-index:0;background:url(img/cta_portal.webp) center 40%/cover no-repeat;opacity:.55}
.contact::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(60% 55% at 50% 45%,rgba(5,6,10,.35),rgba(5,6,10,.95) 75%)}
.contact-inner{display:flex;flex-direction:column;align-items:center}
.form{margin-top:44px;width:min(760px,100%);display:grid;gap:16px;padding:30px;border-radius:18px;background:rgba(8,11,19,.7);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label{display:grid;gap:8px;font:500 10.5px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.form input,.form select,.form textarea{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;color:var(--ink);
  font:400 16px/1.4 var(--f);padding:13px 14px;min-height:48px;letter-spacing:0;text-transform:none}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--gold)}
.form select option{background:var(--bg2)}
.form .btn{justify-self:center;margin-top:6px}
.form-note{font-size:13px;color:var(--dim);text-align:center}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);padding:44px 0 calc(44px + env(safe-area-inset-bottom))}
.foot{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center;justify-content:space-between}
.foot-tag{font:500 11px/1 var(--f);letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.foot-tag span{color:var(--gold);margin:0 6px}
.foot-legal{font-size:13px;color:var(--dim)}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(26px)}
.reduce .reveal{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .svc-layout,.proc-layout,.why-inner{grid-template-columns:1fr}
  .svc-intro{position:static}
  .stats{grid-template-columns:repeat(2,1fr);row-gap:36px}
}
@media (max-width:1020px){
  .nav-links,.nav-cta{display:none}
  .burger{display:block}
  .steps{grid-template-columns:1fr 1fr;row-gap:40px}
  .steps::before{display:none}
  .hero-side{display:none}
}
@media (max-width:640px){
  .hero{align-items:flex-end}
  .hero-bg{background-position:58% center}
  .hero-shade{background:linear-gradient(0deg,#05060a 8%,rgba(5,6,10,.82) 46%,rgba(5,6,10,.2) 75%,rgba(5,6,10,.55) 100%)}
  .hero-inner{padding-bottom:70px}
  .hero-scroll{display:none}
  .steps{grid-template-columns:1fr}
  .case-wide{grid-column:auto}
  .row2{grid-template-columns:1fr}
  .price-row{grid-template-columns:1fr;gap:10px}
  .price-tag{text-align:left}
  .stat{padding:0 14px}
}
@media (prefers-reduced-motion:reduce){
  body::after,.dot,.hero-scroll i{animation:none}
  .reveal{opacity:1;transform:none}
}

.svc-layout .split{font-size:clamp(36px,3.9vw,58px)}
.card-cta{border-color:var(--line2);background:radial-gradient(80% 60% at 50% 40%,rgba(216,176,106,.12),var(--bg2) 70%)}
.card-cta::before{background:var(--img) center 40%/85% no-repeat;-webkit-mask:radial-gradient(circle 120px at 50% 40%,#000 50%,transparent 100%);mask:radial-gradient(circle 120px at 50% 40%,#000 50%,transparent 100%)}
.card:nth-child(2)::before{filter:brightness(1.35) saturate(1.1);background-position:center 45%}
.card.tilt::before{translate:var(--ix,0) var(--iy,0);transition:transform 1.1s cubic-bezier(.2,.7,.2,1),translate .6s cubic-bezier(.2,.7,.2,1)}
.c-glare{position:absolute;left:0;top:0;z-index:0;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,228,170,.26) 0%,rgba(255,228,170,.07) 35%,transparent 65%);mix-blend-mode:screen;opacity:0;transition:opacity .45s}
.card.tilt:hover .c-glare{opacity:1}

/* ================= v3: layout polish + motion ================= */
:root{--sec:clamp(72px,10vw,140px)}
@media (min-width:1600px){:root{--maxw:1560px}}
.nav{padding-left:max(var(--pad),calc((100% - var(--maxw))/2 + var(--pad)));padding-right:max(var(--pad),calc((100% - var(--maxw))/2 + var(--pad)))}
.hero-side,.hero-scroll{right:max(var(--pad),calc((100% - var(--maxw))/2 + var(--pad)))}
.services{padding:calc(var(--sec) - 30px) 0 var(--sec)}
.work,.process,.pricing,.faq{padding:var(--sec) 0}
.contact{padding:calc(var(--sec) + 20px) 0 var(--sec)}

/* hero mouse depth (desktop) */
@media (hover:hover) and (pointer:fine){
  .hero-bg{inset:-24px}
  #hero3d{inset:-24px;width:calc(100% + 48px);height:calc(100% + 48px)}
  .hero-bg,#hero3d,.hero-inner,.hero-side,.hero-scroll{will-change:translate}
}

/* marquee */
.marquee{position:relative;z-index:2;overflow:hidden;padding:30px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-track{display:flex;align-items:center;width:max-content;will-change:transform}
.mq-track span{font:300 clamp(34px,5.4vw,82px)/1 var(--f);text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;padding:0 .45em;color:var(--ink)}
.mq-track span.o{color:transparent;-webkit-text-stroke:1px rgba(216,176,106,.7)}
.mq-track i{flex:none;width:10px;height:10px;rotate:45deg;background:linear-gradient(135deg,var(--gold2),#b9853f);box-shadow:0 0 18px rgba(216,176,106,.7)}

/* soft gold seams instead of hard lines */
.why,.process,.pricing,.faq,.contact{border-top:0}
.why{border-bottom:0}
.process,.pricing,.faq{position:relative}
.process::before,.pricing::before,.faq::before,.contact::before{content:"";position:absolute;top:0;left:50%;z-index:2;translate:-50% 0;
  width:min(72%,920px);height:1px;background:linear-gradient(90deg,transparent,rgba(216,176,106,.5),transparent);box-shadow:0 0 22px 1px rgba(216,176,106,.22)}
.why-bg{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%)}
.contact-bg{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%);mask-image:linear-gradient(180deg,transparent 0,#000 30%)}

/* services intro: fill the empty left column */
.svc-intro::after{content:"";display:block;margin-top:56px;width:180px;aspect-ratio:1;background:url(img/orb1.webp) center/contain no-repeat;mix-blend-mode:screen;filter:drop-shadow(0 0 40px rgba(216,176,106,.35))}

/* why: 2x2 stats on desktop, counters */
.stat b{font-variant-numeric:tabular-nums}
@media (min-width:1181px){
  .why-inner{grid-template-columns:1.15fr 1fr;align-items:end}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
  .stat span{max-width:22ch}
}
.why{min-height:640px}

/* work: bento */
.work-grid{grid-auto-flow:dense}
.case-wide{grid-column:span 2;grid-row:span 2}
.case-wide .case-media{aspect-ratio:auto;flex:1 1 auto;min-height:440px}
.case:not(.case-wide):not(.case-text) .case-media{aspect-ratio:16/9}
.case-phones{aspect-ratio:16/9!important;align-items:center;padding:18px}
.case-phones img{width:auto;height:100%;max-height:none}
.case-text{position:relative;isolation:isolate;min-height:340px;justify-content:flex-end}
.case-text::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--img) center 20%/cover no-repeat;opacity:.55;
  -webkit-mask:linear-gradient(180deg,#000 0%,transparent 70%);mask:linear-gradient(180deg,#000 0%,transparent 70%)}
.case-text .soon{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);width:100%}
.case-media img{transition:scale 1s cubic-bezier(.2,.7,.2,1)}
.case:hover .case-media img{transform:none;scale:1.05}
.case-media:not(.case-phones) img{position:relative;top:-10%;height:120%}

/* process */
.proc-layout .split{font-size:clamp(36px,3.9vw,58px)}
@media (min-width:1181px){.proc-layout{grid-template-columns:minmax(260px,.75fr) 2fr}}
.steps .steps-bar{position:absolute;top:66px;left:12%;right:12%;height:1px;pointer-events:none;
  background:linear-gradient(90deg,var(--gold2),var(--gold));box-shadow:0 0 14px rgba(216,176,106,.85);transform-origin:left center;transform:scaleX(0)}

/* pricing */
.sec-head{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:end}
.sec-head .body{margin-top:0}
.price-wrap{display:grid;grid-template-columns:minmax(0,.8fr) 2fr;gap:40px;margin-top:26px;align-items:start}
.price-art{position:sticky;top:110px;aspect-ratio:4/5;border-radius:var(--r);border:1px solid var(--line);background:var(--img,url(img/svc_ai.webp)) center/cover;
  box-shadow:0 40px 90px -50px rgba(216,176,106,.6)}
.price-wrap .price-list{margin-top:0}
.h-sub{display:flex;align-items:center;gap:18px}
.h-sub::after{content:"";flex:1;height:1px;background:var(--line)}
.bundle{position:relative}
.bundle .badge{position:absolute;top:-13px;left:26px;margin:0;box-shadow:0 8px 24px -8px rgba(216,169,87,.8)}
.bundle.hot{background:linear-gradient(180deg,rgba(216,176,106,.08),var(--panel) 40%)}

/* faq */
.faq-layout{display:grid;grid-template-columns:minmax(260px,.75fr) 2fr;gap:56px;align-items:start}
.faq-head{position:sticky;top:120px}
.faq details:first-of-type{margin-top:0}
.faq{background:radial-gradient(40% 60% at 15% 40%,rgba(216,176,106,.06),transparent 70%)}

/* page-wide dust + cursor */
.dust{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0}
.cur-dot,.cur-ring{position:fixed;left:0;top:0;z-index:95;pointer-events:none;border-radius:50%;opacity:0;transition:opacity .3s}
.has-cursor .cur-dot,.has-cursor .cur-ring{opacity:1}
.cur-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--gold2);box-shadow:0 0 10px rgba(243,217,160,.8)}
.cur-ring{width:40px;height:40px;margin:-20px 0 0 -20px;border:1px solid rgba(243,217,160,.5);display:grid;place-items:center;
  transition:opacity .3s,scale .45s cubic-bezier(.2,.7,.2,1),background-color .35s,border-color .35s}
.cur-ring b{font:600 5px/1 var(--f);letter-spacing:.22em;color:#1a1004;opacity:0;transition:opacity .25s}
.cur-ring.is-link{scale:1.6;background:rgba(216,176,106,.08);border-color:var(--gold2)}
.cur-ring.is-view{scale:2.4;background:var(--gold2);border-color:transparent}
.cur-ring.is-view b{opacity:1}
.cur-off .cur-dot,.cur-off .cur-ring{opacity:0}

.link-arrow{padding:14px 0 8px;margin-top:18px}
.logo{min-height:44px;align-items:center}

/* ---------- v3 responsive ---------- */
@media (max-width:1180px){
  .svc-intro{display:grid;grid-template-columns:1fr 1fr;column-gap:48px;align-items:end}
  .svc-intro .eyebrow,.svc-intro .split{grid-column:1}
  .svc-intro .body,.svc-intro .link-arrow{grid-column:2}
  .svc-intro .body{margin-top:0}
  .svc-intro::after{display:none}
}
@media (max-width:1020px){
  /* horizontal snap rails instead of tall stacks */
  .cards,.work-grid,.bundles{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-left:calc(-1*var(--pad));margin-right:calc(-1*var(--pad));padding:4px var(--pad) 18px;scroll-padding-inline:var(--pad);
    scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .cards::-webkit-scrollbar,.work-grid::-webkit-scrollbar,.bundles::-webkit-scrollbar{display:none}
  .card{flex:0 0 min(78vw,320px);min-height:400px;scroll-snap-align:start}
  .case{flex:0 0 min(82vw,360px);scroll-snap-align:start}
  .case-wide{flex-basis:min(88vw,620px);grid-row:auto}
  .case-wide .case-media{min-height:0;aspect-ratio:1024/500}
  .bundles{padding-top:20px;padding-bottom:24px}
  .bundle{flex:0 0 min(84vw,340px);scroll-snap-align:center;padding:24px 22px}
  .bundle h4{font-size:24px}
  .bundle li{padding:5px 0 5px 22px;font-size:14px}
  .price-wrap{grid-template-columns:1fr}.price-art{display:none}
  .faq-layout{grid-template-columns:1fr;gap:28px}.faq-head{position:static}
  .sec-head{grid-template-columns:1fr;gap:20px}
  .steps img{width:96px;height:96px}
  body::after{animation:none;inset:0}
  .nav.scrolled{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
}
@media (min-width:641px) and (max-width:1020px){
  .hero{align-items:flex-end;min-height:92svh}
  .hero-bg{background-position:62% center}
  .hero-shade{background:linear-gradient(0deg,#05060a 6%,rgba(5,6,10,.75) 42%,rgba(5,6,10,.1) 72%,rgba(5,6,10,.5) 100%)}
  .hero-inner{padding-bottom:90px}
}
@media (max-width:640px){
  :root{--sec:64px}
  .services{padding-top:40px}
  .svc-intro{display:block}
  .h-sub{margin:48px 0 18px}
  .eyebrow{margin-bottom:16px}
  .body{font-size:16px;margin-top:16px}
  .why{min-height:0}
  .why-inner{padding-top:64px;padding-bottom:64px}
  .work-grid{margin-top:32px}
  .card{min-height:360px;padding:18px 16px}
  .card h3{font-size:15px}
  .marquee{padding:18px 0}
  .h-hero{font-size:clamp(40px,11.5vw,52px);margin-top:18px}
  .hero-sub{font-size:16px;margin-top:20px}
  .cta-row{margin-top:28px;gap:10px}
  .cta-row a{width:100%;justify-content:center}
  .hero-inner{padding-bottom:calc(48px + env(safe-area-inset-bottom))}
  .steps{row-gap:22px}
  .steps li{display:grid;grid-template-columns:64px 1fr;column-gap:16px;align-items:start}
  .steps img{width:64px;height:64px;margin:0;grid-row:span 3}
  .steps h3{margin:4px 0 4px;font-size:15px}
  .steps li::after{content:"";position:absolute;left:32px;top:72px;bottom:-18px;border-left:1px dashed var(--line2)}
  .steps li:last-child::after{display:none}
  .tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:28px calc(-1*var(--pad)) 0;padding:0 var(--pad);scroll-snap-type:x proximity}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:0 0 auto;scroll-snap-align:start;padding:14px 16px}
  .promo{margin-top:20px;padding:14px 16px;font-size:14.5px}
  .price-row{padding:16px 0;gap:6px}
  .price-row h4{font-size:16.5px}
  .price-row p{font-size:13.5px}
  .price-tag{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
  .price-tag .p{font-size:24px}
  .price-tag .n{margin-top:0}
  .why::after{background:linear-gradient(180deg,rgba(5,6,10,.85) 0%,rgba(5,6,10,.55) 45%,rgba(5,6,10,.9) 100%)}
  .why .h-sec{font-size:34px}
  .stats{row-gap:26px}
  .stat b{font-size:34px}
  .stat span{font-size:11.5px;letter-spacing:.06em;text-transform:none;line-height:1.45;margin-top:8px}
  .form{padding:20px 16px;margin-top:28px;gap:12px}
  .form .btn{justify-self:stretch;justify-content:center}
  .contact .h-sec{font-size:32px}
}

/* ================= v4: typography + optical alignment ================= */
/* eyebrow word flush with the column; gold rule trails the text (centred: rules both sides) */
.eyebrow{gap:12px}
.eyebrow::before{order:2}
.eyebrow.center::before{order:-1}
.eyebrow.center::after{content:"";width:28px;height:1px;background:var(--gold)}
/* hang heading stems onto the column (Switzer 300 side-bearing ≈ .085em; round letters overshoot slightly) */
.h-hero,.h-sec:not(.center),.h-sub{margin-left:-.07em}
.stat b{margin-left:-.05em;min-width:4ch;display:inline-block}
.nw{white-space:nowrap}
.h-hero,.h-sec,.h-sub,.card h3,.case h3,.steps h3,.faq summary,.foot-legal{text-wrap:balance}
p,.body,.hero-sub,.faq details p,.price-row p,.bundle li{text-wrap:pretty}
.h-sec{letter-spacing:0}.h-hero{letter-spacing:-.005em;margin-top:24px}
.hero-sub{margin-top:24px}.cta-row{margin-top:32px}
.link-arrow{margin-top:24px;padding-top:0}
.form-note{text-wrap:balance;max-width:44ch;margin-inline:auto}
.body.center{max-width:46ch}
.faq details p{max-width:62ch}
.tabs{scroll-padding-inline:var(--pad)}
.price-tag .p em,.bundle .p em{font:500 11px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-style:normal;margin-right:6px;vertical-align:.6em}
@media (min-width:1021px){
  .faq-layout{grid-template-columns:minmax(0,1fr) 1.6fr;gap:64px}
  .faq-head .h-sec{font-size:clamp(36px,3.6vw,56px)}
}
@media (max-width:1180px) and (min-width:641px){
  .svc-intro .eyebrow{grid-row:1}.svc-intro .split{grid-row:2}
  .svc-intro .body{grid-row:1 / 4;align-self:end}
  .svc-intro .link-arrow{grid-row:4}
}
@media (max-width:1020px){.sec-head{gap:24px}}
@media (max-width:640px){
  .svc-intro .body{margin-top:16px}
  .sec-head{gap:16px}
  .h-hero{margin-top:16px}
  .contact .h-sec br{display:none}.contact .h-sec{font-size:30px}
  .faq summary{font-size:17px;line-height:1.35}
}
.industries{grid-column:1/-1;margin-top:8px;padding-left:22px;color:var(--muted);font-size:14px;max-width:70ch}
.industries b{color:var(--gold2);font-weight:500}
.price-sum{margin-top:14px;font-size:13.5px;color:var(--dim);max-width:60ch}
@media (max-width:640px){.industries{padding-left:14px;font-size:13.5px}}
.k-more{font-style:normal}
@media (max-width:640px){.k-more{display:none}}
.hero-flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;
  background:radial-gradient(circle at var(--fx,56%) var(--fy,45%),#fffaf0 0%,#f6dfa8 14%,rgba(216,176,106,.55) 34%,rgba(5,6,10,.0) 70%)}
/* fly-through hand-off: next block rises out of the flash instead of a black screen */
html.motion .hero{z-index:1}
html.motion .marquee{margin-top:-45vh;z-index:6}
html.motion .marquee~.services{position:relative;z-index:6}
@media (max-width:640px){html.motion .marquee{margin-top:-32vh}}
.foot-links{flex-basis:100%;order:3;display:flex;flex-wrap:wrap;gap:10px 26px;padding-top:22px;border-top:1px solid var(--line)}
.foot-links a{font-size:13.5px;color:var(--muted);text-decoration:none;transition:color .2s}
.foot-links a:hover{color:var(--gold2)}
.foot-legal{order:4}

/* ================= v6: art-director pass ================= */
.h-hero{font-size:clamp(44px,5vw,84px)}
.hero .hero-sub{max-width:40ch}
.hero-shade{background:linear-gradient(90deg,rgba(5,6,10,.94) 0%,rgba(5,6,10,.75) 30%,rgba(5,6,10,0) 56%),linear-gradient(0deg,#05060a 0%,rgba(5,6,10,0) 22%),linear-gradient(180deg,rgba(5,6,10,.6) 0%,rgba(5,6,10,0) 18%)}
.mq-track span{text-shadow:0 2px 30px rgba(5,6,10,.8)}
@media (max-width:1020px){.services{background:linear-gradient(180deg,rgba(5,6,10,0),#05060a 18%)}}
/* orbs: soft masked circles instead of hard squares */
.svc-intro::after{mix-blend-mode:normal;-webkit-mask:radial-gradient(circle,#000 42%,transparent 70%);mask:radial-gradient(circle,#000 42%,transparent 70%)}
.card-cta::before{-webkit-mask:radial-gradient(circle 110px at 50% 40%,#000 40%,transparent 72%);mask:radial-gradient(circle 110px at 50% 40%,#000 40%,transparent 72%)}
.steps img{-webkit-mask:radial-gradient(circle,#000 55%,transparent 71%);mask:radial-gradient(circle,#000 55%,transparent 71%)}
/* equal heading baselines across a card row */
@media (min-width:1021px){.card h3{min-height:2.4em;display:flex;align-items:flex-end}.card p{min-height:calc(1.55em*5)}}
/* fewer micro caps */
.nav-links a,.kicker,.eyebrow,.c-from,.tag{font-size:12px;letter-spacing:.16em}
.hero-side{font-size:11px}
.stat span{font:400 14px/1.5 var(--f);letter-spacing:0;text-transform:none}
.form label{font-size:11.5px;letter-spacing:.12em}
@media (max-width:640px){.price-tag .n{flex-basis:100%}.hero-bg{background-position:58% 30%}}
.why::after{background:linear-gradient(90deg,rgba(5,6,10,.85) 0%,rgba(5,6,10,.25) 50%,rgba(5,6,10,.85) 100%),linear-gradient(0deg,#05060a 0%,transparent 35%),linear-gradient(180deg,#05060a 0%,transparent 25%)}
.contact{padding-top:var(--sec)}
.faq{padding-bottom:calc(var(--sec) - 40px)}

/* ================= v7: round-2 art-director pass ================= */
.hero-after{position:absolute;left:0;right:0;bottom:58%;text-align:center;font:300 clamp(30px,3.6vw,60px)/1.02 var(--f);text-transform:uppercase;opacity:0;z-index:4;pointer-events:none;margin:0;padding:0 var(--pad)}
.services{background:radial-gradient(60% 60% at 80% 30%,rgba(60,100,200,.10),transparent 70%),linear-gradient(180deg,rgba(5,6,10,0) 0,#05060a 300px)}
:root{--sec:clamp(64px,7.5vw,112px)}
@media (max-width:640px){:root{--sec:56px}}
.why-bg{background-position:68% center}
.why::after{background:linear-gradient(90deg,rgba(5,6,10,.94) 0%,rgba(5,6,10,.7) 38%,rgba(5,6,10,.25) 60%,rgba(5,6,10,.85) 100%),linear-gradient(0deg,#05060a 0%,transparent 35%),linear-gradient(180deg,#05060a 0%,transparent 25%)}
.case-text .soon{display:none}
@media (min-width:1600px){
  .h-sec,.svc-layout .split,.proc-layout .split{font-size:clamp(58px,3.9vw,76px)}
  .h-hero{font-size:clamp(84px,5vw,104px)}
  .body,.hero-sub{font-size:19px}
}
.btn,.btn-line{font-size:12.5px}
.card p{font-size:14.5px}
.form input,.form select,.form textarea{background:rgba(255,255,255,.045);border-color:rgba(216,176,106,.18)}
.form label{color:var(--muted)}
@media (min-width:1021px){.foot-links{display:grid;grid-template-columns:repeat(5,auto);justify-content:start;gap:10px 28px}}
@media (max-width:640px){.foot-legal .nw{display:block}}
@media (max-width:1020px){.kicker .k-more{display:none}}
@media (max-width:1020px){.bundles{scroll-padding-inline:var(--pad)}.bundles>*{scroll-snap-align:start}}
@media (min-width:641px) and (max-width:1020px){.svc-intro{display:grid;grid-template-columns:1fr 1fr;gap:32px}}

/* ================= v8: round-3 pass ================= */
.hero-after{font-size:clamp(44px,6.4vw,120px);bottom:54%}
.mq-track span{font-size:clamp(28px,4.2vw,64px)}
.card:not(.card-cta)::before{-webkit-mask-image:linear-gradient(#000 0 38%,transparent 66%);mask-image:linear-gradient(#000 0 38%,transparent 66%)}
.card::after{background:linear-gradient(180deg,rgba(5,6,10,0) 0%,rgba(5,6,10,.35) 35%,rgba(10,12,18,.88) 55%,rgba(5,6,10,.97) 80%)}
@media (max-width:640px){.hero .hero-sub{color:#d6dbe6;text-shadow:0 1px 12px rgba(5,7,12,.85)}}
.work{padding-bottom:calc(var(--sec)*.55)}
.tab{font-size:12.5px}
.qn-mega .btn{font-size:12.5px}
/* v9 */
.form-note.err{color:#e8a27a}
.form input[aria-invalid=true]{border-color:#e8a27a}
.price-sum{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center}
.price-sum b{font-weight:500;color:var(--muted);margin-right:4px}
.price-sum span{padding:6px 11px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;color:var(--muted)}
/* phones/tablets: scroll-driven coverflow rail (main.js §10) */
@media (max-width:1020px){
  .cards.wheel{overflow:visible;scroll-snap-type:none;transform-style:preserve-3d}
  .cards.wheel .card{will-change:transform,opacity;backface-visibility:hidden}
}
@media (max-width:1020px){
  .work-grid.wheel{overflow:visible;scroll-snap-type:none;transform-style:preserve-3d}
  .work-grid.wheel .case{will-change:transform,opacity;backface-visibility:hidden;flex-basis:min(82vw,360px)}
}
@media (max-width:1180px){.svc-layout{grid-template-columns:minmax(0,1fr)}.cards{min-width:0}}

/* keep wide wheel rails from widening the page on phones */
html,body{overflow-x:clip}
@media (max-width:1020px){.services,.work{overflow-x:clip}}
.wheel-box{position:relative}
/* coverflow HUD + tablet card size */
.wheel-hud{position:absolute;left:0;right:0;top:-46px;display:flex;align-items:center;justify-content:center;gap:14px;pointer-events:none;font:500 11px/1 var(--f);letter-spacing:.2em;text-transform:uppercase}
.wh-name{color:var(--gold)}
.wh-count{color:var(--muted);font-variant-numeric:tabular-nums}
.wh-dots{position:absolute;left:0;right:0;top:calc(100% + 46px + var(--rail-h,0px));display:none}
.wheel-hud .wh-dots{display:flex;justify-content:center;gap:7px;position:static}
.wh-dots i{width:5px;height:5px;border-radius:50%;background:var(--line2);transition:background .3s,transform .3s}
.wh-dots i.on{background:var(--gold2);transform:scale(1.5)}
@media (min-width:641px) and (max-width:1020px){
  .cards.wheel .card,.work-grid.wheel .case{flex-basis:min(58vw,460px)}
}
@media (min-width:1021px){.pricing .sec-head{align-items:start}}
#hero3d{opacity:0;transition:opacity 1.2s ease}
#hero3d.on{opacity:1}
body::after{animation:none}
/* v10: audit fixes */
.price-row h3{font:400 18px/1.3 var(--f);letter-spacing:.02em}
.bundle h3{font:300 28px/1 var(--f);text-transform:uppercase;letter-spacing:.01em}
@media (max-width:1020px){.bundle h3{font-size:24px}}
@media (max-width:640px){.price-row h3{font-size:16.5px}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
:focus-visible{outline-width:2px}
.form input:focus-visible,.form select:focus-visible,.form textarea:focus-visible,.lp-form input:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
@media (max-width:640px){.hero-after{font-size:clamp(30px,8.6vw,40px)}}
.hp{display:none!important}

/* lp.css */
/* ===== VL Studio landing pages (shared). Loaded after style.css ===== */
.lp .nav{background:rgba(5,6,10,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lp-hero{position:relative;min-height:88svh;display:flex;align-items:center;overflow:hidden;isolation:isolate;padding:120px 0 80px}
.lp-hero-bg{position:absolute;inset:-4%;z-index:-2;background-color:#05060a;background-position:70% center;background-size:cover;background-repeat:no-repeat;will-change:transform}
.lp-hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(5,6,10,.96) 0%,rgba(5,6,10,.82) 34%,rgba(5,6,10,.15) 70%),linear-gradient(0deg,#05060a 0%,transparent 30%)}
.lp-hero .h-hero{font-size:clamp(38px,4.6vw,76px);max-width:15ch}
.lp-hero .hero-sub{max-width:52ch}
.crumbs{font:500 11px/1 var(--f);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:22px}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--gold2)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--line2);background:rgba(216,176,106,.07);font:500 12px/1 var(--f);letter-spacing:.06em;color:var(--gold2)}
.chip.mute{border-color:var(--line);background:rgba(255,255,255,.03);color:var(--muted)}
.updated{margin-top:22px;font-size:12.5px;color:var(--dim)}

.lp-sec{padding:var(--sec) 0;position:relative}
.lp-sec+.lp-sec::before{content:"";position:absolute;top:0;left:50%;translate:-50% 0;width:min(72%,920px);height:1px;background:linear-gradient(90deg,transparent,rgba(216,176,106,.45),transparent)}
.lp-head{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:end;margin-bottom:48px}
.lp-head .body{margin-top:0}
.lp-sec .h-sec{font-size:clamp(32px,3.6vw,54px)}

/* numbered step / feature tiles */
.tiles{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:14px}
.tile{position:relative;padding:28px 24px 26px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(180deg,rgba(20,26,42,.55),rgba(8,10,16,.7));overflow:hidden;isolation:isolate;transition:border-color .4s,transform .4s}
.tile::before{content:"";position:absolute;inset:auto -30% -60% auto;width:70%;aspect-ratio:1;z-index:-1;background:radial-gradient(circle,rgba(216,176,106,.16),transparent 65%);transition:opacity .4s;opacity:.6}
.tile:hover{border-color:var(--line2);transform:translateY(-4px)}
.tile:hover::before{opacity:1}
.tile .n{font:500 11px/1 var(--f);letter-spacing:.2em;color:var(--gold)}
.tile h3{font:400 17px/1.3 var(--f);text-transform:uppercase;letter-spacing:.04em;margin:14px 0 10px;text-wrap:balance}
.tile p{color:var(--muted);font-size:14.5px;line-height:1.6;text-wrap:pretty}

/* comparison table */
.cmp{width:100%;border-collapse:collapse;font-size:15px}
.cmp th,.cmp td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cmp thead th{font:500 11px/1.3 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.cmp td:first-child{color:var(--muted)}
.cmp .us{background:rgba(216,176,106,.06);color:var(--ink)}
.cmp thead .us{color:var(--gold2)}
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);-webkit-overflow-scrolling:touch}

/* price card */
.price-card{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;padding:44px;border-radius:20px;border:1px solid var(--line2);
  background:radial-gradient(70% 90% at 100% 0%,rgba(216,176,106,.14),transparent 60%),linear-gradient(180deg,rgba(18,22,36,.8),rgba(8,10,16,.9));box-shadow:0 50px 120px -60px rgba(216,176,106,.55)}
.price-card .big{font:300 clamp(44px,5vw,72px)/1 var(--f);letter-spacing:-.01em}
.price-card .big em{font:500 12px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-style:normal;vertical-align:1.6em;margin-right:8px}
.price-card .big small{font:400 18px var(--f);color:var(--muted)}
.price-card .new{margin-top:14px;font:500 12px/1.4 var(--f);letter-spacing:.08em;color:var(--gold2)}
.price-card ul{list-style:none}
.price-card li{padding:9px 0 9px 24px;position:relative;color:var(--muted);border-bottom:1px solid var(--line)}
.price-card li::before{content:"";position:absolute;left:3px;top:17px;width:6px;height:6px;border:1px solid var(--gold);transform:rotate(45deg)}
.price-card .btn{margin-top:28px}

/* tools (calculators, checkers) */
.tool{padding:34px;border-radius:20px;border:1px solid var(--line);background:rgba(10,13,22,.75)}
.tool label{display:grid;gap:8px;font:500 10.5px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.tool input,.tool select{width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;color:var(--ink);font:400 16px/1.4 var(--f);padding:13px 14px;min-height:48px}
.tool input:focus,.tool select:focus{outline:none;border-color:var(--gold)}
.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tool-out{margin-top:26px;padding-top:22px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tool-out b{display:block;font:300 clamp(28px,3vw,42px)/1 var(--f);color:var(--gold2)}
.tool-out span{display:block;margin-top:8px;font-size:13px;color:var(--muted)}
.check{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer;color:var(--ink)}
.check input{appearance:none;flex:none;width:22px;height:22px;min-height:0;padding:0;margin-top:2px;border:1px solid var(--line2);border-radius:6px;background:none;cursor:pointer;display:grid;place-items:center}
.check input:checked{background:linear-gradient(135deg,#f3d9a0,#d8a957);border-color:transparent}
.check input:checked::after{content:"";width:6px;height:11px;border:solid #1a1004;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}

/* CTA band + siblings */
.lp-cta{position:relative;overflow:hidden;padding:var(--sec) 0;text-align:center;isolation:isolate}
.lp-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:url(img/cta_portal.webp) center 40%/cover no-repeat;opacity:.45;-webkit-mask-image:linear-gradient(180deg,transparent,#000 35%);mask-image:linear-gradient(180deg,transparent,#000 35%)}
.lp-cta .cta-row{justify-content:center}
.siblings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:40px;text-align:left}
.sib{display:block;padding:20px 22px;border-radius:var(--r);border:1px solid var(--line);background:rgba(10,13,22,.7);text-decoration:none;transition:border-color .3s}
.sib:hover{border-color:var(--line2)}
.sib span{font:500 10.5px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.sib b{display:block;margin-top:10px;font:400 16px/1.35 var(--f)}
.note{font-size:13px;color:var(--dim);margin-top:18px;max-width:70ch}

@media (max-width:1020px){
  .lp-head,.price-card{grid-template-columns:1fr;gap:24px}
  .tiles{--cols:2!important}
  .siblings,.tool-grid,.tool-out{grid-template-columns:1fr}
  .price-card{padding:30px 24px}
}
@media (max-width:640px){
  .lp-hero{min-height:0;padding:110px 0 56px;align-items:flex-end}
  .lp-hero-bg{background-position:72% center;opacity:.55}
  .lp-hero::after{background:linear-gradient(0deg,#05060a 10%,rgba(5,6,10,.7) 60%,rgba(5,6,10,.4) 100%)}
  .lp-hero .h-hero{font-size:clamp(34px,10vw,44px)}
  .tiles{--cols:1!important}
  .tool{padding:22px 16px}
  .lp-head{margin-bottom:28px}
  .cmp{font-size:14px}.cmp th,.cmp td{padding:12px}
}
.nc{text-transform:none}

/* page: telegram-mini-app-game — image on top of a tile */
.tile-media{display:block;width:calc(100% + 48px);max-width:none;height:auto;margin:-28px -24px 22px;aspect-ratio:1024/500;object-fit:cover;border-bottom:1px solid var(--line)}

/* page: eu-ai-act-chatbot-compliance — checkbox rows inside .tool, fix list */
.tool label.check{display:flex;gap:14px;font:400 15.5px/1.5 var(--f);letter-spacing:0;text-transform:none;color:var(--ink)}
.tool .check input{width:22px;min-height:0;padding:0}
.fix-list{list-style:none;margin-top:18px}
.fix-list li{padding:9px 0 9px 24px;position:relative;color:var(--muted);font-size:14.5px;border-bottom:1px solid var(--line)}
.fix-list li::before{content:"";position:absolute;left:3px;top:17px;width:6px;height:6px;border:1px solid var(--gold);transform:rotate(45deg)}
.fix-list li.ok{color:var(--gold2)}
/* phones: stacked comparison cards */
@media (max-width:640px){
  .cmp-wrap{border:0;overflow:visible}
  .cmp,.cmp tbody,.cmp tr,.cmp td,.cmp th{display:block;width:100%}
  .cmp thead{display:none}
  .cmp tr{margin-bottom:12px;border:1px solid var(--line);border-radius:var(--r);background:rgba(10,13,22,.7);overflow:hidden}
  .cmp td,.cmp tbody th{border-bottom:1px solid var(--line);padding:12px 16px}
  .cmp tr>*:first-child{font:500 13px/1.3 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);background:rgba(216,176,106,.06)}
  .cmp tr>*:last-child{border-bottom:0}
  .cmp td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;margin-bottom:4px;font:500 10px/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
  .cmp .us{background:rgba(216,176,106,.08)}
}
/* v3: hero on the grid, art pushed right; mobile eyebrows */
.lp-hero>.wrap{width:100%}
.lp-hero-bg{background-position:right center}
@media (min-width:1021px){.lp-hero .h-hero{max-width:min(15ch,46vw)}.lp-hero .hero-sub{max-width:min(52ch,44vw)}}
@media (max-width:640px){.lp-hero .eyebrow{display:block;line-height:1.6}.lp-hero .eyebrow::before{display:none}}
.note{margin-top:28px}
/* v4: cinematic image band between sections */
.lp-band{position:relative;height:clamp(260px,38vw,520px);overflow:hidden;isolation:isolate;margin:0}
.lp-band img{position:absolute;left:0;top:-12%;width:100%;height:124%;object-fit:cover;will-change:transform}
.lp-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#05060a 0%,rgba(5,6,10,0) 28%,rgba(5,6,10,0) 72%,#05060a 100%)}
.lp-band figcaption{position:absolute;left:0;right:0;bottom:12%;z-index:2;text-align:center;font:500 12px/1 var(--f);letter-spacing:.32em;text-transform:uppercase;color:var(--gold2)}
.dust{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0}
@media (max-width:640px){.lp-band{height:220px}}
#ckLevel{font-size:clamp(20px,2vw,28px);line-height:1.15;padding-top:8px}
@media (max-width:640px){.lp-band figcaption{letter-spacing:.18em;padding:0 24px;line-height:1.6}}

/* v6: round-2 pass */
@media (min-width:1021px){
  .lp-hero-bg{left:40%;right:-2%;top:-4%;bottom:-4%;background-position:center;-webkit-mask-image:linear-gradient(90deg,transparent,#000 24%);mask-image:linear-gradient(90deg,transparent,#000 24%)}
  .lp-hero .h-hero{font-size:clamp(38px,4vw,64px);max-width:min(19ch,50vw)}
}
@media (max-width:640px){
  .lp-hero{flex-direction:column;align-items:stretch;padding-top:64px}
  .lp-hero-bg{position:relative;inset:auto;height:40svh;opacity:1!important;background-position:center;margin-bottom:-10svh;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
  .lp-hero::after{background:none}
}
.lp-sec+.lp-sec::before{width:min(100% - 2*var(--pad),1320px);background:var(--line);box-shadow:none}
.lp-cta::before{opacity:.3}
.lp-cta::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(48% 38% at 50% 36%,rgba(5,6,10,.8),transparent 72%)}
.tile .n,.sib span{font-size:11.5px}
.nc{letter-spacing:.02em}

/* v7: round-3 pass — tablet uses the phone hero layout */
@media (min-width:641px) and (max-width:1020px){
  .lp-hero{flex-direction:column;align-items:stretch;padding-top:80px;min-height:0}
  .lp-hero-bg{position:relative;inset:auto;aspect-ratio:16/9;height:auto;opacity:1!important;background-position:center;margin-bottom:-8%;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
  .lp-hero::after{background:none}
  .lp-hero .h-hero{font-size:clamp(44px,6.5vw,64px)}
}
@media (max-width:640px){.lp-hero-bg{height:clamp(200px,52vw,260px);background-position:50% 40%}}
@media (max-width:480px){.price-card .btn{white-space:nowrap;font-size:12px;padding-inline:20px}}
.tile .n{text-transform:uppercase;letter-spacing:.16em}
.lp-form{margin:40px auto 0;width:min(760px,100%);display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:26px;border-radius:18px;text-align:left;
  background:rgba(8,11,19,.72);border:1px solid var(--line2);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lp-form label{display:grid;gap:8px;font:500 11px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.lp-form .wide{grid-column:1/-1}
.lp-form input{width:100%;background:rgba(255,255,255,.045);border:1px solid rgba(216,176,106,.18);border-radius:10px;color:var(--ink);font:400 16px/1.4 var(--f);padding:13px 14px;min-height:48px;letter-spacing:0;text-transform:none}
.lp-form input:focus{outline:none;border-color:var(--gold)}
.lp-form .btn{grid-column:1/-1;justify-self:center}
.lp-form-note{grid-column:1/-1;text-align:center;font-size:13px;color:var(--dim)}
@media (max-width:640px){.lp-form{grid-template-columns:1fr;padding:20px 16px}.lp-form .btn{justify-self:stretch;justify-content:center}}

/* v9: round-4 pass */
.lp-form .err,.lp-form-note.err{color:#e8a27a}
.lp-form input[aria-invalid=true]{border-color:#e8a27a}
@media (max-width:640px){
  .lp-hero-bg{background-position:center top;height:clamp(230px,62vw,300px);-webkit-mask-image:linear-gradient(#000 55%,transparent 85%);mask-image:linear-gradient(#000 55%,transparent 85%)}
  .lp-hero .crumbs{padding-top:12px}
}
/* wide (5-col) comparison tables: stacked cards up to 900px */
@media (min-width:641px) and (max-width:900px){
  .cmp-wrap.has-wide{border:0;overflow:visible}
  .cmp.cmp-wide,.cmp.cmp-wide tbody,.cmp.cmp-wide tr,.cmp.cmp-wide td,.cmp.cmp-wide th{display:block;width:100%}
  .cmp.cmp-wide thead{display:none}
  .cmp.cmp-wide tr{margin-bottom:12px;border:1px solid var(--line);border-radius:var(--r);background:rgba(10,13,22,.7);overflow:hidden}
  .cmp.cmp-wide td,.cmp.cmp-wide tbody th{border-bottom:1px solid var(--line);padding:12px 16px}
  .cmp.cmp-wide tr>*:first-child{font:500 13px/1.3 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);background:rgba(216,176,106,.06)}
  .cmp.cmp-wide tr>*:last-child{border-bottom:0}
  .cmp.cmp-wide td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;margin-bottom:4px;font:500 10px/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
}

/* v10: round-5 pass */
/* compact price list on phones */
@media (max-width:640px){
  table.cmp[data-kind=price] tr{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:14px 16px;margin-bottom:8px;align-items:baseline}
  table.cmp[data-kind=price] tr>*{border:0!important;padding:0!important;background:none!important}
  table.cmp[data-kind=price] td::before{display:none!important}
  table.cmp[data-kind=price] tr>td:first-child{grid-column:1/-1;margin:2px 0 6px;font:500 11px/1 var(--f)!important;letter-spacing:.2em!important;color:var(--gold)!important}
  table.cmp[data-kind=price] tr.same-cat>td:first-child{display:none}
  table.cmp[data-kind=price] td:nth-child(2){grid-column:1;font-size:13px;color:var(--muted);line-height:1.45}
  table.cmp[data-kind=price] td:nth-child(2) b{display:block;font:400 15.5px/1.3 var(--f);color:var(--ink);margin-bottom:2px}
  table.cmp[data-kind=price] td:nth-child(3){grid-column:2;grid-row:2;text-align:right;white-space:nowrap;font:400 15px/1.3 var(--f);color:var(--ink)}
  table.cmp[data-kind=price] td:nth-child(4){grid-column:1/-1;font:500 12px/1.3 var(--f);color:var(--gold2)}
  table.cmp[data-kind=price] td:nth-child(4)::after{content:" new customers"}
}
/* option cards (phones only) */
.opt-cards{display:none}
@media (max-width:640px){
  .cmp-wrap.has-opt{display:none}
  .opt-cards{display:grid;gap:12px}
  .opt{border:1px solid var(--line);border-radius:var(--r);background:rgba(10,13,22,.7);padding:18px 16px}
  .opt.us{border-color:var(--line2);background:linear-gradient(180deg,rgba(216,176,106,.1),rgba(10,13,22,.8) 40%);box-shadow:0 30px 70px -40px rgba(216,176,106,.6)}
  .opt h4{font:500 13px/1.3 var(--f);letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);margin-bottom:10px}
  .opt p{padding:9px 0;border-top:1px solid var(--line);font-size:14px;color:var(--ink);line-height:1.45}
  .opt p span{display:block;font:500 10px/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
  /* secondary CTA becomes a quiet text link under the form */
  .lp-cta .cta-row{order:3;margin-top:18px!important}
  .lp-cta .wrap{display:flex;flex-direction:column}
  .lp-cta .cta-row .btn-line{border:0;background:none;width:auto;min-height:44px;padding:8px 0;text-decoration:underline;text-underline-offset:4px;align-self:center}
}
@media (max-width:640px){
  table.cmp[data-kind=price] td:nth-child(2){grid-row:2}
  table.cmp[data-kind=price] td:nth-child(3){grid-row:2;align-self:start}
  table.cmp[data-kind=price] td:nth-child(4){grid-row:3}
}
.hp{display:none!important}

/* "How should we reply?" chips */
.reply-via{border:0;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.reply-via legend{letter-spacing:.14em;text-transform:uppercase;color:#a3a7ad;margin-bottom:10px;width:100%}
.reply-via label{position:relative;display:inline-block;cursor:pointer}
.reply-via input{position:absolute;opacity:0;width:1px;height:1px}
.reply-via span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:999px;border:1px solid rgba(241,239,233,.26);color:#d3d1ca;letter-spacing:.02em;text-transform:none}
.reply-via input:checked+span{background:#ecd8ae;border-color:#ecd8ae;color:#17130b}
.reply-via input:focus-visible+span{outline:2px solid #ecd8ae;outline-offset:2px}
.handle[hidden]{display:none!important}
label em{font-style:normal;text-transform:none;letter-spacing:0;color:#8b95aa;font-weight:400}

.reply-via legend{font-family:inherit;font-size:11.5px;font-weight:500;line-height:1}
.reply-via span{font-family:inherit;font-size:14px;font-weight:500;line-height:1}

/* r3: tap targets + type floors */
.foot-links a{display:inline-block;padding:11px 0}
.foot-legal a{display:inline-block;padding:12px 4px}
.cmp td[data-label]::before,.opt p span{font-size:12px!important}
.eyebrow,.crumbs,.tag,.tile .n{font-size:12px!important}

.opt h3{font:500 13px/1.3 var(--f);letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);margin-bottom:10px}

/* r4: type floors on guides */
.tool label,.lp-form label{font-size:12px!important;letter-spacing:.1em!important}
.cmp thead th{font-size:12px!important;letter-spacing:.1em!important}

/* r5 */
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.reply-via legend,.tile .n,.sib span,.foot-tag,.qn-chip,.qn-search span,table.cmp[data-kind=price] tr>td:first-child{font-size:12px!important}
.foot-legal a,footer a[href*="privacy"]{display:inline-block;padding:12px 6px}
.reply-via label{min-height:32px;display:inline-flex;align-items:center}
.sent-msg{display:none;max-width:640px;margin:26px auto 0;padding:18px 20px;border:1px solid rgba(236,216,174,.45);border-radius:14px;text-align:center}
.sent-msg:target{display:block}
[aria-invalid=true],[aria-invalid=true]:focus,[aria-invalid=true]:focus-visible{border-color:#e8836f!important;box-shadow:0 0 0 1px #e8836f!important;outline-color:#e8836f!important}
.lp-sent{max-width:640px;margin:34px auto 0;padding:34px 30px;background:rgba(10,12,15,.82);border:1px solid rgba(236,216,174,.45);border-radius:20px;text-align:left}
.lp-sent .k{font:500 12px/1 var(--f,sans-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.lp-sent h3{font:400 clamp(34px,4vw,52px)/1.05 var(--serif,'Source Serif 4',Georgia,serif);margin:14px 0 12px}
.lp-sent b,.lp-sent a{color:var(--gold2)}.lp-sent b{font-weight:500}.lp-sent .while{margin-top:14px;font-size:14.5px;color:var(--muted)}
.lp-sent:focus{outline:none}
.lp-form input,.lp-form textarea,.lp-form fieldset{scroll-margin-top:110px}

/* lp4.css */
/* v4 skin for the SEO landing pages: editorial luxury over a looping "nature + technology" film.
   Loaded after ../../style.css and ../../lp.css — only overrides, so all page tools keep working. */
@font-face{font-family:'Source Serif 4';src:url(../fonts/SourceSerif4-opsz-normal.woff2) format('woff2');font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:'Source Serif 4';src:url(../fonts/SourceSerif4-opsz-italic.woff2) format('woff2');font-weight:200 900;font-style:italic;font-display:swap}
:root{--serif:'Source Serif 4',Georgia,serif;--gold:#d9bf8c;--gold2:#ecd8ae;--bg:#0a0c0f}
html,body{background:#0a0c0f}
body{background:transparent}
body::after{display:none}

/* background film */
.bgv-wrap{position:fixed;inset:0;z-index:0;overflow:hidden;background:#07090b}
.bgv-wrap video,.bgv-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bgv-wrap video{opacity:0;transition:opacity 1.4s ease}
.bgv-wrap.on video{opacity:1}
.bgv-wrap::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(8,10,13,.88) 0%,rgba(8,10,13,.62) 40%,rgba(8,10,13,.3) 72%,rgba(8,10,13,.45) 100%),linear-gradient(0deg,rgba(8,10,13,.75),transparent 40%)}
main,.footer,.nav,.mnav{position:relative;z-index:1}
.nav{position:fixed;z-index:50}
.mnav{position:fixed;z-index:45}
.lp-hero-bg{display:none!important}
.lp-hero::after{display:none}
.lp-band{display:none}

/* type: editorial serif headlines */
.h-hero,.h-sec{font-family:var(--serif)!important;font-weight:400!important;text-transform:none!important;letter-spacing:-.02em!important}
.lp-hero .h-hero{font-size:clamp(44px,5.6vw,92px)!important;line-height:.98!important;max-width:16ch}
.h-sec{font-size:clamp(34px,4.2vw,64px)!important;line-height:1.02!important}
.gold{font-style:italic}
.split .gold .w>span{background:none!important;color:var(--gold2)!important;-webkit-text-fill-color:var(--gold2)}
.h-sec .gold,.h-hero .gold{color:var(--gold2)}
.tile h3,.sib b,.case h3{font-family:var(--serif);font-weight:400;text-transform:none;letter-spacing:0;font-size:24px}
.faq summary{font-family:var(--serif);font-size:21px}
.logo-vl{font-family:var(--serif);font-weight:400}

/* glass panels so text stays readable over moving video */
.lp-sec{padding:clamp(80px,11vh,140px) 0}
.lp-sec+.lp-sec::before{display:none}
.tile,.cmp-wrap,.price-card,.tool,.faq-list,.sib,.opt,.lp-form{background:rgba(12,14,18,.62)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:rgba(241,239,233,.16)!important}
.btn{background:var(--gold2)!important;color:#17130b!important;box-shadow:none!important}
.btn-line{border-color:rgba(241,239,233,.3)!important;color:#f1efe9!important}
.lp-cta::before{display:none}
.dust{display:none}
@media (max-width:640px){
  .bgv-wrap::after{background:linear-gradient(0deg,rgba(8,10,13,.92) 0%,rgba(8,10,13,.7) 55%,rgba(8,10,13,.5) 100%)}
  .lp-hero .h-hero{font-size:clamp(38px,11vw,52px)!important}
}
@media (prefers-reduced-motion:reduce){.bgv-wrap video{display:none}}
/* r1: nav/buttons/grid match the v4 homepage */
.nav{padding-left:max(clamp(20px,5vw,72px),calc((100% - 1280px)/2 + clamp(20px,5vw,72px)))!important;padding-right:max(clamp(20px,5vw,72px),calc((100% - 1280px)/2 + clamp(20px,5vw,72px)))!important}
.nav-links a,.btn,.btn-line,.nav-cta{text-transform:none!important;letter-spacing:.03em!important;font-size:14.5px!important;font-weight:500!important}
.nav-cta{background:var(--gold2)!important;color:#17130b!important;border-color:var(--gold2)!important}
.nav kbd{display:none!important}
.wrap{max-width:1280px;padding-left:clamp(20px,5vw,72px);padding-right:clamp(20px,5vw,72px)}
.logo-vl{font-size:30px}.logo-st{padding-left:10px;border-left:1px solid rgba(217,191,140,.5)}
.price-card .big{font-family:var(--serif)!important;font-weight:400!important;letter-spacing:-.02em}
.lp-form textarea{width:100%;background:rgba(255,255,255,.045);border:1px solid rgba(216,176,106,.18);border-radius:10px;color:#f1efe9;font:400 16px/1.4 var(--f);padding:13px 14px}
.crumbs a{display:inline-block;padding:10px 0}
@media (max-width:640px){.lp-hero{padding-top:104px!important}.lp-hero .crumbs{padding-top:0}}

/* r2: guides keep a faint atmosphere after the hero, consistent menus */
.lp-sec:nth-of-type(even){background:radial-gradient(70% 60% at 85% 20%,rgba(217,191,140,.06),transparent 70%)}
.price-card,.lp-cta{position:relative;isolation:isolate}
.lp-cta::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 60% at 50% 30%,rgba(120,160,220,.08),transparent 70%)}
.mnav a{font-family:var(--serif)!important;text-transform:none!important;letter-spacing:0!important;font-size:34px!important}
.mnav .btn{font:500 15px/1 var(--f,inherit)!important}

.tool label,.lp-form label{font-size:12px!important}

/* r5: text that sits directly on the background film gets its own soft scrim */
.lp-head,.lp-sec .note,.lp-sec>.wrap>.body{position:relative;isolation:isolate}
.lp-head::before{content:"";position:absolute;inset:-28px -40px;z-index:-1;border-radius:24px;background:radial-gradient(120% 100% at 0% 50%,rgba(8,10,13,.82),rgba(8,10,13,.35) 70%,transparent)}
.lp-sec .note{background:rgba(10,12,15,.72);border-radius:12px;padding:12px 16px}
.lp-sec p,.lp-sec li{text-shadow:0 1px 14px rgba(0,0,0,.7)}

.lp-sec p a,.lp-sec li a,.prose a{padding-block:4px}
.logo-st,.nav .qn-search span,.qn-search-label{font-size:12px!important}
.chip.mute{background:rgba(216,176,106,.14)!important;border-color:rgba(216,176,106,.45)!important;color:#ecd8ae!important;opacity:1!important}
@media (max-width:1020px){.lp-hero .wrap{background:radial-gradient(120% 90% at 30% 50%,rgba(8,10,12,.72),rgba(8,10,12,.35) 70%,transparent);border-radius:18px}}
.foot-about{max-width:560px;margin:14px auto 0;color:var(--muted,#a3a7ad);font-size:14px;line-height:1.6;text-align:center}
.lp-head::after{content:"";position:absolute;inset:-28px -40px;z-index:-1;border-radius:24px;background:radial-gradient(120% 100% at 100% 50%,rgba(8,10,13,.72),rgba(8,10,13,.3) 70%,transparent)}
@media (max-width:640px){.foot-legal .nw{display:inline}}
.footer{position:relative;isolation:isolate}
.footer::before{content:"";position:absolute;inset:-60px 0 0;z-index:-1;background:linear-gradient(180deg,transparent,rgba(8,10,12,.78) 60px,rgba(8,10,12,.88));pointer-events:none}
.foot-about{flex-basis:100%;max-width:none;margin:0;text-align:left;order:3}
@media (min-width:641px) and (max-width:1020px){.tiles>:last-child:nth-child(odd){grid-column:1/-1}}

/* ===== type system 2026-10-18 (same roles as the homepage) ===== */
:root{--ink:#f1efe9;--ink2:#cfccc4;--muted:#9a978f;--dim:#9a978f;--gold:#e2c28a;--gold2:#e8c48d}
.h-hero,.h-sec{font-optical-sizing:auto;text-wrap:balance}
p,li,td{text-wrap:pretty}
.lp-hero .h-hero{font-size:clamp(44px,6vw,92px)!important;line-height:1.03!important;letter-spacing:-.015em!important}
.h-sec{font-size:clamp(34px,4.2vw,56px)!important;line-height:1.08!important;letter-spacing:-.01em!important}
.h-sec .gold,.split.h-sec .gold .w>span{font-style:normal!important;color:inherit!important;-webkit-text-fill-color:currentColor!important}
.lp-cta .h-sec .gold,.lp-cta .split .gold .w>span{font-style:italic!important;color:var(--gold2)!important;-webkit-text-fill-color:var(--gold2)!important}
.eyebrow{font:500 11px/1 var(--f)!important;letter-spacing:.28em!important;text-transform:uppercase;color:var(--gold)}
.hero-sub{font-weight:300;font-size:clamp(18px,1.4vw,20px);line-height:1.6;letter-spacing:.005em;color:var(--ink2)}
.body,.lp-sec p,.lp-sec li,td{color:var(--ink2)}
.body,.lp-sec p,.lp-sec li{font-size:17px;line-height:1.65}
.tile h3,.card h3,.lp-sec h3{font-family:var(--serif);font-weight:400;letter-spacing:-.005em}
@media (max-width:640px){.lp-hero .h-hero{font-size:clamp(40px,11vw,48px)!important}.body,.lp-sec p,.lp-sec li{font-size:16px}}

/* quicknav.css */
/* =========================================================================
   VL Studio — QuickNav v1  (pairs with quicknav.js)
   Mega menu · ⌘K palette · active-section nav · progress hairline ·
   mobile quick bar · LP price chip · back-to-top · optional side rail.
   Uses tokens from style.css: --bg --bg2 --panel --line --line2 --ink
   --muted --dim --gold --gold2 --f --pad --r
   ========================================================================= */
:root{
  --qn-ease:cubic-bezier(.2,.7,.2,1);
  --qn-glass:rgba(8,10,17,.97);
  --qn-hi:rgba(216,176,106,.10);
  --qn-bar-h:62px;
}

/* ---------- active section in the top nav ---------- */
.nav-links a,.qn-mm-trigger{position:relative}
.nav-links a[aria-current="location"],.nav-links a[aria-current="page"]{color:var(--gold2)}
.nav-links a::after,.qn-mm-trigger::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .45s var(--qn-ease)}
.nav-links a[aria-current="location"]::after,.qn-mm-trigger[data-current]::after{transform:scaleX(1)}

/* ---------- scroll progress hairline (bottom edge of nav) ---------- */
.qn-progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;opacity:0;transition:opacity .4s}
.nav.scrolled .qn-progress{opacity:1}
.qn-progress i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(var(--qn-p,0));
  background:linear-gradient(90deg,rgba(216,176,106,.15),var(--gold) 70%,var(--gold2));box-shadow:0 0 10px rgba(243,217,160,.55)}

/* ---------- search trigger in nav (desktop) ---------- */
.qn-search-btn{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 8px 0 14px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--muted);font:500 12px/1 var(--f);letter-spacing:.16em;text-transform:uppercase;
  transition:border-color .25s,color .25s,background .25s}
.qn-search-btn:hover{border-color:var(--line2);color:var(--gold2);background:var(--qn-hi)}
.qn-search-btn svg{width:15px;height:15px}
.qn-kbd,.qn kbd{font:500 10.5px/1 var(--f);letter-spacing:.04em;color:var(--muted);border:1px solid var(--line);border-bottom-width:2px;
  border-radius:6px;padding:4px 6px;background:rgba(255,255,255,.03);text-transform:none}

/* ---------- mega menu ---------- */
.qn-mm-trigger{display:inline-flex;align-items:center;gap:7px;background:none;border:0;cursor:pointer;padding:0;
  font:500 12px/1 var(--f);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.qn-mm-trigger:hover,.qn-mm-trigger[aria-expanded="true"],.qn-mm-trigger[data-current]{color:var(--gold2)}
.qn-mm-trigger svg{width:9px;height:9px;transition:transform .35s var(--qn-ease)}
.qn-mm-trigger[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav.qn-mega-open{background:rgba(5,6,10,.94);border-color:var(--line)}
.qn-mega{position:absolute;left:0;right:0;top:100%;padding:0 var(--pad);pointer-events:none}
.qn-mega[hidden]{display:none}
.qn-mega-in{pointer-events:auto;max-width:1240px;margin:10px auto 0;display:grid;grid-template-columns:minmax(230px,.9fr) 2fr minmax(240px,.95fr);gap:12px;
  padding:14px;border-radius:20px;background:var(--qn-glass);border:1px solid var(--line);
  box-shadow:0 40px 120px -30px rgba(0,0,0,.9),0 0 0 1px rgba(216,176,106,.06) inset;
  opacity:0;transform:translateY(-8px) scale(.985);transform-origin:50% 0;transition:opacity .28s var(--qn-ease),transform .4s var(--qn-ease)}
.qn-mega[data-open] .qn-mega-in{opacity:1;transform:none}
.qn-scrim{position:fixed;inset:0;z-index:59;background:rgba(3,4,7,.55);opacity:0;pointer-events:none;transition:opacity .35s}
.qn-scrim[data-on]{opacity:1}
.qn-col{padding:14px 12px}
.qn-h{font:500 10.5px/1 var(--f);letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:4px 8px 14px;display:flex;align-items:center;gap:10px}
.qn-h::before{content:"";width:18px;height:1px;background:var(--gold)}
.qn-col ul{list-style:none}
.qn-svc{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 10px;border-radius:10px;text-decoration:none;transition:background .2s}
.qn-svc b{font:400 14.5px/1.3 var(--f);color:var(--ink);letter-spacing:.01em}
.qn-svc span{font:500 10.5px/1 var(--f);letter-spacing:.1em;color:var(--muted);white-space:nowrap;transition:color .2s}
.qn-svc:hover,.qn-svc:focus-visible{background:var(--qn-hi)}
.qn-svc:hover span,.qn-svc:focus-visible span{color:var(--gold2)}
.qn-more{display:inline-block;margin:12px 10px 0;font:500 12px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--gold2);text-decoration:none;padding-bottom:6px;border-bottom:1px solid var(--line2)}
.qn-col-guides{border-left:1px solid var(--line);border-right:1px solid var(--line)}
.qn-guides{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}
.qn-guide{display:flex;align-items:center;gap:12px;padding:8px;border-radius:12px;text-decoration:none;transition:background .2s}
.qn-guide img{width:58px;height:45px;flex:none;border-radius:8px;object-fit:cover;background:var(--bg2);border:1px solid var(--line);transition:border-color .25s,transform .5s var(--qn-ease)}
.qn-guide small{display:block;font:500 12px/1 var(--f);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.qn-guide b{display:block;font:400 13.5px/1.3 var(--f);color:var(--ink)}
.qn-guide:hover,.qn-guide:focus-visible{background:var(--qn-hi)}
.qn-guide:hover img,.qn-guide:focus-visible img{border-color:var(--line2);transform:scale(1.04)}
.qn-guide[aria-current="page"] b{color:var(--gold2)}
.qn-feature{position:relative;overflow:hidden;border-radius:14px;padding:22px 20px;display:flex;flex-direction:column;
  border:1px solid var(--line2);background:radial-gradient(90% 70% at 70% 0%,rgba(216,176,106,.16),transparent 60%),var(--bg2)}
.qn-feature::before{content:"";position:absolute;right:-30px;top:-30px;width:150px;height:150px;background:var(--img) center/contain no-repeat;opacity:.35;pointer-events:none}
.qn-feature .qn-h{margin-left:0}
.qn-feature b{position:relative;font:300 24px/1.1 var(--f);text-transform:uppercase;letter-spacing:.01em;margin-top:6px}
.qn-feature p{position:relative;color:var(--muted);font-size:13.5px;line-height:1.55;margin:12px 0 18px}
.qn-feature .btn{align-self:flex-start;min-height:44px;padding:0 20px;font-size:12px}
.qn-feature .qn-hint{margin-top:auto;padding-top:18px;background:none;border:0;cursor:pointer;color:var(--muted);font:400 12.5px/1 var(--f);
  display:flex;align-items:center;gap:8px;text-align:left}
.qn-feature .qn-hint:hover{color:var(--gold2)}
.qn-feature .qn-hint svg{width:15px;height:15px;flex:none}
.qn-kbd{white-space:nowrap}

/* ---------- command palette ---------- */
.qn-pal{position:fixed;inset:0;z-index:70;display:flex;justify-content:center;align-items:flex-start;padding:min(14vh,140px) 16px 16px}
.qn-pal[hidden]{display:none}
.qn-pal-scrim{position:absolute;inset:0;background:rgba(3,4,7,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .25s}
.qn-pal-box{position:relative;width:min(680px,100%);max-height:min(620px,calc(100dvh - 120px));display:flex;flex-direction:column;overflow:hidden;
  border-radius:18px;background:var(--qn-glass);border:1px solid var(--line);
  box-shadow:0 50px 140px -30px rgba(0,0,0,.95),0 0 0 1px rgba(216,176,106,.08) inset,0 -1px 0 rgba(243,217,160,.18) inset;
  opacity:0;transform:translateY(-10px) scale(.98);transition:opacity .22s var(--qn-ease),transform .35s var(--qn-ease)}
.qn-pal[data-open] .qn-pal-scrim{opacity:1}
.qn-pal[data-open] .qn-pal-box{opacity:1;transform:none}
.qn-pal-box::before{content:"";position:absolute;left:12%;right:12%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold2),transparent);opacity:.7}
.qn-pal-head{display:flex;align-items:center;gap:12px;padding:6px 14px 6px 18px;border-bottom:1px solid var(--line)}
.qn-pal-head svg{width:18px;height:18px;color:var(--gold);flex:none}
.qn-pal-input{flex:1;min-width:0;height:58px;background:none;border:0;outline:0;color:var(--ink);font:300 19px/1 var(--f);letter-spacing:.01em}
.qn-pal-input::placeholder{color:var(--dim)}
.qn-pal-input::-webkit-search-cancel-button{display:none}
.qn-pal-close{flex:none;background:none;border:0;cursor:pointer;padding:6px}
.qn-pal-list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:6px 8px 10px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.qn-grp-h{font:500 10px/1 var(--f);letter-spacing:.26em;text-transform:uppercase;color:var(--dim);padding:16px 12px 8px}
.qn-opt{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:11px;cursor:pointer;scroll-margin:40px;position:relative}
.qn-opt[aria-selected="true"]{background:var(--qn-hi)}
.qn-opt[aria-selected="true"]::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--gold)}
.qn-ico{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;border:1px solid var(--line);color:var(--gold);background:rgba(255,255,255,.02);overflow:hidden}
.qn-ico svg{width:16px;height:16px}
.qn-ico img{width:100%;height:100%;object-fit:cover}
.qn-tx{flex:1;min-width:0}
.qn-tx b{display:block;font:400 15px/1.3 var(--f);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qn-tx small{display:block;margin-top:3px;font-size:12.5px;line-height:1.4;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qn-tx mark{background:none;color:var(--gold2);box-shadow:inset 0 -1px 0 var(--line2)}
.qn-meta{flex:none;font:500 12px/1 var(--f);letter-spacing:.06em;color:var(--gold2);white-space:nowrap}
.qn-enter{flex:none;opacity:0;transition:opacity .15s}
.qn-opt[aria-selected="true"] .qn-enter{opacity:1}
.qn-empty{padding:34px 16px 30px;text-align:center;color:var(--muted);font-size:14.5px}
.qn-empty a{color:var(--gold2)}
.qn-pal-foot{display:flex;gap:18px;align-items:center;padding:10px 18px;border-top:1px solid var(--line);color:var(--dim);font-size:12px}
.qn-pal-foot span{display:inline-flex;align-items:center;gap:6px}
.qn-pal-foot .qn-count{margin-left:auto}
.qn-lock{overflow:hidden}

/* ---------- LP: "jump to price" chip in the nav (desktop) ---------- */
.qn-chip{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 16px;border-radius:999px;text-decoration:none;
  border:1px solid var(--line2);background:rgba(216,176,106,.08);color:var(--gold2);font:500 12px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .35s,transform .45s var(--qn-ease),background .25s}
.qn-chip[data-on]{opacity:1;transform:none;pointer-events:auto}
.qn-chip:hover{background:rgba(216,176,106,.16)}
.qn-chip i{font-style:normal;letter-spacing:0}

/* ---------- back to top (desktop) ---------- */
.qn-top{position:fixed;right:calc(var(--pad) - 6px);bottom:28px;z-index:50;width:48px;height:48px;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;color:var(--gold2);background:rgba(8,10,17,.7);border:1px solid var(--line2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .35s,transform .45s var(--qn-ease),background .25s}
.qn-top[data-on]{opacity:1;transform:none;pointer-events:auto}
.qn-top:hover{background:rgba(216,176,106,.14)}
.qn-top svg{width:16px;height:16px}

/* ---------- optional side rail (desktop, home) ---------- */
.qn-rail{position:fixed;right:18px;top:50%;z-index:50;transform:translate(0,-50%);list-style:none;display:flex;flex-direction:column;gap:4px;
  opacity:0;pointer-events:none;transition:opacity .4s}
.qn-rail[data-on]{opacity:1;pointer-events:auto}
.qn-rail a{display:flex;align-items:center;justify-content:flex-end;gap:12px;height:26px;text-decoration:none;color:var(--muted);font:500 10px/1 var(--f);letter-spacing:.22em;text-transform:uppercase}
.qn-rail a span{opacity:0;transform:translateX(6px);transition:opacity .25s,transform .35s var(--qn-ease)}
.qn-rail a i{width:7px;height:7px;border-radius:50%;border:1px solid var(--line2);transition:background .3s,transform .3s}
.qn-rail:hover a span,.qn-rail a:focus-visible span{opacity:1;transform:none}
.qn-rail a[aria-current="location"]{color:var(--gold2)}
.qn-rail a[aria-current="location"] i{background:var(--gold);transform:scale(1.35);box-shadow:0 0 10px rgba(243,217,160,.6)}

/* ---------- mobile quick-action bar ---------- */
.qn-bar{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:54;display:none;
  height:var(--qn-bar-h);padding:6px;border-radius:20px;gap:4px;align-items:stretch;
  background:rgba(8,10,17,.86);border:1px solid var(--line);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);
  box-shadow:0 20px 60px -20px rgba(0,0,0,.9);transform:translateY(calc(100% + 24px));transition:transform .45s var(--qn-ease)}
.qn-bar[data-on]{transform:none}
.qn-bar a,.qn-bar button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:14px;
  text-decoration:none;background:none;border:0;cursor:pointer;color:var(--muted);font:500 12px/1 var(--f);letter-spacing:.06em;text-transform:none;
  -webkit-tap-highlight-color:transparent;transition:color .2s,background .2s}
.qn-bar svg{width:18px;height:18px}
.qn-bar [aria-current="location"]{color:var(--gold2);background:var(--qn-hi)}
.qn-bar .qn-bar-cta{flex:1.5;flex-direction:row;gap:8px;color:#1a1004;font-size:12px;letter-spacing:.14em;background:linear-gradient(95deg,#f3d9a0,#d8a957 60%,#b98238)}
.qn-bar .qn-bar-cta[aria-current="location"]{color:#1a1004}
.qn-bar small{display:block;font:500 12px/1 var(--f);letter-spacing:.06em;color:var(--gold2);text-transform:none}

/* ---------- mobile menu upgrade (#mnav) ---------- */
.mnav.qn-enh{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;padding-top:calc(96px + env(safe-area-inset-top));padding-bottom:calc(40px + env(safe-area-inset-bottom))}
.mnav.qn-enh>*{flex-shrink:0}
.mnav.qn-enh>a:not(.btn){font-size:clamp(26px,7.6vw,34px)}
.mnav.qn-enh>a[aria-current="location"]{color:var(--gold2)}
.qn-msearch{display:flex;align-items:center;gap:12px;width:100%;height:52px;padding:0 16px;margin:0 0 18px;border-radius:14px;cursor:pointer;
  background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);font:400 15px/1 var(--f);text-align:left}
.qn-msearch svg{width:17px;height:17px;color:var(--gold)}
.qn-mgroup{margin-top:34px;padding-top:24px;border-top:1px solid var(--line)}
.qn-mgroup .qn-h{margin-left:0}
.qn-mguides{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}
.qn-mguides a{display:block;padding:9px 0;font:400 14px/1.3 var(--f);color:var(--ink);text-decoration:none;text-transform:none;letter-spacing:0;border-bottom:1px solid var(--line)}
.qn-mguides a[aria-current="page"]{color:var(--gold2)}

/* ---------- breakpoints ---------- */
@media (max-width:1020px){
  .qn-bar{display:flex}
  .qn-search-btn,.qn-chip,.qn-top,.qn-mega,.qn-rail{display:none!important}
  .qn-pal{padding:calc(12px + env(safe-area-inset-top)) 10px 10px}
  .qn-pal-box{max-height:calc(100dvh - 24px - env(safe-area-inset-top))}
  .qn-pal-foot{display:none}
  .qn-pal-input{font-size:17px}   /* ≥16px: no iOS zoom */
}
@media (max-width:1180px){.qn-rail{display:none}}
@media (min-width:1021px) and (max-width:1240px){
  .qn-search-btn .qn-lbl{display:none}
  .nav-links{gap:24px}
  .qn-mega-in{grid-template-columns:1fr 2fr}
  .qn-feature{display:none}
}
@media (max-width:380px){.qn-mguides{grid-template-columns:1fr}}

/* the section we land on receives programmatic focus — no ring for that */
[data-qn-focus]:focus{outline:none}

@media (prefers-reduced-motion:reduce){
  .qn-mega-in,.qn-pal-box,.qn-pal-scrim,.qn-scrim,.qn-chip,.qn-top,.qn-bar,.qn-rail,.qn-rail a span,.nav-links a::after,.qn-mm-trigger::after,.qn-guide img{transition:none!important}
  .qn-mega-in,.qn-pal-box{transform:none!important}
}

/* r2: calmer, consistent nav + quick bar */
.qn-bar .qn-bar-cta{text-transform:none!important;letter-spacing:.02em!important;font-size:13px!important}
.qn-trigger,.nav .qn-trigger,[data-qn-trigger]{text-transform:none!important;letter-spacing:.04em!important;font-weight:400!important;font-size:14px!important}

.qn-mm-trigger{text-transform:none!important;letter-spacing:.04em!important;font-weight:400!important;font-size:14.5px!important}

.qn-search-btn .qn-lbl,.qn-dock span{font-size:12px}
.qn-mguides{grid-template-columns:1fr}.qn-mguides a{font:400 16px/1.35 var(--f)}
.mnav .qn-mguides a{font:400 16px/1.35 var(--f)!important;letter-spacing:0!important;padding:11px 0!important}
.nav-links a{display:inline-block;padding-block:7px}