/* ADBXO Voltage. Landing styles. */

@font-face{font-family:'Jakarta';src:url('fonts/jakarta-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Jakarta';src:url('fonts/jakarta-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Jakarta';src:url('fonts/jakarta-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Jakarta';src:url('fonts/jakarta-800.woff2') format('woff2');font-weight:800;font-display:swap}

:root{
  --bg:#0B0E14; --surface:#161B26; --stroke:#283044;
  --ink:#E8ECF4; --muted:#8A93A8;
  --blue:#3B82F6; --blue-deep:#2563EB; --cyan:#06B6D4;
  --grad:linear-gradient(135deg,#3B82F6 0%,#2563EB 100%);
  --sm:8px; --md:20px; --lg:48px; --xl:104px;
  --r-sm:10px; --r-md:16px; --r-lg:24px;
  --font:'Jakarta',sans-serif;
  --wrap:1200px;
  --i-li:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.1c.5-1 1.8-2 3.7-2 4 0 4.8 2.5 4.8 5.8V21h-4v-5.6c0-1.3 0-3-1.9-3s-2.2 1.4-2.2 2.9V21H9z'/></svg>");
  --i-ig:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M7.5 2h9A5.5 5.5 0 0 1 22 7.5v9A5.5 5.5 0 0 1 16.5 22h-9A5.5 5.5 0 0 1 2 16.5v-9A5.5 5.5 0 0 1 7.5 2zm0 2A3.5 3.5 0 0 0 4 7.5v9A3.5 3.5 0 0 0 7.5 20h9a3.5 3.5 0 0 0 3.5-3.5v-9A3.5 3.5 0 0 0 16.5 4zm4.5 3a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm5.8-2.6a1.1 1.1 0 1 1 0 2.2 1.1 1.1 0 0 1 0-2.2z'/></svg>");
  --i-fb:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M13.5 22v-9h3l.5-3.5h-3.5V7.3c0-1 .3-1.7 1.7-1.7H17V2.4c-.3 0-1.4-.1-2.7-.1-2.6 0-4.4 1.6-4.4 4.6v2.6H7V13h2.9v9z'/></svg>");
  --i-wa:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M12 2a10 10 0 0 0-8.6 15L2 22l5.2-1.4A10 10 0 1 0 12 2zm0 2a8 8 0 1 1-4.1 14.9l-.3-.2-3 .8.8-2.9-.2-.3A8 8 0 0 1 12 4zm-3.4 4.3c.2 0 .4-.1.6.4l.8 2c.1.2.1.4 0 .6l-.5.6c-.2.2-.4.3-.2.7a6.6 6.6 0 0 0 3.2 2.8c.3.1.4.1.6-.1l.9-1.1c.2-.2.4-.2.7-.1l2 1c.3.1.5.2.6.3 0 .2 0 .7-.2 1.4-.3.7-1.4 1.3-2 1.4-.4.1-.9.2-3-.6-2.6-1-4.2-3.6-4.3-3.8-.1-.2-1-1.4-1-2.6s.6-1.8.9-2.1c.2-.3.5-.4.7-.4z'/></svg>");
  --t:all .3s ease;
}

:where(*,*::before,*::after){box-sizing:border-box}
:where(body,h1,h2,h3,p,ul,ol,li,figure){margin:0;padding:0;border:0}
:where(ul,ol){list-style:none}
:where(a){color:inherit;text-decoration:none}
:where(button,input,textarea){font:inherit;color:inherit}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.adbxo{background:var(--bg);color:var(--ink);font-family:var(--font);font-weight:400;
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:24px}

.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--blue)}

/* glows */
.glow{position:absolute;border-radius:50%;pointer-events:none;filter:blur(90px)}
.glow-a{top:-18%;right:-6%;width:640px;height:640px;background:rgba(59,130,246,.28)}
.glow-b{bottom:-30%;left:-12%;width:520px;height:520px;background:rgba(37,99,235,.18)}
.glow-c{top:-40%;right:8%;width:520px;height:520px;background:rgba(59,130,246,.16)}

/* type */
.hero-title,.sec-title{font-weight:800;letter-spacing:-.032em}
.hero-title{font-size:clamp(2.5rem,5.3vw,4.3rem);line-height:1.05}
.hero-title .line{display:block;overflow:hidden;padding-bottom:.06em;will-change:transform}
.sec-title{font-size:clamp(1.95rem,3.7vw,2.9rem);line-height:1.12}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.76rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);
  box-shadow:0 0 10px var(--cyan)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:14px 28px;border-radius:var(--r-md);font-weight:600;font-size:.97rem;
  cursor:pointer;border:1px solid transparent;transition:var(--t);white-space:nowrap}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 24px rgba(37,99,235,.32)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(37,99,235,.44)}
