/* Per-rubric identity. The body carries one gi-cat-* class; every editorial
   surface reads these five tokens, so the whole page turns with the category
   instead of only its hero illustration. Hues stay inside the garden palette:
   earth, bark, lichen, bloom and stone, never a saturated UI colour.

   ground — the dark editorial field a hero sits on
   deep   — the same field, one step down, for gradient depth
   accent — bright mark on the dark field (eyebrows, arrows, rules)
   wash   — light surface on the ivory page (chips, cards, notes)
   line   — border on the ivory page
   ink    — accent text on the ivory page; every value clears 4.5:1 on ivory */

:root,
.gi-cat-journal {
    --gi-cat-ground: oklch(33.74% .052 152);
    --gi-cat-deep: oklch(27.5% .046 154);
    --gi-cat-accent: oklch(90% .056 145);
    --gi-cat-wash: oklch(96.4% .013 140);
    --gi-cat-line: oklch(88.5% .026 138);
    --gi-cat-ink: oklch(44% .058 148);
}
.gi-cat-jardinage {
    --gi-cat-ground: oklch(32.5% .056 158);
    --gi-cat-deep: oklch(26.5% .05 160);
    --gi-cat-accent: oklch(90% .06 150);
    --gi-cat-wash: oklch(96.2% .015 148);
    --gi-cat-line: oklch(88% .03 146);
    --gi-cat-ink: oklch(43.5% .062 154);
}
.gi-cat-potager {
    --gi-cat-ground: oklch(34% .062 96);
    --gi-cat-deep: oklch(27.5% .054 94);
    --gi-cat-accent: oklch(90.5% .066 102);
    --gi-cat-wash: oklch(96.4% .018 100);
    --gi-cat-line: oklch(88% .036 100);
    --gi-cat-ink: oklch(44.5% .068 96);
}
.gi-cat-fleurs {
    --gi-cat-ground: oklch(33.5% .054 352);
    --gi-cat-deep: oklch(27% .048 353);
    --gi-cat-accent: oklch(90% .048 350);
    --gi-cat-wash: oklch(96.4% .015 350);
    --gi-cat-line: oklch(88% .03 350);
    --gi-cat-ink: oklch(44% .062 352);
}
.gi-cat-arbres {
    --gi-cat-ground: oklch(33% .05 62);
    --gi-cat-deep: oklch(26.5% .044 60);
    --gi-cat-accent: oklch(90% .052 70);
    --gi-cat-wash: oklch(96.3% .015 68);
    --gi-cat-line: oklch(88% .032 66);
    --gi-cat-ink: oklch(44% .06 62);
}
.gi-cat-amenagement {
    --gi-cat-ground: oklch(34% .04 232);
    --gi-cat-deep: oklch(27.5% .036 234);
    --gi-cat-accent: oklch(90% .042 228);
    --gi-cat-wash: oklch(96.4% .013 230);
    --gi-cat-line: oklch(88% .026 230);
    --gi-cat-ink: oklch(44.5% .052 232);
}
.gi-cat-ecologie {
    --gi-cat-ground: oklch(33% .07 132);
    --gi-cat-deep: oklch(26.5% .062 134);
    --gi-cat-accent: oklch(90.5% .075 128);
    --gi-cat-wash: oklch(96.4% .019 128);
    --gi-cat-line: oklch(88% .038 128);
    --gi-cat-ink: oklch(43.5% .075 132);
}
.gi-cat-saisons {
    --gi-cat-ground: oklch(34% .068 52);
    --gi-cat-deep: oklch(27.5% .06 50);
    --gi-cat-accent: oklch(90.5% .066 62);
    --gi-cat-wash: oklch(96.5% .019 60);
    --gi-cat-line: oklch(88% .038 58);
    --gi-cat-ink: oklch(44.5% .072 50);
}
.gi-cat-maison {
    --gi-cat-ground: oklch(33.5% .058 28);
    --gi-cat-deep: oklch(27% .05 26);
    --gi-cat-accent: oklch(90% .052 32);
    --gi-cat-wash: oklch(96.4% .017 30);
    --gi-cat-line: oklch(88% .032 30);
    --gi-cat-ink: oklch(44% .065 28);
}

/* The twelve months. A calendar page reads as its season before it reads as a
   month: cold light in deep winter, rising green through spring, warm gold at
   the height of summer, then russet and bare wood into winter again. The same
   six tokens as the rubrics, so every surface already knows what to do. */
