/* Interkulturell Aktiv — design tokens.
   Bold single-color (aubergine) design language: colored full-bleed hero + footer, white content,
   clean grotesque sans, hairline lists. Section CSS references these vars only — no hex literals. */

:root {
  /* --- brand (aubergine / magenta-violet) --- */
  --brand:        #7A1E6E;  /* the bold full-bleed field (hero + footer) */
  --brand-deep:   #55103F;  /* deeper tone for the faceted gradient + hovers */
  --brand-bright: #C42FA6;  /* luminous magenta highlight / arrows on dark */
  --brand-link:   #8A1270;  /* AA-safe link/accent on white */

  /* --- neutrals --- */
  --ink:      #16131C;  /* near-black text on white */
  --paper:    #FFFFFF;  /* content background */
  --paper-2:  #FBF8FC;  /* faint tinted alt background */
  --line:     #E6E1E9;  /* hairline dividers on white */
  --line-on-brand: rgba(255,255,255,.22);
  --muted:    #6C6675;  /* meta / captions on white */
  --muted-on-brand: rgba(255,255,255,.72);

  /* --- typography --- */
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-hero:  clamp(2.6rem, 1.4rem + 5.4vw, 6rem);   /* page/hero display */
  --fs-h1:    clamp(2.2rem, 1.3rem + 3.6vw, 4rem);
  --fs-h2:    clamp(1.6rem, 1.1rem + 2vw, 2.6rem);
  --fs-h3:    clamp(1.15rem, 1rem + .7vw, 1.5rem);
  --fs-title-tile: clamp(1.05rem, .85rem + 1vw, 1.6rem); /* hero title tiles */
  --fs-body:  clamp(1rem, .96rem + .2vw, 1.075rem);
  --fs-meta:  .8125rem;

  /* --- spacing / layout --- */
  --wrap:      1440px;
  --wrap-pad:  clamp(1.25rem, .6rem + 2.6vw, 4rem);
  --measure:   68ch;
  --sp-section: clamp(3.5rem, 2rem + 6vw, 7rem);

  /* --- misc --- */
  --radius: 2px;
  --dur: .35s;
}