.btn-glass{background:rgba(232,236,244,.05);border-color:var(--stroke);color:var(--ink);
  backdrop-filter:blur(12px)}
.btn-glass:hover{background:rgba(232,236,244,.10);border-color:var(--blue);transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* header */
.site-head{position:sticky;top:0;z-index:60;background:rgba(11,14,20,.78);
  backdrop-filter:blur(16px);border-bottom:1px solid var(--stroke)}
.head-inner{display:flex;align-items:center;gap:var(--lg);height:74px}
.wordmark{font-weight:800;font-size:1.3rem;letter-spacing:-.01em}
.nav{display:flex;gap:32px;margin-left:auto;font-size:.95rem;font-weight:500;color:var(--muted)}
.nav a{transition:var(--t)}
.nav a:hover{color:var(--ink)}
.head-cta{padding:10px 20px;font-size:.9rem}
.nav-toggle{display:none;background:none;border:0;margin-left:auto;padding:10px;cursor:pointer}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0}

/* hero */
.hero{position:relative;padding:clamp(64px,9vw,116px) 0 clamp(56px,8vw,96px);overflow:hidden}
.hero-inner{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:var(--lg);align-items:center}
.hero-copy .eyebrow{margin-bottom:20px}
.hero-sub{margin-top:24px;max-width:50ch;color:var(--muted);font-size:1.08rem}
.hero-actions{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap}

/* proof bar */
.proof{margin-top:34px;display:flex;flex-wrap:wrap;gap:10px 30px;padding:16px 22px;
  background:rgba(22,27,38,.7);border:1px solid var(--stroke);border-radius:var(--r-md);
  backdrop-filter:blur(12px);width:fit-content}
.proof li{display:flex;align-items:center;gap:9px;font-size:.88rem;color:var(--muted)}
.proof b{color:var(--cyan);font-weight:700;font-size:.98rem}
.proof-ico{width:15px;height:15px;flex:0 0 auto;background:var(--cyan);opacity:.9;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.i-bolt{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M13 2 4 14h6l-1 8 9-12h-6z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M13 2 4 14h6l-1 8 9-12h-6z'/></svg>")}
.i-star{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='m12 2 3 6.5 7 .9-5 4.8 1.3 7L12 17.8 5.7 21.2 7 14.2 2 9.4l7-.9z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='m12 2 3 6.5 7 .9-5 4.8 1.3 7L12 17.8 5.7 21.2 7 14.2 2 9.4l7-.9z'/></svg>")}
.i-lock{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 10V7a6 6 0 1 1 12 0v3h1v12H5V10zm3 0h6V7a3 3 0 0 0-6 0z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 10V7a6 6 0 1 1 12 0v3h1v12H5V10zm3 0h6V7a3 3 0 0 0-6 0z'/></svg>")}

/* ---- floating service chips ---- */
.float-svc{position:absolute;inset:0;list-style:none;margin:0;padding:0;z-index:5}
.fs{position:absolute;display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  padding:12px 18px;border-radius:99px;font-size:.88rem;font-weight:600;letter-spacing:-.01em;
  background:rgba(18,22,32,.82);border:1px solid var(--stroke);backdrop-filter:blur(16px);
  box-shadow:0 14px 34px rgba(0,0,0,.5);pointer-events:auto;transition:var(--t);will-change:transform}
.fs:hover{border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 18px 44px rgba(37,99,235,.34)}
.fs-ico{width:16px;height:16px;flex:0 0 auto;background:var(--cyan);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;transition:var(--t)}
.fs:hover .fs-ico{background:var(--blue)}
.fs-1{top:6%;left:-6%}
.fs-2{top:31%;left:10%}
.fs-3{top:56%;left:-10%}
.fs-4{top:81%;left:6%}

/* hero image */
.hero-visual{position:relative}
.hero-fig{position:relative;margin:0;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--stroke);box-shadow:0 34px 80px rgba(0,0,0,.6);will-change:transform}
.hero-fig img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.fig-scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(59,130,246,.20) 0%,rgba(11,14,20,0) 42%,rgba(11,14,20,.72) 100%)}
.float-card{position:absolute;left:0;bottom:4%;z-index:5;pointer-events:auto;background:rgba(18,22,32,.92);
  border:1px solid var(--stroke);border-radius:var(--r-md);padding:16px 20px;
  backdrop-filter:blur(14px);box-shadow:0 18px 44px rgba(0,0,0,.55);min-width:186px}
.fc-label{display:block;font-size:.7rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)}
.fc-val{display:block;margin-top:5px;font-weight:800;font-size:1.4rem;letter-spacing:-.02em}
.fc-bar{display:block;margin-top:11px;height:5px;border-radius:4px;background:var(--bg);overflow:hidden}
.fc-bar i{display:block;height:100%;width:68%;border-radius:4px;background:var(--grad)}

