/* =============================================================
   RomaPass.de — Rot & Gelb (Farben der offiziellen Roma-Pass-Karten)
   Primary: Karmesin #c8134a  |  Accent: Sonnengelb #f5b81c
   ============================================================= */

:root {
    --rp-c-primary:      #c8134a;
    --rp-c-primary-700:  #9d0e3a;
    --rp-c-primary-100:  #fce4ec;
    --rp-c-accent:       #f5b81c;
    --rp-c-accent-700:   #d29800;
    --rp-c-accent-100:   #fff3d1;
    --rp-c-bg:           #fbf9f4;
    --rp-c-bg-card:      #ffffff;
    --rp-c-bg-dark:      #1a1a1a;
    --rp-c-ink:          #1a1a1a;
    --rp-c-ink-muted:    #5a5a5a;
    --rp-c-ink-light:    #ffffff;
    --rp-c-ink-light-muted: #d8d5cc;
    --rp-c-border:       #ebe4d5;
    --rp-c-border-soft:  #f2ecdf;
    --rp-c-success:      #2d7a3a;
    --rp-c-danger:       #b33a3a;

    --rp-radius-sm: 6px;
    --rp-radius-md: 10px;
    --rp-radius-lg: 16px;
    --rp-radius-pill: 999px;

    --rp-shadow-card: 0 1px 2px rgba(26,26,26,0.06), 0 4px 12px rgba(26,26,26,0.04);
    --rp-shadow-card-hover: 0 4px 8px rgba(26,26,26,0.08), 0 12px 28px rgba(26,26,26,0.08);
    --rp-shadow-cta: 0 4px 14px rgba(200,19,74,0.32);

    --rp-s-1: 4px;
    --rp-s-2: 8px;
    --rp-s-3: 12px;
    --rp-s-4: 16px;
    --rp-s-5: 24px;
    --rp-s-6: 32px;
    --rp-s-7: 48px;
    --rp-s-8: 64px;

    --rp-stickybar-h: 68px;
    --rp-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --rp-font-display: Georgia, "Playfair Display", "Times New Roman", serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: var(--rp-font-sans);
    font-size: 16px;
    line-height: 1.6;
    color: var(--rp-c-ink);
    background: var(--rp-c-bg);
    padding-bottom: calc(var(--rp-stickybar-h) + env(safe-area-inset-bottom, 0px));
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--rp-c-primary); text-decoration: none; }
a:hover { color: var(--rp-c-primary-700); text-decoration: underline; }
h1, h2, h3, h4 { color: var(--rp-c-ink); line-height: 1.25; margin: 0 0 var(--rp-s-3); font-weight: 700; }
h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); font-family: var(--rp-font-display); }
h2 { font-size: clamp(1.4rem, 3vw, 2rem); font-family: var(--rp-font-display); }
h3 { font-size: 1.2rem; }
h4 { font-size: 1.05rem; }
p { margin: 0 0 var(--rp-s-4); }
ul, ol { margin: 0 0 var(--rp-s-4); padding-left: var(--rp-s-5); }
li { margin-bottom: var(--rp-s-2); }

.rp-skip {
    position: absolute; top: -40px; left: 0;
    background: var(--rp-c-primary); color: #fff;
    padding: 8px 12px; z-index: 100;
}
.rp-skip:focus { top: 0; }

.rp-container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 var(--rp-s-4);
}

/* ============ Buttons ============ */
.rp-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--rp-s-2);
    padding: 12px 20px;
    border-radius: var(--rp-radius-pill);
    font-weight: 600;
    font-size: 1rem;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.15s ease;
    line-height: 1.2;
    color: var(--rp-c-ink);
}
.rp-button:hover { text-decoration: none; }
.rp-button--primary {
    background: var(--rp-c-primary);
    color: var(--rp-c-ink-light);
    box-shadow: var(--rp-shadow-cta);
}
.rp-button--primary:hover {
    background: var(--rp-c-primary-700);
    color: var(--rp-c-ink-light);
}
.rp-button--secondary {
    background: transparent;
    color: var(--rp-c-primary);
    border-color: var(--rp-c-primary);
}
.rp-button--secondary:hover {
    background: var(--rp-c-primary);
    color: var(--rp-c-ink-light);
}
.rp-button--accent {
    background: var(--rp-c-accent);
    color: var(--rp-c-ink);
    box-shadow: 0 4px 14px rgba(245,184,28,0.35);
}
.rp-button--accent:hover {
    background: var(--rp-c-accent-700);
    color: var(--rp-c-ink);
}
.rp-button--lg { padding: 16px 28px; font-size: 1.05rem; }
.rp-button--sm { padding: 8px 14px; font-size: 0.9rem; }
.rp-button--block { display: flex; width: 100%; }

