/*
Theme Name: Skypeak Digital 2026
Theme URI: https://skypeakdigital.com
Author: Skypeak Digital
Description: Search-first redesign for Skypeak Digital.
Version: 1.0.0
Text Domain: skypeak2
*/

/* Layout: an ascent. Flat sky, layered ridgelines that drift and parallax, content climbs from base camp to summit. Navy, ice blue, white, one summit yellow for the action. */
:root{
  --ink:#0f1e2e; --r1:#1c3349; --r2:#2d4d6b; --r3:#4a7196; --sky:#d7e8f5; --paper:#fbfcfd; --mute:#475a6b; --summit:#ffc93c;
  --display:'Bricolage Grotesque','Helvetica Neue',Arial,sans-serif;
  --body:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --m:32px; --h:64px; --tb:36px; --hh:calc(var(--h) + var(--tb));
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.on-dark :focus-visible{outline-color:var(--summit)}
.wrap{padding-left:max(var(--m),env(safe-area-inset-left,0px));padding-right:max(var(--m),env(safe-area-inset-right,0px))}
.in{max-width:1280px;margin:0 auto}
.d{font-family:var(--display);letter-spacing:-.035em}
svg.i{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 26px;background:var(--summit);color:var(--ink);font-weight:700;font-size:16px;border-radius:999px;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-3px);background:#ffd45f}
.btn.dark{background:var(--ink);color:var(--paper)}.btn.dark:hover{background:var(--r2)}
.h2{font-family:var(--display);font-weight:800;font-size:clamp(24px,2.7vw,38px);letter-spacing:-.04em;line-height:.98;text-wrap:balance}
.lede{font-size:17px;line-height:1.45;max-width:46ch;color:var(--mute)}
.small{font-size:13px}

/* header */
.top{position:fixed;z-index:50;top:0;left:0;right:0;background:var(--paper)}
.tb{height:var(--tb);background:var(--ink);color:#c9d8e6;font-size:13px}
.tb .in{height:100%;display:flex;justify-content:space-between;align-items:center;gap:16px}
.tb span+span{margin-left:20px}
.nv{height:var(--h);display:flex;align-items:center;justify-content:space-between}
.logo{font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:-.04em;display:flex;align-items:center;gap:9px}
.logo svg{width:28px;height:20px;flex:none}.lg-bg{fill:var(--lgbg,#0f1e2e)}.lg-front{fill:var(--lgf,#f4f8fb)}.lg-back{fill:#5b86ad}.lg-cap{fill:#ffc93c}.f-grid .logo{--lgbg:#f4f8fb;--lgf:#0f1e2e}
nav{display:flex;align-items:center;gap:2px}
nav>a:not(.btn),nav>button{padding:8px 14px;font-weight:500;font-size:16px;border-radius:999px;transition:background .2s}
nav>a:not(.btn):hover,nav>button:hover,nav>button[aria-expanded=true]{background:var(--sky)}
nav .btn{height:42px;margin-left:10px}
.menu-toggle{display:none}
.chev{display:inline-block;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:8px;transition:transform .25s}
[aria-expanded=true]>.chev{transform:rotate(225deg) translate(-2px,0)}
.mega{position:fixed;z-index:49;top:var(--hh);left:0;right:0;background:var(--paper);border-top:1px solid #d3dde6;padding-top:28px;padding-bottom:34px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .22s,transform .22s,visibility .22s;max-height:calc(100svh - var(--hh));overflow-y:auto}
.mega.open{opacity:1;visibility:visible;transform:none}
.mega-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:36px;max-width:1280px;margin:0 auto}
.mg-head{display:flex;align-items:center;gap:12px;background:var(--sky);padding:13px 16px;border-radius:12px;font-family:var(--body);font-weight:800;font-size:17px;margin-bottom:10px}
.mg-head svg{width:22px;height:22px}
.mg-list a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:16px;font-weight:500;transition:background .15s,transform .2s}
.mg-list a:hover{background:var(--sky);transform:translateX(3px)}
.mg-list svg{width:20px;height:20px;color:var(--r3);flex:none}
.mg-note{background:var(--ink);color:var(--paper);border-radius:12px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.mg-note p{font-family:var(--body);font-size:18px;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.new{display:inline-block;margin-left:8px;font-size:11px;font-weight:700;background:var(--summit);color:var(--ink);padding:2px 8px;border-radius:999px;letter-spacing:.04em;vertical-align:2px}
.scrim{position:fixed;inset:0;z-index:48;background:rgba(15,30,46,.4);opacity:0;visibility:hidden;transition:opacity .22s}.scrim.on{opacity:1;visibility:visible}

/* hero */
.hero{--rg:clamp(150px,19vw,280px);position:relative;background:var(--sky);color:var(--ink);min-height:max(82svh,620px);padding-top:calc(var(--hh) + 7vh);padding-bottom:calc(var(--rg) + 28px);overflow:hidden}
.hero .in{position:relative;z-index:2}
.hero h1{font-family:var(--display);font-weight:800;font-size:clamp(32px,4.4vw,64px);letter-spacing:-.04em;line-height:.98;max-width:12ch}
.hero h1 span{display:block;overflow:hidden;padding-bottom:.08em}.hero h1 b{display:block;font-weight:800}
.hero p.lede{margin-top:28px;color:var(--ink)}
.audit{margin-top:32px;display:flex;gap:8px;flex-wrap:wrap;max-width:720px;background:var(--paper);padding:8px;border-radius:999px}
.audit input{flex:1 1 180px;min-width:0;height:48px;border:0;background:transparent;padding:0 18px;font-size:16px;outline:0}
.audit input:focus-visible{outline:0}
.audit:focus-within{outline:3px solid var(--ink)}
.audit-msg{margin-top:12px;font-size:14px;min-height:1.4em}
#ridge{position:absolute;left:0;right:0;bottom:0;width:100%;height:var(--rg,220px);z-index:1;display:block}

/* sections */
section{position:relative}
.pad{padding-block:clamp(64px,10vh,112px)}
.dark-s{background:var(--ink);color:var(--paper)}
.sky-s{background:var(--sky)}

/* journey */
.journey{background:var(--ink);color:var(--paper);position:relative;overflow:hidden}
.j-top{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:end}
.j-top .lede{color:#b5c7d8}
.stats{margin-top:72px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.stat b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(34px,3.8vw,54px);letter-spacing:-.06em;line-height:.9;color:var(--summit);white-space:nowrap}
.stat span{display:block;margin-top:12px;font-size:15px;color:#c9d8e6}
.conf{margin-top:40px;font-size:13px;color:#8aa3b8}

/* services */
.svc{display:grid;grid-template-columns:4fr 8fr;gap:56px;align-items:start}
.svc{align-items:stretch}.svc-l{display:flex;flex-direction:column}
.svc-l .lede{margin-top:24px}
.rows a{display:grid;grid-template-columns:1fr auto;gap:8px 24px;padding:26px 0;border-top:1px solid #c7d4df;transition:padding .25s,background .2s}
.rows a:last-child{border-bottom:1px solid #c7d4df}
.rows a:hover{padding-left:20px;background:var(--sky)}
.rows h3{font-family:var(--body);font-weight:700;font-size:clamp(17px,1.5vw,21px);letter-spacing:-.02em;line-height:1.15}
.rows p{grid-column:1;color:var(--mute);max-width:52ch}
.rows .go{grid-row:1/3;grid-column:2;align-self:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;transition:transform .25s,background .2s}
.rows a:hover .go{transform:rotate(-45deg);background:var(--summit);color:var(--ink)}

/* why */
.why-grid{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:56px 40px}
.why-grid h3{font-family:var(--body);font-weight:800;font-size:20px;letter-spacing:-.015em;line-height:1.2;margin-bottom:10px}
.why-grid p{color:var(--mute)}
.why-grid svg{width:36px;height:36px;margin-bottom:20px;color:var(--r3)}

/* climb (process tabs) */
.climb{display:grid;grid-template-columns:4fr 8fr;gap:56px;margin-top:64px;align-items:stretch}
.meter{position:relative;padding-left:40px}
.meter::before{content:"";position:absolute;left:11px;top:14px;bottom:14px;width:4px;background:#2f4a63;border-radius:4px}
.meter-fill{position:absolute;left:11px;top:14px;width:4px;background:var(--summit);border-radius:4px;transition:height .5s cubic-bezier(.7,0,.2,1)}
.meter button{display:block;width:100%;text-align:left;padding:14px 0;font-family:var(--body);font-weight:600;font-size:17px;letter-spacing:-.01em;color:#8aa3b8;position:relative;transition:color .2s}
.meter button::before{content:"";position:absolute;left:-37px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:var(--ink);border:4px solid #2f4a63;transition:border-color .3s,background .3s}
.meter button[aria-selected=true]{color:var(--paper)}
.meter button[aria-selected=true]::before,.meter button.done::before{border-color:var(--summit);background:var(--summit)}
.panel{background:var(--r1);border-radius:24px;padding:44px;display:flex;flex-direction:column;justify-content:space-between;min-height:420px}
.panel h3{font-family:var(--body);font-weight:800;font-size:clamp(26px,2.8vw,38px);letter-spacing:-.03em;line-height:1.05}
.panel p{margin-top:24px;font-size:20px;max-width:44ch;color:#d3e0ec;line-height:1.45}
.panel ul{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;font-size:16px}
.panel li{padding-left:22px;position:relative;color:#c9d8e6}
.panel li::before{content:"";position:absolute;left:0;top:.6em;width:10px;height:10px;border-radius:50%;background:var(--summit)}

/* industries */
.ind-flow{margin-top:56px;font-family:var(--body);font-weight:700;font-size:clamp(19px,2vw,28px);letter-spacing:-.025em;line-height:1.2}
.ind-flow button{color:#7e94a8;transition:color .2s;text-align:left}
.ind-flow button:hover,.ind-flow button.on{color:var(--ink)}
.ind-desc{margin-top:36px;min-height:3.2em;font-size:20px;max-width:56ch}

/* proof */
.logos{margin-top:48px;display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.logos div{height:84px;background:var(--paper);border-radius:12px;display:grid;place-items:center;color:#8aa3b8;font-size:13px;font-weight:700;letter-spacing:.04em}
.cases{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.case{background:var(--ink);color:var(--paper);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.case canvas{width:100%;aspect-ratio:4/3;display:block}
.case div{padding:24px}
.case h3{font-family:var(--body);font-weight:800;font-size:20px;letter-spacing:-.015em;line-height:1.2}
.case p{margin-top:8px;color:#b5c7d8;font-size:15px}
.badges{margin-top:40px;display:flex;gap:12px;flex-wrap:wrap}
.badges span{padding:12px 20px;background:var(--paper);border-radius:999px;font-weight:700;font-size:14px}

/* faq */
.faq-in{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:start}
.faq details{border-top:1px solid #c7d4df;padding:22px 0}
.faq details:last-child{border-bottom:1px solid #c7d4df}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--body);font-weight:600;font-size:17px;letter-spacing:-.01em;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:32px;font-weight:400;transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:14px;max-width:54ch;color:var(--mute)}

/* cta + footer */
.cta{background:var(--summit);color:var(--ink);overflow:hidden;padding-block:clamp(72px,12vh,140px)}
.cta h2{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.6vw,52px);letter-spacing:-.04em;line-height:1;max-width:12ch}
.cta .row{margin-top:40px;display:flex;gap:32px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.cta p{font-size:20px;max-width:34ch}
.contact{display:grid;gap:4px;font-size:18px;font-weight:500}
footer{background:var(--ink);color:#c9d8e6;padding-top:72px}
.f-grid{display:grid;grid-template-columns:4fr 2fr 3fr 2fr;gap:40px;font-size:15px}
.f-grid b{display:block;color:var(--paper);margin-bottom:14px;font-family:var(--body);font-size:17px}
.f-grid li{padding:3px 0}.f-grid a:hover{color:var(--summit)}
.f-grid .logo{color:var(--paper);margin-bottom:16px}
.f-legal{margin-top:64px;padding-block:24px;border-top:1px solid #2f4a63;display:flex;justify-content:space-between;gap:16px;font-size:13px}

/* service page */
#service .hero{min-height:0;padding-top:calc(var(--hh) + 56px)}
.back{font-weight:700;font-size:15px}.back:hover{text-decoration:underline;text-underline-offset:5px}
#service h1{margin-top:44px;max-width:14ch}
.s-grid{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:start}
.s-list li{padding:24px 0;border-top:1px solid #c7d4df;font-family:var(--body);font-weight:700;font-size:clamp(19px,1.8vw,24px);letter-spacing:-.015em;line-height:1.2}
.s-list li:last-child{border-bottom:1px solid #c7d4df}
.s-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:56px}
.s-steps div{background:var(--r1);border-radius:20px;padding:28px;min-height:200px;display:flex;flex-direction:column;justify-content:space-between;color:var(--paper)}
.s-steps h3{font-family:var(--body);font-weight:800;font-size:20px;letter-spacing:-.015em;line-height:1.2}
.s-steps p{font-size:15px;color:#b5c7d8;margin-top:16px}

.anim [data-r]{opacity:0;transform:translateY(30px)}


@media (max-width:960px){
  .mega-grid{grid-template-columns:1fr}
  .j-top,.svc,.climb,.faq-in,.s-grid{grid-template-columns:1fr;gap:32px}
  .svc-l{position:static}
  .stats{grid-template-columns:1fr 1fr}
  .why-grid{grid-template-columns:1fr 1fr}
  .logos{grid-template-columns:repeat(3,1fr)}
  .cases{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr 1fr}
  .s-steps{grid-template-columns:1fr 1fr}
  .panel ul{grid-template-columns:1fr}
}
@media (max-width:760px){
  :root{--m:20px;--tb:0px}
  .tb{display:none}
  nav>.desk{display:none}.menu-toggle{display:inline-flex}
  .hero{padding-top:calc(var(--hh) + 36px)}
  .audit{border-radius:24px}.audit .btn{width:100%;justify-content:center}
  .why-grid{grid-template-columns:1fr}
  .panel{padding:28px}.meter button{font-size:20px}
  .logos{grid-template-columns:repeat(2,1fr)}
  .f-grid{grid-template-columns:1fr}
  .s-steps{grid-template-columns:1fr}
  .f-legal{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.anim [data-r]{opacity:1;transform:none}}

/* WordPress extras */
body.admin-bar .top{top:32px}body.admin-bar .mega{top:calc(var(--hh) + 32px)}
.sr{position:absolute;left:-9999px}
.prose{max-width:760px;font-size:18px;line-height:1.65}
.prose h2,.prose h3{font-family:var(--body);letter-spacing:-.03em;line-height:1.1;margin:1.6em 0 .5em}
.prose p,.prose ul,.prose ol{margin:0 0 1.1em}.prose ul{list-style:disc;padding-left:1.2em}.prose a{text-decoration:underline;text-underline-offset:3px}
.pg-hero{background:var(--sky);padding-top:calc(var(--hh) + 56px);padding-bottom:56px}
.pi{display:none;height:100%;flex-direction:column;justify-content:space-between}.pi.on{display:flex}
.audit-msg.ok{font-weight:700}
.hp{position:absolute;left:-9999px}

h3,h4,h5,h6{font-family:var(--body);font-weight:700;letter-spacing:-.01em}
.hero .lede,.lede{font-size:clamp(16px,1.3vw,19px)}
.nav a,.nav button{font-size:15px}
.btn{font-size:15px}
.cform{display:grid;gap:16px;max-width:560px;margin-top:28px}.cform label{display:grid;gap:6px;font-weight:600;font-size:14px}
.cform input,.cform select,.cform textarea{font:inherit;padding:12px 14px;border:1px solid #c7d4df;border-radius:10px;background:#fff;color:var(--ink)}
.cform .btn{justify-self:start;border:0;cursor:pointer}
.prose .faq details{border-top:1px solid #c7d4df;padding:16px 0}.prose .faq summary{cursor:pointer;font-weight:700}
.prose h3{font-size:16px}.prose h2{font-size:20px}
.prose{font-size:16px}

/* logo */
.logo span{white-space:nowrap}.logo em{font-style:normal;font-weight:500;color:var(--mute)}
.footer .logo em,.foot .logo em,footer .logo em{color:#b5c7d8}
/* progress */
#sp{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--summit);transform-origin:0 50%;transform:scaleX(0);z-index:90}
/* word reveal */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}.w>span{display:inline-block}
/* services viz */
.viz{position:sticky;top:calc(var(--hh) + 28px);margin-top:36px;background:var(--ink);color:var(--paper);border-radius:20px;padding:20px;max-width:380px;overflow:hidden}
.v-q{display:flex;align-items:center;gap:10px;background:#1c3349;border-radius:999px;padding:10px 16px;font-size:13px;color:#d5e2ee}
.v-q i{width:12px;height:12px;border:2px solid var(--summit);border-radius:50%;flex:none;position:relative}
.v-q i:after{content:"";position:absolute;width:2px;height:6px;background:var(--summit);right:-4px;bottom:-5px;transform:rotate(-45deg)}
.v-q span{overflow:hidden;white-space:nowrap;width:0;animation:vtype 3.6s steps(32) .4s infinite alternate}
.v-q u{width:2px;height:16px;background:var(--summit);animation:vblink .9s steps(1) infinite;margin-left:-6px}
@keyframes vtype{to{width:100%}}@keyframes vblink{50%{opacity:0}}
.v-res{list-style:none;margin:14px 0 0;padding:0;position:relative;height:176px}
.v-res li{position:absolute;left:0;right:0;height:38px;display:flex;align-items:center;gap:10px;background:#16293b;border-radius:10px;padding:0 12px;font-size:13px;color:#9fb6c9;top:0}
.v-res li:nth-child(1){top:0}.v-res li:nth-child(2){top:46px}.v-res li:nth-child(3){top:92px}.v-res li:nth-child(4){top:138px}
.v-res s{width:22px;height:22px;border-radius:6px;background:#2d4d6b;flex:none}
.v-res .you{background:var(--summit);color:var(--ink);font-weight:700}.v-res .you s{background:var(--ink)}
.v-res .you em{margin-left:auto;font-style:normal;font-size:11px;background:var(--ink);color:var(--summit);padding:2px 8px;border-radius:999px}
.v-ai{margin-top:12px;background:var(--paper);color:var(--ink);border-radius:14px;padding:14px;opacity:.25;transform:translateY(10px) scale(.97)}
.v-ai b{display:block;font-size:12px;margin-bottom:8px}
.v-ai span{display:block;height:7px;border-radius:4px;background:#d5e2ee;margin-bottom:7px}.v-ai .l1{width:92%}.v-ai .l2{width:76%}.v-ai .l3{width:54%}
.v-ai .src{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;background:var(--summit);padding:4px 10px;border-radius:999px;margin-top:4px}
.v-spark{position:absolute;right:18px;top:62px;animation:vspin 6s linear infinite;opacity:.9}
@keyframes vspin{50%{transform:scale(.7) rotate(90deg)}100%{transform:rotate(180deg)}}
/* journey growth line */
.grow{position:absolute;left:0;right:0;bottom:0;width:100%;height:46%;opacity:.55;pointer-events:none}
.journey .in{position:relative;z-index:2}
.stat .bar{display:block;height:3px;background:var(--summit);margin-top:16px;transform-origin:0 50%;transform:scaleX(0);border-radius:2px}
/* marquee */
.marq{overflow:hidden;margin:28px -40px 8px;border-block:1px solid #c7d4df;padding:14px 0}
.mq{display:flex;gap:44px;width:max-content;font-weight:700;font-size:clamp(17px,2vw,26px);letter-spacing:-.02em;white-space:nowrap}
.mq span:nth-child(3n){color:var(--mute);font-weight:500}
/* work cards */
.work{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 20px;margin-top:40px}
.wk{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:230px;padding:22px;border-radius:20px;overflow:hidden;color:var(--paper);transition:transform .3s}
.wk0{background:#16293b}.wk1{background:#2d4d6b}.wk2{background:#0f1e2e}
.wk svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:60%;fill:rgba(255,255,255,.08);transition:transform .5s}
.wk:hover{transform:translateY(-6px)}.wk:hover svg{transform:translateY(-8px) scale(1.04);fill:rgba(255,201,60,.35)}
.wk span{position:relative;font-size:13px;color:#b5c7d8}.wk b{position:relative;font-size:clamp(20px,2vw,28px);letter-spacing:-.02em}
/* climb (what you get) */
.cx-wrap{margin-top:36px}
.cx-svg{display:block;width:100%;height:auto;overflow:visible}
.cx-mt{fill:#e6eef5}.cx-base{fill:none;stroke:#c7d4df;stroke-width:3;stroke-dasharray:2 9;stroke-linecap:round}
.cx-line{fill:none;stroke:var(--ink);stroke-width:4;stroke-linecap:round}
.cx-dot{fill:var(--summit);stroke:var(--ink);stroke-width:3}
.cx-camp circle{fill:var(--paper);stroke:#c7d4df;stroke-width:3;transition:all .35s}.cx-camp text{font:700 14px var(--body);fill:var(--mute);transition:fill .3s}
.cx-camp.on circle{fill:var(--summit);stroke:var(--ink)}.cx-camp.on text{fill:var(--ink)}
.cx-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:10px}
.cx-c{border:1px solid #c7d4df;border-radius:16px;padding:20px;background:var(--paper);transition:transform .35s,border-color .35s,background .35s}
.cx-c span{font-size:12px;font-weight:700;color:var(--mute);letter-spacing:.04em}
.cx-c h3{margin-top:10px;font-size:16px;line-height:1.3}
.cx-c.on{transform:translateY(-8px);border-color:var(--ink);background:var(--sky)}
/* steps line */
.s-steps{position:relative}.s-steps:before{content:"";position:absolute;left:0;right:0;top:-18px;height:3px;background:#2d4d6b;border-radius:2px}
.s-steps:after{content:"";position:absolute;left:0;right:0;top:-18px;height:3px;background:var(--summit);border-radius:2px;transform-origin:0 50%;transform:scaleX(var(--p,0))}
.pg-hero .h2{font-size:clamp(24px,2.6vw,36px)}
@media (max-width:900px){.work{grid-template-columns:1fr 1fr}.cx-svg{display:none}.cx-cards{grid-template-columns:1fr}.viz{position:static;max-width:none}.marq{margin-inline:-20px}}
@media (max-width:560px){.work{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.v-q span{width:100%}.stat .bar{transform:none}}
.prose{max-width:720px;font-size:15px;line-height:1.65}
/* resources menu */
#resmenu{padding-top:24px;padding-bottom:28px}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1280px;margin:0 auto}
.res-c{background:var(--sky);border-radius:14px;padding:24px;display:block;transition:transform .25s,background .25s}
.res-c:hover{transform:translateY(-4px);background:#cfe0ee}
.res-c b{display:flex;align-items:center;gap:12px;font-size:17px;margin-bottom:12px}
.res-c .i{stroke:var(--ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.res-c p{color:var(--mute);font-size:15px;max-width:34ch}
/* reviews */
.rv-grid{columns:2;column-gap:20px;margin-top:8px;max-width:1100px}
.prose .rv-grid{max-width:none}
/* home reviewer marquee */
.rvm{margin:36px -40px 0;overflow:hidden;display:grid;gap:16px}
.rvm-t{display:flex;gap:16px;width:max-content}
.rvm-c{flex:none;width:340px;background:var(--paper);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:6px;transition:transform .25s}
.rvm-c:hover{transform:translateY(-4px)}
.rvm-c em{font-style:normal;font-size:14px;line-height:1.5;color:var(--ink);min-height:84px}
.rvm-c b{font-size:15px}.rvm-c span{font-size:13px;color:var(--mute)}
/* faq left */
.faq-l{position:sticky;top:calc(var(--hh) + 28px)}
.chat{margin-top:32px;display:grid;gap:12px;max-width:340px}
.cb{padding:12px 16px;border-radius:16px;font-size:14px;line-height:1.45;max-width:86%;opacity:0;transform:translateY(12px);animation:cbin .6s ease forwards}
.cb.q{background:var(--sky);justify-self:end;border-bottom-right-radius:4px}
.cb.a{background:var(--ink);color:var(--paper);border-bottom-left-radius:4px}
.cb:nth-child(1){animation-delay:.2s}.cb:nth-child(2){animation-delay:1.1s}.cb:nth-child(3){animation-delay:2s}.cb:nth-child(4){animation-delay:2.9s}
@keyframes cbin{to{opacity:1;transform:none}}
/* about */
.ab-facts{margin-top:40px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.ab-facts b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(40px,5vw,72px);letter-spacing:-.05em;line-height:.9;color:var(--ink)}
.ab-facts span{display:block;margin-top:12px;color:var(--mute);max-width:26ch}
.cmp{margin-top:36px;background:var(--paper);border-radius:20px;overflow:hidden}
.cmp-h,.cmp-r{display:grid;grid-template-columns:.8fr 1.2fr 1.4fr;gap:20px;padding:18px 24px;align-items:center}
.cmp-h{background:var(--ink);color:var(--paper);font-size:14px}.cmp-h .us{color:var(--summit)}
.cmp-r{border-top:1px solid #d9e3ec;font-size:15px}.cmp-r span{font-weight:700}.cmp-r p{color:var(--mute)}
.cmp-r .us{color:var(--ink);font-weight:600;display:flex;gap:8px;align-items:flex-start;background:#fff6d9;margin:-18px -24px -18px 0;padding:18px 24px}
.cmp-r .us svg{flex:none;margin-top:3px;color:#b8860b}
.offices{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:32px}
.offices>div{background:var(--sky);border-radius:20px;padding:28px}.offices h3{font-size:19px;margin-bottom:10px}.offices p{margin-top:8px;color:var(--mute)}
@media (max-width:900px){.rv-grid{columns:1}.ab-facts{grid-template-columns:1fr 1fr}.cmp-h{display:none}.cmp-h,.cmp-r{grid-template-columns:1fr}.cmp-r .us{margin:0 -24px -18px;}.offices{grid-template-columns:1fr}.res-grid{grid-template-columns:1fr}.faq-l{position:static}.rvm{margin-inline:-20px}}
/* wide pages + case study layouts */
.prose.wide{max-width:1180px}
.cs-idx{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.cs-card{display:flex;flex-direction:column;gap:8px;background:var(--sky);border-radius:18px;padding:22px;transition:transform .25s,background .25s;text-decoration:none!important}
.cs-card:hover{transform:translateY(-5px);background:#cfe0ee}
.cs-card span{font-size:12px;font-weight:700;letter-spacing:.05em;color:var(--mute)}.cs-card b{font-size:18px}.cs-card p{color:var(--mute);font-size:14px;margin:0}
.cs-wire{display:flex;gap:6px;margin-top:10px}.cs-wire i{flex:1;height:26px;border-radius:6px;background:#fff}.cs-wire i:nth-child(2n){background:var(--summit)}
.cs{margin-top:8px}.cs-note{background:#fff6d9;border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:28px}
.cs-tag{font-size:13px;font-weight:700;color:var(--mute);letter-spacing:.04em;margin-bottom:10px}
.cs-h1{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.4vw,46px);letter-spacing:-.035em;line-height:1.05;max-width:20ch}.cs-h1 span{color:#c98f00}
.cs-sub{font-size:18px;font-weight:600;margin-top:14px;max-width:44ch}
.cs-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:28px 0;padding:18px 0;border-block:1px solid #c7d4df}.cs-meta dt{font-size:12px;color:var(--mute)}.cs-meta dd{margin:2px 0 0;font-weight:700}
.cs-toc{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:20px 0;font-size:14px}.cs-toc a{text-decoration:underline}
.cs-img{margin:24px 0;border-radius:18px;background:linear-gradient(135deg,#dbe7f1,#c4d6e6);min-height:260px;display:grid;place-items:center;color:var(--mute);font-size:13px}
.cs-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0}.cs-tiles.two{grid-template-columns:repeat(2,1fr)}.cs-tiles.four{grid-template-columns:repeat(4,1fr)}
.cs-tiles>div{background:var(--ink);color:var(--paper);border-radius:18px;padding:24px}
.cs-tiles b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(32px,4vw,56px);letter-spacing:-.05em;line-height:1;color:var(--summit)}
.cs-tiles span{display:block;margin-top:10px;font-weight:600}.cs-tiles small{display:block;color:#9fb6c9;margin-top:2px}
.cs-sec{margin:40px 0}.cs-sec h2{font-size:22px;margin-bottom:12px;letter-spacing:-.02em}.cs-sec p{max-width:62ch;color:var(--mute)}.cs-sec ul{list-style:disc;padding-left:1.2em;color:var(--mute);display:grid;gap:6px;margin-top:10px}
.cs-bl b{color:var(--ink)}
.cs-q{margin:32px 0;padding:24px 28px;border-left:4px solid var(--summit);background:var(--sky);border-radius:0 16px 16px 0;font-size:18px;line-height:1.5;max-width:70ch}.cs-q cite{display:block;margin-top:10px;font-size:14px;font-style:normal;color:var(--mute)}
.cs-pil{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cs-pil>div{background:var(--sky);border-radius:16px;padding:22px}.cs-pil i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--paper);font-style:normal;font-weight:700;margin-bottom:12px}.cs-pil h3{font-size:16px;margin-bottom:6px}.cs-pil p{font-size:14px}
.cs-steps{list-style:none;padding:0!important;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;counter-reset:s}.cs-steps li{counter-increment:s;border:1px solid #c7d4df;border-radius:14px;padding:18px;position:relative}.cs-steps li:before{content:counter(s);display:block;font-weight:800;color:var(--summit);-webkit-text-stroke:1px var(--ink);font-size:26px}.cs-steps b{display:block}.cs-steps span{font-size:14px;color:var(--mute)}
.cs-tl{list-style:none;padding:0!important;display:grid;gap:0;border-left:3px solid var(--summit);margin-left:8px}.cs-tl li{padding:0 0 22px 22px;position:relative}.cs-tl li:before{content:"";position:absolute;left:-11px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--ink)}.cs-tl b{display:block}.cs-tl span{color:var(--mute)}
.cs-gv{display:grid;grid-template-columns:1fr 1fr;gap:12px}.cs-gv>div{border:1px solid #c7d4df;border-radius:14px;padding:18px}.cs-gv .ok{background:#fff6d9;border-color:var(--summit)}.cs-gv span{font-size:12px;font-weight:700;color:var(--mute)}.cs-gv p{margin:4px 0 0;color:var(--ink)}
.cs-chart{background:var(--sky);border-radius:18px;padding:20px}.cs-chart svg{width:100%;height:220px;display:block}.cs-area{fill:rgba(15,30,46,.12)}.cs-ln{fill:none;stroke:var(--ink);stroke-width:3;vector-effect:non-scaling-stroke}.cs-chart p{font-size:12px;margin-top:8px}
.cs-shots{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cs-ba{display:flex;align-items:center;gap:18px}.cs-ba>div:not(.to){flex:1;border-radius:18px;padding:24px;background:var(--sky)}.cs-ba .af{background:var(--ink);color:var(--paper)}.cs-ba b{display:block;font-family:var(--display);font-size:48px;letter-spacing:-.05em;line-height:1}.cs-ba .af b{color:var(--summit)}.cs-ba span{font-size:12px;font-weight:700}.cs-ba small{display:block}.cs-ba .to{font-size:28px}
.cs-rel{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cs-rel a{background:var(--sky);border-radius:16px;padding:20px;text-decoration:none!important;transition:transform .25s}.cs-rel a:hover{transform:translateY(-4px)}.cs-rel b{display:block;font-family:var(--display);font-size:34px;letter-spacing:-.04em}.cs-rel span{color:var(--mute);font-size:14px}
.cs-cta{margin:44px 0;background:var(--summit);border-radius:20px;padding:32px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.cs-cta h2{font-size:24px;margin:0}.cs-cta .btn{background:var(--ink);color:var(--paper)}
.cs-dark .cs-h1,.cs-dark .cs-tag{color:var(--ink)}
.cs-sky .cs-h1{background:var(--sky);padding:28px;border-radius:18px;max-width:none}
.cs-dark .cs-h1{background:var(--ink);color:var(--paper);padding:28px;border-radius:18px;max-width:none;text-transform:uppercase;font-size:clamp(24px,3vw,40px)}
@media (max-width:900px){.cs-idx,.cs-tiles,.cs-tiles.four,.cs-pil,.cs-rel,.cs-steps,.cs-meta,.cs-gv,.cs-shots{grid-template-columns:1fr}.cs-ba{flex-direction:column;align-items:stretch}.cs-tiles.two{grid-template-columns:1fr}}

/* v5: contrast guards, hero band, case thumbnails, reviews */
:where(.dark-s,.journey,.cs-darkbox) :where(h1,h2,h3,h4,b,strong){color:var(--paper)}
:where(.dark-s,.journey,.cs-darkbox) :where(p,li,span){color:#c9d8e6}
:where(.cta) :where(h1,h2,h3,p,span){color:var(--ink)}
.hero .lede{max-width:56ch}
.cs-idx{gap:22px}
.cs-card{padding:14px 14px 22px;gap:0;background:var(--sky)}
.cs-card:hover{background:#d4e5f2}
.cs-th{border-radius:12px;overflow:hidden;background:#fff;height:236px;display:flex;flex-direction:column;box-shadow:0 1px 0 rgba(15,30,46,.06)}
.th-bar{display:flex;align-items:center;gap:5px;padding:9px 12px;background:#e3ecf4;flex:none}
.th-bar u{width:7px;height:7px;border-radius:50%;background:#b5c7d8}
.th-bar em{margin-left:auto;font-style:normal;font-size:11px;font-weight:700;color:#4a6580}
.th-body{padding:0;flex:1;overflow:hidden;display:flex;flex-direction:column}
.th-hero{padding:16px 16px 14px;display:flex;flex-direction:column;gap:8px;flex:none}
.th-hero.h-light{background:#fff}.th-hero.h-sky{background:#cfe0ee}.th-hero.h-dark{background:#0f1e2e}
.th-rest{padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:#fff}
.th-card{display:block;border-radius:6px}
.t-tag{width:46px;height:6px;border-radius:9px;background:#ffc93c}
.t-h{display:flex;flex-direction:column;gap:5px}
.t-h s{display:block;height:11px;border-radius:4px;background:#0f1e2e;width:82%}.t-h s+s{width:54%}
.h-dark .t-h s{background:#f4f8fb}
.t-pct{display:flex;align-items:center;gap:8px}.t-pct i{width:56px;height:26px;border-radius:7px;background:#ffc93c}.t-pct s{flex:1;height:8px;border-radius:4px;background:#0f1e2e;opacity:.35}.h-dark .t-pct s{background:#f4f8fb}
.t-meta{display:flex;gap:10px}.t-meta i{flex:1;height:7px;border-radius:4px;background:#0f1e2e;opacity:.25}.h-dark .t-meta i{background:#f4f8fb}
.t-img{height:50px;border-radius:7px;background:#9fbdd6;position:relative;overflow:hidden}
.t-img::before{content:"";position:absolute;left:12%;bottom:0;width:46%;height:78%;background:#2d4d6b;clip-path:polygon(0 100%,50% 0,100% 100%)}
.t-img::after{content:"";position:absolute;left:44%;bottom:0;width:40%;height:56%;background:#0f1e2e;clip-path:polygon(0 100%,55% 0,100% 100%)}
.t-toc{display:flex;gap:6px}.t-toc i{flex:1;height:14px;border-radius:99px;background:#e3ecf4}.t-toc i:first-child{background:#ffc93c}
.t-tiles{display:grid;gap:8px}.t-tiles i{height:40px;border-radius:8px;background:#e3ecf4;position:relative}.t-tiles i::before{content:"";position:absolute;left:8px;top:9px;width:56%;height:12px;border-radius:4px;background:#0f1e2e}.t-tiles i::after{content:"";position:absolute;left:8px;bottom:8px;width:36%;height:5px;border-radius:3px;background:#7c95ab}
.t-tiles.res i{background:#ffc93c}.t-tiles.res i::after{background:#0f1e2e;opacity:.4}
.t-text{display:flex;flex-direction:column;gap:5px}.t-text i{height:6px;border-radius:3px;background:#b5c7d8}.t-text i:nth-child(1){width:34%;height:9px;background:#0f1e2e}.t-text i:nth-child(3){width:86%}.t-text i:nth-child(4){width:62%}
.t-quote{background:#ffc93c;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:5px}.t-quote i{height:7px;border-radius:3px;background:#0f1e2e}.t-quote i+i{width:60%;opacity:.6}
.t-bul{display:flex;flex-direction:column;gap:7px}.t-bul i{height:6px;border-radius:3px;background:#b5c7d8;margin-left:14px;position:relative}.t-bul i::before{content:"";position:absolute;left:-14px;top:-1px;width:8px;height:8px;border-radius:50%;background:#ffc93c}.t-bul i:nth-child(2){width:80%}.t-bul i:nth-child(3){width:66%}
.t-pil{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.t-pil i{height:58px;border-radius:8px;background:#e3ecf4;border-top:5px solid #ffc93c}
.t-steps{display:flex;align-items:center;justify-content:space-between;padding:4px 6px;position:relative}.t-steps::before{content:"";position:absolute;left:14px;right:14px;top:50%;height:3px;background:#cfe0ee;margin-top:-1px}.t-steps i{position:relative;width:20px;height:20px;border-radius:50%;background:#0f1e2e}.t-steps i:first-child{background:#ffc93c}
.t-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.t-cards i{height:62px;border-radius:8px;background:#e3ecf4;position:relative}.t-cards i::before{content:"";position:absolute;inset:6px 6px 24px;border-radius:5px;background:#9fbdd6}.t-cards i::after{content:"";position:absolute;left:8px;bottom:8px;width:60%;height:6px;border-radius:3px;background:#0f1e2e}
.t-tl{display:flex;justify-content:space-between;position:relative;padding:6px 4px}.t-tl::before{content:"";position:absolute;left:6px;right:6px;top:50%;height:3px;background:#cfe0ee;margin-top:-1px}.t-tl i{position:relative;width:12px;height:12px;border-radius:50%;background:#ffc93c;box-shadow:0 0 0 4px #fff}
.t-gv{display:grid;grid-template-columns:1fr 1fr;gap:8px}.t-gv i{height:48px;border-radius:8px;background:#e3ecf4}.t-gv i+i{background:#0f1e2e}
.t-chart{display:flex;align-items:flex-end;gap:6px;height:56px;padding:0 4px;background:#f1f6fa;border-radius:8px}.t-chart i{flex:1;background:#9fbdd6;border-radius:3px 3px 0 0}.t-chart i:nth-child(1){height:20%}.t-chart i:nth-child(2){height:30%}.t-chart i:nth-child(3){height:42%}.t-chart i:nth-child(4){height:56%}.t-chart i:nth-child(5){height:72%}.t-chart i:nth-child(6){height:94%;background:#ffc93c}
.t-shots{display:grid;grid-template-columns:1fr 1fr;gap:8px}.t-shots i{height:54px;border-radius:7px;background:#cfe0ee;border:5px solid #e3ecf4}
.t-ba{display:flex;align-items:center;gap:8px}.t-ba i{flex:1;height:44px;border-radius:8px;background:#e3ecf4}.t-ba i:last-child{background:#ffc93c}.t-ba s{width:16px;height:16px;border-radius:50%;background:#0f1e2e;flex:none}
.t-rel{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.t-rel i{height:34px;border-radius:7px;background:#e3ecf4}
.t-cta{background:#0f1e2e;border-radius:8px;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 14px}.t-cta i{width:44%;height:8px;border-radius:4px;background:#f4f8fb}.t-cta s{width:50px;height:20px;border-radius:99px;background:#ffc93c}
.cs-card .cs-t{margin:18px 6px 0;font-size:19px;line-height:1.2;font-family:var(--display);font-weight:800;letter-spacing:-.03em;color:var(--ink)}
.cs-card .cs-d{margin:8px 6px 0;color:#3d546a;font-size:14px;line-height:1.5}
.cs-card .cs-go{margin:16px 6px 0;font-weight:700;font-size:14px;display:inline-flex;gap:8px;align-items:center}
.cs-card .cs-go::after{content:"\2192";transition:transform .2s}.cs-card:hover .cs-go::after{transform:translateX(5px)}
/* reviews */
.rvp{max-width:1180px}
.rv-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:8px 0 0}
.rv-sum div{background:var(--ink);border-radius:18px;padding:26px 28px}
.rv-sum div:nth-child(2){background:var(--summit)}.rv-sum div:nth-child(3){background:var(--sky)}
.rv-sum b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(40px,5vw,68px);letter-spacing:-.05em;line-height:1;color:var(--paper)}
.rv-sum div:nth-child(n+2) b{color:var(--ink)}
.rv-sum span{display:block;margin-top:10px;font-size:15px;color:#c9d8e6}.rv-sum div:nth-child(n+2) span{color:var(--ink)}
.rvp h2.h2{margin:72px 0 24px}
.rv-vids{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.vw{position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--ink)}
.vw iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;inset:0;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:18px;color:#fff;transition:transform .5s}
.vid:hover{transform:scale(1.03)}
.vid:focus-visible{outline:3px solid var(--summit);outline-offset:-6px}
.vid::before{content:"";position:absolute;inset:0;background:rgba(15,30,46,.45)}
.vid b{position:relative;font-size:16px;line-height:1.3;max-width:20ch;color:#fff}
.vid .pl{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:var(--summit);display:grid;place-items:center;transition:transform .25s}
.vid:hover .pl{transform:scale(1.12)}
.vid .pl::after{content:"";margin-left:5px;border-left:18px solid var(--ink);border-top:11px solid transparent;border-bottom:11px solid transparent}
.rv-feat{background:var(--ink);border-radius:24px;padding:clamp(28px,4.5vw,64px);display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,56px);align-items:start;margin-bottom:18px}
.rv-feat .qm{font-family:var(--display);font-weight:800;font-size:clamp(90px,12vw,170px);line-height:.8;color:var(--summit)}
.rv-feat blockquote{margin:0;font-size:clamp(18px,1.9vw,26px);line-height:1.4;letter-spacing:-.015em;color:var(--paper);font-weight:500}
.rv-feat figcaption{margin-top:28px;display:flex;align-items:center;gap:14px;color:#c9d8e6;font-size:15px}
.rv-feat figcaption b{color:var(--paper);display:block;font-size:17px}
.rv-grid{columns:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:none}
.rv{margin:0;border-radius:22px;padding:26px;display:flex;flex-direction:column;background:var(--sky);transition:transform .25s}
.rv:hover{transform:translateY(-4px)}
.rv:nth-child(3n+2){background:#fff;box-shadow:0 0 0 2px var(--sky) inset}
.rv:nth-child(3n){background:#fff3cf}
.rv .rt{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.rv .rt span{font-size:12px;font-weight:700;padding:5px 11px;border-radius:99px;background:var(--ink);color:var(--paper)}
.rv .rt span+span{background:rgba(15,30,46,.1);color:var(--ink)}
.rv blockquote{flex:1;margin:0;font-size:15.5px;line-height:1.6;color:var(--ink)}
.rv figcaption{margin-top:24px;display:flex;align-items:center;gap:14px;font-size:14px}
.rv figcaption div span{color:#4a6580;display:block}.rv-feat figcaption div span{color:#c9d8e6}
.rv figcaption b{display:block;font-size:16px}
.av{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:17px;letter-spacing:-.02em;background:var(--ink);color:var(--summit)}
.rv:nth-child(3n+2) .av{background:var(--summit);color:var(--ink)}.rv:nth-child(3n) .av{background:#2d4d6b;color:#fff}
.rv-feat .av{width:56px;height:56px;background:var(--summit);color:var(--ink)}
.rv-end{margin-top:56px;background:var(--summit);border-radius:24px;padding:clamp(28px,4vw,52px);display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.rv-end p{font-family:var(--display);font-weight:800;font-size:clamp(24px,3vw,40px);letter-spacing:-.04em;line-height:1.05;max-width:18ch;margin:0;color:var(--ink)}
@media (max-width:900px){.rv-sum,.rv-vids,.rv-grid{grid-template-columns:1fr}.rv-feat{grid-template-columns:1fr}.rv-feat .qm{font-size:90px}}

/* v6: service pages, ten designs */
.sv-hero{padding-top:calc(var(--hh) + 56px);padding-bottom:clamp(56px,9vh,96px);overflow:hidden;position:relative}
.sv-ink{background:var(--ink);color:var(--paper)}.sv-sky,.sv-skybg{background:var(--sky);color:var(--ink)}.sv-sun,.sv-sunbg{background:var(--summit);color:var(--ink)}.sv-paper{background:var(--paper);color:var(--ink)}
.sv-hg{display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.sv-hero.flip .sv-ht{order:2}
.sv-ht h1{margin-top:36px;font-family:var(--display);font-weight:800;font-size:clamp(34px,4.4vw,62px);letter-spacing:-.04em;line-height:1;max-width:15ch}
.sv-ht .lede{margin-top:24px;max-width:46ch}
.sv-ink .sv-ht .lede{color:#c9d8e6}.sv-ink .back{color:var(--summit)}
.sv-cta{margin-top:32px}
.sv-vis{position:relative;min-width:0}
:where(.sv-ink) :where(h1,h2,h3,h4,b){color:var(--paper)}
:where(.sv-ink) :where(p,li){color:#c9d8e6}
.sv-sunbg .lede,.sv-skybg .lede{color:var(--ink)}
.sv-sig .lede{margin-top:14px;max-width:56ch}
/* 1 AI chat */
.ai{background:var(--r1);border-radius:24px;padding:20px}
.ai-chips{display:flex;gap:8px;flex-wrap:wrap}
.ai-chips button{font:inherit;font-size:13.5px;font-weight:600;padding:8px 14px;border-radius:99px;border:0;background:#2d4d6b;color:#fff;cursor:pointer;transition:background .2s,color .2s}
.ai-chips button.on{background:var(--summit);color:var(--ink)}
.ai-win{margin-top:16px;background:var(--paper);color:var(--ink);border-radius:18px;padding:22px;min-height:290px}
.ai-q{font-weight:700;font-size:17px;color:var(--ink)!important;min-height:1.5em}
.ai-t{margin-top:14px;font-size:15.5px;line-height:1.6;color:var(--ink)!important;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.ai-t mark{background:var(--summit);color:var(--ink);padding:0 4px;border-radius:4px;font-weight:700}
.ai-s{margin:16px 0 0;padding:0;list-style:none;display:grid;gap:6px;opacity:0;transition:opacity .5s .2s}
.ai-s li{font-size:13.5px;padding:8px 12px;border-radius:10px;background:var(--sky);color:var(--ink)!important;display:flex;gap:10px}
.ai-s li.you{background:var(--summit);font-weight:700}
.ai.done .ai-t,.ai.done .ai-s{opacity:1;transform:none}
.eng-b,.ab-b,.spec-b{display:inline-flex;background:#fff;border-radius:99px;padding:5px;margin-top:28px;box-shadow:0 0 0 2px var(--sky) inset}
.eng-b button,.ab-b button,.spec-b button{font:inherit;font-weight:700;font-size:15px;border:0;background:none;padding:10px 22px;border-radius:99px;cursor:pointer;color:var(--ink)}
.eng-b .on,.ab-b .on,.spec-b .on{background:var(--ink);color:var(--paper)}
.eng-g{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
.eng{background:var(--sky);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:16px;min-height:170px;justify-content:space-between}
.eng b{font-size:19px;font-family:var(--display);letter-spacing:-.03em}
.pill{align-self:flex-start;font-size:13px;font-weight:700;padding:5px 12px;border-radius:99px;background:#fff;color:var(--mute);transition:all .4s}
.eng.ok{background:var(--ink)}.eng.ok b{color:var(--paper)}.eng.ok .pill{background:var(--summit);color:var(--ink)}
.eb{height:8px;border-radius:99px;background:rgba(15,30,46,.12);overflow:hidden}.eb i{display:block;height:100%;width:12%;background:var(--ink);border-radius:99px;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.eng.ok .eb{background:rgba(255,255,255,.18)}.eng.ok .eb i{background:var(--summit);width:100%}
/* 2 agent */
.ag{background:var(--ink);border-radius:24px;padding:22px;color:var(--paper)}
.ag-top{display:flex;align-items:center;gap:10px;margin-bottom:16px}.ag-top b{color:var(--paper);font-size:16px}.ag-top span{margin-left:auto;font-size:13px;color:var(--summit);font-weight:700}
.dot{width:10px;height:10px;border-radius:50%;background:var(--summit);animation:pls 1.6s infinite}
@keyframes pls{50%{box-shadow:0 0 0 8px rgba(255,201,60,.2)}}
.ag-feed{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ag-feed li{display:flex;gap:12px;align-items:center;background:var(--r1);border-radius:12px;padding:13px 14px;font-size:14.5px;color:#c9d8e6;opacity:.25;transform:translateX(-10px);transition:all .5s}
.ag-feed li s{flex:none;width:18px;height:18px;border-radius:50%;background:#2d4d6b;transition:background .3s}
.ag-feed li.on{opacity:1;transform:none;color:#fff}.ag-feed li.on s{background:var(--summit)}
.dial-w{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,72px);align-items:center;margin-top:36px;position:relative}
.dial{width:clamp(220px,28vw,340px);transform:rotate(-90deg)}
.dial circle{fill:none;stroke-width:22}.d0{stroke:#1c3349}
.da{stroke:#2d4d6b;stroke-dasharray:120 445.5;stroke-dashoffset:var(--o);transition:stroke .3s}.da.on{stroke:var(--summit)}
.dial-c{position:absolute;left:0;top:0;width:clamp(220px,28vw,340px);height:clamp(220px,28vw,340px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:22%}
.dial-c span{font-size:13px;color:#9fb6ca;font-weight:700}.dial-t{font-family:var(--display);font-size:clamp(15px,1.6vw,20px);line-height:1.2;letter-spacing:-.02em;margin-top:6px}
.dial-l{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.dial-l button{font:inherit;width:100%;text-align:left;font-size:clamp(17px,1.7vw,22px);font-weight:700;letter-spacing:-.02em;padding:18px 22px;border-radius:16px;border:0;background:var(--r1);color:#c9d8e6;cursor:pointer;transition:all .25s}
.dial-l button.on,.dial-l button:hover{background:var(--summit);color:var(--ink)}
/* 3 serp */
.serp{background:#fff;border-radius:24px;padding:20px 20px 20px;box-shadow:0 20px 50px -30px rgba(15,30,46,.5)}
.serp-n{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px}.serp-n span{font-weight:700;font-size:14px}.serp-n b{font-family:var(--display);font-size:clamp(40px,5vw,64px);letter-spacing:-.05em;line-height:1}
.serp-l{position:relative;height:calc(5*70px)}
.sr{position:absolute;left:0;right:0;top:0;height:62px;transform:translateY(calc(var(--i)*70px));transition:transform .7s cubic-bezier(.3,.8,.2,1);display:flex;gap:12px;align-items:center;background:var(--sky);border-radius:14px;padding:0 16px}
.sr i{width:28px;height:28px;border-radius:8px;background:#fff;flex:none}.sr b{font-size:15px;display:block}.sr span{display:block;height:7px;width:150px;max-width:70%;background:rgba(15,30,46,.2);border-radius:4px;margin-top:6px}
.sr.you{background:var(--ink);z-index:2}.sr.you b{color:var(--paper)}.sr.you i{background:var(--summit)}.sr.you span{background:rgba(255,255,255,.3)}
/* 4 articles */
.arts{position:relative;height:380px}
.art{position:absolute;width:62%;background:#fff;border-radius:18px;padding:18px;box-shadow:0 20px 40px -24px rgba(15,30,46,.5);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.art i{display:block;height:110px;border-radius:10px;background:var(--sky)}.art b{display:block;height:12px;border-radius:5px;background:var(--ink);margin-top:14px;width:90%}.art b+b{width:60%;background:#b5c7d8;height:9px}.art s{display:block;margin-top:14px;width:70px;height:22px;border-radius:99px;background:var(--summit)}
.a1{left:0;top:30px;transform:rotate(-7deg)}.a2{left:19%;top:0;transform:rotate(2deg);z-index:2}.a3{left:38%;top:50px;transform:rotate(9deg)}
.arts:hover .a1{transform:rotate(-12deg) translateX(-22px)}.arts:hover .a3{transform:rotate(14deg) translateX(22px)}.arts:hover .a2{transform:rotate(0) translateY(-10px)}
.a2 i{background:var(--summit)}.a3 i{background:#2d4d6b}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:32px}
.cd{font-size:13px;text-align:center;padding:6px;color:var(--mute)}
.cc2{background:var(--sky);border-radius:12px;min-height:84px;padding:8px;display:flex;flex-direction:column;justify-content:space-between;gap:6px}
.cc2 span{font-size:12px;font-weight:700;color:var(--mute)}
.cc2 i{font-style:normal;font-size:12px;font-weight:700;padding:5px 8px;border-radius:8px;background:var(--ink);color:#fff;opacity:0;transform:scale(.7);transition:all .45s cubic-bezier(.3,1.4,.4,1);transition-delay:calc(var(--d,0)*60ms)}
.cc2 i.k-b{background:var(--summit);color:var(--ink)}.cc2 i.k-c{background:#fff;color:var(--ink)}
.cal.in-v .cc2 i{opacity:1;transform:none}
/* 5 funnel */
.fn{position:relative;max-width:480px;margin-inline:auto}
.fn svg{width:100%;display:block}.fn path{transition:transform .8s}.f1{fill:#2d4d6b}.f2{fill:#4a7196}.f3{fill:var(--summit)}
.fn-l{position:absolute;left:0;right:0;text-align:center}.fn-l b{display:block;font-family:var(--display);font-size:clamp(26px,3vw,40px);letter-spacing:-.04em;line-height:1;color:#fff}.fn-l span{font-size:13px;color:#e4eef7;font-weight:700}
.l1{top:5%}.l2{top:39%}.l3{top:68%}.l3 b,.l3 span{color:var(--ink)!important}
.fn-n{margin-top:12px;text-align:center;font-size:12.5px;opacity:.7}
.ab{margin-top:8px}.ab-pg{margin-top:20px;background:#fff;border-radius:22px;padding:24px;max-width:760px;position:relative;overflow:hidden}
.ab-nav{display:flex;gap:8px}.ab-nav i{height:10px;width:58px;border-radius:5px;background:#c7d4df}
.ab-hero{margin-top:22px;position:relative;min-height:150px}
.ab-hero h4{font-family:var(--display);letter-spacing:-.03em;position:absolute;left:0;top:0;transition:opacity .4s,transform .4s;max-width:30ch;margin:0}
.t0{font-size:20px;color:#7c95ab}.t1{font-size:clamp(24px,3vw,36px);line-height:1.05;opacity:0;transform:translateY(12px)}
.ab-btns{display:flex;gap:8px;position:absolute;left:0;bottom:0;transition:opacity .3s}.ab-btns s{height:30px;width:80px;border-radius:6px;background:#dbe5ee}
.ab-cta{position:absolute;left:0;bottom:0;background:var(--ink);color:#fff;font-weight:700;padding:14px 26px;border-radius:99px;opacity:0;transition:opacity .4s}
.ab-n{margin-top:14px;font-weight:700;font-size:14px}.n1{display:none}
.ab[data-m="1"] .t0{opacity:0;transform:translateY(-12px)}.ab[data-m="1"] .t1{opacity:1;transform:none}.ab[data-m="1"] .ab-btns{opacity:0}.ab[data-m="1"] .ab-cta{opacity:1}.ab[data-m="1"] .n0{display:none}.ab[data-m="1"] .n1{display:block}
/* 6 social */
.sx-social .sv-vis{min-height:480px;display:grid;place-items:center}
.ph{width:250px;height:460px;border-radius:38px;background:var(--ink);padding:10px;box-shadow:0 30px 60px -30px rgba(15,30,46,.7)}
.ph-in{height:100%;border-radius:30px;background:var(--paper);overflow:hidden}
.ph-feed{display:grid;gap:12px;padding:14px;animation:feed 18s linear infinite}
@keyframes feed{to{transform:translateY(-50%)}}
.pc{background:var(--c);border-radius:16px;padding:14px;height:148px;display:flex;flex-direction:column;gap:8px}.pc i{width:26px;height:26px;border-radius:50%;background:var(--ink)}.pc b{font-size:18px;font-family:var(--display)}.pc s{height:7px;border-radius:4px;background:rgba(15,30,46,.25);width:80%}.pc s+s{width:55%}
.pc:nth-child(3n+3) b{color:#fff}
.fl{position:absolute;background:#fff;color:var(--ink);font-weight:700;font-size:14px;padding:10px 16px;border-radius:99px;box-shadow:0 12px 30px -14px rgba(15,30,46,.5);animation:bob 5s ease-in-out infinite}
.fl.f1{left:2%;top:18%}.fl.f2{right:2%;top:46%;animation-delay:-1.5s}.fl.f3{left:8%;bottom:14%;animation-delay:-3s}
@keyframes bob{50%{transform:translateY(-14px)}}
.wk{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-top:32px}
.wd{background:var(--sky);border-radius:18px;padding:18px 14px;min-height:190px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .3s,background .3s}
.wd:hover{transform:translateY(-8px);background:var(--summit)}
.wd b{font-family:var(--display);font-size:22px;letter-spacing:-.03em}.wd span{font-size:15px;font-weight:700}
.wd:nth-child(2n){background:#fff3cf}.wd:nth-child(3n){background:var(--ink)}.wd:nth-child(3n) b,.wd:nth-child(3n) span{color:var(--paper)}
/* 7 ppc */
.gg{background:var(--r1);border-radius:24px;padding:26px 26px 20px;max-width:520px;margin-inline:auto;color:var(--paper)}
.gg svg{width:100%;display:block}.g0,.g1{fill:none;stroke-width:22;stroke-linecap:round}.g0{stroke:#2d4d6b}.g1{stroke:var(--summit);stroke-dasharray:377;stroke-dashoffset:377;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.8,.2,1)}
.gn{stroke:#fff;stroke-width:5;stroke-linecap:round;transform-origin:150px 150px;transform:rotate(-90deg);transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}
.gg.go .g1{stroke-dashoffset:105}.gg.go .gn{transform:rotate(36deg)}
.gg-l{text-align:center;color:#c9d8e6;font-size:14px;margin-top:-6px}
.gg-t{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.gg-t div{background:var(--ink);border-radius:14px;padding:14px;text-align:center}.gg-t b{display:block;font-family:var(--display);font-size:28px;letter-spacing:-.04em;color:var(--summit)}.gg-t span{font-size:12.5px;color:#9fb6ca}
.adt{display:grid;gap:12px;margin-top:32px;max-width:860px}
.ad{display:grid;grid-template-columns:1.2fr 1fr auto;gap:22px;align-items:center;background:var(--r1);border-radius:18px;padding:20px 24px;transition:transform .5s,background .4s,opacity .4s}
.ad b{display:block;font-size:18px;color:var(--paper)}.ad span{font-size:13px;color:#9fb6ca}.ad em{font-style:normal;font-size:13px;font-weight:700;padding:6px 12px;border-radius:99px;background:#2d4d6b;color:#fff;min-width:78px;text-align:center}
.ab2{height:12px;background:#2d4d6b;border-radius:99px;overflow:hidden}.ab2 i{display:block;height:100%;width:30%;background:#7da3c7;border-radius:99px;transition:width .9s cubic-bezier(.2,.8,.2,1),background .4s}
.ad.win{background:var(--summit)}.ad.win b,.ad.win span{color:var(--ink)}.ad.win .ab2{background:rgba(15,30,46,.15)}.ad.win .ab2 i{background:var(--ink)}.ad.win em{background:var(--ink);color:var(--summit)}
.ad.lose{opacity:.55}
.adb{margin-top:10px;justify-self:start;border:0;cursor:pointer;font-family:inherit}
/* 8 wordpress */
.bw{background:#fff;border-radius:18px;box-shadow:0 24px 50px -28px rgba(15,30,46,.55);overflow:hidden;position:relative}
.bw-bar{display:flex;align-items:center;gap:6px;padding:12px 14px;background:#e3ecf4}.bw-bar u{width:9px;height:9px;border-radius:50%;background:#b5c7d8}.bw-bar em{margin-left:12px;font-style:normal;font-size:12.5px;background:#fff;border-radius:99px;padding:4px 14px;color:var(--mute)}
.bw-pg{padding:18px;display:grid;gap:12px;min-height:360px}
.bk{border-radius:10px;opacity:0;transform:translateY(16px);animation:bk 9s infinite}
.b1{height:96px;background:var(--ink);animation-delay:.2s}.b2{height:64px;background:var(--sky);display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px;animation-delay:1.4s}.b2 i,.b3 i{background:#fff;border-radius:6px}
.b3{height:78px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;animation-delay:2.6s}.b3 i{background:var(--summit)}.b4{height:50px;background:#2d4d6b;animation-delay:3.8s}.b5{height:38px;background:#e3ecf4;animation-delay:5s}
@keyframes bk{0%,4%{opacity:0;transform:translateY(16px)}10%,86%{opacity:1;transform:none}94%,100%{opacity:0}}
.bw-c{position:absolute;right:26%;bottom:20%;width:22px;height:22px;background:var(--ink);clip-path:polygon(0 0,100% 55%,55% 62%,40% 100%);animation:cur 9s infinite}
@keyframes cur{0%{transform:translate(0,0)}25%{transform:translate(-90px,-170px)}50%{transform:translate(-30px,-100px)}75%{transform:translate(-120px,-30px)}100%{transform:translate(0,0)}}
.bld{display:grid;grid-template-columns:240px 1fr;gap:24px;margin-top:32px;align-items:start}
.bld-p{display:grid;gap:8px}.bld-p button{font:inherit;font-weight:700;text-align:left;padding:14px 18px;border-radius:14px;border:0;background:var(--sky);cursor:pointer;color:var(--ink);transition:transform .2s,background .2s}
.bld-p button:hover{background:var(--summit);transform:translateX(6px)}.bld-p .clr{background:var(--ink);color:#fff}
.bld-c{background:#fff;border-radius:20px;box-shadow:0 0 0 3px var(--sky) inset;overflow:hidden;min-height:420px}
.bld-pg{padding:16px;display:grid;gap:10px}.bld-e{padding:60px 0;text-align:center;color:var(--mute)}
.bb{border-radius:12px;padding:18px;animation:pop .4s cubic-bezier(.3,1.4,.4,1)}@keyframes pop{from{opacity:0;transform:scale(.9)}}
.bb b{font-family:var(--display);font-size:20px;letter-spacing:-.03em}.bb div{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-top:10px}.bb i{display:block;height:46px;border-radius:8px;background:rgba(255,255,255,.7)}
.bb.k0{background:var(--ink);color:#fff}.bb.k0 b{color:#fff}.bb.k1{background:var(--sky)}.bb.k2{background:#fff3cf}.bb.k3{background:var(--summit)}.bb.k4{background:#e3ecf4}.bb.k5{background:#2d4d6b;color:#fff}.bb.k5 b{color:#fff}
/* 9 ui */
.cmp2{position:relative;max-width:540px;margin-inline:auto;aspect-ratio:1/1.05;border-radius:22px;overflow:hidden;box-shadow:0 24px 50px -28px rgba(15,30,46,.55);user-select:none}
.cp{position:absolute;inset:0;padding:22px;display:flex;flex-direction:column;gap:16px;background:#fff}
.cp.ds{clip-path:inset(0 0 0 var(--p));background:var(--paper)}
.cn{display:flex;gap:10px;align-items:center}.wf .cn i{height:10px;width:50px;background:#c7d4df;border-radius:3px}.wf .ch b{display:block;height:18px;background:#c7d4df;border-radius:3px;width:70%;margin-bottom:8px}.wf .ch b+b{width:45%}
.wf .cimg{background:#dde5ec;position:relative}.wf .cimg::before,.wf .cimg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent calc(50% - 1px),#b5c7d8 50%,transparent calc(50% + 1px))}
.wf .cimg::after{transform:scaleX(-1)}
.cimg{flex:1;border-radius:12px}.wf .cc i{background:#dde5ec}
.cc{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cc i{height:54px;border-radius:10px;background:var(--sky)}
.ds .cn{font-weight:700;font-size:14px}.ds .cn em{font-style:normal;font-family:var(--display);font-weight:800;margin-right:auto;font-size:18px}.ds .cn i{font-style:normal}.ds .cn u{text-decoration:none;background:var(--summit);padding:7px 14px;border-radius:99px}
.ds h4{font-family:var(--display);font-size:clamp(22px,2.6vw,32px);line-height:1.05;letter-spacing:-.04em;margin:0}
.ds .cimg{background:linear-gradient(135deg,#2d4d6b,#4a7196);position:relative;overflow:hidden}.ds .cimg::after{content:"";position:absolute;right:14%;top:16%;width:60px;height:60px;border-radius:50%;background:var(--summit)}
.cmp2 input{position:absolute;left:0;right:0;bottom:12px;width:100%;margin:0;appearance:none;background:none;z-index:4;height:36px;cursor:ew-resize;opacity:0}
.cp-h{position:absolute;top:0;bottom:0;left:var(--p);width:4px;margin-left:-2px;background:var(--ink);z-index:3;pointer-events:none}
.cp-h::after{content:"\2194";position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px;border-radius:50%;background:var(--summit);display:grid;place-items:center;font-size:20px;color:var(--ink)}
.spec{margin-top:8px}.spec-c{--a:#d7e8f5;--b:#0f1e2e;--c:#ffc93c;margin-top:22px;background:var(--a);color:var(--b);border-radius:24px;padding:clamp(24px,4vw,48px);max-width:760px;transition:background .5s,color .5s}
.spec-c h4{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.4vw,44px);letter-spacing:-.04em;line-height:1;margin:0}.spec-c p{margin-top:12px;color:inherit!important}
.sb{display:inline-block;margin-top:22px;margin-right:10px;padding:13px 24px;border-radius:99px;background:var(--c);color:var(--b);font-weight:700}.sb.s2{background:var(--b);color:var(--a)}
.sw{display:flex;gap:10px;margin-top:26px}.sw i{width:52px;height:52px;border-radius:50%;background:var(--b)}.sw i:nth-child(2){background:var(--c)}.sw i:nth-child(3){background:var(--a);box-shadow:0 0 0 3px var(--b) inset}.sw i:nth-child(4){background:#fff}
.spec[data-t="1"] .spec-c{--a:#ffe9ae;--b:#3a1d0b;--c:#ff7a3c}.spec[data-t="2"] .spec-c{--a:#0f1e2e;--b:#fbfcfd;--c:#ffc93c}
/* 10 shop */
.shop{background:#fff;border-radius:24px;padding:18px;box-shadow:0 24px 50px -28px rgba(15,30,46,.55);position:relative}
.sh-top{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 14px}.sh-top b{font-family:var(--display);font-size:20px;letter-spacing:-.03em}
.cart{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px}.cart i{font-style:normal;min-width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--summit);display:grid;place-items:center;transition:transform .3s}.cart i.bump{transform:scale(1.4)}
.sh-g{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pr{background:var(--sky);border-radius:16px;padding:10px;display:flex;flex-direction:column;gap:10px}.pi{height:120px;border-radius:12px;display:grid;place-items:center}.pi s{width:44%;aspect-ratio:1;border-radius:50%;background:rgba(15,30,46,.18)}
.pr b{font-size:14px;padding:0 4px}.pr button{font:inherit;font-weight:700;font-size:13.5px;border:0;padding:10px;border-radius:99px;background:var(--ink);color:#fff;cursor:pointer;transition:background .2s,color .2s}.pr button:hover,.pr button.hit{background:var(--summit);color:var(--ink)}
.toast{margin:14px 0 0;text-align:center;font-size:14px;font-weight:700;min-height:1.4em}
.ck{margin-top:32px;max-width:820px}
.ck-s{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0;padding:0}
.ck-s li{display:flex;align-items:center;gap:10px;font-weight:700;padding:14px;border-radius:99px;background:var(--sky);color:var(--mute);transition:all .35s}
.ck-s li b{width:28px;height:28px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:13px}
.ck-s li.on,.ck-s li.pass{background:var(--ink);color:var(--paper)}.ck-s li.on b{background:var(--summit);color:var(--ink)}
.ck-p{margin-top:16px}.ckp{display:none;background:var(--sky);border-radius:22px;padding:36px}.ckp.on{display:block;animation:pop .4s}.ckp b{font-family:var(--display);font-size:clamp(24px,3vw,36px);letter-spacing:-.04em;display:block}.ckp span{display:block;margin-top:8px}
.ck-n{margin-top:16px;border:0;cursor:pointer;font-family:inherit}
/* what you get patterns */
.gc{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:36px}
.gcd{border-radius:24px;padding:clamp(24px,3vw,40px);min-height:200px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;background:var(--sky);transition:transform .3s}
.gcd:hover{transform:translateY(-6px)}.gcd b{font-family:var(--display);font-size:clamp(46px,6vw,84px);line-height:.8;letter-spacing:-.06em;opacity:.9}.gcd h3{font-size:clamp(19px,1.9vw,26px);letter-spacing:-.025em;line-height:1.15;max-width:22ch}
.gcd.c1{background:var(--summit)}.gcd.c2{background:var(--ink);color:var(--paper)}.gcd.c2 h3,.gcd.c2 b{color:var(--paper)}.gcd.c2 b{color:var(--summit)}.gcd.c3{background:#fff3cf}
.gr{margin-top:36px;display:grid;gap:12px}
.grw{display:flex;align-items:center;gap:24px;background:#fff;border-radius:20px;padding:22px 28px;transition:transform .3s}
.grw:hover{transform:translateX(12px)}.grw span{width:60px;height:60px;border-radius:18px;background:var(--ink);color:var(--summit);display:grid;place-items:center;flex:none}.grw svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.8}
.grw h3{font-size:clamp(18px,1.9vw,24px);letter-spacing:-.025em}
.chk{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.chk label{display:flex;align-items:center;gap:18px;padding:24px;border-radius:20px;background:var(--r1);color:var(--paper);font-size:clamp(17px,1.7vw,22px);font-weight:700;letter-spacing:-.02em;cursor:pointer;transition:background .3s,color .3s}
.chk input{position:absolute;opacity:0}.chk .bx{flex:none;width:34px;height:34px;border-radius:10px;background:#2d4d6b;display:grid;place-items:center;transition:background .3s}
.chk .bx::after{content:"";width:16px;height:9px;border-left:4px solid var(--ink);border-bottom:4px solid var(--ink);transform:rotate(-45deg) scale(0);margin-top:-3px;transition:transform .25s}
.chk input:checked+.bx{background:var(--summit)}.chk input:checked+.bx::after{transform:rotate(-45deg) scale(1)}.chk input:checked~*{opacity:1}.chk label:has(input:checked){background:#243f58}
.chk input:focus-visible+.bx{outline:3px solid var(--summit);outline-offset:3px}
/* process patterns */
.tl{list-style:none;margin:40px 0 0;padding:0;display:grid;gap:14px;max-width:820px}
.tl li{display:flex;gap:24px;align-items:flex-start;background:rgba(255,255,255,.55);border-radius:22px;padding:24px 28px}
.sv-sunbg .tl li{background:rgba(255,255,255,.55)}
.tl li b{flex:none;width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--summit);display:grid;place-items:center;font-family:var(--display);font-size:22px}
.tl h3{font-size:clamp(19px,2vw,26px);letter-spacing:-.025em}.tl p{margin-top:6px;max-width:52ch}
.stg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px;align-items:end}
.sg{background:var(--sky);border-radius:22px;padding:26px;transition:transform .3s}.sg:nth-child(1){min-height:200px}.sg:nth-child(2){min-height:250px;background:#fff3cf}.sg:nth-child(3){min-height:300px;background:var(--summit)}.sg:nth-child(4){min-height:350px;background:var(--ink);color:var(--paper)}
.sg:nth-child(4) h3{color:var(--paper)}.sg:nth-child(4) p{color:#c9d8e6}.sg h3{font-size:clamp(19px,1.8vw,24px);letter-spacing:-.025em;line-height:1.15}.sg p{margin-top:12px}
.sg:hover{transform:translateY(-8px)}
@media (max-width:900px){
  .sv-hg{grid-template-columns:1fr}.sv-hero.flip .sv-ht{order:0}.eng-g,.stg{grid-template-columns:1fr 1fr}.gc,.chk{grid-template-columns:1fr}.dial-w{grid-template-columns:1fr}.dial-c{left:50%;transform:translateX(-50%)}.dial{margin-inline:auto;display:block}.dial-w{padding-top:0}.cal{gap:5px}.cc2{min-height:60px;padding:5px}.cc2 i{font-size:0;padding:5px;width:12px;height:12px}.wk{grid-template-columns:1fr 1fr}.bld{grid-template-columns:1fr}.bld-p{grid-template-columns:1fr 1fr}.ad{grid-template-columns:1fr}.ck-s{grid-template-columns:1fr 1fr}.sh-g{grid-template-columns:1fr}.arts{height:340px}.sg:nth-child(n){min-height:0}.dial-c{top:0}
}
@media (max-width:560px){.eng-g,.stg,.wk{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.ph-feed,.bk,.bw-c,.fl{animation:none}.bk{opacity:1;transform:none}.cc2 i{opacity:1;transform:none}}

.sv-ink .lede,.sv-ink .sv-sig .lede{color:#c9d8e6}
.dial-c{padding:15%}.dial-c span{font-size:13px}.dial-t{font-size:clamp(13px,1.15vw,16px)}