.gi-cat-mois-janvier   { --gi-cat-ground: oklch(33% .038 248); --gi-cat-deep: oklch(26.5% .034 250); --gi-cat-accent: oklch(90% .04 244); --gi-cat-wash: oklch(96.4% .013 244); --gi-cat-line: oklch(88% .026 244); --gi-cat-ink: oklch(44% .05 248); }
.gi-cat-mois-fevrier   { --gi-cat-ground: oklch(33.5% .034 268); --gi-cat-deep: oklch(27% .03 270); --gi-cat-accent: oklch(90% .036 264); --gi-cat-wash: oklch(96.4% .012 264); --gi-cat-line: oklch(88% .024 264); --gi-cat-ink: oklch(44.5% .046 268); }
.gi-cat-mois-mars      { --gi-cat-ground: oklch(33.5% .052 168); --gi-cat-deep: oklch(27% .046 170); --gi-cat-accent: oklch(90.5% .056 160); --gi-cat-wash: oklch(96.4% .015 160); --gi-cat-line: oklch(88% .03 160); --gi-cat-ink: oklch(44% .058 168); }
.gi-cat-mois-avril     { --gi-cat-ground: oklch(33.5% .062 146); --gi-cat-deep: oklch(27% .054 148); --gi-cat-accent: oklch(90.5% .066 140); --gi-cat-wash: oklch(96.4% .017 140); --gi-cat-line: oklch(88% .034 140); --gi-cat-ink: oklch(43.5% .068 146); }
.gi-cat-mois-mai       { --gi-cat-ground: oklch(34% .07 132); --gi-cat-deep: oklch(27.5% .062 134); --gi-cat-accent: oklch(90.5% .074 126); --gi-cat-wash: oklch(96.5% .019 126); --gi-cat-line: oklch(88% .038 126); --gi-cat-ink: oklch(44% .075 132); }
.gi-cat-mois-juin      { --gi-cat-ground: oklch(34.5% .07 116); --gi-cat-deep: oklch(28% .062 116); --gi-cat-accent: oklch(91% .074 112); --gi-cat-wash: oklch(96.5% .02 112); --gi-cat-line: oklch(88% .04 112); --gi-cat-ink: oklch(44.5% .076 116); }
.gi-cat-mois-juillet   { --gi-cat-ground: oklch(34.5% .07 96); --gi-cat-deep: oklch(28% .062 96); --gi-cat-accent: oklch(91% .072 98); --gi-cat-wash: oklch(96.5% .02 98); --gi-cat-line: oklch(88% .04 98); --gi-cat-ink: oklch(45% .074 96); }
.gi-cat-mois-aout      { --gi-cat-ground: oklch(34.5% .072 78); --gi-cat-deep: oklch(28% .064 76); --gi-cat-accent: oklch(91% .07 82); --gi-cat-wash: oklch(96.5% .02 82); --gi-cat-line: oklch(88% .04 82); --gi-cat-ink: oklch(45% .076 78); }
.gi-cat-mois-septembre { --gi-cat-ground: oklch(34% .068 58); --gi-cat-deep: oklch(27.5% .06 56); --gi-cat-accent: oklch(90.5% .066 64); --gi-cat-wash: oklch(96.5% .019 64); --gi-cat-line: oklch(88% .038 64); --gi-cat-ink: oklch(44.5% .072 58); }
.gi-cat-mois-octobre   { --gi-cat-ground: oklch(33.5% .07 42); --gi-cat-deep: oklch(27% .062 40); --gi-cat-accent: oklch(90.5% .062 48); --gi-cat-wash: oklch(96.4% .018 48); --gi-cat-line: oklch(88% .036 48); --gi-cat-ink: oklch(44% .074 42); }
.gi-cat-mois-novembre  { --gi-cat-ground: oklch(33% .052 28); --gi-cat-deep: oklch(26.5% .046 26); --gi-cat-accent: oklch(90% .048 32); --gi-cat-wash: oklch(96.4% .015 32); --gi-cat-line: oklch(88% .03 32); --gi-cat-ink: oklch(43.5% .06 28); }
.gi-cat-mois-decembre  { --gi-cat-ground: oklch(32.5% .04 228); --gi-cat-deep: oklch(26% .036 230); --gi-cat-accent: oklch(90% .042 224); --gi-cat-wash: oklch(96.3% .013 224); --gi-cat-line: oklch(88% .026 224); --gi-cat-ink: oklch(43.5% .052 228); }

/* The traced sprig is a single-colour silhouette, so it is painted through a
   mask and inherits whichever accent the current rubric is using. */
.gi-sprig {
    background: currentColor;
    display: block;
    flex: 0 0 auto;
    -webkit-mask: url('../images/botanical-sprig-mark.svg') no-repeat center / contain;
    mask: url('../images/botanical-sprig-mark.svg') no-repeat center / contain;
    pointer-events: none;
}

/* The rubric drives the whole page, chrome included. Aliasing the shared tokens
   on the body means every existing rule — links, hovers, active states, borders,
   buttons, washes — follows the category without being rewritten one by one. */
body {
    --gi-moss-900: var(--gi-cat-ground);
    --gi-moss-800: var(--gi-cat-deep);
    --gi-moss-700: var(--gi-cat-ink);
    --gi-sage-100: var(--gi-cat-wash);
    --gi-sage-300: var(--gi-cat-line);
    --gi-lime: var(--gi-cat-accent);
    --gi-border: var(--gi-cat-line);
    --gi-focus: var(--gi-cat-ink);

    /* Header and footer keep a near-paper surface so the fixed-colour logo still
       sits correctly; the rubric arrives as a tint, and at full strength on every
       interactive state. */
    --gi-header-tint: color-mix(in oklch, var(--gi-cat-wash) 62%, var(--gi-brand-paper));
    --gi-footer-surface: color-mix(in oklch, var(--gi-cat-wash) 78%, var(--gi-brand-paper));
}

/* Navigation: hover, focus and the current rubric all read as the category. */
.gi-site-header {
    --gi-header-surface: var(--gi-header-tint);
    --gi-header-line: var(--gi-cat-line);
    --gi-header-field: color-mix(in oklch, var(--gi-cat-wash) 70%, var(--gi-brand-paper));
    --gi-header-field-line: var(--gi-cat-line);
    --gi-header-soft: var(--gi-cat-wash);
    --gi-header-soft-strong: color-mix(in oklch, var(--gi-cat-line) 70%, var(--gi-cat-wash));
    --gi-header-accent: var(--gi-cat-ink);
    --gi-header-accent-dark: var(--gi-cat-ground);
}
.gi-menu > .current-menu-item > a,
.gi-menu > .current-menu-ancestor > a,
.gi-menu > .current-menu-parent > a { text-decoration-color: var(--gi-cat-ink); }
.gi-join-access { background: var(--gi-cat-ground); border-color: var(--gi-cat-ground); }
.gi-join-access:hover { background: var(--gi-cat-deep); border-color: var(--gi-cat-deep); }