/* ═══════════════════════════════════════════════════════════════════════════
   Eventos de Portugal — "After dark"
   A nocturnal, typography-led design system for national event discovery.

   Principles
   ─ Type is the artwork. No stock imagery, no decorative filler.
   ─ Stage light, not beach light. Violet → cyan accents on true night.
   ─ National in scope: nothing in here is Algarve- or coast-specific.
   ─ Every surface must survive nine languages, including long German compounds
     and CJK fallback fonts.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Typefaces (self-hosted; CSP forbids external font hosts) ────────────── */
@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded-latin.f8424a5ed4f5.woff2") format("woff2-variations");
  font-weight: 500 900;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0100-024F, U+0259, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0300-036F, U+1E00-1EFF, U+2000-206F, U+2070-209F, U+20A0-20CF,
    U+2113, U+2122, U+2190-21BB, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded-cyrillic.dac43699c250.woff2") format("woff2-variations");
  font-weight: 500 900;
  font-display: swap;
  unicode-range: U+0400-04FF, U+0500-052F, U+2DE0-2DFF, U+A640-A69F;
}
@font-face {
  font-family: "InterVariable";
  src: url("../fonts/inter-latin.fa25a34cd74e.woff2") format("woff2-variations");
  font-weight: 300 800;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0100-024F, U+0259, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0300-036F, U+1E00-1EFF, U+2000-206F, U+2070-209F, U+20A0-20CF,
    U+2113, U+2122, U+2190-21BB, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "InterVariable";
  src: url("../fonts/inter-cyrillic.6a2353ca93ee.woff2") format("woff2-variations");
  font-weight: 300 800;
  font-display: swap;
  unicode-range: U+0400-04FF, U+0500-052F, U+2DE0-2DFF, U+A640-A69F;
}

:root {
  /* ── Night scale ─────────────────────────────────────────────────────── */
  --ink-1000: #040409;
  --ink-975: #06060d;
  --ink-950: #090911;
  --ink-900: #0e0e18;
  --ink-850: #141420;
  --ink-800: #1b1b2a;
  --ink-750: #242436;

  --bg: var(--ink-950);
  --bg-deeper: var(--ink-1000);

  /* Translucent layers — these stack over the night scale */
  --bg-surface: #ffffff05;
  --bg-elevated: #ffffff0a;
  --bg-prominent: #ffffff12;
  --bg-prominent-hover: #ffffff1c;

  /* ── Stage lights ────────────────────────────────────────────────────── */
  --beam-violet: #8b5cf6;
  --beam-violet-bright: #b09cff;
  --beam-cyan: #22d3ee;
  --beam-cyan-bright: #67e8f9;

  --beam: linear-gradient(100deg, var(--beam-violet) 0%, var(--beam-cyan) 100%);
  --beam-soft: linear-gradient(100deg, #8b5cf633 0%, #22d3ee33 100%);

  --accent-primary: var(--beam-violet);
  --accent-primary-100: #8b5cf61a;
  --accent-primary-200: #8b5cf633;
  --accent-primary-500: #8b5cf680;
  --accent-primary-1100: #6d28d9;
  --accent-secondary: #bda9ff;
  --accent-secondary-100: #bda9ff1a;
  --accent-secondary-500: #bda9ff80;

  /* ── Text ────────────────────────────────────────────────────────────── */
  --text-primary: #ffffff;
  --text-secondary: #b0b4cf;
  --text-tertiary: #7b7f9c;

  --border-primary: #ffffff12;
  --border-strong: #ffffff24;
  --border-loud: #ffffff3d;

  --success: #4ad6a0;
  --warning: #ffc46b;
  --danger: #ff6b7a;

  /* Aliases retained so older rules and the quality contract keep resolving */
  --white: #ffffff;
  --ink: #ffffff;
  --muted: #b0b4cf;
  --muted-strong: #d5d8ea;
  --line: var(--border-primary);
  --line-strong: var(--border-strong);
  --surface: var(--bg-surface);
  --surface-hover: var(--bg-elevated);
  --night-1000: var(--ink-1000);
  --night-950: var(--ink-950);
  --night-900: var(--ink-900);
  --night-800: var(--ink-850);
  --night-700: var(--ink-800);
  --paper: var(--bg);
  --atlantic-950: #040409;
  --violet-600: var(--beam-violet);
  --violet-400: var(--accent-secondary);
  --violet-300: #ddd6fe;

  /* Focus: white inner ring reads on night, dark outer ring reads on paper.
     Both layers are drawn — the previous theme declared --focus-inner and
     never used it, leaving an almost invisible indicator on dark surfaces. */
  --focus-inner: #ffffff;
  --focus-outer: #0a2934;

  /* ── Geometry ────────────────────────────────────────────────────────── */
  --radius-xs: .5rem;
  --radius-sm: .375rem;
  --radius-md: .75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --radius-2xl: 1.75rem;
  --radius-pill: 100rem;
  --radius: var(--radius-md);

  --shadow-1: 0 1px 0 #ffffff0a inset, 0 10px 30px #00000040;
  --shadow-2: 0 1px 0 #ffffff12 inset, 0 24px 70px #00000073, 0 0 90px #8b5cf614;
  --shadow-lift: 0 1px 0 #ffffff1a inset, 0 32px 80px #00000080, 0 0 60px #22d3ee1a;
  --glow: 0 0 50px #8b5cf633;

  --container: 82rem;
  --container-medium: 60rem;
  --container-small: 45rem;
  --measure: 42rem;
  --section-pad-y: clamp(3.5rem, 6vw, 6rem);

  /* ── Type ────────────────────────────────────────────────────────────── */
  --font-sans: "InterVariable", -apple-system, BlinkMacSystemFont, "Segoe UI",
    system-ui, "Noto Sans", "Hiragino Sans", "Yu Gothic UI", "Microsoft YaHei",
    "Noto Sans CJK SC", sans-serif;
  --font-display: "Unbounded", "InterVariable", -apple-system, BlinkMacSystemFont,
    "Segoe UI", system-ui, "Hiragino Sans", "Yu Gothic UI", "Microsoft YaHei",
    "Noto Sans CJK SC", sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", monospace;

  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
}

/* ─── Reset ──────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html {
  color-scheme: dark;
  scroll-behavior: smooth;
  background: var(--bg-deeper);
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
  min-width: 20rem;
  background: var(--bg);
  color: var(--text-secondary);
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.6;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  /* Inter character variants only. Deliberately no "ss01": Unbounded maps that
     stylistic set to enclosed numerals, which turns "160" into "①⑥⓪". */
  font-feature-settings: "cv01", "cv11";
}