/* Palette lock. Any image, generated or a real client photo, is graded into the
   brand duotone so imagery can never introduce an off-palette hue. */
.hero-fig img,.wcard-fig img{filter:grayscale(1) contrast(1.1) brightness(.92)}
.hero-fig::after,.wcard-fig::after{content:'';position:absolute;inset:0;pointer-events:none;
  z-index:1;mix-blend-mode:color;opacity:.92;
  background:linear-gradient(150deg,#3B82F6 0%,#06B6D4 58%,#2563EB 100%)}
.hero-fig .fig-scrim,.wcard-fig .fig-scrim{z-index:2}

/* ---- full-bleed WebGL hero ---- */
.hero{isolation:isolate}
.hero-3d{position:absolute;inset:0;z-index:1;opacity:0;pointer-events:none;
  transition:opacity 1.4s ease}
.hero-3d.is-live{opacity:1}
.hero-3d canvas{display:block;width:100%;height:100%}
.hero .wrap{position:relative;z-index:2}
/* copy sits on a soft ground so type never fights the particle field */
.hero-copy{position:relative}
.hero-copy::before{content:'';position:absolute;left:-6%;right:-18%;top:-14%;bottom:-16%;z-index:-1;
  background:radial-gradient(65% 60% at 26% 50%,rgba(11,14,20,.94) 0%,rgba(11,14,20,.7) 48%,rgba(11,14,20,0) 100%)}
.hero-visual{position:relative;min-height:440px;pointer-events:none}

/* ---- premium buttons: living gradient + sheen sweep ---- */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn > span{position:relative;z-index:3}
.btn-primary{
  background:linear-gradient(115deg,#2563EB 0%,#3B82F6 28%,#06B6D4 52%,#3B82F6 74%,#2563EB 100%);
  background-size:280% 100%;
  animation:btn-flow 9s linear infinite;
  box-shadow:0 8px 24px rgba(37,99,235,.34),inset 0 1px 0 rgba(255,255,255,.22)}
@keyframes btn-flow{from{background-position:0% 50%}to{background-position:280% 50%}}
.btn-primary::before{content:'';position:absolute;inset:0;z-index:2;border-radius:inherit;
  background:linear-gradient(105deg,transparent 34%,rgba(255,255,255,.5) 50%,transparent 66%);
  transform:translateX(-130%)}
.btn-primary:hover::before{animation:btn-sheen .9s cubic-bezier(.3,0,.2,1)}
@keyframes btn-sheen{to{transform:translateX(130%)}}
.btn-primary:hover{transform:translateY(-2px);
  box-shadow:0 16px 38px rgba(37,99,235,.48),inset 0 1px 0 rgba(255,255,255,.3)}
.btn-glass::before{content:'';position:absolute;inset:0;z-index:1;border-radius:inherit;opacity:0;
  background:linear-gradient(115deg,rgba(59,130,246,.28),rgba(6,182,212,.22));transition:opacity .3s ease}
.btn-glass:hover::before{opacity:1}
.head-cta{animation-duration:12s}

/* magnetic pull is written by JS as a custom property */
.btn.is-mag{transform:translate3d(var(--mx,0),var(--my,0),0)}
.btn.is-mag:hover{transform:translate3d(var(--mx,0),calc(var(--my,0px) - 2px),0)}

/* counters keep their box while digits change */
.count,.count-r{font-variant-numeric:tabular-nums}

/* nav underline wipe */
.nav a{position:relative}
.nav a::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:right center;
  transition:transform .3s ease}
.nav a:hover::after{transform:scaleX(1);transform-origin:left center}

/* card glyph + arrow micro-motion */
.cell:hover .cell-ico{transform:rotate(8deg) scale(1.12)}
.wcard:hover .arrow{transform:rotate(45deg)}
.contact-mail{position:relative}

/* ---- social ---- */
.social{display:flex;gap:10px;list-style:none;margin:0;padding:0}
.soc{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r-sm);
  border:1px solid var(--stroke);background:var(--surface);transition:var(--t)}
.soc:hover{border-color:transparent;background:var(--grad);transform:translateY(-3px);
  box-shadow:0 10px 24px rgba(37,99,235,.4)}
.soc-ico{width:17px;height:17px;background:var(--muted);transition:var(--t);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center}
.soc:hover .soc-ico{background:#fff}
.s-li .soc-ico{-webkit-mask-image:var(--i-li);mask-image:var(--i-li)}
.s-ig .soc-ico{-webkit-mask-image:var(--i-ig);mask-image:var(--i-ig)}
.s-fb .soc-ico{-webkit-mask-image:var(--i-fb);mask-image:var(--i-fb)}
.s-wa .soc-ico{-webkit-mask-image:var(--i-wa);mask-image:var(--i-wa)}

/* ---- sector strip under the hero ---- */
.strip{padding-block:clamp(34px,4.6vw,54px);border-block:1px solid var(--stroke);background:var(--surface)}
.strip-inner{display:flex;align-items:center;gap:18px 40px;flex-wrap:wrap}
.strip-lead{font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin:0;flex:0 0 auto}
.strip-list{display:flex;flex-wrap:wrap;gap:10px 12px;list-style:none;margin:0;padding:0}
.strip-list li{font-size:.9rem;font-weight:500;color:var(--ink);padding:7px 15px;
  border:1px solid var(--stroke);border-radius:99px;background:var(--bg);transition:var(--t)}
.strip-list li:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}

/* ---- about stat block ---- */
.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:30px 0 6px;
  list-style:none;padding:0}