/* ============ Header ============ */
.rp-header {
    background: var(--rp-c-bg-card);
    border-bottom: 1px solid var(--rp-c-border-soft);
    position: sticky; top: 0; z-index: 90;
}
.rp-header__inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: var(--rp-s-3) var(--rp-s-4);
    display: flex; align-items: center; gap: var(--rp-s-5);
}
.rp-header__brand {
    display: flex; align-items: center; gap: var(--rp-s-2);
    text-decoration: none; color: var(--rp-c-ink);
}
.rp-header__brand:hover { color: var(--rp-c-primary); text-decoration: none; }
.rp-header__brand-text {
    font-family: var(--rp-font-display);
    font-weight: 800;
    font-size: 1.5rem;
    letter-spacing: 0.04em;
    color: var(--rp-c-primary);
    line-height: 1;
}
.rp-header__nav { display: flex; gap: var(--rp-s-4); margin-left: auto; }
.rp-header__nav-link {
    color: var(--rp-c-ink-muted);
    font-weight: 500;
    font-size: 0.95rem;
    padding: 6px 2px;
    border-bottom: 2px solid transparent;
    text-decoration: none;
}
.rp-header__nav-link:hover { color: var(--rp-c-primary); text-decoration: none; }
.rp-header__nav-link--active { color: var(--rp-c-primary); border-bottom-color: var(--rp-c-primary); }
.rp-header__cta { margin-left: var(--rp-s-2); }
.rp-header__mobile-toggle {
    display: none;
    margin-left: auto;
    background: none; border: none; padding: 8px;
    cursor: pointer;
    flex-direction: column; gap: 4px;
}
.rp-header__mobile-toggle span {
    display: block; width: 22px; height: 2px;
    background: var(--rp-c-ink); border-radius: 1px;
}
.rp-header__mobile-nav { background: var(--rp-c-bg-card); border-top: 1px solid var(--rp-c-border-soft); }
.rp-header__mobile-nav[hidden] { display: none; }
.rp-header__mobile-link {
    display: block;
    padding: 14px var(--rp-s-4);
    color: var(--rp-c-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--rp-c-border-soft);
    font-weight: 500;
}
.rp-header__mobile-link--cta { color: var(--rp-c-primary); font-weight: 700; }

@media (max-width: 899px) {
    .rp-header__nav, .rp-header__cta { display: none; }
    .rp-header__mobile-toggle { display: flex; }
}

/* ============ Hero ============ */
.rp-hero {
    position: relative;
    background: linear-gradient(135deg, #1a1a1a 0%, #340a1c 100%);
    color: var(--rp-c-ink-light);
    overflow: hidden;
}
.rp-hero__bg {
    position: absolute; inset: 0;
    background-image: url('/assets/img/hero-kolosseum.webp');
    background-size: cover;
    background-position: center 45%;
    opacity: 0.35;
    z-index: 0;
}
.rp-hero__bg::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(26,26,26,0.55) 0%, rgba(200,19,74,0.4) 100%);
}
.rp-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 1120px;
    margin: 0 auto;
    padding: var(--rp-s-8) var(--rp-s-4) var(--rp-s-7);
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: var(--rp-s-7);
    align-items: center;
}
.rp-hero__content { color: #fff; }
.rp-hero__cards {
    display: flex; gap: 12px;
    margin-bottom: var(--rp-s-4);
    flex-wrap: wrap;
}
.rp-hero__card {
    display: block;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0,0,0,0.35);
    max-width: 145px;
    transform: rotate(-2deg);
    transition: transform 0.25s;
}
.rp-hero__card:nth-child(2) { transform: rotate(2deg); margin-top: 12px; }
.rp-hero__card:hover { transform: rotate(0) scale(1.02); }
.rp-hero__card img { display: block; width: 100%; height: auto; }

