*, *::before, *::after { box-sizing: border-box; }
    body { margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; background:#fff; color:#111; min-height:100vh; display:flex; flex-direction:column; }
    .hero { text-align:center; padding:2.5rem 1rem 1rem; }
    .hero h1 { font-size:1.6rem; margin:0 0 .4rem; color:#1e40af; }
    .hero p { color:#555; font-size:.95rem; margin:0; }
    .stats { display:flex; justify-content:center; gap:.8rem; flex-wrap:wrap; padding:1rem 1.5rem; }
    .stat { background:#f8f8fa; border:1px solid #e5e7eb; border-radius:.6rem; padding:.7rem 1.2rem; text-align:center; min-width:90px; }
    .stat .num { font-size:1.4rem; font-weight:700; }
    .stat .label { color:#888; font-size:.75rem; margin-top:.15rem; }
    .cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1rem; max-width:900px; margin:0 auto; padding:0 1.5rem 2rem; }
    .card { background:#f8f8fa; border:1px solid #e5e7eb; border-radius:.7rem; padding:1.2rem; text-decoration:none; color:#111; transition:border-color .2s, box-shadow .2s; }
    .card:hover { border-color:#3b82f6; box-shadow:0 2px 8px rgba(59,130,246,.12); }
    .card h2 { margin:0 0 .3rem; font-size:1rem; display:flex; align-items:center; gap:.5rem; }
    .card .icon { width:30px; height:30px; border-radius:.4rem; display:flex; align-items:center; justify-content:center; font-size:.85rem; font-weight:700; flex-shrink:0; }
    .card p { margin:0; color:#666; font-size:.82rem; line-height:1.4; }
    .dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:.2rem; }
    .dot-ipv6 { background:#60a5fa; }
    .dot-dnssec { background:#a78bfa; }
    .dot-rpki { background:#4ade80; }
    .dot-spof { background:#f87171; }
    .dot-sec { background:#fbbf24; }
    .icon-bostadsbolag { background:#dbeafe; color:#3b82f6; }
    .icon-energibolag { background:#fef3c7; color:#f59e0b; }
    .icon-vattenbolag { background:#dbeafe; color:#0ea5e9; }
    .icon-renhallning { background:#dcfce7; color:#16a34a; }
    .nav { display:flex; justify-content:center; gap:.5rem; padding:.5rem 1rem 1.5rem; flex-wrap:wrap; }
    .btn { border:1px solid #ccc; background:#f0f0f2; color:#111; padding:.35rem .7rem; border-radius:.5rem; font-size:.82rem; text-decoration:none; }
    .btn:hover { border-color:#888; }
    .section { max-width:900px; margin:0 auto; padding:0 1.5rem; width:100%; }
    .section h2 { font-size:1rem; color:#666; border-bottom:1px solid #e5e7eb; padding-bottom:.4rem; margin:0 0 .8rem; }
    .dash-grid { display:grid; grid-template-columns:repeat(5, 1fr); gap:.5rem; margin-bottom:1.5rem; }
    .dash-link { display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:.6rem .4rem; border:1px solid #e5e7eb; border-radius:.5rem; text-decoration:none; color:#555; font-size:.75rem; font-weight:500; background:#fafafa; transition:border-color .2s; }
    .dash-link:hover { border-color:#3b82f6; color:#111; }
    .footer { border-top:1px solid #eee; margin-top:auto; padding:.8rem; text-align:center; font-size:.82rem; color:#888; }
    .footer a { color:#2563eb; text-decoration:none; }
    @media (max-width: 600px) {
      .hero { padding:1.5rem .8rem .8rem; }
      .hero h1 { font-size:1.3rem; }
      .cards { padding:0 .8rem 1.5rem; grid-template-columns:1fr; }
      .dash-grid { grid-template-columns:repeat(3, 1fr); }
    }