/* HMB Media - Design Tokens v3.0 - Kamera-Logo-System.
   Palette unveraendert aus der Marke: #111111 / #F0900A. Dark ist das Primaerschema.
   Farben identisch zu v2; neu ab v3 ist die Kamera-Bildmarke (siehe logo/). */

:root {
  /* ===== Markenfarben (unveraendert aus dem Bestandslogo) ===== */
  --hmb-brand-black: #111111;
  --hmb-brand-orange: #F0900A;

  /* ===== Palette ===== */
  --hmb-ink-950: #111111;
  --hmb-ink-900: #1A1A1A;
  --hmb-ink-800: #262626;
  --hmb-ink-700: #343434;
  --hmb-ink-600: #4B4B4B;
  --hmb-ink-500: #5E5E5E;
  --hmb-ink-450: #757575;
  --hmb-ink-400: #8C8C8C;
  --hmb-ink-300: #B2B2B2;
  --hmb-ink-200: #CFCFCF;
  --hmb-ink-100: #E6E5E3;
  --hmb-ink-050: #F2F1EF;
  --hmb-paper-000: #FFFFFF;
  --hmb-paper-050: #FCFBF9;
  --hmb-paper-100: #F7F5F2;
  --hmb-paper-200: #EEEBE6;
  --hmb-paper-300: #DCD7CF;
  --hmb-amber-800: #7A4703;
  --hmb-amber-700: #96570A;
  --hmb-amber-600: #C77A08;
  --hmb-amber-500: #F0900A;
  --hmb-amber-400: #F5A83B;
  --hmb-amber-300: #F9C173;
  --hmb-amber-200: #FCDCAF;
  --hmb-amber-100: #FEF3E2;
  --hmb-danger-700: #8E1B12;
  --hmb-danger-600: #B42318;
  --hmb-danger-500: #D92D20;
  --hmb-danger-400: #F04438;
  --hmb-danger-300: #FF8A80;
  --hmb-danger-100: #FDE3E0;

  /* ===== Typografie ===== */
  --hmb-font-display: "Archivo","Archivo Condensed","Helvetica Neue",Arial,sans-serif;
  --hmb-font-text: "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --hmb-font-mono: "JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --hmb-size-display-xl: clamp(2.75rem, 1.6rem + 5.2vw, 6rem);
  --hmb-size-display-l: clamp(2.25rem, 1.5rem + 3.4vw, 4.25rem);
  --hmb-size-h1: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  --hmb-size-h2: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  --hmb-size-h3: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
  --hmb-size-body-l: 1.125rem;
  --hmb-size-body: 1rem;
  --hmb-size-body-s: 0.9375rem;
  --hmb-size-caption: 0.8125rem;
  --hmb-size-meta: 0.75rem;
  --hmb-weight-regular: 400;
  --hmb-weight-medium: 500;
  --hmb-weight-semibold: 600;
  --hmb-weight-bold: 700;
  --hmb-weight-extrabold: 800;
  --hmb-leading-tight: 0.98;
  --hmb-leading-snug: 1.12;
  --hmb-leading-normal: 1.55;
  --hmb-leading-relaxed: 1.7;
  --hmb-tracking-display: -0.02em;
  --hmb-tracking-heading: -0.01em;
  --hmb-tracking-body: 0;
  --hmb-tracking-meta: 0.08em;
  --hmb-tracking-label: 0.14em;

  /* ===== Raster und Abstand (8-px-Basis) ===== */
  --hmb-space-0: 0rem;
  --hmb-space-1: 0.25rem;
  --hmb-space-2: 0.5rem;
  --hmb-space-3: 0.75rem;
  --hmb-space-4: 1rem;
  --hmb-space-5: 1.5rem;
  --hmb-space-6: 2rem;
  --hmb-space-7: 3rem;
  --hmb-space-8: 4rem;
  --hmb-space-9: 6rem;
  --hmb-space-10: 8rem;
  --hmb-space-11: 12rem;
  --hmb-container: 78rem;
  --hmb-container-narrow: 44rem;
  --hmb-gutter: clamp(1rem, 4vw, 3rem);

  --hmb-radius-none: 0;
  --hmb-radius-sm: 2px;
  --hmb-radius-md: 4px;
  --hmb-radius-lg: 8px;
  --hmb-radius-xl: 16px;
  --hmb-radius-pill: 999px;
  --hmb-shadow-sm: 0 1px 2px rgba(0,0,0,.24);
  --hmb-shadow-md: 0 4px 16px -4px rgba(0,0,0,.38);
  --hmb-shadow-lg: 0 18px 48px -12px rgba(0,0,0,.55);
  --hmb-motion-fast: 120ms;
  --hmb-motion-base: 200ms;
  --hmb-motion-slow: 360ms;
  --hmb-motion-ease: cubic-bezier(.2,.7,.2,1);
  --hmb-motion-ease-in-out: cubic-bezier(.4,0,.2,1);

  /* ===== Semantische Rollen: Dark = Primaerschema ===== */
  --hmb-bg: #111111;
  --hmb-bg-elevated: #1A1A1A;
  --hmb-bg-sunken: #0A0A0A;
  --hmb-fg: #FCFBF9;
  --hmb-fg-muted: #B2B2B2;
  --hmb-fg-subtle: #8C8C8C;
  --hmb-border: #262626;
  --hmb-border-strong: #757575;
  --hmb-accent: #F0900A;
  --hmb-accent-fg: #111111;
  --hmb-accent-text: #F0900A;
  --hmb-accent-hover: #F5A83B;
  --hmb-accent-soft: #2A1D05;
  --hmb-accent-border: #F0900A;
  --hmb-danger: #F04438;
  --hmb-danger-fg: #111111;
  --hmb-inverse-bg: #F7F5F2;
  --hmb-inverse-fg: #111111;
  color-scheme: dark;
}

