:root {
      --bg: #0a0f1d;
      --card: rgba(255,255,255,0.05);
      --border: rgba(255,255,255,0.10);
      --text: #eef3ff;
      --muted: #b9c3df;
      --accent: #7c9cff;
      --accent2: #56e0b6;
      --max: 1180px;
      --radius: 22px;
      --shadow: 0 18px 60px rgba(0,0,0,0.35);
    }

    body {
      margin: 0;
      font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      padding-bottom: 120px;
      color: var(--text);
      line-height: 1.6;
    }

    .hero {
      padding: 82px 0 34px;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.05fr 0.95fr;
      gap: 26px;
      align-items: center;
    }

    .eyebrow {
      display: inline-block;
      padding: 8px 14px;
      border-radius: 999px;
      font-size: 0.92rem;
      margin-bottom: 16px;
    }

    h1 {
      margin: 0 0 14px;
      font-size: clamp(2.2rem, 5vw, 4.8rem);
      line-height: 1.02;
      letter-spacing: -0.04em;
    }

    .lead {
      margin: 0;
      max-width: 760px;
      color: var(--muted);
      font-size: clamp(1rem, 2vw, 1.13rem);
    }

    .panel, .card { padding: 22px; border-radius: var(--radius); }
    .hero-logo {
      max-width: 460px;
      width: 100%;
      margin: 25px 0 10px 0;
      opacity: 0.92;
    }

    @media (max-width: 980px) {
      .hero-grid { grid-template-columns: 1fr; }
    }