.rp-hero__badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.25);
    padding: 6px 14px;
    border-radius: var(--rp-radius-pill);
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: var(--rp-s-3);
    color: #fff;
    backdrop-filter: blur(4px);
}
.rp-hero__title {
    color: #fff;
    font-size: clamp(2rem, 5vw, 3rem);
    margin: 0 0 var(--rp-s-4);
    font-family: var(--rp-font-display);
    line-height: 1.15;
    text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}
.rp-hero__sub {
    color: rgba(255,255,255,0.92);
    font-size: 1.1rem;
    margin-bottom: var(--rp-s-5);
    max-width: 32em;
}
.rp-hero__trust {
    display: flex; flex-wrap: wrap; gap: var(--rp-s-4);
    color: rgba(255,255,255,0.9); font-size: 0.9rem;
    margin-top: var(--rp-s-4);
}
.rp-hero__trust-item { display: flex; align-items: center; gap: 6px; }
.rp-hero__trust-item::before { content: '✓'; color: var(--rp-c-accent); font-weight: 700; }

@media (max-width: 899px) {
    .rp-hero__inner {
        grid-template-columns: 1fr;
        padding: var(--rp-s-6) var(--rp-s-4);
        gap: var(--rp-s-5);
    }
    .rp-hero__bg { background-image: url('/assets/img/hero-kolosseum-mobile.webp'); }
    .rp-hero__trust { display: none; }
    .rp-hero__card { max-width: 120px; }
}

/* ============ Inline Figure (dezentes Bild im Content-Fluss) ============ */
.rp-figure-inline {
    margin: 0 0 var(--rp-s-4);
    max-width: 340px;
}
.rp-figure-inline img {
    width: 100%;
    height: auto;
    border-radius: var(--rp-radius-md);
    box-shadow: 0 4px 14px rgba(0,0,0,0.12);
    display: block;
}
.rp-figure-inline figcaption {
    font-size: 0.78rem;
    color: var(--rp-c-ink-muted);
    margin-top: 6px;
    font-style: italic;
    line-height: 1.4;
}
.rp-figure-inline--right {
    float: right;
    margin-left: var(--rp-s-5);
    margin-bottom: var(--rp-s-3);
    max-width: 320px;
}
.rp-figure-inline--left {
    float: left;
    margin-right: var(--rp-s-5);
    margin-bottom: var(--rp-s-3);
    max-width: 320px;
}
@media (max-width: 620px) {
    .rp-figure-inline--right,
    .rp-figure-inline--left {
        float: none;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
    }
}

/* ============ Compare Grid (Roma Pass Vergleich) ============ */
.rp-compare-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--rp-s-5);
}
.rp-compare-card {
    background: var(--rp-c-bg-card);
    border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow-card);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
.rp-compare-card:hover { transform: translateY(-4px); box-shadow: var(--rp-shadow-card-hover); }
.rp-compare-card__logo {
    background: linear-gradient(135deg, #fbf9f4 0%, #fff3d1 100%);
    padding: var(--rp-s-5);
    display: flex; align-items: center; justify-content: center;
    min-height: 160px;
}
.rp-compare-card__logo img {
    max-width: 100%;
    max-height: 130px;
    height: auto;
    width: auto;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.rp-compare-card__body {
    padding: var(--rp-s-5);
    display: flex; flex-direction: column;
    flex: 1;
}
.rp-compare-card__title {
    margin: 0 0 4px;
    font-size: 1.35rem;
    font-family: var(--rp-font-display);
    color: var(--rp-c-ink);
}
.rp-compare-card__tag {
    margin: 0 0 var(--rp-s-3);
    font-size: 0.85rem;
    color: var(--rp-c-ink-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.rp-compare-card__price {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--rp-c-primary);
    margin: 0 0 var(--rp-s-4);
}
.rp-compare-card__points {
    padding-left: 1.1em;
    margin: 0 0 var(--rp-s-4);
    font-size: 0.95rem;
    color: var(--rp-c-ink);
}
.rp-compare-card__points li { margin-bottom: 6px; }
.rp-compare-card__for {
    background: var(--rp-c-bg);
    border-radius: var(--rp-radius-md);
    padding: 12px 14px;
    font-size: 0.9rem;
    color: var(--rp-c-ink);
    margin: 0 0 var(--rp-s-4);
    flex: 1;
}
.rp-compare-card__for strong { color: var(--rp-c-primary); }

@media (max-width: 899px) {
    .rp-compare-grid { grid-template-columns: 1fr; }
    .rp-compare-card__logo { min-height: 140px; }
}

/* ============ Roma-Pass-Karten Sektion ============ */
.rp-cards-showcase {
    background: linear-gradient(135deg, #fbf9f4 0%, #fff3d1 100%);
    padding: var(--rp-s-7) 0;
}
.rp-cards-showcase__inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 var(--rp-s-4);
    text-align: center;
}
.rp-cards-showcase__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--rp-s-5);
    max-width: 700px;
    margin: 0 auto var(--rp-s-5);
    align-items: end;
}
.rp-cards-showcase__variant {
    display: flex; flex-direction: column;
    align-items: center;
    gap: var(--rp-s-3);
}
.rp-cards-showcase__img {
    max-width: 100%; width: 100%;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.18);
}
.rp-cards-showcase__label {
    color: var(--rp-c-ink);
    font-weight: 700;
    font-size: 1.05rem;
}
.rp-cards-showcase__price {
    color: var(--rp-c-primary);
    font-weight: 700;
    font-size: 1.4rem;
}
@media (max-width: 599px) {
    .rp-cards-showcase__grid { gap: var(--rp-s-3); }
}