/* A single fixed aurora wash keeps the page from reading as flat black without
   costing a repaint on scroll. */
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(60rem 40rem at 12% -8%, #8b5cf61f, transparent 65%),
    radial-gradient(48rem 34rem at 92% 4%, #22d3ee14, transparent 62%);
}

img, svg { display: block; max-width: 100%; }
a { color: var(--accent-secondary); text-decoration: none; transition: color 180ms var(--ease-out); }
a:hover { color: var(--text-primary); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--beam-cyan); color: #fff; }

:focus-visible {
  outline: 2px solid var(--focus-inner);
  outline-offset: 2px;
  box-shadow: 0 0 0 5px var(--focus-outer);
  border-radius: 2px;
}

h1, h2, h3, h4, p { margin-block-start: 0; }
h1, h2, h3, h4,
.brand strong, .hero-stat strong, .event-card-day, .event-card-until,
.place-grid a, .empty-mark, .confirmation-mark, .trust-steps li > span {
  /* Display face: no inherited Inter feature settings (see body). */
  font-feature-settings: normal;
}
h1, h2, h3, h4 {
  color: var(--text-primary);
  font-family: var(--font-display);
  line-height: 1.04;
  text-wrap: balance;
  letter-spacing: -0.035em;
  overflow-wrap: break-word;
}
h1 { font-size: clamp(2.6rem, 7vw, 5.25rem); font-weight: 700; letter-spacing: -0.045em; }
h2 { font-size: clamp(1.9rem, 4vw, 3.1rem); font-weight: 600; letter-spacing: -0.04em; }
h3 { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.025em; }
strong, b { color: var(--text-primary); font-weight: 600; }

/* ─── Layout helpers ─────────────────────────────────────────────────────── */
.container { width: min(calc(100% - 2.5rem), var(--container)); margin-inline: auto; }
.narrow { max-width: var(--container-small); }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; z-index: 1000; inset: 0 auto auto 1rem;
  transform: translateY(-140%);
  padding: .8rem 1.3rem;
  background: var(--beam-cyan); color: #fff;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  font-weight: 600;
  transition: transform 250ms var(--ease-spring);
}
.skip-link:focus { transform: translateY(0); color: #fff; }

/* Shared label style: small, tracked, uppercase */
.eyebrow {
  display: inline-flex; align-items: center; gap: .55rem;
  margin-bottom: .9rem;
  color: var(--text-tertiary);
  font-size: .6875rem; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase;
}
.eyebrow::before {
  content: ""; width: 1.6rem; height: 2px; border-radius: 2px;
  background: var(--beam); flex: 0 0 auto;
}

/* ─── Header ─────────────────────────────────────────────────────────────── */
.site-header {
  position: sticky; z-index: 100; top: 0;
  background: color-mix(in srgb, var(--ink-975) 78%, transparent);
  border-bottom: 1px solid var(--border-primary);
  backdrop-filter: blur(20px) saturate(170%);
  -webkit-backdrop-filter: blur(20px) saturate(170%);
}
.header-inner {
  min-height: 4.5rem;
  display: flex; align-items: center; justify-content: space-between; gap: 1.25rem;
}
.brand {
  display: inline-flex; align-items: center; gap: .7rem;
  color: var(--text-primary); line-height: 1;
}
.brand:hover { color: var(--text-primary); }
.brand img { flex: 0 0 auto; filter: drop-shadow(0 0 14px #8b5cf659); }
.brand span { display: grid; }
.brand strong {
  font-family: var(--font-display); font-size: 1rem; font-weight: 700;
  letter-spacing: -0.03em;
}
.brand small {
  margin-top: .2rem; color: var(--text-tertiary);
  font-size: .625rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}
.primary-nav { display: flex; align-items: center; gap: 1.6rem; }
.primary-nav > a {
  position: relative;
  color: var(--text-secondary); font-size: .875rem; font-weight: 500;
  padding: .3rem 0;
}
.primary-nav > a::after {
  content: ""; position: absolute; right: 0; bottom: -.15rem; left: 0;
  height: 2px; border-radius: 2px; background: var(--beam);
  transform: scaleX(0); transform-origin: left;
  transition: transform 260ms var(--ease-out);
}
.primary-nav > a:hover { color: var(--text-primary); }
.primary-nav > a:hover::after { transform: scaleX(1); }
.menu-toggle {
  display: none; width: 2.75rem; height: 2.75rem;
  place-content: center; gap: .3rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-xs);
  background: var(--bg-elevated); color: var(--text-primary); cursor: pointer;
}
.menu-toggle span:not(.sr-only) {
  display: block; width: 1.1rem; height: 1.5px; border-radius: 2px; background: currentColor;
}
.language-menu { position: relative; }
.language-menu summary {
  cursor: pointer; list-style: none; min-width: 3rem; padding: .5rem .8rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
  background: var(--bg-elevated); color: var(--text-secondary);
  text-align: center; font-size: .75rem; font-weight: 600; letter-spacing: .08em;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
}
.language-menu summary::-webkit-details-marker { display: none; }
.language-menu summary:hover {
  background: var(--bg-prominent); border-color: var(--border-loud); color: var(--text-primary);
}
.language-menu ul {
  position: absolute; right: 0; z-index: 20;
  width: 12rem; max-height: 22rem; overflow: auto;
  margin: .6rem 0 0; padding: .45rem;
  background: color-mix(in srgb, var(--ink-900) 96%, transparent);
  border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  box-shadow: var(--shadow-2); backdrop-filter: blur(20px);
  list-style: none;
}
.language-menu a {
  display: block; padding: .5rem .7rem;
  border-radius: var(--radius-xs); color: var(--text-secondary); font-size: .875rem;
}
.language-menu a:hover { background: var(--bg-prominent); color: var(--text-primary); }

.messages { padding-top: 1.25rem; }
.message {
  padding: .9rem 1.1rem;
  border: 1px solid color-mix(in srgb, var(--success) 26%, transparent);
  border-left: 3px solid var(--success);
  border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--success) 8%, transparent);
  color: #b9f3dc;
}