.about-stats li{display:flex;flex-direction:column;gap:5px;padding-left:15px;
  border-left:2px solid var(--stroke)}
.about-stats b{font-size:1.9rem;font-weight:800;letter-spacing:-.03em;line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--blue)}
.about-stats span{font-size:.83rem;color:var(--muted);line-height:1.45}

/* word-split reveal for section titles */
.sec-title .tline{display:block}
.sec-title .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em}
.sec-title .w i{display:inline-block;font-style:normal;will-change:transform}
/* sections */
section{padding-block:clamp(68px,9vw,var(--xl))}
.sec-head{margin-bottom:var(--lg);max-width:52ch}
.sec-head .sec-note{margin-top:16px;color:var(--muted);font-size:1rem;max-width:52ch}
.sec-head--split{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--lg);max-width:none}
.sec-head--split .eyebrow{margin-bottom:14px}
.sec-head--split .sec-note{margin-top:0;max-width:34ch;font-size:.96rem}

/* bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cell{position:relative;background:var(--surface);border:1px solid var(--stroke);
  border-radius:var(--r-md);padding:30px 28px 28px;display:flex;flex-direction:column;gap:12px;
  transition:var(--t);min-height:210px;overflow:hidden}
.cell::after{content:'';position:absolute;inset:0;border-radius:var(--r-md);pointer-events:none;
  box-shadow:inset 0 0 0 1px transparent;transition:var(--t)}
.cell:hover{transform:translateY(-4px);border-color:var(--blue);
  box-shadow:0 18px 40px rgba(0,0,0,.45),0 0 0 1px rgba(59,130,246,.35)}
.cell-lead{grid-column:span 2}
.cell-wide{grid-column:span 2}
.cell h3{font-weight:700;font-size:1.32rem;letter-spacing:-.02em}
.cell p{color:var(--muted);font-size:.98rem;max-width:46ch}
.cell-tag{margin-top:auto;font-size:.75rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--cyan);opacity:.85}
.cell-ico{position:absolute;top:26px;right:26px;width:22px;height:22px;background:var(--muted);
  opacity:.4;transition:var(--t);-webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.cell:hover .cell-ico{background:var(--blue);opacity:1}
.i-strategy{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M12 1a11 11 0 100 22 11 11 0 000-22zm0 3a8 8 0 110 16 8 8 0 010-16zm0 4.5a3.5 3.5 0 110 7 3.5 3.5 0 010-7z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M12 1a11 11 0 100 22 11 11 0 000-22zm0 3a8 8 0 110 16 8 8 0 010-16zm0 4.5a3.5 3.5 0 110 7 3.5 3.5 0 010-7z'/></svg>")}
.i-brand{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='m12 2 2.9 6.3 6.9.8-5.1 4.7 1.4 6.8L12 17.2 5.9 20.6l1.4-6.8L2.2 9.1l6.9-.8z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='m12 2 2.9 6.3 6.9.8-5.1 4.7 1.4 6.8L12 17.2 5.9 20.6l1.4-6.8L2.2 9.1l6.9-.8z'/></svg>")}
.i-web{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 4h18v14H3zm2 3v9h14V7z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 4h18v14H3zm2 3v9h14V7z'/></svg>")}
.i-growth{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 17l6-6 4 4 8-8v6h-2V10l-6 6-4-4-6 6z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 17l6-6 4 4 8-8v6h-2V10l-6 6-4-4-6 6z'/></svg>")}

/* work */
.work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.wcard{background:var(--surface);border:1px solid var(--stroke);border-radius:var(--r-lg);
  overflow:hidden;transition:var(--t);display:flex;flex-direction:column}
