/* RavennaTickets.com — style.css
 * All classes prefixed rt-*. Colors from the Byzantine Gold + Deep Blue scheme.
 */

/* -------------------- Design tokens -------------------- */
:root {
    --c-primary: #B8860B;         /* Byzantine Gold */
    --c-primary-dk: #8f6a08;
    --c-accent: #D4AF37;          /* Lighter Gold */
    --c-ink: #1A2B4A;             /* Deep Byzantine Blue */
    --c-ink-2: #4a5a75;
    --c-ink-3: #8b96aa;
    --c-cta: #B8860B;
    --c-cta-dk: #8f6a08;
    --c-cream: #FBF8F1;           /* Warm cream background */
    --c-cream-2: #F5EFE0;         /* Slightly darker cream */
    --c-bg: #ffffff;
    --c-text: #2A2A2A;
    --c-line: #e6dcc0;
    --c-line-2: #cfc19a;
    --c-star: #D4AF37;

    --f-sans: "Inter", -apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;
    --f-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    --fw-med: 500;
    --fw-semi: 600;
    --fw-bold: 700;

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

    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;
    --sh-1: 0 2px 6px rgba(26, 43, 74, 0.06);
    --sh-2: 0 8px 24px rgba(26, 43, 74, 0.10);
    --sh-3: 0 16px 48px rgba(26, 43, 74, 0.14);

    --w-max: 1120px;
    --stickybar-h: 64px;
}

