/* ==========================================================================
   Design Tokens – Wehmeyer Scheidung Online
   Kein Dark Mode – immer hell, immer klar
   ========================================================================== */

:root {

  /* --- Farben: Akzent Blau -------------------------------------------- */
  --accent:          #3B7DD8;
  --accent-dark:     #2B6ABF;
  --accent-subtle:   #EBF2FC;
  --accent-border:   #C2D8F5;

  /* --- Farben: Hintergründe ------------------------------------------- */
  --bg:              #FFFFFF;
  --surface:         #F4F7FB;
  --surface-2:       #EBF2FC;
  --card:            #FFFFFF;

  /* --- Farben: Text ---------------------------------------------------- */
  --text:            #1A2235;
  --text-muted:      #5A6B85;
  --text-light:      #8A9BB5;
  --text-on-accent:  #FFFFFF;

  /* --- Farben: Rahmen & Trennlinien ------------------------------------ */
  --border:          #D8E3F0;
  --border-light:    #EBF2FC;

  /* --- Farben: Hero & Dark-Sektion ------------------------------------- */
  --dark-bg:         #1A2235;
  --dark-surface:    #222D42;
  --text-on-dark:    #F0F5FD;
  --text-on-dark-muted: rgba(240, 245, 253, 0.70);

  /* --- Farben: Status -------------------------------------------------- */
  --green:           #22C55E;
  --green-subtle:    #DCFCE7;
  --red:             #EF4444;
  --red-subtle:      #FEE2E2;

  /* --- Typografie ------------------------------------------------------ */
  --font-sans:  system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
                Roboto, Helvetica, Arial, sans-serif;
  --font-serif: Georgia, 'Times New Roman', serif;

  --text-xs:    0.75rem;
  --text-sm:    0.875rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   1.5rem;
  --text-3xl:   1.875rem;
  --text-4xl:   2.25rem;
  --text-hero:  clamp(2.25rem, 5vw, 3.25rem);

  /* --- Abstände -------------------------------------------------------- */
  --sp-1:   0.25rem;
  --sp-2:   0.5rem;
  --sp-3:   0.75rem;
  --sp-4:   1rem;
  --sp-5:   1.25rem;
  --sp-6:   1.5rem;
  --sp-8:   2rem;
  --sp-10:  2.5rem;
  --sp-12:  3rem;
  --sp-16:  4rem;
  --sp-20:  5rem;
  --sp-24:  6rem;

  /* --- Radien ---------------------------------------------------------- */
  --r-sm:   0.375rem;
  --r-md:   0.625rem;
  --r-lg:   1rem;
  --r-xl:   1.5rem;
  --r-full: 9999px;

  /* --- Schatten (blau-getönt) ----------------------------------------- */
  --shadow-sm:  0 1px 3px rgba(59, 125, 216, 0.08);
  --shadow-md:  0 4px 12px rgba(59, 125, 216, 0.10);
  --shadow-lg:  0 8px 24px rgba(59, 125, 216, 0.12);
  --shadow-xl:  0 16px 48px rgba(59, 125, 216, 0.14);

  /* --- Transitions ----------------------------------------------------- */
  --ease:    0.18s ease;
  --ease-md: 0.28s ease;

  /* --- Layout ---------------------------------------------------------- */
  --max-w:   1100px;
  --max-w-text: 720px;
}