.wcard:hover{transform:translateY(-4px);border-color:var(--blue);
  box-shadow:0 20px 46px rgba(0,0,0,.5),0 0 0 1px rgba(59,130,246,.3)}
.wcard-fig{position:relative;margin:0;overflow:hidden;aspect-ratio:16/9}
.wcard-fig img{display:block;width:100%;height:100%;object-fit:cover;will-change:transform}
.wcard-fig .fig-scrim{background:linear-gradient(180deg,rgba(11,14,20,0) 40%,rgba(11,14,20,.8) 100%)}
.wcard-meta{position:relative;padding:22px 26px 26px;display:flex;flex-direction:column;gap:9px}
.tag{font-size:.7rem;font-weight:700;letter-spacing:.14em;color:var(--muted)}
.wcard-meta h3{font-weight:700;font-size:1.24rem;letter-spacing:-.02em;padding-right:50px}
.result{font-size:.92rem;color:var(--muted)}
.result b{color:var(--cyan);font-weight:800;font-size:1.06rem}
.arrow{position:absolute;right:24px;bottom:26px;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--stroke);transition:var(--t);
  background:var(--bg) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238A93A8'><path d='M7 17 17 7m0 0H9m8 0v8'/></svg>") center/0 no-repeat}
.arrow::before{content:'';position:absolute;inset:0;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M7 17 17 7m0 0H9m8 0v8'/></svg>") center/19px no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M7 17 17 7m0 0H9m8 0v8'/></svg>") center/19px no-repeat;
  background:var(--muted);transition:var(--t)}
.wcard:hover .arrow{background:var(--grad);border-color:transparent}
.wcard:hover .arrow::before{background:#fff}

/* about */
.about{border-top:1px solid var(--stroke)}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--xl);align-items:start}
.about-body p{color:var(--muted);font-size:1.05rem;max-width:58ch}
.about-points{margin-top:28px;display:grid;gap:14px}
.about-points li{padding:14px 0 0 26px;border-top:1px solid var(--stroke);position:relative;font-size:1rem}
.about-points li::before{content:'';position:absolute;left:0;top:20px;width:12px;height:2px;
  border-radius:2px;background:var(--cyan)}

/* process timeline */
.process{background:var(--surface);border-block:1px solid var(--stroke)}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.steps-line{position:absolute;top:19px;left:6%;right:6%;height:2px;border-radius:2px;overflow:hidden}
.steps-line i{display:block;height:100%;width:100%;border-radius:2px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));
  box-shadow:0 0 16px rgba(59,130,246,.6);transform-origin:left center}
.steps li{position:relative;padding-top:56px}
.snum{position:absolute;top:0;left:0;width:38px;height:38px;border-radius:50%;
  background:var(--grad);color:#fff;font-weight:800;font-size:.92rem;
  display:grid;place-items:center;box-shadow:0 0 0 5px var(--surface),0 6px 18px rgba(37,99,235,.4)}
.steps h3{font-weight:700;font-size:1.16rem;margin-bottom:8px;letter-spacing:-.02em}
.steps p{color:var(--muted);font-size:.95rem;max-width:26ch}