/* ============ Booking Widget ============ */
.rp-widget {
    background: var(--rp-c-bg-card);
    color: var(--rp-c-ink);
    border-radius: var(--rp-radius-lg);
    padding: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.25), 0 2px 6px rgba(0,0,0,0.15);
    border: 1px solid var(--rp-c-border-soft);
    max-width: 360px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.rp-widget--light { background: var(--rp-c-bg-card); }
.rp-widget__head {
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--rp-c-border-soft);
}
.rp-widget__title {
    margin: 0 0 4px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--rp-c-ink);
    font-family: var(--rp-font-display);
    line-height: 1.2;
}
.rp-widget__sub {
    margin: 0;
    font-size: 0.85rem;
    color: var(--rp-c-ink-muted);
    line-height: 1.4;
}

.rp-widget__field { margin-bottom: 12px; }
.rp-widget__label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rp-c-ink);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.rp-widget__label--with-hint { display: flex; align-items: center; gap: 6px; }

.rp-tooltip { position: relative; display: inline-flex; color: var(--rp-c-ink-muted); cursor: help; }
.rp-tooltip__bubble {
    position: absolute; bottom: 100%; left: 50%;
    transform: translate(-50%, -6px);
    background: var(--rp-c-ink);
    color: #fff;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 400;
    white-space: normal;
    width: max-content;
    max-width: 240px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s;
    z-index: 10;
}
.rp-tooltip:hover .rp-tooltip__bubble, .rp-tooltip:focus .rp-tooltip__bubble { opacity: 1; }

/* Datepicker */
.rp-datepick__row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
}
.rp-datepick__day {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 6px 2px;
    background: var(--rp-c-bg-card);
    border: 1.5px solid var(--rp-c-border);
    border-radius: var(--rp-radius-md);
    cursor: pointer;
    color: var(--rp-c-ink);
    transition: all 0.15s;
    min-height: 58px;
    line-height: 1.1;
}
.rp-datepick__day:hover { border-color: var(--rp-c-primary); color: var(--rp-c-primary); }
.rp-datepick__day--active {
    border-color: var(--rp-c-primary);
    background: var(--rp-c-primary);
    color: #fff;
}
.rp-datepick__day--active:hover { color: #fff; }
.rp-datepick__day-wd {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.75;
    font-weight: 600;
}
.rp-datepick__day-num { font-size: 1.15rem; font-weight: 700; margin: 1px 0; }
.rp-datepick__day-mon { font-size: 0.65rem; opacity: 0.7; }
.rp-datepick__day--more {
    background: var(--rp-c-bg);
    color: var(--rp-c-ink-muted);
}
.rp-datepick__day--more:hover { color: var(--rp-c-primary); }
.rp-datepick__more-icon { display: block; margin-bottom: 4px; }
.rp-datepick__more-label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}

