/* Média Metri — Design tokens « Le Sceau » (direction A, accents « Point Zéro ») */

@font-face { font-family: 'Newsreader'; src: url('/assets/fonts/newsreader.woff2') format('woff2'); font-weight: 500 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Newsreader'; src: url('/assets/fonts/newsreader-italic.woff2') format('woff2'); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: 'IBM Plex Sans'; src: url('/assets/fonts/plex-sans.woff2') format('woff2'); font-weight: 400 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/assets/fonts/plex-mono-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }

:root {
    /* Couleurs — surfaces */
    --mm-paper:        #F5F1E8;
    --mm-paper-2:      #EDE7DA;
    --mm-card:         #FBF9F3;
    --mm-white:        #FFFFFF;

    /* Couleurs — texte (contrastes mesurés sur --mm-paper) */
    --mm-ink:          #13201C;   /* 14,9:1 */
    --mm-ink-2:        #4A5650;   /*  6,8:1 */
    --mm-ink-3:        #6B746F;   /*  4,5:1 — texte secondaire minimum */

    /* Couleurs — marque */
    --mm-seal:         #0C5A43;   /* 7,3:1 — action principale, certifié */
    --mm-seal-h:       #09452F;
    --mm-seal-tint:    #E3EDE6;
    --mm-seal-deep:    #0A3326;   /* fond des bandeaux sombres */
    --mm-okoume:       #9A4A26;   /* 5,5:1 — surtitres, accents éditoriaux */
    --mm-sun:          #F4C430;   /* ligne 0° — décoratif, jamais pour du texte sur papier */
    --mm-sun-soft:     #F8DE84;
    --mm-gold:         #B08D3C;

    /* Couleurs — traits */
    --mm-line:         #D6CDB9;
    --mm-line-soft:    #E4DDCD;

    /* Couleurs — états */
    --mm-danger:       #A3261B;
    --mm-danger-tint:  #F6E3DF;
    --mm-warning:      #8A5A00;
    --mm-warning-tint: #F7EBCB;
    --mm-info:         #1F5FA8;

    /* Bouton principal : vert sur fond clair, soleil sur fond sombre (voir DESIGN_TOKENS.md) */
    --mm-btn-primary-bg:          var(--mm-seal);       /* texte blanc 8,2:1 */
    --mm-btn-primary-bg-h:        var(--mm-seal-h);     /* 11,0:1 */
    --mm-btn-primary-text:        #FFFFFF;
    --mm-btn-primary-shadow:      0 1px 0 var(--mm-seal-h), 0 8px 20px -10px rgba(12,90,67,.65);
    --mm-btn-primary-dark-bg:     var(--mm-sun);        /* texte seal-deep 8,4:1 */
    --mm-btn-primary-dark-bg-h:   var(--mm-sun-soft);   /* 10,4:1 */
    --mm-btn-primary-dark-text:   var(--mm-seal-deep);
    --mm-btn-primary-dark-shadow: 0 8px 24px -12px rgba(0,0,0,.6);

    /* Typographie */
    --mm-f-display: 'Newsreader', Georgia, 'Times New Roman', serif;
    --mm-f-body:    'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --mm-f-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

    --mm-fs-xs:   .8125rem;   /* 13 */
    --mm-fs-sm:   .9375rem;   /* 15 */
    --mm-fs-base: 1.0625rem;  /* 17 */
    --mm-fs-lg:   1.1875rem;  /* 19 */
    --mm-fs-xl:   1.5rem;     /* 24 */
    --mm-fs-2xl:  clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem);
    --mm-fs-3xl:  clamp(2.6rem, 1.6rem + 4vw, 4.75rem);
    --mm-lh-tight: 1.05;
    --mm-lh-body:  1.6;
    --mm-track-caps: .14em;

    /* Espacements (base 4px) */
    --mm-s-1: 4px;  --mm-s-2: 8px;  --mm-s-3: 12px; --mm-s-4: 16px;
    --mm-s-5: 24px; --mm-s-6: 32px; --mm-s-7: 48px; --mm-s-8: 64px; --mm-s-9: 96px;
    --mm-gutter: clamp(20px, 4vw, 32px);
    --mm-max: 1240px;

    /* Rayons */
    --mm-r-xs: 2px; --mm-r-sm: 4px; --mm-r-md: 8px; --mm-r-lg: 14px; --mm-r-pill: 999px;

    /* Ombres */
    --mm-shadow-1: 0 1px 2px rgba(19,32,28,.06), 0 1px 0 rgba(255,255,255,.6) inset;
    --mm-shadow-2: 0 18px 40px -24px rgba(19,32,28,.35);
    --mm-shadow-3: 0 30px 60px -30px rgba(19,32,28,.45);
    --mm-ring:     0 0 0 3px rgba(154,74,38,.9);

    /* Mouvement */
    --mm-t-fast: 150ms;
    --mm-t-med:  240ms;
    --mm-t-slow: 300ms;
    --mm-ease:   cubic-bezier(.2,.7,.2,1);

    --mm-z-header: 100;
    --mm-z-menu:   200;
}