:root{
      --ink:#0b1220;           /* deep navy for headings */
      --muted:#475569;         /* cool gray for body text */
      --bg:#f6f9ff;            /* soft clinic background */
      --card:#ffffff;          /* white cards */
      --brand:#0ea5e9;         /* medical blue */
      --accent:#82d1ff;        /* light accent */
      --ok:#10b981;            /* green for ROI */
      --shadow:0 18px 50px rgba(10,35,80,.10);
      --radius:16px;
    }
    *{box-sizing:border-box}
    body{margin:0;background:var(--bg);color:var(--muted);font:16px/1.7 "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial}
    h1,h2,h3{color:var(--ink);letter-spacing:.2px}
    a{color:var(--brand);text-decoration:none}
    a:hover{opacity:.9}
    img{max-width:100%;display:block}
    .wrap{max-width:1180px;margin:0 auto;padding:0 20px}

    /* HERO */
    header.hero{
      position:relative;overflow:hidden;isolation:isolate;
      background:linear-gradient(180deg,#ffffff, #eef7ff 70%);
    }
    .hero-grid{
      display:grid;gap:40px;align-items:center;
      grid-template-columns:1.15fr .85fr;
      padding:64px 20px 42px;
    }
    .badge{
      display:inline-flex;gap:10px;align-items:center;
      background:rgba(130,209,255,.25);
      color:#075985;padding:8px 14px;border-radius:999px;font-weight:600
    }
    .hero h1{font-size:44px;margin:14px 0 10px}
    .subtitle{font-size:18px;max-width:680px}

    /* CARDS / CONTENT */
    section.card{
      background:var(--card);border-radius:var(--radius);
      padding:34px 26px;margin:26px 0;box-shadow:var(--shadow)
    }
    .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
    .bullets{list-style:none;margin:0;padding:0}
    .bullets li{margin:10px 0 0 0;padding-left:28px;position:relative}
    .bullets li:before{
      content:"";position:absolute;left:0;top:.55em;width:16px;height:16px;border-radius:50%;
      background:radial-gradient(circle at 35% 35%, #fff 2px, var(--brand) 3px, #7dd3fc 100%);
      box-shadow:0 0 0 4px rgba(14,165,233,.12)
    }

    /* ROI TABLE */
    table{width:100%;border-collapse:collapse}
    th,td{padding:12px 10px;border-bottom:1px solid #eaf2fb}
    th{color:#0b1220;text-align:left;font-weight:700;background:linear-gradient(180deg,#fff,#f3f9ff)}
    .pos{color:var(--ok);font-weight:700}

    /* CTA BANNER */
    .cta{
      background:linear-gradient(90deg,#e0f2ff,#f7fbff);
      border:1px solid #dbeafe;border-radius:16px;padding:22px 20px;margin:30px 0;
      display:flex;gap:22px;align-items:center;justify-content:space-between;box-shadow:var(--shadow)
    }
    .cta .right{
      display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:560px;width:100%
    }
    .pill{
      background:var(--brand);color:#fff;text-align:center;padding:14px;border-radius:999px;font-weight:700;
      box-shadow:0 8px 24px rgba(14,165,233,.35)
    }
    .muted-pill{background:#e6f6ff;color:#075985;border-radius:999px;text-align:center;padding:14px;font-weight:600}

    /* QUOTES */
    .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .q{background:var(--card);border:1px solid #e6eef7;padding:18px;border-radius:14px;box-shadow:var(--shadow)}
    .q b{color:var(--ink)}

    /* RESPONSIVE */
    @media (max-width:1024px){
      .hero-grid{grid-template-columns:1fr}
      .grid-2{grid-template-columns:1fr}
      .quotes{grid-template-columns:1fr}
      .cta{flex-direction:column;align-items:flex-start}
      .cta .right{grid-template-columns:1fr}
      .hero h1{font-size:36px}
    }