/* ============================================================
   PALETTE A — drawn from LOGO SC-01.
   Extracted from site-01.html so every page in the 01 family
   (home, about, gallery, get-involved) shares ONE definition.
   A page picks its identity by linking this file or palette-02.
   NOTE: url() values are bare (no assets/ prefix) — they resolve
   against this stylesheet, which already lives in assets/.
   ============================================================ */
  /* Ochre · Terracotta · Olive · Navy · Slate
     Mood: heritage, warm, grounded. Earth pigments on warm paper.
     This file is the ONLY difference from the palette-02 family. */
  :root {
    /* the five logo colours, verbatim from LOGO SC-01.svg */
    --brand-1: #D1871A;   /* ochre      — the circle       */
    --brand-2: #C4451C;   /* terracotta — the petal        */
    --brand-3: #6B785C;   /* olive      — the leaf         */
    --brand-4: #2E4B75;   /* navy       — the arch         */
    --brand-5: #284654;   /* slate      — the deep accent  */

    /* hero tile: a plain dot grid, no separate SVG asset needed */
    --hero-texture: radial-gradient(var(--primary) 1px, transparent 1.4px);
    --hero-texture-size: 18px 18px;
    --hero-texture-opacity: 0.22;   /* a dot grid this fine needs more than the 0.06 default to read */

    /* the painted illustration replaces the photo — shown crisp, not blurred,
       since it's finished artwork rather than a mood backdrop. Its own
       composition is full-bleed (road, stone block, tower, second road,
       skyline), wider than the hero itself, so cover always shows its full
       width with no horizontal crop available — the fade mask is what does
       the framing, not background-position. */
    --hero-photo: url("hero-painting-wide2.png");
    --hero-photo-blur: 0px;
    --hero-photo-saturate: 1;
    --hero-photo-opacity: 0.92;
    --hero-photo-position: center 38%;
    /* linear, not radial: a radial spotlight either hides the tower itself
       (centered far enough right to clear the text) or fades the road back
       out before the image's own right edge. A long, gentle left-to-right
       ramp starts revealing very early (18%) so most of the painting shows —
       even the stone block's window grid, faintly, behind the lede — while
       the long run to full strength (80%) keeps it faint enough under the
       text itself not to fight it. */
    --hero-photo-mask: linear-gradient(to right, transparent 0%, transparent 18%, #000 80%);

    /* subpage band gets its own wide/short crop (1619x607) rather than the
       home hero's tall one (1619x971) — a short band cropping the tall
       image loses most of the building; this one is already framed for
       a wide strip. TRIAL: user asked to try it, not yet confirmed. */
    --page-hero-photo: url("hero-involved.png");
    --page-hero-photo-position: center 42%;
    --page-hero-photo-opacity: 0.8;

    /* roles */
    --primary: #2E4B75;
    --primary-deep: #223A5C;
    --accent: #C4451C;
    --highlight: #D1871A;
    --on-primary: #FFF9F0;
    --on-accent: #FFF9F0;

    /* neutrals — warm white + natural wood, from the CANVAS board */
    --ink: #24313D;
    --muted: #6A6F6F;
    --paper: #FBF7F0;
    --surface: #F3ECE0;
    --surface-2: #EBE2D3;
    --line: #E0D6C6;
    --hero-bg: #FBF7F0;
    --canvas-bg: #FFFFFF;

    --shadow-soft: 0 20px 50px -22px rgba(40, 70, 84, 0.30);
    --shadow-lift: 0 20px 44px -18px rgba(196, 69, 28, 0.42);

    /* shape language: squarer, more architectural */
    --btn-radius: 4px;
    --blk-radius: 4px;
    --chip-radius: 12px;

    /* ---------------------------------------------------------------
       the eight programs — colour-science pass, 2026-08-20

       WHAT WAS ALREADY RIGHT (kept unchanged): the raw logo hues form
       a near-complementary pair — warm cluster (terracotta 15°, ochre
       36°) sits only 2° off the true complement of the cool cluster
       (slate 199°, navy 216°). And olive (88°) sits only 0.6° off a
       real triadic angle of that cool cluster. The geometry was
       already sound; art/music/photography keep their literal brand
       hex below because they already pass contrast and ARE the brand.

       WHAT WAS WRONG, measured with the WCAG 2.1 relative-luminance
       formula against the real --on-accent white (#FFF9F0), not a
       guess: theater/literature/crafts/dance all sit under the 4.5:1
       AA text-contrast floor when used as filled chip/badge
       backgrounds with white labels (theater was 2.79:1 — visibly
       washed out). Fixed by holding hue, solving lightness by binary
       search for ≥4.6:1 (olive's saturation raised 13%→34% too, since
       at its correct triadic angle it was too weak in chroma to read
       as deliberate rather than as a grey afterthought).

       crafts/movie/dance were also HUE-REDUNDANT — each sat within 15°
       of an existing brand colour (crafts + theater/art, dance + art,
       movie + music/photography), so three of eight "different"
       programs were really the same one or two hues at different
       lightness. That's a real accessibility problem for red-green
       colour-blind users (~8% of men), not just a look. Moved each to
       an empty region of the wheel: crafts→58° bridges ochre/olive
       (still earthy), movie→255° indigo (still cool/nocturnal, fits a
       screening room), dance→340° berry (still warm, no longer a
       terracotta twin). True green/cyan (90–195°) stays empty on
       purpose — the logo has no green, so this doesn't invent one.
       --------------------------------------------------------------- */
    --p-art:         #C4451C;   /* unchanged — literal terracotta, 4.76:1 */
    --p-music:       #2E4B75;   /* unchanged — literal navy, 8.43:1 */
    --p-theater:     #9D6614;   /* was #D1871A (2.79:1) — same 36° hue, darkened for 4.62:1 */
    --p-photography: #284654;   /* unchanged — literal slate, 9.58:1 */
    --p-literature:  #5E7A3C;   /* was #6B785C (4.49:1) — same 87° triadic hue, sat 13%→34%, 4.64:1 */
    --p-crafts:      #777526;   /* was #A9713F, redundant w/ ochre — moved to 58°, 4.60:1 */
    --p-movie:       #624E9D;   /* was #4A6B7C, redundant w/ navy — moved to 255° indigo, 6.48:1 */
    --p-dance:       #B63560;   /* was #B85C3C, redundant w/ terracotta — moved to 340° berry, 5.47:1 */
  }