/* ReisEuro — vaste routepagina's. Zelfde kleuren, kaarten, labels en knoppen als de planner (css/style.css). */
:root{--font:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --primary:#2f5f98;--on-primary:#fff;--surface:#f8f9ff;--card:#fff;--ink:#191c20;--mut:#43474e;--line:#c3c6cf;--tonal:#eceef4;
  --gold-ink:#7a5900;--ok-bg:#d3f0da;--ok-ink:#0b5223;--spec-bg:#fff0d1;--spec-ink:#6b4700;
  --trein:#1f63c6;--hst:#6c3fc4;--nacht:#2b2f70;--bus:#11845a;--boot:#00788a;
  --r-s:8px;--r-m:12px;--r-l:18px;--e1:0 1px 2px rgba(16,32,64,.06),0 2px 8px rgba(16,32,64,.07);--bd:1px solid color-mix(in srgb,var(--line) 70%,transparent);color-scheme:light}
@media (prefers-color-scheme:dark){:root{--primary:#a5c8ff;--on-primary:#00315e;--surface:#111318;--card:#191c20;--ink:#e1e2e8;--mut:#c3c6cf;--line:#43474e;--tonal:#1d2024;
  --gold-ink:#f2b233;--ok-bg:#0b5223;--ok-ink:#c9f2d3;--spec-bg:#4d3700;--spec-ink:#ffdf9e;--e1:0 1px 2px rgba(0,0,0,.5);color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--surface);color:var(--ink);font:400 16px/1.55 var(--font)}
header.appbar{background:var(--surface);border-top:3px solid #1f4f8f;border-bottom:1px solid var(--line)}
.ab-in{max-width:1180px;margin:auto;padding:14px 18px;display:flex;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:12px;flex:1;text-decoration:none;color:inherit}
.logo{width:44px;height:44px;flex:none;filter:drop-shadow(0 2px 4px rgba(22,57,107,.25))}
.wordmark{display:flex;flex-direction:column;line-height:1}
.wordmark b{font:700 22px var(--font);letter-spacing:-.3px}
.wordmark i{font:700 11px var(--font);font-style:normal;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-ink);margin-top:3px}
.cta-s{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:999px;border:1px solid var(--line);color:var(--primary);font:500 14px var(--font);text-decoration:none}
main{max-width:860px;margin:0 auto;padding:18px 18px 40px}
.crumbs{font-size:13px;color:var(--mut);margin-bottom:8px}.crumbs a{color:var(--mut)}
h1{font:400 30px/1.2 var(--font);margin:6px 0 10px}
h2{font:400 22px/1.25 var(--font);margin:32px 0 12px}
h3{font:500 16px/1.3 var(--font);margin:0 0 6px}
.lead{font-size:17px;color:var(--mut)}
a{color:var(--primary);text-underline-offset:2px}
.cta{display:inline-flex;align-items:center;height:52px;padding:0 26px;border-radius:26px;background:linear-gradient(135deg,#2d6bb8,#1f4f8f);color:#fff;font:500 16px var(--font);text-decoration:none;box-shadow:var(--e1)}
@media (prefers-color-scheme:dark){.cta{background:var(--primary);color:var(--on-primary)}}
.conn,.st,table{background:var(--card);border:var(--bd);border-radius:var(--r-l);box-shadow:var(--e1)}
.conn,.st{padding:16px 18px;margin:12px 0}
.conn{border-left:4px solid var(--trein)}
.conn.m-nacht{border-left-color:var(--nacht)}.conn.m-bus,.conn.m-nachtbus{border-left-color:var(--bus)}.conn.m-boot{border-left-color:var(--boot)}.conn.m-hst{border-left-color:var(--hst)}
.facts{margin:6px 0;padding-left:20px}
.times{margin:4px 0}.times small{color:var(--mut)}
.tag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--r-s);font:500 12px var(--font);margin-right:6px}
.tag.ok{background:var(--ok-bg);color:var(--ok-ink)}.tag.spec{background:var(--spec-bg);color:var(--spec-ink)}
.how{font-size:13px;color:var(--mut);margin:10px 0 0}
.note{color:var(--mut);font-size:13px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.two .st{margin:0}
@media(max-width:640px){.two{grid-template-columns:1fr}h1{font-size:25px}.logo{width:38px;height:38px}.wordmark b{font-size:19px}}
.st ul{margin:0;padding-left:20px}
table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden}
th,td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
th{font:500 13px var(--font);color:var(--mut)}
.more{columns:2 220px;padding-left:20px}
footer{max-width:860px;margin:0 auto;padding:20px 18px 40px;color:var(--mut);font-size:12.5px;line-height:1.6;border-top:1px solid var(--line)}
footer a{color:var(--mut)}
