/* Camino - stijl volgens het mobiele ontwerp (0.7.0: herberg-status, bellen, slapen).
   Kleuren: papier + inkt, Camino-blauw en -geel. Geel alleen als accent,
   nooit als tekstkleur (te weinig contrast). */

:root {
  --c-paper: #F5F1E8;
  --c-card: #FFFFFF;
  --c-ink: #1F1D1A;
  --c-ink-2: #45403A;
  --c-muted: #5E5850;
  --c-line: #E3DCCD;
  --c-line-2: #D6CDBB;
  --c-soft: #EDE6D8;
  --c-blue: #1D4F7A;
  --c-blue-dark: #143A5C;
  --c-blue-soft: #E4EDF4;
  --c-yellow: #C98A12;
  --c-kicker: #8A5B00;
  --c-warn-bg: #F7E3D2;
  --c-warn-ink: #6E2E08;
  --c-night: #1F3B52;              /* desktop-achtergrond */
  --c-serif: 'Source Serif 4', Georgia, serif;
  /* 'Source Sans 3' bevat alleen het cijfer 0 (gewone nul i.p.v. de doorgestreepte); zie camino-fonts.css. */
  --c-sans: 'Source Sans 3', 'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif;
  --c-booking: #003B95;
  --c-radius: 14px;
  --c-column: 480px;               /* ~1/3 van een desktopscherm */
}

/* ── Pagina: smalle kolom, op desktop op Camino-blauw ───────────────── */
body.camino-page {
  background: var(--c-paper);
  color: var(--c-ink);
  font-family: var(--c-sans);
  font-size: 17px;
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
}
/* De smalle kolom: de blokken die Bricks maakt (header, inhoud, footer). */
.camino-shell,
body.camino-page #brx-header,
body.camino-page #brx-content,
body.camino-page #brx-footer {
  max-width: var(--c-column);
  margin-left: auto;
  margin-right: auto;
  background: var(--c-paper);
}
body.camino-page #brx-content { min-height: 70vh; padding: 16px 20px 32px; box-sizing: border-box; }
body.camino-page #brx-content > * { max-width: 100%; }
body.camino-page #brx-header { position: relative; z-index: 10; }
@media (min-width: 700px) {
  body.camino-page {
    background-color: var(--c-night);
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1440' height='1000' viewBox='0 0 1440 1000'%3E%3Cg fill='none' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M-20 820C160 760 260 640 420 600' stroke='%23C98A12' opacity='.55'/%3E%3Cpath d='M-20 260C140 300 300 280 420 360' stroke='%23C98A12' opacity='.4'/%3E%3Cpath d='M1460 180C1300 240 1180 330 1060 380' stroke='%239FB8CC' stroke-dasharray='8 6' opacity='.5'/%3E%3Cpath d='M1460 760C1320 700 1200 640 1080 610' stroke='%239FB8CC' stroke-dasharray='8 6' opacity='.4'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .camino-shell,
  body.camino-page #brx-content { box-shadow: 0 0 60px rgba(0, 0, 0, .25); }
}

.camino-page h1, .camino-page h2 { font-family: var(--c-serif); font-weight: 700; line-height: 1.15; margin: 0; }
.camino-page h1 { font-size: 34px; }
.camino-page h2 { font-size: 24px; }
.camino-page a { color: var(--c-blue); }
.camino-kicker { font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--c-kicker); }
.camino-klein { font-size: 14px; color: var(--c-muted); }

/* ── Taalkeuze: uitklapmenu (0.10.0) ──────────────────────────────── */
.camino-talen { position: relative; }
.camino-talen summary { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border: 1px solid var(--c-line-2);
  border-radius: 10px; font-weight: 700; font-size: 15px; cursor: pointer; list-style: none; }