/* ─── Hero ───────────────────────────────────────────────────────────────── */
.hero {
  position: relative; overflow: hidden;
  padding: clamp(3.5rem, 7vw, 6.5rem) 0 clamp(2rem, 3vw, 3rem);
}
.hero-grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
}
.hero-copy { min-width: 0; }

/* ─── Hero agenda ─────────────────────────────────────────────────────────────
   Stands in for hero artwork. No event in the database has an image and
   organiser photos cannot be licensed, so the live agenda carries the space —
   real content rather than decoration. */
.hero-agenda {
  min-width: 0; padding: 1.5rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-2xl);
  background: linear-gradient(160deg, #8b5cf61f, #22d3ee14 60%, #ffffff05), var(--ink-900);
  box-shadow: var(--shadow-2);
  backdrop-filter: blur(12px);
}
.hero-agenda-head { display: flex; align-items: center; justify-content: space-between; }
.hero-agenda-head .eyebrow { margin-bottom: 1rem; }
.hero-agenda-live {
  width: .5rem; height: .5rem; border-radius: 50%; margin-bottom: 1rem;
  background: var(--success); box-shadow: 0 0 12px var(--success);
}
.hero-agenda-list { margin: 0; padding: 0; list-style: none; }
.hero-agenda-list li + li { border-top: 1px solid var(--border-primary); }
.hero-agenda-list a {
  display: grid; grid-template-columns: 3.1rem minmax(0, 1fr); gap: 1rem;
  align-items: center; padding: .85rem .35rem;
  border-radius: var(--radius-xs); color: var(--text-secondary);
  transition: background 200ms var(--ease-out), transform 200ms var(--ease-out);
}
.hero-agenda-list a:hover { background: #ffffff0a; transform: translateX(3px); color: var(--text-secondary); }
.hero-agenda-date { display: grid; justify-items: center; line-height: 1; }
.hero-agenda-date strong {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 700;
  letter-spacing: -.05em; color: var(--text-primary); font-variant-numeric: tabular-nums;
  font-feature-settings: normal;
}
.hero-agenda-date span {
  margin-top: .2rem; color: var(--beam-cyan-bright);
  font-size: .625rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
}
.hero-agenda-body { display: grid; gap: .18rem; min-width: 0; }
.hero-agenda-title {
  color: var(--text-primary); font-size: .9375rem; font-weight: 600;
  letter-spacing: -.015em; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.hero-agenda-meta {
  color: var(--text-tertiary); font-size: .75rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hero-agenda-all { margin-top: 1.1rem; font-size: .875rem; }
.hero h1 {
  max-width: 15ch;
  margin-bottom: 1.4rem;
  /* Sized for the narrower hero column — the agenda panel takes the rest. */
  font-size: clamp(2.5rem, 5.2vw, 4.4rem);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1;
}
/* Last word of the headline carries the stage light */
.hero h1 em {
  font-style: normal;
  background: var(--beam);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-lead {
  max-width: 40rem; margin-bottom: 2.5rem;
  color: var(--text-secondary);
  font-size: clamp(1.05rem, 1.7vw, 1.3rem); line-height: 1.55;
}

/* Search */
.search-panel {
  max-width: 42rem; padding: .45rem;
  background: var(--bg-prominent);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-pill);
  backdrop-filter: blur(14px);
  box-shadow: 0 24px 60px #00000059;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.search-panel:focus-within {
  border-color: var(--accent-secondary-500);
  box-shadow: 0 24px 60px #00000059, 0 0 0 4px var(--accent-primary-200);
}
.search-panel > label {
  display: block; padding: .35rem .95rem .1rem;
  color: var(--text-tertiary);
  font-size: .625rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}
.search-row { display: flex; gap: .5rem; align-items: center; }
.search-row input {
  flex: 1; min-width: 0; min-height: 2.9rem;
  border: 0; padding: .5rem 1rem; background: transparent;
}
.search-row input:focus { background: transparent; box-shadow: none; }
.quick-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.4rem; }
.quick-links a {
  padding: .48rem .95rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-pill);
  background: var(--bg-surface); color: var(--text-secondary);
  font-size: .8125rem; font-weight: 500;
  transition: border-color 200ms var(--ease-out), background 200ms var(--ease-out),
    color 200ms var(--ease-out), transform 200ms var(--ease-out);
}
.quick-links a:hover {
  border-color: var(--border-loud); background: var(--bg-prominent);
  color: var(--text-primary); transform: translateY(-1px);
}

/* Live counter strip under the hero */
.hero-stats {
  display: flex; flex-wrap: wrap; gap: clamp(1.5rem, 5vw, 4rem);
  margin: clamp(2.25rem, 4vw, 3rem) 0 0;
  padding: 1.75rem 0 0;
  border-top: 1px solid var(--border-primary);
  list-style: none;
}
.hero-stat { display: grid; gap: .25rem; }
.hero-stat strong {
  font-family: var(--font-display); font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 700; letter-spacing: -0.04em; line-height: 1;
  font-variant-numeric: tabular-nums;
}
.hero-stat span {
  color: var(--text-tertiary);
  font-size: .6875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}

/* ─── Buttons ────────────────────────────────────────────────────────────── */
.button {
  display: inline-flex; min-height: 2.9rem;
  align-items: center; justify-content: center; gap: .5rem;
  padding: .7rem 1.35rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
  background: var(--bg-prominent); color: var(--text-primary); cursor: pointer;
  font-weight: 600; font-size: .9375rem; line-height: 1.2;
  transition: transform 200ms var(--ease-out), background 200ms var(--ease-out),
    border-color 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
}
.button:hover {
  border-color: var(--border-loud); background: var(--bg-prominent-hover);
  color: var(--text-primary); transform: translateY(-2px);
  box-shadow: 0 12px 28px #00000059;
}
.button:active { transform: translateY(0); }
.button-primary {
  position: relative; isolation: isolate;
  border-color: transparent; background: var(--beam-violet); color: #fff;
  box-shadow: 0 10px 30px #8b5cf64d;
}
.button-primary::before {
  content: ""; position: absolute; z-index: -1; inset: 0;
  border-radius: inherit; background: var(--beam);
  opacity: 0; transition: opacity 260ms var(--ease-out);
}
.button-primary:hover {
  border-color: transparent; color: #fff;
  box-shadow: 0 16px 40px #22d3ee4d;
}
.button-primary:hover::before { opacity: 1; }
.button-block { width: 100%; }
.text-link {
  display: inline-flex; align-items: center; gap: .4rem;
  color: var(--text-primary); font-weight: 600; font-size: .9375rem;
}
.text-link::after {
  content: "→"; transition: transform 220ms var(--ease-out); color: var(--beam-cyan-bright);
}
.text-link:hover::after { transform: translateX(.25rem); }
.text-button {
  border: 0; padding: 0; background: transparent; color: var(--accent-secondary);
  font: inherit; font-weight: 600; text-decoration: underline;
  text-underline-offset: .2em; cursor: pointer;
}

/* ─── Sections ───────────────────────────────────────────────────────────── */
.section { position: relative; padding-block: var(--section-pad-y); }
.section-sand {
  background: var(--ink-975);
  border-block: 1px solid var(--border-primary);
}
.section-heading {
  display: flex; align-items: end; justify-content: space-between;
  gap: 1.5rem; margin-bottom: clamp(2rem, 4vw, 3rem);
}
.section-heading h2 { margin-bottom: 0; }

/* ─── Event cards ────────────────────────────────────────────────────────────
   No imagery by design. The date block is the visual anchor; the title carries
   the weight. Cards must stay legible when a title runs to four lines in German
   or renders in a CJK fallback face. */
.event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
  gap: 1.1rem;
}
.event-card {
  position: relative; min-width: 0; isolation: isolate;
  border: 1px solid var(--border-primary); border-radius: var(--radius-xl);
  background: linear-gradient(180deg, #ffffff0d, #ffffff05);
  transition: transform 320ms var(--ease-out), border-color 320ms ease,
    box-shadow 320ms ease;
}
/* Stage light sweeps in along the top edge on hover */
.event-card::before {
  content: ""; position: absolute; z-index: 2; inset: -1px -1px auto;
  height: 2px; border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  background: var(--beam);
  opacity: 0; transition: opacity 320ms var(--ease-out);
}
.event-card:hover {
  transform: translateY(-5px);
  border-color: var(--border-strong);
  box-shadow: var(--shadow-lift);
}
.event-card:hover::before { opacity: 1; }
.event-card:focus-within { border-color: var(--border-strong); }
.event-card-link {
  display: flex; flex-direction: column; height: 100%;
  padding: 1.4rem 1.45rem 1.25rem;
  color: var(--text-secondary);
}
.event-card-link:hover { color: var(--text-secondary); }

/* Date anchor */
.event-card-when {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 1rem; margin-bottom: 1rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--border-primary);
}
.event-card-date { display: flex; align-items: baseline; gap: .4rem; min-width: 0; }
.event-card-day {
  font-family: var(--font-display); font-size: 2.6rem; font-weight: 700;
  line-height: .85; letter-spacing: -0.06em; color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}
