@font-face { font-family: "Inter"; src: url("../fonts/Inter-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "TT Hoves Pro"; src: url("../fonts/TT_Hoves_Pro_ExtraBold.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }

/* Typo-Skala (Briefing 3.4). Werte mit * = am Screen gemessen, Bestätigung ausstehend.
   Große Grade skalieren fluid mit der Containerbreite: 1920 px = Screen-Wert, darunter proportional, Untergrenze = Mindestgröße. */
:root {
  --font-display: "TT Hoves Pro", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;

  --type-display-hero: 800 clamp(56px, 6.250cqw, 120px)/1.050 var(--font-display);   /* * */
  --type-h1: 800 clamp(48px, 5.208cqw, 100px)/1.100 var(--font-display);               /* * */
  --type-h1-quote: 800 clamp(36px, 3.646cqw, 70px)/1.071 var(--font-display);
  --type-h1-sub: 800 clamp(34px, 2.604cqw, 50px)/1.100 var(--font-display);            /* * */
  --type-quote-xl: 800 clamp(36px, 3.906cqw, 75px)/1.200 var(--font-display);
  --type-stoerer-xl: 800 clamp(36px, 3.385cqw, 65px)/1.123 var(--font-display);
  --type-h2: 800 clamp(32px, 2.344cqw, 45px)/1.178 var(--font-display);
  --type-text-xl: 600 clamp(27px, 2.344cqw, 45px)/1.200 var(--font-display);
  --type-h3: 800 clamp(24px, 1.823cqw, 35px)/1.229 var(--font-display);
  --type-section-title: 800 30px/38px var(--font-display);
  --type-tile-title: 800 30px/35px var(--font-display);
  --type-quote-statement: 400 25px/32px var(--font-display);   /* LH * */
  --type-teaser-title: 800 22px/26px var(--font-display);
  --type-lead: 400 20px/28px var(--font-body);
  --type-body: 400 17px/26px var(--font-body);
  --type-body-bold: 700 17px/26px var(--font-body);
  --type-eyebrow: 800 16px/24px var(--font-display);
  --tracking-eyebrow: 0.08em;
  --tracking-eyebrow-hero: 0.3em;
  --type-eyebrow-hero: 800 20px/24px var(--font-display);
  --type-digit-xl: 800 clamp(56px, 4.688cqw, 90px)/1.111 var(--font-display);
  --type-digit-l: 400 clamp(56px, 4.427cqw, 85px)/1.176 var(--font-display);
  --type-link: 800 18px/24px var(--font-display);              /* * */
  --type-nav: 800 19px/24px var(--font-display);               /* * */
  --type-nav-meta: 400 15px/20px var(--font-body);             /* * */
  --type-button: 400 17px/22px var(--font-body);               /* * */
  --type-button-l: 400 20px/26px var(--font-body);             /* * Hero */
  --type-button-nav: 800 16px/20px var(--font-display);        /* * */
  --type-caption: 400 14px/20px var(--font-body);              /* * Absender */
  --type-footer: 400 17px/28px var(--font-body);               /* * */
}
@font-face { font-family: "TT Hoves Pro"; src: url("../fonts/TT_Hoves_Pro_ExtraBold_Italic.woff2") format("woff2"); font-weight: 800; font-style: italic; font-display: swap; }
