/* Grundlagen */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #050507; -webkit-font-smoothing: antialiased; }
a { color: #F2EFE8; text-decoration: none; transition: color .15s ease, filter .15s ease, transform .15s ease; }
a:hover { color: #FFFFFF; }
a:focus-visible, button:focus-visible { outline: 2px solid #F5B544; outline-offset: 3px; }
img { max-width: 100%; }
section[id] { scroll-margin-top: 24px; }

.nav-links a:hover { background: rgba(255,255,255,0.08); }

/* Menü-Button nur mobil */
.menu-toggle {
  display: none; width: 44px; height: 44px; padding: 0; border-radius: 999px; cursor: pointer;
  align-items: center; justify-content: center;
  background: linear-gradient(160deg, #1B1A21 0%, #0D0D11 42%, #070709 100%);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), inset 0 0 0 1px rgba(255,255,255,0.02);
}

@media (max-width: 720px) {
  body > div { font-size: 17px !important; }

  /* Seitenränder wie im Mobil-Entwurf */
  nav[style], section[style*="max-width: 1280px"], main[style], footer > div,
  section[style] > div[style*="max-width: 1280px"] {
    padding-left: 20px !important; padding-right: 20px !important;
  }
  nav[style] { padding-top: 14px !important; padding-bottom: 14px !important; flex-wrap: nowrap !important; position: relative; }
  nav[style] > a { font-size: 19px !important; }

  .menu-toggle { display: flex; }
  .nav-links {
    display: none !important; position: absolute; top: calc(100% - 4px); left: 20px; right: 20px;
    flex-direction: column; align-items: stretch !important; border-radius: 24px !important; padding: 8px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), 0 30px 60px rgba(0,0,0,0.7) !important;
  }
  .nav-links.open { display: flex !important; }
  .nav-links a { padding: 12px 18px !important; font-size: 17px !important; border-radius: 16px !important; }

  /* Typografie */
  h1[style] { font-size: clamp(44px, 14vw, 80px) !important; }
  [style*="clamp(44px, 7vw, 108px)"] { font-size: 10vw !important; }

  /* Raster einspaltig */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  [style*="flex: 1 1 460px"], [style*="flex: 1 1 360px"],
  [style*="flex: 1 1 480px"], [style*="flex: 1.3 1 560px"] { flex-basis: 100% !important; }

  /* Karten kompakter */
  [style*="padding: 48px"], [style*="padding: 40px;"], [style*="padding: 36px"] { padding: 24px !important; }
  [style*="padding: 56px 48px"], [style*="padding: 80px 64px"], [style*="padding: 96px 64px"] { padding: 40px 24px !important; }
  [style*="border-radius: 32px"], [style*="border-radius: 36px"], [style*="border-radius: 40px"] { border-radius: 28px !important; }
  [style*="min-height: 620px"] { min-height: 460px !important; }
  [style*="min-height: 620px"] > div:nth-of-type(2) > div { display: none !important; }
  [style*="min-height: 620px"] > div:nth-of-type(2) { justify-content: flex-end !important; }
  [style*="min-height: 620px"] span[style*="min-height: 52px"] { display: none !important; }
  [style*="min-height: 620px"] [style*="font-size: 72px"] { font-size: 44px !important; }
  [style*="min-height: 620px"] [style*="font-size: 20px"] { font-size: 16px !important; }
  [style*="min-height: 620px"] > img { width: 190px !important; height: 190px !important; margin: -95px 0 0 -95px !important; top: 40% !important; }
  [style*="min-height: 640px"], [style*="min-height: 600px"] { min-height: 420px !important; }
  [style*="min-height: 640px"] > img { width: 200px !important; height: 200px !important; }
  [style*="min-height: 600px"] > p { left: 24px !important; right: 24px !important; bottom: 24px !important; font-size: 18px !important; }
  [style*="width: 112px; height: 112px"] { width: 72px !important; height: 72px !important; }

  /* Buttons im Hero volle Breite */
  section > div > div[style*="gap: 14px"] { width: 100%; flex-direction: column; }
  section > div > div[style*="gap: 14px"] > a { justify-content: center; }

  /* Großzügige Abstände etwas reduzieren */
  [style*="padding: 136px 40px"], [style*="padding: 144px 40px"] { padding-top: 88px !important; padding-bottom: 88px !important; }
  [style*="padding: 0 40px 136px"] { padding-bottom: 88px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  a { transition: none; }
}