.event-card-month {
  color: var(--beam-cyan-bright);
  font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
.event-card-time {
  flex: 0 0 auto; text-align: right;
  color: var(--text-tertiary);
  font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}
/* An exhibition that is already open leads with "on now", not its opening date. */
.event-card-date-running { display: grid; gap: .3rem; }
.event-card-date-running .event-card-month {
  display: inline-flex; align-items: center; gap: .45rem;
  color: var(--success); font-size: .75rem;
}
.event-card-date-running .event-card-month::before {
  content: ""; width: .45rem; height: .45rem; border-radius: 50%;
  background: var(--success); box-shadow: 0 0 10px var(--success);
}
.event-card-until {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 700;
  line-height: 1; letter-spacing: -0.04em; color: var(--text-primary);
  font-variant-numeric: tabular-nums; text-transform: none;
}
.event-card h3 {
  margin-bottom: .6rem;
  font-size: 1.15rem; line-height: 1.25; font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--text-primary);
  /* Keep the grid even without clipping short titles */
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}
.event-card-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; margin-top: auto; padding-top: 1rem;
}
.event-location {
  margin-bottom: 0; color: var(--text-secondary);
  font-size: .8125rem; line-height: 1.45;
}
.event-location strong { color: var(--text-primary); font-weight: 600; }
.event-category {
  display: inline-block; flex: 0 0 auto; padding: .3em .7em;
  border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
  background: var(--bg-elevated); color: var(--text-secondary);
  font-size: .6875rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  white-space: nowrap;
}
.event-card-go {
  flex: 0 0 auto; color: var(--text-tertiary);
  transition: transform 240ms var(--ease-out), color 240ms var(--ease-out);
}
.event-card:hover .event-card-go { transform: translateX(.25rem); color: var(--beam-cyan-bright); }
.event-date, .detail-date {
  margin-bottom: .4rem; color: var(--accent-secondary);
  font-size: .75rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}
.language-notice { margin: 0 0 .5rem; color: var(--text-tertiary); font-size: .75rem; }
.language-notice span { font-weight: 600; }
.event-occurrences { margin: 1rem 0 0; padding: 0; list-style: none; }
.event-occurrence + .event-occurrence { margin-top: .35rem; }
.event-occurrence .detail-date { margin-bottom: 0; }
.status-badge {
  display: inline-block; padding: .28rem .6rem;
  border: 1px solid color-mix(in srgb, var(--warning) 42%, transparent);
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--warning) 12%, transparent);
  color: var(--warning); font-size: .6875rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
}

/* The image placeholder is retained for events that do gain artwork later. */
.event-image { position: relative; overflow: hidden; border-radius: var(--radius-md); }
.event-image img { width: 100%; height: 100%; object-fit: cover; }
.event-art-category {
  max-width: 13ch; padding: .12em .18em;
  color: var(--white); background: var(--atlantic-950);
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 2.2vw, 1.75rem); font-weight: 700;
  line-height: 1.05; letter-spacing: -.04em; text-wrap: balance;
}