/* Duration */
.rp-widget__duration { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rp-widget__duration-chip {
    padding: 10px 12px;
    border-radius: var(--rp-radius-md);
    border: 2px solid var(--rp-c-border);
    background: var(--rp-c-bg-card);
    color: var(--rp-c-ink);
    cursor: pointer;
    text-align: left;
    display: flex; flex-direction: column; gap: 2px;
    transition: all 0.15s;
}
.rp-widget__duration-chip:hover { border-color: var(--rp-c-primary); }
.rp-widget__duration-chip--active {
    border-color: var(--rp-c-primary);
    background: var(--rp-c-primary-100);
}
.rp-widget__duration-name { font-weight: 600; font-size: 0.95rem; }
.rp-widget__duration-price { font-size: 0.85rem; color: var(--rp-c-ink-muted); }
.rp-widget__duration-chip--active .rp-widget__duration-price { color: var(--rp-c-primary-700); font-weight: 600; }

.rp-widget__people {
    background: var(--rp-c-bg);
    border-radius: var(--rp-radius-md);
    padding: 8px 12px;
}
.rp-widget__people-row {
    display: flex; justify-content: space-between; align-items: center;
    gap: 12px;
}
.rp-widget__people-title { font-weight: 500; color: var(--rp-c-ink); display: block; font-size: 0.95rem; }
.rp-widget__people-age { font-size: 0.8rem; color: var(--rp-c-ink-muted); display: block; }
.rp-widget__people-stepper { display: flex; align-items: center; gap: 6px; }
.rp-widget__people-btn {
    width: 30px; height: 30px;
    border-radius: 50%;
    border: 1px solid var(--rp-c-border);
    background: var(--rp-c-bg-card);
    color: var(--rp-c-ink);
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
}
.rp-widget__people-btn:hover { border-color: var(--rp-c-primary); color: var(--rp-c-primary); }
.rp-widget__people-count { font-weight: 600; font-size: 1rem; min-width: 18px; text-align: center; color: var(--rp-c-ink); }

.rp-widget__price {
    padding-top: 12px;
    border-top: 1px solid var(--rp-c-border-soft);
    margin-top: 12px;
}
.rp-widget__price-row {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 10px;
}
.rp-widget__price-label { color: var(--rp-c-ink-muted); font-size: 0.9rem; }
.rp-widget__price-amount { font-size: 1.4rem; font-weight: 700; color: var(--rp-c-ink); }
.rp-widget__cta { width: 100%; padding: 11px 20px; }
.rp-widget__disclosure {
    margin-top: 10px;
    font-size: 0.72rem;
    color: var(--rp-c-ink-muted);
    text-align: center;
    line-height: 1.35;
}

/* Calendar Modal */
.rp-cal-modal {
    position: fixed; inset: 0;
    background: rgba(26,26,26,0.6);
    z-index: 100;
    display: flex; align-items: center; justify-content: center;
    padding: var(--rp-s-4);
}
.rp-cal-modal[hidden] { display: none; }
.rp-cal-modal__card {
    background: #fff;
    border-radius: var(--rp-radius-lg);
    padding: var(--rp-s-5);
    max-width: 400px;
    width: 100%;
}
.rp-cal-modal__head {
    display: flex; align-items: center; gap: var(--rp-s-3);
    margin-bottom: var(--rp-s-4);
}
.rp-cal-modal__title { flex: 1; text-align: center; font-weight: 600; }
.rp-cal-modal__nav, .rp-cal-modal__close {
    background: transparent; border: 1px solid var(--rp-c-border);
    border-radius: 50%; width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; color: var(--rp-c-ink);
}
.rp-cal-modal__nav:hover, .rp-cal-modal__close:hover { border-color: var(--rp-c-primary); color: var(--rp-c-primary); }
.rp-cal-modal__nav:disabled { opacity: 0.3; cursor: not-allowed; }
.rp-cal-modal__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.rp-cal-modal__wd { text-align: center; font-size: 0.75rem; color: var(--rp-c-ink-muted); font-weight: 600; padding: 4px 0; }
.rp-cal-modal__cell {
    aspect-ratio: 1;
    background: transparent; border: none;
    border-radius: 6px;
    color: var(--rp-c-ink);
    cursor: pointer;
    font-size: 0.9rem;
}
.rp-cal-modal__cell:hover:not(:disabled) { background: var(--rp-c-primary-100); color: var(--rp-c-primary-700); }
.rp-cal-modal__cell--empty { cursor: default; }
.rp-cal-modal__cell--disabled { color: var(--rp-c-ink-muted); opacity: 0.3; cursor: not-allowed; }
.rp-cal-modal__cell--selected {
    background: var(--rp-c-primary);
    color: #fff;
    font-weight: 700;
}

/* ============ Sticky Bar ============ */
.rp-stickybar {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: var(--rp-c-bg-card);
    border-top: 1px solid var(--rp-c-border);
    box-shadow: 0 -4px 12px rgba(0,0,0,0.08);
    z-index: 80;
    padding: var(--rp-s-2) 0;
    padding-bottom: calc(var(--rp-s-2) + env(safe-area-inset-bottom, 0px));
}
.rp-stickybar__inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 var(--rp-s-4);
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--rp-s-3);
}
.rp-stickybar__info { display: flex; flex-direction: column; line-height: 1.2; }
.rp-stickybar__label { font-size: 0.8rem; color: var(--rp-c-ink-muted); }
.rp-stickybar__price { font-size: 1.15rem; font-weight: 700; color: var(--rp-c-ink); }
.rp-stickybar__cta { white-space: nowrap; }

