:root {

  --global-slate-900: #1E2133;
  --global-slate-700: #2B2F40;
  --global-slate-500: #3F4459;
  --global-slate-300: #6B7280;
  --global-slate-100: #E8E9ED;

  --global-amber-600: #C8842A;
  --global-amber-700: #A06820;
  --global-amber-800: #7A4F0C;

  --global-coral-500:      #C85A3C;
  --global-coral-600:      #A0432A;
  --global-coral-400:      #E8715A;

  --global-rust-700:       #A63A2C;
  --global-rust-500:       #D9603F;

  --global-tint-apricot:   #FFF5EF;
  --global-tint-peach:     #FFE9DC;
  --global-tint-coral:     #FAD9D0;
  --global-tint-sand:      #FFF8F0;
  --global-tint-rose:      #FAE0D0;

  --global-cream-100:  #FDFCF8;
  --global-cream-200:  #F2EED8;
  --global-cream-300:  #E8E4DC;
  --global-cream-400:  #D6D0C4;
  --global-cream-500:  #E4E0BA;

  --global-white:          #FFFFFF;
  --global-black:          #111111;
  --global-neutral-600:    #5A5A5A;
  --global-neutral-400:    #8A8A8A;

  --global-footer-slate:   #2E3245;

  --global-blue-900: #0B3866;
  --global-blue-700: #396797;
  --global-blue-300: #ACD3FB;

  --global-blue-050: #EAF2FE;

  --global-green-500: #38C079;
  --global-green-800: #195737;

  --global-gray:      #404040;
  --global-fill:      #F4F4F4;
  --global-bg:        #FBFBFB;
}