/* -------------------- Base -------------------- */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: var(--f-sans);
    color: var(--c-text);
    background: var(--c-bg);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    padding-bottom: calc(var(--stickybar-h) + env(safe-area-inset-bottom, 0px));
}
img { max-width: 100%; display: block; }
a { color: var(--c-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 {
    color: var(--c-ink);
    line-height: 1.2;
    margin: 0 0 var(--s-2);
    font-weight: var(--fw-bold);
    letter-spacing: -0.005em;
}
h1, h2, h3 { font-family: var(--f-display); font-weight: 700; letter-spacing: -0.01em; }
h1 { font-size: clamp(32px, 5vw, 52px); line-height: 1.05; }
h2 { font-size: clamp(26px, 3.5vw, 38px); }
h3 { font-size: clamp(20px, 2.4vw, 26px); }

p { margin: 0 0 var(--s-2); color: var(--c-text); }

.rt-body { min-height: 100vh; }
.rt-main { display: block; }
.rt-skip { position: absolute; left: -9999px; top: 0; }
.rt-skip:focus { left: var(--s-2); top: var(--s-2); background: var(--c-bg); padding: 8px 12px; z-index: 100; border: 2px solid var(--c-primary); }

/* -------------------- Buttons -------------------- */
.rt-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 14px 22px;
    border-radius: var(--r-md);
    font-weight: var(--fw-bold);
    font-size: 16px;
    text-decoration: none;
    border: none; cursor: pointer;
    transition: transform 0.1s, background 0.15s, box-shadow 0.15s;
    line-height: 1.1;
    white-space: nowrap;
    font-family: var(--f-sans);
}
.rt-btn:hover { text-decoration: none; }
.rt-btn-cta {
    background: var(--c-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(184, 134, 11, 0.35);
}
.rt-btn-cta:hover { background: var(--c-primary-dk); color: #fff; box-shadow: 0 4px 12px rgba(184, 134, 11, 0.45); }
.rt-btn-cta:active { transform: translateY(1px); }
.rt-btn-secondary {
    background: #fff;
    color: var(--c-ink);
    border: 2px solid var(--c-ink);
}
.rt-btn-secondary:hover { background: var(--c-ink); color: #fff; }
.rt-btn-outline-gold {
    background: transparent;
    color: var(--c-primary);
    border: 2px solid var(--c-primary);
}
.rt-btn-outline-gold:hover { background: var(--c-primary); color: #fff; }
.rt-btn-block { width: 100%; }
.rt-btn-lg { padding: 16px 28px; font-size: 17px; }

/* -------------------- Layout -------------------- */
.rt-section { padding: var(--s-6) var(--s-3); }
.rt-section-inner { max-width: var(--w-max); margin: 0 auto; }
.rt-section-alt { background: var(--c-cream); }
.rt-section-dark { background: var(--c-ink); color: #fff; }
.rt-section-dark h1, .rt-section-dark h2, .rt-section-dark h3 { color: #fff; }
.rt-section-dark p { color: #d9dde5; }

.rt-sect-title { text-align: center; margin-bottom: var(--s-5); max-width: 760px; margin-left: auto; margin-right: auto; }
.rt-sect-title h2 { margin-bottom: var(--s-1); }
.rt-sect-title p { color: var(--c-ink-2); font-size: 17px; }

/* -------------------- Trust bar -------------------- */
.rt-trustbar {
    background: var(--c-ink);
    color: #f0e6c6;
    font-size: 13px;
    padding: var(--s-1) var(--s-3);
}
.rt-trustbar-inner {
    max-width: var(--w-max); margin: 0 auto;
    display: flex; flex-wrap: wrap; gap: var(--s-3);
    justify-content: center; align-items: center;
}
.rt-trust { display: inline-flex; gap: 6px; align-items: center; color: #f0e6c6; }
.rt-trust-i { color: var(--c-accent); font-weight: bold; }

/* -------------------- Header -------------------- */
.rt-header {
    background: #fff; border-bottom: 1px solid var(--c-line);
    position: sticky; top: 0; z-index: 40;
}
.rt-header-inner {
    max-width: var(--w-max); margin: 0 auto;
    display: flex; align-items: center; justify-content: space-between;
    padding: var(--s-2) var(--s-3);
    gap: var(--s-2);
}
.rt-logo {
    display: inline-flex; align-items: center; gap: 12px;
    color: var(--c-ink); text-decoration: none;
    transition: opacity 0.15s;
}
.rt-logo:hover { text-decoration: none; opacity: 0.85; }
.rt-logo-mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 50%;
    background: transparent;
    line-height: 1;
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35), 0 2px 6px rgba(26, 43, 74, 0.15);
    overflow: hidden;
    flex-shrink: 0;
}
.rt-logo-mark svg { width: 100%; height: 100%; display: block; }
.rt-logo-mark--sm { width: 32px; height: 32px; }
.rt-logo-text {
    display: inline-flex; align-items: baseline; gap: 3px;
    font-family: var(--f-display);
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1;
    white-space: nowrap;
    flex-wrap: nowrap;
}
.rt-logo { flex-shrink: 0; min-width: 0; }
.rt-logo-text-city { display: inline-flex; align-items: baseline; white-space: nowrap; }
.rt-logo-text-city {
    color: var(--c-ink);
    font-style: italic;
}
.rt-logo-dot {
    color: var(--c-accent);
    font-style: normal;
    font-weight: 700;
    margin: 0 4px;
    display: inline-block;
    transform: translateY(-3px);
    font-size: 22px;
}
.rt-logo-text-tickets {
    color: var(--c-primary);
    font-style: normal;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0.005em;
}

.rt-nav { display: flex; gap: var(--s-3); align-items: center; }
.rt-nav a {
    color: var(--c-ink); font-weight: var(--fw-semi); font-size: 15px;
    text-decoration: none; padding: 8px 4px; position: relative;
}
.rt-nav a:hover { color: var(--c-primary); text-decoration: none; }
.rt-nav a[aria-current="page"] { color: var(--c-primary); }
.rt-nav a[aria-current="page"]::after {
    content: ""; position: absolute; bottom: 0; left: 0; right: 0;
    height: 2px; background: var(--c-primary);
}

.rt-langswitch { display: flex; align-items: center; }
.rt-langs-list {
    display: flex; gap: var(--s-1); align-items: center;
    list-style: none; padding: 0; margin: 0;
    font-size: 12px; font-weight: var(--fw-semi);
}
.rt-langs-list a { color: var(--c-ink-2); padding: 4px 6px; letter-spacing: 0.03em; }
.rt-langs-list a:hover { color: var(--c-primary); text-decoration: none; }
.rt-langs-list a[aria-current="true"] { color: var(--c-primary); background: var(--c-cream); border-radius: 4px; }
.rt-langs-select {
    display: none;
    padding: 6px 8px; border-radius: 6px; border: 1px solid var(--c-line-2);
    font-size: 14px; background: #fff; color: var(--c-ink); font-weight: 500;
}

.rt-menu-toggle {
    display: none; cursor: pointer;
    width: 44px; height: 44px; position: relative; padding: 0;
    background: var(--c-cream);
    border: 1.5px solid var(--c-line-2);
    border-radius: 8px;
    flex-shrink: 0;
}
.rt-menu-toggle:hover { background: var(--c-cream-2); border-color: var(--c-primary); }
.rt-menu-toggle span {
    display: block; height: 2.5px; background: var(--c-ink);
    margin: 5px auto; width: 22px; border-radius: 2px;
    transition: transform 0.2s, opacity 0.2s;
}
.rt-menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.rt-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.rt-menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

.rt-mobile-nav {
    display: none; flex-direction: column;
    background: #fff; border-top: 1px solid var(--c-line);
    padding: var(--s-2) var(--s-3);
}
.rt-mobile-nav a {
    padding: 14px 0; border-bottom: 1px solid var(--c-line);
    color: var(--c-ink); font-weight: var(--fw-semi);
    text-decoration: none; font-size: 16px;
}
.rt-mobile-nav > a:nth-last-of-type(1) { border-bottom: none; }

.rt-mobile-langs {
    padding: var(--s-2) 0 0;
    margin-top: var(--s-1);
    border-top: 1px solid var(--c-line);
}
.rt-mobile-langs-label {
    display: block; color: var(--c-ink-2); font-size: 12px;
    font-weight: var(--fw-semi); text-transform: uppercase;
    letter-spacing: 0.05em; margin-bottom: var(--s-1);
}
.rt-mobile-langs-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
}
.rt-mobile-lang {
    padding: 10px 12px; border-radius: 6px;
    background: var(--c-cream); color: var(--c-ink);
    font-weight: var(--fw-semi); font-size: 14px;
    text-align: center; text-decoration: none;
    border: 1px solid transparent;
}
.rt-mobile-lang:hover { background: var(--c-cream-2); text-decoration: none; }
.rt-mobile-lang.is-active {
    background: #fff; color: var(--c-primary);
    border-color: var(--c-primary);
}

/* -------------------- Hero -------------------- */
.rt-hero {
    position: relative;
    padding: var(--s-6) var(--s-3);
    background: var(--c-ink);
    overflow: hidden;
    color: #fff;
}
.rt-hero-bg-picture {
    position: absolute; inset: 0; z-index: 0;
    display: block;
}
.rt-hero-bg-img {
    width: 100%; height: 100%; object-fit: cover; object-position: center 40%;
    filter: brightness(0.55);
}
.rt-hero-overlay {
    position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(135deg, rgba(26, 43, 74, 0.7) 0%, rgba(26, 43, 74, 0.35) 100%);
}
.rt-hero-inner {
    position: relative; z-index: 2;
    max-width: var(--w-max); margin: 0 auto;
    display: grid; grid-template-columns: 1.05fr 0.95fr;
    gap: var(--s-5); align-items: center;
    min-height: 480px;
}
.rt-hero-text { color: #fff; }
.rt-hero-text h1 { color: #fff; font-family: var(--f-display); font-weight: 700; }
.rt-hero-sub { color: #e8e2cc; font-size: 19px; line-height: 1.5; margin-top: var(--s-2); }

.rt-hero-badges {
    display: flex; flex-wrap: wrap; gap: var(--s-1);
    margin-bottom: var(--s-2);
}
.rt-hero-badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    padding: 6px 12px; border-radius: 999px;
    font-size: 13px; font-weight: var(--fw-semi);
    backdrop-filter: blur(4px);
}
.rt-hero-badge .rt-star { color: var(--c-accent); }
.rt-hero-badge .rt-check { color: var(--c-accent); font-weight: 700; }

/* -------------------- Booking widget in hero -------------------- */
.rt-widget {
    background: #fff;
    color: var(--c-text);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-3);
    padding: var(--s-3);
    border-top: 4px solid var(--c-primary);
}
.rt-widget * { color: var(--c-text); }
.rt-widget h3 { color: var(--c-ink); }

.rt-widget-title {
    font-family: var(--f-display);
    font-size: 22px;
    font-weight: 700;
    color: var(--c-ink);
    margin: 0 0 var(--s-2);
    text-align: center;
}
.rt-widget-tabs {
    display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
    background: var(--c-cream); border-radius: var(--r-md); padding: 4px;
    margin-bottom: var(--s-3);
}
.rt-widget-tab {
    padding: 10px 8px; border: none; background: transparent;
    color: var(--c-ink-2); font-weight: var(--fw-semi); font-size: 14px;
    border-radius: 6px; cursor: pointer; transition: 0.15s;
    font-family: var(--f-sans);
}
.rt-widget-tab.is-active {
    background: #fff; color: var(--c-ink);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.rt-widget-body { display: none; }
.rt-widget-body.is-active { display: block; }

.rt-widget-options {
    display: flex; flex-direction: column; gap: var(--s-1);
    margin-bottom: var(--s-3);
}
.rt-widget-option {
    display: flex; align-items: flex-start; gap: var(--s-1);
    padding: 12px; border: 2px solid var(--c-line);
    border-radius: var(--r-md); cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    background: #fff;
}
.rt-widget-option:hover { border-color: var(--c-line-2); }
.rt-widget-option.is-selected {
    border-color: var(--c-primary);
    background: #fdf9ef;
}
.rt-widget-option input[type="radio"] {
    margin: 4px 6px 0 0; accent-color: var(--c-primary); flex-shrink: 0;
}
.rt-widget-option-body { flex: 1; }
.rt-widget-option-title {
    display: flex; justify-content: space-between; align-items: baseline;
    gap: var(--s-1); font-weight: var(--fw-semi); font-size: 15px;
    color: var(--c-ink); margin-bottom: 2px;
}
.rt-widget-option-price { color: var(--c-primary); font-weight: 700; white-space: nowrap; }
.rt-widget-option-desc { color: var(--c-ink-2); font-size: 13px; line-height: 1.4; }

.rt-widget-controls {
    display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-1);
    margin-bottom: var(--s-2);
}
.rt-widget-field { display: flex; flex-direction: column; gap: 4px; }
.rt-widget-field-full { grid-column: 1 / -1; }
.rt-widget-field label { color: var(--c-ink-2); font-size: 12px; font-weight: var(--fw-semi); text-transform: uppercase; letter-spacing: 0.04em; }
.rt-widget-field input, .rt-widget-field select {
    padding: 10px 12px; border: 1px solid var(--c-line); border-radius: 6px;
    font-size: 15px; color: var(--c-text); background: #fff;
    font-family: var(--f-sans);
}
.rt-widget-field input:focus, .rt-widget-field select:focus {
    outline: none; border-color: var(--c-primary);
    box-shadow: 0 0 0 3px rgba(184, 134, 11, 0.15);
}
/* Make the date input feel like a button — no caret, native picker on click */
.rt-widget-field input[type="date"] {
    cursor: pointer;
    caret-color: transparent;
    -webkit-user-select: none; user-select: none;
    background-image: none;
}
.rt-widget-field input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.6;
}

.rt-widget-hint {
    background: var(--c-cream); color: var(--c-ink-2);
    padding: 8px 12px; border-radius: 6px; font-size: 13px;
    margin-bottom: var(--s-2); display: none;
}
.rt-widget-hint.is-visible { display: block; }

.rt-widget-cta {
    display: block; text-align: center;
    padding: 14px; border-radius: var(--r-md);
    background: var(--c-primary); color: #fff !important;
    font-weight: 700; font-size: 16px; text-decoration: none;
    box-shadow: 0 2px 6px rgba(184, 134, 11, 0.3);
    transition: 0.15s;
}
.rt-widget-cta:hover { background: var(--c-primary-dk); text-decoration: none; }

.rt-widget-trust {
    text-align: center; font-size: 12px; color: var(--c-ink-2);
    margin-top: var(--s-1);
}

/* -------------------- Section: What's included -------------------- */
.rt-incl {
    display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3);
}
.rt-incl-card {
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-md); padding: var(--s-3);
    border-top: 3px solid var(--c-primary);
    display: flex; flex-direction: column;
}
.rt-incl-card h3 { color: var(--c-ink); margin-bottom: var(--s-1); font-family: var(--f-display); }
.rt-incl-card p { color: var(--c-ink-2); font-size: 15.5px; line-height: 1.6; }
.rt-incl-card ul { list-style: none; padding: 0; margin: 0 0 var(--s-2); }
.rt-incl-card ul li {
    padding: 6px 0 6px 22px; position: relative;
    color: var(--c-text); font-size: 15px; line-height: 1.5;
}
.rt-incl-card ul li::before {
    content: "✓"; color: var(--c-primary);
    font-weight: 700; position: absolute; left: 0; top: 6px;
}
.rt-incl-card .rt-incl-card-note {
    color: var(--c-ink-2); font-size: 14px; font-style: italic;
    margin-top: auto; margin-bottom: var(--s-2);
    padding-top: var(--s-2); border-top: 1px dashed var(--c-line);
}
.rt-incl-card .rt-btn { margin-top: auto; }

/* -------------------- Section: Monuments grid -------------------- */
.rt-mon-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: var(--s-3);
}
.rt-mon-card {
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-md); overflow: hidden;
    display: flex; flex-direction: column;
    transition: 0.2s;
}
.rt-mon-card:hover { box-shadow: var(--sh-2); transform: translateY(-2px); }
.rt-mon-card-img {
    width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
}
.rt-mon-card-body { padding: var(--s-2) var(--s-3) var(--s-3); }
.rt-mon-card-title { font-family: var(--f-display); font-size: 20px; font-weight: 700; color: var(--c-ink); margin-bottom: 6px; line-height: 1.2; }
.rt-mon-card-desc { color: var(--c-ink-2); font-size: 14.5px; line-height: 1.5; margin: 0; }

.rt-mon-more { text-align: center; margin-top: var(--s-4); }

/* -------------------- Compare table -------------------- */
.rt-compare {
    max-width: 900px; margin: 0 auto;
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-lg); overflow: hidden;
    box-shadow: var(--sh-1);
}
.rt-compare-head, .rt-compare-row {
    display: grid; grid-template-columns: 1.4fr 1fr 1fr;
    align-items: center;
}
.rt-compare-head {
    background: var(--c-ink); color: #fff;
    font-family: var(--f-display); font-weight: 700;
    font-size: 20px;
}
.rt-compare-head > div {
    padding: var(--s-3) var(--s-2);
    text-align: center; border-right: 1px solid rgba(255,255,255,0.1);
}
.rt-compare-head > div:first-child { text-align: left; padding-left: var(--s-3); background: rgba(0,0,0,0.15); }
.rt-compare-head > div:last-child { border-right: none; }
.rt-compare-row {
    border-top: 1px solid var(--c-line);
    background: #fff;
}
.rt-compare-row:nth-child(even) { background: var(--c-cream); }
.rt-compare-row > div {
    padding: var(--s-2) var(--s-2);
    text-align: center;
    border-right: 1px solid var(--c-line);
}
.rt-compare-row > div:first-child {
    text-align: left; padding-left: var(--s-3);
    font-weight: var(--fw-semi); color: var(--c-ink);
}
.rt-compare-row > div:last-child { border-right: none; }
.rt-compare-cta-row {
    background: #fff !important;
}
.rt-compare-cta-row > div { padding: var(--s-3) var(--s-2); }
.rt-compare-cta-row .rt-btn { width: 100%; }

/* -------------------- Price table (Tickets page) -------------------- */
.rt-price-table-wrap {
    max-width: 900px; margin: var(--s-2) auto 0;
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-lg); overflow-x: auto;
    box-shadow: var(--sh-1);
    -webkit-overflow-scrolling: touch;
}
.rt-price-table {
    width: 100%; border-collapse: collapse;
    background: #fff;
}
.rt-price-table thead th {
    background: var(--c-ink); color: #fff;
    font-family: var(--f-display); font-weight: 700;
    font-size: 17px;
    padding: 14px 12px; text-align: center;
    border-right: 1px solid rgba(255,255,255,0.1);
    white-space: nowrap;
}
.rt-price-table thead th:last-child { border-right: none; }
.rt-price-table thead th.rt-price-th-type {
    text-align: left; padding-left: 20px;
    background: rgba(0,0,0,0.15);
    background-color: color-mix(in srgb, var(--c-ink) 100%, #000 15%);
}
.rt-price-table tbody td {
    padding: 12px; text-align: center;
    border-top: 1px solid var(--c-line);
    border-right: 1px solid var(--c-line);
    color: var(--c-ink);
    white-space: nowrap;
}
.rt-price-table tbody td:last-child { border-right: none; }
.rt-price-table tbody td.rt-price-td-type {
    text-align: left; padding-left: 20px;
    font-weight: var(--fw-semi);
}
.rt-price-table tbody tr:nth-child(even) { background: var(--c-cream); }

/* -------------------- Reviews -------------------- */
.rt-reviews {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: var(--s-3);
}
.rt-review-card {
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-md); padding: var(--s-3);
    display: flex; flex-direction: column;
}
.rt-review-stars { color: var(--c-star); font-size: 18px; letter-spacing: 2px; margin-bottom: var(--s-1); }
.rt-review-text { color: var(--c-text); font-size: 15.5px; line-height: 1.55; margin: 0 0 var(--s-2); flex: 1; }
.rt-review-meta { color: var(--c-ink-2); font-size: 13px; font-weight: var(--fw-semi); }

