:root{
    --bg:#FFFFFF; --bg-alt:#F5F8FE; --surface:#FFFFFF;
    --navy:#0B1B45; --navy-2:#141F5C;
    --ink:#0F1B36; --ink-2:#4A5878; --muted:#8090AD;
    --line:#E6EBF5; --line-2:#D6DEEE;
    /* accent hues */
    --blue:#2E6BFF; --blue-d:#1E4FD1;
    --violet:#7A4DFF; --cyan:#0FA9CC; --emerald:#0FA672; --amber:#EA9A1F; --rose:#E5468A;
    /* gradients */
    --grad-brand:linear-gradient(120deg,#2E6BFF 0%,#7A4DFF 100%);
    --grad-brand-soft:linear-gradient(120deg,#2E6BFF 0%,#6A8BFF 55%,#7A4DFF 100%);
    --g-blue:linear-gradient(135deg,#4C86FF,#2E6BFF);
    --g-violet:linear-gradient(135deg,#9B6BFF,#6A38F0);
    --g-cyan:linear-gradient(135deg,#2AD0EA,#0B93B8);
    --g-emerald:linear-gradient(135deg,#2BD69C,#079466);
    --g-amber:linear-gradient(135deg,#FCC24B,#E08414);
    --g-rose:linear-gradient(135deg,#F779B0,#DB3179);
    --tint-blue:#EAF1FF; --tint-violet:#F0EBFF; --tint-cyan:#E4F7FB; --tint-emerald:#E2F6EE; --tint-amber:#FDF2DD; --tint-rose:#FCEAF3;
    --gold:#C9922E;
    --shadow-sm:0 1px 2px rgba(15,27,54,.06), 0 4px 12px rgba(15,27,54,.05);
    --shadow:0 2px 8px rgba(15,27,54,.07), 0 20px 44px -20px rgba(46,107,255,.24);
    --shadow-l:0 6px 14px rgba(15,27,54,.1), 0 44px 80px -30px rgba(46,107,255,.34);
    --radius:16px; --maxw:1200px;
    --disp:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
    --body:"SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
    --mono:"SF Mono",ui-monospace,"JetBrains Mono",Menlo,monospace;
  }
  @media (prefers-color-scheme:dark){
    :root{
      --bg:#070E22; --bg-alt:#0B142E; --surface:#0E1938;
      --navy:#0A1436; --navy-2:#111C46;
      --ink:#EAF0FB; --ink-2:#AEBCD8; --muted:#7C8CAC;
      --line:#1A264A; --line-2:#243361;
      --blue:#5B8CFF; --blue-d:#7AA0FF;
      --violet:#9B7BFF; --cyan:#39C6E4; --emerald:#2BD69C; --amber:#F2B441; --rose:#F06BA6;
      --tint-blue:#122145; --tint-violet:#1C1A4A; --tint-cyan:#0E2E3A; --tint-emerald:#0D2E28; --tint-amber:#2E2413; --tint-rose:#2E1728;
      --shadow-sm:0 1px 2px rgba(0,0,0,.4);
      --shadow:0 2px 8px rgba(0,0,0,.45), 0 20px 44px -20px rgba(0,0,0,.6);
      --shadow-l:0 6px 14px rgba(0,0,0,.5), 0 44px 80px -28px rgba(0,0,0,.72);
    }
  }
  :root[data-theme="light"]{
    --bg:#FFFFFF; --bg-alt:#F5F8FE; --surface:#FFFFFF; --navy:#0B1B45; --navy-2:#141F5C;
    --ink:#0F1B36; --ink-2:#4A5878; --muted:#8090AD; --line:#E6EBF5; --line-2:#D6DEEE;
    --blue:#2E6BFF; --blue-d:#1E4FD1; --violet:#7A4DFF; --cyan:#0FA9CC; --emerald:#0FA672; --amber:#EA9A1F; --rose:#E5468A;
    --tint-blue:#EAF1FF; --tint-violet:#F0EBFF; --tint-cyan:#E4F7FB; --tint-emerald:#E2F6EE; --tint-amber:#FDF2DD; --tint-rose:#FCEAF3;
    --shadow-sm:0 1px 2px rgba(15,27,54,.06),0 4px 12px rgba(15,27,54,.05);
    --shadow:0 2px 8px rgba(15,27,54,.07),0 20px 44px -20px rgba(46,107,255,.24);
    --shadow-l:0 6px 14px rgba(15,27,54,.1),0 44px 80px -30px rgba(46,107,255,.34);
  }
  :root[data-theme="dark"]{
    --bg:#070E22; --bg-alt:#0B142E; --surface:#0E1938; --navy:#0A1436; --navy-2:#111C46;
    --ink:#EAF0FB; --ink-2:#AEBCD8; --muted:#7C8CAC; --line:#1A264A; --line-2:#243361;
    --blue:#5B8CFF; --blue-d:#7AA0FF; --violet:#9B7BFF; --cyan:#39C6E4; --emerald:#2BD69C; --amber:#F2B441; --rose:#F06BA6;
    --tint-blue:#122145; --tint-violet:#1C1A4A; --tint-cyan:#0E2E3A; --tint-emerald:#0D2E28; --tint-amber:#2E2413; --tint-rose:#2E1728;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow:0 2px 8px rgba(0,0,0,.45),0 20px 44px -20px rgba(0,0,0,.6);
    --shadow-l:0 6px 14px rgba(0,0,0,.5),0 44px 80px -28px rgba(0,0,0,.72);
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); font-size:16.5px; line-height:1.6; -webkit-font-smoothing:antialiased; }
  h1,h2,h3,h4{ font-family:var(--disp); font-weight:600; letter-spacing:-.02em; line-height:1.12; margin:0; }
  p{ margin:0; }
  a{ color:inherit; text-decoration:none; }
  .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }
  .tnum{ font-variant-numeric:tabular-nums; }
  .gtext{ background:var(--grad-brand); -webkit-background-clip:text; background-clip:text; color:transparent; }

  .btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:var(--disp); font-weight:560; font-size:15px;
    padding:13px 24px; border-radius:10px; cursor:pointer; border:1px solid transparent; transition:filter .15s, box-shadow .15s, transform .15s, border-color .15s, background .15s; white-space:nowrap; }
  .btn svg{ width:16px; height:16px; }
  .btn-primary{ background:var(--grad-brand); color:#fff; box-shadow:0 8px 20px -6px rgba(46,107,255,.5); }
  .btn-primary:hover{ filter:brightness(1.06); transform:translateY(-2px); box-shadow:0 12px 26px -8px rgba(46,107,255,.55); }
  .btn-outline{ background:transparent; color:var(--ink); border-color:var(--line-2); }
  .btn-outline:hover{ border-color:var(--blue); color:var(--blue); }
  .btn-onnavy{ background:#fff; color:var(--navy); }
  .btn-onnavy:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -10px rgba(0,0,0,.5); }
  .btn-ghost-navy{ background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.28); }
  .btn-ghost-navy:hover{ background:rgba(255,255,255,.2); }

  /* UTILITY BAR */
  .util{ background:var(--navy); color:rgba(255,255,255,.95); font-size:13px; font-weight:600; position:relative; overflow:hidden; }
  .util::before{ content:""; position:absolute; inset:0; background:var(--grad-brand); opacity:.16; }
  .util-in{ position:relative; display:flex; align-items:center; justify-content:space-between; height:40px; }
  .util a{ color:rgba(255,255,255,.95); }
  .util .l{ display:flex; gap:24px; align-items:center; }
  .util .l span{ display:inline-flex; align-items:center; gap:7px; }
  .util .l svg{ width:14px; height:14px; opacity:.85; }
  .util .r{ display:flex; gap:20px; align-items:center; }
  .util .r a:hover{ color:#fff; }
  @media (max-width:760px){ .util .l span.addr{ display:none; } }
  @media (max-width:600px){ .util .r{ display:none; } .util .l span:not(:first-child){ display:none; } .util-in{ justify-content:center; } }

  /* NAV */
  header.nav{ position:sticky; top:0; z-index:60; background:color-mix(in srgb,var(--bg) 92%,transparent); backdrop-filter:saturate(1.7) blur(18px);
    box-shadow:0 1px 0 var(--line), 0 10px 30px -22px rgba(15,27,54,.6); }
  header.nav::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--grad-brand); opacity:.55; }
  .nav-in{ display:flex; align-items:center; justify-content:space-between; height:78px; }
  .brand{ display:flex; align-items:center; gap:12px; font-family:var(--disp); color:var(--ink); }
  .brand .hdr-logo{ height:28px; width:auto; display:block; }
  .brand .hdr-logo text{ font-family:var(--disp); font-weight:800; font-size:36px; }
  .brand .hdr-logo .lg-b{ fill:#2166d6; }
  .brand .hdr-logo .lg-g{ fill:#2f9e33; }
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]) .brand .hdr-logo .lg-b{ fill:#6aa0ff; }
    :root:not([data-theme="light"]) .brand .hdr-logo .lg-g{ fill:#57cf61; }
  }
  :root[data-theme="dark"] .brand .hdr-logo .lg-b{ fill:#6aa0ff; }
  :root[data-theme="dark"] .brand .hdr-logo .lg-g{ fill:#57cf61; }
  :root[data-theme="light"] .brand .hdr-logo .lg-b{ fill:#2166d6; }
  :root[data-theme="light"] .brand .hdr-logo .lg-g{ fill:#2f9e33; }
  .nav-links{ display:flex; gap:32px; font-size:15px; font-weight:540; }
  .nav-links a{ position:relative; color:var(--ink); padding:6px 0; transition:color .15s; }
  .nav-links a::after{ content:""; position:absolute; left:0; right:0; bottom:-3px; height:2px; border-radius:2px; background:var(--grad-brand); transform:scaleX(0); transform-origin:left; transition:transform .22s ease; }
  .nav-links a:hover, .nav-links a.active{ color:var(--blue); }
  .nav-links a:hover::after, .nav-links a.active::after{ transform:scaleX(1); }
  .nav-actions{ display:flex; align-items:center; gap:12px; }
  .theme-btn{ width:40px; height:40px; border-radius:11px; border:1px solid var(--line-2); background:var(--bg-alt); display:grid; place-items:center; cursor:pointer; color:var(--ink-2); transition:border-color .15s, color .15s; }
  .theme-btn:hover{ border-color:var(--blue); color:var(--blue); }
  .theme-btn svg{ width:17px; height:17px; }
  .nav-login{ font-size:15px; font-weight:560; color:var(--ink); }
  .nav-login:hover{ color:var(--blue); }
  .hamburger{ display:none; width:42px; height:42px; border-radius:11px; border:1px solid var(--line-2); background:var(--bg-alt); cursor:pointer; align-items:center; justify-content:center; color:var(--ink); }
  .hamburger svg{ width:22px; height:22px; }
  .mobile-menu{ display:none; }
  @media (max-width:940px){
    .nav-links,.nav-login{ display:none; }
    .nav-actions .btn-primary{ display:none; }   /* Get Started moves into the menu */
    .hamburger{ display:inline-grid; place-items:center; }
    .mobile-menu{ position:absolute; top:100%; left:0; right:0; background:var(--bg); border-bottom:1px solid var(--line);
      box-shadow:0 24px 44px -18px rgba(15,27,54,.35); padding:14px 26px 20px; flex-direction:column; gap:2px; z-index:59; }
    .mobile-menu.open{ display:flex; }
    .mobile-menu a{ padding:13px 12px; border-radius:10px; font-size:16px; font-weight:560; color:var(--ink); font-family:var(--disp); }
    .mobile-menu a:hover, .mobile-menu a.active{ background:var(--bg-alt); color:var(--blue); }
    .mobile-menu .mm-login{ border-top:1px solid var(--line); margin-top:8px; padding-top:16px; }
    .mobile-menu .btn-primary{ color:#fff; justify-content:center; margin-top:8px; }
  }

  /* HERO */
  .hero{ position:relative; overflow:hidden; color:#fff;
    background:
      radial-gradient(60% 55% at 12% 8%, rgba(46,107,255,.55), transparent 60%),
      radial-gradient(55% 60% at 88% 12%, rgba(122,77,255,.5), transparent 58%),
      radial-gradient(50% 60% at 70% 100%, rgba(15,169,204,.42), transparent 60%),
      linear-gradient(135deg,#0B1B45 0%,#14205C 55%,#1A1E5E 100%); }
  .hero::before{ content:""; position:absolute; inset:0; opacity:.4; pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
    background-size:54px 54px; mask-image:radial-gradient(120% 90% at 30% 0%,#000,transparent 72%); }
  .hero-in{ position:relative; z-index:1; display:grid; grid-template-columns:1.08fr .92fr; gap:52px; align-items:center; padding:52px 0 58px; }

  .slider{ position:relative; min-height:352px; }
  .slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .28s ease, visibility 0s linear .28s; pointer-events:none; }
  .slide.active{ opacity:1; visibility:visible; transition:opacity .55s ease .2s, visibility 0s; pointer-events:auto; position:relative; }
  .s-tag{ display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
    color:#fff; background:linear-gradient(120deg,rgba(46,107,255,.34),rgba(122,77,255,.34)); border:1px solid rgba(255,255,255,.22); padding:7px 14px; border-radius:100px; }
  .s-tag .dot{ width:7px; height:7px; border-radius:50%; background:#8FE0C0; box-shadow:0 0 0 3px rgba(143,224,192,.28); }
  .slide h1, .slide h2{ font-size:clamp(34px,4.4vw,54px); margin-top:22px; color:#fff; letter-spacing:-.03em; font-weight:700; }
  .slide h1 .u, .slide h2 .u{ background:linear-gradient(100deg,#8FC2FF,#B69BFF,#7FE3EC); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .slide p{ font-size:18.5px; color:rgba(233,240,248,.84); margin-top:20px; max-width:44ch; }
  .hero-cta{ display:flex; gap:13px; margin-top:30px; flex-wrap:wrap; }
  .s-top{ display:flex; align-items:center; gap:14px 20px; flex-wrap:wrap; }
  .s-top .hero-trust{ margin-top:0; }
  .hero-trust{ display:flex; gap:26px; margin-top:30px; flex-wrap:wrap; }
  .hero-trust span{ display:inline-flex; align-items:center; gap:9px; font-size:14px; color:rgba(233,240,248,.82); }
  .hero-trust svg{ width:17px; height:17px; color:#7FE3B0; }
  .slider-nav{ display:flex; align-items:center; gap:16px; margin-top:38px; }
  .dots{ display:flex; gap:9px; }
  .dots button{ width:30px; height:4px; border-radius:100px; border:none; background:rgba(255,255,255,.28); cursor:pointer; padding:0; transition:background .2s; }
  .dots button.on{ background:linear-gradient(90deg,#8FC2FF,#B69BFF); }
  .arrows{ display:flex; gap:8px; }
  .arrows button{ width:38px; height:38px; border-radius:10px; border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.08); color:#fff; cursor:pointer; display:grid; place-items:center; transition:background .15s; }
  .arrows button:hover{ background:rgba(255,255,255,.18); }
  .arrows svg{ width:16px; height:16px; }

  /* CALCULATOR */
  .calc{ background:var(--surface); color:var(--ink); border-radius:20px; box-shadow:var(--shadow-l); overflow:hidden; border:1px solid rgba(255,255,255,.5); position:relative; }
  .calc::before{ content:""; position:absolute; inset:0; border-radius:20px; padding:1px; background:var(--grad-brand); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.5; pointer-events:none; }
  .calc-head{ background:var(--grad-brand); color:#fff; padding:18px 24px; display:flex; align-items:center; justify-content:space-between; }
  .calc-head .t{ font-family:var(--disp); font-weight:650; font-size:16px; display:flex; align-items:center; gap:10px; }
  .calc-head .t .ic{ width:32px; height:32px; border-radius:9px; background:rgba(255,255,255,.2); display:grid; place-items:center; }
  .calc-head .t .ic svg{ width:17px; height:17px; }
  .calc-head select.yr{ -webkit-appearance:none; appearance:none; outline:none; cursor:pointer;
    font-family:var(--mono); font-size:12px; font-weight:600; color:#fff; border-radius:8px;
    border:1px solid rgba(255,255,255,.45); padding:6px 30px 6px 11px;
    background-color:rgba(255,255,255,.16);
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat:no-repeat; background-position:right 9px center; transition:background-color .15s, border-color .15s; }
  .calc-head select.yr:hover{ background-color:rgba(255,255,255,.3); border-color:rgba(255,255,255,.75); }
  .calc-head select.yr:focus-visible{ border-color:#fff; outline:2px solid rgba(255,255,255,.4); outline-offset:1px; }
  select.yr option{ color:#0F1B36; }
  .calc-body{ padding:22px 24px 8px; }
  .field-label{ font-size:13.5px; color:var(--ink-2); font-weight:560; display:flex; justify-content:space-between; align-items:baseline; margin-bottom:9px; }
  .input-money{ display:flex; align-items:center; border:1px solid var(--line-2); border-radius:11px; overflow:hidden; transition:border-color .15s, box-shadow .15s; background:var(--bg); }
  .input-money:focus-within{ border-color:var(--blue); box-shadow:0 0 0 3px var(--tint-blue); }
  .input-money .cur{ padding:0 14px; font-weight:600; color:var(--blue); font-size:15px; border-right:1px solid var(--line); background:var(--tint-blue); align-self:stretch; display:flex; align-items:center; }
  .input-money input{ border:none; outline:none; background:transparent; font-family:var(--mono); font-size:19px; font-weight:600; color:var(--ink); padding:13px 14px; width:100%; }
  input[type=range]{ -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:100px; margin-top:16px;
    background:linear-gradient(90deg,#2E6BFF var(--fill,30%),var(--line-2) var(--fill,30%)); outline:none; }
  input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; width:20px; height:20px; border-radius:50%; background:#fff; border:3px solid var(--blue); box-shadow:0 2px 6px rgba(0,0,0,.2); cursor:pointer; }
  .rng-scale{ display:flex; justify-content:space-between; font-size:11px; color:var(--muted); margin-top:8px; font-family:var(--mono); }
  .calc-hint{ font-size:12px; color:var(--muted); margin-top:11px; line-height:1.45; }
  .calc-results{ margin-top:16px; padding:0 22px; display:flex; flex-direction:column; gap:12px; }
  .cr-lbl{ font-family:var(--mono); font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin-bottom:7px; display:flex; align-items:center; gap:8px; }
  .cr-lbl::after{ content:""; flex:1; height:1px; background:var(--line); }
  .cr-row{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
  .ct{ border-radius:9px; padding:9px 11px; min-width:0; }
  .ct.tax{ background:var(--tint-blue); }
  .ct.sur{ background:var(--tint-amber); }
  .ct.net{ background:var(--tint-emerald); }
  .ct .cl{ display:block; font-size:10.5px; color:var(--ink-2); white-space:nowrap; }
  .ct .cv{ display:block; font-family:var(--disp); font-weight:700; font-size:15px; letter-spacing:-.02em; margin-top:2px; white-space:nowrap; }
  .ct.tax .cv{ color:var(--blue); }
  .ct.sur .cv{ color:var(--amber); }
  .ct.net .cv{ color:var(--emerald); }
  .calc-foot{ margin-top:14px; padding:0 22px 18px; }
  @media (max-width:940px){ .hero-in{ grid-template-columns:1fr; gap:44px; padding:48px 0 60px; } .slider{ min-height:0; } }

  /* LOGO BAR */
  .logobar{ background:var(--bg-alt); border-bottom:1px solid var(--line); }
  .logobar-in{ padding:26px 0; display:flex; align-items:center; gap:38px; flex-wrap:wrap; justify-content:center; }
  .logobar .lbl{ font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
  .logobar .lo{ font-family:var(--disp); font-weight:600; font-size:16px; color:var(--ink-2); opacity:.7; letter-spacing:-.01em; }

  /* HIGHLIGHTS */
  .highlights{ background:linear-gradient(180deg,var(--bg),var(--bg-alt)); border-bottom:1px solid var(--line); }
  .hl-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; padding:28px 0; }
  .hl{ position:relative; display:flex; gap:14px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:20px 20px; overflow:hidden;
    transition:transform .18s, box-shadow .18s, border-color .18s; }
  .hl::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--cg); }
  .hl:hover{ transform:translateY(-4px); box-shadow:0 18px 38px -20px var(--cshadow); border-color:transparent; }
  .hl .hi{ width:44px; height:44px; border-radius:11px; background:var(--cg); color:#fff; display:grid; place-items:center; flex-shrink:0; box-shadow:0 9px 18px -7px var(--cshadow); }
  .hl .hi svg{ width:22px; height:22px; }
  .hl .ht{ font-family:var(--disp); font-weight:620; font-size:15.5px; letter-spacing:-.01em; }
  .hl .hs{ font-size:13px; color:var(--ink-2); margin-top:4px; line-height:1.4; }
  @media (max-width:900px){ .hl-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .hl-grid{ grid-template-columns:1fr; } }

  /* SECTION */
  section.blk{ padding:28px 0; position:relative; }
  .sec-head{ max-width:660px; }
  .sec-head.center{ margin:0 auto; text-align:center; }
  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
    background:var(--grad-brand); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .eyebrow::before{ content:""; width:22px; height:2px; border-radius:2px; background:var(--grad-brand); }
  .sec-head h2{ font-size:clamp(30px,3.6vw,44px); margin-top:14px; }
  .sec-head p{ color:var(--ink-2); font-size:18px; margin-top:15px; }

  /* FEATURES &mdash; colourful cards */
  .feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
  .feat{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 28px; overflow:hidden;
    transition:box-shadow .2s, transform .2s, border-color .2s; }
  .feat::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--cg); }
  .feat::after{ content:""; position:absolute; width:180px; height:180px; border-radius:50%; right:-60px; top:-70px; background:var(--cg); opacity:.09; transition:opacity .2s, transform .2s; }
  .feat:hover{ transform:translateY(-5px); box-shadow:0 20px 44px -20px var(--cshadow); border-color:transparent; }
  .feat:hover::after{ opacity:.16; transform:scale(1.15); }
  .feat .fic{ width:54px; height:54px; border-radius:14px; background:var(--cg); color:#fff; display:grid; place-items:center; margin-bottom:18px; box-shadow:0 10px 22px -8px var(--cshadow); position:relative; }
  .feat .fic svg{ width:26px; height:26px; }
  .feat h3{ font-size:19.5px; position:relative; }
  .feat p{ color:var(--ink-2); font-size:15px; margin-top:9px; position:relative; }
  .feat .more{ font-size:14px; font-weight:600; margin-top:15px; display:inline-flex; align-items:center; gap:6px; position:relative; cursor:pointer;
    background:var(--cg); -webkit-background-clip:text; background-clip:text; color:transparent; transition:gap .15s; }
  .feat .more:hover{ gap:10px; }
  .feat .more svg{ width:14px; height:14px; color:var(--cvar); }
  @media (max-width:900px){ .feat-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:600px){ .feat-grid{ grid-template-columns:1fr; } }

  /* VALUE */
  .value{ background:linear-gradient(180deg,var(--bg-alt),var(--bg)); border-top:1px solid var(--line); }
  .value-in{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; }
  .vlist{ display:flex; flex-direction:column; gap:20px; margin-top:26px; }
  .vitem{ display:flex; gap:16px; }
  .vitem .vi{ width:46px; height:46px; border-radius:12px; color:#fff; display:grid; place-items:center; flex-shrink:0; box-shadow:0 10px 20px -8px var(--cshadow); background:var(--cg); }
  .vitem .vi svg{ width:23px; height:23px; }
  .vitem h4{ font-size:17px; }
  .vitem p{ color:var(--ink-2); font-size:14.5px; margin-top:5px; }
  .value-panel{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); overflow:hidden; }
  .vp-head{ background:linear-gradient(120deg,var(--navy),var(--navy-2)); color:#fff; padding:20px 22px; font-family:var(--disp); font-weight:600; font-size:15px; display:flex; align-items:center; justify-content:space-between; position:relative; }
  .vp-head::after{ content:""; position:absolute; inset:0; background:var(--grad-brand); opacity:.24; }
  .vp-head span, .vp-head .st{ position:relative; z-index:1; }
  .vp-head .st{ font-family:var(--mono); font-size:11px; color:#8FE0C0; background:rgba(43,196,141,.2); padding:5px 10px; border-radius:6px; }
  .vp-row{ display:flex; align-items:center; justify-content:space-between; padding:15px 22px; border-bottom:1px solid var(--line); font-size:14.5px; }
  .vp-row:last-child{ border-bottom:none; }
  .vp-row .k{ color:var(--ink-2); display:flex; align-items:center; gap:11px; }
  .vp-row .k .d{ width:22px; height:22px; border-radius:7px; background:var(--g-emerald); display:grid; place-items:center; }
  .vp-row .k .d svg{ width:12px; height:12px; color:#fff; }
  .vp-row .v{ font-family:var(--mono); font-weight:600; color:var(--emerald); }
  @media (max-width:860px){ .value-in{ grid-template-columns:1fr; gap:40px; } }

  /* PROCESS */
  .proc{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:34px; }
  .pcol{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px 24px; overflow:hidden; }
  .pcol::before{ content:""; position:absolute; top:0; left:0; width:4px; bottom:0; background:var(--cg); }
  .pcol .pn{ font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.05em; background:var(--cg); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .pcol .pi{ width:48px; height:48px; border-radius:12px; background:var(--cg); color:#fff; display:grid; place-items:center; margin:14px 0 16px; box-shadow:0 10px 20px -8px var(--cshadow); }
  .pcol .pi svg{ width:24px; height:24px; }
  .pcol h4{ font-size:17px; }
  .pcol p{ color:var(--ink-2); font-size:14px; margin-top:8px; }
  @media (max-width:860px){ .proc{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .proc{ grid-template-columns:1fr; } }

  /* SOLUTIONS */
  .sol-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px; }
  .sol{ display:flex; align-items:center; gap:14px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px 22px; font-family:var(--disp); font-weight:560; font-size:16px; transition:border-color .15s, box-shadow .15s, transform .15s; }
  .sol:hover{ border-color:transparent; box-shadow:0 16px 34px -18px var(--cshadow); transform:translateY(-3px); }
  .sol .si{ width:42px; height:42px; border-radius:11px; background:var(--cg); color:#fff; display:grid; place-items:center; box-shadow:0 8px 18px -7px var(--cshadow); }
  .sol .si svg{ width:20px; height:20px; }
  @media (max-width:820px){ .sol-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .sol-grid{ grid-template-columns:1fr; } }

  /* COMPLIANCE BAND */
  .band{ color:#fff; border-radius:24px; padding:42px; display:grid; grid-template-columns:1.3fr 1fr; gap:40px; align-items:center; position:relative; overflow:hidden;
    background:radial-gradient(70% 120% at 10% 10%, rgba(46,107,255,.6), transparent 55%),
      radial-gradient(80% 120% at 100% 90%, rgba(122,77,255,.55), transparent 55%),
      linear-gradient(130deg,#0B1B45,#141F5C); }
  .band::after{ content:""; position:absolute; inset:0; opacity:.35; pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:44px 44px;
    mask-image:radial-gradient(90% 90% at 80% 20%,#000,transparent 70%); }
  .band > *{ position:relative; z-index:1; }
  .band h2{ color:#fff; font-size:clamp(26px,3.4vw,38px); }
  .band p{ color:rgba(233,240,248,.84); font-size:17px; margin-top:16px; }
  .band .badges{ display:flex; flex-direction:column; gap:14px; }
  .band .bd{ display:flex; align-items:center; gap:14px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:13px; padding:16px 18px; backdrop-filter:blur(4px); }
  .band .bd .bi{ width:42px; height:42px; border-radius:11px; display:grid; place-items:center; flex-shrink:0; color:#fff; background:var(--cg); box-shadow:0 8px 18px -7px rgba(0,0,0,.5); }
  .band .bd .bi svg{ width:21px; height:21px; }
  .band .bd .bt{ font-family:var(--disp); font-weight:600; font-size:15px; }
  .band .bd .bs{ font-size:12.5px; color:rgba(233,240,248,.65); }
  @media (max-width:760px){ .band{ grid-template-columns:1fr; padding:36px 28px; } }

  /* TESTIMONIALS */
  .tgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
  .tq{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 28px; display:flex; flex-direction:column; overflow:hidden; }
  .tq::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--cg); }
  .tq .stars{ color:var(--gold); letter-spacing:2px; font-size:14px; }
  .tq p{ font-size:15.5px; color:var(--ink); margin-top:14px; flex:1; line-height:1.55; }
  .tq .who{ display:flex; align-items:center; gap:12px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
  .tq .av{ width:46px; height:46px; border-radius:12px; background:var(--cg); color:#fff; display:grid; place-items:center; font-family:var(--disp); font-weight:600; box-shadow:0 8px 18px -7px var(--cshadow); }
  .tq .who .nm{ font-family:var(--disp); font-weight:600; font-size:14.5px; }
  .tq .who .rl{ font-size:12.5px; color:var(--muted); }
  @media (max-width:820px){ .tgrid{ grid-template-columns:1fr; } }

  /* CLIENTS MARQUEE */
  .clients{ background:linear-gradient(180deg,var(--bg),var(--bg-alt)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; }
  .clients .rows{ display:flex; flex-direction:column; gap:16px; margin-top:30px;
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
  .marq{ display:flex; overflow:hidden; }
  .marq .track{ display:flex; gap:16px; width:max-content; flex-shrink:0; animation:marqL 46s linear infinite; }
  .marq.rev .track{ animation:marqR 40s linear infinite; }
  .marq.slow .track{ animation-duration:56s; }
  .marq:hover .track{ animation-play-state:paused; }
  @keyframes marqL{ from{ transform:translateX(0); } to{ transform:translateX(calc(-50% - 8px)); } }
  @keyframes marqR{ from{ transform:translateX(calc(-50% - 8px)); } to{ transform:translateX(0); } }
  .clogo{ display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:14px 22px; white-space:nowrap; box-shadow:var(--shadow-sm); }
  .clogo .cm{ width:32px; height:32px; border-radius:9px; background:var(--cg,var(--grad-brand)); color:#fff; display:grid; place-items:center; font-family:var(--disp); font-weight:700; font-size:14px; flex-shrink:0; }
  .clogo .cn{ font-family:var(--disp); font-weight:600; font-size:16px; color:var(--ink-2); letter-spacing:-.01em; }
  @media (prefers-reduced-motion:reduce){ .marq .track{ animation:none !important; } }

  /* CTA */
  .cta{ position:relative; text-align:center; border-radius:24px; padding:48px 40px; overflow:hidden; color:#fff;
    background:radial-gradient(60% 120% at 15% 15%, rgba(46,107,255,.7), transparent 55%),
      radial-gradient(60% 120% at 85% 85%, rgba(122,77,255,.65), transparent 55%),
      linear-gradient(130deg,#12205A,#1A1E5E); }
  .cta::after{ content:""; position:absolute; inset:0; opacity:.3; pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px); background-size:46px 46px; mask-image:radial-gradient(90% 90% at 50% 0%,#000,transparent 72%); }
  .cta > *{ position:relative; z-index:1; }
  .cta h2{ color:#fff; font-size:clamp(28px,3.6vw,44px); }
  .cta p{ color:rgba(233,240,248,.82); font-size:18px; margin-top:14px; max-width:46ch; margin-inline:auto; }
  .cta .hero-cta{ justify-content:center; margin-top:28px; }

  /* FOOTER */
  footer{ color:rgba(233,240,248,.9); padding:44px 0 26px; margin-top:0; position:relative; overflow:hidden;
    background:linear-gradient(180deg,#0B1B45,#0A1436); }
  footer::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-brand); }
  .foot-grid{ position:relative; display:grid; grid-template-columns:1.7fr 1fr 1fr 1.2fr; gap:40px; }
  .foot-logo-link{ display:inline-block; }
  .foot-logo{ height:36px; width:auto; display:block; }
  .foot-brand .brand{ color:#fff; }
  .foot-brand .brand .mark{ box-shadow:none; }
  .foot-brand .brand em{ background:linear-gradient(120deg,#8FC2FF,#B69BFF); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .foot-brand p{ font-size:14px; margin-top:16px; max-width:30ch; color:rgba(233,240,248,.82); }
  .foot-col h4{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(233,240,248,.72); margin-bottom:15px; }
  .foot-col a{ display:block; color:rgba(233,240,248,.9); font-size:14px; padding:6px 0; }
  .foot-col a:hover{ color:#fff; }
  .crow{ display:flex; align-items:center; gap:11px; font-size:14px; color:rgba(233,240,248,.9); padding:6px 0; }
  .crow svg{ width:16px; height:16px; opacity:.75; flex-shrink:0; }
  .foot-bot{ position:relative; display:flex; justify-content:space-between; align-items:center; margin-top:30px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); font-size:13px; color:rgba(233,240,248,.72); flex-wrap:wrap; gap:12px; }
  @media (max-width:820px){ .foot-grid{ grid-template-columns:1fr 1fr; gap:30px; } }

  /* ===== ROUTER ===== */
  .page{ display:none; }
  .page.active{ display:block; animation:pgIn .45s ease; }
  @keyframes pgIn{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:none; } }

  /* PAGE HERO */
  .page-hero{ position:relative; overflow:hidden; color:#fff; padding:48px 0 44px;
    background:radial-gradient(62% 120% at 8% 0%, rgba(46,107,255,.55), transparent 55%),
      radial-gradient(60% 120% at 94% 30%, rgba(122,77,255,.5), transparent 55%),
      radial-gradient(50% 120% at 60% 100%, rgba(15,169,204,.4), transparent 60%),
      linear-gradient(130deg,#0B1B45,#141F5C); }
  .page-hero::before{ content:""; position:absolute; inset:0; opacity:.4; pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
    background-size:52px 52px; mask-image:radial-gradient(120% 90% at 30% 0%,#000,transparent 72%); }
  .ph-in{ position:relative; z-index:1; text-align:center; max-width:760px; margin:0 auto; }
  .ph-crumb{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:rgba(233,240,248,.55); }
  .ph-crumb b{ color:#8FC2FF; font-weight:600; }
  .page-hero h1{ font-size:clamp(34px,4.6vw,54px); margin-top:16px; color:#fff; letter-spacing:-.03em; }
  .page-hero h1 .u{ background:linear-gradient(100deg,#8FC2FF,#B69BFF,#7FE3EC); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .page-hero p{ font-size:19px; color:rgba(233,240,248,.82); margin-top:18px; }

  /* FEATURE ROWS */
  .frow{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding:48px 0; border-bottom:1px solid var(--line); }
  .frow:last-of-type{ border-bottom:none; }
  .frow.rev .ftext{ order:2; }
  .ftext h2{ font-size:clamp(25px,2.9vw,34px); margin-top:14px; }
  .ftext > p{ color:var(--ink-2); font-size:16.5px; margin-top:14px; }
  .fbul{ list-style:none; padding:0; margin:22px 0 0; display:flex; flex-direction:column; gap:13px; }
  .fbul li{ display:flex; gap:12px; align-items:flex-start; font-size:15.5px; color:var(--ink); }
  .fbul li .ck{ width:23px; height:23px; border-radius:7px; background:var(--cg); color:#fff; display:grid; place-items:center; flex-shrink:0; margin-top:1px; box-shadow:0 6px 12px -5px var(--cshadow); }
  .fbul li .ck svg{ width:13px; height:13px; }
  .fvisual{ position:relative; border-radius:20px; padding:30px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow);
    background:linear-gradient(160deg, color-mix(in srgb, var(--cvar) 10%, var(--surface)), var(--surface)); }
  .fvisual::after{ content:""; position:absolute; width:220px; height:220px; border-radius:50%; right:-70px; top:-80px; background:var(--cg); opacity:.12; }
  .fv-card{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); overflow:hidden; }
  .fv-top{ display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); }
  .fv-top .ic{ width:38px; height:38px; border-radius:10px; background:var(--cg); color:#fff; display:grid; place-items:center; box-shadow:0 8px 16px -6px var(--cshadow); }
  .fv-top .ic svg{ width:19px; height:19px; }
  .fv-top .tt{ font-family:var(--disp); font-weight:620; font-size:14.5px; }
  .fv-top .ss{ font-size:11.5px; color:var(--muted); }
  .fv-row{ display:flex; align-items:center; justify-content:space-between; padding:13px 18px; border-bottom:1px solid var(--line); font-size:13.5px; color:var(--ink-2); }
  .fv-row:last-child{ border-bottom:none; }
  .fv-row .mono{ font-family:var(--mono); font-weight:600; color:var(--ink); }
  .fv-row .pill{ font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; padding:4px 9px; border-radius:100px; background:var(--tint-emerald); color:var(--emerald); font-weight:600; }
  @media (max-width:840px){ .frow{ grid-template-columns:1fr; gap:30px; padding:48px 0; } .frow.rev .ftext{ order:0; } }

  /* PRICING */
  .pricing-wrap{ display:grid; grid-template-columns:1.15fr .85fr; gap:22px; align-items:stretch; }
  .ptable-card{ background:var(--surface); border:1px solid var(--line); border-radius:20px; overflow:hidden; box-shadow:var(--shadow); }
  .ptable{ width:100%; border-collapse:collapse; }
  .ptable th{ text-align:left; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); padding:22px 26px 12px; }
  .ptable th:last-child{ text-align:right; }
  .ptable td{ padding:18px 26px; border-top:1px solid var(--line); font-size:16px; }
  .ptable td:last-child{ text-align:right; font-family:var(--mono); font-weight:600; }
  .ptable tr.best td{ background:var(--tint-blue); }
  .ptable .tier{ font-weight:600; display:flex; align-items:center; gap:10px; }
  .ptable .amt b{ font-family:var(--disp); font-size:20px; }
  .ptable .amt .rs{ color:var(--muted); font-size:13px; }
  .best-tag{ font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:var(--grad-brand); padding:3px 9px; border-radius:6px; }
  .pwork{ background:linear-gradient(155deg,var(--navy),var(--navy-2)); border-radius:20px; padding:30px; color:#fff; position:relative; overflow:hidden; }
  .pwork::after{ content:""; position:absolute; inset:0; background:var(--grad-brand); opacity:.16; pointer-events:none; }
  .pwork > *{ position:relative; z-index:1; }
  .pwork h3{ color:#fff; font-size:20px; }
  .pwork ul{ list-style:none; padding:0; margin:20px 0; display:flex; flex-direction:column; gap:15px; }
  .pwork li{ display:flex; gap:12px; font-size:14.5px; color:rgba(233,240,248,.95); }
  .pwork li b{ color:#fff; }
  .pwork li .ci{ width:26px; height:26px; border-radius:8px; background:rgba(43,196,141,.22); color:#8FE0C0; display:grid; place-items:center; flex-shrink:0; }
  .pwork li .ci svg{ width:14px; height:14px; }
  .credit-calc{ background:var(--surface); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); padding:28px; margin-top:22px; display:flex; flex-direction:column; justify-content:center; }
  .cc-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
  .cc-head .t{ font-family:var(--disp); font-weight:640; font-size:17px; }
  .cc-out{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:20px; }
  .cc-out .o{ border-radius:12px; padding:16px; }
  .cc-out .o.a{ background:var(--tint-blue); } .cc-out .o.b{ background:var(--tint-emerald); }
  .cc-out .o .l{ font-size:12px; color:var(--ink-2); }
  .cc-out .o .v{ font-family:var(--disp); font-weight:700; font-size:23px; margin-top:3px; }
  .cc-out .o.a .v{ color:var(--blue); } .cc-out .o.b .v{ color:var(--emerald); }
  @media (max-width:820px){ .pricing-wrap{ grid-template-columns:1fr; } }
  .pwork-wide{ margin-top:22px; }
  .pwork-wide h3{ margin-bottom:18px; }
  .pwork-wide .pwork-inner{ display:flex; align-items:center; gap:30px; flex-wrap:wrap; }
  .pwork-wide .pwork-inner ul{ flex:1; min-width:280px; display:grid; grid-template-columns:1fr; gap:14px; margin:0; }
  .pwork-wide .pwork-inner .btn{ flex-shrink:0; }
  @media (max-width:760px){ .pwork-wide .pwork-inner{ flex-direction:column; align-items:stretch; } .pwork-wide .pwork-inner ul{ grid-template-columns:1fr; } }

  /* FAQ */
  .faq-list{ max-width:800px; margin:30px auto 0; display:flex; flex-direction:column; gap:12px; }
  .faq{ background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
  .faq summary{ list-style:none; cursor:pointer; padding:20px 24px; font-family:var(--disp); font-weight:600; font-size:16.5px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
  .faq summary::-webkit-details-marker{ display:none; }
  .faq summary .pl{ width:26px; height:26px; border-radius:8px; background:var(--tint-blue); color:var(--blue); display:grid; place-items:center; flex-shrink:0; transition:transform .2s; }
  .faq[open] summary .pl{ transform:rotate(45deg); }
  .faq summary .pl svg{ width:14px; height:14px; }
  .faq .a{ padding:0 24px 20px; color:var(--ink-2); font-size:15px; }

  /* BLOG */
  .blog-featured{ display:grid; grid-template-columns:1.1fr .9fr; gap:0; background:var(--surface); border:1px solid var(--line); border-radius:20px; overflow:hidden; box-shadow:var(--shadow); margin-bottom:28px; }
  .bf-img{ background:linear-gradient(140deg,var(--blue),var(--violet)); min-height:300px; position:relative; overflow:hidden; }
  .bf-img::after{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:34px 34px; opacity:.5; }
  .bf-img .ic{ position:absolute; inset:0; margin:auto; width:76px; height:76px; color:rgba(255,255,255,.9); }
  .bf-body{ padding:38px; display:flex; flex-direction:column; justify-content:center; }
  .cat{ display:inline-flex; align-items:center; font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--blue); background:var(--tint-blue); padding:5px 11px; border-radius:100px; align-self:flex-start; }
  .bf-body h2{ font-size:clamp(24px,2.6vw,32px); margin-top:16px; }
  .bf-body p{ color:var(--ink-2); font-size:15.5px; margin-top:14px; }
  .bmeta{ display:flex; align-items:center; gap:10px; margin-top:20px; font-size:13px; color:var(--muted); }
  .bmeta .av{ width:30px; height:30px; border-radius:50%; background:var(--grad-brand); color:#fff; display:grid; place-items:center; font-size:11px; font-weight:600; font-family:var(--disp); }
  .blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .bcard{ background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .18s, box-shadow .18s; display:flex; flex-direction:column; }
  .bcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
  .bcard .thumb{ height:150px; position:relative; overflow:hidden; }
  .bcard .thumb::after{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px); background-size:26px 26px; opacity:.6; }
  .bcard .bcbody{ padding:22px; display:flex; flex-direction:column; flex:1; }
  .bcard h3{ font-size:17.5px; margin-top:12px; }
  .bcard p{ color:var(--ink-2); font-size:14px; margin-top:9px; flex:1; }
  .bcard .bmeta{ margin-top:16px; }
  @media (max-width:900px){ .blog-grid{ grid-template-columns:1fr 1fr; } .blog-featured{ grid-template-columns:1fr; } }
  @media (max-width:560px){ .blog-grid{ grid-template-columns:1fr; } }
  .pager{ display:flex; gap:8px; justify-content:center; margin-top:44px; }
  .pager a{ min-width:42px; height:42px; padding:0 12px; border-radius:11px; border:1px solid var(--line-2); display:grid; place-items:center; font-family:var(--disp); font-weight:600; font-size:14.5px; color:var(--ink-2); }
  .pager a.on{ background:var(--grad-brand); color:#fff; border-color:transparent; }
  .pager a:hover:not(.on){ border-color:var(--blue); color:var(--blue); }

  /* ABOUT */
  .about-story{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; }
  .about-story p{ color:var(--ink-2); font-size:16.5px; margin-top:16px; }
  .story-visual{ border-radius:20px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow); background:linear-gradient(150deg,var(--tint-blue),var(--tint-violet)); min-height:340px; display:grid; place-items:center; position:relative; }
  .story-visual .badge{ background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:26px 30px; text-align:center; }
  .story-visual .badge .m{ width:60px; height:60px; border-radius:16px; background:var(--grad-brand); display:grid; place-items:center; margin:0 auto 14px; box-shadow:0 12px 24px -8px rgba(46,107,255,.6); }
  .story-visual .badge .m svg{ width:30px; height:30px; }
  .story-visual .badge .bt{ font-family:var(--disp); font-weight:700; font-size:19px; }
  .story-visual .badge .bs{ font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--blue); margin-top:4px; }
  .values{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
  .vcard{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; overflow:hidden; }
  .vcard::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--cg); }
  .vcard .vi{ width:50px; height:50px; border-radius:13px; background:var(--cg); color:#fff; display:grid; place-items:center; box-shadow:0 10px 20px -8px var(--cshadow); margin-bottom:16px; }
  .vcard .vi svg{ width:24px; height:24px; }
  .vcard h3{ font-size:18.5px; }
  .vcard p{ color:var(--ink-2); font-size:14.5px; margin-top:8px; }
  @media (max-width:840px){ .about-story{ grid-template-columns:1fr; gap:36px; } .values{ grid-template-columns:1fr; } }

  /* CONTACT */
  .contact-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:start; }
  .cform{ background:var(--surface); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); padding:34px; }
  .cform h3{ font-size:22px; }
  .cform .sub{ color:var(--ink-2); font-size:14.5px; margin-top:8px; margin-bottom:22px; }
  .field{ margin-bottom:16px; }
  .field label{ display:block; font-size:13.5px; font-weight:560; color:var(--ink-2); margin-bottom:7px; }
  .field input, .field textarea{ width:100%; border:1px solid var(--line-2); border-radius:11px; padding:13px 14px; font-family:var(--body); font-size:15px; color:var(--ink); background:var(--bg); outline:none; transition:border-color .15s, box-shadow .15s; }
  .field input:focus, .field textarea:focus{ border-color:var(--blue); box-shadow:0 0 0 3px var(--tint-blue); }
  .field.two{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
  .field.two .field{ margin:0; }
  .cinfo{ display:flex; flex-direction:column; gap:16px; }
  .cinfo-card{ display:flex; gap:15px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:20px; }
  .cinfo-card .ci{ width:46px; height:46px; border-radius:12px; background:var(--cg); color:#fff; display:grid; place-items:center; flex-shrink:0; box-shadow:0 10px 20px -8px var(--cshadow); }
  .cinfo-card .ci svg{ width:22px; height:22px; }
  .cinfo-card .cl{ font-size:12.5px; color:var(--muted); }
  .cinfo-card .cv{ font-family:var(--disp); font-weight:600; font-size:15.5px; margin-top:3px; }
  .form-ok{ display:none; background:var(--tint-emerald); border:1px solid color-mix(in srgb,var(--emerald) 30%,transparent); color:var(--emerald-d,var(--emerald)); border-radius:12px; padding:14px 16px; font-size:14.5px; font-weight:560; margin-bottom:18px; }
  .form-ok.show{ display:flex; gap:10px; align-items:center; }
  @media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; gap:30px; } }

  /* SEO FAQ */
  .faq-seo{ display:grid; grid-template-columns:1fr 1fr; gap:0 44px; margin-top:28px; border-bottom:1px solid var(--line); }
  .fq{ border-top:1px solid var(--line); }
  .fq summary{ list-style:none; cursor:pointer; padding:12px 2px; font-family:var(--disp); font-weight:600; font-size:14.5px; line-height:1.35; color:var(--ink); display:flex; align-items:center; justify-content:space-between; gap:14px; }
  .fq summary::-webkit-details-marker{ display:none; }
  .fq summary .pm{ width:21px; height:21px; border-radius:6px; background:var(--tint-blue); color:var(--blue); display:grid; place-items:center; flex-shrink:0; transition:transform .2s; }
  .fq[open] summary .pm{ transform:rotate(45deg); }
  .fq summary .pm svg{ width:12px; height:12px; }
  .fq .a{ padding:0 2px 13px; font-size:13.5px; color:var(--ink-2); line-height:1.5; }
  @media (max-width:760px){ .faq-seo{ grid-template-columns:1fr; gap:0; } }

  /* footer social + whatsapp float */
  .foot-social{ display:flex; gap:10px; margin-top:16px; }
  .foot-social a{ width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); display:grid; place-items:center; color:rgba(233,240,248,.82); transition:background .15s, color .15s, transform .15s, border-color .15s; }
  .foot-social a:hover{ background:var(--grad-brand); color:#fff; transform:translateY(-2px); border-color:transparent; }
  .foot-social a svg{ width:18px; height:18px; }
  .wa-float{ position:fixed; right:20px; bottom:20px; z-index:80; width:58px; height:58px; border-radius:50%; background:#25D366; display:grid; place-items:center; box-shadow:0 12px 28px -8px rgba(37,211,102,.6); transition:transform .18s; }
  .wa-float:hover{ transform:scale(1.08); }
  .wa-float svg{ width:32px; height:32px; color:#fff; }
  @media (prefers-reduced-motion:no-preference){ .wa-float::after{ content:""; position:absolute; inset:0; border-radius:50%; box-shadow:0 0 0 0 rgba(37,211,102,.5); animation:waPulse 2.4s infinite; } }
  @keyframes waPulse{ 70%{ box-shadow:0 0 0 14px rgba(37,211,102,0); } 100%{ box-shadow:0 0 0 0 rgba(37,211,102,0); } }

  .util-social{ display:flex; align-items:center; gap:16px; }
  .util-social a{ color:rgba(255,255,255,.92); display:inline-flex; align-items:center; transition:color .15s, transform .15s; }
  .util-social a:hover{ color:#fff; transform:translateY(-1px); }
  .util-social a svg{ width:17px; height:17px; }
  .foot-bot a{ color:inherit; text-decoration:underline; text-underline-offset:3px; }
  .foot-bot a:hover{ color:#fff; }

  /* LEGAL / PRIVACY */
  .legal{ max-width:820px; margin:0 auto; }
  .legal .updated{ display:inline-block; font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:var(--blue); background:var(--tint-blue); padding:7px 13px; border-radius:100px; margin-bottom:26px; }
  .legal .lead{ font-size:17px; color:var(--ink-2); margin-bottom:8px; }
  .legal h2{ font-size:20px; margin:32px 0 12px; scroll-margin-top:90px; }
  .legal h2 .n{ color:var(--blue); font-family:var(--mono); font-size:14px; margin-right:8px; }
  .legal p{ color:var(--ink-2); margin-bottom:14px; font-size:15.5px; line-height:1.7; }
  .legal strong{ color:var(--ink); font-weight:600; }
  .legal a{ color:var(--blue); }
  .legal ul{ color:var(--ink-2); margin:0 0 16px; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:9px; }
  .legal ul li{ position:relative; padding-left:24px; line-height:1.6; font-size:15.5px; }
  .legal ul li::before{ content:""; position:absolute; left:4px; top:9px; width:7px; height:7px; border-radius:2px; background:var(--grad-brand); }
  .legal .note{ border-left:4px solid var(--blue); background:var(--tint-blue); border-radius:0 12px 12px 0; padding:16px 18px; font-size:14.5px; color:var(--ink-2); margin:22px 0; }

  :focus-visible{ outline:2px solid var(--blue); outline-offset:2px; border-radius:5px; }
  @media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; scroll-behavior:auto; } }