/* Premium Site Design — Benjamin Tischlak Website
   Nur globale Elemente: Nav, Footer, Buttons, Design-Tokens.
   Seiten-spezifische Hero/CTA-Overrides bleiben in index.html inline. */

/* === DESIGN TOKENS v2 — Deep Navy + Warmweiß + Messing ========= */
:root {
  /* Marke: Deep Navy */
  --brand:       #0E1B2C;
  --brand-dark:  #081320;
  --brand-mid:   #1D3450;
  --brand-light: #E8EDF4;

  /* Akzent: Messing/Gold — --gold nur dekorativ, --gold-deep für Text auf hellem Grund */
  --gold:        #C9A84C;
  --gold-soft:   #D9C07A;
  --gold-deep:   #8F6B2A;
  --star:        #E0A93E;

  /* Flächen: Warmweiß */
  --white:   #ffffff;
  --paper:   #FAF8F3;
  --paper-2: #F2EFE7;
  --line:    #E6E2D8;

  /* Text */
  --ink:     #10151C;
  --muted:   #5B6470;

  /* Reduzierte Grauskala */
  --gray-50:  #F6F4EE;
  --gray-100: #ECE9E1;
  --gray-300: #C7C3B8;
  --gray-700: #39414C;

  /* Legacy-Aliasse — halten bestehende var(--green…)-Referenzen funktionsfähig */
  --green: var(--brand);
  --green-dark: var(--brand-dark);
  --green-mid: var(--brand-mid);
  --green-light: var(--brand-light);
  --mint: var(--gold-soft);
  --yellow: var(--star);
  --gray-200: var(--gray-100);
  --gray-500: var(--muted);
  --gray-900: var(--ink);

  /* Einheitliche Skalen */
  --radius-sm: 8px;
  --radius: 14px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(14,27,44,.06);
  --shadow-md: 0 8px 24px rgba(14,27,44,.10);
  --shadow-lg: 0 20px 48px rgba(14,27,44,.16);
  --space-section: clamp(56px, 8vw, 96px);
  --fs-h1: clamp(34px, 4.6vw, 54px);
  --fs-h2: clamp(26px, 3.4vw, 40px);
  --fs-h3: 18px;
  --fs-body: 16px;
  --fs-small: 14px;
  --fs-tiny: 13px;
}

body {
  text-rendering: optimizeLegibility;
}

/* === NAVIGATION ================================================= */
#site-nav {
  height: 72px;
  padding: 0 clamp(18px, 4vw, 44px);
  background: rgba(250,248,243,0.95);
  border-bottom: 1px solid rgba(16,20,22,0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

#site-nav .nav-logo {
  color: var(--ink);
  font-size: 18px;
  letter-spacing: -0.02em;
}

#site-nav .nav-link {
  color: var(--muted);
  border-radius: 999px;
  padding: 8px 12px;
  transition: background 0.15s, color 0.15s;
}

#site-nav .nav-link:hover,
#site-nav .nav-link.active {
  background: rgba(14,27,44,0.06);
  color: var(--green);
}

#site-nav .nav-cta {
  padding: 12px 20px;
  border-radius: 999px !important;
  box-shadow: 0 12px 30px rgba(14,27,44,0.14);
}

#site-nav .nav-cta-dropdown {
  border-radius: 999px !important;
}

/* === BUTTONS (global rounding only) ============================ */
.cro-float-btn,
.cro-sticky-btn,
.cro-exit-submit {
  border-radius: 999px !important;
}

/* === FOOTER ==================================================== */
footer {
  background: var(--ink);
  padding: 40px clamp(18px, 4vw, 56px);
}

div[role="note"][aria-label="Seiteninformation"] {
  background: var(--ink);
  color: rgba(255,255,255,0.5) !important;
}

/* === NAV MOBILE ================================================= */
@media (max-width: 900px) {
  #site-nav {
    height: 64px;
  }

  #site-nav .nav-links {
    top: 64px;
    background: rgba(250,248,243,0.98);
  }
}