/* ============ Sections ============ */
.rp-section { padding: var(--rp-s-8) 0; }
.rp-section--tight { padding: var(--rp-s-6) 0; }
.rp-section--alt { background: var(--rp-c-bg-card); }
.rp-section--dark {
    background: var(--rp-c-bg-dark);
    color: var(--rp-c-ink-light);
}
.rp-section--dark h1, .rp-section--dark h2, .rp-section--dark h3 { color: #fff; }
.rp-section--gold {
    background: var(--rp-c-accent);
    color: var(--rp-c-ink);
}
.rp-section__head { text-align: center; margin-bottom: var(--rp-s-6); }
.rp-section__head h2 { margin-bottom: var(--rp-s-2); }
.rp-section__intro { color: var(--rp-c-ink-muted); font-size: 1.05rem; max-width: 40em; margin: 0 auto; }
.rp-section--dark .rp-section__intro { color: rgba(255,255,255,0.85); }

/* ============ Trust Bar ============ */
.rp-trustbar {
    background: var(--rp-c-bg-card);
    padding: var(--rp-s-5) 0;
    border-bottom: 1px solid var(--rp-c-border-soft);
}
.rp-trustbar__inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 var(--rp-s-4);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--rp-s-4);
}
.rp-trustbar__item {
    display: flex; align-items: center; gap: var(--rp-s-3);
}
.rp-trustbar__icon {
    width: 36px; height: 36px; flex: none;
    background: var(--rp-c-accent-100);
    color: var(--rp-c-accent-700);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
}
.rp-trustbar__title { font-weight: 600; font-size: 0.95rem; line-height: 1.2; }
.rp-trustbar__sub { font-size: 0.8rem; color: var(--rp-c-ink-muted); }

@media (max-width: 699px) {
    .rp-trustbar__inner { grid-template-columns: 1fr 1fr; }
}

