/* Northstar Axiomi — public marketing site. LUXE edition.
   Premium display serif (Playfair Display) + Inter, deep-ink + jewel-emerald with a
   restrained champagne-gold accent, metallic hairlines, glass and soft depth. */
:root{
  --ink:#0A101E; --ink2:#070B15; --rail-ink:#B8C2D4; --rail-mut:#6b7890;
  --acc:#13B589; --acc2:#0E9C74; --accink:#0A6E52; --accsoft:#E9F6F1;
  --gold:#C9A54E; --gold-2:#E7D3A1; --gold-soft:#F6EFDD;
  --tx:#111a24; --tx2:#3a4a58; --mut:#6a7789;
  --bg:#ffffff; --bg2:#F7F9FB; --cream:#FBFAF7; --line:#E9EEF3; --hair:#DBE3EC;
  --n50:#F5F7FA; --n100:#EDF1F5;
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --e1:0 1px 2px rgba(10,16,30,.05),0 1px 1px rgba(10,16,30,.03);
  --e2:0 3px 8px rgba(10,16,30,.06),0 22px 48px -22px rgba(10,16,30,.24);
  --e3:0 6px 14px rgba(10,16,30,.08),0 40px 80px -28px rgba(10,16,30,.40);
  --ease:cubic-bezier(.22,1,.36,1); --spring:cubic-bezier(.34,1.3,.5,1);
  --gold-line:linear-gradient(90deg,transparent,var(--gold) 30%,var(--gold-2) 55%,transparent);
  --emer-line:linear-gradient(90deg,transparent,rgba(19,181,137,.6),transparent);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--tx);background:var(--bg);line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:.01em}
a{color:var(--accink);text-decoration:none}
img{max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 26px}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:600;letter-spacing:-.015em;line-height:1.08}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accink)}
.eyebrow::before{content:"";width:26px;height:2px;border-radius:2px;background:var(--gold-line)}
.muted{color:var(--mut)}
.grain{position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/></svg>")}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:600;
  font-size:14px;border-radius:12px;padding:12px 20px;cursor:pointer;border:1px solid transparent;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.btn-primary{background:linear-gradient(180deg,#15c093,var(--acc2));color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 22px -8px rgba(14,156,116,.7)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 14px 30px -8px rgba(14,156,116,.8)}
.btn-ghost{background:#fff;border-color:var(--hair);color:var(--tx);box-shadow:var(--e1)}
.btn-ghost:hover{border-color:var(--acc);color:var(--accink);transform:translateY(-1px)}
.btn-lg{padding:15px 26px;font-size:15px;border-radius:14px}
.btn-white{background:#fff;color:var(--ink);box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.btn-white:hover{transform:translateY(-2px)}
.btn-gold{background:transparent;border:1px solid var(--gold);color:var(--gold-2)}
.btn-outline-light{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.28);color:#fff}
.btn-outline-light:hover{border-color:var(--gold);color:var(--gold-2)}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.72);
  backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);
  border-bottom:1px solid transparent;border-image:var(--gold-line) 1}
.nav-in{display:flex;align-items:center;gap:26px;height:70px;position:relative}
.nav-menu{display:contents}
.nav-burger{display:none}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--serif);font-weight:600;font-size:19px;
  color:var(--ink);letter-spacing:-.01em}
.brand .mark{height:30px;width:auto;display:block}
.brand span{color:var(--acc)}
.nav-links{display:flex;gap:26px;margin-left:10px}
.nav-links a{position:relative;color:var(--tx2);font-weight:500;font-size:14.5px;padding:4px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:var(--gold-line);transition:right .25s var(--ease)}
.nav-links a:hover{color:var(--ink)}.nav-links a:hover::after{right:0}
.nav-cta{margin-left:auto;display:flex;align-items:center;gap:12px}
/* mobile nav — CSS-only hamburger menu (no JS) */
@media(max-width:860px){
  .nav-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:38px;margin-left:auto;
    border:1px solid var(--hair);border-radius:11px;background:#fff;cursor:pointer;padding:0 11px;box-shadow:var(--e1)}
  .nav-burger span{display:block;height:2px;border-radius:2px;background:var(--ink);transition:transform .25s var(--ease),opacity .18s}
  .nav-menu{display:block;position:absolute;left:0;right:0;top:calc(100% + 1px);background:rgba(255,255,255,.98);
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);max-height:0;overflow:hidden;
    border-bottom:0 solid var(--line);transition:max-height .32s var(--ease);box-shadow:0 24px 44px -22px rgba(10,16,30,.4)}
  .nav-toggle:checked ~ .nav-menu{max-height:380px;border-bottom-width:1px}
  .nav-links{display:flex;flex-direction:column;gap:0;margin:0;padding:6px 26px 0}
  .nav-links a{padding:14px 2px;font-size:16px;color:var(--tx);border-bottom:1px solid var(--n50)}
  .nav-links a::after{display:none}
  .nav-cta{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin:0;padding:16px 26px 20px}
  .nav-cta .btn{display:flex;justify-content:center;width:100%}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* hero */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(1200px 560px at 78% -12%, rgba(19,181,137,.14), transparent 58%),
  radial-gradient(900px 500px at 8% 8%, rgba(201,165,78,.10), transparent 55%),
  linear-gradient(180deg,var(--cream),var(--bg2))}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold-line)}
