/* ==========================================================================
   NUIT NOIRE INTERNATIONAL — tokens.css
   Schriften (lokal, kein externer Request) + Design-Tokens.
   Diese Datei definiert AUSSCHLIESSLICH Custom Properties und @font-face.
   Alle weiteren Stylesheets greifen nur noch via var() darauf zu.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Cormorant Garamond — Display / Serif
   -------------------------------------------------------------------------- */

/* 300 · latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 300 · latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300-latin.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;
}

/* 300 italic · latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 300 italic · latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300-italic-latin.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;
}

/* 400 · latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 400 · latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-400-latin.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;
}

/* 500 · latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 500 · latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-500-latin.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;
}

/* --------------------------------------------------------------------------
   2. Jost — Interface / Sans
   -------------------------------------------------------------------------- */

/* 200 · latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('../fonts/jost-200-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 200 · latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('../fonts/jost-200-latin.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;
}

/* 300 · latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/jost-300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 300 · latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/jost-300-latin.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;
}

/* 400 · latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/jost-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 400 · latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/jost-400-latin.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;
}

/* --------------------------------------------------------------------------
   3. Tokens
   -------------------------------------------------------------------------- */

:root {

  /* Farben ------------------------------------------------------------- */
  --nni-black:      #050505;
  --nni-ink:        #0A0A09;
  --nni-surface:    #0F0E0D;
  --nni-cream:      #E8E0D5;
  --nni-cream-soft: #C9C2B8;
  --nni-muted:      #8A847C;
  --nni-faint:      #837D74;
  --nni-line-strong: #6E685F; /* 3,6:1 — Rand bedienbarer Elemente */
  --nni-line:       #26241F;
  --nni-line-soft:  #171614;
  --nni-bronze:     #8C7A5B;
  --nni-danger:     #B08A8A;

  /* Schrift ------------------------------------------------------------ */
  --nni-serif: 'Cormorant Garamond', 'Times New Roman', Times, serif;
  --nni-sans:  'Jost', 'Helvetica Neue', Arial, sans-serif;

  /* Bewegung ----------------------------------------------------------- */
  --nni-ease:      cubic-bezier(.22, 1, .36, 1);
  --nni-ease-soft: cubic-bezier(.4, 0, .2, 1);
  --nni-t-fast: 320ms;
  --nni-t-med:  700ms;
  --nni-t-slow: 1200ms;
  --nni-t-door: 2200ms;

  /* Maß ---------------------------------------------------------------- */
  --nni-gutter: clamp(20px, 5vw, 72px);
  --nni-max:   1320px;
  /* Die Laufweite in ch — und ch ist tückisch: die Einheit misst die Breite
     der Ziffer Null, nicht die eines Durchschnittsbuchstabens. Bei Cormorant
     Garamond ist die Null verhältnismässig schmal, deshalb standen bei den
     früheren 62ch am Schreibtisch real 85 bis 95 Zeichen in der Zeile —
     weit über den 60 bis 75, die ein Auge ohne Rücksprung schafft.
     Nachgemessen (Zeichen geteilt durch Zeilen, nicht geschätzt) und auf
     48ch gesetzt; das ergibt in dieser Schrift rund 70 Zeichen. */
  --nni-max-text: 48ch;

  /* Typo-Skala (fluid) -------------------------------------------------
     --nni-fs-4xl entspricht exakt der H1-Vorgabe aus der Spezifikation. */
  /* Die drei kleinen Grade tragen alles, was gesperrt und in Versalien steht:
     Überzeilen, Knopfbeschriftungen, Unternavigation, Bausteine, Fußzeile.
     Ihre unteren Enden lagen bei 9,6 und 10,6 Pixeln — auf einem Telefon ist
     das nicht mehr zu lesen, und genau daran lag der wiederkehrende Befund
     „mobil kaputt". Die oberen Enden bleiben, damit sich am Bildschirm nichts
     verschiebt; angehoben wird nur der Boden. Gesperrte Versalien brauchen
     ohnehin etwas mehr Grad als gewöhnlicher Text, um ruhig zu wirken. */
  /* Der Boden von --nni-fs-micro lag bei 11,52 px (.72rem) und damit weiter
     unter der Untergrenze von 12 px. Auf .75rem gehoben; das obere Ende
     bleibt bei .78rem, am Schreibtisch verschiebt sich also nichts. */
  --nni-fs-micro: clamp(.75rem, .720rem + .10vw, .78rem);
  --nni-fs-xs:    clamp(.78rem, .745rem + .14vw, .86rem);
  --nni-fs-sm:    clamp(.85rem, .815rem + .15vw, .94rem);
  --nni-fs-base:  clamp(.95rem, .920rem + .16vw, 1.05rem);
  --nni-fs-md:    clamp(1.05rem, .995rem + .26vw, 1.20rem);
  --nni-fs-lg:    clamp(1.22rem, 1.100rem + .58vw, 1.58rem);
  --nni-fs-xl:    clamp(1.50rem, 1.240rem + 1.20vw, 2.20rem);
  --nni-fs-2xl:   clamp(1.90rem, 1.430rem + 2.20vw, 3.20rem);
  --nni-fs-3xl:   clamp(2.20rem, 1.480rem + 3.40vw, 4.20rem);
  --nni-fs-4xl:   clamp(2.60rem, 6.20vw, 5.60rem);

  /* Zeilen & Laufweiten ------------------------------------------------ */
  --nni-lh-display: .99;
  --nni-lh-tight:  1.06;
  --nni-lh-snug:   1.42;
  --nni-lh-body:   1.85;

  --nni-ls-display: -.015em;
  --nni-ls-eyebrow:  .34em;
  --nni-ls-ui:       .2em;
  --nni-ls-fine:     .28em;
  --nni-ls-body:     .012em;

  /* Abstands-Skala (fluid) --------------------------------------------- */
  --nni-sp-1:  clamp(4px,   .40vw,  6px);
  --nni-sp-2:  clamp(8px,   .80vw,  11px);
  --nni-sp-3:  clamp(12px,  1.20vw, 17px);
  --nni-sp-4:  clamp(17px,  1.80vw, 24px);
  --nni-sp-5:  clamp(24px,  2.50vw, 34px);
  --nni-sp-6:  clamp(32px,  3.40vw, 48px);
  --nni-sp-7:  clamp(44px,  4.60vw, 66px);
  --nni-sp-8:  clamp(58px,  6.20vw, 92px);
  --nni-sp-9:  clamp(76px,  8.40vw, 128px);
  --nni-sp-10: clamp(98px, 11.00vw, 168px);
  --nni-sp-11: clamp(126px, 14.00vw, 216px);
  --nni-sp-12: clamp(158px, 17.50vw, 272px);

  --nni-sp-section: var(--nni-sp-10);
  --nni-gap: clamp(22px, 3vw, 44px);

  /* Haarlinie & Ebenen -------------------------------------------------- */
  --nni-hair: 1px;
  --nni-stagger: 90ms;

  --nni-z-below:   -1;
  --nni-z-base:     1;
  --nni-z-head:    60;
  --nni-z-drawer:  80;
  --nni-z-passage: 200;
  --nni-z-grain: 9999;
  --nni-z-skip: 10000;
}