/* contact */
.contact{position:relative;overflow:hidden}
.contact-inner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:var(--xl);align-items:start}
.contact-copy p{margin-top:18px;color:var(--muted);max-width:40ch}
.contact-mail{display:inline-block;margin-top:24px;font-weight:800;font-size:1.32rem;
  letter-spacing:-.02em;color:var(--blue);border-bottom:1px solid transparent;transition:var(--t)}
.contact-mail:hover{border-bottom-color:var(--blue)}
.contact-form{display:grid;gap:17px;background:var(--surface);border:1px solid var(--stroke);
  border-radius:var(--r-lg);padding:30px}
.contact-form label{display:grid;gap:8px;font-size:.84rem;font-weight:500;color:var(--muted)}
.contact-form input,.contact-form textarea{background:var(--bg);border:1px solid var(--stroke);
  border-radius:var(--r-sm);padding:13px 15px;color:var(--ink);font-size:1rem;transition:var(--t)}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#5A6377}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(59,130,246,.45),0 0 18px rgba(59,130,246,.25)}
.contact-form textarea{resize:vertical}
.contact-form .btn{justify-self:start;margin-top:2px}
.form-note{font-size:.78rem;color:var(--muted);opacity:.75}

/* footer */
.site-foot{border-top:1px solid var(--stroke);padding-block:var(--lg)}
.foot-inner{display:flex;align-items:center;gap:var(--lg);flex-wrap:wrap}
.foot-nav{display:flex;gap:26px;color:var(--muted);font-size:.93rem}
.foot-nav a{transition:var(--t)}
.foot-nav a:hover{color:var(--ink)}
.foot-copy{margin-left:auto;color:var(--muted);font-size:.87rem}
.site-foot .social{margin-left:8px}
.foot-inner{row-gap:22px}

/* GSAP base states. Only hidden when JS is present, so no-JS renders complete. */
.has-js .anim-up,.has-js .anim-card,.has-js .anim-step{opacity:0}
.has-js .hero-title .line{opacity:0}
.has-js .steps-line i{transform:scaleX(0)}

.site-head.is-stuck{height:auto;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.site-head.is-stuck .head-inner{height:64px}

@media (prefers-reduced-motion:reduce){
  .has-js .anim-up,.has-js .anim-card,.has-js .anim-step,.has-js .hero-title .line{opacity:1}
  .btn-primary{animation:none}
  .btn-primary::before{display:none}
  .hero-3d{display:none}
  .float-svc .fs{transform:none}
  .has-js .steps-line i{transform:none}
  html{scroll-behavior:auto}
  .has-js .reveal{opacity:1;transform:none;transition:none}
  *{transition:none!important}
}

/* responsive */
@media (max-width:1000px){
  .hero-inner{grid-template-columns:1fr;gap:var(--lg)}
  .hero-visual{order:-1}
  .about-inner,.contact-inner{grid-template-columns:1fr;gap:var(--lg)}
  .bento{grid-template-columns:repeat(2,1fr)}
  .cell-lead,.cell-wide{grid-column:span 2}
  .steps{grid-template-columns:repeat(2,1fr);gap:34px 26px}
  .steps-line{display:none}
}
@media (max-width:720px){
  body.adbxo{font-size:16px}
  .nav,.head-cta{display:none}
  .nav-toggle{display:block}
  .site-head.is-open .nav{display:flex;position:absolute;top:74px;left:0;right:0;
    flex-direction:column;gap:0;background:var(--surface);border-bottom:1px solid var(--stroke);
    padding:8px 24px 20px}
  .site-head.is-open .nav a{padding:14px 0;border-bottom:1px solid var(--stroke)}
  .bento,.work-grid,.steps{grid-template-columns:1fr}
  .float-svc{position:static;display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
  .fs{position:static;font-size:.8rem;padding:10px 14px}
  .hero-visual{min-height:300px}
  .about-stats{grid-template-columns:1fr;gap:14px}
  .strip-inner{gap:14px}
  .site-foot .social{margin-left:0;width:100%}
  .cell-lead,.cell-wide{grid-column:span 1}
  .proof{width:100%;gap:12px 22px}
  .sec-head--split{flex-direction:column;align-items:flex-start;gap:18px}
  .contact-form{padding:22px}
  .foot-copy{margin-left:0;width:100%}
}