/* ─── Empty state ────────────────────────────────────────────────────────── */
.empty-state {
  max-width: 46rem; margin-inline: auto;
  padding: clamp(2.5rem, 6vw, 5rem);
  border: 1px solid var(--border-primary); border-radius: var(--radius-2xl);
  background: radial-gradient(circle at 50% 0, #8b5cf614, transparent 55%), var(--bg-surface);
  text-align: center; box-shadow: var(--shadow-1);
}
.empty-state h3, .empty-state h2 { margin-bottom: .8rem; }
.empty-state p { color: var(--text-secondary); }
.empty-mark, .confirmation-mark {
  display: grid; width: 4rem; height: 4rem; place-items: center;
  margin: 0 auto 1.4rem;
  border: 1px solid var(--border-strong); border-radius: 50%;
  background: var(--bg-elevated); color: var(--text-primary);
  font-family: var(--font-display); font-weight: 700;
  box-shadow: var(--glow);
}

/* ─── Place & category grids ─────────────────────────────────────────────── */
.place-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  gap: 1px; overflow: hidden;
  border: 1px solid var(--border-primary); border-radius: var(--radius-xl);
  background: var(--border-primary);
}
.place-grid a {
  display: flex; min-height: 7.5rem; flex-direction: column; justify-content: space-between;
  padding: 1.35rem;
  background: var(--ink-950); color: var(--text-primary);
  font-family: var(--font-display); font-weight: 600; letter-spacing: -0.02em;
  transition: background 220ms ease;
}
.place-grid a:hover { background: var(--ink-850); }
.place-grid strong { font-size: 1.0625rem; }
.place-grid span {
  color: var(--text-tertiary); font-family: var(--font-sans);
  font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
}
.place-grid a:hover span { color: var(--beam-cyan-bright); }

/* ─── Region grid ─────────────────────────────────────────────────────────────
   Regions with nothing on are still shown. The brand is national and the
   coverage roadmap is part of the public promise, so an honest "coming soon"
   beats hiding two thirds of the country. */
.region-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .8rem; }
.region-card {
  display: flex; flex-direction: column; gap: .5rem;
  padding: 1.3rem 1.35rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-lg);
  background: var(--bg-surface);
  transition: transform 200ms var(--ease-out), border-color 200ms ease, background 200ms ease;
}
.region-card-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.region-card-name {
  font-family: var(--font-display); font-size: 1.0625rem; font-weight: 600;
  letter-spacing: -.025em; color: var(--text-primary); font-feature-settings: normal;
}
.region-card-count {
  flex: 0 0 auto; min-width: 2rem; padding: .15rem .5rem;
  border-radius: var(--radius-pill); background: var(--bg-prominent);
  color: var(--beam-cyan-bright); font-family: var(--font-display);
  font-size: .8125rem; font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums; font-feature-settings: normal;
  transition: background 200ms ease, color 200ms ease;
}
.region-card-meta {
  color: var(--text-tertiary); font-size: .75rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
}
a.region-card-live:hover {
  transform: translateY(-3px); border-color: var(--border-strong);
  background: var(--bg-prominent); color: var(--text-secondary);
}
a.region-card-live:hover .region-card-count { background: var(--beam-cyan); color: var(--ink-1000); }
.region-card-soon { opacity: .55; }
.region-card-soon .region-card-name { color: var(--text-secondary); }

.category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: .7rem; }
.category-grid a {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-md);
  background: var(--bg-surface); color: var(--text-primary);
  font-weight: 600; font-size: .9375rem;
  transition: transform 200ms var(--ease-out), border-color 200ms ease, background 200ms ease;
}
.category-grid a:hover {
  transform: translateY(-2px); border-color: var(--border-strong); background: var(--bg-prominent);
}
.category-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.category-count {
  flex: 0 0 auto; min-width: 2rem; padding: .15rem .5rem;
  border-radius: var(--radius-pill); background: var(--bg-prominent);
  color: var(--beam-cyan-bright); font-family: var(--font-display);
  font-size: .8125rem; font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums; font-feature-settings: normal;
  transition: background 200ms ease, color 200ms ease;
}
.category-grid a:hover .category-count { background: var(--beam-cyan); color: var(--ink-1000); }

/* ─── Trust section ──────────────────────────────────────────────────────── */
.trust-section {
  position: relative; overflow: hidden;
  background: var(--ink-1000);
  border-block: 1px solid var(--border-primary);
}
.trust-grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(2.5rem, 7vw, 6rem);
}
.trust-grid h2 { max-width: 15ch; }
.trust-lead { margin-top: 1.3rem; max-width: 34rem; color: var(--text-secondary); font-size: 1.05rem; }
.trust-steps { margin: 0; padding: 0; list-style: none; counter-reset: trust; }
.trust-steps li {
  display: grid; grid-template-columns: 3rem 1fr; gap: 1.25rem;
  padding: 1.6rem 0; border-top: 1px solid var(--border-primary);
}
.trust-steps li:last-child { border-bottom: 1px solid var(--border-primary); }
.trust-steps li > span {
  font-family: var(--font-display); font-size: .875rem; font-weight: 700;
  letter-spacing: 0; color: transparent;
  background: var(--beam); -webkit-background-clip: text; background-clip: text;
}
.trust-steps h3 { margin-bottom: .4rem; }
.trust-steps p { margin: 0; color: var(--text-secondary); }

