/* ==========================================================================
   PBN Zora — brand skin (REVISED palette). The Zora icon is a white "Z" over an
   orange SUNRISE — so the UI is now sunrise, not purple: coral/orange primary,
   warm peach/cream surfaces, sky-blue secondary, dark-slate ink. Character:
   DAWN, BRIGHT, VISUAL, SHAREABLE. Archetype: card-masonry (rounded, soft-shadow,
   playful). No purple/violet/magenta as a UI colour (that stays Tera's identity).
   Distinct from every other brand on a small thumbnail.
   ========================================================================== */
:root {
  --c-primary: #c2410c;        /* deep coral — AA on cream/white (chrome + text) */
  --c-primary-700: #9a3412;
  --c-primary-100: #ffe7d6;    /* soft peach */
  --c-accent: #0369a1;         /* sky-blue (deep) — secondary, AA-safe */
  --c-accent-100: #e0f2fe;     /* pale blue */
  --c-on-primary: #ffffff;
  --c-on-accent: #ffffff;
  --c-sunrise: #f97316;        /* bright sunrise — decorative fills/gradients */
  --c-sky: #38bdf8;            /* bright sky — decorative */

  --c-bg: #fff7ed;             /* warm cream */
  --c-surface: #ffffff;
  --c-surface-2: #ffe7d6;      /* peach */
  --c-text: #0f172a;           /* dark slate ink */
  --c-text-muted: #6b6052;     /* warm muted */
  --c-border: #f3ddc9;         /* warm peach border */

  --c-header-bg: #c2410c;      /* deep coral header — white name + tagline pass AA */
  --c-header-text: #ffffff;
  --c-header-muted: #fff2ea;   /* tagline: AA on coral */
  --c-topbar-bg: #9a3412;
  --c-footer-bg: #7a2e12;      /* deep terracotta — warm, not slate/dark-dashboard */
}

.brand .custom-logo { aspect-ratio: 1 / 1; width: auto; }

/* Dawn gradient masthead rule — sunrise coral -> sky (both signature colours). */
.site-header { border-bottom: 3px solid; border-image: linear-gradient(90deg, var(--c-sunrise), var(--c-sky)) 1; }

/* Bright, rounded, playful cards (coral-tinted shadow). */
.cm { --cm-radius: 16px; }
.cm-card { box-shadow: 0 4px 16px rgba(194, 65, 12, .08); transition: transform .2s ease, box-shadow .2s ease; }
.cm-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(194, 65, 12, .18); }
.cm-card:hover .cm-card__media img { transform: scale(1.07); }

/* Coral identity on every card; a pop of sky on hover for the dawn contrast. */
.cm-card__cat { color: var(--c-primary); }
.cm-card__title a:hover { color: var(--c-accent); }
.cm-head__title { color: var(--c-primary); }
.cm-head { border-bottom-color: var(--c-sunrise); }

/* Text cards = a soft dawn wash: peach -> pale blue (keeps the wall visual). */
.cm-card--text { background: linear-gradient(135deg, var(--c-primary-100), var(--c-accent-100)); border: 0; }

@media (prefers-reduced-motion: reduce) {
  .cm-card { transition: none; }
  .cm-card:hover { transform: none; }
}