/**
 * « Entre terre et ciel » — design tokens
 * Single source of truth for colour, type, motion and the graphic signs.
 * Every other stylesheet reads these variables; no raw colour elsewhere.
 *
 * Intended proportions on a page: 70 % nuit/lapis, 20 % cire/pierre,
 * 9 % or, 1 % cinabre (Book button, Holy Week dates — never as text on nuit).
 */

:root {
    /* ── Palette ─────────────────────────────────────────────────────── */
    --nuit:    #0D1428;  /* background */
    --lapis:   #1E3570;  /* depth, gradients */
    --or:      #C9A55E;  /* accent, rules, links */
    --cire:    #F1E6CC;  /* main text */
    --pierre:  #A49D90;  /* secondary text */
    --cinabre: #A33A28;  /* very rare: Book button, Holy Week dates */

    /* Light "pierre" variant (press / print) */
    --pierre-fond:  #ECE6DA;
    /* Derived for legibility on --pierre-fond (gold and stone text fail AA there):
       or-encre 5.7:1, pierre-encre 6.0:1 */
    --or-encre:     #6E5520;
    --pierre-encre: #5A544B;

    /* ── Semantic roles (what components use) ────────────────────────── */
    --c-bg:          var(--nuit);
    --c-bg-deep:     #080D1C;                             /* footer, player: one step below nuit */
    --c-surface:     #111B38;  /* cards: 22 % lapis into nuit */
    --c-surface-2:   #142143;  /* inputs, hover: 38 % lapis into nuit */
    --c-text:        var(--cire);                         /* 14.8:1 on nuit */
    --c-text-2:      var(--pierre);                       /* 6.8:1 on nuit */
    --c-accent:      var(--or);                           /* 7.9:1 on nuit */
    --c-accent-text: var(--or);                           /* gold used as text */
    --c-on-accent:   var(--nuit);                         /* text on a gold fill */
    --c-line:        rgba(201, 165, 94, 0.28);   /* or at 28 % */
    --c-line-soft:   rgba(241, 230, 204, 0.10); /* cire at 10 % */
    --c-rare:        var(--cinabre);                      /* fill only; cire on it is 5.3:1 */
    --c-on-rare:     var(--cire);
    --c-focus:       var(--or);
    --c-success:     #7FB58A;
    --c-error:       #E08A7A;

    /* ── Typography ──────────────────────────────────────────────────── */
    --font-titre:  'Marcellus', 'Amiri', 'Trajan Pro', Georgia, serif;   /* capitals, never bold */
    --font-texte:  'EB Garamond', 'Amiri', Garamond, Georgia, serif;
    --font-arabe:  'Amiri', 'Noto Naskh Arabic', 'Geeza Pro', serif;     /* same size as Latin */

    --titre-tracking: 0.12em;   /* .1–.14em */
    --texte-taille:   1.1875rem; /* 19px: Garamond's small x-height needs it */
    --texte-interligne: 1.6;

    --fs-xs:  0.8125rem;  /* 13 */
    --fs-sm:  0.9375rem;  /* 15 */
    --fs-md:  1.1875rem;  /* 19 */
    --fs-lg:  1.5rem;     /* 24 */
    --fs-xl:  clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem);
    --fs-2xl: clamp(2.25rem, 1.4rem + 4vw, 4.5rem);

    /* ── Space & layout ──────────────────────────────────────────────── */
    --gutter:   clamp(16px, 4vw, 40px);
    --measure:  38rem;          /* comfortable line length */
    --page-max: 1200px;
    --section-y: clamp(64px, 10vw, 128px);
    --radius-s: 4px;

    /* ── Graphic signs ───────────────────────────────────────────────── */
    --arche-radius: 999px 999px var(--radius-s) var(--radius-s);   /* portrait photos */
    --arche-radius-large: 50% 50% var(--radius-s) var(--radius-s) / 24% 24% var(--radius-s) var(--radius-s); /* 16:9 media */
    --rai: linear-gradient(to bottom, var(--or), transparent);       /* 1px light ray */

    /* ── Motion: one curve for the whole site, 600–1600 ms ───────────── */
    --ease:    cubic-bezier(.22, 1, .36, 1);
    --dur-1:   600ms;
    --dur-2:   1100ms;
    --dur-3:   1600ms;

    color-scheme: dark;
}

/* Light "pierre" variant: press kit, print, or any block with data-theme="pierre" */
[data-theme="pierre"] {
    --c-bg:          var(--pierre-fond);
    --c-bg-deep:     #E1D9C9;
    --c-surface:     #F4EFE5;
    --c-surface-2:   #E6DECF;
    --c-text:        var(--nuit);          /* 14.7:1 */
    --c-text-2:      var(--pierre-encre);
    --c-accent:      var(--or);            /* rules and ornaments only */
    --c-accent-text: var(--or-encre);
    --c-on-accent:   var(--nuit);
    --c-line:        rgba(201, 165, 94, 0.55);
    --c-line-soft:   rgba(13, 20, 40, 0.12);
    --c-focus:       var(--or-encre);
    color-scheme: light;
}

@media print {
    :root {
        --c-bg:          #fff;
        --c-bg-deep:     #fff;
        --c-surface:     #fff;
        --c-surface-2:   #fff;
        --c-text:        var(--nuit);
        --c-text-2:      var(--pierre-encre);
        --c-accent-text: var(--or-encre);
        --c-line:        var(--or);
        color-scheme: light;
    }
}
