:root {
      --bg: #0b1220;
      --bg-soft: #121a2b;
      --text: #e7ecf4;
      --muted: #b6c2d9;
      --primary: #3b82f6;
      --accent: #22d3ee;
      --ok: #22c55e;
      --warn: #f59e0b;
      --danger: #ef4444;
      --card: #0f172a;
      --border: #1f2a44;
      --radius: 16px;
      --shadow: 0 10px 30px rgba(0,0,0,.35);
    }
    *{box-sizing:border-box}
    html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
    a{color:var(--text);text-decoration:none}
    .pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-soft);border:1px solid var(--border);border-radius:999px;font-size:12px;color:var(--muted)}
    .hero{padding:72px 0 24px}
    .hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px}
    .hero h1{font-size:44px;line-height:1.1;margin:0 0 12px}
    .hero p{color:var(--muted);font-size:18px;margin:0 0 24px}
    .card{background:linear-gradient(180deg, #0d1526, #0b1220);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
    .badges{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
    .badges .pill{border-color:#26314f}
    .media{aspect-ratio:16/10;background:radial-gradient(1200px 600px at 10% -10%, rgba(34,211,238,.2), transparent), linear-gradient(180deg,#0b1220,#0b1220);border:1px dashed #223052;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#7aa2ff}
    .k{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
    .k .card h3{margin:6px 0;font-size:18px}
    .k .card p{margin:0;color:var(--muted);font-size:14px}
    .section{padding:64px 0}
    .list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    .list .li{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--bg-soft)}
    .list .li h4{margin:0 0 8px}
    .cta{display:flex;gap:12px;flex-wrap:wrap}
    .foot{padding:24px 0;border-top:1px solid var(--border);color:var(--muted);font-size:14px}
    
    /* A11y helper */
    .sr-only{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

    /* Form layout */
    .form{padding:24px}
    .form-fieldset{margin:0;padding:0;border:0}
    .form-grid{
      display:grid;gap:16px;
      grid-template-columns:1fr 1fr;
    }
    .form-group{display:flex;flex-direction:column;gap:8px}
    .form-group--full{grid-column:1 / -1}
    .label{font-weight:600}
    .input{
      background:var(--bg-soft);
      border:1px solid var(--border);
      border-radius:12px;
      padding:12px 14px; color:var(--text);
      outline:none;
      font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    }
    .input:focus{border-color:var(--primary); box-shadow:0 0 0 3px rgba(59,130,246,.25)}
    .hint{font-size:12px;color:var(--muted)}
    .hp{position:absolute !important; left:-9999px !important; opacity:0 !important}
    .form-actions{margin-top:12px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
    .form-msg{color:var(--muted);font-size:14px}

    .captcha-group {
      display: flex;
      gap: 8px;
    }

    .captcha-image-group {
      display: flex;
      gap: 8px;
      justify-content: center;
      align-items: center;
    }

    .imgRefresh {
      display: flex;
      width: 24px;
      height: auto;
      cursor: pointer;
    }

    @media (max-width: 960px){
        .hero-grid{grid-template-columns:1fr}
        .k{grid-template-columns:1fr}
        .list{grid-template-columns:1fr}
        .form-grid{grid-template-columns:1fr}
        .captcha-group {
          flex-direction: column;
        }

      }