/* Design-Tokens - Nordbahn.app */

/* DM Sans - lokal gehostet (Variable Font-Range) */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('../vendor/fonts/dm-sans/dm-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('../vendor/fonts/dm-sans/dm-sans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
                 U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Display-Schrift Variante 20: Literata (Variable Font, 400-700, Variable opsz)
   Aktuell aktiv. Charakter: warm-modern, Book-typografisch, edel.
   Gleiche Font-Familie fuer regular und italic - stimmiger als Kombinationen. */
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/literata/regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/literata/regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Literata';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/literata/italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Literata';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url('../vendor/fonts/literata/italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}

/* Reserve-Variante G: Young Serif (regular) + Prata (fuer italic)
   Liegt als Backup lokal vor, wird aktuell nicht verwendet. */
@font-face {
  font-family: 'Young Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/young-serif/regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Young Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/young-serif/regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Prata';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/prata/regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Prata';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/prata/regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}

/* Display-Schrift Variante A: DM Serif Display (normal + italic)
   Alternative zu G - passt tonal perfekt zu DM Sans. Um zu wechseln:
   in :root den Wert von --font-display auf "'DM Serif Display'" aendern. */
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/dm-serif-display/regular-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/dm-serif-display/regular-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Serif Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/dm-serif-display/italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Serif Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../vendor/fonts/dm-serif-display/italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Markenfarben - offizielle Smashinglogo Brand-Guideline (April 2026, nach Logo-Kauf)
     Primaer: #01426a - HEX aus Branding-Guideline, RGB 1/66/106, CMYK 99/37/0/58.
     Sekundaer: #ffffff - Weiss (Logo auf Blau, Schrift auf Blau).
     Gold-Akzent: Wappen-Gold #F5C518 (intern weitergefuehrt aus Sonnenland-Schema,
     nicht offiziell in Guideline, aber als CTA-/Akzentfarbe etabliert). */
  --brand-navy:        #01426a;
  --brand-navy-deep:   #002a47;
  --brand-navy-soft:   #1b628f;
  --brand-orange:      #F5C518;
  --brand-orange-soft: #FFD43B;
  --brand-orange-on:   #4A3300;   /* dunkles Roestbraun fuer Schrift auf Gold (WCAG AAA) */
  --brand-rail:        #2D77AA;

  /* Semantische Farben */
  --color-primary:       var(--brand-navy);
  --color-primary-hover: var(--brand-navy-soft);
  --color-accent:        var(--brand-orange);
  --color-accent-hover:  var(--brand-orange-soft);
  --color-on-accent:     var(--brand-orange-on);   /* Schrift-Token fuer Akzent-Hintergruende */

  /* Neutral-Palette (kühl, klar) */
  --surface-0: #ffffff;
  --surface-1: #f7f8fb;
  --surface-2: #eef1f6;
  --surface-3: #e2e6ee;
  --border-1:  #e4e8ef;
  --border-2:  #cdd4df;

  /* Section-Backgrounds (Sonnenland-warmer Wechsel zwischen Sections) */
  --cream: #fdfaf2;       /* warmer Cream-Ton, Sonnenland-DNA */
  --paper: #fafbfc;       /* sehr heller, leicht kühler Ton fuer Wechsel */
  --pioneer-pink: #fff3e0; /* dezenter Pioneer-Akzent fuer Pakete-Cards */
  --gold-deep: #c19a00;   /* Wappen-Gold dunkler fuer Schrift auf Cream (WCAG AA) */

  /* Text */
  --text-strong: #0b1220;
  --text-body:   #1e2535;
  --text-muted:  #5c6578;
  --text-soft:   #8891a3;
  --text-on-dark: #f7f8fb;

  /* Kategorie-Farben (gesättigter, bessere Kontrasten) */
  --cat-kultur:       #b8431b;
  --cat-gemeinschaft: #0f766e;
  --cat-religion:     #4338ca;
  --cat-sport:        #0c5878;
  --cat-natur:        #3d6b1a;
  --cat-markt:        #5a2aa8;
  --cat-gastro:       #92400e;
  --cat-kinder:       #117a34;
  --cat-jugend:       #c026d3;
  --cat-politik:      #8a6715;

  --cat-kultur-bg:       #fdeadb;
  --cat-gemeinschaft-bg: #ccfbf1;
  --cat-religion-bg:     #e0e7ff;
  --cat-sport-bg:        #d6eef7;
  --cat-natur-bg:        #e6f2d6;
  --cat-markt-bg:        #efe5fd;
  --cat-gastro-bg:       #fde4c8;
  --cat-kinder-bg:       #d6f7e2;
  --cat-jugend-bg:       #fae0fc;
  --cat-politik-bg:      #fbf2d1;

  /* Business-Partner-Akzent */
  --business:    #b8860b;
  --business-bg: #fcf4d7;

  /* Feedback-Farben */
  --color-success: #1a7f4c;
  --color-warn:    #b06a00;
  --color-error:   #c0392b;

  /* Typografie */
  --font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  /* Display-Font: aktuell Literata (Variable Font, opsz 7..72, weight 400..700).
     Alternativen lokal vorhanden:
       - 'Young Serif' + 'Prata' (italic) - verspielt-modern
       - 'DM Serif Display'                - klassisch, zu DM Sans tonal passend */
  --font-display:        'Literata', Georgia, 'Times New Roman', serif;
  --font-display-italic: 'Literata', Georgia, 'Times New Roman', serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Typografie-Groesse (Basis leicht erhoeht fuer bessere Lesbarkeit).
     Der Multiplier --fs-scale wird vom Font-Size-Toggle im Header angepasst:
     1.0 (Normal), 1.15 (Gross), 1.3 (Extra-Gross) - mit LocalStorage-Persistenz. */
  --fs-scale: 1;

  --fs-xs:  calc(0.82rem * var(--fs-scale));
  --fs-sm:  calc(0.92rem * var(--fs-scale));
  --fs-md:  calc(1.02rem * var(--fs-scale));
  --fs-lg:  calc(1.18rem * var(--fs-scale));
  --fs-xl:  calc(1.38rem * var(--fs-scale));
  --fs-2xl: calc(1.7rem  * var(--fs-scale));
  --fs-3xl: clamp(calc(1.85rem * var(--fs-scale)), calc(3.6vw * var(--fs-scale)), calc(2.65rem * var(--fs-scale)));
  --fs-hero: clamp(calc(2.1rem * var(--fs-scale)), calc(4.6vw * var(--fs-scale)), calc(3.15rem * var(--fs-scale)));

  --lh-tight:  1.2;
  --lh-normal: 1.5;
  --lh-loose:  1.7;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;

  /* Spacing-Skala (4px Basis) */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;

  /* Radius */
  --radius-xs:    6px;
  --radius-sm:    8px;
  --radius-md:    12px;
  --radius-lg:    16px;
  --radius-xl:    20px;
  --radius-pill:  999px;

  /* Schatten (subtil, App-like) - rgba aus offizieller Brand-Navy 1/66/106 */
  --shadow-xs: 0 1px 2px rgba(1, 66, 106, 0.06);
  --shadow-sm: 0 1px 3px rgba(1, 66, 106, 0.08), 0 1px 2px rgba(1, 66, 106, 0.04);
  --shadow-md: 0 4px 12px rgba(1, 66, 106, 0.08), 0 2px 4px rgba(1, 66, 106, 0.04);
  --shadow-lg: 0 12px 32px rgba(1, 66, 106, 0.12), 0 4px 8px rgba(1, 66, 106, 0.06);
  --shadow-xl: 0 24px 64px rgba(1, 66, 106, 0.18);

  /* Fokus-Ring (Sonnenland: Wappen-Gold mit hoher Sichtbarkeit auf hell und auf Navy) */
  --focus-ring: 0 0 0 3px rgba(245, 197, 24, 0.55);
  --focus-ring-dark: 0 0 0 3px rgba(245, 197, 24, 0.7);

  /* Layout-Masse */
  --container-max: 1280px;
  --header-h: 84px;

  /* Animation */
  --ease-out:  cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in:   cubic-bezier(0.55, 0.05, 0.6, 0.2);
  --ease-std:  cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:  140ms;
  --dur-base:  180ms;
  --dur-med:   220ms;
  --dur-slow:  320ms;

  /* Layer (z-index) */
  /* Leaflet nutzt intern bis 1000 fuer Controls - Modals muessen darueber liegen */
  --z-toolbar:  80;
  --z-header:   100;
  --z-backdrop: 1900;
  --z-modal:    2000;
  --z-toast:    2100;
}

/* Barrierefreiheit: Text-Groesse-Toggle-Stufen */
html[data-text-size='large']       { --fs-scale: 1.15; }
html[data-text-size='extra-large'] { --fs-scale: 1.3; }

/* Optionale Dark-Mode-Tokens (aktuell nicht aktiviert, aber vorbereitet) */
@media (prefers-color-scheme: dark) {
  :root[data-theme='auto'] {
    --surface-0: #0f1420;
    --surface-1: #151b2a;
    --surface-2: #1c2336;
    --surface-3: #252d42;
    --border-1:  #2a3347;
    --border-2:  #3a465d;
    --text-strong: #f7f8fb;
    --text-body:   #e3e7ef;
    --text-muted:  #a5afc3;
    --text-soft:   #7c879e;
  }
}