/* NF Marketing Mastermind · Design-Tokens
   Markenwerte aus nf-mentoring.de (BUILD-SPEC §2, RULES.md → Brand). Namen sind verbindlich,
   chat.css greift auf dieselben Variablen zu. */

@font-face {
  font-family: "Nunito Sans";
  src: url("../fonts/nunito-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Nunito Sans";
  src: url("../fonts/nunito-sans-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Nunito Sans";
  src: url("../fonts/nunito-sans-800.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url("../fonts/playfair-display-400-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  /* Marke (exakt BUILD-SPEC §2) */
  --nf-red: #B4121E;
  --nf-red-deep: #8E1622;
  --nf-wine: #AE1D2B;
  --nf-logo-red: #A91A2A;
  --nf-bordeaux: #2D0912;
  --nf-bordeaux-2: #1F070E;
  --nf-ink: #08080A;
  --nf-ink-0: #050506;
  --nf-ink-2: #181818;
  --nf-cream: #F1EDE8;
  --nf-light: #F3F3F3;
  --nf-white: #FBFBFB;
  --font-sans: "Nunito Sans", system-ui, -apple-system, sans-serif;
  --font-serif: "Playfair Display", Georgia, serif;

  /* Abgeleitete Flächen und Text (nur Mischungen der Markenwerte) */
  --text: var(--nf-cream);
  --text-soft: rgb(241 237 232 / 0.74);
  --text-mute: rgb(241 237 232 / 0.56);
  --hairline: rgb(241 237 232 / 0.12);
  --hairline-soft: rgb(241 237 232 / 0.06);
  --paper: var(--nf-cream);
  --paper-ink: var(--nf-ink-2);

  /* Typo-Skala (fluid) */
  --fs-eyebrow: 0.72rem;
  --fs-small: 0.875rem;
  --fs-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --fs-lead: clamp(1.0625rem, 0.98rem + 0.45vw, 1.3125rem);
  --fs-h3: clamp(1.375rem, 1.1rem + 1.1vw, 2rem);
  --fs-h2: clamp(2.125rem, 1.3rem + 3.6vw, 4.75rem);
  --fs-h1: clamp(2.75rem, 1.2rem + 6.9vw, 8.25rem);
  --tracking-display: -0.032em;
  --tracking-caps: 0.3em;
  --tracking-cta: 0.18em;

  /* Raster und Abstände */
  --gutter: clamp(20px, 5.2vw, 96px);
  --maxw: 1320px;
  --section-y: clamp(104px, 13vw, 200px);

  /* Bewegung: eine Easing-Familie */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);      /* expo.out-Anmutung */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);  /* power2.inOut-Anmutung */
  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);  /* dezente Feder für CTAs/Sheets */

  /* Ebenen */
  --z-grain: 60;
  --z-sticky: 40;
  --z-header: 30;
}