/* =========================================================
   Berlin-CI-Webfonts
   ========================================================= */

@font-face{
  font-family:"Berlin Type";
  src:
    url("/wp-content/themes/pep2030-minimal/assets/fonts/BerlinTypeWeb-Regular.woff2") format("woff2"),
    url("/wp-content/themes/pep2030-minimal/assets/fonts/BerlinTypeWeb-Regular.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Berlin Type";
  src:
    url("/wp-content/themes/pep2030-minimal/assets/fonts/BerlinTypeWeb-Bold.woff2") format("woff2"),
    url("/wp-content/themes/pep2030-minimal/assets/fonts/BerlinTypeWeb-Bold.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}


/* =========================================================
   Design-Tokens
   ========================================================= */

:root{

  /* ---------------------------------------------------------
     Farben
     --------------------------------------------------------- */
  --c-bg:#ffffff;
  --c-fg:#111111;
  --c-muted:#444444;

  --c-border:#d0d0d0;
  --c-border-strong:#999999;
  --c-border-search:#7f7f7f;


  --c-surface:#f2f2f2;
  --c-surface-2:#e6e6e6;

  --c-accent:#e40422;              /* Berlin-Rot */
  --c-accent-hover:#c9031d;
  --c-accent-contrast:#ffffff;
  --c-accent-bg:#f2f2f2;

  --c-focus:#ffbf47;

  --c-header-bg:rgba(0,0,0,.92);
  --c-header-border:rgba(255,255,255,.16);
  --c-header-link:#ffffff;
  --c-header-link-hover:rgba(255,255,255,.12);
  --c-header-link-current:rgba(255,255,255,.18);

  --c-footer-bg:#000000;
  --c-footer-border:rgba(255,255,255,.16);
  --c-footer-fg:rgba(255,255,255,.88);
  --c-footer-fg-muted:rgba(255,255,255,.76);


  /* ---------------------------------------------------------
     Typografie
     --------------------------------------------------------- */
  --font-sans:
    "Berlin Type",
    system-ui,
    -apple-system,
    "Segoe UI",
    Arial,
    sans-serif;

  --font-body:var(--font-sans);
  --font-heading:var(--font-sans);
  --font-ui:var(--font-sans);

  --fs-1:0.95rem;
  --fs-2:1.08rem;
  --fs-3:1.35rem;
  --fs-4:1.70rem;
  --fs-5:2.30rem;
  --fs-6:clamp(3rem, 7vw, 5rem);

  --fw-regular:400;
  --fw-bold:700;

  --fw-1:var(--fw-regular);
  --fw-2:var(--fw-regular);
  --fw-3:var(--fw-bold);
  --fw-4:var(--fw-bold);

  --fw-body:var(--fw-regular);
  --fw-heading:var(--fw-bold);
  --fw-ui:var(--fw-bold);

  --lh-tight:1.1;
  --lh-heading:1.2;
  --lh-base:1.5;
  --lh-copy:1.65;

  --tracking-tight:-0.01em;
  --tracking-normal:0;
  --tracking-wide:0.01em;


  /* ---------------------------------------------------------
     Abstände
     --------------------------------------------------------- */
  --s-1:0.25rem;
  --s-2:0.50rem;
  --s-3:1rem;
  --s-4:1.5rem;
  --s-5:2rem;
  --s-6:3rem;
  --s-7:4rem;
  --s-8:6rem;

  --header-offset:calc(var(--s-6) + 4rem);


  /* ---------------------------------------------------------
     Layout
     --------------------------------------------------------- */
  --container:72rem;          /* ca. 1152px */
  --measure:80ch;
  --measure-narrow:78ch;


  /* ---------------------------------------------------------
     Radius / UI
     Hinweis: aktuell bewusst auf 0 gesetzt.
     --radius bleibt erhalten, da er in components.css
     noch global referenziert wird.
     --------------------------------------------------------- */
  --radius:0;

  --shadow-sm:0 1px 2px rgba(0,0,0,.08);
  --shadow-md:0 4px 10px rgba(0,0,0,.10);


  /* ---------------------------------------------------------
     Komponenten
     --------------------------------------------------------- */
  --number-box-size:86px;
  --number-box-size-compact:6rem;

  --hero-title-size:var(--fs-6);
  --hero-title-weight:var(--fw-heading);
  --hero-title-line-height:1.1;

  --button-font-weight:var(--fw-ui);
  --button-padding:1rem 1rem .75rem 1rem;
  --button-padding-compact:.85rem .9rem .65rem .9rem;
  --button-font-size-compact:.95rem;

  --button-padding-mobile:1rem 1.75rem 0.85rem 1.75rem;
  --button-font-size-mobile:0.95rem;
  --button-min-width-mobile:11.5rem;
  --button-line-height-mobile:1.15;

  --nav-font-weight:var(--fw-ui);


  /* ---------------------------------------------------------
     Animation / UX
     --------------------------------------------------------- */
  --transition-fast:160ms ease;
  --transition-base:240ms ease;
}