/* ─── National teaser ────────────────────────────────────────────────────── */
.national-teaser { padding-top: 0; }
.national-panel {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(13rem, .7fr);
  gap: clamp(1.5rem, 4vw, 3rem); align-items: center;
  padding: clamp(2rem, 5vw, 3.5rem);
  border: 1px solid var(--border-strong); border-radius: var(--radius-2xl);
  background: radial-gradient(40rem 20rem at 88% 10%, #22d3ee1f, transparent 70%),
    radial-gradient(36rem 22rem at 4% 90%, #8b5cf624, transparent 70%),
    var(--ink-900);
  box-shadow: var(--shadow-2);
}
.national-panel h2 { margin-bottom: .9rem; max-width: 18ch; }
.national-panel p { color: var(--text-secondary); max-width: 42rem; margin-bottom: 0; }
.national-actions { display: grid; gap: .7rem; }

/* ─── Page headers ───────────────────────────────────────────────────────── */
.page-header, .event-detail-header {
  position: relative; overflow: hidden;
  padding: clamp(3.5rem, 8vw, 6.5rem) 0 clamp(2.5rem, 5vw, 4rem);
  border-bottom: 1px solid var(--border-primary);
}
.page-header h1, .event-detail-header h1 { margin-bottom: 0; max-width: 18ch; }
.page-header p:last-child { margin-top: 1.1rem; color: var(--text-secondary); font-size: 1.05rem; max-width: 44rem; }

/* ─── Listing ────────────────────────────────────────────────────────────── */
.listing-layout {
  display: grid; grid-template-columns: 17rem minmax(0, 1fr); gap: 2.5rem;
  padding-block: 2.75rem 6rem; align-items: start;
}
.filter-panel {
  position: sticky; top: 6rem; display: grid; gap: 1.1rem;
  padding: 1.35rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-lg);
  background: var(--bg-elevated); backdrop-filter: blur(12px);
}
.filter-panel div { display: grid; gap: .4rem; }
.filter-panel label {
  font-size: .6875rem; font-weight: 600; color: var(--text-tertiary);
  letter-spacing: .12em; text-transform: uppercase;
}
.filter-panel .checkbox-field {
  display: flex; align-items: center; gap: .6rem;
  font-size: .875rem; font-weight: 500; color: var(--text-secondary);
  letter-spacing: 0; text-transform: none;
}
.filter-panel .checkbox-field input { width: 1.15rem; min-height: 1.15rem; margin: 0; accent-color: var(--beam-violet); }

input, select, textarea {
  width: 100%; min-height: 2.85rem;
  border: 2px solid #63777e; border-radius: var(--radius-xs);
  background: var(--ink-900); color: var(--text-primary);
  padding: .6rem .8rem;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}
select { color-scheme: dark; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
textarea { min-height: 8rem; resize: vertical; }
input:focus, select:focus, textarea:focus {
  border-color: var(--accent-secondary); outline: 0;
  background: var(--ink-850);
  box-shadow: 0 0 0 3px var(--accent-primary-200);
}
.result-count {
  margin-bottom: 1.4rem; color: var(--text-secondary);
  font-size: .875rem; letter-spacing: .04em;
}
.result-count strong { color: var(--text-primary); font-weight: 600; }
.pagination {
  display: flex; justify-content: center; align-items: center; gap: 1.25rem;
  padding-top: 3rem;
}
.pagination a {
  padding: .6rem 1.15rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
  background: var(--bg-elevated); color: var(--text-primary);
  font-size: .875rem; font-weight: 600;
  transition: background 200ms ease, border-color 200ms ease;
}
.pagination a:hover { background: var(--bg-prominent); border-color: var(--border-loud); }
.pagination span {
  color: var(--text-tertiary); font-size: .8125rem; font-weight: 600;
  letter-spacing: .1em; font-variant-numeric: tabular-nums;
}

/* ─── Event detail ───────────────────────────────────────────────────────── */
.event-detail-header { padding-bottom: 3rem; }
.event-detail-header h1 { font-size: clamp(2.4rem, 6.5vw, 4.5rem); max-width: 20ch; }
.status-alert {
  margin-block: 1.5rem 0; padding: 1rem 1.2rem;
  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
  border-left: 3px solid var(--danger); border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--danger) 9%, transparent); color: #ffc9cf;
}
.detail-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 20rem;
  gap: clamp(2rem, 5vw, 5rem); padding-block: 3rem 6rem; align-items: start;
}
.detail-main { min-width: 0; }
.detail-main section { margin-bottom: 3rem; }
.detail-main h2 { font-size: 1.6rem; letter-spacing: -.03em; margin-bottom: 1rem; }
.detail-image {
  width: 100%; max-height: 36rem; object-fit: cover;
  border: 1px solid var(--border-primary); border-radius: var(--radius-xl);
  box-shadow: var(--shadow-1);
}
figcaption { margin-top: .6rem; color: var(--text-tertiary); font-size: .8125rem; }
.prose { max-width: var(--measure); color: var(--text-secondary); font-size: 1.0625rem; }
.prose h2 { color: var(--text-primary); }
.prose li { margin-bottom: .6rem; }
.source-panel {
  padding: 1.4rem;
  border: 1px solid var(--border-primary); border-left: 3px solid var(--beam-violet);
  border-radius: var(--radius-xs); background: var(--bg-surface);
  overflow-wrap: anywhere; font-size: .9375rem;
}
.detail-aside { position: sticky; top: 6rem; display: grid; gap: 1rem; }
.detail-card, .report-box {
  padding: 1.4rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-lg);
  background: var(--bg-elevated); box-shadow: var(--shadow-1);
}
.detail-card h2 {
  font-family: var(--font-sans); font-size: .6875rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--text-tertiary);
  margin-bottom: .5rem;
}
.detail-card dl { margin: 0 0 1.2rem; }
.detail-card dl div { padding: .85rem 0; border-top: 1px solid var(--border-primary); }
.detail-card dt {
  color: var(--text-tertiary); font-size: .625rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase;
}
.detail-card dd { margin: .3rem 0 0; color: var(--text-primary); font-weight: 600; }
.report-box summary { cursor: pointer; font-weight: 600; color: var(--text-secondary); }
.report-box form { display: grid; gap: .8rem; margin-top: 1rem; }
.report-box label { display: grid; gap: .3rem; font-size: .8125rem; font-weight: 600; }

