/* ============================================================
   tokens.css — Design-Tokens Praxis Angler (Demo)
   Einzige Quelle für Farbe, Typo-Skala, Spacing, Motion.
   ============================================================ */

/* ---------- Webfonts (lokal gehostet, latin subset) ---------- */

@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 560;
  font-display: swap;
  src: url('fonts/fraunces-560-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 420;
  font-display: swap;
  src: url('fonts/fraunces-420-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/inter-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/inter-500-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 650;
  font-display: swap;
  src: url('fonts/inter-650-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokens ---------- */

:root {
  /* Farbe — Tannengrün als Basis (Praxis-Identität), Orange als einziger Akzent (Logo-Echo) */
  --c-pine:       #1E3A30;
  --c-pine-deep:  #152B23;
  --c-pine-soft:  #2A4A3E;
  --c-paper:      #FAF7F1;
  --c-card:       #FFFFFF;
  --c-sage:       #E8EEE7;
  --c-apricot:    #E08643;
  --c-apricot-deep: #C26F30;
  --c-apricot-tint: #F8EBDD;
  --c-lime:       #93C11A;   /* Original-Markengrün der Ist-Seite (Header/Logo) */
  --c-lime-deep:  #6E9213;
  --c-ink:        #1F2A25;
  --c-ink-soft:   #56635C;
  --c-on-dark:    #F4F1EA;
  --c-on-dark-soft: rgba(244, 241, 234, 0.72);
  --c-line:       rgba(31, 42, 37, 0.12);
  --c-line-dark:  rgba(244, 241, 234, 0.16);

  /* Typografie */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'SF Mono', 'Consolas', 'Liberation Mono', monospace;

  --fs-hero:    clamp(2.4rem, 5.4vw, 4.1rem);
  --fs-display: clamp(1.9rem, 3.8vw, 2.9rem);
  --fs-h3:      clamp(1.2rem, 2vw, 1.4rem);
  --fs-lead:    clamp(1.05rem, 1.6vw, 1.2rem);
  --fs-body:    1rem;
  --fs-small:   0.875rem;
  --fs-micro:   0.75rem;

  --lh-tight: 1.12;
  --lh-snug:  1.3;
  --lh-body:  1.65;

  --ls-kicker: 0.14em;

  /* Raum */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;
  --section-y: clamp(4rem, 9vw, 7rem);
  --container: 72rem;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* Form */
  --r-card: 18px;
  --r-img: 22px;
  --r-pill: 999px;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --t-fast: 180ms;
  --t-reveal: 700ms;

  /* Schatten */
  --shadow-card: 0 1px 2px rgba(31, 42, 37, 0.05), 0 10px 30px rgba(31, 42, 37, 0.07);
  --shadow-cta: 0 6px 18px rgba(194, 111, 48, 0.32);
}