:root {

  --color-primary:           var(--global-blue-700);
  --color-primary-dark:      var(--global-blue-900);
  --color-primary-deeper:    var(--global-blue-900);

  --color-accent:            var(--global-blue-900);
  --color-accent-dark:       var(--global-blue-700);
  --color-accent-amber:      var(--global-amber-700);

  --color-accent-readable:   var(--global-blue-700);

  --gradient-rust:           linear-gradient(135deg, var(--global-rust-700) 15%, var(--global-rust-500) 90%);
  --color-warn:              var(--global-rust-700);
  --color-warn-soft:         var(--global-rust-500);

  --color-background:        var(--global-bg);
  --color-surface:           var(--global-white);
  --color-muted:             var(--global-fill);
  --color-fill:              var(--global-fill);
  --surface-overlay:         rgba(255,255,255,.92);

  --color-tint-fragen:       var(--global-tint-apricot);
  --color-tint-cta:          var(--global-tint-peach);
  --color-tint-kontext:      var(--global-white);

  --color-text-primary:      var(--global-blue-900);
  --color-text-secondary:    var(--global-neutral-600);
  --color-text-on-primary:   var(--global-cream-200);
  --color-text-on-cta:       var(--global-slate-700);

  --color-border:            var(--global-cream-400);
  --color-border-strong:     var(--global-neutral-400);
  --color-border-warm:       var(--global-tint-rose);

  --font-display:  'Inter Tight', 'Arial Narrow', Arial, sans-serif;
  --font-body:     'Inter', Arial, sans-serif;

  --font-weight-regular:   400;
  --font-weight-medium:    500;
  --font-weight-semibold:  600;
  --font-weight-bold:      700;
  --font-weight-extrabold: 800;

  --font-size-hero:    clamp(40px, 6vw, 86px);
  --font-size-h1:      clamp(32px, 4vw, 60px);
  --font-size-h2:      clamp(26px, 3vw, 44px);
  --font-size-h3:      clamp(20px, 2.5vw, 30px);
  --font-size-h4:      22px;
  --font-size-body-lg: 19px;
  --font-size-body:    18px;
  --font-size-body-sm: 16px;
  --font-size-caption: 14px;
  --font-size-meta:    13px;

  --line-height-tight:   1.15;
  --line-height-snug:    1.35;
  --line-height-normal:  1.6;
  --line-height-relaxed: 1.75;

  --letter-spacing-tight:  -0.02em;
  --letter-spacing-normal:  0;
  --letter-spacing-wide:    0.05em;
  --letter-spacing-wider:   0.1em;

  --letter-spacing-headline: -0.023em;

  --space-1:   4px;
  --space-2:   8px;

  --space-2-5: 12px;
  --space-3:  16px;
  --space-4:  24px;
  --space-5:  32px;
  --space-6:  48px;
  --space-7:  64px;
  --space-8:  96px;
  --space-9: 128px;

  --radius-sm:   8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-full: 999px;

  --shadow-sm:  0 1px 3px rgba(11,56,102,.08), 0 1px 2px rgba(64,64,64,.04);
  --shadow-md:  0 4px 16px rgba(11,56,102,.12), 0 2px 4px rgba(64,64,64,.05);
  --shadow-lg:  0 8px 28px rgba(11,56,102,.14), 0 4px 8px rgba(64,64,64,.06);

  --grid-max:     1200px;
  --grid-gutter:   24px;

  --hero-bg:   var(--global-bg);
  --hero-text: var(--global-black);

  --gradient-headline-start: var(--global-slate-500);
  --gradient-headline-end:   var(--global-coral-500);

  --btn-primary-bg:      var(--global-blue-900);
  --btn-primary-text:    #fff;
  --btn-primary-hover:   var(--global-blue-700);

  --btn-secondary-bg:    var(--color-primary);
  --btn-secondary-text:  var(--color-text-on-primary);
  --btn-secondary-hover: var(--color-primary-dark);

  --btn-ghost-color:     var(--color-primary);
  --btn-ghost-border:    rgba(63,68,89,.25);

  --btn-accent-bg:       var(--global-blue-300);
  --btn-accent-text:     var(--global-blue-900);
  --btn-accent-border:   var(--global-blue-900);
  --btn-accent-hover:    var(--global-blue-050);

  --btn-radius: var(--radius-full);

  --img-radius:       16px;
  --img-filter-tint:  sepia(.10) saturate(.92) brightness(1.01);

  --card-bg:      var(--color-surface);
  --card-border:  var(--color-border);
  --card-radius:  var(--radius-md);
  --card-shadow:  var(--shadow-sm);
  --card-padding: var(--space-5);

  --nav-bg:        #FFFFFF;
  --nav-bg-inset:  #FBFBFB;
  --nav-text:      var(--global-gray);
  --nav-text-active: var(--global-blue-900);

  --nav-height:    81px;
  --nav-shadow:    0 15px 40px -20px rgba(172,211,251,.6);
  --nav-shadow-scrolled: 0 15px 40px -18px rgba(172,211,251,.85), 0 1px 0 rgba(11,56,102,.06);
  --nav-cta-bg:    var(--global-blue-300);
  --nav-cta-text:  var(--global-blue-900);

  --nav-divider:   rgba(11,56,102,.08);
  --nav-rail:      var(--global-blue-300);

  --questions-bg:             var(--color-tint-fragen);
  --questions-card-1-bg:      #FFF5EF;
  --questions-card-2-bg:      #FFF0E8;
  --questions-card-3-bg:      #FAE8E0;
  --questions-card-4-bg:      #FFF8F0;
  --questions-card-5-bg:      #FFF2EA;
  --questions-card-6-bg:      #F8EEE8;
  --questions-card-border:    var(--color-border-warm);
  --questions-text:           var(--global-slate-700);
  --questions-lead-text:      var(--global-neutral-600);
  --questions-num-color:      var(--global-tint-rose);
  --questions-badge-bg:       var(--global-coral-500);
  --questions-badge-text:     #fff;
  --questions-label-color:    var(--color-accent);

  --cta-band-bg:         var(--color-tint-cta);
  --cta-band-text:       var(--global-slate-700);
  --cta-band-text-sub:   var(--global-neutral-600);
  --cta-band-label:      var(--color-accent);

  --footer-bg:    linear-gradient(123.39deg, var(--global-blue-900) 20.875%, var(--global-green-800) 100%);

  --footer-text:  rgba(255,255,255,.85);
  --footer-link:  #FFFFFF;
  --footer-label: rgba(255,255,255,.9);
  --footer-border: rgba(255,255,255,.16);
  --footer-address: #D9D9D9;

  --footer-text-bottom: rgba(255,255,255,.75);
  --footer-text-sub:    rgba(255,255,255,.7);
  --footer-placeholder: rgba(255,255,255,.75);

  --newsletter-input-bg:     rgba(255,255,255,.1);
  --newsletter-input-border: rgba(255,255,255,.24);
  --newsletter-btn-bg:       #FFFFFF;
  --newsletter-btn-text:     var(--global-blue-900);
  --newsletter-btn-hover:    #EAF2FE;

  --font-weight-section-headline: 500;

  --font-weight-display:    500;
  --font-weight-display-xl: 400;

  --tag-verfahren-bg:   #ACD3FB;
  --tag-verfahren-text: #0B3866;

  --tag-umwelt-bg:      #D6F0E0;
  --tag-umwelt-text:    #1A6840;

  --tag-termine-bg:     #F9E5C9;
  --tag-termine-text:   #8A5A1A;

  --tag-allgemein-bg:   #F4F4F4;
  --tag-allgemein-text: #404040;

  --section-dark-bg:        var(--global-blue-900);
  --section-dark-headline:  var(--global-white);
  --section-dark-text:      rgba(255,255,255,.85);
  --section-dark-label:     var(--global-blue-300);
  --section-dark-border:    rgba(255,255,255,.16);

  --btn-inverse-bg:      var(--global-white);
  --btn-inverse-text:    var(--global-blue-900);
  --btn-inverse-hover:   var(--global-blue-050);

  --pill-bg:             var(--global-fill);
  --pill-text:           var(--global-gray);
  --pill-active-bg:      var(--global-blue-300);
  --pill-active-text:    var(--global-blue-900);
  --pill-on-dark-bg:     rgba(255,255,255,.10);
  --pill-on-dark-border: rgba(255,255,255,.24);
  --pill-on-dark-text:   var(--global-white);

  --toggle-active-text:   var(--global-blue-900);
  --toggle-inactive-text: var(--global-gray);

  --badge-offen-bg:       transparent;
  --badge-offen-text:     var(--global-white);
  --badge-offen-border:   rgba(255,255,255,.40);
  --badge-verfolgt-bg:    var(--global-blue-300);
  --badge-verfolgt-text:  var(--global-blue-900);

  --petition-bg:          var(--global-blue-050);
  --petition-text:        var(--global-blue-900);

  --font-size-display-fluid: clamp(48px, 7vw, 80px);
  --font-size-display-lg:    64px;
  --font-size-display-md:    52px;
  --font-size-display-sm:    36px;

  --font-size-micro:  12px;

  --line-height-none: 1;

  --letter-spacing-kicker: .08em;

  --img-placeholder-icon-size:    36px;
  --img-placeholder-icon-opacity: .3;

  --page-hero-media-width:        320px;
  --page-hero-media-ratio:        3 / 4;
  --page-hero-media-ratio-mobile: 16 / 7;

}