/* =========================================================
   RiesWasser Design System — Tokens (CI-konform)
   Adaption an die neue Markenpalette:
   Primärblau #00AEEF · Tiefblau #002B5C · Aqua #6FD3F5
   Hellgrau-Blau #EEF5F7 · Dunkelgrau #1F2A30
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* -------------------------------------------------------
     Colour — brand (CI-Werte)
     Variablennamen bleiben für Kompatibilität, Werte neu.
     ------------------------------------------------------- */
  /* Tiefblau-Familie — #002B5C */
  --rw-tiefenblau:     #002B5C;
  --rw-tiefenblau-700: #001E40;
  --rw-tiefenblau-500: #002B5C;
  --rw-tiefenblau-300: #6B8AA8;
  --rw-tiefenblau-100: #D6E0EC;

  /* Primärblau (Quellblau-Slot) — #00AEEF */
  --rw-quellblau:     #00AEEF;
  --rw-quellblau-700: #0095CC;
  --rw-quellblau-500: #00AEEF;
  --rw-quellblau-300: #6FD3F5;          /* Aqua */
  --rw-quellblau-100: #E6F7FE;

  /* Aqua-Akzent (semantisch eigenständig) */
  --rw-aqua:      #6FD3F5;
  --rw-aqua-50:   #EAF7FB;
  --rw-aqua-100:  #D7EFF8;

  /* Hellgrau-Blau (ersetzt Stein-Neutrals) */
  --rw-stein-700: #4A5763;
  --rw-stein-500: #8893A0;
  --rw-stein-300: #B7C4CC;
  --rw-stein-100: #EEF5F7;
  --rw-stein-50:  #F6FAFB;

  /* -------------------------------------------------------
     Colour — neutrals
     ------------------------------------------------------- */
  --rw-white:           #FFFFFF;
  --rw-surface:         #FFFFFF;
  --rw-surface-raised:  #F6FAFB;
  --rw-surface-sunken:  #EEF5F7;
  --rw-border:          #D7E5EA;
  --rw-border-strong:   #B7C4CC;
  --rw-text-muted:      #4A5763;
  --rw-text:            #1F2A30;
  --rw-text-on-dark:    #FFFFFF;
  --rw-text-on-dark-muted: #B7C9D7;

  /* -------------------------------------------------------
     Colour — semantic
     Naturgrün nur sparsam (Nachhaltigkeit/Ressourcen)
     ------------------------------------------------------- */
  --rw-success:    #7BBF8A;
  --rw-success-bg: #E9F4EC;
  --rw-warning:    #C97A1F;
  --rw-warning-bg: #FBEEDB;
  --rw-danger:     #B5341F;
  --rw-danger-bg:  #F8E2DC;
  --rw-info:       var(--rw-quellblau);
  --rw-info-bg:    var(--rw-quellblau-100);

  /* -------------------------------------------------------
     Type — families (CI: Montserrat + Inter)
     ------------------------------------------------------- */
  --rw-font-display: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --rw-font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --rw-font-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* -------------------------------------------------------
     Type — scale
     Headline-Gewicht max. SemiBold/Bold lt. CI
     ------------------------------------------------------- */
  --rw-fs-micro:    12px;
  --rw-fs-small:    14px;
  --rw-fs-body:     16px;
  --rw-fs-h4:       18px;
  --rw-fs-h3:       24px;
  --rw-fs-h2:       36px;
  --rw-fs-h1:       48px;
  --rw-fs-display:  64px;
  --rw-fs-stat:     80px;

  --rw-lh-tight:    1.05;
  --rw-lh-snug:     1.2;
  --rw-lh-normal:   1.5;
  --rw-lh-relaxed:  1.65;

  --rw-tracking-tight:  -0.018em;
  --rw-tracking-normal: 0;
  --rw-tracking-wide:   0.06em;

  /* -------------------------------------------------------
     Spacing — 8 pt grid
     ------------------------------------------------------- */
  --rw-space-0: 0;
  --rw-space-1: 4px;
  --rw-space-2: 8px;
  --rw-space-3: 12px;
  --rw-space-4: 16px;
  --rw-space-5: 24px;
  --rw-space-6: 32px;
  --rw-space-7: 48px;
  --rw-space-8: 64px;
  --rw-space-9: 96px;
  --rw-space-10: 128px;
  --rw-space-11: 160px;
  --rw-space-12: 200px;

  /* -------------------------------------------------------
     Radii — CI: 12-20px
     ------------------------------------------------------- */
  --rw-radius-sm:   6px;
  --rw-radius:      12px;
  --rw-radius-lg:   16px;
  --rw-radius-xl:   20px;
  --rw-radius-pill: 999px;

  /* -------------------------------------------------------
     Shadows — sehr dezent, kein Hochglanz
     ------------------------------------------------------- */
  --rw-shadow-1: 0 1px 2px rgba(0, 43, 92, 0.04);
  --rw-shadow-2: 0 4px 14px rgba(0, 43, 92, 0.06);
  --rw-shadow-3: 0 12px 32px rgba(0, 43, 92, 0.08);
  --rw-shadow-inset: inset 0 0 0 1px var(--rw-border);

  /* -------------------------------------------------------
     Motion
     ------------------------------------------------------- */
  --rw-ease-standard:    cubic-bezier(0.2, 0, 0, 1);
  --rw-ease-emphasized:  cubic-bezier(0.4, 0, 0.2, 1);
  --rw-duration-fast:    150ms;
  --rw-duration:         200ms;
  --rw-duration-slow:    300ms;

  /* -------------------------------------------------------
     Layout
     ------------------------------------------------------- */
  --rw-content-max:    1200px;
  --rw-content-narrow: 720px;
  --rw-header-h:       80px;
  --rw-grid-gutter:    24px;
}