.rt-rating-line { text-align: center; margin-top: var(--s-3); color: var(--c-ink-2); font-size: 15px; }

/* -------------------- Know before you go -------------------- */
.rt-kn {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: var(--s-3);
}
.rt-kn-card {
    background: var(--c-cream);
    border: 2px dashed var(--c-line-2);
    border-radius: var(--r-md); padding: var(--s-3);
}
.rt-kn-icon { font-size: 26px; color: var(--c-primary); line-height: 1; margin-bottom: var(--s-1); }
.rt-kn-card h3 { color: var(--c-ink); font-size: 18px; font-family: var(--f-display); margin-bottom: 6px; }
.rt-kn-card p { color: var(--c-ink-2); font-size: 14.5px; line-height: 1.55; margin: 0; }

/* -------------------- FAQ -------------------- */
.rt-faq { max-width: 820px; margin: 0 auto; }
.rt-faq-item {
    background: #fff; border: 1px solid var(--c-line);
    border-radius: var(--r-md); margin-bottom: var(--s-1);
    overflow: hidden;
}
.rt-faq-item[open] { border-color: var(--c-primary); }
.rt-faq-item summary {
    padding: var(--s-2) var(--s-3);
    font-weight: var(--fw-semi); color: var(--c-ink);
    cursor: pointer; list-style: none;
    display: flex; justify-content: space-between; align-items: center;
    gap: var(--s-2);
    font-size: 16px;
}
.rt-faq-item summary::-webkit-details-marker { display: none; }
.rt-faq-item summary::after {
    content: "+"; color: var(--c-primary); font-size: 22px; font-weight: 700; line-height: 1;
    transition: transform 0.2s;
}
.rt-faq-item[open] summary::after { content: "−"; }
.rt-faq-item-body {
    padding: 0 var(--s-3) var(--s-3);
    color: var(--c-ink-2); font-size: 15.5px; line-height: 1.6;
}

