/* ============================================================================
   THEME 01 — HAIRLOOM  (Bauhaus Color-Block)   ★ LEAD THEME / MAIN PALETTE
   ----------------------------------------------------------------------------
   From reference #1. Warm cream canvas carved into hard rectangular fields of
   red, golden-yellow, cobalt and navy; photography cropped into the grid;
   ultra-bold condensed uppercase display. This is the deck's home base and
   supplies the MAIN color scheme. Apply by adding class="theme-01" to a slide
   (or to .reveal for a whole-deck default).
   ============================================================================ */

.theme-01 {
  /* --- Palette (literal Hairloom) --------------------------------------- */
  --cream:  #F3EFE4;   /* warm off-white — the dominant base (60%)          */
  --red:    #E5352B;   /* pillarbox red  — primary accent / hero blocks (30)*/
  --yellow: #F4C220;   /* golden yellow  — highlight / energy (10)          */
  --blue:   #2A38C6;   /* cobalt blue    — secondary structural block        */
  --navy:   #1B2559;   /* deep navy      — dark title/close slides           */
  --ink-dark: #16150F; /* near-black text on light                          */

  /* --- Role tokens (what the deck-base + slides actually read) ----------- */
  --bg:        var(--cream);
  --ink:       var(--ink-dark);
  --accent:    var(--red);        /* default accent = red                    */
  --on-accent: #FFFFFF;           /* text/ink sitting on the accent          */
  --grid-gap:  0px;               /* Bauhaus blocks butt edge-to-edge        */
  --edge:      6%;                /* default outer padding for .pad          */

  background: var(--bg); color: var(--ink);
}

/* Accent overrides — switch the accent per slide without leaving the theme.
   e.g. <section class="theme-01 accent-blue">                                */
.theme-01.accent-red    { --accent: var(--red);    --on-accent:#fff; }
.theme-01.accent-blue   { --accent: var(--blue);   --on-accent:#fff; }
.theme-01.accent-yellow { --accent: var(--yellow); --on-accent: var(--ink-dark); }
.theme-01.accent-navy   { --accent: var(--navy);   --on-accent:#fff; }

/* Dark title/close variant: navy field, cream ink */
.theme-01.dark {
  --bg: var(--navy); --ink: #F3EFE4; --accent: var(--yellow); --on-accent: var(--ink-dark);
}
.theme-01.dark .meta { color: #F3EFE4; }

/* Hairloom hero: the giant word, ink on cream, with the color-bar reveal
   inheriting the accent. Keep tracking tight and weight maximal.            */
.theme-01 .hero { color: var(--ink); }
.theme-01 .display, .theme-01 .display-sm { color: var(--ink); }

/* The signature motif for Theme 01: a thick single-side border strip.
   Add .strip-left / .strip-top to any .cell to pin a colored spine.         */
.theme-01 .strip-left  { border-left: 0.7rem solid var(--accent); padding-left: calc(8% + 0.7rem); }
.theme-01 .strip-top   { border-top: 0.7rem solid var(--accent); }

/* Quote mark + rules pick up the accent automatically via deck-base. */