:root{
      --bg:#0b0d10;          /* Anthrazit */
      --panel:#111418;       /* Paneel */
      --muted:#9aa4b2;       /* Sekundärtext */
      --text:#eef2f6;        /* Primärtext */
      --brand:#fbbf24;       /* Band-Gelb */
      --brand-2:#fde68a;     /* helles Gelb */
      --accent:#14b8a6;      /* Türkis Akzent */
      --border:#1a2028;      /* Rahmen */
      --radius:18px;
      --shadow:0 12px 34px rgba(0,0,0,.4);
      --container:1180px;
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{margin:0;font-family:Outfit,system-ui,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);background:radial-gradient(1200px 600px at 100% -10%, rgba(251,191,36,.12), transparent 60%), radial-gradient(900px 500px at -10% 0%, rgba(20,184,166,.10), transparent 60%), var(--bg);line-height:1.6}
    a{color:var(--brand-2);text-decoration:none}
    a:hover{opacity:.9}
    img{max-width:100%;display:block}
    .container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:22px}

    header{position:sticky;top:0;z-index:40;background:rgba(11,13,16,.7);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border)}
    .nav{display:flex;align-items:center;justify-content:space-between;height:68px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.5px}
    .logo{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:conic-gradient(from 180deg at 50% 50%, var(--brand), #f59e0b, var(--brand));color:#111;box-shadow:var(--shadow);font-weight:800}
    nav ul{list-style:none;display:flex;gap:22px;margin:0;padding:0}
    nav a{font-weight:600;opacity:.95}
    .mobile-menu{display:none}
    .burger{display:none;background:none;border:1px solid var(--border);border-radius:12px;color:var(--text);padding:8px 10px}
    @media (max-width:860px){nav ul{display:none}.burger{display:inline-flex}.mobile-menu{display:none;position:absolute;inset:68px 0 auto 0;background:rgba(11,13,16,.98);border-bottom:1px solid var(--border)}.mobile-menu.open{display:block}.mobile-menu a{display:block;padding:14px 20px;border-top:1px solid var(--border)}}

    .hero{display:grid;gap:26px;align-items:center;padding:64px 0 40px;grid-template-columns:1.2fr .8fr}
    .kicker{letter-spacing:.18em;text-transform:uppercase;color:var(--brand-2);font-size:.82rem}
    h1{font-size:clamp(34px,4.2vw,62px);line-height:1.08;margin:8px 0}
    .lead{color:var(--muted);max-width:62ch}
    .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
    .btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;border:1px solid var(--border);font-weight:700;cursor:pointer}
    .btn.primary{background:linear-gradient(135deg,var(--brand),#f59e0b);color:#111;border:0;box-shadow:var(--shadow)}
    .btn.ghost{background:transparent}

    .hero-card{background:linear-gradient(180deg, rgba(251,191,36,.10), rgba(20,184,166,.10));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
    .hero-media{aspect-ratio:4/3;display:grid;place-items:center;background:repeating-linear-gradient(45deg, #1f2937 0 16px, #111418 16px 32px)}
    .helmet{width:min(72%,420px)}
    .hero-caption{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;color:var(--muted)}

    @media (max-width:940px){.hero{grid-template-columns:1fr;padding-top:34px}}

    .status{display:grid;gap:16px;grid-template-columns:1fr 1fr}
    .panel{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px}
    .progress{height:12px;background:#0f1318;border:1px solid var(--border);border-radius:999px;overflow:hidden}
    .progress > span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),#f59e0b);width:25%}
    .countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
    .cd-item{background:#0f1318;border:1px solid var(--border);border-radius:12px;padding:10px;text-align:center}
    .cd-item strong{font-size:1.6rem;display:block}
    @media (max-width:680px){.status{grid-template-columns:1fr}.countdown{grid-template-columns:repeat(2,1fr)}}

    form{display:grid;gap:10px}
    .row{display:flex;gap:10px;flex-wrap:wrap}
    input,select,textarea{background:#0f1318;border:1px solid var(--border);border-radius:12px;padding:12px;color:var(--text);width:100%}
    input:focus,textarea:focus,select:focus{outline:2px solid rgba(251,191,36,.35)}
    .hint{font-size:.9rem;color:var(--muted)}
    .msg{font-size:.92rem;margin-top:6px}

    section{padding:44px 0}
    .section-title{font-size:clamp(24px,3.2vw,36px);margin:0 0 10px}
    .section-sub{color:var(--muted);margin-bottom:18px}

    .grid-3{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
    .card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:18px}
    .card h3{margin:0 0 6px;font-size:1.1rem}
    @media (max-width:980px){.grid-3{grid-template-columns:repeat(2,1fr)}}
    @media (max-width:640px){.grid-3{grid-template-columns:1fr}}

    .stripes{height:12px;background:repeating-linear-gradient(135deg, var(--brand) 0 18px, #111418 18px 36px)}

    footer{padding:28px 0 46px;border-top:1px solid var(--border);color:var(--muted)}
    .foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
    .chips{display:flex;gap:10px;flex-wrap:wrap}
    .chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid var(--border)}

    .cookie{position:fixed;z-index:50;inset:auto 14px 14px auto;max-width:380px;background:var(--panel);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:14px;display:none}
    .cookie.show{display:block}