.rt-faq-more { text-align: center; margin-top: var(--s-3); }

/* -------------------- Closing CTA band -------------------- */
.rt-cta-band {
    background: var(--c-ink);
    color: #fff;
    text-align: center;
    padding: var(--s-6) var(--s-3);
}
.rt-cta-band h2 { color: #fff; font-family: var(--f-display); margin-bottom: var(--s-2); }
.rt-cta-band p { color: #d9dde5; font-size: 17px; max-width: 620px; margin: 0 auto var(--s-3); }
.rt-cta-band .rt-cta-btns { display: flex; gap: var(--s-2); justify-content: center; flex-wrap: wrap; }
.rt-cta-band .rt-btn-secondary {
    background: transparent; color: #fff; border-color: rgba(255,255,255,0.4);
}
.rt-cta-band .rt-btn-secondary:hover {
    background: #fff; color: var(--c-ink);
}

/* -------------------- Sticky bar -------------------- */
.rt-stickybar {
    position: fixed; left: 0; right: 0; bottom: 0;
    background: #fff;
    border-top: 1px solid var(--c-line);
    box-shadow: 0 -6px 24px rgba(26, 43, 74, 0.10);
    z-index: 50;
    padding: 12px var(--s-3);
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}
.rt-stickybar-inner {
    max-width: var(--w-max); margin: 0 auto;
    display: flex !important; flex-direction: row !important; flex-wrap: nowrap;
    align-items: center; justify-content: space-between; gap: var(--s-2);
}
.rt-stickybar-text {
    color: var(--c-ink); font-weight: var(--fw-semi); font-size: 14.5px;
    flex: 1; min-width: 0;
}
.rt-stickybar-btns { display: flex; gap: var(--s-1); flex-shrink: 0; }
.rt-stickybar-btn { padding: 10px 16px !important; font-size: 14.5px !important; }

/* -------------------- Footer -------------------- */
.rt-footer {
    background: var(--c-ink);
    color: #c9cfdc;
    padding: var(--s-5) var(--s-3);
}
.rt-footer-inner { max-width: var(--w-max); margin: 0 auto; }
.rt-footer-brand { display: flex; align-items: center; gap: 10px; margin-bottom: var(--s-2); }
.rt-footer-brand-name { color: #fff; font-weight: 700; font-family: var(--f-display); font-size: 18px; }
.rt-footer-brand-text { color: #a3aab9; font-size: 14px; }
.rt-footer-about { color: #c9cfdc; font-size: 13.5px; max-width: 720px; line-height: 1.6; margin-bottom: var(--s-2); }
.rt-footer-links { color: #a3aab9; font-size: 13.5px; display: flex; flex-wrap: wrap; gap: var(--s-1); }
.rt-footer-links a { color: #d0d6e3; }
.rt-footer-links a:hover { color: #fff; }
.rt-sep { color: #4a5a75; }
.rt-partner-note { color: #a3aab9; }
.rt-footer-credits { color: #7d8494; font-size: 12px; line-height: 1.5; margin: var(--s-2) 0 0; max-width: 720px; }
.rt-footer-credits a { color: #a3aab9; text-decoration: underline; }
.rt-footer-credits a:hover { color: #fff; }

/* -------------------- 404 -------------------- */
.rt-404 { text-align: center; padding: var(--s-6) var(--s-3); }
.rt-404 h1 { font-size: 64px; color: var(--c-primary); font-family: var(--f-display); margin-bottom: var(--s-2); }
.rt-404 p { color: var(--c-ink-2); font-size: 17px; max-width: 500px; margin: 0 auto var(--s-3); }

/* -------------------- Legal pages -------------------- */
.rt-legal { max-width: 780px; margin: 0 auto; padding: var(--s-5) var(--s-3); color: var(--c-text); }
.rt-legal h1 { font-family: var(--f-display); font-size: 34px; margin-bottom: var(--s-3); color: var(--c-ink); }
.rt-legal h2 { font-family: var(--f-display); font-size: 22px; margin: var(--s-4) 0 var(--s-1); color: var(--c-ink); }
.rt-legal p { font-size: 15px; line-height: 1.65; color: var(--c-text); }
.rt-legal a { color: var(--c-primary); }

/* -------------------- Media queries -------------------- */
@media (max-width: 899px) {
    .rt-nav { display: none; }
    .rt-langswitch { display: none; }
    .rt-menu-toggle { display: block; }
    .rt-mobile-nav.is-open { display: flex; }

    /* Trust bar wird per JS unter die erste Section/Hero verschoben.
       Fallback-Styling wenn sie nicht mehr im Header sitzt: kein sticky, etwas mehr padding. */
    body > .rt-trustbar,
    .rt-main > .rt-trustbar,
    .rt-trustbar[data-rt-mobile-moved="1"] {
        margin: 0; border-top: 1px solid rgba(255,255,255,0.08);
    }

    .rt-header-inner { gap: var(--s-1); padding: var(--s-2); }
    .rt-logo-mark { width: 38px; height: 38px; }
    .rt-logo-text { font-size: 22px; }
    .rt-logo-dot { font-size: 18px; margin: 0 2px; transform: translateY(-2px); }

    .rt-hero { padding: var(--s-4) var(--s-2); }
    .rt-hero-inner { grid-template-columns: 1fr; min-height: auto; gap: var(--s-3); }
    .rt-hero-text { display: none; }
    .rt-hero-text.rt-hero-text--mobile-show { display: block; text-align: center; }
    .rt-hero-text h1 { font-size: 28px; }
    .rt-hero-sub { font-size: 16px; }
    .rt-hero-badges { justify-content: center; }

    .rt-widget { padding: var(--s-2); }

    .rt-section { padding: var(--s-5) var(--s-2); }

    .rt-incl { grid-template-columns: 1fr; }
    .rt-mon-grid { grid-template-columns: 1fr; gap: var(--s-2); }
    .rt-reviews { grid-template-columns: 1fr; }
    .rt-kn { grid-template-columns: 1fr; }

    /* Compare-Tabelle mobil: Zeilenlabel volle Breite,
       Werte darunter in 2 Spalten mit sichtbaren Spaltenköpfen. */
    .rt-compare-head {
        grid-template-columns: 1fr 1fr;
    }
    .rt-compare-head > div {
        text-align: center !important;
        padding: var(--s-2) var(--s-1) !important;
        font-size: 15px;
        border-right: 1px solid rgba(255,255,255,0.15) !important;
    }
    .rt-compare-head > div:first-child { display: none; }
    .rt-compare-head > div:last-child { border-right: none !important; }

    .rt-compare-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "label label"
            "val1  val2";
    }
    .rt-compare-row > div:nth-child(1) {
        grid-area: label;
        background: var(--c-cream-2);
        font-weight: 700;
        text-align: left !important;
        padding: 10px var(--s-2) !important;
        border-right: none !important;
        border-bottom: 1px solid var(--c-line);
    }
    .rt-compare-row > div:nth-child(2) {
        grid-area: val1;
        text-align: center !important;
        padding: var(--s-2) var(--s-1) !important;
        border-right: 1px solid var(--c-line) !important;
    }
    .rt-compare-row > div:nth-child(3) {
        grid-area: val2;
        text-align: center !important;
        padding: var(--s-2) var(--s-1) !important;
        border-right: none !important;
    }
    /* CTA-Zeile: keine Label-Zelle, Buttons nebeneinander */
    .rt-compare-cta-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "val1 val2";
    }
    .rt-compare-cta-row > div:nth-child(1) { display: none; }
    .rt-compare-cta-row > div:nth-child(2),
    .rt-compare-cta-row > div:nth-child(3) {
        padding: var(--s-2) var(--s-1) !important;
        border-bottom: none;
    }
    .rt-compare-cta-row .rt-btn { width: 100%; font-size: 14px; padding: 12px 8px; }

    .rt-trustbar-inner { gap: var(--s-1) var(--s-2); font-size: 12px; }
    .rt-trust { flex: 0 0 calc(50% - var(--s-1)); justify-content: flex-start; }

    .rt-stickybar-text { font-size: 12px; }
    .rt-stickybar-btn { padding: 9px 12px !important; font-size: 13px !important; }
}

@media (max-width: 480px) {
    h1 { font-size: 26px !important; }
    h2 { font-size: 22px; }
    .rt-hero-badge { font-size: 11px; padding: 4px 8px; }
    .rt-widget-controls { grid-template-columns: 1fr; }

    .rt-logo-mark { width: 34px; height: 34px; }
    .rt-logo-text { font-size: 20px; }
    .rt-logo-dot { font-size: 16px; }
}