.camino-talen summary::-webkit-details-marker { display: none; }
.camino-talen ul { position: absolute; right: 0; top: calc(100% + 6px); z-index: 1000; margin: 0; padding: 6px; list-style: none; min-width: 180px;
  background: #fff; border: 1px solid var(--c-line); border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.camino-talen li a { display: block; padding: 10px 12px; border-radius: 8px; font-size: 16px; text-decoration: none; color: var(--c-ink) !important; }
.camino-talen li a.is-current { background: var(--c-soft); font-weight: 700; }

/* Koreaans: Atkinson heeft geen Hangul - val terug op een systeemlettertype. */
.camino-lang-ko, .camino-page [lang="ko"] { --c-sans: 'Source Sans 3', 'Atkinson Hyperlegible', 'Apple SD Gothic Neo', 'Malgun Gothic', 'Noto Sans KR', system-ui, sans-serif;
  --c-serif: 'Source Serif 4', 'Apple SD Gothic Neo', 'Malgun Gothic', 'Noto Serif KR', serif; word-break: keep-all; }

/* ── Kaartjes, tegels, streepjes ────────────────────────────────────── */
.camino-kaartje { background: var(--c-card); border: 1px solid var(--c-line); border-radius: 16px; padding: 14px; margin: 12px 0; }
.camino-tegels { display: grid; gap: 10px; margin: 12px 0; }
.camino-tegels.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.camino-tegels.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.camino-tegel { background: var(--c-card); border: 1px solid var(--c-line); border-radius: 12px; padding: 12px; }
.camino-tegel-label, .camino-route-cijfers small { display: block; font-size: 13px; color: var(--c-muted); }
.camino-tegel-waarde { font-size: 20px; font-weight: 700; }
.camino-tegels.is-2 .camino-tegel-waarde { font-size: 22px; }

.camino-level { display: inline-flex; align-items: center; gap: 8px; }
.camino-bars { display: inline-flex; gap: 3px; }
.camino-bar { width: 16px; height: 8px; border-radius: 2px; background: var(--c-line-2); }
.camino-bar.is-on { background: var(--c-ink); }
.camino-label { align-self: flex-start; display: inline-block; padding: 4px 10px; border-radius: 999px; background: #F3E6C8;
  font-size: 13px; font-weight: 700; color: #6B4700; }

/* ── Wanneer lopen ─────────────────────────────────────────────────── */
.camino-wanneer { display: flex; flex-direction: column; gap: 12px; padding: 16px; }
.camino-wanneer h2 { font-size: 21px; }
.camino-seizoenen { display: flex; flex-direction: column; gap: 8px; }
.camino-seizoen { display: flex; align-items: center; gap: 12px; min-height: 28px; }
.camino-seizoen-naam { width: 72px; font-weight: 700; }
.camino-seizoen .camino-bar { width: 18px; height: 9px; }
.camino-seizoen-label { font-size: 15px; color: var(--c-ink-2); }
.camino-melding { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 10px; }
.camino-melding svg { flex-shrink: 0; margin-top: 2px; }
.camino-melding div { display: flex; flex-direction: column; gap: 2px; font-size: 15px; line-height: 1.45; }
.camino-melding strong { font-size: 16px; }
.camino-melding.is-goed { background: var(--c-blue-soft); color: var(--c-blue-dark); }
.camino-melding.is-afgeraden, .camino-melding.is-minder { background: var(--c-warn-bg); color: var(--c-warn-ink); }

/* ── Lijsten ───────────────────────────────────────────────────────── */
.camino-lijst, .camino-routes { display: flex; flex-direction: column; gap: 12px; }
.camino-rij { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 76px; padding: 14px 16px;
  background: var(--c-card); border: 1px solid var(--c-line); border-radius: var(--c-radius); text-decoration: none; color: var(--c-ink) !important; }
.camino-rij > span { display: flex; flex-direction: column; gap: 4px; }
.camino-rij strong { font-size: 20px; }
.camino-rij span span { font-size: 15px; color: var(--c-muted); }

.camino-sorteer { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }
.camino-sorteer button { min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--c-ink); background: #fff;
  color: var(--c-ink); font: 700 15px var(--c-sans); cursor: pointer; }
.camino-sorteer button[aria-pressed="true"] { background: var(--c-ink); color: #fff; }

.camino-route { display: flex; flex-direction: column; gap: 14px; padding: 18px 16px; background: var(--c-card); border: 1px solid var(--c-line);
  border-radius: 16px; text-decoration: none; color: var(--c-ink) !important; }
.camino-route-kop { display: flex; flex-direction: column; gap: 4px; }
.camino-route-kop strong { font-family: var(--c-serif); font-size: 21px; line-height: 1.2; }
.camino-route-kop span { font-size: 15px; color: var(--c-muted); }
.camino-route-cijfers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.camino-route-cijfers b { font-size: 17px; }
.camino-route-voet { padding-top: 12px; border-top: 1px solid var(--c-soft); font-size: 15px; color: var(--c-ink-2); }
.camino-route-voet b { color: var(--c-ink); margin-right: 6px; }

.camino-etappes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.camino-etappe { display: flex; flex-direction: column; gap: 10px; padding: 14px 14px 12px; background: var(--c-card); border: 1px solid var(--c-line);
  border-radius: var(--c-radius); text-decoration: none; color: var(--c-ink) !important; }
.camino-etappe-kop { display: flex; align-items: center; gap: 12px; }
.camino-etappe-kop > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.camino-etappe-kop strong { font-size: 17px; line-height: 1.25; }
.camino-etappe-kop span span { font-size: 15px; color: var(--c-ink-2); }
.camino-nr { flex-shrink: 0; width: 34px; height: 34px; border-radius: 999px; background: var(--c-ink); color: #fff; display: flex;
  align-items: center; justify-content: center; font-size: 15px; font-weight: 700; }
.camino-mini { display: block; height: 36px; }

/* ── Kaart, profiel, knoppen ───────────────────────────────────────── */
.camino-kaart-wrap { padding: 0; overflow: hidden; }
.camino-kaart { height: 280px; background: #E8EEE4; position: relative; }
.camino-kaart-hint { position: absolute; z-index: 500; left: 12px; top: 12px; padding: 4px 10px; border-radius: 999px; background: #fff;
  font-size: 13px; font-weight: 700; color: var(--c-ink-2); pointer-events: none; }
.camino-profiel-wrap { margin: 12px 0; }
.camino-profiel { display: block; }
.camino-knoppen { display: flex; gap: 8px; padding: 12px; }
.camino-herberg .camino-knoppen { padding: 0; }
.camino-knop { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: 12px; border: 0;
  background: var(--c-blue); color: #fff !important; font: 700 16px var(--c-sans); text-decoration: none; }
.camino-knop.is-rand { background: transparent; border: 1px solid var(--c-blue); color: var(--c-blue) !important; }
.camino-knop.is-uit { background: var(--c-soft); color: var(--c-muted) !important; font-size: 15px; }

.camino-herbergen { display: flex; flex-direction: column; gap: 12px; margin: 24px 0 8px; }
.camino-herberg { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: var(--c-card); border: 1px solid var(--c-line); border-radius: var(--c-radius); }
.camino-herberg-kop { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.camino-herberg-kop > span:first-child { display: flex; flex-direction: column; gap: 3px; }
.camino-herberg-kop strong { font-size: 18px; }
.camino-herberg-kop span span { font-size: 15px; color: var(--c-ink-2); }

.camino-etappe-nav { display: flex; gap: 10px; margin: 24px 0 32px; }
.camino-etappe-nav a { flex: 1; display: flex; align-items: center; min-height: 56px; padding: 0 14px; border-radius: 12px; background: #fff;
  border: 1px solid var(--c-line); text-decoration: none; color: var(--c-ink) !important; font-weight: 700; }
.camino-etappe-nav a.is-volgende { justify-content: flex-end; }

.camino-bron { font-size: 13px; line-height: 1.5; color: var(--c-muted); border-top: 1px solid var(--c-line); padding-top: 20px; margin-top: 24px; }

.camino-page a:focus-visible, .camino-page button:focus-visible { outline: 3px solid var(--c-yellow); outline-offset: 2px; }

/* ── Herberg: status, slapen, bellen (0.7.0) ───────────────────────── */
.camino-status { flex-shrink: 0; padding: 5px 12px; border-radius: 999px; font-size: 14px; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.camino-status.is-open { background: #1E7A3C; color: #FFFFFF; border: 1px solid #1E7A3C; font-size: 15px; }
.camino-status.is-gesloten { background: var(--c-soft); color: var(--c-ink-2); border: 1px solid var(--c-line-2);
  text-transform: none; letter-spacing: 0; font-size: 13px; white-space: normal; text-align: right; max-width: 55%; }
.camino-slapen { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 15px; color: var(--c-ink-2); }
.camino-slapen li::before { content: "·"; margin-right: 8px; font-weight: 700; color: var(--c-muted); }
.camino-bellen { display: flex; flex-direction: column; gap: 8px; }
.camino-knop.is-bel { justify-content: flex-start; gap: 10px; padding: 0 14px; background: var(--c-blue); font-variant-numeric: tabular-nums; }

/* ── Herberg: sluitdatum en kenmerken (0.7.0) ──────────────────────── */
.camino-status-noot { margin: -2px 0 0; font-size: 14px; font-weight: 700; }
.camino-status-noot.is-open { color: #14632F; }
.camino-status-noot.is-gesloten { color: var(--c-ink-2); }
.camino-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.camino-chip { padding: 4px 10px; border-radius: 999px; font-size: 13px; font-weight: 700; background: var(--c-soft); color: var(--c-ink-2); }
.camino-chip.is-beheer.is-publiek { background: var(--c-blue-soft); color: var(--c-blue-dark); }
.camino-chip.is-donativo { background: #F3E6C8; color: #6B4700; }
.camino-chip.is-maaltijd { background: #E6EFE0; color: #2F5220; }

/* ── Steile klim (0.8.0) ──────────────────────────────────────────── */
.camino-steil { display: inline-block; margin: 0 0 12px; }

/* ── Herberg: adres (0.9.0) ────────────────────────────────────────── */
.camino-adres { display: flex; align-items: flex-start; gap: 8px; min-height: 44px; padding: 10px 12px; border-radius: 10px;
  background: var(--c-blue-soft); color: var(--c-blue-dark) !important; font-size: 15px; font-weight: 700; line-height: 1.35; text-decoration: none; }
.camino-adres svg { flex-shrink: 0; margin-top: 1px; }

/* ── Weer (0.10.0) ────────────────────────────────────────────────── */
.camino-weer { display: flex; flex-direction: column; gap: 10px; }
.camino-weer-kop { display: flex; justify-content: space-between; align-items: baseline; }
.camino-weer-kop span { font-size: 13px; color: var(--c-muted); }
.camino-weer-dagen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-height: 132px; }
.camino-weer-dag { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 4px; border-radius: 12px; background: var(--c-paper); }
.camino-weer-dag.is-laden { animation: camino-puls 1.2s ease-in-out infinite; }
.camino-weer-dag svg { width: 36px; height: 36px; }
.camino-weer-naam { font-size: 14px; font-weight: 700; text-transform: capitalize; }
.camino-weer-temp { font-size: 17px; font-weight: 700; }
.camino-weer-temp span { font-weight: 400; color: var(--c-muted); }
.camino-weer-regen { font-size: 13px; font-weight: 700; color: var(--c-blue); text-align: center; }
@keyframes camino-puls { 50% { opacity: .5; } }
@media (prefers-reduced-motion: reduce) { .camino-weer-dag.is-laden { animation: none; } }

/* ── Slapen in: compacte lijst (0.10.0) ───────────────────────────── */
.camino-herbergen-kop { display: flex; justify-content: space-between; align-items: baseline; }
.camino-herbergen-kop span { font-size: 14px; color: var(--c-muted); }
.camino-herberg-rij { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: var(--c-card); border: 1px solid var(--c-line); border-radius: 16px; }
.camino-herberg-link { display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: var(--c-ink) !important; }
.camino-herberg-status { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.camino-herberg-naam { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: var(--c-blue); }
.camino-herberg-naam strong { font-size: 19px; line-height: 1.25; color: var(--c-ink); }
.camino-herberg-prijzen { display: flex; gap: 16px; font-size: 16px; }
.camino-herberg-prijzen span { display: inline-flex; align-items: center; gap: 6px; }
.camino-chip.is-slaapzaal, .camino-chip.is-privekamers { background: transparent; border: 1px solid var(--c-line-2); }
.camino-knop.is-booking { background: var(--c-booking); }
.camino-knop.is-booking-alle { background: transparent; border: 2px solid var(--c-booking); color: var(--c-booking) !important; text-align: center; padding: 8px 12px; }
.camino-knop.is-groot { min-height: 52px; font-size: 17px; }

/* ── Herbergpagina (0.10.0) ───────────────────────────────────────── */
.camino-terug { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; text-decoration: none; }
.camino-herberg-top { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 8px; }
.camino-herberg-plek { display: flex; flex-direction: column; gap: 10px; }
.camino-kaart.is-klein { height: 160px; border-radius: 12px; }
.camino-knop.is-bel { justify-content: flex-start; padding: 0 14px; margin-bottom: 8px; }
.camino-tabel { margin: 0; }
.camino-tabel div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--c-soft); }
.camino-tabel dt { color: var(--c-ink-2); }
.camino-tabel dd { margin: 0; font-weight: 700; text-align: right; }
.camino-herberg-bron { display: flex; flex-direction: column; gap: 6px; margin: 20px 0 24px; font-size: 13px; color: var(--c-muted); }
.camino-herberg-bron p { margin: 0; }
.camino-herberg-bron a { font-weight: 700; }

/* ── Tips (0.12.0) ────────────────────────────────────────────────── */
.camino-tips ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; }
.camino-tips li { line-height: 1.5; }
.camino-tips li::marker { color: var(--c-yellow); }

/* ── Kruimelpad (0.12.1) ──────────────────────────────────────────── */
.camino-kruimel { display: flex; flex-wrap: wrap; gap: 4px; font-size: 14px; color: var(--c-muted); }
.camino-kruimel a { display: inline-flex; align-items: center; min-height: 32px; font-weight: 700; text-decoration: none; }

/* ── Bricks-opmaak op Camino-pagina's (0.12.5) ────────────────────── */
/* Header: logo links, taalknop rechts, ruimte aan de zijkanten. */
body.camino-page #brx-header { border-bottom: 1px solid var(--c-line); }
body.camino-page #brx-header .brxe-section,
body.camino-page #brx-header .brxe-container {
  width: 100%; max-width: 100%; padding: 0; margin: 0;
}
body.camino-page #brx-header .brxe-container {
  display: flex; flex-direction: row; align-items: center; justify-content: space-between;
  gap: 12px; padding: 10px 20px; box-sizing: border-box;
}
body.camino-page #brx-header .brxe-text-basic,
body.camino-page #brx-header .brxe-text {
  font-family: var(--c-serif); font-size: 21px; font-weight: 700; color: var(--c-ink); margin: 0;
}
body.camino-page #brx-header .brxe-shortcode { flex: 0 0 auto; margin-left: auto; }
.camino-talen { display: inline-block; flex: 0 0 auto; }
.camino-talen summary { background: var(--c-card); }

/* Inhoud: titel, teaser, intro met rustige tussenruimte. */
body.camino-page #brx-content .brxe-section,
body.camino-page #brx-content .brxe-container { width: 100%; max-width: 100%; padding: 0; gap: 16px; }
body.camino-page #brx-content h1 { margin: 8px 0 0; }
body.camino-page #brx-content .brxe-post-excerpt {
  font-size: 19px; line-height: 1.45; color: var(--c-ink-2, #45403A); margin: 0;
}
body.camino-page #brx-content .brxe-post-content p { margin: 0 0 14px; }
body.camino-page #brx-content .brxe-post-content p:last-child { margin-bottom: 0; }

/* Footer: bronvermelding met ruimte. */
body.camino-page #brx-footer { border-top: 1px solid var(--c-line); }
body.camino-page #brx-footer .brxe-section,
body.camino-page #brx-footer .brxe-container { width: 100%; max-width: 100%; margin: 0; }
body.camino-page #brx-footer .brxe-container { padding: 16px 20px 24px; box-sizing: border-box; }

/* ── 0.13.0 ───────────────────────────────────────────────────────── */
/* Witregel onder de paginatitel. */
body.camino-page #brx-content h1 { margin: 8px 0 14px; }

/* Taalkeuze altijd boven de kaart: Leaflet in een eigen laag. */
body.camino-page #brx-header { z-index: 1000; }
.camino-talen ul { z-index: 1100; }
.camino-kaart { position: relative; z-index: 0; isolation: isolate; }

/* OPEN-label in de herberglijst een maatje kleiner. */
.camino-herberg-rij .camino-status { padding: 3px 9px; font-size: 12px; letter-spacing: .05em; }

/* Belknop: wit op blauw. */
.camino-knop.is-bel { background: var(--c-blue); color: #fff !important; border: 0; }

/* Foto's (Wikimedia Commons). */
.camino-herberg-rij.has-foto .camino-herberg-link { flex-direction: row; align-items: flex-start; gap: 12px; }
.camino-herberg-thumb { width: 72px; height: 72px; flex-shrink: 0; border-radius: 12px; object-fit: cover; background: var(--c-soft); }
.camino-herberg-tekst { display: flex; flex-direction: column; gap: 8px; min-width: 0; flex: 1; }
.camino-herberg-foto { margin: 4px 0 8px; }
.camino-herberg-foto img { display: block; width: 100%; height: auto; max-height: 260px; object-fit: cover; border-radius: 16px; }
.camino-herberg-foto figcaption { margin-top: 6px; font-size: 12px; color: var(--c-muted); }
.camino-herberg-foto figcaption a { color: inherit; }

/* ── 0.14.0: informatieblokken, contact, affiliatemelding ───────────── */
.camino-info { display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 16px; }
.camino-info h2 { margin: 0; font-family: var(--c-serif); font-size: 24px; }
.camino-info h3 { margin: 10px 0 0; font-size: 18px; }
.camino-info p { margin: 0; line-height: 1.6; }
.camino-info ul { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; line-height: 1.5; }
.camino-info ul li::marker { color: var(--c-yellow); }
.camino-teken { width: 100%; max-width: 236px; height: auto; margin-bottom: 4px; }
.camino-info.is-over p:last-child { font-family: var(--c-serif); font-style: italic; font-size: 18px; }

.camino-contact { display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 16px; }
.camino-contact h2 { margin: 0; font-family: var(--c-serif); font-size: 24px; }
.camino-form { display: flex; flex-direction: column; gap: 12px; }
.camino-form label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 700; }
.camino-form input, .camino-form textarea {
  font: inherit; font-weight: 400; font-size: 16px; padding: 12px; border: 1px solid var(--c-line-2); border-radius: 10px;
  background: #fff; color: var(--c-ink); width: 100%; box-sizing: border-box; }
.camino-form input:focus, .camino-form textarea:focus { outline: 2px solid var(--c-blue); outline-offset: 1px; }
.camino-form .camino-lok { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.camino-form button { min-height: 52px; font-size: 17px; cursor: pointer; }
.camino-melding.is-ok { padding: 12px; border-radius: 10px; background: #E6F2E9; color: #14632F; font-weight: 700; margin: 0; }
.camino-melding.is-fout { padding: 12px; border-radius: 10px; background: #FBE9E7; color: #8A1F14; font-weight: 700; margin: 0; }

.camino-affiliate { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--c-soft); font-size: 13px; line-height: 1.45; color: var(--c-ink-2, #45403A); }
.camino-affiliate a { font-weight: 700; }

/* ── 0.14.1: kaartje "Over deze site" ─────────────────────────────── */
.camino-rij.is-info { gap: 14px; }
.camino-rij.is-info > span { flex: 1; }
.camino-rij-teken { flex-shrink: 0; border-radius: 10px; }

/* ── 0.16.0 ───────────────────────────────────────────────────────── */
.camino-info .camino-meer { font-weight: 700; text-decoration: none; }
.camino-info.is-privacy h3:first-child { margin-top: 0; }

/* ── 0.18.3: compacte Booking-knop in de herberglijst ─────────────── */
.camino-herberg-rij .camino-knop.is-booking.is-klein,
.camino-knop.is-booking.is-klein {
  display: inline-flex; align-self: flex-start; width: auto; min-height: 0;
  padding: 7px 14px; border-radius: 999px; font-size: 14px; line-height: 1.2;
}

/* ── 0.18.4: affiliatemelding als één kleine grijze regel ──────────── */
.camino-affiliate { padding: 0; background: none; font-size: 12px; color: var(--c-muted); }
.camino-affiliate a { font-weight: 700; color: inherit; }

/* ── 0.18.5: compacte knop ook op de herbergpagina ─────────────────── */
.camino-herberg-pagina .camino-knop.is-booking.is-klein { align-self: flex-start; margin-top: 2px; }
.camino-herberg-pagina .camino-affiliate { margin-bottom: 0; }

/* ── 0.19.0: doorlinken naar aansluitende route ───────────────────── */
.camino-etappe-nav { flex-wrap: wrap; }
.camino-etappe-nav .is-vervolg, .camino-etappe-nav .is-voorloper { flex-basis: 100%; text-align: center; }

/* ── 0.20.0: kruispunt ─────────────────────────────────────────────── */
.camino-kruispunt { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; margin: 0 0 12px;
  border-radius: 14px; background: #FFF6DB; border: 1px solid #F2C230; color: var(--c-ink); }
.camino-kruispunt svg { flex-shrink: 0; color: #B8860B; margin-top: 2px; }
.camino-kruispunt p { margin: 4px 0 0; line-height: 1.45; }
.camino-kruispunt a { display: inline-block; margin-top: 6px; font-weight: 700; text-decoration: none; }

/* ── 0.21.2: labels in de etappelijst ─────────────────────────────── */
.camino-etappe-labels { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 6px; }
.camino-etappe .camino-label.is-kruispunt { background: #FFF6DB; border-color: #F2C230; color: #7A5B00; }

/* ── 0.22.0: advies, kopjes, ruimte tussen kaartjes ─────────────────── */
.camino-lijst + .camino-lijst { margin-top: 14px; }
.camino-lijst { gap: 14px; }
.camino-info h4 { margin: 8px 0 0; font-size: 16px; color: var(--c-blue); }
.camino-info.is-advies h3 { font-family: var(--c-serif); font-size: 22px; margin-top: 14px; }
.camino-info.is-advies h3:first-child { margin-top: 0; }
.camino-info strong { color: var(--c-ink); }

/* ── 0.23.0: aanloop ───────────────────────────────────────────────── */
.camino-etappe .camino-label.is-aanloop { background: #ECEFF3; border-color: #C9D1DB; color: #3D4B5C; }
.camino-spoor-bron { margin: 8px 14px 0; font-size: 12px; color: var(--c-muted); }

/* ── 0.24.0: samen met ─────────────────────────────────────────────── */
.camino-etappe .camino-label.is-samen { background: #E6F0F7; border-color: #B9D2E6; color: #1D4F7A; }

/* ── 0.25.0: seizoenstip ───────────────────────────────────────────── */
.camino-melding.is-tip { background: #FFF6DB; color: #5C4400; }
.camino-melding.is-tip svg { color: #B8860B; }

/* ── 0.27.0: bron van het spoor ────────────────────────────────────── */
.camino-spoor-bron a { color: inherit; text-decoration: underline; }

/* ── 0.29.0: expeditie ─────────────────────────────────────────────── */
.camino-label.is-expeditie { margin-top: 6px; background: #FBE9E7; border-color: #E8A99E; color: #8A1F14; }
.camino-melding.is-expeditie { margin-top: 12px; background: #FBE9E7; color: #8A1F14; }

/* ── 0.32.0: wandelroute (geen Camino) ─────────────────────────────── */
.camino-label.is-wandelroute { margin-top: 6px; background: #E6F0F7; border-color: #B9D2E6; color: #1D4F7A; }
.camino-melding.is-wandelroute { margin-top: 12px; background: #E6F0F7; color: #1D4F7A; }

/* ── 0.34.0: ruimte tussen tegels (ook als Bricks elke shortcode apart verpakt) ── */
.camino-lijst { gap: 16px; }
.brxe-shortcode + .brxe-shortcode > .camino-lijst,
.brxe-shortcode + .brxe-shortcode .camino-lijst:first-child,
.camino-lijst + .camino-lijst { margin-top: 16px; }
.camino-rij-teken.is-vlag { box-shadow: 0 0 0 1px rgba(0,0,0,.08); border-radius: 10px; }

/* ── 0.34.2: koprij op de telefoon ─────────────────────────────────────
   Bricks zet een container op smalle schermen soms onder elkaar; dan stond de
   taalknop onder "Pilgrimways" (links) en klapte het menu buiten beeld.
   Altijd naast elkaar, taalknop rechts; het menu blijft binnen het scherm. */
body.camino-page #brx-header .brxe-container {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
}
body.camino-page #brx-header .brxe-container > * { width: auto !important; min-width: 0; }
body.camino-page #brx-header .brxe-shortcode { margin-left: auto !important; flex: 0 0 auto; }
.camino-talen ul { right: 0; left: auto; max-width: calc(100vw - 24px); }

/* ── 0.35.0 ───────────────────────────────────────────────────────── */
/* Tegels lopen niet over ("Gemiddeld" in drie smalle kolommen). */
.camino-tegels.is-3 .camino-tegel-waarde { font-size: clamp(15px, 4.2vw, 20px); overflow-wrap: anywhere; hyphens: auto; }
.camino-tegel-waarde { overflow-wrap: anywhere; }
.camino-tegel-sub { margin-top: 2px; font-size: 13px; color: var(--c-muted); }
/* Half balkje bij "licht tot gemiddeld" / "gemiddeld tot zwaar". */
.camino-bar.is-half { background: linear-gradient(90deg, var(--c-ink) 50%, var(--c-line-2, #DDD4C4) 50%); }
/* Handige links (boot reserveren). */
.camino-links { display: flex; flex-direction: column; gap: 10px; }
.camino-links h2 { margin: 0; font-family: var(--c-serif); font-size: 20px; }
.camino-links .camino-knoppen { display: flex; flex-wrap: wrap; gap: 8px; }
.camino-links .camino-knop { flex: 1 1 200px; text-align: center; }

/* ── 0.36.0: reisinformatie ───────────────────────────────────────── */
.camino-vlucht { display: flex; flex-direction: column; gap: 12px; margin: 14px 0 22px; }
.camino-vlucht label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; font-weight: 600; color: var(--c-muted); }
.camino-vlucht input, .camino-vlucht select { min-height: 46px; padding: 0 12px; border: 1px solid var(--c-line-2); border-radius: 10px;
  background: var(--c-card); color: var(--c-ink); font: inherit; font-size: 16px; font-weight: 400; width: 100%; box-sizing: border-box; }
.camino-vlucht-rij { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.camino-vlucht button { width: 100%; justify-content: center; }
.camino-vlucht-fout { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FBE9E7; color: #8A1F14; font-size: 15px; }
.camino-vervoer { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 22px; }
.camino-vervoer .camino-knop { flex: 1 1 160px; text-align: center; justify-content: center; }

/* ── 0.38.0: Zo kom je bij de start ───────────────────────────────── */
.camino-aanreis { margin-top: 16px; }
.camino-aanreis h2 { margin-top: 0; }
.camino-aanreis .camino-vlucht { border: 0; padding: 0; background: none; box-shadow: none; margin-bottom: 8px; }

/* ── 0.38.1: aanreis op de routepagina: alleen tekst + link ──────── */
.camino-aanreis-link { margin: 8px 0 0; font-weight: 700; }
#vluchten { scroll-margin-top: 16px; }

/* ── 0.39.0: populair startpunt ───────────────────────────────────── */
.camino-label.is-populair { background: #FFF6DB; border-color: #EAD38A; color: #5C4400; }
.camino-melding.is-populair { margin-top: 12px; background: #FFF6DB; color: #5C4400; }

/* ── 0.40.0 ───────────────────────────────────────────────────────── */
/* Waarschuwing bij een etappe: rood en opvallend. */
.camino-melding.is-waarschuwing { margin: 0 0 14px; background: #FBE3E1; color: #8A1F14; border: 2px solid #D7262B; }
.camino-melding.is-waarschuwing strong { font-size: 17px; }
.camino-label.is-waarschuwing { background: #D7262B; border-color: #D7262B; color: #fff; }
/* Logo in de koptekst. */
.camino-logo { display: inline-flex; align-items: center; line-height: 0; }
.camino-logo img { height: 44px; width: auto; }
@media (min-width: 600px) { .camino-logo img { height: 56px; } }
.camino-logo.is-tekst { line-height: 1.2; font-family: var(--c-serif); font-weight: 700; font-size: 24px; color: var(--c-ink); text-decoration: none; }
/* Voettekst: dezelfde marge als de rest van de inhoud. */
.camino-bron { padding-left: 20px; padding-right: 20px; }

/* ── 0.44.0: zonsopkomst en -ondergang in het weerblok ─────────────── */
.camino-weer-dag.is-zon { background: #FFF6DB; }
.camino-zon { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; align-items: flex-start; }
.camino-zon-rij { display: flex; align-items: center; gap: 8px; }
.camino-zon-rij > span { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.camino-zon-rij small { font-size: 12px; color: var(--c-muted); }
.camino-zon-rij b { font-size: 18px; }

/* ── 0.46.1: belknoppen en etappenavigatie gecentreerd ──────────────── */
.camino-knop.is-bel { justify-content: center; text-align: center; }
.camino-etappe-nav a, .camino-etappe-nav a.is-volgende { justify-content: center; text-align: center; }

/* ── 0.53.0: Buy Me a Coffee ────────────────────────────────────────── */
.camino-bmc { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 12px;
  background: #FFDD00; color: #000 !important; border: 2px solid #000; font-weight: 700; font-size: 17px;
  text-decoration: none !important; line-height: 1.2; }
.camino-bmc:hover { background: #ffe633; }
.camino-bmc span { font-size: 22px; }
.camino-info.is-steun p:last-child { margin-bottom: 0; }

/* ── 0.56.1: variant-etappe in de etappelijst van de hoofdroute ────── */
.camino-etappes li.is-variant { margin-left: 28px; }
.camino-etappe.is-variant { border-left: 4px solid #D9A400; border-radius: 4px 14px 14px 4px; gap: 10px; }
.camino-etappe.is-variant .camino-label.is-variant { align-self: flex-start; color: #6B5200; background: #FFF4CC; border-color: #F2D675; }
.camino-nr.is-variant { background: #FFF4CC; color: #6B5200; font-size: 20px; }
@media (max-width: 480px) { .camino-etappes li.is-variant { margin-left: 16px; } }

/* ── 0.57.1: Pilgrimways op het beginscherm ───────────────────────── */
.camino-installeer { display: flex; gap: 14px; align-items: flex-start; }
.camino-installeer[hidden] { display: none; }
.camino-installeer img { flex: none; width: 40px; height: 40px; border-radius: 10px; }
.camino-installeer strong { display: block; font-size: 17px; margin-bottom: 4px; }
.camino-installeer p { margin: 0 0 10px; }
.camino-installeer .camino-deel { vertical-align: -3px; color: var(--c-blue); }