/* ─── Forms / account / policy ───────────────────────────────────────────── */
.form-section { padding-block: 3rem 6rem; }
.process-note {
  padding: 1.35rem; margin-bottom: 2rem;
  border: 1px solid var(--border-primary); border-left: 3px solid var(--beam-violet);
  border-radius: var(--radius-xs); background: var(--bg-surface);
}
.process-note ol {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1rem;
  margin: .9rem 0 0; padding-left: 1.3rem;
  color: var(--text-secondary); font-size: .8125rem;
}
.submission-form, .form-shell form { display: grid; gap: 1.25rem; }
.field { display: grid; gap: .45rem; }
.field > label {
  color: var(--text-tertiary); font-size: .6875rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase;
}
.field small, .form-privacy, .form-help { color: var(--text-tertiary); font-size: .8125rem; }
.checkbox { display: flex; gap: .7rem; align-items: flex-start; }
.checkbox input { width: 1.2rem; min-height: 1.2rem; margin-top: .2rem; accent-color: var(--beam-violet); }
.field-error, .form-errors { color: #ffc9cf; font-weight: 600; }
.form-errors {
  padding: 1rem 1.2rem;
  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
  border-left: 3px solid var(--danger); border-radius: var(--radius-xs);
  background: color-mix(in srgb, var(--danger) 9%, transparent);
}
.form-errors h2 { margin-bottom: .5rem; font-family: var(--font-sans); font-size: 1.05rem; }
.form-errors a { color: #ffe0e4; }
.honeypot {
  position: absolute !important; left: -10000px !important;
  width: 1px !important; height: 1px !important; overflow: hidden !important;
}
.confirmation {
  min-height: 68vh; display: grid; place-items: center; align-content: center;
  padding-block: 5rem; text-align: center;
}
.confirmation h1 { margin-bottom: .75rem; font-size: clamp(2.2rem, 6vw, 4rem); }
.confirmation p { max-width: 38rem; color: var(--text-secondary); }
.confirmation-mark { width: 5rem; height: 5rem; font-size: 1.9rem; }
.policy-content { padding-block: 3rem 6rem; }
.policy-content section { margin-bottom: 2.6rem; }
.form-shell {
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid var(--border-primary); border-radius: var(--radius-xl);
  background: radial-gradient(30rem 16rem at 100% 0, #8b5cf614, transparent 70%), var(--bg-elevated);
  box-shadow: var(--shadow-1);
}
.form-login-link { margin-top: 1.5rem; color: var(--text-secondary); text-align: center; }
.confirmation-lead { margin-inline: auto; }
.confirmation-steps {
  width: min(100%, 34rem); margin: 0 auto 2rem; padding: 1.35rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-md);
  background: var(--bg-elevated); color: var(--text-secondary); text-align: left;
}
.confirmation-steps strong { display: block; margin-bottom: .7rem; color: var(--text-primary); }
.confirmation-steps ol { margin: 0; padding-left: 1.25rem; }
.confirmation-steps li + li { margin-top: .4rem; }
.confirmation-action { min-width: 13.75rem; }
.confirmation-help { margin-top: 2.5rem; font-size: .8125rem; }
.confirmation-mail-mark { font-size: 2rem; }
.dashboard-list { display: grid; gap: 1rem; }
.dashboard-event {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, .5fr);
  gap: 2rem; padding: 1.4rem;
  border: 1px solid var(--border-primary); border-radius: var(--radius-lg);
  background: var(--bg-elevated); box-shadow: var(--shadow-1);
}
.dashboard-event h2 { font-size: 1.35rem; }
.dashboard-event details form, details.dashboard-event form { display: grid; gap: .7rem; padding-top: 1rem; }

/* ─── Map ─────────────────────────────────────────────────────────────────────
   Every rule here must live in this file. style-src is 'self' with no nonce, so
   an inline <style> block in the template is dropped and #eventos-map collapses
   to zero height — which reads as "the map disappeared". */
.map-section { padding-top: clamp(2rem, 4vw, 3rem); }
.map-stats {
  display: flex; flex-wrap: wrap; gap: clamp(1.5rem, 5vw, 4rem);
  margin: 0 0 1.75rem; padding: 0;
  list-style: none;
}
.map-shell {
  position: relative; isolation: isolate;
  padding: .5rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-2xl);
  background: linear-gradient(140deg, #8b5cf62e, #22d3ee24);
  box-shadow: var(--shadow-2);
}
#eventos-map {
  height: clamp(26rem, 62vh, 44rem);
  overflow: hidden; z-index: 1;
  border-radius: var(--radius-xl);
  background: var(--ink-850);
}
.leaflet-container { background: var(--ink-850); font-family: var(--font-sans); }
/* Dark-mode the OSM raster tiles. Invert + hue-rotate keeps water blue rather
   than orange; brightness stays high enough that roads and place names remain
   readable, which the previous .55 did not. */
.leaflet-tile-pane {
  filter: invert(1) hue-rotate(185deg) brightness(.92) contrast(.88) saturate(.55);
}
.leaflet-control-zoom a {
  background: var(--ink-850); color: var(--text-primary);
  border-color: var(--border-strong);
}
.leaflet-control-zoom a:hover { background: var(--ink-800); color: var(--text-primary); }
.leaflet-control-attribution {
  background: color-mix(in srgb, var(--ink-1000) 82%, transparent) !important;
  color: var(--text-tertiary);
}
.leaflet-control-attribution a { color: var(--accent-secondary); }
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background: var(--ink-850); color: var(--text-primary);
  border: 1px solid var(--border-strong);
  box-shadow: var(--shadow-2);
}
.leaflet-popup-content-wrapper { border-radius: var(--radius-md); }
.leaflet-popup-content { margin: .9rem 1rem; font-family: var(--font-sans); }
.edp-popup-title {
  display: block; margin-bottom: .3rem;
  font-family: var(--font-display); font-size: .95rem; font-weight: 600;
  letter-spacing: -.02em; color: var(--text-primary);
}
.edp-popup-title:hover { color: var(--beam-cyan-bright); }
.edp-popup-meta { color: var(--text-tertiary); font-size: .8125rem; }

/* Brand pin: a glowing dot rather than Leaflet's default blue teardrop. */
.edp-pin-wrap { background: none; border: 0; }
.edp-pin {
  display: block; width: 18px; height: 18px; border-radius: 50%;
  background: var(--beam-cyan);
  border: 2px solid #fff;
  box-shadow: 0 0 0 4px #22d3ee40, 0 0 16px #22d3ee99;
  transition: transform 200ms var(--ease-out), box-shadow 200ms var(--ease-out);
}
.leaflet-marker-icon:hover .edp-pin,
.leaflet-marker-icon:focus .edp-pin {
  transform: scale(1.25);
  box-shadow: 0 0 0 6px #22d3ee4d, 0 0 22px #22d3eecc;
}

.identity-list { margin: 0; }
.identity-list div { padding: .7rem 0; border-top: 1px solid var(--border-primary); }
.identity-list dt { color: var(--text-tertiary); font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.identity-list dd { margin: .25rem 0 0; color: var(--text-primary); }
.source-report { margin-top: 1rem; font-size: .875rem; }
.prevailing-language { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--border-primary); }
.prevailing-language p { color: var(--text-tertiary); font-size: .8125rem; margin: 0; }
/* Long-form reading: legal and informational pages need calmer headings than
   the marketing surfaces, and a comfortable measure. */
.policy-content section { margin-bottom: 2.6rem; }
.policy-content h2 {
  font-size: clamp(1.3rem, 2.2vw, 1.6rem);
  letter-spacing: -.025em; margin-bottom: .85rem;
}
.policy-content h3 { font-size: 1.0625rem; margin-bottom: .5rem; }
.policy-content p, .policy-content li { max-width: var(--measure); }
.policy-content ul, .policy-content ol { padding-left: 1.2rem; }
.policy-content li { margin-bottom: .5rem; }
.policy-page .page-header h1, .info-page .page-header h1 {
  font-size: clamp(2.1rem, 4.2vw, 3.2rem);
}
.map-attribution { margin: .8rem 0 0; color: var(--text-tertiary); font-size: .75rem; text-align: right; }

