:root{
    --navy:#01193F; --navy2:#0a2a5e; --teal:#01B094; --blue:#186EE3; --purple:#8A23D0;
    --lime:#92D32A; --magenta:#c81e8a; --ink:#17233a; --slate:#5a6a82; --dim:#8595ab;
    --line:#e6ecf4; --bg:#ffffff; --soft:#f4f8fc; --mint:#eafaf6;
    --grad:linear-gradient(90deg,#01B094,#186EE3 55%,#8A23D0);
    --shadow:0 18px 44px rgba(6,26,63,0.10); --shadow-sm:0 6px 18px rgba(6,26,63,0.07);
    --shadow-lg:0 30px 70px rgba(6,26,63,0.16);
  }
  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{ font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif; color:var(--ink); background:var(--bg); line-height:1.6; -webkit-font-smoothing:antialiased; }
  h1,h2,h3,h4{ font-family:"Poppins",sans-serif; color:var(--navy); line-height:1.14; letter-spacing:-0.4px; }
  a{ color:inherit; text-decoration:none; }
  .wrap{ max-width:1160px; margin:0 auto; padding:0 24px; }
  .grad-text{ background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .eyebrow{ font-family:"Poppins"; font-weight:700; font-size:12px; letter-spacing:2.5px; text-transform:uppercase; color:var(--teal); }
  .btn{ display:inline-flex; align-items:center; gap:9px; font-family:"Poppins"; font-weight:600; font-size:15px; padding:15px 26px; border-radius:12px; border:1.5px solid transparent; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease; }
  .btn.primary{ background:var(--grad); color:#fff; box-shadow:0 10px 24px rgba(24,110,227,0.3); }
  .btn.primary:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(24,110,227,0.4); }
  .btn.ghost{ background:#fff; color:var(--navy); border-color:var(--line); }
  .btn.ghost:hover{ border-color:var(--teal); color:var(--teal); }
  .btn.sm{ padding:10px 18px; font-size:14px; }
  .section{ padding:76px 0; }
  .center{ text-align:center; }
  h2.big{ font-size:38px; font-weight:800; }
  .sub{ font-size:18px; color:var(--slate); max-width:740px; }
  .center .sub{ margin:14px auto 0; }
  .textlink{ font-family:"Poppins"; font-weight:600; font-size:14.5px; color:var(--blue); display:inline-flex; align-items:center; gap:6px; }
  .textlink:hover{ gap:10px; }

  header{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.92); backdrop-filter:saturate(160%) blur(10px); border-bottom:1px solid var(--line); }
  .nav{ display:flex; align-items:center; justify-content:space-between; height:66px; }
  .nav .hlogo{ height:32px; }
  .navlinks{ display:flex; gap:24px; }
  .navlinks a{ font-size:14.5px; font-weight:500; color:var(--slate); }
  .navlinks a:hover{ color:var(--navy); }
  .nav .cta{ display:flex; align-items:center; gap:12px; }
  @media(max-width:960px){ .navlinks{ display:none; } }

  .hero{ position:relative; overflow:hidden; text-align:center; background:
      radial-gradient(50% 55% at 50% -8%, rgba(1,176,148,0.12), transparent 62%),
      radial-gradient(40% 50% at 90% 8%, rgba(138,35,208,0.08), transparent 60%),
      radial-gradient(40% 50% at 8% 12%, rgba(24,110,227,0.07), transparent 60%),
      linear-gradient(180deg,#fbfdff,#ffffff); }
  .hero .wrap{ padding-top:46px; padding-bottom:20px; }
  .herologo{ width:460px; max-width:84%; height:auto; margin:0 auto 28px; display:block; }
  .hero h1{ font-size:52px; font-weight:800; margin:14px auto 18px; max-width:900px; }
  .hero p.lede{ font-size:20px; color:var(--slate); max-width:720px; margin:0 auto; }
  .hero .ctarow{ display:flex; gap:14px; justify-content:center; margin-top:28px; flex-wrap:wrap; }
  .urgency{ margin-top:18px; font-family:"Poppins"; font-weight:600; font-size:14px; color:var(--navy); display:flex; gap:10px 18px; justify-content:center; flex-wrap:wrap; }
  .urgency span{ display:inline-flex; align-items:center; gap:7px; }
  .urgency .d{ width:7px; height:7px; border-radius:50%; }
  .heroshot{ margin:40px auto 0; max-width:1000px; }
  @media(max-width:960px){ .hero h1{ font-size:36px; } }

  .browser{ background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-lg); overflow:hidden; }
  .browser .bar{ height:38px; background:var(--soft); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:6px; padding:0 14px; }
  .browser .bar i{ width:10px; height:10px; border-radius:50%; background:#d3dae6; display:inline-block; }
  .browser .bar .url{ margin-left:12px; font-size:11px; color:var(--dim); background:#fff; border:1px solid var(--line); border-radius:6px; padding:3px 12px; }
  .browser img{ width:100%; display:block; }

  .partners{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }
  .partners .wrap{ padding:20px 24px; display:flex; align-items:center; gap:16px 26px; flex-wrap:wrap; justify-content:center; }
  .partners .lab{ font-size:12px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--dim); }
  .partners .p{ font-family:"Poppins"; font-weight:600; font-size:14px; color:var(--navy); opacity:.85; }

  .grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  @media(max-width:820px){ .grid3{ grid-template-columns:1fr; } }
  .acard{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px; box-shadow:var(--shadow-sm); }
  .acard .ic{ width:48px; height:48px; border-radius:13px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
  .acard h3{ font-size:19px; margin-bottom:8px; }
  .acard p{ font-size:14.5px; color:var(--slate); }

  .statsband{ background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .stats4{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
  @media(max-width:820px){ .stats4{ grid-template-columns:repeat(2,1fr); } }
  .stat .n{ font-family:"Poppins"; font-weight:800; font-size:30px; }
  .stat .n.grad{ background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .stat .l{ font-size:13px; color:var(--slate); margin-top:4px; }

  .quote{ border-left:4px solid var(--teal); background:var(--mint); border-radius:0 14px 14px 0; padding:18px 22px; font-family:"Poppins"; font-weight:500; font-style:italic; color:var(--navy); font-size:17px; }

  .journey{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:36px; }
  @media(max-width:820px){ .journey{ grid-template-columns:1fr 1fr; gap:20px; } }
  .js{ position:relative; padding:0 16px; }
  .js:not(:last-child)::after{ content:""; position:absolute; top:19px; height:2px; background:linear-gradient(90deg,var(--teal),var(--blue)); left:56px; right:-2px; }
  .js .dot{ width:40px; height:40px; border-radius:50%; background:#fff; border:2px solid var(--teal); color:var(--navy); font-family:"Poppins"; font-weight:800; display:flex; align-items:center; justify-content:center; margin-bottom:12px; position:relative; z-index:2; }
  .js h4{ font-size:15px; margin-bottom:5px; } .js p{ font-size:13px; color:var(--slate); }

  .case{ background:radial-gradient(80% 120% at 0% 0%, #0a2a5e, #01193F 60%); border-radius:24px; padding:44px; color:#dfe8f5; box-shadow:var(--shadow-lg); }
  .case .eyebrow{ color:var(--lime); }
  .case h2{ color:#fff; font-size:32px; font-weight:800; margin:8px 0 6px; }
  .casegrid{ display:grid; grid-template-columns:1.25fr 0.75fr; gap:36px; margin-top:22px; }
  @media(max-width:820px){ .casegrid{ grid-template-columns:1fr; } }
  .case p{ color:#c6d5ec; font-size:15px; margin-bottom:12px; }
  .case .then,.case .now{ padding-left:14px; margin-bottom:16px; }
  .case .then{ border-left:3px solid var(--magenta); } .case .now{ border-left:3px solid var(--teal); margin-bottom:0; }
  .case .then .h,.case .now .h{ font-family:"Poppins"; font-weight:700; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:5px; }
  .case .then .h{ color:#ff8fb0; } .case .now .h{ color:#5fe0c4; }
  .caseout{ background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); border-radius:16px; padding:20px 22px; }
  .caseout .o{ display:flex; align-items:baseline; gap:10px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.1); }
  .caseout .o:last-child{ border-bottom:none; }
  .caseout .on{ font-family:"Poppins"; font-weight:800; font-size:21px; color:#fff; flex:0 0 auto; min-width:64px; }
  .caseout .ol{ font-size:12.5px; color:#a9bcd8; }
  .caseq{ font-family:"Poppins"; font-weight:500; font-style:italic; font-size:19px; color:#fff; margin-top:18px; }
  .caselabel{ font-size:11px; color:#7f93b4; margin-top:12px; }

  .feat{ display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center; }
  .feat.rev .visual{ order:2; }
  @media(max-width:900px){ .feat{ grid-template-columns:1fr; gap:28px; } .feat.rev .visual{ order:0; } }
  .featlist{ list-style:none; margin-top:16px; }
  .featlist li{ display:flex; gap:12px; margin-bottom:13px; }
  .featlist .ci{ flex:0 0 26px; width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center; margin-top:2px; }
  .featlist .tt{ font-family:"Poppins"; font-weight:600; font-size:15px; color:var(--navy); }
  .featlist .dd{ font-size:14px; color:var(--slate); }
  .tagpill{ display:inline-block; font-family:"Poppins"; font-weight:700; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--teal); background:var(--mint); border-radius:20px; padding:5px 12px; margin-bottom:12px; }

  .panelcard{ background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); padding:22px; }
  .safebox{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
  @media(max-width:700px){ .safebox{ grid-template-columns:1fr; } }
  .sb{ border:1px solid var(--line); border-radius:12px; padding:15px; background:#fff; }
  .sb .h{ font-family:"Poppins"; font-weight:600; font-size:14px; color:var(--navy); }
  .sb p{ font-size:12.5px; color:var(--slate); margin-top:6px; }

  .circlewrap{ position:relative; height:340px; display:flex; align-items:center; justify-content:center; }
  .cnode{ position:absolute; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-sm); border-radius:12px; padding:9px 13px; font-size:12.5px; font-weight:600; color:var(--navy); display:flex; align-items:center; gap:7px; }
  .cnode .d{ width:9px; height:9px; border-radius:50%; }
  .ccenter{ width:124px; height:124px; border-radius:50%; background:var(--grad); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; box-shadow:0 14px 34px rgba(24,110,227,0.35); z-index:3; }
  .ccenter .t{ font-family:"Poppins"; font-weight:800; font-size:15px; } .ccenter .s{ font-size:10px; opacity:.9; }

  .caseaction{ background:radial-gradient(90% 130% at 100% 0%, #0a2a5e, #01193F 62%); color:#fff; }
  .caseaction .eyebrow{ color:var(--lime); } .caseaction h2{ color:#fff; }
  .cba{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:36px; }
  @media(max-width:820px){ .cba{ grid-template-columns:repeat(2,1fr); gap:26px 0; } }
  .cba .c{ padding:0 22px; border-left:1px solid rgba(255,255,255,0.14); }
  .cba .c:first-child{ border-left:none; }
  @media(max-width:820px){ .cba .c:nth-child(odd){ border-left:none; } }
  .cba .cn{ font-family:"Poppins"; font-weight:800; font-size:32px; background:linear-gradient(90deg,#5fe0c4,#7fb6ff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .cba .cl{ font-size:13px; color:#c6d5ec; margin-top:8px; line-height:1.45; }
  .cba .cs{ font-size:10.5px; color:#7f93b4; margin-top:6px; }

  .dark{ background:radial-gradient(80% 120% at 100% 0%, #0a2a5e 0%, #01193F 60%); color:#dfe8f5; }
  .dark h2{ color:#fff; } .dark .eyebrow{ color:var(--lime); }
  .secgrid{ display:grid; grid-template-columns:repeat(5,1fr); gap:22px; margin-top:34px; }
  @media(max-width:900px){ .secgrid{ grid-template-columns:repeat(2,1fr); } }
  .secitem{ border-top:2px solid; padding-top:12px; }
  .secitem h4{ color:#fff; font-size:14px; margin-bottom:6px; } .secitem p{ font-size:12.5px; color:#a9bcd8; }

  .finalcta{ background:var(--grad); border-radius:26px; padding:56px; text-align:center; color:#fff; box-shadow:0 24px 60px rgba(24,110,227,0.3); }
  .finalcta h2{ color:#fff; font-size:36px; font-weight:800; }
  .finalcta p{ font-size:18px; opacity:.96; max-width:660px; margin:14px auto 0; }
  .finalcta .row{ display:flex; gap:14px; justify-content:center; margin-top:26px; flex-wrap:wrap; }
  .finalcta .contact{ margin-top:20px; font-size:14.5px; opacity:.95; }

  footer{ background:var(--navy); color:#9fb3d1; padding:46px 0 26px; }
  footer .ft{ display:flex; justify-content:space-between; gap:36px; flex-wrap:wrap; }
  footer .flogo{ height:42px; display:block; }
  footer .tag{ font-size:12.5px; color:#7f93b4; margin-top:14px; max-width:320px; }
  footer .cols{ display:flex; gap:54px; flex-wrap:wrap; }
  footer .col h5{ font-family:"Poppins"; color:#fff; font-size:13px; margin-bottom:10px; }
  footer .col a{ display:block; margin-bottom:7px; color:#9fb3d1; font-size:13.5px; }
  footer .base{ border-top:1px solid rgba(255,255,255,0.12); margin-top:30px; padding-top:18px; font-size:12px; color:#7f93b4; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
  .pill{ display:inline-block; font-size:12px; font-weight:600; color:var(--navy); background:#fff; border:1px solid var(--line); border-radius:20px; padding:5px 13px; }