/* ============ Cards / Attraction grid ============ */
.rp-cards {
    display: grid;
    gap: var(--rp-s-5);
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.rp-card {
    background: var(--rp-c-bg-card);
    border-radius: var(--rp-radius-md);
    overflow: hidden;
    box-shadow: var(--rp-shadow-card);
    display: flex; flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
    position: relative;
}
.rp-card:hover { transform: translateY(-3px); box-shadow: var(--rp-shadow-card-hover); }
.rp-card__img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.rp-card__body { padding: var(--rp-s-4); flex: 1; display: flex; flex-direction: column; }
.rp-card__title { margin: 0 0 var(--rp-s-2); font-size: 1.1rem; }
.rp-card__text { color: var(--rp-c-ink-muted); font-size: 0.95rem; margin: 0 0 var(--rp-s-3); flex: 1; }
.rp-card__meta { display: flex; gap: var(--rp-s-3); font-size: 0.85rem; color: var(--rp-c-ink-muted); }

/* Alte Inline-Badge im Card-Body (Legacy, für Fälle wo kein Overlay passt) */
.rp-card__badge {
    display: inline-block;
    background: var(--rp-c-accent-100);
    color: var(--rp-c-accent-700);
    padding: 2px 10px;
    border-radius: var(--rp-radius-pill);
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: var(--rp-s-2);
    align-self: flex-start;
}

/* Reservierungs-Badges als Overlay über dem Bild */
.rp-card__badge--overlay {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 6px 12px 6px 10px;
    border-radius: var(--rp-radius-pill);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    box-shadow: 0 4px 12px rgba(0,0,0,0.28);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 0;
    text-shadow: none;
}
.rp-card__badge--overlay svg { display: block; flex: none; }
.rp-card__badge--pflicht {
    background: var(--rp-c-primary);
    color: #fff;
}
.rp-card__badge--empfohlen {
    background: var(--rp-c-accent);
    color: #1a1a1a;
}
.rp-card__badge--frei {
    background: var(--rp-c-success);
    color: #fff;
}

/* ============ Prose / Content ============ */
.rp-prose { max-width: 720px; margin: 0 auto; }
.rp-prose > * + h2 { margin-top: var(--rp-s-7); }
.rp-prose > * + h3 { margin-top: var(--rp-s-5); }
.rp-prose ul { padding-left: 1.2em; }
.rp-prose li { margin-bottom: 6px; }
.rp-prose blockquote {
    margin: var(--rp-s-5) 0;
    padding: var(--rp-s-4) var(--rp-s-5);
    background: var(--rp-c-bg-card);
    border-left: 4px solid var(--rp-c-primary);
    border-radius: 0 var(--rp-radius-md) var(--rp-radius-md) 0;
    color: var(--rp-c-ink);
}
.rp-prose blockquote p:last-child { margin-bottom: 0; }
.rp-prose .rp-callout {
    background: var(--rp-c-accent-100);
    border-left: 4px solid var(--rp-c-accent);
    border-radius: var(--rp-radius-md);
    padding: var(--rp-s-4) var(--rp-s-5);
    margin: var(--rp-s-5) 0;
    color: var(--rp-c-ink);
    clear: both;
}
/* Headings sollen nicht neben floatendem Bild starten */
.rp-prose h2, .rp-prose h3 { clear: both; }
.rp-prose .rp-callout--warn {
    background: #fef1d7;
    border-left: 4px solid var(--rp-c-accent-700);
}
.rp-prose .rp-callout--info {
    background: var(--rp-c-primary-100);
    border-left: 4px solid var(--rp-c-primary);
}

/* Tables */
.rp-table {
    width: 100%; border-collapse: collapse;
    background: var(--rp-c-bg-card);
    border-radius: var(--rp-radius-md);
    overflow: hidden;
    box-shadow: var(--rp-shadow-card);
    font-size: 0.95rem;
    margin: var(--rp-s-5) 0;
}
.rp-table th, .rp-table td {
    padding: 12px var(--rp-s-3);
    border-bottom: 1px solid var(--rp-c-border-soft);
    text-align: left;
}
.rp-table th {
    background: var(--rp-c-bg);
    font-weight: 600;
    color: var(--rp-c-ink);
}
.rp-table tr:last-child td { border-bottom: none; }
.rp-table__total td { background: var(--rp-c-primary-100); font-weight: 700; color: var(--rp-c-primary-700); }
.rp-table td.rp-table__save { color: var(--rp-c-success); font-weight: 600; }
.rp-table__wrap { overflow-x: auto; margin: var(--rp-s-5) 0; }

/* Discount list */
.rp-disc {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--rp-s-2);
}
.rp-disc__item {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px var(--rp-s-4);
    background: var(--rp-c-bg-card);
    border-radius: var(--rp-radius-sm);
    border: 1px solid var(--rp-c-border-soft);
}
.rp-disc__name { font-weight: 500; }
.rp-disc__val {
    background: var(--rp-c-primary);
    color: #fff;
    padding: 4px 10px;
    border-radius: var(--rp-radius-pill);
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}
.rp-disc__val--soft { background: var(--rp-c-accent); color: var(--rp-c-ink); }