/* Venue map on the event detail page */
.venue-name { font-size: 1.15rem; margin-bottom: .25rem; }
.venue-address { color: var(--text-secondary); margin-bottom: .2rem; font-size: .9375rem; }
.venue-map-shell {
  margin-top: 1.4rem; padding: .4rem;
  border: 1px solid var(--border-strong); border-radius: var(--radius-xl);
  background: linear-gradient(140deg, #8b5cf62e, #22d3ee24);
  box-shadow: var(--shadow-1);
}
#venue-map {
  height: clamp(15rem, 32vh, 22rem);
  overflow: hidden; z-index: 1;
  border-radius: var(--radius-md);
  background: var(--ink-850);
}
.venue-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.1rem; }
.calendar-button { margin-top: .75rem; }
.calendar-help { margin: .55rem 0 0; text-align: center; }
.map-list-heading { margin-top: clamp(2.5rem, 5vw, 4rem); margin-bottom: 1.25rem; }
.map-results { margin-top: 1.5rem; }
/* Card plus its own "show on map" control, so the card link stays a single target. */
.map-result-wrap { display: flex; flex-direction: column; min-width: 0; }
.map-result-wrap .event-card { flex: 1; border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
.map-focus {
  padding: .7rem 1rem; cursor: pointer;
  border: 1px solid var(--border-primary); border-top: 0;
  border-radius: 0 0 var(--radius-xl) var(--radius-xl);
  background: var(--bg-surface); color: var(--text-secondary);
  font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  transition: background 200ms ease, color 200ms ease;
}
.map-focus:hover { background: var(--bg-prominent); color: var(--text-primary); }
.info-box {
  margin-top: 2rem; padding: 1rem 1.2rem;
  border: 1px solid var(--border-primary); border-left: 3px solid var(--beam-violet);
  border-radius: var(--radius-xs); background: var(--bg-surface); color: var(--text-secondary);
}
.map-frame, .event-map, .map-frame-label { display: none; }

/* ─── Footer ─────────────────────────────────────────────────────────────── */
.site-footer {
  padding-top: clamp(3.5rem, 7vw, 6rem);
  background: var(--ink-1000); color: var(--text-secondary);
  border-top: 1px solid var(--border-primary);
}
.footer-grid {
  display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 4rem); padding-bottom: 3.5rem;
}
.brand-footer { margin-bottom: 1.1rem; color: var(--text-primary); }
.brand-footer small { color: var(--text-tertiary); }
.footer-note { margin-top: .8rem; color: var(--text-tertiary); font-size: .8125rem; }
.footer-grid h2 {
  color: var(--text-tertiary); font-family: var(--font-sans);
  font-size: .625rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  margin-bottom: .9rem;
}
.footer-grid a { display: block; margin-bottom: .5rem; color: var(--text-secondary); font-size: .875rem; }
.footer-grid a:hover { color: var(--text-primary); }
.footer-grid p { max-width: 28rem; line-height: 1.6; font-size: .9375rem; }
.footer-bottom {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding-block: 1.4rem; border-top: 1px solid var(--border-primary);
}
.footer-bottom small { color: var(--text-tertiary); font-size: .8125rem; }

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 74rem) {
  .footer-grid { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 64rem) {
  .trust-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 50rem) {
  .container { width: min(calc(100% - 1.75rem), var(--container)); }
  .header-inner { min-height: 4rem; flex-wrap: wrap; }
  .menu-toggle { display: none; }
  .primary-nav {
    position: static; display: grid; width: 100%; padding: 1rem; gap: .35rem;
    background: var(--ink-900);
    border: 1px solid var(--border-primary); border-radius: var(--radius-md);
  }
  .js .menu-toggle { display: grid; margin-left: auto; }
  .js .primary-nav { position: absolute; inset: 4rem .875rem auto; display: none; box-shadow: var(--shadow-2); }
  .js .primary-nav.is-open { display: grid; }
  .primary-nav > a { padding: .5rem 0; }
  .language-menu ul { position: static; width: 100%; box-shadow: none; }
  .hero { padding-top: 3.5rem; }
  .hero-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .detail-grid, .listing-layout { grid-template-columns: 1fr; }
  .filter-panel, .detail-aside { position: static; }
  .dashboard-event { grid-template-columns: 1fr; }
  .national-panel { grid-template-columns: 1fr; }
}
@media (max-width: 34rem) {
  .event-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .section-heading { align-items: start; flex-direction: column; gap: .75rem; }
  .search-panel { border-radius: var(--radius-xl); }
  .search-row { display: grid; }
  .hero-stats { gap: 1.5rem 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
@media (prefers-contrast: more) {
  :root { --border-primary: #ffffff47; --text-secondary: #d9dcec; --text-tertiary: #b6b9cf; }
  .button, input, select, textarea { border-width: 2px; }
}
@media print {
  .site-header, .site-footer, .filter-panel, .report-box, .button, .quick-links { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  body::before { display: none; }
  a { color: #000; text-decoration: none; }
  .detail-grid { display: block; padding: 0; }
}

/* ─── Organiser dashboard ────────────────────────────────────────────────── */
.dash-stats { margin: 0 0 1.75rem; padding: 0; border-top: 0; }
.dash-meta { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .6rem; color: var(--text-tertiary); font-size: .8125rem; }
.dash-pill {
  padding: .18rem .6rem; border-radius: var(--radius-pill);
  border: 1px solid var(--border-strong); background: var(--bg-elevated);
  color: var(--text-secondary); font-size: .6875rem; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
}
.dash-pill-published { color: var(--success); border-color: color-mix(in srgb, var(--success) 40%, transparent); }
.dash-pill-in_review { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 40%, transparent); }
.dash-date { color: var(--text-secondary); font-size: .875rem; margin-bottom: .5rem; }
.dash-warn { color: var(--warning); }
.dash-links { display: flex; gap: 1rem; font-size: .875rem; margin-bottom: 0; }
.dash-actions { display: grid; gap: .6rem; align-content: start; }
.dash-actions summary { cursor: pointer; font-weight: 600; font-size: .875rem; }
.dash-actions form { display: grid; gap: .5rem; margin-top: .75rem; }
.dash-actions label { font-size: .75rem; font-weight: 600; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: .1em; }