/* Tijdspoor — shared visitor-facing design, loaded after page styles. */
:root {
  --bg:#142923; --panel:#1b332c; --card:#203b32; --card2:#29483d;
  --text:#f6f1e7; --muted:#b9c5bb; --accent:#e5c28a; --accent2:#ca9f61;
  --ts-bg:var(--bg); --ts-navy:var(--bg); --ts-card:var(--card);
  --ts-card-strong:var(--card2); --ts-text:var(--text); --ts-muted:var(--muted);
  --ts-accent:var(--accent); --ts-accent-dark:var(--accent2);
  --shadow:0 14px 35px #071b1626; --shadow2:0 5px 18px #071b161a;
  --line:rgba(229,194,138,.19); --radius:20px;
}
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body { background:var(--bg); color:var(--text); font-family:'Avenir Next','Segoe UI',sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,.ts-title-font,.sectietitel { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.025em; line-height:1.2; text-wrap:balance; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid #efd09d !important; outline-offset:4px; }
::selection { background:#e5c28a; color:#142923; }
button:not(:disabled),summary { cursor:pointer; }
button:disabled { opacity:.5; cursor:not-allowed; }
.sticky-header { background:rgba(20,41,35,.96); border-bottom:1px solid var(--line); box-shadow:none; backdrop-filter:blur(16px); }
.header-shell { min-height:92px; }
.brand-mark { width:52px; height:52px; padding:0; background:transparent; border:0; box-shadow:none; }
.brand-mark::after { display:none; }
.brand-name { font:400 32px/1 Georgia,serif; letter-spacing:-.04em; text-shadow:none; }
.brand-subline { padding:0; border:0; background:none; font-size:10px; font-weight:500; letter-spacing:.12em; color:var(--muted); }
.header-cluster { background:none; border:0; box-shadow:none; padding:0; }
.header-pill,.pill-link,.lang-pill,.route-knop,.cta-button,.mobile-action { font-family:'Avenir Next','Segoe UI',sans-serif; letter-spacing:0; }
.header-pill,.btn-soft,.pill-link,.trailbtn,.ghost-link { background:#213a31; border:1px solid var(--line); color:var(--text); box-shadow:none; border-radius:10px; font-weight:600; }
.btn-primary,.header-pill.primary,.cta-link,.cta-button { background:var(--accent); color:#182d24; border:1px solid var(--accent); border-radius:10px; box-shadow:none; font-weight:700; text-shadow:none; }
.btn-primary,.btn-soft,.cta-link,.cta-button { min-height:48px; padding:12px 20px; line-height:1.4; }
.btn-primary:hover,.header-pill.primary:hover,.cta-link:hover,.cta-button:hover { background:#f0d2a1; color:#182d24; filter:none; box-shadow:0 5px 16px #0002; }
.btn-soft:hover,.header-pill:not(.primary):hover,.pill-link:hover,.trailbtn:hover { background:#305043; border-color:var(--accent); color:var(--text); }
.lang-pill { border:1px solid transparent; background:transparent; color:var(--muted); font-size:12px; font-weight:600; }
.lang-pill.active,.ts-lang-chip.active { color:var(--accent); background:#e5c28a12; border-color:var(--line); }
.panel { border:1px solid var(--line); border-radius:20px; background:var(--panel); box-shadow:none; }
.section-kicker,.hero-eyebrow { font:600 11px/1.5 'Avenir Next','Segoe UI',sans-serif; letter-spacing:.16em; color:var(--accent); }
.meta-pill,.chip,.spotlight-chip,.device-badge { background:#e5c28a0d; border-color:var(--line); color:var(--accent); font-size:12px; font-weight:500; }
.podcard,.spotlight-card { border:1px solid var(--line); border-radius:16px; background:var(--card); box-shadow:none; transition:transform .2s,border-color .2s; }
.podcard:hover,.spotlight-card:hover { transform:translateY(-4px); border-color:#e5c28a80; box-shadow:0 15px 30px #071b1633; }
.podcard h2,.spotlight-card h3 { font-size:27px; }
.podcard img,.spotlight-card img { height:220px; }
.spotlight-body { padding:24px; display:flex; flex-direction:column; flex:1; }
.spotlight-card { display:flex; flex-direction:column; }
.spotlight-body > p { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.spotlight-meta { margin-top:auto; padding-top:18px; }
.spotlight-chip { align-self:flex-start; font-size:9px; letter-spacing:.1em; }
.stat-card { background:transparent; border:0; border-right:1px solid var(--line); border-radius:0; box-shadow:none; padding:16px 26px; }
.stat-card:last-child { border-right:0; }
.stat-card strong { font:400 31px/1.2 Georgia,serif; }
.stat-card span { font-size:13px; color:var(--muted); }
.stats-grid { padding:16px 0; border-bottom:1px solid var(--line); }
.link-tile,.why-item { background:#ffffff03; border-color:var(--line); border-radius:10px; }
.link-tile:hover { background:#e5c28a0c; border-color:#e5c28a60; }
#wandelingen { scroll-margin-top:110px; background:#233d33; }
#wandelingen label { color:var(--text) !important; font-weight:600; font-size:12px; letter-spacing:.03em; }
#zoekveld,#sorteer { background:#152b23; border:1px solid #627368; border-radius:10px; color:var(--text); min-height:48px; }
#zoekveld::placeholder { color:#b6c1b7; }
details.faq { background:#203b32; border:1px solid var(--line); border-radius:12px; margin-bottom:12px; }
details.faq summary { padding:20px; color:var(--text); font-weight:600; }
details.faq[open] { border-color:#e5c28a70; }
details .ans { color:var(--muted); line-height:1.85; }
.legal { max-width:850px; margin-inline:auto; }
.legal h2 { font-size:25px; margin-top:2rem; }
.legal p,.legal li { line-height:1.85; }
body > footer { border-top:1px solid var(--line); background:#10231d; }
body > footer a { text-underline-offset:5px; }
.floating-cta { padding-bottom:env(safe-area-inset-bottom); }
#ts-menu-sheet { box-sizing:border-box; background:#172e25; border-color:var(--line); padding:28px; width:min(420px,94vw); height:100dvh; }
#ts-menu-fab,.ts-menu-close { background:#294438; border-color:var(--line); color:var(--text); border-radius:10px; }
.ts-menu-title { font-size:28px; }
.ts-menu-head { margin-bottom:24px; }
.ts-menu-lang { background:#ffffff04; border-color:var(--line); border-radius:12px; padding:16px; }
.ts-menu-link { background:transparent; border-radius:12px; border-color:var(--line); padding:16px; }
.ts-menu-link:hover { background:#e5c28a0b; border-color:var(--accent); }
.ts-menu-link-title { font:600 16px/1.4 'Avenir Next','Segoe UI',sans-serif; }
.ts-menu-link-sub { font-size:13px; }
body.ts-menu-open { overflow:hidden; }
#kaart-header { background:#172e25; border-color:var(--line); }
#kaart-header h1 { color:var(--accent); font-family:Georgia,serif; text-shadow:none; }
#map { border-color:var(--line); }
/* The illustrated opening is deliberately scoped to the homepage. */
.ts-home .hero { margin:24px auto 0; max-width:1440px; border:1px solid var(--line); border-radius:24px; background:#1b332c; }
.ts-home .hero::before { background:linear-gradient(90deg,rgba(12,32,25,.96) 0%,rgba(12,32,25,.87) 30%,rgba(12,32,25,.27) 70%,rgba(12,32,25,.08)),linear-gradient(0deg,#102b2170,transparent 65%); }
.ts-home .hero-img { object-position:center; filter:none; transform:none; }
.ts-home .hero-inner { padding-top:70px; padding-bottom:58px; }
.ts-home .hero-grid { grid-template-columns:minmax(0,1fr); }
.ts-home .hero-copy { max-width:600px; }
.ts-home .hero h1 { color:#fff5e2 !important; font-size:clamp(42px,5.3vw,72px); line-height:1.04; letter-spacing:-.045em; text-shadow:none !important; }
.ts-home .hero-copy > p { font-size:17px; max-width:470px; line-height:1.75 !important; color:#e0e6dc !important; }
.ts-home .hero-eyebrow { border:0; padding:0; background:none; margin-bottom:22px; }
.ts-home .hero-eyebrow::before { height:6px; width:6px; background:var(--accent); box-shadow:none; }
.ts-home .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.ts-home .hero-proof { display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:28px; }
.ts-home .hero-proof-item { padding:0; border:0; box-shadow:none; background:none; font-size:11px; color:#d1dace; }
.ts-home .hero-proof-item::before { content:'✓'; color:var(--accent); margin-right:6px; }
.ts-home .device-badge { background:none; border:0; padding:0; color:#b8c9b9; font-size:11px; margin-top:22px; }
.ts-home .hero-copy > .mt-5 { display:none; }
.ts-home .app-showcase { margin:38px 0 0; }
.ts-home .hero-side-card { max-width:none; margin:0; padding:28px 32px; background:#eae2d1; color:#20362a; border:0; border-radius:16px; box-shadow:none; backdrop-filter:none; }
.ts-home .hero-card-title { font:400 28px/1.2 Georgia,serif; color:#20362a; }
.ts-home .hero-side-card > p { color:#526052 !important; font-size:14px; max-width:650px; }
.ts-home .hero-mini-steps { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:24px; }
.ts-home .hero-mini-step { border:0; padding:0; background:none; border-radius:0; }
.ts-home .hero-mini-step-num { border:1px solid #8c9a86; background:none; color:#36503a; font:400 20px/1 Georgia,serif; width:34px; height:34px; }
.ts-home .hero-mini-step strong { color:#20362a; font-size:14px; }
.ts-home .hero-mini-step span { color:#526052; font-size:13px; }
.ts-home .hero-store-note { display:none; }
.ts-home main > section.panel { padding:32px; }
.ts-home main > section > .section-kicker { margin-bottom:12px; }
.ts-home main h2 { font-size:clamp(27px,3vw,36px); }
.ts-home .podcard h2 { font-size:26px; }
@media (min-width:768px) { .ts-home .hero { width:calc(100% - 48px); } }
@media (max-width:767px) {
  .header-shell { min-height:78px; gap:12px; }
  .brand-name { font-size:26px; }
  .brand-mark { width:40px; height:40px; }
  .brand-subline { display:none; }
  .header-actions { gap:8px; }
  .header-cluster { gap:5px; }
  .header-actions .lang-switch { display:none; }
  .header-pill { padding:9px; font-size:12px; min-height:42px; }
  .header-menu { width:42px; }
  .ts-home .hero { margin-top:0; border-radius:0 0 20px 20px; border-top:0; }
  .ts-home .hero::before { background:linear-gradient(90deg,#102b21e8,#102b2170),linear-gradient(0deg,#102b21d9,transparent); }
  .ts-home .hero-inner { padding-top:50px; padding-bottom:40px; }
  .ts-home .hero-copy { max-width:540px; }
  .ts-home .hero h1 { font-size:48px; }
  .ts-home .hero-copy > p { font-size:16px; }
  .ts-home .hero-proof { gap:10px; flex-direction:column; }
  .ts-home .hero-side-card { padding:24px; }
  .ts-home .hero-mini-steps { grid-template-columns:1fr; gap:18px; }
  .ts-home main > section.panel { padding:22px; }
  .stat-card { padding:12px; }
  .stat-card strong { font-size:23px; }
  .stat-card span { font-size:12px; }
  .spotlight-grid { grid-template-columns:1fr; }
  #wandelingen .flex.items-end { flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
}
.popup-content { background:#203b32; border-color:var(--line); box-shadow:0 12px 30px #071b1633; }
.popup-content h3 { color:var(--accent); font-family:Georgia,serif; font-weight:400; }
.popup-content img { border-color:var(--line); }
.popup-content a { background:var(--accent); color:#182d24; border-radius:9px; }
/* Neutralize the legacy condensed button font and full-width hero action. */
.btn-primary,.btn-soft,.cta-button,.trailbtn,.hero-card-title { font-family:'Avenir Next','Segoe UI',sans-serif; letter-spacing:0; }
.ts-home .hero h1 { font-weight:400; font-size:clamp(42px,4.6vw,66px); }
.ts-home .hero-actions > a { width:auto; font-size:14px; }
.ts-home .hero-copy { max-width:620px; }
.ts-home .hero-card-title { font-family:Georgia,serif; }
@media (max-width:767px) {
  .ts-home .header-shell { display:flex; flex-direction:row; align-items:center; padding-top:12px; padding-bottom:12px; }
  .ts-home .header-actions { width:auto; flex-wrap:nowrap; }
  .ts-home .brand-lockup { gap:8px; }
  .ts-home .header-actions .header-pill.primary { display:none; }
  .ts-home .hero h1 { font-size:44px; }
}
/* Keep fixed navigation stable during first paint. */
body { animation:none; }
.ts-route *, .ts-route *::before, .ts-route *::after { box-sizing:border-box; }
.ts-route .card { background:var(--panel); border:1px solid var(--line); box-shadow:none; border-radius:16px; padding:24px; }
.ts-route .col-left,.ts-route .col-right { display:grid; gap:16px; min-width:0; }
.ts-route .sectietitel { font:400 24px/1.3 Georgia,serif; letter-spacing:-.02em; }
.ts-route .hero h1 { font-weight:400; letter-spacing:-.03em; font-size:42px; }
.ts-route .omschrijving { font-size:16px; line-height:1.8; }
.ts-route .trailer-btn { background:#2a483a; }
.ts-route .circle-icon { color:#233b2b; }
.ts-route .mobile-action { background:#264434; color:var(--text); border-color:var(--line); border-radius:10px; }
.ts-route .mobile-action.primary { background:var(--accent); color:#182d24; }
.ts-route .route-knop { max-width:100%; white-space:normal; background:#294c38; color:var(--text); border:1px solid var(--line); border-radius:10px; }
.ts-route .lang-switch { background:#172e25dc; border-color:var(--line); }
.ts-route .store-choice { background:#203b32; border-color:var(--line); }
.ts-route .store-choice strong { font-family:inherit; }
details.faq summary { font-family:'Avenir Next','Segoe UI',sans-serif; letter-spacing:0; }
#map { box-sizing:border-box; }
.ts-home .app-showcase { min-height:0; display:block; }

/* Visitor experience v2 — shared components and editorial image treatments. */
[hidden] { display:none !important; }
.visitor-nav { display:flex; align-items:center; gap:24px; margin-left:auto; margin-right:24px; font-size:14px; }
.visitor-nav a { color:var(--text); text-decoration:none; }
.visitor-nav a:hover { color:var(--accent); }
.skip-link { position:fixed; top:8px; left:12px; z-index:20000; padding:12px 18px; border-radius:8px; background:var(--accent); color:#142923; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.catalog-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:24px; }
.catalog-heading h2 { margin:0 0 10px; color:var(--text); font-weight:400; }
.catalog-heading p { margin:0; color:var(--muted); font-size:15px; }
.distance-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.distance-filters button { min-height:44px; padding:10px 18px; font-size:13px; border-radius:999px; border:1px solid #688071; color:var(--text); background:transparent; font-weight:600; }
.distance-filters button[aria-pressed=true] { background:var(--accent); border-color:var(--accent); color:#142923; }
.distance-filters button:hover { border-color:var(--accent); }
#wandelingen { scroll-margin-top:20px; }
#wandelingen #zoekveld,#wandelingen #sorteer { background:#172e25 !important; border:1px solid #718474 !important; }
#resetFilters { min-width:48px; }
#resultCount { color:var(--muted) !important; }
.ts-home .hero-inner { padding-top:52px; padding-bottom:42px; }
.ts-home .hero h1 { font-size:clamp(42px,4.1vw,60px); }
.ts-home .hero-copy > p { margin-bottom:12px; }
.ts-home .hero-proof { margin-top:20px; }
.ts-home .device-badge { margin-top:14px; }
.ts-home .hero-side-card { position:relative; overflow:hidden; padding-right:28%; min-height:280px; }
.ts-home .hero-side-card::after { content:''; position:absolute; right:0; top:0; bottom:0; width:25%; background:url('/assets/heritage/walking-kit-v1.jpg') center/cover; }
.ts-home .hero-mini-steps { grid-template-columns:1fr; gap:16px; }
.ts-home .spotlight-grid { gap:24px; }
.ts-home .podcard { display:flex; flex-direction:column; }
.ts-home .podcard > .p-5 { display:flex; flex-direction:column; flex:1; padding:24px; }
.ts-home .podcard > .p-5 > .btn-primary { margin-top:auto; }
.ts-home .podcard .truncate2 { min-height:44px; }
.ts-home .podcard h2 { font-weight:400; }
.ts-home .floating-cta { display:none; }
.ts-home .split-callout { gap:32px; }
.ts-home .link-tile { font-size:14px; }
.ts-home blockquote { border-left:3px solid var(--accent) !important; background:#142923 !important; box-shadow:none !important; line-height:1.9; }
/* Supporting pages are readable, richly illustrated, and consistent. */
.editorial-banner { overflow:hidden; height:260px; border-radius:22px 22px 0 0; border:1px solid var(--line); border-bottom:0; }
.editorial-banner img { width:100%; height:100%; object-fit:cover; object-position:50% 60%; display:block; }
.editorial-banner + .panel { border-top-left-radius:0; border-top-right-radius:0; padding:40px; }
.ts-help h1,.ts-info h1,.ts-legal h1,.ts-discover h1 { font-weight:400; font-size:clamp(34px,4vw,48px); }
.ts-help .sticky-header img,.ts-info .sticky-header img,.ts-legal .sticky-header img { width:44px !important; height:44px !important; }
.ts-help .sticky-header .text-3xl,.ts-info .sticky-header .text-3xl,.ts-legal .sticky-header .text-3xl { font:400 29px/1 Georgia,serif; color:var(--text) !important; }
.ts-help details.faq,.ts-info details.faq { margin-bottom:12px; overflow:hidden; background:#213b30; }
details.faq summary { font-size:16px; font-family:'Avenir Next','Segoe UI',sans-serif; min-height:60px; padding:18px 22px; line-height:1.5; gap:20px; }
details.faq summary [aria-hidden] { color:var(--accent); font-size:22px; flex-shrink:0; }
details.faq .ans { padding:0 22px 24px; font-size:16px; font-family:inherit; line-height:1.8; }
.ts-info .tabs { gap:6px; padding:6px; border-radius:12px; background:#11281f; border:1px solid var(--line); }
.ts-info .tab-btn { font-family:inherit; border:0; border-radius:8px; min-height:44px; padding:12px 16px; color:var(--muted); background:transparent; }
.ts-info .tab-btn[aria-selected=true] { background:var(--accent); color:#142923; }
.ts-info .kader { background:#213b30; border-color:var(--line); border-radius:12px; box-shadow:none; }
.ts-info .section-title { font:400 27px/1.3 Georgia,serif; color:var(--accent); margin-bottom:14px; }
.ts-info .cta { background:var(--accent); color:#142923; border-radius:10px; font-family:inherit; }
.discovery-banner { height:320px; }
.ts-discover .panel h2,.ts-discover .panel h3 { font-weight:400; }
.ts-discover .cta-link { display:inline-flex; align-items:center; }
.ts-discover .ghost-link { display:inline-flex; padding:10px 14px; }
.ts-discover article .p-5 > p:not(.text-sm) { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }
.ts-legal .legal { overflow:hidden; padding:36px; }
.legal-art { height:180px; margin:-36px -36px 32px; background:linear-gradient(0deg,#14292355,transparent),url('/assets/heritage/canal-path-v1.jpg') center 48%/cover; }
.contents-nav { display:flex; flex-wrap:wrap; gap:8px; padding:20px 0; margin:12px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.contents-nav strong { flex-basis:100%; font-size:12px; text-transform:uppercase; letter-spacing:.12em; color:var(--muted); }
.contents-nav a { font-size:13px; color:var(--accent); padding:7px 10px; border:1px solid var(--line); border-radius:7px; text-decoration:none; }
.contents-nav a:hover { background:#e5c28a12; }
.legal h2 { scroll-margin-top:110px; }
.route-jumps { display:flex; flex-wrap:wrap; gap:8px; padding:18px 0 0; }
.route-jumps a { padding:10px 16px; border:1px solid var(--line); border-radius:999px; color:var(--text); font-size:13px; text-decoration:none; }
.route-jumps a:hover { border-color:var(--accent); }
.route-kit-image { width:calc(100% + 48px); max-width:none; height:170px; object-fit:cover; display:block; margin:-24px -24px 24px; border-radius:16px 16px 0 0; }
.ts-route .wrap { max-width:1120px; }
.ts-route .hero { min-height:380px; }
.ts-route .mobile-actions { background:#142923f5; border-top:1px solid var(--line); padding-bottom:max(10px,env(safe-area-inset-bottom)); }
.ts-route .mobile-action { min-height:48px; font-size:13px; font-weight:600; box-shadow:none; }
.ts-route .top-actions { padding-right:60px; }
.ts-route .hero-content { bottom:28px; left:28px; }
.audio-status { position:fixed; z-index:9995; bottom:100px; left:50%; transform:translateX(-50%); max-width:calc(100vw - 40px); width:480px; background:#f1dfbd; color:#3d261c; box-shadow:0 10px 40px #0005; padding:18px 22px; border-radius:12px; }
[aria-busy=true] { opacity:.65; cursor:progress; }
/* Native app-store chooser. */
.store-dialog { box-sizing:border-box; border:1px solid var(--line); padding:0; background:#1b332c; color:var(--text); border-radius:22px; width:min(520px,calc(100vw - 32px)); max-height:90dvh; overflow:auto; box-shadow:0 30px 100px #0008; }
.store-dialog::backdrop { background:#081c14c9; backdrop-filter:blur(6px); }
.store-dialog > img { width:100%; height:200px; object-fit:cover; display:block; }
.store-dialog-copy { padding:28px; }
.store-dialog h2 { font-size:32px; font-weight:400; margin:0 0 16px; }
.store-dialog p { color:var(--muted); margin:0 0 24px; }
.dialog-close { position:absolute; right:12px; top:12px; width:44px; height:44px; font-size:28px; border:1px solid var(--line); border-radius:50%; background:#142923; color:white; cursor:pointer; }
.store-dialog-links { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.store-dialog-links a { display:flex; flex-direction:column; gap:4px; text-align:center; font-size:16px; }
.store-dialog-links small { font-size:11px; font-weight:400; }
/* A useful footer on every content page. */
.visitor-footer { margin-top:64px; padding:48px max(24px,calc((100vw - 1088px)/2)) 28px; background:#0f241b; border-top:1px solid var(--line); }
.footer-inner { display:flex; justify-content:space-between; gap:48px; }
.footer-brand { display:flex; justify-content:space-between; gap:80px; font:400 38px/1 Georgia,serif; color:var(--text); text-decoration:none; }
.footer-brand span { color:var(--accent); }
.footer-inner p { font-size:14px; max-width:300px; color:var(--muted); margin:16px 0 0; }
.footer-inner nav { display:grid; grid-template-columns:1fr 1fr; gap:12px 32px; }
.visitor-footer a { text-decoration:none; }
.footer-inner nav a { font-size:14px; color:var(--text); }
.visitor-footer a:hover { color:var(--accent); text-decoration:underline; text-underline-offset:5px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:36px; padding-top:22px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.footer-bottom nav { display:flex; flex-wrap:wrap; gap:16px; }
/* Map + browse directory: no overlay blocking the map while data loads. */
body.ts-map { height:auto; min-height:100dvh; padding:0; }
.map-topbar { height:80px; display:flex; align-items:center; gap:12px; padding:12px 24px; background:#142923; border-bottom:1px solid var(--line); }
.map-brand { font:400 32px/1 Georgia,serif; margin-right:auto; color:var(--text); text-decoration:none; }
.map-layout { display:grid; grid-template-columns:360px minmax(0,1fr); height:calc(100dvh - 80px); }
.map-directory { overflow-y:auto; background:#1b332c; }
.map-directory-art { height:150px; background:url('/assets/heritage/canal-path-v1.jpg') center 54%/cover; }
.map-directory-heading { padding:24px; }
.map-directory h1 { font-size:27px; color:var(--text); margin:0 0 12px; }
.map-directory-heading p { color:var(--muted); font-size:14px; margin:0; }
.map-route { display:grid; grid-template-columns:64px minmax(0,1fr) 38px; gap:12px; padding:18px 20px; border-top:1px solid var(--line); align-items:start; }
.map-route > img { width:64px; height:74px; object-fit:cover; border-radius:8px; }
.map-route h2 { font-size:20px; margin:0 0 5px; }
.map-route h2 a { text-decoration:none; color:var(--text); }
.map-route p { font-size:12px; color:var(--muted); margin:0 0 8px; }
.map-route-link { color:var(--accent); text-decoration:none; font-size:12px; }
.map-show { color:var(--accent); background:#294735; border:1px solid var(--line); border-radius:8px; min-height:44px; }
.map-canvas { position:relative; min-width:0; }
.ts-map #map { width:100%; height:100%; border:0; border-radius:0; box-shadow:none; }
#map-status:empty { display:none; }
#map-status { position:absolute; bottom:24px; left:24px; right:24px; z-index:800; padding:12px 18px; border-radius:10px; background:#173425; color:var(--text); font-size:14px; }
.heritage-marker span { display:grid; place-items:center; width:34px; height:34px; background:#1b4630; color:#fff2d9; border:2px solid #ead3a8; border-radius:50% 50% 50% 4px; font:600 13px/1 'Segoe UI',sans-serif; box-shadow:0 4px 12px #0004; }
.ts-map .leaflet-popup-content-wrapper { background:#203b32; border:1px solid var(--line); }
.ts-map .leaflet-popup-tip { background:#203b32; }
.ts-map .popup-content { padding:10px; box-shadow:none; border:0; }
.ts-map .popup-content img { max-width:none; width:100%; height:110px; object-fit:cover; }
/* Start / confirmation / unavailable states. */
.ts-state { margin:0; min-height:100vh; background:#142923; }
.state-nav { max-width:1120px; margin:auto; padding:24px; display:flex; justify-content:space-between; align-items:center; }
.state-nav .footer-brand { font-size:30px; }
.state-card { display:grid; grid-template-columns:1fr 1fr; max-width:1000px; margin:30px auto 60px; border:1px solid var(--line); border-radius:24px; overflow:hidden; background:#1b332c; }
.state-art { min-height:480px; background:url('/assets/heritage/canal-path-v1.jpg') 40% center/cover; }
.state-copy { padding:48px; display:flex; flex-direction:column; justify-content:center; }
.state-copy h1 { font-size:44px; margin:0 0 20px; color:var(--text); }
.state-copy p { color:var(--muted); margin:0 0 24px; }
.state-copy .store-choices { display:grid; gap:12px; }
.state-copy > a { margin-top:24px; color:var(--accent); }
@media(max-width:760px) {
  .catalog-heading { align-items:flex-start; gap:12px; }
  .catalog-heading > a { padding:10px 12px; font-size:12px; flex-shrink:0; }
  .catalog-heading h2 { font-size:28px !important; }
  .distance-filters { gap:8px; }
  .distance-filters button { font-size:12px; padding:10px 13px; }
  #wandelingen .flex.items-end { width:100%; }
  #wandelingen .flex.items-end > div { flex:1; min-width:0; }
  #sorteer { min-width:0 !important; width:100%; font-size:16px; }
  #zoekveld { font-size:16px; }
  .ts-home .hero-inner { padding-top:38px; padding-bottom:32px; }
  .ts-home .hero h1 { font-size:42px; }
  .ts-home .hero-proof { gap:8px; }
  .ts-home .hero-side-card { padding:24px; padding-top:190px; }
  .ts-home .hero-side-card::after { height:165px; width:100%; bottom:auto; background-position:50% 58%; }
  .visitor-nav { display:none; }
  .editorial-banner { height:190px; }
  .editorial-banner + .panel { padding:24px; }
  .ts-info .tabs { display:grid; grid-template-columns:1fr 1fr; }
  .ts-info .tab-btn { padding:10px 8px; font-size:13px; }
  .ts-route .hero { min-height:300px; }
  .ts-route .hero-content { left:20px; bottom:20px; }
  .ts-route .hero h1 { font-size:34px; }
  .route-jumps { gap:6px; }
  .route-jumps a { font-size:12px; padding:9px 12px; }
  .route-kit-image { height:200px; }
  .visitor-footer { margin-top:40px; padding:32px 24px 28px; }
  .ts-route .visitor-footer { padding-bottom:110px; }
  .footer-inner { flex-direction:column; gap:28px; }
  .footer-brand { justify-content:flex-start; gap:24px; font-size:32px; }
  .footer-bottom { flex-direction:column; }
  .map-topbar { height:72px; padding:12px 16px; }
  .map-brand { font-size:26px; }
  .map-topbar .btn-soft { font-size:12px; padding:10px 12px; }
  .map-layout { display:flex; flex-direction:column; height:auto; }
  .map-directory { overflow:visible; }
  .map-directory-art { height:140px; }
  .map-canvas { height:55dvh; min-height:360px; order:-1; }
  .map-directory h1 { font-size:28px; }
  .state-card { grid-template-columns:1fr; margin:12px 16px 40px; }
  .state-art { min-height:220px; }
  .state-copy { padding:28px; }
  .state-copy h1 { font-size:36px; }
}
/* Final readability and mobile target sizing. */
body:not(.ts-map) [style*="148,163,184"] { color:var(--muted) !important; }
.ts-info .muted { color:var(--muted); }
.ts-info .cta { box-shadow:none; }
.ts-route .col-right { min-width:0; }
#ts-menu-sheet[aria-hidden=true] { visibility:hidden; }
body.ts-menu-open #ts-menu-sheet { visibility:visible; }
@media(max-width:760px) {
  .ts-route .wrap { padding:0 12px; }
  .ts-route .hero-content { right:16px; left:16px; }
  .ts-route .meta-row { gap:6px; }
  .ts-route .chip { font-size:12px; padding:7px 10px; }
  .ts-route .card { padding:20px; }
  .ts-route .route-kit-image { width:calc(100% + 40px); margin:-20px -20px 20px; }
  .ts-legal .legal { padding:24px; }
  .legal-art { margin:-24px -24px 24px; height:150px; }
  .store-dialog-links { grid-template-columns:1fr; }
  .catalog-heading .section-kicker { font-size:9px; }
}
.route-start-card { overflow:hidden; }
.route-start-art { float:right; width:110px; height:130px; border-radius:10px; object-fit:cover; margin:0 0 16px 20px; }
.ts-route .route-start-card .route-knop { display:inline-flex; width:auto; font-size:14px; padding:12px 16px; }
.route-excerpt { margin:0 0 16px; color:var(--text); line-height:1.8; font-size:16px; }
.route-readmore summary { color:var(--accent); font-size:14px; padding:10px 0; min-height:44px; }
.route-readmore[open] summary { margin-bottom:12px; }
.route-summary:has(.route-readmore[open]) .route-excerpt { display:none; }
@media(max-width:760px) { .route-start-art { width:86px; height:100px; margin-left:12px; } }
.map-route > div:only-child { grid-column:1 / -1; }
