/* OBS VISION — design tokens
   Direction artistique : dark warm cinematic, accents cuivre bronze.
   Aucune couleur violet/mauve/magenta. Direction figée (pas de toggle light/dark). */

@font-face {
    font-family: "Fraunces";
    src: url("/assets/fonts/fraunces/fraunces-vf.woff2") format("woff2-variations");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Fraunces";
    src: url("/assets/fonts/fraunces/fraunces-vf-italic.woff2") format("woff2-variations");
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/inter-vf.woff2") format("woff2-variations");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "JetBrains Mono";
    src: url("/assets/fonts/jetbrains-mono/jetbrains-mono-vf.woff2") format("woff2-variations");
    font-weight: 100 800;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Palette obsidienne (fond) */
    --obsidian-1000: #0B0908;
    --obsidian-900:  #14110E;
    --obsidian-700:  #1E1A15;
    --obsidian-500:  #38302A;

    /* Texte */
    --paper:     #EFE7D8;
    --paper-dim: #BFB4A0;
    --mute:      #756B5E;

    /* Accent cuivre bronze */
    --copper:      #C77D45;
    --copper-deep: #8E5424;

    /* Système */
    --signal:  #5B8FA8;
    --success: #6B9555;
    --warn:    #D89342;
    --error:   #BD544A;

    /* Typographie */
    --font-display: "Fraunces", Georgia, "Times New Roman", serif;
    --font-ui:      "Inter", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

    /* Échelle fluide */
    --fs-display-xxl: clamp(4rem, 9vw + 1rem, 10rem);
    --fs-h1: clamp(2.5rem, 4vw + 1rem, 5.5rem);
    --fs-h2: clamp(1.75rem, 2.5vw + 1rem, 3rem);
    --fs-h3: clamp(1.375rem, 1.5vw + 0.75rem, 2rem);
    --fs-body: 1.0625rem;
    --fs-small: 0.9375rem;
    --fs-mono: 0.8125rem;

    /* Spacing 8pt */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 3rem;
    --sp-8: 4rem;
    --sp-9: 6rem;
    --sp-10: 8rem;

    /* Layout */
    --container-max: 1440px;
    --gutter: clamp(1rem, 2vw, 2rem);
    --side-margin: clamp(1.5rem, 6vw, 6rem);
    --frame-inset: 24px;

    /* Border radii (sobres) */
    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-lg: 8px;

    /* Easing & durations */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-expo: cubic-bezier(0.19, 1, 0.22, 1);
    --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);
    --t-fast: 180ms;
    --t-base: 280ms;
    --t-slow: 520ms;

    /* Z-index */
    --z-frame: 5;
    --z-grain: 8;
    --z-header: 50;
    --z-cursor: 9999;
    --z-modal: 100;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --t-fast: 0ms;
        --t-base: 0ms;
        --t-slow: 0ms;
    }
}
