/* Self-hosted fonts (SIL Open Font License, see assets/fonts/OFL-*.txt).
   The latin-ext files are only downloaded if a page uses one of their characters. */
@font-face{font-family:"Geist"; font-style:normal; font-weight:300 700; font-display:swap;
  src:url(../fonts/geist-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Geist"; font-style:normal; font-weight:300 700; font-display:swap;
  src:url(../fonts/geist-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Instrument Serif"; font-style:italic; font-weight:400; font-display:swap;
  src:url(../fonts/instrument-serif-italic-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Instrument Serif"; font-style:italic; font-weight:400; font-display:swap;
  src:url(../fonts/instrument-serif-italic-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}

:root{
  --bg:#FAFBFC; --surface:#F1F4F7; --card:#FFFFFF; --ink:#0D1B2A; --muted:#5B6675; --line:#E3E8EE;
  --brand:#1B76AF; --brand-dark:#145C89; --sky:#85D0FF; --coral:#F8766D; --brand-soft:#EAF5FD; --accent:#16679A;
  --dark:#0B1622;
  --sans:"Geist", "Helvetica Neue", Arial, system-ui, sans-serif;
  --serif:"Instrument Serif", "Iowan Old Style", Georgia, serif;
  --r-lg:18px; --r-md:12px; --shadow:0 1px 2px rgba(13,27,42,.04), 0 10px 28px -14px rgba(13,27,42,.16);
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0A121C; --surface:#0F1A27; --card:#132030; --ink:#EEF3F8; --muted:#9AA8B8; --line:#20314A; --brand-soft:#132C44; --accent:#85D0FF}}
:root[data-theme="dark"]{--bg:#0A121C; --surface:#0F1A27; --card:#132030; --ink:#EEF3F8; --muted:#9AA8B8; --line:#20314A; --brand-soft:#132C44; --accent:#85D0FF}
html{scroll-behavior:smooth; scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit; text-decoration:none}
:focus-visible{outline:2px solid var(--brand); outline-offset:3px; border-radius:6px}
.wrap{max-width:1240px; margin:0 auto; padding:0 28px}
h1,h2,h3{margin:0; font-weight:500; letter-spacing:-.03em; line-height:1.04}
h2{font-size:clamp(34px,4.2vw,52px)}
em.s{font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:-.01em; color:var(--accent)}
h2 em.s{color:var(--muted)}
p{margin:0}
.kicker{display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:18px}

.lede{color:var(--muted); font-size:17px; max-width:56ch}

/* Buttons — colors from the logo: deep blue body, coral + sky chevrons */
.btn{--c1:var(--coral); --c2:var(--sky); display:inline-flex; align-items:center; gap:12px; height:48px; padding:0 22px 0 24px; border-radius:999px; font:inherit; font-size:15px; font-weight:500; cursor:pointer; border:1px solid transparent; transition:background .2s, border-color .2s, box-shadow .2s, transform .2s}
.btn .cv{transition:transform .25s}
.btn:hover .cv{transform:translateX(3px)}
.btn-primary{background:var(--brand); color:#fff; box-shadow:0 8px 20px -10px rgba(27,118,175,.8)}
.btn-primary:hover{background:var(--brand-dark); box-shadow:0 10px 24px -10px rgba(27,118,175,.9)}
.btn-line{--c2:var(--brand); border-color:#BFD9EA; background:var(--card); color:var(--brand)}
.btn-line:hover{border-color:var(--brand); background:var(--brand-soft)}
.btn-white{--c2:var(--brand); background:#fff; color:var(--brand)}
.btn-white:hover{background:#EAF5FD}
.link{display:inline-flex; gap:6px; align-items:center; font-weight:500; font-size:15px; color:var(--accent); border-bottom:1px solid currentColor; padding-bottom:2px}

/* Nav */
.nav{position:sticky; top:0; z-index:50; background:color-mix(in srgb,var(--bg) 85%,transparent); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid transparent; transition:border-color .2s; padding-top:env(safe-area-inset-top,0px)}
.nav.scrolled{border-color:var(--line)}
.nav .wrap{display:flex; align-items:center; height:76px; gap:32px}
.brand{display:flex; align-items:center}
.brand img{height:30px; width:auto; display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .nav .brand img{filter:brightness(1.35)}}
.menu{display:flex; gap:4px; list-style:none; margin:0 auto; padding:0}
.menu > li{position:relative}
.menu > li > a,.menu > li > button{display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; font:inherit; font-size:14.5px; color:var(--muted); background:none; border:0; cursor:pointer}
.menu > li > a:hover,.menu > li > button:hover{color:var(--ink); background:var(--surface)}
.dd{position:absolute; top:calc(100% + 8px); left:0; min-width:250px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:8px; box-shadow:0 20px 40px -16px rgba(13,27,42,.25); opacity:0; visibility:hidden; transform:translateY(-4px); transition:.18s; list-style:none; margin:0}
.dd a{display:block; padding:10px 12px; border-radius:9px; font-size:14.5px}
.dd a:hover{background:var(--brand-soft)}
.dd small{display:block; color:var(--muted); font-size:13px}
.nav-r{display:flex; align-items:center; gap:18px}
.nav-r .txt{font-size:14.5px; color:var(--muted)}
.nav-r .txt:hover{color:var(--ink)}
.nav-r .btn{height:42px; padding:0 18px 0 20px; font-size:14px}
.burger{display:none; background:none; border:1px solid var(--line); border-radius:999px; height:42px; padding:0 16px; font:inherit; font-size:14px; color:var(--ink); cursor:pointer}

/* Hero */
.hero{padding:56px 0 96px}
.pill{display:inline-flex; align-items:center; gap:8px; padding:6px 14px 6px 8px; border:1px solid var(--line); border-radius:999px; font-size:13px; color:var(--muted); background:var(--card)}
.pill i{width:22px; height:22px; border-radius:50%; background:#FEECEB; display:grid; place-items:center}
.pill i::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--coral); animation:ping 2.2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(248,118,109,.55)}80%,100%{box-shadow:0 0 0 8px rgba(248,118,109,0)}}
.hero h1{font-size:clamp(46px,7vw,92px); margin-top:26px; max-width:15ch; letter-spacing:-.045em; line-height:.98}
.hero .lede{margin-top:26px; font-size:18px}
.hero-cta{display:flex; gap:12px; margin-top:34px; flex-wrap:wrap}
.hero-media{display:grid; grid-template-columns:2.1fr 1fr; gap:20px; margin-top:64px}
.frame{position:relative; border-radius:var(--r-lg); overflow:hidden; background:#0b1622; isolation:isolate}
.frame svg.illo{display:block; width:100%; height:100%}
.hero-frame{aspect-ratio:16/10.2}
.chips{position:absolute; left:20px; bottom:20px; right:20px; display:flex; gap:10px; flex-wrap:wrap}
.chip{display:flex; align-items:center; gap:10px; padding:9px 14px 9px 9px; border-radius:14px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); color:#fff; font-size:13px; line-height:1.3}
.chip small{display:block; color:rgba(255,255,255,.72); font-size:11.5px}
.av{width:34px; height:34px; border-radius:50%; background:var(--coral); display:grid; place-items:center; font-weight:600; font-size:12px; color:#fff}
.live{width:8px; height:8px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 4px rgba(74,222,128,.25); margin:0 4px}
.stats{display:grid; gap:14px}
.stat{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:22px 24px; display:flex; flex-direction:column; justify-content:center; box-shadow:var(--shadow); position:relative; overflow:hidden}
.stat::after{content:""; position:absolute; right:-18px; top:-18px; width:54px; height:54px; border-radius:50%; background:var(--brand-soft)}
.stat b{font-size:38px; font-weight:500; letter-spacing:-.04em; line-height:1}
.stat span{color:var(--muted); font-size:13.5px; margin-top:8px}

/* Logos */
.logos{padding:28px 0 36px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface)}
.logos p{text-align:center; font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:22px}
.marquee{overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.track{display:flex; gap:64px; width:max-content; animation:mq 38s linear infinite}
.track span{font-size:24px; font-weight:600; letter-spacing:-.03em; color:var(--muted); opacity:.7; white-space:nowrap}
.track span:nth-child(3n){font-family:var(--serif); font-style:italic; font-weight:400; font-size:27px}
.track span:nth-child(4n){letter-spacing:.06em; font-size:20px}
@keyframes mq{to{transform:translateX(-50%)}}

section{padding:120px 0}
.sec-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap; margin-bottom:56px}
.sec-head .lede{max-width:42ch}

/* About */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center}
.about .frame{aspect-ratio:4/3.2; background:#e7ebf0}
.about .frame svg{position:absolute; inset:0}
.about-q{font-size:clamp(24px,2.4vw,32px); line-height:1.3; letter-spacing:-.02em; font-weight:400}
.about-q em.s{color:var(--accent)}
.about p.lede{margin-top:22px}
.values{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:36px}
.value{border-top:2px solid var(--line); padding-top:16px}
.value:first-child{border-color:var(--coral)}
.value:nth-child(2){border-color:var(--sky)}
.value:nth-child(3){border-color:var(--brand)}
.value b{font-weight:500; font-size:16px}
.value p{color:var(--muted); font-size:14px; margin-top:6px}

/* Services 2x2 */
.svc-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.svc{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); display:flex; flex-direction:column; transition:transform .3s, box-shadow .3s}
.svc:hover{transform:translateY(-3px); box-shadow:0 26px 50px -26px rgba(13,27,42,.3)}
.svc .frame{border-radius:0; aspect-ratio:16/10; background:#eef3f8}
.svc .frame svg{position:absolute; inset:0}
.svc-body{padding:34px 36px 36px; display:flex; flex-direction:column; flex:1}
.svc-tag{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); display:flex; gap:10px; align-items:center}
.svc-tag b{color:var(--accent); font-weight:600}
.svc-tag::after{content:""; height:1px; width:40px; background:var(--line)}
.svc h3{font-size:30px; margin-top:18px}
.svc .sub{font-family:var(--serif); font-style:italic; color:var(--accent); font-size:19px; margin-top:6px}
.svc p.d{color:var(--muted); margin-top:14px; max-width:52ch}
.ticks{list-style:none; padding:0; margin:20px 0 26px; display:grid; gap:10px; font-size:15px}
.ticks li{display:flex; gap:10px; align-items:center}
.svc .link{margin-top:auto; align-self:flex-start}

/* Industries */
.ind{background:var(--surface)}
.ind-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.tile{position:relative; border-radius:var(--r-md); overflow:hidden; aspect-ratio:4/5.2; color:#fff; display:block; background:#0b1622}
.tile svg.illo{position:absolute; inset:0; width:100%; height:100%; transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.tile:hover svg.illo,.tile:focus-visible svg.illo{transform:scale(1.06)}
.tile::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,8,13,0) 42%,rgba(5,8,13,.86))}
.tile-txt{position:absolute; left:20px; right:20px; bottom:18px; z-index:2}
.tile-txt small{font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.75}
.tile-txt b{display:block; font-size:22px; font-weight:500; letter-spacing:-.02em; margin-top:4px}
.tile-txt p{font-size:13.5px; opacity:.82; margin-top:6px}
.fit{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:32px; display:flex; flex-direction:column; justify-content:center; gap:14px}
.fit h3{font-family:var(--serif); font-style:italic; font-weight:400; font-size:32px; letter-spacing:-.01em; line-height:1.1}
.fit p{color:var(--muted); font-size:15px}
.fit .btn{align-self:flex-start; margin-top:10px}

/* Process */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; list-style:none; padding:0; margin:0}
.step{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:30px 26px 32px; position:relative; overflow:hidden}
.step .n{font-family:var(--serif); font-style:italic; font-size:52px; color:var(--accent); line-height:1}
.step .bar{position:absolute; top:46px; right:26px; width:56px; height:2px; background:linear-gradient(90deg,var(--coral),var(--sky))}
.step h3{font-size:19px; margin-top:28px; letter-spacing:-.02em}
.step p{color:var(--muted); font-size:14.5px; margin-top:10px}

/* Benefits */
.ben-sec{background:var(--surface)}
.ben{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.bc{position:relative; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/5; color:#fff; background:#0b1622}
.bc svg.illo{position:absolute; inset:0; width:100%; height:100%}
.bc-txt{position:absolute; left:28px; right:28px; bottom:28px; z-index:2}
.bc-txt small{font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.72}
.bc-txt h3{font-size:28px; margin-top:8px}
.bc-txt p{opacity:.82; font-size:14.5px; margin-top:10px}
.bc-txt .btn{margin-top:18px; height:42px; font-size:14px}

/* Testimonials */
.quote-sec{background:var(--dark); color:#fff; position:relative; overflow:hidden; text-align:center}
.quote-sec::before{content:""; position:absolute; width:900px; height:900px; left:50%; top:-420px; transform:translateX(-50%); background:radial-gradient(circle,rgba(27,118,175,.5),transparent 60%)}
.quote-sec::after{content:""; position:absolute; width:500px; height:500px; right:-160px; bottom:-260px; background:radial-gradient(circle,rgba(248,118,109,.18),transparent 60%)}
.qmark{font-family:var(--serif); font-size:96px; line-height:.6; color:var(--sky); height:44px; position:relative}
.qs{position:relative; min-height:230px; margin-top:24px; z-index:1}
.q{position:absolute; inset:0; opacity:0; transform:translateY(10px); transition:opacity .6s, transform .6s; margin:0}
.q.on{opacity:1; transform:none; position:relative}
.q blockquote{margin:0 auto; font-family:var(--serif); font-style:italic; font-size:clamp(28px,3.6vw,44px); line-height:1.18; max-width:30ch; letter-spacing:-.01em}
.q figcaption{margin-top:30px; font-size:14px; color:rgba(255,255,255,.65)}
.q figcaption b{display:block; color:#fff; font-weight:500; font-size:15px}
.qnav{display:flex; justify-content:center; align-items:center; gap:14px; margin-top:34px; position:relative; z-index:1}
.qnav button.arr{width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.22); background:none; color:#fff; cursor:pointer; font:inherit}
.qnav button.arr:hover{border-color:var(--sky)}
.dots{display:flex; gap:6px}
.dots button{width:8px; height:8px; padding:0; border-radius:99px; border:0; background:rgba(255,255,255,.3); cursor:pointer; transition:width .3s, background .3s}
.dots button[aria-current="true"]{width:28px; background:var(--sky)}

/* Contact */
.contact-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:72px; align-items:start}
.contact h2{font-size:clamp(34px,4vw,50px)}
.cinfo{margin-top:40px; display:grid; gap:22px}
.cinfo > div{display:flex; gap:14px; align-items:center}
.cinfo i{width:44px; height:44px; border-radius:12px; background:var(--brand-soft); color:var(--brand); display:grid; place-items:center; flex:none}
.cinfo small{display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.cinfo a,.cinfo span{font-weight:500}
form{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:36px; box-shadow:var(--shadow); display:grid; grid-template-columns:1fr 1fr; gap:18px}
.seg{grid-column:1/-1; display:flex; padding:4px; background:var(--surface); border-radius:999px; border:1px solid var(--line)}
.seg button{flex:1; height:42px; border-radius:999px; border:0; background:none; font:inherit; font-size:14px; color:var(--muted); cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--brand); color:#fff; font-weight:500}
.field{display:grid; gap:7px}
.field.full{grid-column:1/-1}
label{font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:500}
input,select,textarea{font:inherit; font-size:15px; color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:12px 14px; width:100%; transition:border-color .2s, box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--brand); box-shadow:0 0 0 4px var(--brand-soft)}
textarea{min-height:110px; resize:vertical}
.form-foot{grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap}
.form-foot small{color:var(--muted); font-size:13px}
.msg{grid-column:1/-1; display:none; padding:12px 14px; border-radius:10px; font-size:14.5px; background:#E8F6EE; color:#155C3A}
.msg.err{background:#FDECEA; color:#8A1F11}
.msg.show{display:block}

/* Footer */
footer{background:var(--dark); color:rgba(255,255,255,.66); padding:88px 0 28px; overflow:hidden; position:relative}
footer .stripe{position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--coral),var(--sky) 50%,var(--brand))}
.fgrid{display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:40px}
footer .brand img{filter:brightness(0) invert(1); height:28px}
footer .tag{font-family:var(--serif); font-style:italic; font-size:30px; line-height:1.15; color:#fff; margin-top:24px; max-width:16ch}
footer h4{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.45); font-weight:500; margin:6px 0 18px}
footer ul{list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:14.5px}
footer a:hover{color:var(--sky)}
.word{font-size:clamp(64px,15vw,224px); font-weight:600; letter-spacing:-.06em; line-height:.8; margin-top:80px; text-align:center; background:linear-gradient(180deg,rgba(133,208,255,.18),rgba(133,208,255,0) 85%); -webkit-background-clip:text; background-clip:text; color:transparent; white-space:nowrap; user-select:none}
.fbot{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px; border-top:1px solid rgba(255,255,255,.08); padding-top:22px; margin-top:64px}
.fbot nav{display:flex; gap:22px}

/* ===== Illustration motion ===== */
svg .edge{stroke-dasharray:400; stroke-dashoffset:400; animation:draw 1.6s ease-out forwards}
@keyframes draw{to{stroke-dashoffset:0}}
svg .float{animation:fl 6s ease-in-out infinite}
svg .float.f1{animation-delay:-1.5s} svg .float.f2{animation-delay:-3s} svg .float.f3{animation-delay:-4.5s}
@keyframes fl{50%{transform:translateY(-6px)}}
svg .route{animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-28}}
svg .traveler{animation:travel 8s ease-in-out infinite}
@keyframes travel{0%,18%{transform:translate(0,0)}48%,88%{transform:translate(480px,-30px)}96%,100%{transform:translate(0,0); opacity:1}}
svg .matched{transform-box:fill-box; transform-origin:center; animation:pop 8s ease-out infinite}
@keyframes pop{0%,48%{transform:scale(0)}54%{transform:scale(1.25)}58%,88%{transform:scale(1)}94%,100%{transform:scale(0)}}
svg .slot-wait{animation:sw 8s steps(1) infinite} svg .slot-done{animation:sd 8s steps(1) infinite}
@keyframes sw{0%,47%{opacity:1}48%,89%{opacity:0}90%,100%{opacity:1}}
@keyframes sd{0%,47%{opacity:0}48%,89%{opacity:1}90%,100%{opacity:0}}
svg .meter{transform-box:fill-box; transform-origin:left; animation:meter 8s ease-out infinite}
@keyframes meter{0%,48%{transform:scaleX(.25)}62%,90%{transform:scaleX(1)}100%{transform:scaleX(.25)}}
svg .idle{animation:idle 5s ease-in-out infinite}
svg .idle.d2{animation-delay:-1.2s} svg .idle.d3{animation-delay:-2.5s} svg .idle.d4{animation-delay:-3.6s}
@keyframes idle{50%{transform:translateY(-3px)}}
svg .bar{transform-box:fill-box; transform-origin:left; animation:bar 7s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes bar{0%{transform:scaleX(0)}18%,86%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
svg .popin{transform-box:fill-box; transform-origin:left center; animation:popin 7s ease-out infinite}
@keyframes popin{0%{transform:scale(.6); opacity:0}8%{transform:scale(1.04); opacity:1}12%,86%{transform:none; opacity:1}96%,100%{opacity:0}}
svg .spin{transform-box:fill-box; transform-origin:center; animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
svg .feed{animation:feed 3s ease-in-out infinite}
@keyframes feed{0%,20%{transform:translateX(0)}60%{transform:translateX(22px)}100%{transform:translateX(0)}}
svg .sign{stroke-dasharray:320; stroke-dashoffset:320; animation:sign 6s ease-in-out infinite}
@keyframes sign{0%,10%{stroke-dashoffset:320}45%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:320}}
svg .seal2{transform-box:fill-box; transform-origin:center; animation:seal 6s ease-out infinite}
@keyframes seal{0%,45%{transform:scale(0) rotate(-30deg)}53%{transform:scale(1.12) rotate(0)}58%,90%{transform:scale(1)}100%{transform:scale(0)}}
svg .type{transform-box:fill-box; transform-origin:left; animation:type 6s steps(8) infinite}
@keyframes type{0%{transform:scaleX(0)}25%,90%{transform:scaleX(1)}100%{transform:scaleX(0)}}
svg .spark-line{stroke-dasharray:300; stroke-dashoffset:300; animation:sign 5s ease-in-out infinite}
svg .led{animation:led 1.6s steps(2) infinite}
@keyframes led{50%{opacity:.25}}
svg .grow{transform-box:fill-box; transform-origin:bottom; animation:grow 6s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes grow{0%{transform:scaleY(0)}22%,88%{transform:scaleY(1)}100%{transform:scaleY(0)}}
svg .draw{stroke-dasharray:140; stroke-dashoffset:140; animation:sign 6s ease-in-out infinite}
svg .ecg{stroke-dasharray:60 400; animation:ecg 2.2s linear infinite}
@keyframes ecg{from{stroke-dashoffset:60}to{stroke-dashoffset:-400}}
svg .glow-cross{animation:glow 3s ease-in-out infinite}
@keyframes glow{50%{opacity:.75}}
svg .climb{animation:climb 7s ease-in-out infinite}
@keyframes climb{0%{transform:translate(0,130px)}80%{transform:translate(0,0)}86%,100%{transform:translate(0,0); opacity:0}}
svg .progress{transform-box:fill-box; transform-origin:left; animation:prog 6s ease-in-out infinite}
@keyframes prog{0%{transform:scaleX(.1)}70%,90%{transform:scaleX(1)}100%{transform:scaleX(.1)}}
svg .badge-pop{transform-box:fill-box; transform-origin:center; animation:pop 6s ease-out infinite; animation-delay:-2s}
svg .chat{animation:msg 7s ease-out infinite}
@keyframes msg{0%{opacity:0; transform:translateY(12px)}8%,88%{opacity:1; transform:none}96%,100%{opacity:0}}
svg .typing circle{animation:tdot 1s ease-in-out infinite}
@keyframes tdot{50%{transform:translateY(-4px); opacity:.5}}
.paused svg *{animation-play-state:paused!important}

.rise{opacity:0; transform:translateY(16px); animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.rise.d1{animation-delay:.08s} .rise.d2{animation-delay:.16s} .rise.d3{animation-delay:.26s} .rise.d4{animation-delay:.38s}
@keyframes rise{to{opacity:1; transform:none}}

@media (max-width:1060px){
  .menu,.nav-r .txt{display:none}
  .burger{display:inline-flex; align-items:center}
  .nav-r{margin-left:auto}
  .menu.open{display:flex; flex-direction:column; position:absolute; top:76px; left:0; right:0; background:var(--bg); border-bottom:1px solid var(--line); padding:12px 20px 20px; margin:0}
  .menu.open .dd{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; padding:0 0 0 14px; background:none}
  .hero-media{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(4,1fr)}
  .about-grid,.contact-grid{grid-template-columns:1fr; gap:48px}
  .ind-grid{grid-template-columns:repeat(2,1fr)}
  .ben{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .fgrid{grid-template-columns:1fr 1fr 1fr}
  .fgrid > div:first-child{grid-column:1/-1}
}
@media (max-width:680px){
  .wrap{padding:0 20px}
  section{padding:84px 0}
  .hero{padding:36px 0 64px}
  .hero-media{margin-top:44px}
  .hero-frame{aspect-ratio:4/4.4}
  .stats{grid-template-columns:1fr 1fr}
  .stat b{font-size:30px}
  .chip:nth-child(2){display:none}
  .values,.svc-grid,.ind-grid,.ben,.steps{grid-template-columns:1fr}
  .svc-body{padding:28px 24px}
  .svc h3{font-size:26px}
  .tile{aspect-ratio:4/3.9}
  .bc{aspect-ratio:4/4.4}
  form{grid-template-columns:1fr; padding:24px}
  .fgrid{grid-template-columns:1fr 1fr}
  .nav-r .btn-primary{display:none}
  .nav .brand img{height:26px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important; transition:none!important}
  svg .edge,svg .sign,svg .draw,svg .spark-line{stroke-dashoffset:0}
  svg .slot-wait{opacity:0} svg .slot-done{opacity:1}
  .rise{opacity:1; transform:none}
}

.skip{position:absolute; left:-9999px; top:8px; z-index:99; background:var(--brand); color:#fff; padding:10px 16px; border-radius:8px}
.skip:focus{left:12px}
.assure{display:flex; flex-wrap:wrap; gap:10px 24px; list-style:none; padding:0; margin:26px 0 0; font-size:14.5px; color:var(--muted)}
.assure li{display:flex; align-items:center; gap:8px}
.proc{background:var(--surface)}
.perks{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:20px}
.perk{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:24px}
.perk i{width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand); margin-bottom:16px}
.perk:nth-child(2) i{background:#FEECEB; color:#C2463E}
.perk b{font-weight:500; font-size:16.5px; letter-spacing:-.01em}
.perk p{color:var(--muted); font-size:14px; margin-top:6px}
.tile-cta{display:inline-flex; align-items:center; gap:6px; margin-top:12px; font-size:13.5px; font-weight:500; color:#fff; border-bottom:1px solid rgba(255,255,255,.5); padding-bottom:2px; opacity:0; transform:translateY(6px); transition:.3s}
.tile:hover .tile-cta,.tile:focus-visible .tile-cta{opacity:1; transform:none}
@media (hover:none){.tile-cta{opacity:1; transform:none}}
.next{list-style:none; padding:0; margin:32px 0 0; display:grid; gap:14px}
.next li{display:flex; gap:14px; align-items:center; font-size:15.5px}
.next b{width:30px; height:30px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:13px; font-weight:600; color:#fff; background:var(--brand)}
.next li:first-child b{background:#C2463E}
.contact .cinfo{margin-top:36px; padding-top:28px; border-top:1px solid var(--line)}
.drop{display:flex; align-items:center; gap:14px; padding:16px; border:1.5px dashed #B9D4E6; border-radius:12px; background:var(--brand-soft); cursor:pointer; text-transform:none; letter-spacing:0; color:var(--ink); font-size:15px; transition:border-color .2s, background .2s}
.drop:hover,.drop.over{border-color:var(--brand)}
.drop.has{border-style:solid; border-color:var(--brand)}
.drop input{position:absolute; width:1px; height:1px; opacity:0}
.drop:focus-within{box-shadow:0 0 0 4px var(--brand-soft); border-color:var(--brand)}
.drop-ico{width:44px; height:44px; border-radius:12px; background:var(--card); color:var(--brand); display:grid; place-items:center; flex:none}
.drop-t{flex:1; min-width:0}
.drop-t b{display:block; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.drop-t small{color:var(--muted); font-size:13px}
.drop-btn{font-size:14px; font-weight:500; color:var(--brand); padding:8px 14px; border-radius:999px; background:var(--card); border:1px solid #BFD9EA}
.employers{padding-top:0}
.emp{background:var(--dark); color:#fff; border-radius:24px; padding:56px; display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:center; position:relative; overflow:hidden}
.emp::before{content:""; position:absolute; width:520px; height:520px; right:-160px; top:-220px; background:radial-gradient(circle,rgba(27,118,175,.55),transparent 62%)}
.emp > *{position:relative}
.emp h2{font-size:clamp(28px,3.2vw,40px)}
.emp h2 em.s{color:var(--sky)}
.emp p{color:rgba(255,255,255,.72); margin-top:16px; max-width:52ch}
.emp-list{list-style:none; padding:0; margin:0 0 24px; display:grid; grid-template-columns:1fr 1fr; gap:10px}
.emp-list li{padding:12px 14px; border:1px solid rgba(255,255,255,.14); border-radius:12px; font-size:14.5px; background:rgba(255,255,255,.04)}
@media (max-width:1060px){.perks{grid-template-columns:1fr 1fr}.emp{grid-template-columns:1fr; padding:40px}}
@media (max-width:680px){.perks,.emp-list{grid-template-columns:1fr}.emp{padding:30px 24px}.assure{gap:8px 18px}}

.hero h1{max-width:18ch}
.intro{display:grid; grid-template-columns:1.5fr 1fr; gap:56px; align-items:end; margin-top:32px}
.intro p{color:var(--muted); font-size:17px; line-height:1.75; max-width:68ch}
.intro-cta{display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end}
.hero .hero-frame{margin-top:56px; aspect-ratio:16/8.6}
.sh{text-align:center; margin-bottom:56px}
.sh em.s{color:var(--accent)}
.cards4{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); transition:transform .3s, box-shadow .3s}
.card:hover{transform:translateY(-4px); box-shadow:0 26px 50px -26px rgba(13,27,42,.3)}
.card .frame{border-radius:0; aspect-ratio:16/11; background:#eef3f8}
.card .frame svg{position:absolute; inset:0}
.card-b{padding:22px 24px 26px}
.card-b h3{font-size:21px; margin-top:8px}
.num{font-family:var(--serif); font-style:italic; font-size:22px; color:var(--accent); line-height:1}
.num.lt{color:var(--sky)}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.grid3 .tile{aspect-ratio:4/4.6}
.grid3 .tile-txt b{font-size:24px}
.grid3 .bc{aspect-ratio:4/4.8}
.bc-txt h3{margin-top:10px}
.fwrap{display:flex; justify-content:space-between; gap:48px; flex-wrap:wrap; align-items:flex-start}
.fnav{display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:28px; font-size:14.5px}
.fr{text-align:right}
.lc{color:#fff; font-size:clamp(34px,4vw,48px)}
.lc em.s{color:var(--sky)}
.fmail{display:inline-flex; align-items:center; gap:10px; margin-top:18px; font-size:17px; color:#fff}
.fmail svg{color:var(--sky)}
.faddr{margin-top:10px; font-size:14.5px}
.faddr b{color:#fff; font-weight:500}
@media (max-width:1060px){.cards4{grid-template-columns:1fr 1fr}.intro{grid-template-columns:1fr; gap:28px}.intro-cta{justify-content:flex-start}.grid3{grid-template-columns:1fr 1fr}}
@media (max-width:680px){.cards4,.grid3{grid-template-columns:1fr}.hero .hero-frame{aspect-ratio:4/3.6}.fr{text-align:left}.grid3 .tile{aspect-ratio:4/3.6}.grid3 .bc{aspect-ratio:4/4}.nav-r .btn-primary{display:inline-flex; height:38px; padding:0 14px; font-size:13px}}

[hidden]{display:none!important}
.ph{padding:44px 0 72px; background:linear-gradient(180deg,var(--bg),var(--surface))}
.ph-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center}
.ph h1{font-size:clamp(42px,6vw,80px); margin-top:22px; letter-spacing:-.045em; line-height:1}
.crumbs{display:flex; flex-wrap:wrap; gap:8px; font-size:13.5px; color:var(--muted); margin-bottom:22px}
.crumbs a{color:var(--accent)}
.crumbs [aria-current]{color:var(--ink)}
.ph-frame{aspect-ratio:4/3; background:#0b1622; box-shadow:0 30px 60px -30px rgba(13,27,42,.45)}
.ph-frame svg{position:absolute; inset:0}
.subnav{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px}
.subnav a{font-size:14px; padding:8px 14px; border-radius:999px; border:1px solid var(--line); background:var(--card); color:var(--muted); transition:.2s}
.subnav a:hover{border-color:var(--brand); color:var(--brand)}
.subnav a[aria-current]{background:var(--brand); border-color:var(--brand); color:#fff}
.pc{padding:96px 0}
.prose p{color:var(--muted); font-size:17px; line-height:1.8; max-width:72ch}
.prose p + p{margin-top:18px}
.lead-grid{display:grid; grid-template-columns:1.6fr 1fr; gap:48px; align-items:start}
.lead{font-size:clamp(20px,2vw,25px); line-height:1.5; letter-spacing:-.015em}
.figs{display:grid; gap:14px}
.fig{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:22px 24px; box-shadow:var(--shadow)}
.fig b{display:block; font-size:44px; font-weight:500; letter-spacing:-.04em; line-height:1; color:var(--accent)}
.fig:nth-child(2) b{color:#C2463E}
.fig span{color:var(--muted); font-size:14px}
.chips2{list-style:none; padding:0; margin:36px 0 56px; display:flex; flex-wrap:wrap; gap:8px}
.chips2 li{padding:8px 14px; border-radius:999px; background:var(--brand-soft); color:var(--accent); font-size:14px; font-weight:500}
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:64px}
.pillar{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:30px; box-shadow:var(--shadow); position:relative; overflow:hidden}
.pillar::before{content:""; position:absolute; left:0; top:0; right:0; height:3px; background:linear-gradient(90deg,var(--coral),var(--sky))}
.pillar i,.vhead i,.kw i,.mcard i{width:48px; height:48px; border-radius:14px; display:grid; place-items:center; background:var(--brand-soft); flex:none}
.pillar i.co,.vhead i.co{background:#FEECEB}
.pillar h3{font-size:21px; margin:20px 0 10px}
.pillar p{color:var(--muted); font-size:15.5px; line-height:1.7}
.vlist{list-style:none; margin:0; padding:0}
.vrow{display:grid; grid-template-columns:.85fr 1.6fr; gap:48px; padding:44px 0; border-top:1px solid var(--line)}
.vrow:first-child{border-top:0; padding-top:0}
.vhead{display:flex; flex-direction:column; gap:16px; position:sticky; top:110px; align-self:start}
.vhead .num{font-size:40px}
.vhead h2{font-size:clamp(26px,2.6vw,34px)}
.stmt{max-width:1000px; margin:0 auto}
.big{font-size:clamp(26px,3.2vw,42px); line-height:1.25; letter-spacing:-.025em; padding-left:28px; border-left:4px solid; border-image:linear-gradient(180deg,var(--coral),var(--sky)) 1}
.stmt-b{display:grid; grid-template-columns:1.6fr 1fr; gap:48px; margin-top:48px; align-items:start}
.stmt-b > p{color:var(--muted); font-size:17px; line-height:1.8}
.kws{display:grid; gap:12px}
.kw{display:flex; align-items:center; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 16px}
.kw:nth-child(2) i{background:#FEECEB}
.kw b{font-weight:500; font-size:16.5px}
.di-grid{display:grid; grid-template-columns:.9fr 1.4fr; gap:56px}
.di-h{font-size:clamp(32px,3.6vw,46px)}
.pull{margin:32px 0 0; font-family:var(--serif); font-style:italic; font-size:30px; line-height:1.25; color:var(--accent); padding-left:22px; border-left:4px solid var(--coral)}
.eo{margin-top:64px; display:flex; gap:24px; align-items:flex-start; background:var(--dark); color:#fff; border-radius:var(--r-lg); padding:40px; position:relative; overflow:hidden}
.eo::before{content:""; position:absolute; width:420px; height:420px; right:-140px; top:-200px; background:radial-gradient(circle,rgba(27,118,175,.55),transparent 62%)}
.eo > *{position:relative}
.eo i{width:56px; height:56px; border-radius:16px; background:var(--coral); display:grid; place-items:center; flex:none}
.eo h2{font-size:26px}
.eo p{color:rgba(255,255,255,.78); margin-top:12px; font-size:16.5px; line-height:1.75; max-width:80ch}
.more{background:var(--surface); padding:88px 0}
.sh.small{font-size:clamp(28px,3vw,38px); margin-bottom:40px}
.mgrid{display:grid; grid-template-columns:repeat(5,1fr); gap:14px}
.mcard{display:flex; flex-direction:column; gap:16px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:22px; transition:.25s; position:relative}
.mcard b{font-weight:500; font-size:16.5px; padding-right:24px}
.mcard .go{position:absolute; right:18px; bottom:22px; color:var(--accent); transition:.25s}
.mcard:hover{border-color:var(--brand); transform:translateY(-3px); box-shadow:var(--shadow)}
.mcard:hover .go{transform:translate(2px,-2px)}
.dd a[aria-current]{background:var(--brand-soft); color:var(--accent); box-shadow:inset 3px 0 0 var(--coral)}
svg .beam{stroke-dasharray:6 6; animation:dash 1.4s linear infinite}
svg .orbit{transform-origin:400px 300px; animation:spin 80s linear infinite}
svg .orbit-slow{transform-origin:400px 300px; animation:spin 120s linear infinite}
svg .ring{transform-box:fill-box; transform-origin:center; animation:ringp 2.6s ease-out infinite}
@keyframes ringp{0%{transform:scale(.85); opacity:1}100%{transform:scale(1.35); opacity:0}}
svg .pulse-c{transform-box:fill-box; transform-origin:center; animation:ringp2 3s ease-in-out infinite}
@keyframes ringp2{50%{transform:scale(1.08)}}
svg .spinx{transform-origin:400px 300px; animation:spinx 10s linear infinite}
@keyframes spinx{from{transform:scaleX(1)}50%{transform:scaleX(.55)}to{transform:scaleX(1)}}
svg .arc{stroke-dasharray:300; stroke-dashoffset:300; animation:sign 5s ease-in-out infinite}
svg .ping{transform-box:fill-box; transform-origin:center; animation:ringp 2.2s ease-out infinite}
svg .tw{animation:led 2.4s steps(2) infinite}
svg .node{transform-box:fill-box; transform-origin:center; animation:ringp2 2s ease-in-out infinite}
svg .beat{transform-box:fill-box; transform-origin:center; animation:beat 1.6s ease-in-out infinite}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.12)}30%{transform:scale(1)}45%{transform:scale(1.08)}}
.btn{white-space:nowrap}
@media (max-width:420px){.nav .wrap{gap:12px}.nav-r{gap:8px}.nav-r .btn-primary .cv{display:none}.nav-r .btn-primary{padding:0 12px}}
@media (max-width:1060px){.ph-grid,.lead-grid,.stmt-b,.di-grid{grid-template-columns:1fr; gap:36px}.pillars{grid-template-columns:1fr 1fr}.mgrid{grid-template-columns:1fr 1fr 1fr}.vrow{grid-template-columns:1fr; gap:20px}.vhead{position:static; flex-direction:row; align-items:center}}
@media (max-width:680px){.pillars{grid-template-columns:1fr}.mgrid{grid-template-columns:1fr 1fr}.pc{padding:64px 0}.figs{grid-template-columns:1fr 1fr}.eo{flex-direction:column; padding:28px}.ph h1{font-size:44px}}

.ph-frame.wide{aspect-ratio:16/10.5; background:#eef3f8}
.ph-frame.tall{aspect-ratio:4/4.2}
.ind-b{display:grid; grid-template-columns:1.5fr 1fr; gap:56px; margin-top:48px; align-items:start; max-width:1000px; margin-left:auto; margin-right:auto}
.roles-panel{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; box-shadow:var(--shadow); position:sticky; top:100px}
.roles-panel h2{font-size:20px; display:flex; align-items:center; justify-content:space-between; gap:12px; letter-spacing:-.02em}
.cnt{font-size:13px; font-weight:600; color:#fff; background:var(--brand); border-radius:999px; padding:3px 10px; letter-spacing:0}
.roles-panel ul{list-style:none; padding:0; margin:18px 0 0; display:grid; gap:2px}
.roles-panel li{display:flex; gap:10px; align-items:center; padding:9px 0; border-top:1px solid var(--line); font-size:15px}
.roles-panel li:first-child{border-top:0}
.roles-panel li svg{flex:none}
.stmt .prose p{font-size:17px}
.mgrid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.more .mgrid{max-width:1000px; margin:0 auto}
a.card{display:block; color:inherit; position:relative}
.card .go{position:absolute; right:22px; bottom:26px; color:var(--accent); transition:transform .25s}
a.card:hover .go{transform:translate(2px,-2px)}
.card-b h3{padding-right:28px}
.tile-go{position:absolute; right:0; bottom:4px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3); color:#fff; transition:.25s}
a.tile:hover .tile-go,a.bc:hover .tile-go{background:#fff; color:var(--brand)}
.tile-txt b,.bc-txt h3{padding-right:46px}
a.bc{display:block}
a.bc svg.illo{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
a.bc:hover svg.illo{transform:scale(1.05)}
@media (max-width:1060px){.ind-b{grid-template-columns:1fr; gap:32px}.roles-panel{position:static}}

footer{padding:64px 0 28px}
.menu{margin:0 0 0 auto}
@media (min-width:1061px){.nav-r{display:none}}
.intro{grid-template-columns:1fr; gap:28px; align-items:start}
.intro-cta{justify-content:flex-start}
.hero{padding:56px 0 96px}
.menu > li:last-child .dd{left:auto; right:0}
.hero-split{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:64px; align-items:center}
.hero .hs-text h1{font-size:clamp(40px,4.4vw,64px); max-width:none; margin-top:22px; line-height:1.02}
.hs-p{color:var(--muted); font-size:16.5px; line-height:1.75; margin-top:24px; max-width:62ch}
.hs-text .intro-cta{margin-top:30px}
.hs-frame{aspect-ratio:760/860; box-shadow:0 40px 80px -40px rgba(13,27,42,.55)}
.hs-frame svg{position:absolute; inset:0}
svg .traveler2{animation:travel2 8s ease-in-out infinite}
@keyframes travel2{0%,18%{transform:translate(0,0)}48%,88%{transform:translate(36px,272px)}96%,100%{transform:translate(0,0)}}
@media (max-width:1060px){.hero-split{grid-template-columns:1fr; gap:44px}.hs-frame{max-width:560px; width:100%; justify-self:center}}
.fgrid2{display:grid; grid-template-columns:1.35fr repeat(4,1fr); gap:36px; align-items:start}
.conn{margin-top:28px}
footer .lc{font-size:30px}
footer .fmail{font-size:15.5px; margin-top:12px}
footer .faddr{font-size:14px; margin-top:8px}
footer h4{margin-top:4px}
footer ul{font-size:14px; gap:9px}
footer .fbot{margin-top:48px}
@media (max-width:1060px){.fgrid2{grid-template-columns:repeat(4,1fr); gap:32px 24px}.fgrid2 .fl{grid-column:1/-1; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px}.conn{margin-top:0}}
@media (max-width:680px){.fgrid2{grid-template-columns:1fr 1fr}.fgrid2 .fl{display:block}.conn{margin-top:24px}}

/* Static site additions */
.menu > li.is-open .dd{opacity:1; visibility:visible; transform:none}
.menu > li > button[aria-expanded="true"]{color:var(--ink); background:var(--surface)}
.menu > li.is-current > button{color:var(--accent); background:var(--brand-soft); font-weight:500}
.skip{position:absolute; left:-9999px; top:8px; z-index:99; background:var(--brand); color:#fff; padding:10px 16px; border-radius:8px}
.skip:focus{left:12px}
.notfound{padding:120px 0; text-align:center}
.notfound h1{font-size:clamp(44px,6vw,80px); margin-top:22px}
.notfound p{color:var(--muted); margin:18px auto 32px; max-width:46ch}
.fl .brand img,.nav .brand img{width:auto}

/* Mobile menu: icon button, sidebar drawer, collapsible sections */
.burger svg{display:block}
.burger .ic-close,.burger[aria-expanded="true"] .ic-open{display:none}
.burger[aria-expanded="true"] .ic-close{display:block}
@media (max-width:1060px){
  /* The blur moves to a pseudo-element: backdrop-filter on .nav itself would trap the fixed drawer inside the header. */
  .nav{background:none; backdrop-filter:none; -webkit-backdrop-filter:none}
  .nav::before{content:""; position:absolute; inset:0; z-index:-1; background:color-mix(in srgb,var(--bg) 85%,transparent); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px)}
  .burger{position:relative; z-index:3; width:44px; height:44px; padding:0; justify-content:center; background:var(--card)}
  .nav.menu-open::after{content:""; position:fixed; inset:0; z-index:1; background:rgba(11,22,34,.55); animation:scrim-in .2s}
  .menu.open{position:fixed; top:0; right:0; bottom:0; left:auto; z-index:2; width:min(86vw,340px); margin:0; padding:calc(env(safe-area-inset-top,0px) + 88px) 16px 28px; gap:4px; background:var(--bg); border:0; border-left:1px solid var(--line); box-shadow:-24px 0 48px -24px rgba(13,27,42,.35); overflow-y:auto; overscroll-behavior:contain; animation:drawer-in .26s cubic-bezier(.2,.7,.2,1)}
  .menu.open > li > button{width:100%; justify-content:space-between; padding:12px 14px; font-size:16px; border-radius:12px; color:var(--ink)}
  .menu.open > li > button svg{transition:transform .2s}
  .menu.open > li.is-open > button svg{transform:rotate(180deg)}
  .menu.open .dd{display:none; min-width:0; margin:8px 0 12px; padding:0 0 0 12px}
  .menu.open > li.is-open .dd{display:block}
  .menu.open > li.is-current > button{color:var(--accent)}
  html.menu-open{overflow:hidden}
}
@keyframes drawer-in{from{transform:translateX(100%)}}
@keyframes scrim-in{from{opacity:0}}
@media (prefers-reduced-motion:reduce){.menu.open,.nav.menu-open::after{animation:none}}