/* ============================================================
   Design tokens — the brand system. Mirror site.config.js `brand`.
   polskierezerwaty.pl — "PORANNA MGŁA": fog-pale green surfaces,
   deep spruce ink, sage accent, serif display (Fraunces). A quiet
   morning walk into the reserve — light theme, soft shadows.
   ============================================================ */
:root {
  /* surfaces (fog-light editorial) */
  --bg: #edf1ec;
  --bg-2: #e4eae4;
  --panel: #f6f8f4;
  --panel-2: #eaf0ea;

  /* ink */
  --ink: #1b2a22;
  --dim: rgba(27, 42, 34, .64);
  --faint: rgba(27, 42, 34, .40);
  --line: rgba(27, 42, 34, .14);
  --chalk: #24382e;

  /* accent — the one color people remember. Sage-spruce. */
  --accent: #3e7c5b;
  --accent-soft: rgba(62, 124, 91, .13);
  --accent-ink: #f2f7f2;
  /* text-safe accent — links/kickers/counts rendered AS TEXT. Light theme →
     darker shade of the accent. */
  --accent-deep: #2c6144;
  /* hover-hot accent — primary-button hover fill + card sweep gradient end.
     Name is engine contract; value is themed. */
  --amber-hot: #326a4b;

  /* semantic status — "good" (open/positive) + "warn" (closed/negative).
     Names are engine contract; light theme → dark shades. */
  --moss: #2e7a4c;
  --moss-soft: rgba(46, 122, 76, .11);
  --rust: #a8512f;
  --rust-soft: rgba(168, 81, 47, .09);

  /* type — mirror config.brand */
  --f-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --f-body: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* geometry — radii, page gutter, content width */
  --r-s: 10px; --r-m: 16px; --r-l: 24px; --r-pill: 999px;
  --pad: clamp(20px, 4.5vw, 56px);
  --maxw: 1200px;

  /* motion */
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .4, 1);

  /* elevation — light theme: near-invisible shadows, soft accent ring. */
  --shadow-1: 0 1px 2px rgba(24, 36, 28, .07);
  --glow-amber: 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent),
                0 4px 18px color-mix(in srgb, var(--accent) 12%, transparent);
}

/* minimal reset (the rest of the app CSS lives in style.css) */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
html { background: var(--bg); }
body {
  background: var(--bg); color: var(--ink); font-family: var(--f-body);
  font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
