/* Token del sito: palette e font della guida (DESIGN §1-2). */

@font-face {
    font-family: "Monument Extended";
    src: url("../fonts/monument-extended-ultrabold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "League Gothic";
    src: url("../fonts/league-gothic-condensed.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter Tight";
    src: url("../fonts/inter-tight-400.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter Tight";
    src: url("../fonts/inter-tight-700.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Palette [V] e derivate [D] */
    --tp-ink: #420417;
    --tp-ink-deep: #2a020e;
    --tp-wine: #7a1f39;
    --tp-wine-glow: #a3304f;
    --tp-paper: #ffffff;
    --tp-paper-dim: rgba(255, 255, 255, 0.72);
    --tp-line: rgba(255, 255, 255, 0.16);

    /* Font */
    --tp-font-display: "Monument Extended", "Arial Black", sans-serif;
    --tp-font-dati: "League Gothic", "Arial Narrow", sans-serif;
    --tp-font-testo: "Inter Tight", system-ui, -apple-system, "Segoe UI", sans-serif;

    /* Scala tipografica fluida (390 → 1440 px) */
    --tp-fs-small: clamp(0.875rem, 0.85rem + 0.1vw, 0.9375rem);
    --tp-fs-base: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
    --tp-fs-lead: clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
    --tp-fs-h2: clamp(1.5rem, 1.2rem + 1.4vw, 2.5rem);
    --tp-fs-h1: clamp(2rem, 1.4rem + 2.8vw, 4rem);
    --tp-fs-dati: clamp(1.25rem, 1.1rem + 0.6vw, 1.75rem);

    /* Spazi e misure */
    --tp-gutter: clamp(1rem, 0.5rem + 2.5vw, 3rem);
    --tp-max: 90rem;
    --tp-testo-max: 68ch;
    --tp-header-h: 4.5rem;

    /* Movimento */
    --tp-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --tp-durata: 0.6s;
}