/*
 * theme.css — ALL design tokens live here.
 *
 * This is the only file that needs to change for a full rebrand.
 * No colour, font, or spacing values appear anywhere else in the codebase.
 *
 * The Colour and Typography blocks below are AUTO-GENERATED by
 * ../../sync_brand.py from ../../brand.json (the collective's single
 * source of truth — see ../../BRANDING.md). Don't hand-edit between the
 * BRAND markers; edit brand.json and run the sync script instead. It also
 * runs automatically on every commit in this repo via the pre-commit hook.
 *
 * Layout, grid, card, and other structural tokens below are not brand
 * values and are edited directly in this file.
 *
 * To add a Google Font, uncomment and edit the @import line, then update
 * brand.json's typography fields (not this file directly).
 */

/* @import url('https://fonts.googleapis.com/css2?family=YourFont&display=swap'); */

:root {
  /* --- Colour --- */
  /* BRAND:COLORS:START */
  --color-bg:              #0d0d0d;
  --color-surface:         #181818;
  --color-surface-hover:   #212121;
  --color-border:          #2c2c2c;
  --color-border-hover:    #ffd000;

  --color-text-primary:    #f2f2f2;
  --color-text-secondary:  #888888;

  --color-accent:          #ffd000;
  --color-accent-hover:    #ffe840;
  /* BRAND:COLORS:END */

  /* --- Typography --- */
  /* BRAND:FONTS:START */
  --font-heading:   system-ui, sans-serif;
  --font-body:      system-ui, sans-serif;
  /* BRAND:FONTS:END */

  --text-heading-size:   2.75rem;
  --text-tagline-size:   1rem;
  --text-name-size:      1.85rem;
  --text-base-size:      16px;
  --text-section-title-size: 1.5rem;
  --text-nav-size:       0.95rem;
  --text-small-size:     0.85rem;

  /* --- Layout --- */
  --max-width:       1280px;
  --page-padding-x:  2rem;
  --page-padding-y:  3rem;
  --section-gap:     3rem;

  /* --- Nav --- */
  --nav-padding-y:   1.25rem;
  --nav-gap:         2rem;
  --nav-logo-size:   2.25rem;

  /* --- Grid --- */
  --grid-gap:        1.5rem;
  --grid-min-col:    260px;   /* card minimum width before wrapping */

  /* --- Cards --- */
  --card-padding:    1.75rem;
  --card-radius:     10px;

  /* --- Avatars --- */
  --avatar-size:     185px;
  --avatar-radius:   50%;

  /* --- Social icons --- */
  --icon-size:       2rem;
  --icon-gap:        1.25rem;

  /* --- Events --- */
  --poster-aspect-ratio: 3 / 4;
  --event-hero-gap:      2.5rem;
  --event-hero-poster-width: 340px;
  --event-hero-max-width: 860px;
  --event-grid-min-col:  220px;
  --event-grid-max-col:  280px;

  /* --- Gallery --- */
  --gallery-min-col:        220px;
  --gallery-aspect-ratio:   1 / 1;

}