/* ============ FAQ ============ */
.rp-faq { max-width: 800px; margin: 0 auto; }
.rp-faq__item {
    background: var(--rp-c-bg-card);
    border-radius: var(--rp-radius-md);
    margin-bottom: var(--rp-s-3);
    box-shadow: var(--rp-shadow-card);
    overflow: hidden;
}
.rp-faq__q {
    width: 100%;
    text-align: left;
    background: transparent;
    border: none;
    padding: var(--rp-s-4) var(--rp-s-5);
    font-weight: 600;
    font-size: 1.05rem;
    cursor: pointer;
    color: var(--rp-c-ink);
    display: flex; justify-content: space-between; align-items: center;
    gap: var(--rp-s-3);
    font-family: var(--rp-font-sans);
}
.rp-faq__q::after {
    content: '＋';
    color: var(--rp-c-primary);
    font-size: 1.2rem;
    transition: transform 0.2s;
    flex: none;
}
.rp-faq__item--open .rp-faq__q::after { content: '−'; }
.rp-faq__a {
    padding: 0 var(--rp-s-5) var(--rp-s-4);
    color: var(--rp-c-ink);
    line-height: 1.65;
    display: none;
}
.rp-faq__item--open .rp-faq__a { display: block; }
.rp-faq__a p:last-child { margin-bottom: 0; }

/* ============ Omnia CTA Box ============ */
.rp-omnia-cta {
    background: linear-gradient(135deg, #fff 0%, #fff8e5 100%);
    border: 2px solid var(--rp-c-accent);
    border-radius: var(--rp-radius-lg);
    padding: var(--rp-s-6) var(--rp-s-5);
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: var(--rp-s-5);
    align-items: center;
    margin: var(--rp-s-6) 0;
    box-shadow: var(--rp-shadow-card);
}
.rp-omnia-cta__img { border-radius: var(--rp-radius-md); }
.rp-omnia-cta__title { margin: 0 0 var(--rp-s-2); font-size: 1.4rem; }
.rp-omnia-cta__text { margin: 0 0 var(--rp-s-4); color: var(--rp-c-ink-muted); }
@media (max-width: 699px) {
    .rp-omnia-cta { grid-template-columns: 1fr; text-align: center; }
    .rp-omnia-cta__img { max-width: 280px; margin: 0 auto; }
}

/* ============ Footer ============ */
.rp-footer {
    background: #1a1a1a;
    color: rgba(255,255,255,0.85);
    padding: var(--rp-s-7) 0 var(--rp-s-5);
    margin-top: var(--rp-s-8);
}
.rp-footer__inner { max-width: 1120px; margin: 0 auto; padding: 0 var(--rp-s-4); }
.rp-footer__cols {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: var(--rp-s-6);
    margin-bottom: var(--rp-s-6);
}
.rp-footer__brand { display: flex; align-items: center; gap: var(--rp-s-2); margin-bottom: var(--rp-s-3); }
.rp-footer__brand-name {
    font-family: var(--rp-font-display);
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #fff;
}
.rp-footer__about { color: rgba(255,255,255,0.7); font-size: 0.9rem; line-height: 1.6; }
.rp-footer__col-title { color: #fff; font-size: 0.95rem; margin: 0 0 var(--rp-s-3); }
.rp-footer__list { list-style: none; padding: 0; margin: 0; }
.rp-footer__list li { margin-bottom: 8px; }
.rp-footer__link {
    color: rgba(255,255,255,0.7); text-decoration: none;
    font-size: 0.9rem;
}
.rp-footer__link:hover { color: var(--rp-c-accent); text-decoration: underline; }
.rp-footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: var(--rp-s-4);
    display: flex; justify-content: space-between; align-items: baseline;
    gap: var(--rp-s-4);
    flex-wrap: wrap;
}
.rp-footer__copyright, .rp-footer__disclaimer {
    color: rgba(255,255,255,0.6);
    font-size: 0.8rem;
    margin: 0;
}
.rp-footer__disclaimer { max-width: 55%; }

@media (max-width: 899px) {
    .rp-footer__cols { grid-template-columns: 1fr 1fr; }
    .rp-footer__disclaimer { max-width: 100%; }
}
@media (max-width: 500px) {
    .rp-footer__cols { grid-template-columns: 1fr; }
}

/* ============ Utilities ============ */
.rp-mt-0 { margin-top: 0; }
.rp-mt-2 { margin-top: var(--rp-s-2); }
.rp-mt-4 { margin-top: var(--rp-s-4); }
.rp-mt-5 { margin-top: var(--rp-s-5); }
.rp-mb-0 { margin-bottom: 0; }
.rp-mb-3 { margin-bottom: var(--rp-s-3); }
.rp-mb-5 { margin-bottom: var(--rp-s-5); }
.rp-text-center { text-align: center; }
.rp-highlight { color: var(--rp-c-primary); font-weight: 600; }
.rp-savings { color: var(--rp-c-success); font-weight: 600; }
