/* ── Variables ─────────────────────────────────────────────── */
/* Palette: Vert de Buffon (primary) + Or de Côte (accent) + Pierre calcaire (background) */
:root {
  /* Palette */
  --burgundy: #4e6535;
  --burgundy-light: #637f43;
  --gold: #c4922a;
  --gold-light: #d9a840;
  --stone: #f2ede0;
  --stone-dark: #e4d9c0;
  --text: #252819;
  --text-muted: #5a5e48;
  --white: #ffffff;

  /* Status colours */
  --status-past-bg: #e0e0e0;   --status-past-text: #666;
  --status-today-bg: #c8f028;  --status-today-text: #3a4a00;
  --status-now-bg: #2d7a2d;    --status-now-text: #fff;

  /* Semantic */
  --color-forest: #1a4a1a;
  --color-link: #1a5276;

  /* Gradients */
  --gradient-placeholder: linear-gradient(135deg, var(--burgundy) 0%, var(--gold) 100%);

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --fs-xs:   0.72rem;   /* ~11.5px — smallest labels */
  --fs-sm:   0.78rem;   /* ~12.5px — meta, captions */
  --fs-base: 0.875rem;  /* 14px    — body sans */
  --fs-md:   0.9rem;    /* ~14.5px — UI text */
  --fs-lg:   1rem;      /* 16px    — sidebar titles */
  --fs-xl:   1.1rem;    /* ~17.5px — section headings */
  --fs-subh: 1.3rem;    /* ~21px   — sub-headings */
  --fs-2xl:  1.6rem;    /* ~25.5px — detail title */
  --fs-page-h1: 1.8rem; /* ~29px   — content page h1 */
  --fs-3xl:  2.2rem;    /* 35px    — hero h1 max */

  /* Layout */
  --header-height: 52px;
  --header-height-mobile: 48px;
  --card-img-height: 230px;
  --sidebar-width: 320px;

  /* Components */
  --radius: 8px;
  --radius-sm: 4px;
  --radius-xs: 3px;
  --shadow: 0 2px 8px rgba(0,0,0,.12);
  --shadow-md: 0 2px 10px rgba(0,0,0,.16);
  --shadow-lg: 0 4px 20px rgba(0,0,0,.16);
}

/* ── Skip link (toegankelijkheid) ───────────────────────────── */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: 9999;
  background: var(--burgundy);
  color: var(--white);
  padding: .5rem 1rem;
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  border-radius: 0 0 var(--radius) 0;
  text-decoration: none;
}
.skip-link:focus { top: 0; }

/* ── Reset ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { width: 100%; overflow-x: hidden; }
body { font-family: Georgia, "Times New Roman", serif; color: var(--text); background: var(--stone); line-height: 1.6; width: 100%; overflow-x: hidden; }
a { color: var(--burgundy); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 2px; }
img { max-width: 100%; display: block; }

/* ── Header ────────────────────────────────────────────────── */
.site-header {
  background: var(--burgundy);
  color: var(--white);
  padding: .75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: var(--shadow);
}
.site-logo { color: var(--white); font-size: var(--fs-xl); font-weight: bold; letter-spacing: .02em; }
.logo-main { color: var(--gold-light); }
.site-nav { display: flex; gap: 1.5rem; }
.site-nav a { color: rgba(255,255,255,.85); font-size: var(--fs-md); font-family: var(--font-sans); }
.site-nav a:hover, .site-nav a.active { color: var(--gold-light); text-decoration: none; }

.lang-switcher { display: flex; gap: .3rem; margin-left: .5rem; }
.lang-btn { color: rgba(255,255,255,.6); font-size: var(--fs-sm); font-family: var(--font-sans); padding: .15rem .4rem; border-radius: var(--radius-xs); }
.lang-btn:hover, .lang-btn.active { color: var(--white); background: rgba(255,255,255,.15); text-decoration: none; }

