
:root{
  --ink:#060B14; --hero:#0A1322; --slate:#16222F; --band:#0A2450;
  --btn:#0B3DB8; --btn-h:#1D4ED8; --accent:#4B8DF8;
  --surface:#EEF1F5; --card-line:#E2E7F0;
  --tx:#101828; --tx2:#5C6270; --tx-inv:#FFFFFF; --tx-inv2:#B9C4DC; --tx-inv3:#93A0B8;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px; --s6:48px; --s8:64px; --s10:80px; --s12:96px;
  --r:12px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter Variable','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;color:var(--tx);
  background:#fff;line-height:1.55;-webkit-font-smoothing:antialiased;font-size:16px}
::selection{background:#1D4ED8;color:#fff}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.wrap{max-width:1340px;margin:0 auto;padding:0 clamp(24px,3vw,48px)}

@font-face{font-family:'Inter Variable';font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-var.woff2) format('woff2')}

/* ---------- header ---------- */
header{background:var(--hero);position:sticky;top:0;z-index:60;transition:background .25s,box-shadow .25s}
header.scrolled{background:rgba(6,11,20,.97);box-shadow:0 10px 30px rgba(2,8,20,.45)}
.nav{display:flex;align-items:center;gap:var(--s4);height:76px}
.logo{display:flex;align-items:center;gap:12px;color:#fff}
.logo img.lg{height:40px;width:auto;display:block}
.logo img.lg-f{height:32px}
nav.menu{display:flex;gap:var(--s3);margin-left:auto}
nav.menu a{color:#C7D0E2;font-size:14.5px;font-weight:500;padding:6px 2px;border-bottom:2px solid transparent}
nav.menu a:hover{color:#fff}
nav.menu a.on{color:#fff;border-bottom-color:var(--accent)}
.head-cta{display:flex;align-items:center;gap:var(--s3)}
.head-phone{color:#fff;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.head-phone svg{width:16px;height:16px;stroke:var(--accent)}
.portal{background:var(--btn);color:#fff;font-size:13.5px;font-weight:700;padding:10px 16px;border-radius:8px;
  display:flex;align-items:center;gap:8px;white-space:nowrap;transition:background .15s}
.portal:hover{background:var(--btn-h)}
.portal svg{width:14px;height:14px;stroke:#fff}
.burger{display:none;margin-left:auto;color:#fff}

/* ---------- sections shared ---------- */
section .eyebrow{font-size:11.5px;font-weight:700;letter-spacing:2.6px;text-transform:uppercase;color:var(--btn)}
section h2{font-size:clamp(30px,2.6vw,40px);font-weight:800;letter-spacing:-.024em;margin-top:10px;color:var(--tx)}
.sec-head{text-align:center;max-width:900px;margin:0 auto var(--s6)}
.sec-head p{margin-top:14px;color:var(--tx2);font-size:16px;line-height:1.65;max-width:680px;margin-left:auto;margin-right:auto}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#9AA6BE;padding:var(--s10) 0 0}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:var(--s6)}
.fbrand p{font-size:13.5px;line-height:1.65;margin-top:var(--s2);max-width:280px}
.fbrand .tag{margin-top:var(--s2);font-size:13px;color:#6B7A96;font-style:italic}
.soc{display:flex;gap:10px;margin-top:var(--s3)}
.soc a{width:34px;height:34px;border:1px solid #223047;border-radius:8px;display:flex;align-items:center;
  justify-content:center;transition:all .15s}
.soc a:hover{border-color:var(--accent);background:rgba(75,141,248,.08)}
.soc svg{width:15px;height:15px;stroke:#C7D0E2}
footer h4,footer .fh4{color:#fff;font-size:13px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:var(--s2)}
footer ul{list-style:none;display:flex;flex-direction:column;gap:10px}
footer ul a{font-size:13.5px;color:#9AA6BE}
footer ul a:hover{color:#fff}
.fcontact li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px}
.fcontact svg{width:15px;height:15px;stroke:var(--accent);flex:0 0 auto;margin-top:3px}
.fbar{border-top:1px solid #16202F;margin-top:var(--s8);padding:var(--s3) 0;font-size:12.5px;color:#6B7A96;
  display:flex;justify-content:space-between;gap:var(--s2);flex-wrap:wrap}

/* ---------- reveal motion ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.rv{opacity:1;transform:none;transition:none}}