/* Helles Schema: Dokumente, Print, Nutzerpraeferenz */
[data-theme="light"] {
  --hmb-bg: #F7F5F2;
  --hmb-bg-elevated: #FFFFFF;
  --hmb-bg-sunken: #EEEBE6;
  --hmb-fg: #111111;
  --hmb-fg-muted: #4B4B4B;
  --hmb-fg-subtle: #5E5E5E;
  --hmb-border: #E6E5E3;
  --hmb-border-strong: #8C8C8C;
  --hmb-accent: #F0900A;
  --hmb-accent-fg: #111111;
  --hmb-accent-text: #96570A;
  --hmb-accent-hover: #C77A08;
  --hmb-accent-soft: #FEF3E2;
  --hmb-accent-border: #96570A;
  --hmb-danger: #B42318;
  --hmb-danger-fg: #FFFFFF;
  --hmb-inverse-bg: #111111;
  --hmb-inverse-fg: #FCFBF9;
  color-scheme: light;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --hmb-bg: #F7F5F2;
    --hmb-bg-elevated: #FFFFFF;
    --hmb-bg-sunken: #EEEBE6;
    --hmb-fg: #111111;
    --hmb-fg-muted: #4B4B4B;
    --hmb-fg-subtle: #5E5E5E;
    --hmb-border: #E6E5E3;
    --hmb-border-strong: #8C8C8C;
    --hmb-accent: #F0900A;
    --hmb-accent-fg: #111111;
    --hmb-accent-text: #96570A;
    --hmb-accent-hover: #C77A08;
    --hmb-accent-soft: #FEF3E2;
    --hmb-accent-border: #96570A;
    --hmb-danger: #B42318;
    --hmb-danger-fg: #FFFFFF;
    --hmb-inverse-bg: #111111;
    --hmb-inverse-fg: #FCFBF9;
    color-scheme: light;
  }
}