/* =========================================================
   Semantic helpers
   ========================================================= */

.rw-display {
  font-family: var(--rw-font-display);
  font-weight: 700;
  font-size: var(--rw-fs-display);
  line-height: var(--rw-lh-tight);
  letter-spacing: var(--rw-tracking-tight);
  color: var(--rw-tiefenblau);
}

.rw-h1 {
  font-family: var(--rw-font-display);
  font-weight: 700;
  font-size: var(--rw-fs-h1);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--rw-tiefenblau);
}

.rw-h2 {
  font-family: var(--rw-font-display);
  font-weight: 700;
  font-size: var(--rw-fs-h2);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--rw-tiefenblau);
}

.rw-h3 {
  font-family: var(--rw-font-display);
  font-weight: 600;
  font-size: var(--rw-fs-h3);
  line-height: 1.3;
  color: var(--rw-tiefenblau);
}

.rw-h4 {
  font-family: var(--rw-font-display);
  font-weight: 600;
  font-size: var(--rw-fs-h4);
  line-height: 1.4;
  color: var(--rw-tiefenblau);
}

.rw-body {
  font-family: var(--rw-font-body);
  font-weight: 400;
  font-size: var(--rw-fs-body);
  line-height: var(--rw-lh-relaxed);
  color: var(--rw-text);
}

.rw-small {
  font-family: var(--rw-font-body);
  font-size: var(--rw-fs-small);
  line-height: var(--rw-lh-normal);
  color: var(--rw-text-muted);
}

.rw-micro {
  font-family: var(--rw-font-body);
  font-weight: 600;
  font-size: var(--rw-fs-micro);
  line-height: var(--rw-lh-normal);
  letter-spacing: var(--rw-tracking-wide);
  text-transform: uppercase;
  color: var(--rw-quellblau-700);
}

.rw-stat {
  font-family: var(--rw-font-display);
  font-weight: 700;
  font-size: var(--rw-fs-stat);
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--rw-tiefenblau);
  font-variant-numeric: tabular-nums;
}

.rw-mono {
  font-family: var(--rw-font-mono);
  font-size: var(--rw-fs-small);
  font-feature-settings: "tnum";
}

/* =========================================================
   Element defaults
   ========================================================= */

.rw-prose {
  font-family: var(--rw-font-body);
  font-size: var(--rw-fs-body);
  line-height: var(--rw-lh-relaxed);
  color: var(--rw-text);
}
.rw-prose h1 { font: 700 var(--rw-fs-h1)/1.1 var(--rw-font-display); letter-spacing: -0.015em; margin: 0 0 var(--rw-space-5); color: var(--rw-tiefenblau); }
.rw-prose h2 { font: 700 var(--rw-fs-h2)/1.15 var(--rw-font-display); letter-spacing: -0.01em; margin: var(--rw-space-7) 0 var(--rw-space-4); color: var(--rw-tiefenblau); }
.rw-prose h3 { font: 600 var(--rw-fs-h3)/1.3 var(--rw-font-display); margin: var(--rw-space-6) 0 var(--rw-space-3); color: var(--rw-tiefenblau); }
.rw-prose p  { margin: 0 0 var(--rw-space-4); text-wrap: pretty; }
.rw-prose a  { color: var(--rw-quellblau-700); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.rw-prose a:hover { color: var(--rw-tiefenblau); }
.rw-prose code { font-family: var(--rw-font-mono); font-size: 0.92em; background: var(--rw-surface-raised); padding: 0.1em 0.35em; border-radius: var(--rw-radius-sm); }

.rw-reset, .rw-reset * { box-sizing: border-box; }
.rw-reset { margin: 0; }