/* =====================================================================
   retreva · Basis: Reset, Typografie, Inhalts-HTML (CST/Gutenberg), Layout-Helfer
   ===================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
@media (max-width: 1023px) { html { scroll-padding-top: calc(var(--header-h-mobile) + 16px); } }
body { margin: 0; background: var(--c-bg); color: var(--c-text); font-family: var(--ff-body); font-size: var(--fs-body); line-height: 1.6; -webkit-font-smoothing: antialiased; text-wrap:pretty; }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-offset); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- Typografie ---------- */
h1, h2, h3, h4 { font-family: var(--ff-head); font-weight: 600; color: var(--c-ink); margin: 0; text-wrap: balance; }
h1 { font-size: var(--fs-h1); line-height: 1.05; letter-spacing: -0.03em; }
h1 > small, .rt-h1-small { display: block; margin-top: 10px; font-family: var(--ff-body); font-size: var(--fs-h1-small); font-weight: 500; line-height: 1.4; letter-spacing: 0; color: var(--c-muted); }
h2 { font-size: var(--fs-h2); line-height: 1.15; letter-spacing: -0.02em; }
h2 > small { display: block; margin-top: 6px; font-family: var(--ff-body); font-size: 16px; font-weight: 400; line-height: 1.5; letter-spacing: 0; color: var(--c-muted); }
h3 { font-size: var(--fs-h3); line-height: 1.3; }
h4 { font-size: var(--fs-h4); line-height: 1.35; }
p { margin: 0; }
a { color: var(--c-link); text-underline-offset: 3px; }
a:hover { color: var(--c-ink); }
strong, b { font-weight: 700; color: var(--c-ink); }
/* Auf dunklen Flächen erbt Fettschrift die Flächenfarbe (Navy-Kacheln, Toasts, Footer). */
[data-on-dark] b, [data-on-dark] strong, .rt-linkcard--navy b, .rt-booking__link b, .rt-toast b, .rt-toast strong, .rt-footer b, .rt-footer strong { color: inherit; }
small { font-size: var(--fs-small); }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; }
hr { border: 0; border-top: 1px solid var(--c-line); margin: var(--sp-7) 0; }
::selection { background: var(--c-navy-tint); }

.rt-display { font-family: var(--ff-head); font-size: var(--fs-display); font-weight: 600; line-height: 1.03; letter-spacing: -0.03em; }
.rt-h2-lg { font-size: var(--fs-h2-lg); line-height: 1.1; letter-spacing: -0.025em; }
.rt-eyebrow { font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--c-link); line-height: 1.3; }
.rt-lead { font-size: var(--fs-lead); line-height: 1.75; color: var(--c-text-2); }
.rt-lead--strong { font-weight: 600; color: var(--c-ink); }
.rt-small { font-size: var(--fs-small); line-height: 1.5; color: var(--c-muted); }
.rt-caption { font-size: var(--fs-caption); font-weight: 500; line-height: 1.45; color: var(--c-muted); }
.rt-muted { color: var(--c-muted); }

/* ---------- Inhalts-HTML aus CST / Editor (Teaser, Beschreibung, Ratgeber) ----------
   Erlaubt laut spec/backend.md: <p>, eine Zwischenüberschrift (→ <h3>), <strong>, <ul>/<li>. CST liefert teils <br> und <ul class="cst-list">. */