/* ── Hero ──────────────────────────────────────────────────── */
.hero {
  background: linear-gradient(135deg, var(--burgundy) 0%, #2d3d1e 100%);
  color: var(--white);
  padding: 3rem 1.5rem 2rem;
  text-align: center;
}
.hero h1 { font-size: clamp(1.4rem, 4vw, var(--fs-3xl)); color: var(--gold-light); margin-bottom: .5rem; }
.hero-sub { color: rgba(255,255,255,.75); font-family: var(--font-sans); font-size: var(--fs-md); }
.hero-search { display: flex; gap: .5rem; justify-content: center; margin-top: 1.25rem; flex-wrap: wrap; }
.hero-search-input {
  font-family: var(--font-sans); font-size: var(--fs-md);
  padding: .5rem 1.1rem; border-radius: 24px; border: none;
  background: rgba(255,255,255,.15); color: var(--white);
  min-width: 240px; outline: none; backdrop-filter: blur(4px);
}
.hero-search-input::placeholder { color: rgba(255,255,255,.6); }
.hero-search-input:focus { background: rgba(255,255,255,.25); }
.hero-search-btn {
  font-family: var(--font-sans); font-size: var(--fs-md);
  padding: .5rem 1.4rem; border-radius: 24px; border: none;
  background: var(--gold-light); color: var(--burgundy);
  font-weight: 700; cursor: pointer;
}
.hero-search-btn:hover { background: var(--white); }

/* ── Filters ───────────────────────────────────────────────── */
.filters-section {
  background: var(--white);
  border-bottom: 2px solid var(--stone-dark);
  padding: 1.25rem 1.5rem;
  position: sticky;
  top: var(--header-height);
  z-index: 90;
}
.filters-inner { max-width: 960px; margin: 0 auto; display: flex; flex-direction: column; gap: 1rem; }
.filter-group { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.filter-label { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; min-width: 120px; }

.search-input {
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  padding: .4rem .9rem;
  border-radius: 20px;
  border: 1.5px solid var(--stone-dark);
  background: var(--white);
  color: var(--text);
  min-width: 220px;
  outline: none;
}
.search-input:focus { border-color: var(--burgundy); }

.filter-apply-row { display: flex; justify-content: flex-end; padding-top: .25rem; }
.filter-apply-btn {
  font-family: var(--font-sans); font-size: var(--fs-sm);
  padding: .45rem 1.2rem; border-radius: 20px;
  background: var(--burgundy); color: var(--white);
  border: none; cursor: pointer; font-weight: 600;
}
.filter-apply-btn:hover { background: var(--burgundy-dark, #5a1a2a); }

.filter-summary { display: flex; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.filter-summary-chips { display: flex; flex-direction: row; gap: 1rem; flex: 1; flex-wrap: wrap; align-items: center; }
.filter-summary-row { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.filter-summary-chip {
  font-family: var(--font-sans); font-size: var(--fs-sm);
  padding: .3rem .85rem; border-radius: 20px;
  background: var(--stone); border: 1.5px solid var(--stone-dark);
  cursor: pointer; color: var(--text);
}
.filter-summary-chip:hover { border-color: var(--burgundy); color: var(--burgundy); }
.filter-summary-chip--period { background: var(--burgundy); color: var(--white); border-color: var(--burgundy); }
.filter-summary-chip--period:hover { background: var(--burgundy-dark, #5a1a2a); color: var(--white); }
.filter-edit-btn {
  font-family: var(--font-sans); font-size: var(--fs-sm);
  padding: .3rem .85rem; border-radius: 20px;
  background: transparent; border: 1.5px solid var(--stone-dark);
  cursor: pointer; color: var(--text-muted); white-space: nowrap;
}
.filter-edit-btn:hover { border-color: var(--burgundy); color: var(--burgundy); }
.filter-summary-label--clickable { cursor: pointer; }
.filter-summary-label--clickable:hover { color: var(--burgundy); }

.period-btn, .tag-btn, .dist-btn {
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  padding: .35rem .8rem;
  border-radius: 20px;
  border: 1.5px solid var(--stone-dark);
  background: var(--stone);
  color: var(--text-muted);
  cursor: pointer;
  transition: all .15s;
}
.period-btn:hover, .tag-btn:hover, .dist-btn:hover { border-color: var(--burgundy); color: var(--burgundy); }
.period-btn.active { background: var(--burgundy); border-color: var(--burgundy); color: var(--white); }
.tag-btn.active { background: var(--gold); border-color: var(--gold); color: var(--white); }
.dist-btn.active { background: var(--stone-dark); border-color: var(--stone-dark); color: var(--text); }
.dist-btn:not(.active) { opacity: .45; }

.custom-dates { display: flex; align-items: center; gap: .5rem; }
.custom-dates input { font-family: var(--font-sans); font-size: var(--fs-base); padding: .3rem .6rem; border: 1.5px solid var(--stone-dark); border-radius: var(--radius); }
.hidden { display: none !important; }

/* ── Results ───────────────────────────────────────────────── */
.results-section { max-width: 1100px; margin: 0 auto; padding: 1.5rem; }
.results-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
#results-count { font-family: var(--font-sans); font-size: var(--fs-md); color: var(--text-muted); }

.view-toggle { display: flex; gap: .5rem; }
.view-btn {
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
  padding: .3rem .7rem;
  border: 1.5px solid var(--stone-dark);
  border-radius: var(--radius);
  background: var(--white);
  cursor: pointer;
  color: var(--text-muted);
}
.view-btn.active { background: var(--burgundy); border-color: var(--burgundy); color: var(--white); }

/* ── Event Grid ────────────────────────────────────────────── */
.events-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.25rem;
}

.event-card {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  transition: transform .15s, box-shadow .15s;
}
.event-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }

.event-card-img {
  width: 100%;
  height: var(--card-img-height);
  object-fit: cover;
}
.event-card-img-link { display: block; position: relative; }
.event-card-img-link:hover { opacity: .92; }

/* Image overlays */
.event-card-bottom-left {
  position: absolute; bottom: .4rem; left: .4rem;
  display: flex; gap: .3rem; align-items: center; flex-wrap: wrap;
  z-index: 3;
}
.event-card-date-overlay {
  background: rgba(255,255,255,.92); color: var(--color-forest);
  font-size: var(--fs-xs); font-weight: 700; font-family: var(--font-sans);
  padding: .3rem .55rem; border-radius: var(--radius-xs); line-height: 1.3;
}
.event-card-city-overlay {
  position: absolute; top: .4rem; right: .4rem;
  background: rgba(255,255,255,.85); color: var(--text);
  font-size: var(--fs-xs); font-weight: 600; font-family: var(--font-sans);
  padding: .3rem .55rem; border-radius: var(--radius-xs); line-height: 1.3;
  z-index: 2;
}
.event-card-cat-overlay {
  position: absolute; bottom: .4rem; right: .4rem;
  background: rgba(255,255,255,.85); color: var(--text-muted);
  font-size: var(--fs-xs); font-weight: 600; font-family: var(--font-sans);
  padding: .3rem .55rem; border-radius: var(--radius-xs); line-height: 1.3;
  z-index: 1;
}

/* Status labels */
.event-status { font-size: var(--fs-xs); font-weight: 600; font-family: var(--font-sans); padding: .25rem .45rem; border-radius: var(--radius-xs); }
.event-status--past    { background: var(--status-past-bg);  color: var(--status-past-text); }
.event-status--today   { background: var(--status-today-bg); color: var(--status-today-text); }
.event-status--now     { background: var(--status-now-bg);   color: var(--status-now-text); }
.event-status--planned { background: rgba(255,255,255,.85); color: var(--text-muted); border: 1px solid rgba(0,0,0,.15); }

.event-card-img--placeholder {
  height: var(--card-img-height);
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2e3d1f 0%, #4a5c2e 100%);
}
.placeholder-icon { font-size: 2.8rem; line-height: 1; }
.cat-concert .event-card-img--placeholder    { background: linear-gradient(135deg, #2d1b4e 0%, #4a2d6e 100%); }
.cat-exposition .event-card-img--placeholder { background: linear-gradient(135deg, #1a3a4e 0%, #2a5a6e 100%); }
.cat-marche .event-card-img--placeholder     { background: linear-gradient(135deg, #2e4a1a 0%, #4a6e2a 100%); }
.cat-sport .event-card-img--placeholder      { background: linear-gradient(135deg, #1a2e4e 0%, #2a4a6e 100%); }
.cat-gastronomie .event-card-img--placeholder{ background: linear-gradient(135deg, #4e3a1a 0%, #7a5a28 100%); }
.cat-famille .event-card-img--placeholder    { background: linear-gradient(135deg, #1a4a3a 0%, #2a6a5a 100%); }
.cat-festival .event-card-img--placeholder   { background: linear-gradient(135deg, #4e1a2e 0%, #7a2a4a 100%); }

.event-card-body { padding: .4rem .85rem .75rem; text-align: center; }
.event-card-title { font-size: var(--fs-md); margin: .2rem 0 .35rem; line-height: 1.35; }
.event-card-title a { color: var(--text); }
.event-card-title a:hover { color: var(--burgundy); text-decoration: none; }
.event-card-meta { display: flex; flex-direction: column; gap: .15rem; font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); }
.meta-distance { color: var(--burgundy); font-weight: 600; }
.meta-train { color: var(--color-link); font-weight: 600; }

/* ── Tags / Badges ─────────────────────────────────────────── */
.tag {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  font-weight: 600;
  padding: .15rem .5rem;
  border-radius: var(--radius-sm);
  text-transform: uppercase;
  letter-spacing: .04em;
  background: var(--stone-dark);
  color: var(--text-muted);
}
.tag--concert    { background: #ede5f5; color: #5a2d82; }
.tag--exposition { background: #e5eef5; color: #1a4a6a; }
.tag--marche     { background: #e8f5e5; color: #2a5a1a; }
.tag--sport      { background: #e5eaf5; color: #1a2a6a; }
.tag--gastronomie{ background: #f5ece5; color: #6a3a1a; }
.tag--festival   { background: #eaf0e4; color: var(--burgundy); }
.tag--famille    { background: #e5f5f0; color: #1a5a4a; }
.tag--animation  { background: #f5f0e5; color: #5a4a1a; }

.no-results { color: var(--text-muted); font-family: var(--font-sans); padding: 2rem 0; }

/* ── Map ───────────────────────────────────────────────────── */
.map-container {
  display: grid;
  grid-template-columns: 1fr var(--sidebar-width);
  height: 600px;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}
#main-map { height: 100%; }
#map-sidebar { overflow-y: auto; background: var(--white); padding: .75rem; display: flex; flex-direction: column; gap: .75rem; }
#map-event-list .event-card { font-size: var(--fs-base); }

.fullpage-map-wrap { height: calc(100vh - var(--header-height)); }
#fullpage-map { height: 100%; }

/* ── Detail page ───────────────────────────────────────────── */
.detail-layout {
  max-width: 1100px;
  margin: 0 auto;
  padding: 1.5rem;
  display: grid;
  grid-template-columns: 1fr var(--sidebar-width);
  gap: 2rem;
}
.back-link { font-family: var(--font-sans); font-size: var(--fs-base); color: var(--text-muted); display: inline-block; margin-bottom: 1rem; }
.detail-title { font-size: var(--fs-2xl); margin: .5rem 0 .25rem; }
.detail-city { font-family: var(--font-sans); font-size: var(--fs-md); color: var(--text-muted); margin: .25rem 0 1rem; }
.detail-city a { color: var(--burgundy); font-weight: 600; }
.detail-location { font-family: var(--font-sans); font-size: var(--fs-md); color: var(--text-muted); margin: .5rem 0 0; }
.detail-img-wrapper { position: relative; margin-bottom: 1rem; }
.detail-img { width: 100%; max-height: 360px; object-fit: cover; border-radius: var(--radius); display: block; }
.detail-img-overlays { position: absolute; bottom: .6rem; left: .6rem; display: flex; gap: .4rem; align-items: center; }
.detail-description { line-height: 1.8; margin-top: 1rem; font-size: var(--fs-lg); }
.detail-source { margin-top: 1.5rem; padding-top: .75rem; border-top: 1px solid var(--stone-dark); font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); }
.detail-source a { color: var(--burgundy); }
.detail-sidebar .sidebar-title { font-size: var(--fs-lg); margin: 1.25rem 0 .75rem; color: var(--burgundy); }
.detail-sidebar .sidebar-title:first-child { margin-top: 0; }
#sidebar-map { width: 100%; height: 200px; border-radius: var(--radius); overflow: hidden; margin-bottom: 1.25rem; }
.leaflet-tooltip.map-label { background: transparent; border: none; box-shadow: none; padding: 0; font-size: 11px; font-weight: 600; color: #222; text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff; white-space: nowrap; cursor: pointer; pointer-events: auto; }
.leaflet-tooltip.map-label::before { display: none; }
.sidebar-events { display: flex; flex-direction: column; gap: .75rem; }
.sidebar-locations { display: flex; flex-direction: column; gap: .6rem; margin-bottom: .5rem; }

.location-card-compact {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  background: var(--white);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  padding: .5rem;
}
.location-card-compact-img {
  width: 64px; height: 64px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
}
.location-card-compact-img--placeholder {
  width: 64px; height: 64px;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
  background: var(--gradient-placeholder);
}
.location-card-compact-body {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  min-width: 0;
}
.location-card-compact-name { font-size: var(--fs-base); line-height: 1.3; }
.location-card-compact-name a { color: var(--text); }
.location-card-compact-name a:hover { color: var(--burgundy); }
.location-card-compact-city { color: var(--text-muted); font-size: var(--fs-sm); }
.location-card-compact--link { text-decoration: none; color: inherit; transition: box-shadow .15s; }
.location-card-compact--link:hover { box-shadow: var(--shadow-md); }

/* ── Place detail page ─────────────────────────────────────── */
.place-locations-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.place-location-card {
  display: flex; flex-direction: column;
  background: var(--white); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: hidden;
  text-decoration: none; color: inherit;
  transition: box-shadow .15s;
}
.place-location-card:hover { box-shadow: var(--shadow-md); }
.place-location-img {
  width: 100%; height: 120px; object-fit: cover;
}
.place-location-img--placeholder {
  width: 100%; height: 120px;
  background: var(--gradient-placeholder);
}
.place-location-body {
  padding: .6rem .75rem .75rem;
  display: flex; flex-direction: column; gap: .3rem;
  font-family: var(--font-sans); font-size: var(--fs-base);
}
.place-location-name { font-size: var(--fs-md); font-weight: 600; color: var(--text); line-height: 1.3; }

/* ── Location detail page ──────────────────────────────────── */
.detail-city { font-family: var(--font-sans); font-size: var(--fs-md); color: var(--text-muted); margin: .25rem 0 .75rem; }
.location-external-link {
  display: inline-block; margin: 1.25rem 0;
  padding: .55rem 1.1rem;
  background: var(--burgundy); color: var(--white);
  border-radius: var(--radius); font-family: var(--font-sans); font-size: var(--fs-md);
  text-decoration: none;
}
.location-external-link:hover { background: var(--burgundy-light); color: var(--white); }
.detail-section-title { font-size: var(--fs-xl); color: var(--burgundy); margin: 2rem 0 .75rem; border-top: 1px solid var(--stone-dark); padding-top: 1.25rem; }
.detail-title + .detail-section-title { margin-top: 1rem; }
.location-events-list { display: flex; flex-direction: column; gap: .5rem; }
.location-event-row {
  display: grid; grid-template-columns: 56px 5.5rem 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  gap: .1rem .75rem;
  padding: .5rem .75rem;
  background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow);
  text-decoration: none; color: inherit;
  transition: box-shadow .15s;
}
.location-event-row:hover { box-shadow: var(--shadow-md); }
.location-event-row--past { opacity: .7; }
.location-event-row--past:hover { opacity: 1; }
.location-event-img {
  width: 56px; height: 56px; object-fit: cover; border-radius: var(--radius-sm);
  grid-row: 1 / 3; grid-column: 1; flex-shrink: 0;
}
.location-event-img--placeholder {
  width: 56px; height: 56px; border-radius: var(--radius-sm);
  grid-row: 1 / 3; grid-column: 1;
  background: var(--gradient-placeholder);
}
.location-event-date { font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--gold); font-weight: 600; grid-row: 1; grid-column: 2; align-self: end; }
.location-event-title { font-size: var(--fs-md); font-weight: 600; color: var(--text); grid-row: 1; grid-column: 3; align-self: end; }
.location-event-meta { font-family: var(--font-sans); font-size: var(--fs-xs); color: var(--text-muted); grid-row: 2; grid-column: 2 / 4; align-self: start; }
.location-no-events { font-family: var(--font-sans); font-size: var(--fs-base); color: var(--text-muted); margin-top: 1.5rem; }

/* ── Content pages ─────────────────────────────────────────── */
.content-page { max-width: 900px; margin: 0 auto; padding: 2rem 1.5rem; }
.content-page h1 { font-size: var(--fs-page-h1); margin-bottom: .5rem; color: var(--burgundy); }
.intro { color: var(--text-muted); font-family: var(--font-sans); margin-bottom: 2rem; }

.search-page-form { margin-bottom: 2rem; }
.search-page-row { display: flex; gap: .5rem; }
.search-page-input {
  flex: 1; font-family: var(--font-sans); font-size: var(--fs-md);
  padding: .55rem 1.1rem; border-radius: 24px;
  border: 1.5px solid var(--stone-dark); outline: none;
}
.search-page-input:focus { border-color: var(--burgundy); }
.search-page-btn {
  font-family: var(--font-sans); font-size: var(--fs-md);
  padding: .55rem 1.4rem; border-radius: 24px;
  background: var(--burgundy); color: var(--white);
  border: none; cursor: pointer; font-weight: 600;
}
.search-page-btn:hover { opacity: .85; }
.search-section { margin-bottom: 2.5rem; }
.search-section-title { font-size: var(--fs-lg); color: var(--burgundy); margin-bottom: 1rem; }
.search-no-results { color: var(--text-muted); font-style: italic; }
.location-cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }

/* ── Sources ───────────────────────────────────────────────── */
.sources-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.25rem; }
.source-card {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.source-card--inactive { opacity: .7; }
.source-card-header { display: flex; align-items: center; gap: .75rem; }
.source-card-header .source-status { margin-left: auto; }
.source-logo {
  width: 38px; height: 38px; border-radius: var(--radius);
  background: var(--burgundy); color: var(--white);
  font-size: var(--fs-xl); font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.source-name { font-size: var(--fs-lg); color: var(--burgundy); }
.source-description { font-family: var(--font-sans); font-size: var(--fs-base); color: var(--text-muted); }
.source-meta { font-family: var(--font-sans); font-size: var(--fs-base); display: grid; grid-template-columns: auto 1fr; gap: .2rem .75rem; color: var(--text-muted); }
.source-meta dt { font-weight: 600; }
.source-link { font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); word-break: break-all; margin-top: auto; }
.source-link:hover { color: var(--burgundy); }
.source-status { font-family: var(--font-sans); font-size: var(--fs-xs); padding: .15rem .5rem; border-radius: var(--radius-sm); white-space: nowrap; }
.status--active   { background: #d4edda; color: #155724; }
.status--inactive { background: #fff3cd; color: #856404; }

/* ── Improvement report ────────────────────────────────────── */
.improvement-section { margin-top: 3rem; border-top: 2px solid var(--stone-dark); padding-top: 2rem; }
.improvement-title { font-size: var(--fs-subh); color: var(--burgundy); margin-bottom: .5rem; }
.improvement-intro { font-family: var(--font-sans); font-size: var(--fs-md); color: var(--text-muted); max-width: 720px; margin-bottom: .4rem; }
.improvement-date { font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); margin-bottom: 1.25rem; }
.improvement-list { display: flex; flex-direction: column; gap: .85rem; }

.improvement-item {
  background: var(--white);
  border-radius: var(--radius);
  border-left: 4px solid var(--stone-dark);
  padding: .85rem 1rem;
  box-shadow: var(--shadow);
}
.improvement-item--no_wikipedia,
.improvement-item--no_source_photo_no_wikipedia { border-left-color: #e07b39; }
.improvement-item--no_wikipedia_photo           { border-left-color: var(--gold); }
.improvement-item--source_no_photo              { border-left-color: #7b9e3e; }
.improvement-item--source_unreachable           { border-left-color: #b03030; }

.improvement-item-header { display: flex; align-items: center; gap: .75rem; margin-bottom: .4rem; }
.improvement-city { font-weight: 600; font-size: var(--fs-md); }
.improvement-badge {
  font-family: var(--font-sans); font-size: var(--fs-xs); padding: .15rem .5rem;
  border-radius: var(--radius-sm); white-space: nowrap;
  background: var(--stone-dark); color: var(--text-muted);
}
.improvement-badge--no_wikipedia,
.improvement-badge--no_source_photo_no_wikipedia { background: #fde8d8; color: #a04010; }
.improvement-badge--no_wikipedia_photo           { background: #fef3d0; color: #7a5500; }
.improvement-badge--source_no_photo              { background: #eaf2d8; color: #3a5a10; }
.improvement-badge--source_unreachable           { background: #fde8e8; color: #8b1a1a; }

.improvement-advice { font-family: var(--font-sans); font-size: var(--fs-base); color: var(--text); line-height: 1.5; }
.improvement-source-link { font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); display: inline-block; margin-top: .3rem; }
.improvement-source-link:hover { color: var(--burgundy); }
.improvement-events { font-family: var(--font-sans); font-size: var(--fs-sm); color: var(--text-muted); margin-top: .35rem; }

/* ── Admin ─────────────────────────────────────────────────── */
.admin-header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.admin-actions { display: flex; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.scrape-status { font-family: var(--font-sans); font-size: var(--fs-base); color: var(--text-muted); }
.admin-table { width: 100%; border-collapse: collapse; font-family: var(--font-sans); font-size: var(--fs-base); }
.admin-table th { text-align: left; padding: .5rem .75rem; background: var(--stone-dark); font-weight: 600; }
.admin-table td { padding: .5rem .75rem; border-bottom: 1px solid var(--stone-dark); }
.error-cell { font-size: var(--fs-xs); color: #c0392b; max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.status-badge { display: inline-block; padding: .15rem .45rem; border-radius: var(--radius-sm); font-size: var(--fs-xs); font-weight: 600; font-family: var(--font-sans); }
.status-badge--success { background: #d4edda; color: #155724; }
.status-badge--failed  { background: #f8d7da; color: #721c24; }
.status-badge--running { background: #fff3cd; color: #856404; }
.status-badge--partial { background: #d1ecf1; color: #0c5460; }

/* ── Buttons ───────────────────────────────────────────────── */
.btn {
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  padding: .5rem 1.2rem;
  border-radius: var(--radius);
  border: none;
  cursor: pointer;
  transition: background .15s;
}
.btn--primary { background: var(--burgundy); color: var(--white); }
.btn--primary:hover { background: var(--burgundy-light); }
.btn--secondary { background: var(--white); color: var(--burgundy); border: 1.5px solid var(--burgundy); }
.btn--secondary:hover { background: var(--stone); }
.btn:disabled { opacity: .6; cursor: not-allowed; }
.btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 1px; }

/* ── Footer ────────────────────────────────────────────────── */
.site-footer {
  background: var(--text);
  color: rgba(255,255,255,.6);
  padding: 1rem 1.5rem;
  margin-top: 3rem;
}
.footer-inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem;
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
}
.footer-inner a { color: rgba(255,255,255,.7); }
.footer-inner a:hover { color: var(--gold-light); }

/* ── Archive ───────────────────────────────────────────────── */
.archive-cta {
  background: var(--white);
  border: 2px solid var(--gold);
  border-radius: var(--radius);
  padding: 1.25rem;
  margin-bottom: 2rem;
}
.archive-cta h2 { font-size: var(--fs-xl); color: var(--burgundy); margin-bottom: 1rem; }
.archive-cta .btn { margin-top: 1rem; display: inline-block; }
.events-grid--small { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.archive-all-heading { margin-top: 2rem; }

.past-banner {
  background: #fff8e1;
  border-left: 4px solid var(--gold);
  padding: .75rem 1rem;
  margin-bottom: 1.25rem;
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  border-radius: 0 var(--radius) var(--radius) 0;
}
.past-banner a { color: var(--burgundy); font-weight: 600; }

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
  font-family: var(--font-sans);
  font-size: var(--fs-md);
}
.pagination-btn {
  padding: .4rem .9rem;
  border: 1.5px solid var(--stone-dark);
  border-radius: var(--radius);
  color: var(--burgundy);
}
.pagination-btn:hover { background: var(--stone-dark); text-decoration: none; }

/* ── Loading state ─────────────────────────────────────────── */
.loading { opacity: .5; pointer-events: none; }
.spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--stone-dark); border-top-color: var(--burgundy); border-radius: 50%; animation: spin .6s linear infinite; vertical-align: middle; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 768px) {
  .detail-layout { grid-template-columns: 1fr; }
  .map-container { grid-template-columns: 1fr; grid-template-rows: 400px auto; }
}
@media (max-width: 640px) {
  .map-container { grid-template-rows: 300px auto; }
  .filters-section { top: var(--header-height-mobile); }
  .filter-label { min-width: 0; width: 100%; }
  .fullpage-map-wrap { height: calc(100vh - var(--header-height-mobile)); }
  .hero-search-input { min-width: 0; flex: 1; }
  .search-input { min-width: 0; width: 100%; }
  .search-page-input { min-width: 0; }
  .site-nav { gap: .75rem; flex-wrap: wrap; }
}

/* ── Print ─────────────────────────────────────────────────── */
.detail-meta-print { display: none; }

@media print {
  .site-header, .site-footer, .back-link, .past-banner,
  .detail-sidebar, .detail-img-overlays, .detail-location { display: none !important; }

  body { font-size: 11pt; color: #000; background: #fff; }
  .detail-layout { display: block; padding: 0; max-width: 100%; }
  .detail-title { font-size: 20pt; margin-bottom: .2rem; }
  .detail-city a, .detail-city { color: #000; font-weight: 600; }
  .detail-description { font-size: 12pt; line-height: 2; }

  /* Afbeelding rechts als vierkante box, volledig getoond zonder uitsnijden */
  .detail-img-wrapper { float: right; margin: 0 0 1rem 1.5rem; width: 50%; aspect-ratio: 1 / 1; }
  .detail-img { width: 100%; height: 100%; object-fit: contain; object-position: right top; }

  /* Categorie-overlay bewaren bij printen */
  .detail-img-cat { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* Datum + locatie op één regel */
  .detail-meta-print { display: block; font-family: var(--font-sans); font-size: 10pt; color: #555; margin: .4rem 0 1rem; }

  /* Links plat maken, bron-URL uitschrijven */
  a { color: #000; text-decoration: none; }
  .detail-source a::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
}