/* Brand theme for this deployment: Aday Interactive.
 * Values are measured from adayinteractive.com (computed styles, 2026-10-24) so the
 * academy reads as part of the main site. Colors are space-separated RGB channels so
 * Tailwind opacity modifiers work (e.g. bg-brand-primary/10). Edit this file to
 * re-skin; no rebuild needed. Template with notes: theme.example.css. */
:root {
  --brand-primary: 46 68 56;        /* #2E4438 canopy green: buttons */
  --brand-primary-dark: 31 46 42;   /* #1F2E2A hover, deep ink */
  --brand-accent: 184 106 76;       /* #B86A4C copper: links, badges */
  --brand-accent-dark: 142 78 55;   /* #8E4E37 hover */
  --brand-accent-deep: 142 78 55;   /* italic headline accent, as on the main site */
  --brand-cream: 245 240 229;       /* #F5F0E5 soft panels */
  --brand-canvas: 251 250 246;      /* #FBFAF6 page background */
  --brand-ink: 31 46 42;            /* #1F2E2A body text */
  --brand-rule: 229 221 201;        /* #E5DDC9 warm hairlines */

  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-sans: Inter, system-ui, sans-serif;
  --radius-brand: 1rem;

  /* Headings: serif at medium weight, tight tracking */
  --display-weight: 600;
  --headline-weight: 500;

  /* Buttons: pill, spaced capitals */
  --button-radius: 9999px;
  --button-size: 0.75rem;
  --button-weight: 600;
  --button-tracking: 0.14em;
  --button-case: uppercase;
  --button-ink: 251 250 246;

  /* Labels: tiny spaced capitals led by a gold dot */
  --eyebrow-size: 0.6875rem;
  --eyebrow-tracking: 0.22em;
  --eyebrow-ink: 31 46 42;
  --eyebrow-dot: 181 148 78;        /* #B5944E */
  --eyebrow-dot-display: block;

  --card-shadow: 0 2px 10px rgb(15 42 66 / 0.05);

  /* Header: frosted white over the page, gold hairline */
  --header-bg: 255 255 255;
  --header-bg-alpha: 0.8;
  --header-blur: 20px;
  --header-rule: 217 201 168;

  /* Footer: light, on the page color (brand.php footer.tone = 'light') */
  --footer-bg: 251 250 246;
  --footer-ink: 92 83 69;
  --footer-rule: 217 201 168;
  --footer-heading-font: "Instrument Sans", Inter, system-ui, sans-serif;
  --footer-heading-size: 0.75rem;
  --footer-heading-weight: 800;
  --footer-heading-case: uppercase;
  --footer-heading-tracking: 0.1em;
  --footer-heading-ink: 31 46 42;
  --footer-link-hover: 142 78 55;
  --footer-muted: 120 113 98;
  --footer-divider: 229 221 201;
  --footer-chip: 245 240 229;
}

/* Desktop container scale, copied from adayinteractive.com (css/styles.css,
   "Desktop container scale" + "ONE RAIL FROM 1280px UP") so the academy's
   left and right edges land on the same line as the main site at every width.
   The main site's nav and content rail sit at its 6xl token; the academy's
   rail is max-w-7xl + px-6, so 7xl here is the 6xl width plus that padding.
   Prose columns (2xl, 3xl) and the lesson page (5xl, prose with no inner
   limit) are deliberately not scaled, so lesson lines stay readable. Below 1280px nothing
   changes. */
@media (min-width: 1280px) {
  .max-w-7xl { max-width: 75rem; }
}
@media (min-width: 1536px) {
  .max-w-4xl { max-width: 60rem; }
  .max-w-6xl { max-width: 80rem; }
  .max-w-7xl { max-width: 83rem; }
}
@media (min-width: 1920px) {
  .max-w-4xl { max-width: 64rem; }
  .max-w-6xl { max-width: 90rem; }
  .max-w-7xl { max-width: 93rem; }
}
@media (min-width: 2560px) {
  .max-w-4xl { max-width: 68rem; }
  .max-w-6xl { max-width: 100rem; }
  .max-w-7xl { max-width: 103rem; }
}