/* ============================================================================
   CoreConsept · Design Tokens
   Single source of truth for typography, color, spacing, motion, shadow.
   Every component CSS must consume these — no raw values in components.
   ============================================================================ */

:root {
    /* ─── Typography families ────────────────────────────────────────────── */
    --cc-display: 'Fraunces', Georgia, 'Times New Roman', serif;
    --cc-body:    'Lora', Georgia, 'Times New Roman', serif;
    --cc-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
    /* These three were also restated in a :root block inside head.php's inline
       <style>. Being emitted after every stylesheet, that copy won every tie at
       equal specificity — so cc-rtl.css could not swap --cc-mono for an Arabic
       face, and this file was not really the owner of the type system it
       defines. The duplicate has been removed; keep it that way. */

    /* ─── Type scale (fluid) ─────────────────────────────────────────────── */
    --cc-fs-display:  clamp(48px, 6.4vw, 84px);
    --cc-fs-h1:       clamp(34px, 5vw,   60px);
    --cc-fs-h2:       clamp(26px, 3.4vw, 38px);
    --cc-fs-h3:       clamp(20px, 2.4vw, 26px);
    --cc-fs-h4:       clamp(17px, 1.6vw, 19px);
    --cc-fs-lead:     clamp(17px, 1.4vw, 19px);
    --cc-fs-body:     16px;
    --cc-fs-meta:     14px;
    --cc-fs-eyebrow:  11px;
    --cc-fs-mono-sm:  10px;
    --cc-fs-mono-xs:  9px;

    /* ─── Line-height & letter-spacing ───────────────────────────────────── */
    --cc-lh-display:  1.04;
    --cc-lh-tight:    1.2;
    --cc-lh-body:     1.65;
    --cc-lh-snug:     1.45;

    --cc-tracking-display: -0.02em;
    --cc-tracking-tight:   -0.01em;
    --cc-tracking-body:    0;
    --cc-tracking-mono:    0.18em;
    --cc-tracking-eyebrow: 0.22em;
    --cc-tracking-stamp:   0.32em;

    /* ─── Color · Brand ─────────────────────────────────────────────────── */
    --cc-orange:       #f15b29;  /* SURFACE colour. 3.35:1 on paper and
                                    3.16:1 on cream, so it clears the 3:1
                                    bar for a border or an icon but NOT
                                    the 4.5:1 that words owe. On the ink
                                    ground it is 5.20:1 and fine.        */
    --cc-orange-deep:  #d94d1f;  /* 4.17 paper / 3.93 cream — still short  */
    --cc-orange-text:  #a43e1c;  /* 6.39 paper, 6.03 cream, 4.92 sand: the
                                    only orange that may carry text on a
                                    light ground.                          */
    --cc-orange-soft:  #ffd9cc;
    --cc-orange-tint:  #fff1ec;

    /* ─── Color · Ink (text + dark surfaces) ─────────────────────────────── */
    --cc-ink:        #1a1a1a;
    --cc-ink-soft:   #6b6b6b;
    /* Was #8a8a8a: 3.45:1 on paper and 3.25:1 on cream, under AA on every
       light surface this theme uses. Hue unchanged, luminance moved until
       the darkest of them clears — 4.76 on sand, 5.84 on cream.          */
    --cc-ink-muted:  #616161;
    --cc-ink-faint:  #b8b0ab;

    /* ─── Color · Paper (light surfaces) ────────────────────────────────── */
    --cc-paper:       #ffffff;
    --cc-cream:       #fbf8f1;
    --cc-peach:       #fdf5f3;
    --cc-peach-deep:  #fbe5dd;
    --cc-warm:        #fbf6f3;

    /* ─── Color · Lines + dividers ──────────────────────────────────────── */
    --cc-line:         #ecdfdb;
    --cc-line-strong:  #d8c8c2;
    --cc-line-faint:   #f0e8e3;

    /* ─── Color · Status (banners) ──────────────────────────────────────── */
    --cc-ok:    #2e7d4f;
    --cc-warn:  #e0a106;
    --cc-err:   #c0392b;
    --cc-info:  var(--cc-orange);

    /* ─── Spacing scale (fluid) ─────────────────────────────────────────── */
    --cc-sp-0:  0;
    --cc-sp-1:  4px;
    --cc-sp-2:  8px;
    --cc-sp-3:  clamp(12px, 1vw,   16px);
    --cc-sp-4:  clamp(16px, 1.4vw, 20px);
    --cc-sp-5:  clamp(20px, 1.8vw, 28px);
    --cc-sp-6:  clamp(28px, 2.4vw, 36px);
    --cc-sp-7:  clamp(36px, 3.2vw, 48px);
    --cc-sp-8:  clamp(48px, 4.4vw, 64px);
    --cc-sp-9:  clamp(64px, 5.6vw, 80px);
    --cc-sp-10: clamp(80px, 7vw,   112px);
    --cc-sp-11: clamp(96px, 9vw,   144px);

    /* ─── Layout ────────────────────────────────────────────────────────── */
    --cc-page-width:   1280px;
    --cc-prose-width:  720px;

    /* ─── Border radius ─────────────────────────────────────────────────── */
    /* Editorial design — squares are the default. Anything > 0 is a deliberate exception. */
    --cc-radius-0:  0;
    --cc-radius-sm: 2px;

    /* ─── Border weights ────────────────────────────────────────────────── */
    --cc-border-hairline: 1px;
    --cc-border-rule:     1.5px;
    --cc-border-strong:   2px;

    /* ─── Interaction targets ───────────────────────────────────────────── */
    /* --cc-target-min is the WCAG 2.2 SC 2.5.8 (AA) floor; --cc-target is the
       comfortable size any control a finger has to hit should use. The finder
       shipped 26px-tall inputs against 42px selects, which is how both the
       inconsistency and the too-small target went unnoticed. */
    --cc-target-min: 24px;
    --cc-target:     44px;

    /* ─── Shadow ────────────────────────────────────────────────────────── */
    --cc-shadow-sm:  0 4px 14px -8px rgba(20, 20, 20, .12);
    --cc-shadow-md:  0 24px 60px -36px rgba(20, 20, 20, .18);
    --cc-shadow-lg:  0 40px 90px -48px rgba(20, 20, 20, .24);
    --cc-shadow-cta: 0 4px 14px rgba(241, 91, 41, .32);

    /* ─── Motion ────────────────────────────────────────────────────────── */
    --cc-ease:        cubic-bezier(0.2, 0.8, 0.2, 1);
    --cc-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --cc-dur-fast:    0.18s;
    --cc-dur:         0.25s;
    --cc-dur-slow:    0.4s;

    /* ─── Z-index ───────────────────────────────────────────────────────── */
    --cc-z-base:    1;
    --cc-z-raised:  10;
    --cc-z-sticky:  100;
    --cc-z-overlay: 1000;
    --cc-z-modal:   2000;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --cc-dur-fast: 0s;
        --cc-dur:      0s;
        --cc-dur-slow: 0s;
    }
}
