/*
Theme Name: Brivanta
Theme URI: https://brivantaconsulting.com
Author: True Digital
Description: Custom theme for Brivanta Consulting LLC. Graphite and Signal art direction: warm paper, ink type, one signal accent, 3D floating product console and scroll motion.
Version: 3.4.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: brivanta
*/

:root{
--paper:#F3F1EC;--paper-2:#E9E6DF;--white:#FFFFFF;
--ink:#0A0B0D;--ink-2:#24272D;--graph:#55585E;--mute:#8B8E94;
--line:#DFDCD5;--line-2:#CFCBC3;
--sig:#D4FF3A;--sig-2:#B8E61F;--sig-soft:#F1FFC4;
--sh-1:0 1px 2px rgba(10,11,13,.04),0 10px 30px -16px rgba(10,11,13,.14);
--sh-2:0 2px 6px rgba(10,11,13,.05),0 30px 60px -28px rgba(10,11,13,.28),0 70px 120px -60px rgba(10,11,13,.22);
--ease:cubic-bezier(.2,.7,.2,1);
--sans:'Inter Tight',system-ui,-apple-system,'Segoe UI',sans-serif;
--serif:'Instrument Serif',Georgia,serif;
--mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;text-rendering:optimizeLegibility}
body::after{content:"";position:fixed;inset:0;z-index:400;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;display:block}
a{color:var(--ink)}a:hover{color:var(--sig-2)}
::selection{background:var(--sig);color:#fff}
.label{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--graph);margin:0}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:9px;background:var(--sig);box-shadow:0 0 0 4px rgba(212,255,58,.14)}
.wrap{max-width:1240px;margin:0 auto;padding:0 48px}
.wrap-wide{max-width:1360px;margin:0 auto;padding:0 48px}
.h1{margin:0;font-size:clamp(46px,5.4vw,82px);line-height:.98;letter-spacing:-.047em;font-weight:600;text-wrap:balance}
.h2{margin:0;font-size:clamp(34px,4.1vw,60px);line-height:1.03;letter-spacing:-.042em;font-weight:600;text-wrap:balance}
.serif{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.012em}
.h1 .serif,.h2 .serif{font-size:1.08em;line-height:.9}
.muted{color:var(--graph)}
.sig{color:var(--sig)}
.cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.outer{padding:0 16px}
.sec{padding-top:150px}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:64px}
.sec-head .h2{max-width:720px;margin-top:22px}
.sec-head p.side{max-width:380px;margin:0;color:var(--graph);font-size:17px;line-height:1.6}

/* grid paper texture */
.gridbg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:72px 72px;background-position:-1px -1px;-webkit-mask-image:radial-gradient(ellipse 60% 55% at 70% 42%,#000 10%,transparent 72%);mask-image:radial-gradient(ellipse 60% 55% at 70% 42%,#000 10%,transparent 72%);opacity:.75}

/* scroll progress */
.progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--sig);transform-origin:0 50%;transform:scaleX(0);z-index:200}
body.admin-bar .progress{top:32px}

/* top bar */
.topbar{position:fixed;top:14px;left:50%;translate:-50% 0;width:min(1328px,calc(100% - 28px));z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 10px 10px 22px;border-radius:18px;border:1px solid transparent;transition:background-color .4s,box-shadow .4s,border-color .4s}
body.admin-bar .topbar{top:46px}
.topbar.scrolled{background:rgba(255,255,255,.78);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-color:rgba(10,11,13,.07);box-shadow:0 14px 40px -24px rgba(10,11,13,.3)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand span{font-size:20px;font-weight:600;letter-spacing:-.03em}
.nav{display:flex;gap:6px}
.nav a{color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;letter-spacing:-.01em;padding:10px 16px;border-radius:999px;position:relative;transition:background-color .25s,color .25s}
.nav a:hover{background:rgba(10,11,13,.05);color:var(--ink)}
.nav a.current::after{content:"";position:absolute;left:50%;bottom:3px;width:4px;height:4px;margin-left:-2px;border-radius:9px;background:var(--sig)}
.menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line-2);background:#fff;align-items:center;justify-content:center;cursor:pointer}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 8px 0 26px;border-radius:999px;font-family:var(--sans);font-size:15.5px;font-weight:500;letter-spacing:-.01em;text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:transform .3s var(--ease),background-color .3s,box-shadow .3s,translate .4s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--ink);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 14px 30px -14px rgba(10,11,13,.6)}
.btn-primary:hover{color:#fff;background:#0C0D10;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 20px 40px -16px rgba(10,11,13,.65)}
.btn-plain{height:44px;padding:0 20px;font-size:14.5px}
.btn-ghost{padding:0 26px;background:rgba(255,255,255,.7);color:var(--ink);border:1px solid var(--line-2)}
.btn-ghost:hover{color:var(--ink);background:#fff;border-color:var(--ink)}
.btn-light{padding:0 8px 0 26px;background:#fff;color:var(--ink)}
.btn-light:hover{color:var(--ink)}
.arrow{width:38px;height:38px;border-radius:999px;background:var(--sig);color:#fff;display:inline-flex;align-items:center;justify-content:center;transition:transform .4s var(--ease)}
.btn:hover .arrow{transform:rotate(45deg)}

/* =========== HERO =========== */
.hero{position:relative;min-height:100vh;padding:150px 0 70px;overflow:hidden;isolation:isolate}
.hero .glow{position:absolute;z-index:-1;pointer-events:none;left:58%;top:12%;width:820px;height:820px;border-radius:50%;background:radial-gradient(circle,rgba(212,255,58,.13) 0%,rgba(212,255,58,.05) 34%,rgba(243,241,236,0) 66%);filter:blur(10px)}
.hero .glow.w{left:62%;top:22%;width:520px;height:520px;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,255,255,0) 70%)}
.hero-grid{position:relative;max-width:1328px;margin:0 auto;padding:0 48px;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:center;min-height:calc(100vh - 220px)}
.hero-copy{position:relative;z-index:5;max-width:600px}
.hero-copy .eyebrow{padding:8px 16px 8px 14px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid var(--line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);margin-bottom:34px}
.hero-copy .lead{margin:30px 0 0;max-width:480px;font-size:18.5px;line-height:1.62;color:var(--graph)}
.hero-copy .ctas{display:flex;gap:12px;margin-top:40px;flex-wrap:wrap}
.proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px;border-top:1px solid var(--line-2);max-width:540px}
.proof div{padding:18px 18px 0 0}
.proof div+div{padding-left:18px;border-left:1px solid var(--line)}
.proof b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.proof span{display:block;font-size:13.5px;color:var(--graph);margin-top:2px;line-height:1.4}
.load{animation:load 1.1s var(--ease) both}
@keyframes load{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .02em .12em;margin:0 -.02em -.12em}
.w>span{display:inline-block}
.hero-copy .w>span{transform:translateY(108%);animation:wordUp 1.1s var(--ease) forwards;animation-delay:calc(var(--d,0) * 75ms + .2s)}
@keyframes wordUp{to{transform:none}}

/* stage */
.stage{position:relative;height:640px;z-index:2}
.stage-scale{position:absolute;inset:0;perspective:1800px}
.stage-in{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.layer{position:absolute;transform-style:preserve-3d;will-change:translate}
.enter{opacity:0;animation:enter 1.4s var(--ease) forwards;animation-delay:var(--ed,.4s)}
@keyframes enter{from{opacity:0;transform:translateY(60px) scale(.9);filter:blur(14px)}to{opacity:1;transform:none;filter:blur(0)}}
.fl{animation:fl var(--fd,7s) ease-in-out infinite;animation-delay:var(--fdel,0s)}
@keyframes fl{0%,100%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(0,-14px,0) rotate(var(--fr,.4deg))}}
.ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid rgba(10,11,13,.13);pointer-events:none}
.ring.r1{width:720px;height:720px;margin:-360px 0 0 -360px;animation:orbit 38s linear infinite}
.ring.r2{width:540px;height:540px;margin:-270px 0 0 -270px;border-style:dashed;border-color:rgba(10,11,13,.12);animation:orbit 26s linear infinite reverse}
.ring::before{content:"";position:absolute;top:50%;left:-5px;width:9px;height:9px;margin-top:-4.5px;border-radius:9px;background:var(--sig);box-shadow:0 0 0 5px rgba(212,255,58,.15),0 0 18px rgba(212,255,58,.6)}
.ring.r2::before{background:var(--ink);box-shadow:0 0 0 5px rgba(10,11,13,.08)}
@keyframes orbit{from{transform:rotateX(74deg) rotateZ(0)}to{transform:rotateX(74deg) rotateZ(360deg)}}
.spot{position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(380px circle at var(--lx,60%) var(--ly,40%),rgba(255,255,255,.85),rgba(255,255,255,0) 70%)}

.glass{position:relative;background:rgba(255,255,255,.8);border:1px solid rgba(10,11,13,.08);border-radius:20px;backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);box-shadow:var(--sh-2)}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 28%);mix-blend-mode:soft-light}
.console{width:470px;padding:0;overflow:hidden;font-size:13px}
.console .bar{display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid var(--line)}
.dots{display:flex;gap:6px}.dots i{width:9px;height:9px;border-radius:9px;background:#DCD9D2}
.console .url{flex:1;text-align:center;font-family:var(--mono);font-size:11px;color:var(--mute);background:rgba(10,11,13,.035);border-radius:8px;padding:5px 10px}
.live{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.live i,.pulse{position:relative;width:7px;height:7px;border-radius:9px;background:var(--sig);display:inline-block;flex:none}
.live i::after,.pulse::after{content:"";position:absolute;inset:-5px;border-radius:99px;border:1.5px solid rgba(212,255,58,.5);animation:ping 2s ease-out infinite}
@keyframes ping{from{transform:scale(.4);opacity:1}to{transform:scale(1.6);opacity:0}}
.console .body{padding:20px 20px 18px}
.c-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.c-top .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.c-top .v{font-size:25px;font-weight:600;letter-spacing:-.035em;margin-top:6px;line-height:1.05}
.c-top .v small{font-size:13px;font-weight:500;color:var(--graph);letter-spacing:-.01em;margin-left:6px}
.donut{position:relative;width:62px;height:62px;flex:none}
.donut svg{transform:rotate(-90deg)}
.donut b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;letter-spacing:-.02em}
.donut .arc-p{stroke-dasharray:157;stroke-dashoffset:157;animation:dash 2s var(--ease) 1.4s forwards}
@keyframes dash{to{stroke-dashoffset:var(--to,44)}}
.chart{margin:18px -4px 0;position:relative}
.chart .ln{stroke-dasharray:900;stroke-dashoffset:900;animation:draw 2.6s var(--ease) 1.2s forwards}
.chart .ar{opacity:0;animation:fade 1.4s ease 2.2s forwards}
.chart .end{opacity:0;animation:fade .6s ease 3.4s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
.xl{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:var(--mute);padding:6px 4px 0}
.pipe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:16px}
.pipe span{display:flex;align-items:center;gap:6px;padding:8px 9px;border-radius:10px;background:rgba(10,11,13,.04);font-size:11.5px;font-weight:500;color:var(--ink);position:relative;overflow:hidden}
.pipe span svg{flex:none}
.pipe span.run{background:var(--sig-soft);color:#A9D420}
.pipe span.run::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--sig);transform-origin:0 50%;animation:runbar 2.4s ease-in-out infinite}
@keyframes runbar{0%{transform:scaleX(0)}70%,100%{transform:scaleX(1);opacity:.2}}

