/* ============================================================
   THEME: the only CSS file you change for each client.
   Colours, fonts and corner roundness live here. site.css reads
   these variables, so the whole site follows along.
   ============================================================ */

:root {
  /* Brand colours */
  --brand: #2f6b3c;         /* main colour: buttons, links, logo square */
  --on-brand: #ffffff;      /* text on --brand */
  --accent: #f5b638;        /* call buttons and small highlights */
  --on-accent: #1f1a0e;     /* text on --accent */

  /* Big bands: hero, page headers and footer */
  --hero: #1d3b26;
  --on-hero: #f6f1e4;

  /* Page colours */
  --bg: #fbf8f1;            /* page background */
  --surface: #f1ebdc;       /* every second section, form background */
  --text: #1f2a20;          /* body text */
  --muted: #565f4e;         /* secondary text */
  --line: #e1d9c5;          /* borders and dividers */

  /* Fonts. System fonts load instantly; to use a Google Font, see README.md. */
  --font-heading: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --heading-weight: 700;
  --heading-case: none;      /* none, or uppercase */
  --heading-tracking: -0.01em;
  --heading-stretch: normal; /* normal, or condensed for fonts that have a narrow version */

  /* Shape: 0 = sharp corners, 10px = soft, 20px = very round */
  --radius: 6px;
}

/* Extras for this site */
:root {
  --photo-shadow: 14px 14px 0 var(--accent);
}

/* ------------------------------------------------------------
   nope. demo only: the "this is a demo" bar and notes.
   Not part of the client template.
   ------------------------------------------------------------ */
.demo-bar {
  padding: 9px var(--gutter);
  background: #0a0a0a;
  color: #fbfbf8;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 0.9rem;
  line-height: 1.45;
  text-align: center;
}
.demo-bar a { color: #c8ff00; font-weight: 700; }
.demo-bar a:focus-visible { outline-color: #c8ff00; }
.demo-bar__tag {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 8px;
  background: #c8ff00;
  color: #0a0a0a;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  vertical-align: 1px;
}
.demo-bar__cta { white-space: nowrap; }
.demo-note {
  max-width: 70ch;
  margin-bottom: 28px;
  padding: 12px 16px;
  background: var(--surface);
  border-left: 6px solid #c8ff00;
  color: var(--muted);
  font-size: 0.95rem;
}
.demo-note strong { color: var(--text); }