
  /* ===== HERO ===== */
  .hero{padding:150px 0 90px;background:radial-gradient(700px 500px at 88% -8%, rgba(0,142,203,0.16), transparent 60%),radial-gradient(600px 500px at -6% 30%, rgba(255,206,7,0.14), transparent 60%),var(--off-white);overflow:hidden;}
  .hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;}
  .hero__copy h1{font-size:clamp(32px,4.6vw,52px);font-weight:800;margin-top:18px;letter-spacing:-0.01em;}
  .hero__copy h1 .hl{color:var(--blue-primary);position:relative;display:inline-block;}
  .hero__copy h1 .hl::after{content:'';position:absolute;left:-2px;right:-2px;bottom:6px;height:10px;background:var(--yellow);z-index:-1;border-radius:4px;transform:scaleX(0);transform-origin:left;animation:underline 1s var(--ease) .9s forwards;}
  @keyframes underline{to{transform:scaleX(1);}}
  .hero__copy p.sub{font-size:17.5px;color:var(--gray-dark);max-width:480px;margin-top:20px;line-height:1.65;}
  .hero__ctas{display:flex;gap:16px;margin-top:32px;flex-wrap:wrap;}
  .trust-strip{margin-top:38px;}
  .trust-strip .label{font-family:var(--font-ui);font-weight:700;font-size:12px;letter-spacing:.08em;color:var(--gray-dark);text-transform:uppercase;}
  .chip-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px;}
  .chip{font-family:var(--font-ui);font-size:14px;font-weight:600;color:var(--navy-deep);background:#fff;border:1px solid rgba(9,76,161,0.15);padding:8px 18px;border-radius:999px;}

  /* dashboard device mockup */
  .hero__visual{position:relative;display:flex;justify-content:center;}
  .blob{position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle at 35% 30%, rgba(9,76,161,0.35), transparent 70%);filter:blur(10px);top:-40px;right:-40px;z-index:0;animation:float 9s ease-in-out infinite;}
  @keyframes float{0%,100%{transform:translate(0,0);}50%{transform:translate(-14px,18px);}}
  .dash{position:relative;z-index:2;width:440px;background:#fff;border-radius:20px;box-shadow:var(--shadow-soft);overflow:hidden;animation:dashIn 1s var(--ease) both;}
  @keyframes dashIn{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
  .dash__bar{background:var(--navy-deep);padding:12px 16px;display:flex;align-items:center;gap:8px;}
  .dash__bar .dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,0.25);}
  .dash__bar .dot:first-child{background:#ff6b6b;}
  .dash__bar .dot:nth-child(2){background:var(--yellow);}
  .dash__bar .dot:nth-child(3){background:#5ee27a;}
  .dash__bar span{margin-left:8px;font-family:var(--font-ui);font-size:12px;color:rgba(255,255,255,0.6);}
  .dash__head{padding:16px 20px 0;display:flex;align-items:center;justify-content:space-between;}
  .dash__head b{font-family:var(--font-display);font-size:15px;color:var(--navy-deep);}
  .dash__live{display:flex;align-items:center;gap:6px;font-family:var(--font-ui);font-size:11.5px;font-weight:700;color:#1a9c53;}
  .dash__live::before{content:'';width:7px;height:7px;border-radius:50%;background:#1a9c53;animation:pulseDot 1.6s infinite;}
  @keyframes pulseDot{0%,100%{opacity:1;}50%{opacity:.3;}}
  .dash__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 20px;}
  .dash__stat{background:var(--tint);border-radius:12px;padding:12px;}
  .dash__stat b{display:block;font-family:var(--font-display);font-size:19px;color:var(--blue-primary);}
  .dash__stat span{font-family:var(--font-ui);font-size:10.5px;color:var(--gray-dark);}
  .dash__feed{padding:4px 20px 20px;height:150px;overflow:hidden;position:relative;}
  .feed-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed var(--gray-light);opacity:0;transform:translateY(-8px);transition:opacity .4s var(--ease), transform .4s var(--ease);}
  .feed-row.show{opacity:1;transform:translateY(0);}
  .feed-row .ic{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .feed-row.in .ic{background:rgba(26,156,83,0.12);color:#1a9c53;}
  .feed-row.out .ic{background:rgba(9,76,161,0.1);color:var(--blue-primary);}
  .feed-row .ic svg{width:13px;height:13px;}
  .feed-row .txt{font-family:var(--font-ui);font-size:12.5px;color:var(--ink);flex:1;}
  .feed-row .txt b{color:var(--navy-deep);}
  .feed-row .time{font-family:var(--font-ui);font-size:11px;color:var(--gray-dark);}
  .floating-badge{position:absolute;bottom:14px;left:-30px;z-index:4;background:#fff;border-radius:16px;padding:10px 16px;box-shadow:var(--shadow-card);display:flex;align-items:center;gap:10px;animation:pulseBadge 3s ease-in-out infinite;}
  @keyframes pulseBadge{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
  .floating-badge .ic{width:36px;height:36px;background:var(--tint);border-radius:10px;display:flex;align-items:center;justify-content:center;}
  .floating-badge .ic svg{width:19px;height:19px;color:var(--blue-primary);}
  .floating-badge .txt b{display:block;font-size:13.5px;color:var(--navy-deep);font-family:var(--font-ui);}
  .floating-badge .txt span{font-size:11px;color:var(--gray-dark);font-family:var(--font-ui);}

    /* ===================== RESPONSIVE ===================== */

  @media (max-width:1024px){
    .nav__links{display:none;}
    .burger{display:flex;}
    .hero__grid{grid-template-columns:1fr;text-align:center;}
    .hero__copy p.sub{margin-left:auto;margin-right:auto;}
    .checklist{margin-left:auto;margin-right:auto;}
    .hero__ctas{justify-content:center;}
    .trust-strip .chip-row{justify-content:center;}
    .hero__visual{margin-top:50px;}
    .stats__grid{grid-template-columns:repeat(2,1fr);gap:28px 20px;}
    .stat:nth-child(2){border-right:none;}
    .flow__row{grid-template-columns:repeat(3,1fr);gap:24px 0;}
    .flow__progress{display:none;}
    .flow__label{flex-direction:column;align-items:flex-start;}
    .flow__preview{width:100%;max-width:none;}
    .how-stage{grid-template-columns:1fr;}
    .scene{max-width:420px;margin:0 auto;}
    .benefit-grid{grid-template-columns:repeat(2,1fr);}
    .loc-grid{grid-template-columns:repeat(3,1fr);}
    .footer__grid{grid-template-columns:1fr 1fr;}
    .t-arrow{display:none;}
  }
  @media (max-width:640px){
    .hero{padding:120px 0 60px;}
    .checklist{grid-template-columns:1fr;}
    .stats__grid{grid-template-columns:repeat(2,1fr);}
    .flow__row{grid-template-columns:1fr 1fr;}
    .how-tabs{gap:8px;}
    .how-tab{padding:10px 16px;font-size:13px;flex:1;justify-content:center;}
    .benefit-grid{grid-template-columns:1fr;}
    .loc-grid{grid-template-columns:repeat(2,1fr);}
    .footer__grid{grid-template-columns:1fr 1fr;}
    .footer__brand{grid-column:1/-1;}
    .cta-banner__inner{flex-direction:column;text-align:center;}
    .cta-banner__actions{flex-direction:column;}
    .phone{width:250px;height:512px;}
    .sticky-cta{display:block;}
    .hero__ctas .btn{width:100%;}
    .dash{width: 100%;}
    .floating-badge {left: -17px;}
  }