.chip-ui{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;font-size:13px;line-height:1.3;border-radius:16px;white-space:nowrap}
.chip-ui b{display:block;font-weight:600;font-size:13.5px;letter-spacing:-.01em}
.chip-ui span.s{color:var(--graph);font-size:12px}
.ico{width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--ink);color:#fff}
.ico.o{background:var(--sig);color:#fff}
.ico.l{background:var(--paper-2);color:var(--ink)}
.spark{display:flex;align-items:flex-end;gap:3px;height:24px;margin-left:6px}
.spark i{width:4px;border-radius:2px;background:var(--ink);animation:eq 1.6s ease-in-out infinite;animation-delay:calc(var(--k) * -.2s)}
.spark i:nth-child(3n){background:var(--sig)}
@keyframes eq{0%,100%{height:30%}50%{height:100%}}
.code{width:276px;padding:16px 18px 18px;border-radius:18px;background:rgba(10,11,13,.94);border:1px solid rgba(255,255,255,.08);color:#D2D4D7;font-family:var(--mono);font-size:11.5px;line-height:1.85;box-shadow:var(--sh-2)}
.code .dots i{background:#2E3137}
.code .fn{color:#fff}.code .kw{color:var(--sig)}.code .cm{color:#6E7177}.code .st{color:#E3FF7A}
.caret{display:inline-block;width:7px;height:14px;background:var(--sig);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.avs{display:flex}
.avs i{width:30px;height:30px;border-radius:99px;border:2px solid #fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:11px;font-weight:600;color:#fff;background:var(--ink)}
.avs i+i{margin-left:-9px}
.avs i:nth-child(2){background:var(--graph)}
.avs i:nth-child(3){background:var(--sig)}
.meter{width:150px;height:6px;border-radius:9px;background:rgba(10,11,13,.07);margin-top:8px;overflow:hidden}
.meter i{display:block;height:100%;width:64%;background:var(--ink);border-radius:9px;transform-origin:0 50%;animation:grow 1.6s var(--ease) 2s both}
@keyframes grow{from{transform:scaleX(0)}}

.scroll-cue{position:absolute;left:50%;bottom:26px;translate:-50% 0;display:flex;align-items:center;gap:10px;color:var(--graph)}
.scroll-cue i{width:22px;height:34px;border:1.5px solid var(--line-2);border-radius:20px;position:relative}
.scroll-cue i::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:3px;background:var(--ink);animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{opacity:0;transform:translateY(-3px)}40%{opacity:1}100%{opacity:0;transform:translateY(9px)}}

/* =========== LOGOS =========== */
.logos{padding:34px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:40px;overflow:hidden}
.logos .label{flex:none;padding-left:48px;color:var(--graph)}
.mq{overflow:hidden;flex:1;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee{display:flex;gap:72px;width:max-content;animation:marquee 40s linear infinite}
.marquee div{display:flex;align-items:center;gap:10px;color:#9F9C95;font-weight:600;font-size:19px;letter-spacing:-.03em}
.marquee i{width:22px;height:22px;border-radius:6px;background:#D0CDC5;display:block}
.marquee div:nth-child(even) i{border-radius:99px}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* =========== STATEMENT + STATS =========== */
.statement{font-size:clamp(30px,3.6vw,54px);line-height:1.12;letter-spacing:-.04em;font-weight:600;margin:28px 0 0;max-width:1120px;text-wrap:balance}
.ink{background-image:linear-gradient(180deg,var(--ink) 0 50%,#D6D3CB 50% 100%);background-size:100% 200%;background-position:0 calc(100% - var(--p,1) * 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ink .serif{-webkit-text-fill-color:transparent}
.stats{display:grid;grid-template-columns:1.15fr 1fr 1fr;grid-template-rows:250px 250px;gap:16px;margin-top:80px}
.cell{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:26px;padding:28px;box-shadow:var(--sh-1);display:flex;flex-direction:column;justify-content:space-between;transition:transform .5s var(--ease),box-shadow .5s}
.cell:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.cell .k{font-size:14.5px;color:var(--graph);margin:0}
.big{font-size:clamp(48px,4.6vw,72px);line-height:.95;letter-spacing:-.055em;font-weight:600}
.cell.photo{padding:0;grid-row:1 / 3}
.cell.photo .cap{position:absolute;left:14px;right:14px;bottom:14px;padding:22px 24px;border-radius:18px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.6)}
.cell.tall{grid-row:1 / 3}
.bars{display:flex;align-items:flex-end;gap:8px;height:120px;margin:10px 0 22px}
.bars i{flex:1;border-radius:8px 8px 3px 3px;background:var(--paper-2);height:var(--h);transform-origin:50% 100%;transform:scaleY(.08);transition:transform 1.2s var(--ease) calc(var(--k) * 90ms)}
.bars i:last-child{background:var(--ink)}
.bars i:nth-last-child(2){background:#E3FF7A}
.in .bars i,.bars.in i{transform:none}
.cell.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.cell.dark .k{color:#A0A3A8}
.dotgrid{display:grid;grid-template-columns:repeat(8,1fr);gap:7px;max-width:220px}
.dotgrid i{aspect-ratio:1;border-radius:99px;background:var(--paper-2);transition:background-color .4s calc(var(--k) * 80ms),transform .4s calc(var(--k) * 80ms)}
.in .dotgrid i{background:var(--ink)}
.in .dotgrid i:nth-child(8){background:var(--sig)}
.cell:hover .dotgrid i{transform:scale(1.15)}

/* =========== SERVICES =========== */
.svc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sv{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:24px;padding:10px;text-decoration:none;color:var(--ink);box-shadow:var(--sh-1);transition:transform .5s var(--ease),box-shadow .5s,border-color .5s}
.sv:hover{color:var(--ink);transform:translateY(-8px);box-shadow:var(--sh-2);border-color:transparent}
.sv .pic{position:relative;height:200px;border-radius:16px;overflow:hidden;background:var(--paper-2)}
.sv .pic img{filter:saturate(.55) contrast(1.04);transition:transform 1.4s var(--ease),filter .7s}
.sv .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,11,13,0) 50%,rgba(10,11,13,.35));transition:opacity .6s}
.sv:hover .pic img{transform:scale(1.08);filter:none}
.sv:hover .pic::after{opacity:.4}
.sv .no{position:absolute;top:12px;left:12px;z-index:2;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.9);color:var(--ink);font-size:10.5px}
.sv .body{display:flex;flex-direction:column;flex:1;padding:22px 16px 14px}
.sv h3{margin:0 0 10px;font-size:21px;font-weight:600;letter-spacing:-.03em;line-height:1.15}
.sv .tx{margin:0;font-size:15px;line-height:1.55;color:var(--graph)}
.sv .go{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:24px;font-size:14.5px;font-weight:500}
.sv .go .ar{width:36px;height:36px;border-radius:99px;border:1px solid var(--line-2);display:inline-flex;align-items:center;justify-content:center;transition:background-color .4s,color .4s,border-color .4s,transform .4s var(--ease)}
.sv:hover .go .ar{background:var(--sig);border-color:var(--sig);color:#fff;transform:rotate(45deg)}
.sv.wide{grid-column:span 2;flex-direction:row;gap:10px}
.sv.wide .pic{flex:0 0 52%;height:auto;min-height:340px}
.sv.wide .body{padding:26px 22px 16px}
.sv.wide h3{font-size:30px;margin-bottom:14px}
.sv.wide .tx{font-size:16.5px;max-width:360px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:22px}
.tags span{font-size:12.5px;padding:6px 11px;border-radius:99px;background:var(--paper);border:1px solid var(--line);color:var(--graph)}

/* =========== BAND =========== */
.band{position:relative;overflow:hidden;border-radius:32px;height:640px;color:#fff;background:var(--ink)}
.band .shade{position:absolute;inset:0;background:linear-gradient(95deg,rgba(10,11,13,.92) 0%,rgba(10,11,13,.65) 42%,rgba(10,11,13,.1) 78%)}
.band .inner{position:absolute;left:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:flex-end;padding:72px;max-width:780px}
.band .h2{color:#fff}
.band p:not(.label){color:#D2D4D7;font-size:18.5px;line-height:1.6;margin:24px 0 0;max-width:500px}
.band .eyebrow{color:#D2D4D7}
.photo{position:relative;overflow:hidden}
.photo img.par{height:118%;top:-9%}

/* =========== WHY =========== */
.why-wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:80px;align-items:start}
.why-side{position:sticky;top:130px}
.why-side .h2{margin-top:22px}
.why-side p:not(.label){color:var(--graph);font-size:17.5px;line-height:1.6;margin:26px 0 0;max-width:400px}
.promise{margin-top:40px;display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);max-width:420px}
.promise p{margin:0!important;font-size:15px!important;color:var(--ink)!important;line-height:1.45!important}
.why-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.why-item{display:grid;grid-template-columns:84px minmax(0,1fr) 40px;gap:20px;align-items:start;padding:34px 8px 34px 4px;border-bottom:1px solid var(--line-2);position:relative;transition:padding .5s var(--ease)}
.why-item::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease)}
.why-item:hover{padding-left:16px}
.why-item:hover::before{transform:scaleX(1)}
.why-item .n{font-family:var(--serif);font-style:italic;font-size:46px;line-height:.9;color:#BDB9B1;transition:color .4s}
.why-item:hover .n{color:var(--sig)}
.why-item h3{margin:4px 0 10px;font-size:24px;font-weight:600;letter-spacing:-.03em;line-height:1.2}
.why-item p{margin:0;color:var(--graph);font-size:16px;line-height:1.6;max-width:520px}
.why-item .pl{width:36px;height:36px;margin-top:4px;border-radius:99px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;transition:background-color .4s,border-color .4s,color .4s,transform .5s var(--ease)}
.why-item:hover .pl{background:var(--ink);border-color:var(--ink);color:#fff;transform:rotate(-45deg)}

/* =========== PROCESS =========== */
.process{position:relative;overflow:hidden;border-radius:32px;background:#fff;border:1px solid var(--line);padding:96px 72px 84px;box-shadow:var(--sh-1)}
.process .gridbg{-webkit-mask-image:radial-gradient(ellipse 70% 80% at 85% 0%,#000,transparent 70%);mask-image:radial-gradient(ellipse 70% 80% at 85% 0%,#000,transparent 70%);opacity:.6}
.track{position:relative;height:2px;background:var(--line);margin:8px 0 0;border-radius:2px}
.track i{position:absolute;inset:0;background:var(--sig);transform-origin:0 50%;transform:scaleX(var(--p,0));border-radius:2px}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;position:relative}
.step{position:relative;padding-top:44px}
.step .node{position:absolute;top:-8px;left:0;width:16px;height:16px;border-radius:99px;background:#fff;border:2px solid var(--line-2);transition:background-color .4s,border-color .4s,box-shadow .4s}
.step.on .node{background:var(--sig);border-color:var(--sig);box-shadow:0 0 0 6px rgba(212,255,58,.15)}
.step .label{color:var(--mute)}
.step h3{margin:14px 0 12px;font-size:30px;font-weight:600;letter-spacing:-.04em}
.step p{margin:0;color:var(--graph);font-size:16px;line-height:1.6}
.step .tag{display:inline-flex;margin-top:22px;font-size:12.5px;padding:6px 12px;border-radius:99px;background:var(--paper);border:1px solid var(--line);color:var(--ink)}
.step.on .tag{background:var(--sig-soft);border-color:#E3FF7A;color:#A9D420}

/* =========== CTA =========== */
.cta{position:relative;overflow:hidden;border-radius:32px;background:#fff;border:1px solid var(--line);padding:130px 24px;text-align:center;box-shadow:var(--sh-1);isolation:isolate}
.cta .gridbg{-webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,#000,transparent 75%);mask-image:radial-gradient(ellipse 60% 70% at 50% 50%,#000,transparent 75%)}
.cta::before{content:"";position:absolute;z-index:-1;left:50%;bottom:-420px;width:900px;height:640px;margin-left:-450px;border-radius:50%;background:radial-gradient(circle,rgba(212,255,58,.18),rgba(212,255,58,0) 65%)}
.cta .h2{font-size:clamp(40px,5.6vw,84px);position:relative;max-width:900px;margin:22px auto 0}
.cta p.t{margin:26px auto 0;max-width:540px;font-size:18.5px;line-height:1.6;color:var(--graph);position:relative}
.cta .ctas{margin-top:40px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative}
.cta .fc{position:absolute;z-index:1}
.cta .fc.a{left:6%;top:22%}
.cta .fc.b{right:6%;top:30%}
.cta .fc.c{left:11%;bottom:16%}

/* =========== PAGE HERO =========== */
.page-hero{position:relative;overflow:hidden;padding:190px 0 0;min-height:0;isolation:isolate}
.page-hero .gridbg{-webkit-mask-image:radial-gradient(ellipse 55% 70% at 80% 30%,#000,transparent 70%);mask-image:radial-gradient(ellipse 55% 70% at 80% 30%,#000,transparent 70%)}
.page-hero .glow{position:absolute;z-index:-1;right:-200px;top:-160px;width:760px;height:760px;border-radius:50%;background:radial-gradient(circle,rgba(212,255,58,.12),rgba(212,255,58,0) 65%)}
.ph-in{max-width:1328px;margin:0 auto;padding:0 48px}
.page-hero .h1{font-size:clamp(46px,6.4vw,104px);max-width:1080px;margin-top:30px}
.page-hero .lead{margin:32px 0 0;max-width:560px;font-size:19px;line-height:1.6;color:var(--graph)}
.ph-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:80px;padding:22px 0;border-top:1px solid var(--line-2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;min-height:42px;padding:0 18px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.6);color:var(--ink);text-decoration:none;font-size:14.5px;font-weight:500;transition:background-color .3s,color .3s,border-color .3s}
.chip:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* =========== SERVICES PAGE =========== */
.rows{display:flex;flex-direction:column;gap:140px;padding-top:120px}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:80px;align-items:center;scroll-margin-top:120px}
.row.flip .media{order:2}
.media{position:relative;border-radius:28px;min-height:540px;overflow:hidden;box-shadow:var(--sh-2)}
.media .badge{position:absolute;left:18px;bottom:18px;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:14px;font-weight:600}
.row h2{margin:22px 0 20px;font-size:clamp(34px,3.4vw,50px);line-height:1.04;letter-spacing:-.042em;font-weight:600}
.row .intro{margin:0;font-size:18px;line-height:1.65;color:var(--graph)}
.incl{margin:34px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.incl li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.45;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.incl li svg{flex:none;margin-top:2px}
.fit{margin:16px 0 0;border-radius:16px;padding:18px 20px;font-size:15.5px;line-height:1.55;color:var(--graph);background:var(--paper-2)}
.fit strong{font-weight:600;color:var(--ink)}
.go-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:28px;color:var(--ink);font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--ink);transition:gap .3s,color .3s,border-color .3s}
.go-link:hover{gap:16px;color:var(--sig-2);border-color:var(--sig)}

/* =========== ABOUT =========== */
.story{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 96px;padding-top:140px}
.story-copy{display:flex;flex-direction:column;gap:22px;font-size:19px;line-height:1.7;color:var(--graph);padding-top:44px}
.story-copy p{margin:0}
.story-copy p:first-child{color:var(--ink)}
.wide-photo{border-radius:32px;height:620px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.value{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--sh-1);transition:transform .5s var(--ease),box-shadow .5s}
.value:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.value .n{font-family:var(--serif);font-style:italic;font-size:54px;line-height:.9;color:#BDB9B1}
.value h3{margin:0 0 10px;font-size:23px;font-weight:600;letter-spacing:-.03em}
.value p{margin:0;color:var(--graph);font-size:15.5px;line-height:1.6}
.value.dark{background:var(--ink);border-color:var(--ink);color:#fff}
.value.dark p{color:#B9BBBF}
.value.dark .n{color:var(--sig)}
.person{border-radius:24px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);transition:transform .5s var(--ease),box-shadow .5s}
.person:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.person .ph{height:300px;margin:8px 8px 0;border-radius:18px;background-color:var(--paper-2);background-image:repeating-linear-gradient(135deg,rgba(10,11,13,.05) 0 1px,transparent 1px 12px);position:relative;display:flex;align-items:center;justify-content:center}
.person .ph span{font-family:var(--serif);font-style:italic;font-size:64px;color:#BDB9B1}
.person .ph em{position:absolute;top:14px;left:14px;font-style:normal}
.person .meta{padding:20px 22px 24px}
.facts{border-top:1px solid var(--line-2);padding-top:44px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}

/* =========== CONTACT =========== */
.contact{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:32px;align-items:start;padding-top:100px;padding-bottom:40px}
.form-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:40px;box-shadow:var(--sh-1)}
.contact form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.f{display:flex;flex-direction:column;gap:8px}
.f label{font-size:14px;font-weight:600;color:var(--ink)}
.f input,.f select,.f textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-height:54px;outline:none;transition:border-color .2s,background-color .2s,box-shadow .2s}
.f textarea{min-height:150px;resize:vertical}
.f input::placeholder,.f textarea::placeholder{color:var(--mute)}
.f input:focus,.f select:focus,.f textarea:focus{background:#fff;border-color:var(--ink);box-shadow:0 0 0 4px rgba(10,11,13,.07)}
.details{background:#fff;border:1px solid var(--line);border-radius:28px;padding:10px 28px 28px;box-shadow:var(--sh-1);position:sticky;top:110px}
.aside-pic{height:210px;border-radius:20px;margin:0 -18px 6px}
.det{display:flex;flex-direction:column;gap:6px;padding:20px 0;border-bottom:1px solid var(--line)}
.det .label{color:var(--mute);font-size:10.5px}
.det a{color:var(--ink);font-size:18px;text-decoration:none;font-weight:500}
.det span.v{font-size:17px;line-height:1.5}
.talk{margin-top:18px;background:var(--ink);color:#fff;border-radius:20px;padding:22px;display:flex;justify-content:space-between;gap:16px;align-items:center}
.talk p{margin:0}
.notice{border-radius:28px;padding:56px 44px;background:#fff;border:1px solid var(--line)}

/* =========== FOOTER =========== */
.footer{position:relative;overflow:hidden;background:var(--ink);color:#fff;margin:150px 16px 16px;border-radius:32px}
.footer .wrap-wide{padding-top:84px;padding-bottom:34px}
.fcols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
.footer .label{color:#8B8E94;margin:0 0 16px}
.footer a.fl,.footer span.fl{color:#D2D4D7;text-decoration:none;font-size:15px;line-height:2.25;display:block;transition:color .25s}
.footer a.fl:hover{color:#fff}
.fbottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:26px;color:#8B8E94;font-size:14px}
.big-word{font-size:clamp(90px,19vw,300px);line-height:.78;letter-spacing:-.07em;font-weight:600;margin:70px 0 0;white-space:nowrap;user-select:none;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.big-word i{font-style:normal;color:var(--sig);-webkit-text-fill-color:var(--sig)}

/* =========== SCROLL ANIMATIONS =========== */
html.js .reveal{opacity:0;translate:0 50px;transition:opacity 1.1s var(--ease),translate 1.1s var(--ease)}
html.js .reveal-l{opacity:0;translate:-70px 0;transition:opacity 1.1s var(--ease),translate 1.1s var(--ease)}
html.js .reveal-r{opacity:0;translate:70px 0;transition:opacity 1.1s var(--ease),translate 1.1s var(--ease)}
html.js .reveal-zoom{opacity:.4;scale:.94;transition:opacity 1.2s var(--ease),scale 1.2s var(--ease)}
html.js .reveal.in,html.js .reveal-l.in,html.js .reveal-r.in{opacity:1;translate:0 0}
html.js .reveal-zoom.in{opacity:1;scale:1}
html.js .stagger>*{opacity:0;translate:0 50px;transition:opacity 1s var(--ease) calc(var(--i,0)*100ms),translate 1s var(--ease) calc(var(--i,0)*100ms),transform .5s var(--ease),box-shadow .5s,border-color .5s,padding .5s var(--ease)}
html.js .stagger.in>*{opacity:1;translate:0 0}
html.js .img-reveal{clip-path:inset(12% 12% 12% 12% round 28px);transition:clip-path 1.5s cubic-bezier(.77,0,.18,1)}
html.js .img-reveal img{scale:1.25;transition:scale 2s var(--ease)}
html.js .img-reveal.in{clip-path:inset(0 0 0 0 round 28px)}
html.js .img-reveal.in img{scale:1}
html.js [data-split] .w>span{transform:translateY(108%);transition:transform 1s var(--ease);transition-delay:calc(var(--d,0) * 40ms)}
html.js [data-split].in .w>span{transform:none}

/* =========== RESPONSIVE =========== */
@media (max-width:1180px){
.hero-grid{grid-template-columns:1fr;gap:20px;min-height:0}
.hero-copy{max-width:720px}
.stage{height:600px;max-width:680px;width:100%;margin:0 auto}
.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.why-wrap{grid-template-columns:1fr;gap:48px}
.why-side{position:static}
.cta .fc{display:none}
.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact{grid-template-columns:1fr}
.details{position:static}
}
@media (max-width:1000px){
.nav{position:fixed;top:76px;left:0;right:0;flex-direction:column;gap:0;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;box-shadow:var(--sh-2);opacity:0;pointer-events:none;transform:translateY(-10px);transition:opacity .3s,transform .3s}
.nav.open{opacity:1;pointer-events:auto;transform:none}
.nav a{padding:14px 16px;border-radius:12px}
.menu-btn{display:inline-flex}
.topbar .btn-primary{display:none}
.topbar{background:rgba(255,255,255,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-color:rgba(10,11,13,.07)}
.stats{grid-template-columns:1fr 1fr;grid-template-rows:auto}
.stats>*{grid-row:auto!important;min-height:250px}
.cell.photo{grid-column:1 / -1;min-height:380px}
.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
.track{display:none}
.step .node{top:12px}
.row{grid-template-columns:1fr;gap:40px}
.row.flip .media{order:0}
.story{grid-template-columns:1fr;gap:20px}
.story-copy{padding-top:0}
.fcols{grid-template-columns:1fr 1fr}
.band .inner{padding:40px}
.process{padding:64px 32px}
}
@media (max-width:760px){
body{font-size:16px}
.wrap,.wrap-wide,.hero-grid,.ph-in{padding-left:20px;padding-right:20px}
.outer{padding:0 10px}
.sec{padding-top:100px}
.hero{padding-top:120px}
.hero-copy .lead{font-size:17px}
.proof{grid-template-columns:1fr;max-width:none}
.proof div,.proof div+div{padding:14px 0;border-left:0;border-bottom:1px solid var(--line)}
.stage{height:380px}
.stage-in{transform-origin:50% 0}
.stage-scale{left:50%;right:auto;width:640px;height:640px;margin-left:-320px;transform:scale(.5);transform-origin:50% 12%}
.hero{min-height:0}
.scroll-cue{display:none}
.logos{flex-direction:column;align-items:flex-start;gap:18px}
.logos .label{padding-left:20px}
.mq{width:100%}
.stats{grid-template-columns:1fr}
.svc-grid{grid-template-columns:1fr}
.sv.wide{grid-column:auto;flex-direction:column}
.sv.wide .pic{min-height:220px}
.sv.wide h3{font-size:24px}
.band{height:560px;border-radius:24px}
.why-item{grid-template-columns:56px minmax(0,1fr);padding:28px 0}
.why-item .pl{display:none}
.why-item .n{font-size:36px}
.steps{grid-template-columns:1fr}
.process,.cta,.footer{border-radius:24px}
.process{padding:52px 22px}
.cta{padding:90px 20px}
.media{min-height:340px}
.incl{grid-template-columns:1fr}
.grid4{grid-template-columns:1fr}
.form-card{padding:24px}
.contact form{grid-template-columns:1fr}
.f[style]{grid-column:auto!important}
.footer{margin:100px 10px 10px}
.fcols{grid-template-columns:1fr}
.facts{grid-template-columns:1fr}
.page-hero{padding-top:140px}
.ph-foot{margin-top:50px}
.wide-photo{height:360px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.enter{opacity:1}.chart .ln,.donut .arc-p{stroke-dashoffset:0}.chart .ar,.chart .end{opacity:1}html.js .reveal,html.js .reveal-l,html.js .reveal-r,html.js .reveal-zoom,html.js .stagger>*{opacity:1;translate:0 0;scale:1}html.js .img-reveal{clip-path:none}html.js .img-reveal img{scale:1}.w>span,html.js [data-split] .w>span,.hero-copy .w>span{transform:none}.bars i{transform:none}}

/* =========== OCEAN DEPTHS: colour rhythm =========== */
:root{--sand:#F0FFB3;--slate:#16181C;--navy:#0A0B0D;--navy-2:#0C0D10;--teal:#D4FF3A;--sea:#E3FF7A;--cream:#F3F1EC;--mist:#ECE9E2;--on-dark:#B9BBBF}
.hero{background:linear-gradient(180deg,#F3F1EC 0%,#EFEDE7 60%,#F3F1EC 100%)}
.hero .glow{background:radial-gradient(circle,rgba(212,255,58,.22) 0%,rgba(212,255,58,.07) 36%,rgba(243,241,236,0) 66%)}
.hero .glow.s{left:-14%;top:38%;width:760px;height:760px;background:radial-gradient(circle,rgba(212,255,58,.55),rgba(212,255,58,0) 64%)}
.cta::before{background:radial-gradient(circle,rgba(212,255,58,.28),rgba(212,255,58,.18) 40%,rgba(212,255,58,0) 66%)}
.page-hero .glow{background:radial-gradient(circle,rgba(212,255,58,.2),rgba(212,255,58,.18) 40%,rgba(212,255,58,0) 66%)}

.panel-dark{position:relative;overflow:hidden;isolation:isolate;background:var(--navy);color:var(--cream);border-radius:32px;padding:130px 0}
.panel-dark::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(700px circle at 88% -5%,rgba(212,255,58,.45),rgba(212,255,58,0) 60%),radial-gradient(600px circle at -5% 105%,rgba(212,255,58,.16),rgba(212,255,58,0) 60%),linear-gradient(180deg,#0A0B0D,#0C0D10)}
.panel-dark .gridbg{background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);-webkit-mask-image:radial-gradient(ellipse 60% 60% at 80% 10%,#000,transparent 70%);mask-image:radial-gradient(ellipse 60% 60% at 80% 10%,#000,transparent 70%);opacity:1}
.panel-dark .eyebrow{color:var(--sea)}
.panel-dark .eyebrow::before{background:var(--sea);box-shadow:0 0 0 4px rgba(212,255,58,.16),0 0 14px rgba(212,255,58,.7)}
.panel-dark .muted,.panel-dark p.side,.panel-dark .step p{color:var(--on-dark)}
.panel-dark .ink{background-image:linear-gradient(180deg,var(--cream) 0 50%,rgba(243,241,236,.2) 50% 100%)}
.panel-dark .cell{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.09);color:var(--cream);box-shadow:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.panel-dark .cell:hover{box-shadow:0 30px 60px -30px rgba(0,0,0,.6);border-color:rgba(212,255,58,.3)}
.panel-dark .cell .k{color:var(--on-dark)}
.panel-dark .cell.photo .cap{color:var(--navy)}
.panel-dark .cell.photo .cap .muted{color:var(--graph)}
.panel-dark .cell.dark{background:linear-gradient(155deg,#D4FF3A 0%,#A9D420 100%);border-color:transparent;color:#fff}
.panel-dark .cell.dark .k,.panel-dark .cell.dark p{color:#F1FFC4}
.panel-dark .cell.dark .pulse{background:var(--sea)}
.panel-dark .bars i{background:rgba(255,255,255,.1)}
.panel-dark .bars i:nth-last-child(2){background:rgba(212,255,58,.45)}
.panel-dark .bars i:last-child{background:linear-gradient(180deg,var(--sea),var(--teal));box-shadow:0 0 24px rgba(212,255,58,.35)}
.panel-dark .dotgrid i{background:rgba(255,255,255,.1)}
.panel-dark .in .dotgrid i{background:var(--sea)}
.panel-dark .in .dotgrid i:nth-child(8){background:var(--teal);box-shadow:0 0 12px rgba(212,255,58,.9)}
.panel-dark .value{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.09);color:var(--cream);box-shadow:none}
.panel-dark .value p{color:var(--on-dark)}
.panel-dark .value .n{color:rgba(212,255,58,.55)}
.panel-dark .value.dark{background:linear-gradient(155deg,#D4FF3A,#A9D420);border-color:transparent}
.panel-dark .value.dark p{color:#F1FFC4}
.panel-dark .value.dark .n{color:var(--sea)}

.process.panel-dark{padding:110px 72px 96px;border:0;box-shadow:none;background:transparent}
.panel-dark .track{background:rgba(255,255,255,.12)}
.panel-dark .track i{background:linear-gradient(90deg,var(--teal),var(--sea));box-shadow:0 0 18px rgba(212,255,58,.55)}
.panel-dark .step .node{background:var(--navy);border-color:rgba(255,255,255,.28)}
.panel-dark .step.on .node{background:var(--sea);border-color:var(--sea);box-shadow:0 0 0 6px rgba(212,255,58,.15),0 0 20px rgba(212,255,58,.6)}
.panel-dark .step .label{color:#8B8E94}
.panel-dark .step .tag{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:var(--cream)}
.panel-dark .step.on .tag{background:rgba(212,255,58,.28);border-color:rgba(212,255,58,.4);color:var(--sea)}

.panel-tint{position:relative;overflow:clip;background:var(--mist);border-radius:32px;padding:130px 0}
.panel-tint::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px circle at 100% 0%,rgba(212,255,58,.7),rgba(212,255,58,0) 60%)}
.panel-tint .wrap{position:relative}
.panel-tint .why-item .n{color:#C9E86A}
.panel-tint .why-list,.panel-tint .why-item{border-color:#D6D3CB}

.band .shade{background:linear-gradient(95deg,rgba(10,11,13,.94) 0%,rgba(10,11,13,.7) 42%,rgba(212,255,58,.15) 80%)}
.band .eyebrow{color:var(--sea)}
.footer{background:linear-gradient(180deg,#0A0B0D,#0C0D10)}
.footer::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(700px circle at 90% 100%,rgba(212,255,58,.35),rgba(212,255,58,0) 60%)}
.footer .wrap-wide{position:relative}
.details{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.details .det{border-color:rgba(255,255,255,.1)}
.details .det a,.details .det span.v{color:var(--cream)}
.details .label{color:var(--sea)}
.details .talk{background:linear-gradient(155deg,#D4FF3A,#A9D420);text-decoration:none}
/* v3.2.1 — ink on lime. These were #fff from the old dark card, which left the
   text invisible once the card turned lime. */
.details .talk p{color:var(--obs)!important;text-decoration:none}
.details .talk p+p{color:rgba(10,11,13,.72)!important}
.details .talk .arrow{background:var(--obs);color:var(--volt);flex:0 0 auto}
.details .talk:hover{filter:brightness(1.04)}
.details .talk:hover .arrow{transform:translate(2px,-2px)}
.details .talk .arrow{transition:transform .25s cubic-bezier(.2,.7,.3,1)}

/* breadcrumbs */
.crumbs ol{list-style:none;margin:0;padding:8px 16px;display:inline-flex;align-items:center;gap:10px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid var(--line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.crumbs li{display:inline-flex;align-items:center;gap:10px;color:var(--ink)}
.crumbs li+li::before{content:"";width:5px;height:5px;border-top:1.5px solid var(--mute);border-right:1.5px solid var(--mute);transform:rotate(45deg)}
.crumbs a{color:var(--graph);text-decoration:none;transition:color .25s}
.crumbs a:hover{color:var(--teal)}
.crumbs li[aria-current]{color:var(--teal)}

@media (max-width:1000px){.process.panel-dark{padding:72px 32px}}
@media (max-width:760px){.panel-dark,.panel-tint{padding:84px 0;border-radius:24px}.process.panel-dark{padding:56px 22px}}

/* 3D hero */
.hero-3d{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-3d canvas{display:block;position:absolute;left:0;top:0}
.hero-grid{z-index:2}
.has-3d .hero .glow{opacity:.75}

/* =========== DARK CINEMATIC HERO =========== */
.home .hero{background:radial-gradient(1100px 760px at 76% 42%,rgba(212,255,58,.32),rgba(212,255,58,0) 62%),radial-gradient(900px 640px at 6% 105%,rgba(212,255,58,.12),rgba(212,255,58,0) 60%),linear-gradient(180deg,#050506 0%,#0A0B0D 45%,#0E0F12 100%);color:var(--cream);border-radius:0 0 44px 44px}
.home .hero .glow,.home .hero .glow.w,.home .hero .glow.s{display:none}
.home .hero .gridbg{background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px)}
.home .hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(14,15,18,0),rgba(14,15,18,.6))}
.home .hero .h1{color:#F7F6F2}
.home .hero .h1 .serif{color:var(--sea)}
.home .hero .eyebrow{color:var(--sea);background:rgba(255,255,255,.05);border-color:rgba(212,255,58,.18)}
.home .hero .eyebrow::before{background:var(--sea);box-shadow:0 0 0 4px rgba(212,255,58,.15),0 0 14px rgba(212,255,58,.8)}
.home .hero .lead{color:#B4B7BC}
.home .hero .btn-primary{background:var(--sea);color:#0A0B0D;box-shadow:0 0 0 1px rgba(212,255,58,.3),0 18px 40px -16px rgba(212,255,58,.55)}
.home .hero .btn-primary:hover{background:#E3FF7A;color:#0A0B0D}
.home .hero .btn-primary .arrow{background:var(--navy);color:var(--sea)}
.home .hero .btn-ghost{background:rgba(255,255,255,.04);color:var(--cream);border-color:rgba(255,255,255,.22)}
.home .hero .btn-ghost:hover{background:rgba(255,255,255,.1);border-color:var(--sea);color:#fff}
.home .hero .proof{border-top-color:rgba(255,255,255,.14)}
.home .hero .proof div+div{border-left-color:rgba(255,255,255,.1)}
.home .hero .proof b{color:var(--cream)}
.home .hero .proof span{color:#9A9DA3}
.home .hero .scroll-cue{color:#9A9DA3}
.home .hero .scroll-cue i{border-color:rgba(255,255,255,.28)}
.home .hero .scroll-cue i::after{background:var(--sea)}
.home .hero .glass{background:rgba(12,13,16,.58);border-color:rgba(212,255,58,.16);color:var(--cream);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 70px -30px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.2)}
.home .hero .glass::after{display:none}
.home .hero .chip-ui span.s,.home .hero .chip-ui .s span{color:#A0A3A8!important}
.home .hero .ico{background:rgba(255,255,255,.07);color:var(--sea);box-shadow:inset 0 0 0 1px rgba(212,255,58,.2)}
.home .hero .ico.o{background:var(--teal);color:#fff;box-shadow:0 0 18px rgba(212,255,58,.6)}
.home .hero .spark i{background:var(--sea)}
.home .hero .spark i:nth-child(3n){background:var(--teal)}
.home .hero .avs i{border-color:#121417}
.home .hero .avs i:first-child{background:#A9D420}
.home .hero .avs i:nth-child(2){background:#3A3D44}
.home .hero .meter{background:rgba(255,255,255,.1)}
.home .hero .meter i{background:linear-gradient(90deg,var(--teal),var(--sea))}
.home .hero .code{background:rgba(5,5,6,.82);border-color:rgba(212,255,58,.18);box-shadow:0 30px 70px -30px rgba(0,0,0,.8),0 0 40px -10px rgba(212,255,58,.35)}
.home .hero .code .kw{color:#E3FF7A}.home .hero .code .st{color:var(--sea)}
.home .hero .caret{background:var(--sea)}

/* nav over the dark hero */
@media (min-width:1001px){
.topbar.on-dark .brand,.topbar.on-dark .nav a{color:var(--cream)}
.topbar.on-dark .nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.topbar.on-dark .nav a.current::after{background:var(--sea)}
.topbar.on-dark .btn-primary{background:var(--sea);color:#0A0B0D;box-shadow:none}
.topbar.on-dark.scrolled{background:rgba(5,5,6,.6);border-color:rgba(255,255,255,.08);box-shadow:0 14px 40px -24px rgba(0,0,0,.6)}
}

/* =========== SECTION RHYTHM =========== */
.panel-plain{position:relative;padding:10px 0 0}
.about-sec{padding-top:150px}
.svc-dark .sec-head .h2{color:var(--cream)}
.svc-dark .sec-head .h2 .serif{color:var(--sea)!important;opacity:.85}
.svc-dark .sv{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.08);color:var(--cream);box-shadow:none}
.svc-dark .sv:hover{background:rgba(255,255,255,.06);border-color:rgba(212,255,58,.35);color:var(--cream);box-shadow:0 30px 70px -30px rgba(0,0,0,.7),0 0 0 1px rgba(212,255,58,.15),0 0 60px -20px rgba(212,255,58,.5)}
.svc-dark .sv .pic{background:#0E0F12}
.svc-dark .sv .pic img{filter:saturate(.7) brightness(.85)}
.svc-dark .sv:hover .pic img{filter:saturate(1) brightness(1)}
.svc-dark .sv .tx{color:#B9BBBF}
.svc-dark .sv .no{background:rgba(10,11,13,.75);color:var(--sea);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.svc-dark .sv .go{color:var(--cream)}
.svc-dark .sv .go .ar{border-color:rgba(255,255,255,.2)}
.svc-dark .sv:hover .go .ar{background:var(--sea);border-color:var(--sea);color:#0A0B0D}
.svc-dark .tags span{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1);color:#D2D4D7}
.svc-dark .sec-head p.side{color:#B9BBBF}
@media (max-width:760px){.home .hero{border-radius:0 0 28px 28px}}

/* Sunset Boulevard accents */
.home .hero{background:radial-gradient(1100px 760px at 76% 42%,rgba(212,255,58,.28),rgba(212,255,58,0) 62%),radial-gradient(700px 520px at 92% 8%,rgba(240,255,179,.14),rgba(240,255,179,0) 60%),radial-gradient(900px 640px at 6% 105%,rgba(212,255,58,.12),rgba(212,255,58,0) 60%),linear-gradient(180deg,#050506 0%,#0A0B0D 45%,#0E0F12 100%)}
.home .hero .h1 .serif{background:linear-gradient(95deg,#F0FFB3 0%,#E3FF7A 45%,#D4FF3A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.06em}
.panel-dark::before{background:radial-gradient(700px circle at 88% -5%,rgba(212,255,58,.38),rgba(212,255,58,0) 60%),radial-gradient(600px circle at -5% 105%,rgba(240,255,179,.14),rgba(240,255,179,0) 60%),linear-gradient(180deg,#16181C,#0E0F12)}
.svc-dark .sec-head .h2 .serif,.panel-dark .h2 .serif{color:var(--sand)!important;opacity:1}
.panel-dark .track i{background:linear-gradient(90deg,#D4FF3A,#E3FF7A,#F0FFB3)}
.panel-dark .step.on .node{background:var(--sand);border-color:var(--sand);box-shadow:0 0 0 6px rgba(240,255,179,.18),0 0 20px rgba(240,255,179,.6)}
.panel-dark .cell.dark,.panel-dark .value.dark{background:linear-gradient(155deg,#D4FF3A 0%,#A9D420 100%)}
.panel-tint::before{background:radial-gradient(600px circle at 100% 0%,rgba(240,255,179,.45),rgba(240,255,179,0) 60%)}
.cta::before{background:radial-gradient(circle,rgba(212,255,58,.24),rgba(240,255,179,.2) 40%,rgba(240,255,179,0) 66%)}
.footer{background:linear-gradient(180deg,#16181C,#0C0D10)}
.footer::before{background:radial-gradient(700px circle at 90% 100%,rgba(212,255,58,.32),rgba(212,255,58,0) 60%)}
.band .shade{background:linear-gradient(95deg,rgba(12,13,16,.94) 0%,rgba(10,11,13,.7) 42%,rgba(212,255,58,.12) 80%)}
::selection{background:var(--teal);color:#fff}

/* =========== INNER PAGES: SAME SUNSET DARK HERO =========== */
.page-hero{background:radial-gradient(900px 640px at 82% 30%,rgba(212,255,58,.30),rgba(212,255,58,0) 62%),radial-gradient(640px 480px at 96% 0%,rgba(240,255,179,.16),rgba(240,255,179,0) 60%),radial-gradient(800px 560px at 0% 110%,rgba(212,255,58,.12),rgba(212,255,58,0) 60%),linear-gradient(180deg,#050506 0%,#0A0B0D 50%,#0E0F12 100%);color:var(--cream);border-radius:0 0 44px 44px;padding-bottom:6px}
.page-hero .glow{display:none}
.page-hero .gridbg{background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px)}
.page-hero .h1{color:#F7F6F2}
.page-hero .h1 .serif{background:linear-gradient(95deg,#F0FFB3 0%,#E3FF7A 45%,#D4FF3A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.08em}
.page-hero .lead{color:#B4B7BC}
.page-hero .ph-foot{border-top-color:rgba(255,255,255,.14)}
.page-hero .label.muted{color:#9A9DA3}
.page-hero .live{color:#D2D4D7}
.page-hero .live i{background:var(--sea)}
.page-hero .live i::after{border-color:rgba(212,255,58,.5)}
.page-hero .crumbs ol{background:rgba(255,255,255,.05);border-color:rgba(212,255,58,.18)}
.page-hero .crumbs a{color:#B4B7BC}
.page-hero .crumbs a:hover{color:#fff}
.page-hero .crumbs li+li::before{border-color:#6E7177}
.page-hero .crumbs li[aria-current]{color:var(--sea)}
.page-hero .chip{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.16);color:var(--cream)}
.page-hero .chip:hover{background:var(--sea);border-color:var(--sea);color:#0A0B0D}
/* striped sunset sun, echoes the palette */
.ph-orb{position:absolute;z-index:0;right:5%;top:50%;width:min(30vw,440px);aspect-ratio:1;transform:translateY(-50%);pointer-events:none;animation:sunFloat 9s ease-in-out infinite}
.ph-orb::after{content:"";position:absolute;inset:-6%;border-radius:50%;background:radial-gradient(circle,rgba(212,255,58,.38),rgba(212,255,58,.16) 42%,rgba(212,255,58,0) 68%);filter:blur(26px)}
.ph-orb::before{content:"";position:absolute;z-index:1;inset:12%;border-radius:50%;background:linear-gradient(180deg,#F0FFB3 0%,#F0FFB3 22%,#E3FF7A 50%,#D4FF3A 78%,#A9D420 100%);box-shadow:0 0 80px -10px rgba(212,255,58,.6);-webkit-mask-image:linear-gradient(180deg,#000 0,#000 54%,transparent 54%,transparent 57%,#000 57%,#000 65%,transparent 65%,transparent 69%,#000 69%,#000 75%,transparent 75%,transparent 80%,#000 80%,#000 85%,transparent 85%,transparent 91%,#000 91%);mask-image:linear-gradient(180deg,#000 0,#000 54%,transparent 54%,transparent 57%,#000 57%,#000 65%,transparent 65%,transparent 69%,#000 69%,#000 75%,transparent 75%,transparent 80%,#000 80%,#000 85%,transparent 85%,transparent 91%,#000 91%);opacity:.92}
.ph-orb i{position:absolute;z-index:0;left:-14%;right:-14%;height:1px;top:88%;background:linear-gradient(90deg,rgba(212,255,58,0),rgba(212,255,58,.5),rgba(212,255,58,0))}
.ph-orb i:nth-child(2){top:94%;left:-4%;right:-4%;opacity:.5}
.ph-orb i:nth-child(3){top:auto;bottom:-10%;left:6%;right:6%;height:28%;background:radial-gradient(ellipse at 50% 0,rgba(212,255,58,.28),rgba(212,255,58,0) 70%);filter:blur(10px)}
@keyframes sunFloat{50%{transform:translateY(-53%)}}
.ph-in{position:relative;z-index:2}
@media (max-width:1000px){.ph-orb{width:62vw;right:-20vw;top:30%;opacity:.45}}
@media (max-width:760px){.page-hero{border-radius:0 0 28px 28px}}
@media (prefers-reduced-motion:reduce){.ph-orb{animation:none}}

/* =========== SERVICES: LIGHT / DARK RHYTHM =========== */
.rows{padding-top:150px;padding-bottom:40px}
.row{position:relative;isolation:isolate}
.row.flip::before{content:"";position:absolute;z-index:-1;inset:-64px -56px;border-radius:36px;background:radial-gradient(640px circle at 100% 0%,rgba(212,255,58,.34),rgba(212,255,58,0) 60%),radial-gradient(520px circle at 0% 100%,rgba(240,255,179,.12),rgba(240,255,179,0) 60%),linear-gradient(180deg,#16181C,#0E0F12);box-shadow:0 40px 90px -50px rgba(5,5,6,.7)}
.row.flip{color:var(--cream)}
.row.flip h2{color:#F7F6F2}
.row.flip .eyebrow{color:var(--sea)}
.row.flip .eyebrow::before{background:var(--sea);box-shadow:0 0 0 4px rgba(212,255,58,.16),0 0 14px rgba(212,255,58,.7)}
.row.flip .intro{color:var(--on-dark)}
.row.flip .incl li{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.09);color:#E8E9EA}
.row.flip .fit{background:rgba(240,255,179,.09);color:var(--on-dark);box-shadow:inset 0 0 0 1px rgba(240,255,179,.18)}
.row.flip .fit strong{color:var(--sand)}
.row.flip .go-link{color:var(--cream);border-color:var(--sea)}
.row.flip .go-link:hover{color:var(--sea)}
.row.flip .media{box-shadow:0 30px 70px -30px rgba(0,0,0,.6)}
.row:not(.flip) .fit{background:linear-gradient(100deg,#ECE9E2,#F0EEE8)}
.row:not(.flip) .fit strong{color:var(--teal)}
@media (max-width:1000px){.row.flip::before{inset:-44px -20px;border-radius:28px}.rows{gap:120px}}
@media (max-width:760px){.row.flip::before{inset:-36px -12px}}
.row.flip .media .badge{color:var(--ink)}

/* =====================================================================
   v3 — OBSIDIAN & VOLT
   Near-black, bone white, one electric accent. Accent only on primary
   actions, one word per headline, the globe and the cursor.
   ===================================================================== */
:root{--volt:#D4FF3A;--volt-2:#E3FF7A;--obs:#0A0B0D;--obs-0:#050506;--graphite:#16181C;--bone:#F3F1EC;--ash:#8B8E94}
::selection{background:var(--volt);color:var(--obs)}
a:hover{color:var(--ink)}
.arrow{color:var(--obs)}
.btn-primary .arrow{background:var(--volt);color:var(--obs)}
.ico.o{color:var(--obs)}
.sv:hover .go .ar{color:var(--obs)}
.eyebrow::before{background:var(--obs);box-shadow:0 0 0 4px rgba(10,11,13,.08)}
.hero .eyebrow::before,.page-hero .eyebrow::before,.panel-dark .eyebrow::before,.band .eyebrow::before,.hs-panel .eyebrow::before,.footer .eyebrow::before{background:var(--volt);box-shadow:0 0 0 4px rgba(212,255,58,.14),0 0 14px rgba(212,255,58,.55)}
.panel-dark .eyebrow,.band .eyebrow,.hs-panel .eyebrow{color:#B9BBBF}
.go-link:hover{color:var(--obs);border-color:var(--obs)}
.why-item:hover .n{color:var(--obs)}
.progress{background:var(--volt)}
.live i,.pulse{background:var(--volt)}
.panel-plain .live i,.panel-tint .live i{background:var(--obs)}

/* light sections: the accent works as a highlighter, never as text */
.panel-tint .h2 .serif,.panel-plain .h2 .serif,.about-intro .h2 .serif{background:linear-gradient(transparent 60%,var(--volt) 60%,var(--volt) 90%,transparent 90%);padding:0 .1em;color:inherit}

/* accent cards: volt with ink type */
.cell.dark,.value.dark,.details .talk,.panel-dark .cell.dark,.panel-dark .value.dark{background:var(--volt)!important;border-color:transparent!important;color:var(--obs)!important}
.cell.dark *,.value.dark *,.details .talk *{color:var(--obs)!important;-webkit-text-fill-color:currentColor}
.cell.dark .pulse,.panel-dark .cell.dark .pulse{background:var(--obs)}
.details .talk .arrow{background:var(--obs)!important;color:var(--volt)!important}
.details .talk .arrow *{color:var(--volt)!important}

/* dark surfaces: true obsidian, quiet glows */
.panel-dark{background:var(--obs)}
.panel-dark::before{background:radial-gradient(760px circle at 92% -8%,rgba(212,255,58,.09),rgba(212,255,58,0) 60%),linear-gradient(180deg,#0E0F12,#0A0B0D)}
.panel-dark .track i{background:var(--volt);box-shadow:0 0 18px rgba(212,255,58,.45)}
.panel-dark .step.on .node{background:var(--volt);border-color:var(--volt)}
.panel-dark .step.on .tag{background:rgba(212,255,58,.12);border-color:rgba(212,255,58,.35);color:var(--volt)}
.footer{background:var(--obs)!important}
.footer::before{opacity:.5}
.page-hero{background:radial-gradient(900px 640px at 84% 26%,rgba(212,255,58,.08),rgba(212,255,58,0) 62%),linear-gradient(180deg,#050506 0%,#0A0B0D 100%)!important}
.page-hero .h1 .serif{background:none;-webkit-text-fill-color:var(--volt);color:var(--volt)}
.page-hero .crumbs li[aria-current]{color:var(--volt)}
.page-hero .chip:hover{background:var(--volt);border-color:var(--volt);color:var(--obs)}
.ph-orb::before{background:radial-gradient(circle at 34% 30%,rgba(212,255,58,.32),rgba(212,255,58,.05) 48%,rgba(10,11,13,0) 70%);-webkit-mask-image:none;mask-image:none;border:1px solid rgba(212,255,58,.32);box-shadow:inset 0 0 70px rgba(212,255,58,.10),0 0 90px -30px rgba(212,255,58,.35);opacity:1}
.ph-orb::after{background:radial-gradient(circle,rgba(212,255,58,.12),rgba(212,255,58,0) 62%)}
.ph-orb i{background:linear-gradient(90deg,rgba(212,255,58,0),rgba(212,255,58,.45),rgba(212,255,58,0))}
.ph-orb i:nth-child(3){background:radial-gradient(ellipse at 50% 0,rgba(212,255,58,.14),rgba(212,255,58,0) 70%)}
.row.flip::before{background:radial-gradient(640px circle at 100% 0%,rgba(212,255,58,.10),rgba(212,255,58,0) 60%),linear-gradient(180deg,#16181C,#0E0F12)}
.row.flip .fit strong{color:var(--volt)}
.row.flip .go-link{border-color:var(--volt)}
.row.flip .go-link:hover{color:var(--volt)}
.row:not(.flip) .fit{background:#ECE9E2}
.row:not(.flip) .fit strong{color:var(--obs);background:linear-gradient(transparent 58%,var(--volt) 58%)}
.big-word{color:rgba(243,241,236,.08)}
.big-word i{color:var(--volt);-webkit-text-fill-color:var(--volt)}
.topbar.on-dark{--logo-a:var(--volt)}
.topbar.on-dark .btn-primary{background:var(--volt);color:var(--obs)}
.topbar.on-dark .btn-primary:hover{background:var(--volt-2);color:var(--obs)}

/* =====================================================================
   v3 — PRELOADER
   ===================================================================== */
.bv-pre{position:fixed;inset:0;z-index:1000;display:none;flex-direction:column;justify-content:space-between;padding:30px 48px 0;background:var(--obs-0);color:var(--bone);transition:transform 1.05s cubic-bezier(.76,0,.24,1)}
html.is-loading .bv-pre{display:flex}
html.is-loading,html.is-loading body{overflow:hidden}
html.pl-out .bv-pre{transform:translateY(-100%)}
.pl-top{display:flex;justify-content:space-between;align-items:center;color:#8B8E94}
.pl-top .brand{display:inline-flex;align-items:center;gap:10px;color:var(--bone);font-family:var(--sans);font-size:20px;font-weight:600;letter-spacing:-.03em;text-transform:none}
.pl-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;color:#8B8E94}
.pl-count{font-family:var(--sans);font-size:clamp(110px,21vw,330px);font-weight:600;letter-spacing:-.07em;line-height:.74;color:var(--bone);font-variant-numeric:tabular-nums;margin-bottom:24px}
.pl-bar{height:3px;margin:0 -48px;background:rgba(243,241,236,.08)}
.pl-bar i{display:block;height:100%;background:var(--volt);transform:scaleX(0);transform-origin:0 50%}

/* =====================================================================
   v3 — CUSTOM CURSOR
   ===================================================================== */
.cur{display:none}
html.has-cursor .cur{display:block}
html.has-cursor,html.has-cursor *{cursor:none!important}
html.has-cursor input,html.has-cursor textarea,html.has-cursor select{cursor:text!important}
.cur-ring,.cur-dot{position:fixed;left:0;top:0;z-index:1001;pointer-events:none;border-radius:50%}
.cur-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--volt);mix-blend-mode:difference}
.cur-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid #fff;mix-blend-mode:difference;display:flex;align-items:center;justify-content:center;transition:width .4s cubic-bezier(.2,.7,.2,1),height .4s cubic-bezier(.2,.7,.2,1),margin .4s cubic-bezier(.2,.7,.2,1),background-color .3s,border-color .3s,opacity .3s}
.cur.hover .cur-ring{width:64px;height:64px;margin:-32px 0 0 -32px;background:#fff}
.cur.down .cur-ring{width:30px;height:30px;margin:-15px 0 0 -15px}
.cur.label .cur-ring{width:92px;height:92px;margin:-46px 0 0 -46px;background:var(--volt);border-color:var(--volt);mix-blend-mode:normal}
.cur.label .cur-dot{opacity:0}
.cur-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--obs);opacity:0;transition:opacity .25s;white-space:nowrap}
.cur.label .cur-lbl{opacity:1}
.cur.field .cur-ring,.cur.field .cur-dot,.cur.off .cur-ring,.cur.off .cur-dot{opacity:0}

/* =====================================================================
   v3 — HERO
   ===================================================================== */
.home .hero.hx{min-height:100vh;padding:0;display:block;background:radial-gradient(900px 720px at 74% 42%,rgba(212,255,58,.07),rgba(212,255,58,0) 64%),radial-gradient(700px 500px at 8% 110%,rgba(243,241,236,.04),rgba(243,241,236,0) 60%),linear-gradient(180deg,#050506 0%,#0A0B0D 100%);border-radius:0 0 40px 40px;color:var(--bone)}
.hx .stage{position:absolute;right:0;top:4%;width:58%;height:92%;z-index:1;pointer-events:none}
.hx-in{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;min-height:100vh;max-width:1480px;margin:0 auto;padding:118px 48px 40px}
.hx-top{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:auto;color:#8B8E94;opacity:0;transition:opacity 1s .5s}
.hx-top .eyebrow{color:#B9BBBF}
.hx-top .live{color:#B9BBBF}
.hx-title{margin:0;font-size:clamp(56px,9.6vw,176px);line-height:.86;letter-spacing:-.062em;font-weight:600;color:var(--bone)}
.hx-title .ln{display:block;overflow:hidden;padding:0 .04em .07em 0;margin-bottom:-.07em;will-change:transform}
.hx-title .ln>span{display:inline-block;transform:translateY(108%) rotate(4deg);transform-origin:0 100%;transition:transform 1.35s cubic-bezier(.16,1,.3,1)}
.hx-title .ln:nth-child(2)>span{transition-delay:.09s}
.hx-title .ln:nth-child(3)>span{transition-delay:.18s}
.hx-title .in2{padding-left:11vw}
.hx-title .serif{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--volt);letter-spacing:-.03em;font-size:1.06em}
.hx-foot{display:grid;grid-template-columns:minmax(0,1.05fr) auto minmax(0,.6fr);gap:40px;align-items:end;margin-top:56px;padding-top:26px;border-top:1px solid rgba(243,241,236,.12);opacity:0;transform:translateY(24px);transition:opacity 1s .55s,transform 1.2s .55s cubic-bezier(.16,1,.3,1)}
.hx-foot .lead{margin:0;max-width:470px;font-size:18px;line-height:1.6;color:#B4B7BC}
.hx-foot .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hx .btn-primary{background:var(--volt);color:var(--obs);box-shadow:0 0 0 0 rgba(212,255,58,0),0 18px 40px -18px rgba(212,255,58,.55)}
.hx .btn-primary:hover{background:var(--volt-2);color:var(--obs)}
.hx .btn-primary .arrow{background:var(--obs);color:var(--volt)}
.hx .btn-ghost{background:transparent;color:var(--bone);border:1px solid rgba(243,241,236,.22)}
.hx .btn-ghost:hover{background:var(--bone);color:var(--obs);border-color:var(--bone)}
.hx-scroll{justify-self:end;display:inline-flex;align-items:center;gap:14px;color:#8B8E94;text-decoration:none;min-height:44px}
.hx-scroll i{position:relative;width:1px;height:46px;background:rgba(243,241,236,.18);overflow:hidden}
.hx-scroll i::after{content:"";position:absolute;left:0;top:-50%;width:1px;height:50%;background:var(--volt);animation:drip 1.8s cubic-bezier(.7,0,.3,1) infinite}
.hx-scroll:hover{color:var(--bone)}
@keyframes drip{to{top:110%}}
html.ready .hx-title .ln>span{transform:none}
html.ready .hx-top{opacity:1}
html.ready .hx-foot{opacity:1;transform:none}
html:not(.js) .hx-title .ln>span{transform:none}
html:not(.js) .hx-top,html:not(.js) .hx-foot{opacity:1;transform:none}

/* =====================================================================
   v3 — SERVICES, PINNED HORIZONTAL
   ===================================================================== */
.hs-panel{position:relative;background:var(--obs);color:var(--bone);border-radius:32px;overflow:hidden;padding:110px 0 70px;isolation:isolate}
.hs-panel::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(700px circle at 6% 0%,rgba(212,255,58,.07),rgba(212,255,58,0) 60%)}
.hs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding:0 56px;margin-bottom:44px;flex-wrap:wrap}
.hs-head .h2{margin-top:20px;font-size:clamp(40px,5.2vw,86px);color:var(--bone)}
.hs-head .h2 .serif{color:var(--volt)}
.hs-meta{display:flex;flex-direction:column;align-items:flex-end;gap:22px;max-width:380px}
.hs-meta .side{margin:0;color:#A0A3A8;font-size:16px;line-height:1.6;text-align:right}
.hs-count{display:flex;align-items:center;gap:10px;color:#8B8E94}
.hs-count b{font-family:var(--sans);font-size:30px;font-weight:600;letter-spacing:-.04em;color:var(--bone);font-variant-numeric:tabular-nums}
.hs-bar{display:block;width:150px;height:2px;margin-left:10px;background:rgba(243,241,236,.14);overflow:hidden}
.hs-bar i{display:block;height:100%;background:var(--volt);transform:scaleX(0);transform-origin:0 50%}
.hs-track{display:flex;gap:18px;padding:0 56px 6px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hs-track::-webkit-scrollbar{display:none}
.hs-card{position:relative;flex:0 0 clamp(300px,30vw,460px);display:flex;flex-direction:column;min-height:540px;background:var(--graphite);border:1px solid rgba(243,241,236,.07);border-radius:24px;overflow:hidden;color:var(--bone);text-decoration:none;scroll-snap-align:start;transition:border-color .45s,background-color .45s,transform .6s cubic-bezier(.2,.7,.2,1)}
.hs-card:hover{color:var(--bone);border-color:rgba(212,255,58,.55);background:#1A1C21}
.hs-media{position:relative;height:270px;margin:10px 10px 0;border-radius:16px;overflow:hidden;background:#0E0F12}
.hs-media img{position:absolute;inset:0 -10%;width:120%;height:100%;object-fit:cover;filter:grayscale(.55) contrast(1.06) brightness(.86);transition:filter .7s,scale 1.2s cubic-bezier(.2,.7,.2,1)}
.hs-card:hover .hs-media img{filter:none;scale:1.05}
.hs-body{flex:1;display:flex;flex-direction:column;gap:12px;padding:22px 26px 26px}
.hs-top{display:flex;justify-content:space-between;align-items:center}
.hs-no{color:var(--volt)}
.hs-card .ar{width:42px;height:42px;border-radius:50%;border:1px solid rgba(243,241,236,.18);display:inline-flex;align-items:center;justify-content:center;transition:transform .5s cubic-bezier(.2,.7,.2,1),background-color .3s,color .3s,border-color .3s}
.hs-card:hover .ar{background:var(--volt);border-color:var(--volt);color:var(--obs);transform:rotate(45deg)}
.hs-card h3{margin:6px 0 0;font-size:clamp(24px,2vw,30px);line-height:1.08;letter-spacing:-.035em;font-weight:600}
.hs-card p{margin:0;color:#A0A3A8;font-size:15.5px;line-height:1.55}
.hs-card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:10px}
.hs-card .tags span{font-size:12.5px;padding:6px 11px;border-radius:999px;border:1px solid rgba(243,241,236,.12);color:#D2D4D7}
.hs-end{background:var(--volt);color:var(--obs);border-color:var(--volt);justify-content:space-between;padding:34px 32px}
.hs-end:hover{background:var(--volt-2);color:var(--obs);border-color:var(--volt-2)}
.hs-end .label{color:var(--obs);opacity:.7}
.hs-end-t{font-size:clamp(30px,2.6vw,42px);line-height:1.04;letter-spacing:-.045em;font-weight:600}
.btn-dark{align-self:flex-start;background:var(--obs);color:var(--bone)}
.btn-dark .arrow{background:var(--volt);color:var(--obs)}
.hs-end:hover .btn-dark{color:var(--bone)}
/* pinned mode (desktop, set by script) */
.hs-panel.hs-on{height:calc(100vh - 32px);padding:0;display:flex;flex-direction:column;justify-content:center}
.hs-panel.hs-on .hs-head{padding-top:64px}
.hs-panel.hs-on .hs-track{overflow:visible;scroll-snap-type:none;will-change:transform;padding-right:56px}
.hs-panel.hs-on .hs-card{min-height:0;height:min(560px,calc(100vh - 330px))}
.hs-panel.hs-on .hs-media{height:auto;flex:1 1 52%}
.hs-panel.hs-on .hs-body{flex:0 0 auto}

@media (max-width:1024px){
.hx .stage{top:70px;width:100%;height:56%;opacity:.9}
.hx-in{padding:120px 22px 32px}
.hx-title{font-size:clamp(46px,14.2vw,120px)}
.hx-title .in2{padding-left:0}
.hx-foot{grid-template-columns:1fr;gap:24px;margin-top:36px}
.hx-scroll{display:none}
.hs-panel{padding:80px 0 50px}
.hs-head{padding:0 22px}
.hs-meta{align-items:flex-start}
.hs-meta .side{text-align:left}
.hs-track{padding:0 22px 6px;scroll-padding-left:22px}
.hs-card{flex-basis:82vw;min-height:500px}
.hs-media{height:220px}
}
@media (max-width:600px){
.hx-top .live{display:none}
.bv-pre{padding:24px 22px 0}
.pl-bar{margin:0 -22px}
}
@media (prefers-reduced-motion:reduce){
.hx-title .ln>span{transform:none!important;transition:none}
.hx-top,.hx-foot{opacity:1!important;transform:none!important}
}

/* v3 fixes */
.panel-tint::before{background:none}
.panel-tint .why-item .n{color:#BDB9B1}
.panel-tint .why-item:hover .n{color:var(--obs)}
.cta::before{background:radial-gradient(circle,rgba(212,255,58,.12),rgba(212,255,58,0) 62%)}
.footer::before{background:radial-gradient(700px circle at 90% 100%,rgba(212,255,58,.08),rgba(212,255,58,0) 60%);opacity:1}
.hs-media img{inset:0 auto 0 -15%;width:130%}
.hs-card .tags span{background:rgba(243,241,236,.04)}
.hs-panel.hs-on .hs-media{flex:none;height:47%}
.home .hero.hx .eyebrow{color:#B9BBBF}
.hs-media img{max-width:none}
@media (max-width:1024px){.hx-title{font-size:clamp(42px,11.2vw,120px)}.hs-count{display:none}}
/* v3.1 — classic split hero in obsidian and volt */
.home .hero{background:radial-gradient(700px 500px at 6% 108%,rgba(243,241,236,.04),rgba(243,241,236,0) 60%),linear-gradient(180deg,#050506 0%,#0A0B0D 60%,#0E0F12 100%)}

/* v3.2 — one light source only.
   The old fixed glow sat at 74%/44% while the globe's own halo moved with the
   globe, so the two circles overlapped off-centre and left a visible seam.
   With WebGL the globe halo is the only glow. Without it we paint one glow
   where the globe would have been, so there is never a second circle. */
.home.has-3d .hero::before{display:none}
.home:not(.has-3d) .hero::before{content:"";position:absolute;z-index:0;left:50%;top:50%;width:min(980px,78vw);aspect-ratio:1;transform:translate(-18%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(212,255,58,.16),rgba(212,255,58,.06) 38%,rgba(212,255,58,0) 70%);filter:blur(22px)}
/* keep the globe reading against the page edges */
.home .hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(130% 100% at 50% 50%,rgba(5,5,6,0) 52%,rgba(5,5,6,.55) 100%)}
.home .hero .hero-grid,.home .hero .stage{position:relative;z-index:2}

/* v3.2 — the floating cards read as real panes lit by the globe */
.home .hero .glass,.home .hero .code{box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 2px 6px rgba(0,0,0,.4),0 18px 36px -14px rgba(0,0,0,.7),0 48px 90px -40px rgba(0,0,0,.9)}
.home .hero .glass::before,.home .hero .code::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(200deg,rgba(212,255,58,.14) 0%,rgba(212,255,58,0) 42%);opacity:.9}
.home .hero .glass{background:rgba(12,13,16,.62);border-color:rgba(212,255,58,.2)}
.home .hero .code{background:rgba(6,7,8,.88);border-color:rgba(212,255,58,.22)}
/* each card drifts on its own clock so the group never pulses together */
.home .hero .layer:nth-child(1) .fl{--fd:9.5s;--fdel:-1.2s}
.home .hero .layer:nth-child(2) .fl{--fd:11s;--fdel:-3.6s}
.home .hero .layer:nth-child(3) .fl{--fd:8.3s;--fdel:-5.1s}
.home .hero .eyebrow{color:#C9CBCF;background:rgba(255,255,255,.04);border-color:rgba(243,241,236,.12)}
.home .hero .eyebrow::before{background:var(--volt)}
.home .hero .h1 .serif{background:none;-webkit-text-fill-color:var(--volt);color:var(--volt)}
.home .hero .btn-primary{background:var(--volt);color:var(--obs)}
.home .hero .btn-primary .arrow{background:var(--obs);color:var(--volt)}
.home .hero .ico.o{background:var(--volt);color:var(--obs);box-shadow:0 0 18px rgba(212,255,58,.45)}
.home .hero .code{box-shadow:0 30px 70px -30px rgba(0,0,0,.8),0 0 40px -14px rgba(212,255,58,.25)}
html.is-loading:not(.ready) .hero *{animation-play-state:paused!important}
.home .hero .avs i:first-child,.home .hero .avs i:nth-child(3){color:var(--obs)}

/* =========== v3.2 — PER-PAGE HERO VISUALS =========== */
/* The old .ph-orb was a recoloured leftover of the sunset design: the same
   meaningless ball on every inner page. Each page now gets its own visual. */
.ph-orb{display:none!important}
/* the visual lines up with the right edge of the text container */
.page-hero .ph-vis{position:absolute;z-index:1;right:max(20px,calc((100% - 1328px)/2 + 48px));top:50%;transform:translateY(-50%);pointer-events:none}
/* the headline stops before the visual instead of running under it */
.phv-ledger .ph-in .h1,.phv-ledger .ph-in .lead,
.phv-clock .ph-in .h1,.phv-clock .ph-in .lead{max-width:min(660px,56%)}

/* --- ABOUT: a plain ledger of what the company actually is --- */
.ph-ledger{width:min(34vw,400px);display:flex;flex-direction:column;gap:0;border-top:1px solid rgba(243,241,236,.12)}
.ph-ledger .pl-row{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:17px 2px;border-bottom:1px solid rgba(243,241,236,.1);opacity:0;animation:plIn .7s cubic-bezier(.2,.7,.3,1) forwards}
.ph-ledger .pl-row:nth-child(1){animation-delay:.34s}
.ph-ledger .pl-row:nth-child(2){animation-delay:.42s}
.ph-ledger .pl-row:nth-child(3){animation-delay:.5s}
.ph-ledger .pl-row:nth-child(4){animation-delay:.58s}
.ph-ledger .pl-row:nth-child(5){animation-delay:.66s}
.ph-ledger .pl-k{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#80838A;white-space:nowrap}
.ph-ledger .pl-v{font-size:16.5px;font-weight:500;letter-spacing:-.01em;color:var(--cream);text-align:right}
.ph-ledger .pl-on{color:var(--volt)}
.ph-ledger .pl-v a{pointer-events:auto;color:var(--cream);text-decoration:none;border-bottom:1px solid rgba(212,255,58,.35);transition:color .2s,border-color .2s}
.ph-ledger .pl-v a:hover{color:var(--volt);border-bottom-color:var(--volt)}
.ph-ledger .pl-on::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--volt);margin-right:9px;vertical-align:middle;box-shadow:0 0 10px rgba(212,255,58,.8);animation:plPulse 2.4s ease-in-out infinite}
@keyframes plIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes plPulse{50%{opacity:.35}}

/* --- CONTACT: the office clock, so you know if anyone is there --- */
.ph-clock{width:min(30vw,340px);pointer-events:auto;text-align:left}
.ph-clock .pc-time{margin:0;font-family:var(--mono);font-size:clamp(40px,4.4vw,62px);font-weight:500;letter-spacing:-.03em;color:var(--cream);line-height:1;font-variant-numeric:tabular-nums}
.ph-clock .pc-dim{color:#50535A}
.ph-clock .pc-place{margin:12px 0 0;font-size:14.5px;color:#9A9DA3}
.ph-clock .pc-open{margin:8px 0 0;font-size:13.5px;font-family:var(--mono);letter-spacing:.06em;color:#80838A;min-height:18px}
.ph-clock .pc-open[data-open="1"]{color:var(--volt)}
.ph-clock .pc-open[data-open="1"]::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--volt);margin-right:9px;vertical-align:middle;box-shadow:0 0 10px rgba(212,255,58,.8)}
.ph-clock .pc-line{height:1px;background:rgba(243,241,236,.12);margin:26px 0 20px}
.ph-clock .pc-addr{margin:0 0 18px;font-size:15px;line-height:1.65;color:#B9BBBF}
.ph-clock .pc-mail{display:block;font-size:15px;color:var(--volt);text-decoration:none;border-bottom:1px solid rgba(212,255,58,.3);width:fit-content;margin-bottom:10px;transition:border-color .2s}
.ph-clock .pc-mail:hover{border-bottom-color:var(--volt)}

@media (max-width:1100px){
	.phv-ledger .ph-in .h1,.phv-ledger .ph-in .lead,
		.phv-clock .ph-in .h1,.phv-clock .ph-in .lead{max-width:100%}
	/* the visual drops below the text and picks up the same container padding */
	/* The visual sits before the text in the markup so it can be pinned to the
	   right on desktop. Once it drops into the flow it has to follow the
	   heading, not lead it. */
	.page-hero{display:flex;flex-direction:column;justify-content:center}
	.page-hero .ph-in{order:1}
	.page-hero .ph-vis{order:2;position:static;transform:none;width:100%;max-width:1328px;margin:46px auto 0;padding:0 48px}
	.page-hero .ph-ledger,.page-hero .ph-clock{width:100%;max-width:440px}
	.ph-clock .pc-time{font-size:46px}
}
@media (max-width:760px){
	.page-hero .ph-vis{padding-left:20px;padding-right:20px}
}
@media (prefers-reduced-motion:reduce){
	.ph-ledger .pl-row{animation:none;opacity:1}
	.ph-ledger .pl-on::before{animation:none}
}

/* =========== v3.2.1 — REPLACING FILLER IMAGERY WITH CONTENT =========== */

/* Homepage stats grid: the first cell was a stock portrait that said nothing.
   It now carries the section's actual claim, and spans both rows as the photo did. */
.cell-who{grid-row:1 / 3}
.cell-who .big{line-height:.94}
.who-line{display:flex;gap:7px;margin-top:22px}
.who-line i{width:34px;height:4px;border-radius:99px;background:var(--ink);opacity:.14}
.who-line i:first-child{background:var(--volt);opacity:1;width:52px}
@media (max-width:1000px){.cell-who{grid-column:1 / -1;grid-row:auto}}

/* About: a typographic statement in place of the filler photo band */
.say{max-width:1000px}
.say-k{margin:0 0 26px;font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#8B8E94}
.say-t{margin:0;font-size:clamp(30px,4.6vw,62px);line-height:1.1;letter-spacing:-.035em;font-weight:600;color:var(--ink)}
.say-t .serif{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.02em}
.say::before{content:"";display:block;width:58px;height:3px;border-radius:99px;background:var(--volt);margin-bottom:32px}
@media (max-width:760px){.say-t{font-size:30px}}

/* =========== v3.3 — SECURITY PHOTO CROP =========== */
/* The server-room photo has a strip of other companies' logos across its
   bottom fifth. Putting another firm's branding on a client site implies a
   partnership that isn't there, so this one image is zoomed and top-anchored
   until only the racks and the engineer are in frame. */
.hs-media img[data-img="security"],
.row-media img[data-img="security"],
.cover[data-img="security"]{
	width:150%;inset:0 auto 0 -25%;max-width:none;
	object-position:center 8%!important;
}
@media (max-width:1024px){
	.hs-media img[data-img="security"]{width:160%;inset:0 auto 0 -30%}
}

/* =========== v3.4 — MOBILE PASS =========== */

/* 1. Horizontal reveals pushed content 70px past the right edge on narrow
      screens, which let the whole page scroll sideways. On phones they come
      up from below instead, so nothing ever sits outside the viewport. */
@media (max-width:760px){
	html.js .reveal-l,html.js .reveal-r{translate:0 40px}
}
/* Belt and braces: clip rather than hide, so the pinned services section and
   any sticky headers keep working. */
html{overflow-x:clip}
body{overflow-x:clip}

@media (max-width:760px){
	/* 2. Tap targets. Apple and Google both ask for ~44px; these links were
	      19-25px tall, which is a miss on a phone. Padding is added to the
	      link itself so the whole row is tappable, not just the glyphs. */
	.fcol a,.fl{display:inline-flex;align-items:center;min-height:44px;padding:4px 0}
	.ph-clock .pc-mail{min-height:44px;display:inline-flex;align-items:center}
	.crumbs a,.crumbs li{min-height:40px;display:inline-flex;align-items:center}
	.brand{min-height:44px;display:inline-flex;align-items:center}
	.ph-ledger .pl-v a{min-height:40px;display:inline-flex;align-items:center}
	/* phone and email written inline in a paragraph, and the contact rows */
	.hq-links a,.details .det a{min-height:44px;display:inline-flex;align-items:center}

	/* 3. Small caps labels were 11.5px, below comfortable reading size. */
	.label,.ph-ledger .pl-k,.ph-clock .pc-open{font-size:12.5px}

	/* 4. The footer columns sat tight together once the links grew. */
	.fcols{gap:28px 20px}

	/* 5. Hero: the floating cards crowded the headline on a phone, so only
	      the two that carry a real message stay, and they sit clear of it. */
	.home .hero .stage{opacity:.55}
	.home .hero .layer:nth-child(1){display:none}

	/* 6. Forms: iOS zooms the page when a field's text is under 16px. */
	.f input,.f select,.f textarea{font-size:16px}
	.f .row2{grid-template-columns:1fr}
}