:root{
  /* Colors */
  --bg:#0b0f14;
  --bg-2:#12171e;
  --bg-3:#0f141a;
  --surface:#171d25;
  --text:#f3f5f7;
  --muted:#a7b0bb;

  /* Accents */
  --accent:#efb509;
  --accent-2:#cd7213;
  --brand-dark:#002c54;

  /* Lines / Shadow */
  --line:#243040;
  --line-soft:#1f2732;
  --shadow:0 10px 30px rgba(0,0,0,.35);

  /* Layout */
  --container:1200px;

  /* Breakpoints */
  --bp-xl:1200px;
  --bp-lg:1024px;
  --bp-md:900px;
  --bp-sm:720px;

  /* Hero heights */
  --hero-h-tall: 68vh;
  --hero-h-short: 30vh;
  --hero-h-micro: 10vh; /* interner Bereich */
}

/* ---------- Reset & Basics ---------- */
*{box-sizing:border-box}
html,body{
  margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:system-ui,Segoe UI,Roboto,Ubuntu,sans-serif;
  -webkit-text-size-adjust:100%;
}
img{max-width:100%;display:block}

a{color:var(--accent);text-decoration:none}
a:hover{opacity:.9}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px;
}

h1,h2,h3{margin:0 0 .6rem}
p{margin:0 0 1rem;color:var(--text)}

.container{max-width:var(--container);margin:0 auto;padding:0 1rem}
.section{padding:4rem 0}

/* ---------- Buttons (global) ---------- */
.btn{
  border:0; padding:.9rem 1.1rem; border-radius:.5rem;
  background:var(--accent); color:#111; font-weight:700; cursor:pointer; box-shadow:var(--shadow);
  transition:filter .15s ease, transform .1s ease;
}
.btn:hover{background:var(--accent-2)}
.btn:active{transform:translateY(1px)}
.btn--block{width:100%}

/* ---------- Utilities ---------- */
.is-hidden{display:none!important}
.text-muted{color:var(--muted)}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;clip:rect(0 0 0 0);overflow:hidden}

/* Generic card pattern used everywhere */
.card{
  background:var(--bg-3);
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:var(--shadow);
}

/* Generic grids */
.grid-2{display:grid;gap:24px;grid-template-columns:1fr 1fr}
.grid-3{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
@media (max-width: 1024px){ .grid-2{grid-template-columns:1fr} }
@media (max-width: 900px){ .grid-3{grid-template-columns:1fr} }

/* Lists */
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.checklist li{position:relative; padding-left:22px}
.checklist li::before{content:"✓"; position:absolute; left:0; top:0; color:var(--accent)}
.dotlist{ padding-left: 1.1rem; }
.dotlist li{ margin-bottom: .35rem; }

/* Motion preference */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}