.hero-in{display:grid;grid-template-columns:1.02fr 1.06fr;gap:48px;align-items:center;padding:40px 0 64px;position:relative}
@media(max-width:920px){.hero-in{grid-template-columns:1fr;padding:28px 0 44px}}
.hero h1{font-size:60px;font-weight:600;margin:16px 0 18px;letter-spacing:-.02em}
.hero h1 em{font-style:italic;color:var(--accink)}
@media(max-width:920px){.hero h1{font-size:40px}}
.hero p.lead{font-size:19px;color:var(--tx2);max-width:580px;line-height:1.65}
.strapline{margin:14px 0 0;max-width:600px;font-size:18px;font-weight:600;line-height:1.45;color:var(--accink);letter-spacing:-.01em}
.signature{margin:18px 0 0;max-width:600px;font-size:14.5px;line-height:1.6;font-style:italic;color:var(--accink);padding-left:16px;border-left:2px solid var(--gold-line)}
.hero-cta{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.hero-note{margin-top:16px;font-size:13px;color:var(--mut)}
.hero-note b{color:var(--accink)}
.stars{color:var(--gold);letter-spacing:2px;font-size:13px}

/* product mock — realistic app screenshot (Flight Deck) */
.device{position:relative;border-radius:18px;padding:10px;
  background:linear-gradient(180deg,#141d31,#0A101E);box-shadow:var(--e3)}
.device::before{content:"";position:absolute;inset:0;border-radius:18px;padding:1px;
  background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,0) 40%,rgba(201,165,78,.25));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.device-glow{position:absolute;inset:-22% -12% auto auto;width:58%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(19,181,137,.26),transparent 66%);filter:blur(6px)}
.dev-bar{display:flex;align-items:center;gap:7px;padding:5px 9px 10px;position:relative}
.dev-bar i{width:9px;height:9px;border-radius:50%;background:#2b3450;display:inline-block}
.dev-bar i:nth-child(1){background:#e5675e}.dev-bar i:nth-child(2){background:#e6b34d}.dev-bar i:nth-child(3){background:#4caf7d}
.dev-bar .url{margin-left:10px;flex:1;height:15px;border-radius:5px;background:#1c2740;display:flex;align-items:center;justify-content:center;
  font-family:var(--sans);font-size:8.5px;color:#7f8aa3;letter-spacing:.02em}
.dev-screen{position:relative;background:#F7F9FB;border-radius:11px;overflow:hidden;display:grid;grid-template-columns:118px 1fr;min-height:452px}
/* sidebar */
.dev-rail{background:linear-gradient(180deg,#0A101E,#070B15);padding:12px 10px;display:flex;flex-direction:column;gap:3px}
.dev-rail .brandmini{display:flex;align-items:center;gap:7px;padding:2px 6px 12px}
.dev-rail .brandmini img{width:16px;height:auto}
.dev-rail .brandmini b{font-family:var(--serif);font-size:11.5px;color:#fff;font-weight:600;letter-spacing:-.01em}
.dev-rail a{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;color:var(--rail-mut);
  font-family:var(--sans);font-size:10.5px;font-weight:500;letter-spacing:.005em}
.dev-rail a svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.dev-rail a.on{background:linear-gradient(180deg,rgba(19,181,137,.20),rgba(19,181,137,.06));color:#eafff7;
  box-shadow:inset 0 0 0 1px rgba(19,181,137,.34)}
.dev-rail a.on svg{stroke:var(--acc)}
.dev-rail .railsep{height:1px;background:rgba(255,255,255,.06);margin:8px 6px}
.dev-rail .railuser{margin-top:auto;display:flex;align-items:center;gap:8px;padding:8px 6px 2px}
.dev-rail .railuser .av{width:22px;height:22px;border-radius:50%;background:linear-gradient(150deg,#2f9e78,#0E9C74);
  display:grid;place-items:center;color:#fff;font-size:8.5px;font-weight:700;font-family:var(--sans)}
.dev-rail .railuser small{color:var(--rail-ink);font-size:9px;font-family:var(--sans);line-height:1.25}
.dev-rail .railuser small b{display:block;color:#fff;font-weight:600;font-size:9.5px}
/* main */
.dev-main{padding:14px 15px 15px;display:flex;flex-direction:column}
.dev-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px}
.dev-top .crumbs{font-family:var(--sans);font-size:8.5px;color:var(--mut);letter-spacing:.03em;text-transform:uppercase;font-weight:600}
.dev-top .actions{display:flex;align-items:center;gap:7px}
.dev-top .search{width:118px;height:20px;border-radius:6px;background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;gap:5px;padding:0 8px;font-family:var(--sans);font-size:8.5px;color:var(--mut)}
.dev-top .search svg{width:10px;height:10px;stroke:var(--mut);stroke-width:1.8;fill:none}
.dev-top .bell{width:20px;height:20px;border-radius:6px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;position:relative}
.dev-top .bell::after{content:"";position:absolute;top:3px;right:3px;width:5px;height:5px;border-radius:50%;background:#e5675e;box-shadow:0 0 0 1.5px #fff}
.dev-top .bell svg{width:11px;height:11px;stroke:var(--tx2);stroke-width:1.7;fill:none}
.dev-h1{display:flex;align-items:center;justify-content:space-between;margin:9px 0 11px}
.dev-h1 b{font-family:var(--serif);font-size:17px;color:var(--ink);font-weight:600}
.dev-h1 .pillmini{font-size:9px;font-weight:700;color:#0b7f5f;background:var(--accsoft);padding:4px 9px;border-radius:20px;
  display:inline-flex;align-items:center;gap:5px}
.dev-h1 .pillmini::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px rgba(19,181,137,.18)}
.dev-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.dev-kpi{border:1px solid var(--line);border-radius:9px;padding:8px 9px;background:#fff;position:relative;overflow:hidden}
.dev-kpi span{font-size:8px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;font-weight:600;display:block}
.dev-kpi b{display:block;font-family:var(--serif);font-size:16px;color:var(--ink);margin:2px 0 4px;line-height:1}
.dev-kpi .delta{font-size:8px;font-weight:700;font-family:var(--sans);display:inline-flex;align-items:center;gap:2px}
.dev-kpi .delta.g{color:#0E9C74}.dev-kpi .delta.r{color:#d9534f}
.dev-kpi .spark{position:absolute;right:7px;bottom:7px;width:38px;height:16px}
.dev-kpi .spark svg{width:100%;height:100%;display:block;overflow:visible}
.dev-lower{display:grid;grid-template-columns:1.55fr 1fr;gap:10px;flex:1}
.dev-card{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px 11px;display:flex;flex-direction:column}
.dev-card .ch{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.dev-card .ch b{font-family:var(--sans);font-size:10px;font-weight:700;color:var(--tx);letter-spacing:.01em}
.dev-card .ch em{font-style:normal;font-size:8px;color:var(--mut);font-weight:600}
.dev-chart{flex:1;position:relative;min-height:118px}
.dev-chart svg{width:100%;height:100%;display:block}
.dev-chart .yl{position:absolute;left:0;top:0;bottom:14px;width:100%;pointer-events:none}
.dev-xaxis{display:flex;justify-content:space-between;margin-top:5px;font-family:var(--sans);font-size:7px;color:var(--mut);letter-spacing:.02em}
.dev-att .arow{display:flex;align-items:flex-start;gap:7px;padding:6px 0;border-top:1px solid var(--n50)}
.dev-att .arow:first-of-type{border-top:none;padding-top:1px}
.dev-att .dot{width:7px;height:7px;border-radius:50%;margin-top:3px;flex:none}
.dev-att .dot.hi{background:#d9534f}.dev-att .dot.md{background:#e6a23c}.dev-att .dot.lo{background:#0E9C74}
.dev-att .atx{font-family:var(--sans);font-size:9px;color:var(--tx);line-height:1.3;font-weight:500}
.dev-att .atx small{display:block;color:var(--mut);font-size:8px;font-weight:500;margin-top:1px}
@media(max-width:920px){.dev-screen{grid-template-columns:96px 1fr;min-height:0}.dev-rail a span{display:none}.dev-rail a{justify-content:center}.dev-kpis{grid-template-columns:repeat(2,1fr)}.dev-lower{grid-template-columns:1fr}}

/* trust */
.trust{padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--cream)}
.trust p{text-align:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0 0 14px}
.trust-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px;color:var(--tx2);font-family:var(--serif);font-weight:600;opacity:.85}
.trust-row span{font-size:16px}

/* sections */
.section{padding:92px 0}
.section.alt{background:linear-gradient(180deg,var(--bg2),var(--cream))}
.section-head{max-width:720px;margin:0 auto 46px;text-align:center}
.section-head .eyebrow{margin-bottom:14px}
.section-head h2{font-size:40px;font-weight:600;margin:0 0 12px;letter-spacing:-.02em}
.section-head p{color:var(--tx2);font-size:17px;line-height:1.6}

/* app grid */
.appgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:920px){.appgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.appgrid{grid-template-columns:1fr}}
.appcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s;overflow:hidden;cursor:pointer}
.appcard::after{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--gold-line);opacity:0;transition:opacity .22s}
.appcard:hover{transform:translateY(-4px);box-shadow:var(--e2);border-color:#d6e0ea}
.appcard:hover::after,.appcard.active::after{opacity:.9}
.appcard:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.appcard.active{border-color:var(--acc);box-shadow:0 0 0 2px rgba(19,181,137,.28),var(--e2);transform:translateY(-2px)}
.appcard.active .ic{box-shadow:inset 0 0 0 1px rgba(19,181,137,.35),0 8px 18px -10px rgba(19,181,137,.5)}
.appcard .ic{width:52px;height:52px;border-radius:13px;display:grid;place-items:center;margin-bottom:13px;
  background:linear-gradient(160deg,var(--accsoft),#fff);box-shadow:inset 0 0 0 1px rgba(19,181,137,.14);transition:box-shadow .22s}
.appcard .ic svg.art{width:34px;height:34px;display:block}
.appcard h3{font-size:15.5px;margin-bottom:5px;font-weight:600;display:flex;align-items:center;gap:6px}
.appcard p{font-size:12.5px;color:var(--mut);margin:0;line-height:1.5}
.appcard .more{margin-top:11px;display:inline-flex;align-items:center;gap:5px;font-family:var(--sans);
  font-size:11px;font-weight:700;color:var(--accink);letter-spacing:.02em;opacity:.66;transition:opacity .2s,gap .2s}
.appcard .more svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform .22s var(--ease)}
.appcard:hover .more,.appcard.active .more{opacity:1}
.appcard:hover .more{gap:8px}
.appcard.active .more svg{transform:rotate(90deg)}

/* module reveal panel */
.modpanel{margin-top:16px;border:1px solid var(--acc);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,#fff,#fbfefc);box-shadow:0 0 0 3px rgba(19,181,137,.10),var(--e2);
  display:grid;grid-template-columns:1.15fr 1fr;position:relative}
.modpanel[hidden]{display:none}
.modpanel::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--gold-line)}
.modpanel.swap{animation:modswap .34s var(--ease)}
@keyframes modswap{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.modpanel-open{animation:modopen .4s var(--ease)}
@keyframes modopen{from{opacity:0;transform:translateY(-6px) scale(.99)}to{opacity:1;transform:none}}
.mp-body{padding:26px 28px 28px}
.mp-head{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.mp-head .ic{width:56px;height:56px;border-radius:15px;display:grid;place-items:center;flex:none;
  background:linear-gradient(160deg,var(--accsoft),#fff);box-shadow:inset 0 0 0 1px rgba(19,181,137,.2)}
.mp-head .ic svg.art{width:38px;height:38px}
.mp-head .eyebrow{margin-bottom:6px}
.mp-head h3{font-family:var(--serif);font-size:24px;font-weight:600;letter-spacing:-.01em}
.mp-lead{color:var(--tx2);font-size:14.5px;line-height:1.6;margin:12px 0 16px;max-width:520px}
.mp-feats{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;margin:0 0 18px;padding:0;list-style:none}
.mp-feats li{position:relative;padding:3px 0 3px 24px;color:var(--tx);font-size:13px;line-height:1.45}
.mp-feats li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:7px;border-left:2px solid var(--acc);border-bottom:2px solid var(--acc);transform:rotate(-45deg)}
.mp-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}
.mp-tag{font-family:var(--sans);font-size:10.5px;font-weight:700;color:var(--accink);background:var(--accsoft);
  padding:5px 10px;border-radius:20px;letter-spacing:.02em}
.mp-cta{display:inline-flex;align-items:center;gap:7px}
.mp-close{position:absolute;top:14px;right:16px;width:30px;height:30px;border-radius:9px;border:1px solid var(--line);
  background:#fff;display:grid;place-items:center;cursor:pointer;z-index:2;transition:border-color .18s,transform .18s}
.mp-close:hover{border-color:var(--acc);transform:rotate(90deg)}
.mp-close svg{width:14px;height:14px;stroke:var(--tx2);stroke-width:2;fill:none;stroke-linecap:round}
/* right: mini realistic preview */
.mp-media{position:relative;background:linear-gradient(160deg,#131d31,#0A101E);overflow:hidden;display:flex;flex-direction:column;padding:18px}
.mp-media::before{content:"";position:absolute;top:-30%;right:-15%;width:60%;height:80%;border-radius:50%;background:radial-gradient(circle,rgba(19,181,137,.26),transparent 66%)}
.mp-media .mm-bar{display:flex;align-items:center;gap:6px;margin-bottom:12px;position:relative}
.mp-media .mm-bar i{width:7px;height:7px;border-radius:50%;background:#2b3450}
.mp-media .mm-bar span{margin-left:6px;font-family:var(--sans);font-size:9px;color:#7f8aa3;font-weight:600;letter-spacing:.03em}
.mp-ui{position:relative;background:#fff;border-radius:11px;flex:1;padding:13px 14px;box-shadow:0 20px 44px -20px rgba(0,0,0,.6);min-height:190px}
.mp-ui .u-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}
.mp-ui .u-top b{font-family:var(--serif);font-size:13px;color:var(--ink)}
.mp-ui .u-top .pill{font-size:8px;font-weight:700;padding:3px 8px;border-radius:20px;background:var(--accsoft);color:#0b7f5f}
.mp-ui .u-row{display:flex;align-items:center;gap:9px;padding:7px 0;border-top:1px solid var(--n50)}
.mp-ui .u-row:first-of-type{border-top:none}
.mp-ui .u-ic{width:26px;height:26px;border-radius:8px;background:var(--accsoft);display:grid;place-items:center;flex:none}
.mp-ui .u-ic svg{width:14px;height:14px;stroke:var(--accink);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mp-ui .u-tx{flex:1;min-width:0}
.mp-ui .u-tx b{display:block;font-family:var(--sans);font-size:10.5px;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-ui .u-tx span{font-family:var(--sans);font-size:9px;color:var(--mut)}
.mp-ui .u-badge{font-family:var(--sans);font-size:8px;font-weight:700;padding:3px 7px;border-radius:6px;flex:none}
.mp-ui .u-badge.g{background:#e8f7f0;color:#0E9C74}.mp-ui .u-badge.a{background:#fdf2e3;color:#c47d16}.mp-ui .u-badge.r{background:#fdecea;color:#d9534f}
@media(max-width:820px){.modpanel{grid-template-columns:1fr}.mp-media{display:none}.mp-feats{grid-template-columns:1fr}}

/* value */
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.vals{grid-template-columns:1fr}}
.val{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--e1);overflow:hidden}
.val::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--emer-line)}
.val .ic{width:46px;height:46px;border-radius:13px;background:linear-gradient(160deg,#131b2e,#0A101E);display:grid;place-items:center;margin-bottom:14px;box-shadow:inset 0 0 0 1px rgba(201,165,78,.2)}
.val .ic svg{width:22px;height:22px;stroke:var(--acc);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.val .ic svg.art{width:25px;height:25px;stroke:none;stroke-linecap:round;stroke-linejoin:round}
.val h3{font-size:19px;margin-bottom:7px;font-weight:600}
.val p{color:var(--tx2);font-size:14.5px;margin:0}

/* feature rows */
.frow{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;padding:40px 0}
.frow:nth-child(even) .fmedia{order:2}
@media(max-width:880px){.frow{grid-template-columns:1fr;gap:24px}.frow:nth-child(even) .fmedia{order:0}}
.frow h3{font-size:27px;font-weight:600;margin:8px 0 12px}
.frow ul{margin:14px 0 0;padding:0;list-style:none}
.frow li{position:relative;padding:6px 0 6px 28px;color:var(--tx2);font-size:14.5px}
.frow li::before{content:"";position:absolute;left:2px;top:12px;width:13px;height:8px;border-left:2px solid var(--acc);border-bottom:2px solid var(--acc);transform:rotate(-45deg)}
.fmedia{position:relative;background:linear-gradient(160deg,#131b2e,#0A101E);border-radius:18px;min-height:250px;box-shadow:var(--e2);overflow:hidden;display:grid;place-items:center}
.fmedia::before{content:"";position:absolute;inset:0;border-radius:18px;padding:1px;background:linear-gradient(160deg,rgba(255,255,255,.16),transparent 45%,rgba(201,165,78,.22));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.fmedia .glow{position:absolute;top:-40%;right:-20%;width:70%;height:120%;border-radius:50%;background:radial-gradient(circle,rgba(19,181,137,.24),transparent 66%)}
.fmedia .tag{position:relative;color:var(--rail-ink);font-family:var(--serif);font-style:italic;font-size:15px;padding:16px 20px;text-align:center}
.fmedia .tag img{width:34px;margin:0 auto 12px;display:block;opacity:.95}
.fmedia .tag b{display:block;color:#fff;font-style:normal;font-weight:600;font-size:22px;margin-top:6px;letter-spacing:-.01em}

/* pricing */
.toggles{display:flex;gap:18px;justify-content:center;align-items:center;margin:20px 0 34px;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--n100);border-radius:12px;padding:4px;box-shadow:inset 0 0 0 1px rgba(10,16,30,.04)}
.seg button{border:none;background:transparent;padding:8px 16px;border-radius:9px;font-weight:600;font-size:13px;color:var(--tx2);cursor:pointer;font-family:var(--sans)}
.seg button.on{background:#fff;color:var(--accink);box-shadow:var(--e1)}
.save{font-size:12px;color:var(--accink);font-weight:700;background:var(--accsoft);padding:5px 11px;border-radius:20px}
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}
@media(max-width:1000px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.plans{grid-template-columns:1fr}}
.plan{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 22px;display:flex;flex-direction:column;box-shadow:var(--e1)}
.plan.pop{border-color:transparent;box-shadow:var(--e2)}
.plan.pop::before{content:"";position:absolute;inset:0;border-radius:18px;padding:1.4px;background:linear-gradient(180deg,var(--acc),var(--gold));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.plan .flag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(180deg,var(--acc),var(--acc2));color:#fff;font-size:11px;font-weight:700;padding:4px 14px;border-radius:20px;box-shadow:0 6px 16px -6px rgba(14,156,116,.7)}
.plan h3{font-size:17px;font-weight:600}
.plan .desc{font-size:12.5px;color:var(--mut);min-height:36px;margin:5px 0 14px}
.plan .price{font-family:var(--serif);font-size:38px;font-weight:600;color:var(--ink);letter-spacing:-.02em;line-height:1}
.plan .price small{font-size:14px;color:var(--mut);font-weight:500;font-family:var(--sans)}
.plan .per{font-size:12px;color:var(--mut);margin:6px 0 16px}
.plan .btn{width:100%;justify-content:center;margin-bottom:16px}
.plan ul{list-style:none;margin:0;padding:0}
.plan li{position:relative;padding:6px 0 6px 24px;font-size:13px;color:var(--tx2)}
.plan li::before{content:"";position:absolute;left:2px;top:12px;width:12px;height:7px;border-left:2px solid var(--acc);border-bottom:2px solid var(--acc);transform:rotate(-45deg)}
.pnote{text-align:center;color:var(--mut);font-size:12.5px;margin-top:22px}

/* comparison */
.cmp{width:100%;border-collapse:separate;border-spacing:0;margin-top:16px;font-size:13.5px;box-shadow:var(--e1);border-radius:14px;overflow:hidden}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:13px 14px;text-align:left;background:#fff}
.cmp thead th{background:linear-gradient(180deg,#131b2e,#0A101E);color:#fff;font-weight:600;font-family:var(--sans)}
.cmp td:not(:first-child),.cmp th:not(:first-child){text-align:center}
.cmp tbody tr:nth-child(even) td{background:var(--n50)}
.cmp .yes{color:var(--accink);font-weight:800}
.cmp .no{color:#c7d0da}

/* faq */
.faq{max-width:780px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line);padding:16px 2px}
.faq summary{cursor:pointer;font-weight:600;font-size:16px;list-style:none;font-family:var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--gold);font-weight:700;font-family:var(--sans)}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--tx2);font-size:14.5px;margin:12px 0 0}

/* CTA */
.cta{position:relative;background:linear-gradient(180deg,var(--ink),var(--ink2));color:#fff;overflow:hidden}
.cta::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--gold-line)}
.cta .glow{position:absolute;left:-10%;top:-70%;width:60%;height:220%;border-radius:50%;background:radial-gradient(circle,rgba(19,181,137,.22),transparent 66%)}
.cta .glow2{position:absolute;right:-10%;bottom:-70%;width:55%;height:200%;border-radius:50%;background:radial-gradient(circle,rgba(201,165,78,.12),transparent 66%)}
.cta-in{position:relative;text-align:center;padding:74px 0}
.cta img.mark{height:40px;margin-bottom:18px;opacity:.95}
.cta h2{font-size:38px;font-weight:600;color:#fff}
.cta p{color:var(--rail-ink);margin:12px 0 26px;font-size:17px}

/* footer */
.foot{background:var(--ink2);color:var(--rail-ink);padding:56px 0 30px;position:relative}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--gold-line);opacity:.6}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:26px}
@media(max-width:800px){.foot-grid{grid-template-columns:1fr 1fr}}
.foot .brand{color:#fff}.foot .brand span{color:var(--acc)}
.foot p{font-size:13px;color:#7a8598;margin:14px 0 0;max-width:300px;line-height:1.6}
.foot h4{color:#fff;font-size:11px;text-transform:uppercase;letter-spacing:.12em;margin:0 0 14px;font-family:var(--sans)}
.foot a{display:block;color:var(--rail-ink);font-size:13.5px;padding:5px 0}
.foot a:hover{color:var(--gold-2)}
.foot-bottom{border-top:1px solid #1a2233;margin-top:34px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:#697588}
.curr-select{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--tx);border:1px solid var(--hair);
  background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;box-shadow:var(--e1)}
.curr-auto{font-size:11.5px;color:var(--accink);background:var(--accsoft);padding:5px 11px;border-radius:20px;font-weight:600}
.pill{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,rgba(19,181,137,.14),rgba(19,181,137,.06));
  color:var(--accink);font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:5px 13px;border-radius:20px;
  box-shadow:inset 0 0 0 1px rgba(19,181,137,.2)}

/* standards & compliance badges */
.stds{display:flex;flex-wrap:wrap;gap:11px;justify-content:center;max-width:940px;margin:0 auto}
.std{font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--tx2);background:#fff;
  border:1px solid var(--line);border-radius:22px;padding:9px 16px;box-shadow:var(--e1);
  transition:transform .16s var(--ease),border-color .16s,color .16s,box-shadow .16s}
.std:hover{transform:translateY(-2px);border-color:var(--acc);color:var(--accink);box-shadow:var(--e2)}
.std b{color:var(--accink);font-weight:800}
.std .dot{color:var(--gold);margin-right:7px}
.std-note{text-align:center;color:var(--mut);font-size:12.5px;margin-top:22px}

/* reveal on scroll — visible by DEFAULT (fail-safe: if the script is ever
   blocked or fails, content still shows). The script only hides+animates
   below-the-fold elements by adding .rz to them. */
.reveal{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.rz{opacity:0;transform:translateY(16px)}
.reveal.rz.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal,.reveal.rz{opacity:1!important;transform:none!important;transition:none}}

/* ===== premium polish + shared components (site-wide) ===== */
/* active nav-item per page */
.nav-links a.on{color:var(--ink)}
.nav-links a.on::after{right:0}
/* button sheen */
.btn-primary,.btn-white{position:relative;overflow:hidden}
.btn-primary::after,.btn-white::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-18deg);pointer-events:none}
.btn-primary:hover::after,.btn-white:hover::after{animation:sheen .85s var(--ease)}
@keyframes sheen{to{left:135%}}
/* card hover lifts */
.val{transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s}
.val:hover{transform:translateY(-4px);box-shadow:var(--e2);border-color:#d6e0ea}
.plan{transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s}
.plan:hover{transform:translateY(-4px);box-shadow:var(--e2)}
.frow .fmedia{transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.frow:hover .fmedia{transform:translateY(-3px);box-shadow:var(--e3)}
.faq details{transition:background .2s}
.faq details[open]{background:linear-gradient(180deg,var(--accsoft),transparent);border-radius:12px}
.cmp tbody tr{transition:background .15s}
.cmp tbody tr:hover td{background:var(--accsoft)!important}

/* reusable realistic mini-UI (features feature-rows) */
.fmedia.live{min-height:288px;display:grid;place-items:stretch;padding:24px}
.fmedia .fui{position:relative;align-self:center;width:100%;background:#fff;border-radius:13px;padding:15px 16px;
  box-shadow:0 26px 54px -26px rgba(0,0,0,.62)}
.fui .fu-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}
.fui .fu-top b{font-family:var(--serif);font-size:15.5px;color:var(--ink)}
.fui .fu-top .fu-pill{font-family:var(--sans);font-size:9px;font-weight:700;padding:4px 10px;border-radius:20px;background:var(--accsoft);color:#0b7f5f;display:inline-flex;align-items:center;gap:5px}
.fui .fu-top .fu-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px rgba(19,181,137,.18)}
.fui .fu-row{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid var(--n50)}
.fui .fu-row:first-of-type{border-top:none}
.fui .fu-ic{width:30px;height:30px;border-radius:9px;background:var(--accsoft);display:grid;place-items:center;flex:none}
.fui .fu-ic svg{width:16px;height:16px;stroke:var(--accink);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fui .fu-tx{flex:1;min-width:0}
.fui .fu-tx b{display:block;font-family:var(--sans);font-size:12px;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fui .fu-tx span{font-family:var(--sans);font-size:11px;color:var(--mut)}
.fui .fu-badge{font-family:var(--sans);font-size:9.5px;font-weight:700;padding:4px 9px;border-radius:7px;flex:none}
.fui .fu-badge.g{background:#e8f7f0;color:#0E9C74}.fui .fu-badge.a{background:#fdf2e3;color:#c47d16}.fui .fu-badge.r{background:#fdecea;color:#d9534f}
.fmedia .fcap{position:relative;text-align:center;color:var(--rail-ink);font-family:var(--serif);font-style:italic;font-size:13px;margin-top:15px}
.fmedia .fcap b{color:#fff;font-style:normal;font-weight:600}

/* shared lead / talk-to-sales modal (home, features, pricing) */
.lead-ov{position:fixed;inset:0;background:rgba(10,16,30,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:90;padding:20px}
.lead-ov.on{display:flex;animation:leadfade .25s var(--ease)}
@keyframes leadfade{from{opacity:0}to{opacity:1}}
.lead-modal{position:relative;background:#fff;border-radius:18px;max-width:470px;width:100%;padding:28px 28px 24px;box-shadow:0 30px 80px -20px rgba(10,16,30,.5);max-height:92vh;overflow:auto;animation:leadpop .3s var(--spring)}
@keyframes leadpop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.lead-modal::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:18px 18px 0 0;background:var(--gold-line)}
.lead-modal h3{font-family:var(--serif);font-size:24px;font-weight:600;margin:0 0 4px;letter-spacing:-.01em}
.lead-modal p.sub{color:var(--mut);font-size:13.5px;margin:0 0 16px;line-height:1.55}
.lead-modal label{display:block;font-size:12px;font-weight:600;color:var(--tx);margin:11px 0 5px}
.lead-modal input,.lead-modal textarea,.lead-modal select{width:100%;box-sizing:border-box;border:1px solid var(--hair);border-radius:11px;padding:11px 13px;font:inherit;font-size:14px;background:#fff;transition:border-color .15s,box-shadow .15s}
.lead-modal input:focus,.lead-modal textarea:focus,.lead-modal select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--accsoft)}
.lead-modal textarea{min-height:76px;resize:vertical}
.lead-row{display:flex;gap:12px}.lead-row>div{flex:1}
.lead-actions{display:flex;gap:12px;align-items:center;margin-top:18px}
.lead-close{position:absolute;top:14px;right:16px;width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:#fff;color:var(--tx2);font-size:18px;line-height:1;cursor:pointer;z-index:2;transition:border-color .18s,transform .18s}
.lead-close:hover{border-color:var(--acc);transform:rotate(90deg)}
.lead-msg{font-size:13px;margin-top:2px}
.lead-ok{text-align:center;padding:12px 0}
.lead-ok .tick{width:54px;height:54px;border-radius:50%;background:var(--accsoft);color:var(--accink);font-size:26px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px}
