
    :root{
      --ink:#0b1320; --text:#2a3243; --muted:#6b7280;
      --brand:#0f3d7a; --brand2:#1f60b5; --ok:#10b981; --warn:#f59e0b;
      --line:#e6ebf3; --soft:#f8fbff; --bg:#ffffff;
    }
    *{box-sizing:border-box}
    body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.65}
    a{color:var(--brand);text-decoration:none}
    a:hover{text-decoration:underline}
    .hero{
      background:linear-gradient(120deg,var(--brand) 0%,var(--brand2) 70%);
      color:#fff; text-align:center; padding:clamp(40px,6vw,84px) 18px;
    }
    .hero h1{margin:0 0 10px;font-size:clamp(26px,4.6vw,42px);letter-spacing:.2px}
    .hero p{margin:0 auto;max-width:920px;font-size:clamp(15px,2.2vw,18px);opacity:.95}
    .cta-row{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
    .btn{display:inline-block;padding:12px 18px;border-radius:999px;font-weight:700;background:#fff;color:var(--ink);box-shadow:0 8px 18px rgba(0,0,0,.15)}
    .btn.alt{background:var(--ink);color:#fff}
    .wrap{max-width:1120px;margin:0 auto;padding:clamp(26px,4vw,46px) 18px}
    h2{font-size:clamp(22px,3.2vw,28px);margin:28px 0 10px;color:var(--ink)}
    h3{font-size:clamp(18px,2.6vw,22px);margin:16px 0 8px;color:var(--ink)}
    .kpis{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:-28px}
    .kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:0 10px 18px rgba(15,61,122,.07)}
    .kpi b{display:block;color:var(--brand);font-size:18px;margin:2px 0 6px}
    .grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
    .card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:0 8px 18px rgba(15,61,122,.06)}
    ul.check{list-style:none;padding:0;margin:0}
    ul.check li{padding-left:28px;position:relative;margin:10px 0}
    ul.check li:before{content:"✔";position:absolute;left:0;top:0;color:var(--ok);font-weight:800}
    .note{color:var(--muted);font-size:14px}
    .compare{width:100%;border-collapse:collapse;font-size:clamp(14px,2.2vw,16px)}
    .compare th,.compare td{border:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
    .compare thead th{background:var(--soft);color:var(--ink)}
    .ba{display:grid;gap:12px;grid-template-columns:1fr 1fr}
    .ba .ph{border:1px dashed #cdd7ea;background:#f6f8fd;height:220px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6b7280;font-size:14px}
    .info{background:#fefce8;border:1px solid #fde68a;color:#854d0e;border-radius:12px;padding:12px 14px;margin-top:10px}
    .toc{background:#f5f7fb;border:1px solid #e4e9f4;border-radius:12px;padding:14px}
    footer{background:var(--ink);color:#cbd5e1;text-align:center;padding:28px 18px;margin-top:26px}
    footer a{color:#fff;text-decoration:underline}
    @media(max-width:640px){.ba{grid-template-columns:1fr}}
  