.rt-prose { font-size: var(--fs-lead); line-height: 1.75; color: var(--c-text-2); max-width: 72ch; }
.rt-prose > * + * { margin-top: 1em; }
.rt-prose h2, .rt-prose h3 { font-size: var(--fs-h3); line-height: 1.3; margin-top: 1.6em; }
.rt-prose h2 + *, .rt-prose h3 + * { margin-top: .5em; }
.rt-prose ul, .cst-list, .rt-list { list-style: none; padding: 0; margin-left: 0; }
.rt-prose ul > li, .cst-list > li, .rt-list > li { position: relative; padding-left: 30px; }
.rt-prose ul > li + li, .cst-list > li + li, .rt-list > li + li { margin-top: 6px; }
.rt-prose ul > li::before, .cst-list > li::before, .rt-list > li::before {
  content: ""; position: absolute; left: 0; top: .62em; width: 18px; height: 12px;
  background: var(--c-list-marker); -webkit-mask: var(--list-marker) no-repeat center / contain; mask: var(--list-marker) no-repeat center / contain;
}
.rt-prose ul ul > li::before, .rt-list .rt-list > li::before { width: 6px; height: 6px; top: .72em; left: 6px; border-radius: 3px; -webkit-mask: none; mask: none; }
.rt-prose ol { padding-left: 1.4em; }
.is-dark .rt-list > li::before, .is-dark .cst-list > li::before { background: var(--c-list-marker-on-dark); }
.rt-prose--small { font-size: var(--fs-body); line-height: 1.65; }

/* ---------- Layout ---------- */
.rt-container { width: 100%; max-width: calc(var(--container) + 2 * var(--page-pad)); margin: 0 auto; padding-left: var(--page-pad); padding-right: var(--page-pad); }
.rt-section { padding-top: var(--section-gap); }
.rt-section--tinted { background: var(--c-surface); padding-bottom: var(--section-gap); margin-top: var(--section-gap); }
.rt-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-6); margin-bottom: var(--sp-6); flex-wrap: wrap; }
.rt-section-head > div { display: flex; flex-direction: column; gap: 8px; max-width: 760px; }
.rt-section-head p { color: var(--c-muted); }
.rt-stack { display: flex; flex-direction: column; gap: var(--sp-4); }
.rt-row { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.rt-grid { display: grid; gap: var(--gutter); }
.rt-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rt-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rt-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { .rt-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .rt-grid--3, .rt-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px)  { .rt-grid--2, .rt-grid--3, .rt-grid--4 { grid-template-columns: minmax(0, 1fr); } }
/* Lückenlos-Regel (Design 1.0): erste Karte spannt 2 Spalten bei n%3==2, 3 Spalten bei n%3==1 – per JS-Klasse gesetzt (RT.gapless) */
.rt-grid--3 > .is-span-2 { grid-column: span 2; }
.rt-grid--3 > .is-span-3 { grid-column: 1 / -1; }
@media (max-width: 1023px) { .rt-grid--3 > .is-span-2, .rt-grid--3 > .is-span-3 { grid-column: auto; } .rt-grid--3 > .is-span-2-md { grid-column: 1 / -1; } }
@media (max-width: 767px) { .rt-grid--3 > .is-span-2-md { grid-column: auto; } }

.rt-sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.rt-skip { position: absolute; left: 16px; top: -60px; z-index: 200; background: var(--c-navy); color: #fff; padding: 12px 18px; border-radius: var(--r-md); font-weight: 700; text-decoration: none; }
.rt-skip:focus { top: 12px; color: #fff; }
.rt-main { display: block; min-height: 50vh; }
/* Used both as an empty end spacer and on actual page-content wrappers. */
.rt-page-end { padding-bottom:var(--section-gap); }
.rt-page-end:empty { height:var(--section-gap); padding:0; }

/* Sichtbarkeit nach Breakpoint (md-Grenze 1024 = Burger/Mobilsuche) */
@media (max-width: 1023px) { .rt-hide-mobile { display: none !important; } }
@media (min-width: 1024px) { .rt-only-mobile { display: none !important; } }
.rt-caption > svg, .rt-small > svg { display: inline-block; vertical-align: -2px; margin-right: 2px; }

/* Tabellen im Fließtext: horizontal scrollbar statt Seitenüberlauf */
.rt-table-wrap { overflow-x: auto; margin: 1.2em 0; }
.rt-table-wrap table { min-width: 520px; }

/* Komponenten im Fließtext (Shortcodes/Blöcke) behalten ihr eigenes Aussehen */
.rt-prose .rt-linkcard, .rt-prose .rt-mini-post, .rt-prose .rt-btn { text-decoration: none; }
.rt-prose .rt-linkcard--navy { color: #fff; }
.rt-prose .rt-mini-post b { line-height: 1.3; }