:root {
    --navy: #10213f;
    --navy-2: #182e52;
    --cyan: #0aa8a4;
    --cyan-dark: #087f7c;
    --mint: #e8f8f6;
    --bg: #f3f6fa;
    --card: #ffffff;
    --text: #1f2a3d;
    --muted: #687386;
    --border: #dce3ec;
    --green: #14855f;
    --green-bg: #eaf7f1;
    --orange: #d96c23;
    --shadow: 0 14px 40px rgba(16, 33, 63, .11);
    --radius: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.5;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
a { color: inherit; }
.container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.site-header { background: var(--navy); color: white; position: sticky; top: 0; z-index: 30; box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.header-inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-mark { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--cyan); }
.brand-mark svg { width: 29px; fill: white; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 17px; }
.brand small { color: #aebbd0; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.mode-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; padding: 8px 12px; color: #dce5f3; font-size: 13px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #52d79a; box-shadow: 0 0 0 4px rgba(82,215,154,.12); }
.hero { background: linear-gradient(130deg, var(--navy) 0%, var(--navy-2) 60%, #124e66 100%); color: white; padding: 54px 0 84px; }
.hero-copy { max-width: 760px; margin-bottom: 30px; }
.eyebrow { margin: 0 0 8px; color: var(--cyan); font-weight: 800; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.hero .eyebrow { color: #64e2dc; }
h1, h2, h3, h4, p { margin-top: 0; }
h1 { margin-bottom: 12px; font-size: clamp(34px, 5vw, 54px); line-height: 1.08; letter-spacing: -.035em; }
.hero-copy > p:last-child { max-width: 690px; color: #c7d4e6; font-size: 17px; }
.search-card { background: white; color: var(--text); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.form-grid { display: grid; grid-template-columns: 1.3fr 1.15fr 1.15fr .64fr auto; align-items: end; gap: 12px; }
.field > span:first-child { display: block; color: #526075; font-size: 12px; font-weight: 750; margin: 0 0 7px 2px; }
.input-wrap, .date-time { display: flex; align-items: center; min-height: 50px; border: 1px solid var(--border); border-radius: 10px; background: #fff; transition: .2s ease; }
.input-wrap:focus-within, .date-time:focus-within, select:focus { outline: 3px solid rgba(10,168,164,.15); border-color: var(--cyan); }
.input-wrap svg { width: 20px; margin-left: 14px; fill: var(--cyan); }
input, select { min-width: 0; border: 0; outline: 0; color: var(--text); background: transparent; }
.input-wrap input { width: 100%; padding: 12px; }
.date-time input { width: 100%; padding: 12px 8px; }
.date-time input + input { border-left: 1px solid var(--border); }
.field-age select { width: 100%; min-height: 50px; border: 1px solid var(--border); border-radius: 10px; padding: 0 12px; }
.button { min-height: 46px; border-radius: 10px; padding: 0 18px; border: 1px solid transparent; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: transform .15s ease, background .15s ease, box-shadow .15s ease; }
.button:not(:disabled):hover { transform: translateY(-1px); }
.button-primary { color: white; background: var(--cyan); box-shadow: 0 9px 20px rgba(10,168,164,.22); }
.button-primary:not(:disabled):hover { background: var(--cyan-dark); }
.button-primary:disabled { opacity: .55; box-shadow: none; }
.button-secondary { color: var(--navy); background: white; border-color: var(--border); }
.search-button { min-height: 50px; white-space: nowrap; }
.search-button svg { width: 20px; fill: currentColor; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; margin-top: -38px; padding-bottom: 62px; position: relative; z-index: 2; }
.results-section { min-width: 0; }
.results-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 16px; color: white; }
.results-head h2 { font-size: 25px; margin-bottom: 0; }
.trip-summary { display: flex; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.trip-summary span { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 7px 11px; font-size: 13px; }
.offer-list { display: grid; gap: 18px; }
.offer-card { position: relative; display: grid; grid-template-columns: 220px minmax(0,1fr) 218px; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 8px 25px rgba(16,33,63,.07); overflow: hidden; }
.offer-ribbon { position: absolute; z-index: 2; top: 15px; left: -31px; width: 130px; transform: rotate(-38deg); text-align: center; background: var(--orange); color: white; font-weight: 800; font-size: 11px; padding: 5px; letter-spacing: .04em; text-transform: uppercase; }
.vehicle-media { padding: 38px 18px 18px; background: linear-gradient(180deg, #f7fafc, #edf2f7); display: flex; flex-direction: column; align-items: center; justify-content: center; border-right: 1px solid var(--border); }
.vehicle-media img { width: 100%; height: 145px; object-fit: contain; filter: drop-shadow(0 13px 12px rgba(16,33,63,.18)); }
.supplier-pill { margin-top: 14px; padding: 5px 10px; border-radius: 999px; background: white; border: 1px solid var(--border); color: var(--muted); font-size: 11px; font-weight: 800; }
.offer-main { padding: 24px; min-width: 0; }
.offer-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.category-label { display: block; font-size: 11px; color: var(--cyan-dark); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.offer-main h3 { font-size: 23px; line-height: 1.2; margin: 4px 0 3px; }
.similar { color: var(--muted); font-size: 13px; margin-bottom: 0; }
.availability { white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; color: var(--green); background: var(--green-bg); padding: 6px 9px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.availability span { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.spec-list { list-style: none; padding: 0; margin: 20px 0; display: flex; flex-wrap: wrap; gap: 10px 16px; color: #445166; font-size: 13px; }
.spec-list li { display: inline-flex; align-items: center; gap: 6px; }
.spec-list li span { color: var(--cyan-dark); font-size: 12px; }
.benefit-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px 14px; padding-top: 16px; border-top: 1px solid var(--border); }
.benefit-grid span { min-width: 0; display: flex; align-items: center; gap: 7px; color: #35445b; font-size: 13px; }
.benefit-grid svg { flex: 0 0 17px; width: 17px; fill: var(--green); }
.offer-details { margin-top: 15px; }
.offer-details summary { color: var(--cyan-dark); font-size: 13px; font-weight: 800; cursor: pointer; }
.details-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 13px; padding: 14px; border-radius: 10px; background: #f7f9fc; }
.details-grid h4 { margin-bottom: 6px; font-size: 13px; }
.details-grid p { margin: 3px 0; color: var(--muted); font-size: 12px; }
.offer-price { padding: 24px 20px; border-left: 1px solid var(--border); display: flex; flex-direction: column; align-items: stretch; justify-content: center; background: #fbfcfe; text-align: right; }
.price-label { color: var(--muted); font-size: 12px; }
.offer-price strong { color: var(--navy); font-size: 29px; line-height: 1.2; letter-spacing: -.03em; }
.per-day, .tax-note, .reference { color: var(--muted); font-size: 12px; }
.tax-note { margin: 5px 0 18px; }
.full-width { width: 100%; }
.text-link { border: 0; background: none; padding: 12px 0 4px; color: var(--cyan-dark); text-decoration: underline; text-underline-offset: 3px; font-weight: 800; font-size: 13px; }
.reference { margin-top: 8px; text-align: center; }
.sidebar { padding-top: 88px; display: grid; align-content: start; gap: 16px; }
.info-card, .meta-card { border-radius: 14px; border: 1px solid var(--border); background: white; padding: 18px; box-shadow: 0 8px 24px rgba(16,33,63,.06); }
.info-card { display: flex; gap: 12px; }
.info-icon { flex: 0 0 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--mint); color: var(--cyan-dark); font-weight: 900; }
.info-card h3, .meta-card h3 { font-size: 15px; margin-bottom: 8px; }
.info-card p { color: var(--muted); font-size: 13px; margin: 0; }
.meta-card dl { margin: 0; }
.meta-card dl div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border); font-size: 12px; }
.meta-card dt { color: var(--muted); }
.meta-card dd { margin: 0; font-weight: 750; text-align: right; }
.developer-section { background: #e9eef5; border-top: 1px solid #d8e0ea; padding: 58px 0 72px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 18px; }
.section-heading h2 { font-size: 27px; margin-bottom: 5px; }
.section-heading p:last-child { color: var(--muted); margin-bottom: 0; }
.raw-shell { border-radius: 14px; overflow: hidden; background: #101a2d; box-shadow: var(--shadow); }
.raw-shell.collapsed { display: none; }
.raw-tabs { display: flex; overflow-x: auto; gap: 2px; padding: 10px 10px 0; background: #17233a; }
.raw-tab { white-space: nowrap; border: 0; color: #aebbd0; background: transparent; padding: 12px 15px; border-radius: 9px 9px 0 0; font-weight: 750; font-size: 13px; }
.raw-tab.active { color: white; background: #101a2d; }
.raw-panel { min-height: 440px; }
.code-toolbar { height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 17px; border-bottom: 1px solid #26334b; color: #9aacbf; font-size: 12px; }
.copy-button { border: 1px solid #35455f; color: #dbe5f2; background: #1a2942; border-radius: 7px; padding: 6px 10px; }
pre { margin: 0; padding: 22px; max-height: 560px; overflow: auto; color: #d8e3ef; font: 12px/1.65 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; white-space: pre; tab-size: 2; }
.empty-state, .alert { background: white; border: 1px solid var(--border); border-radius: var(--radius); padding: 26px; }
.alert-error { color: #8d1b1b; border-color: #f0baba; background: #fff6f6; }
.modal { position: fixed; inset: 0; z-index: 100; display: none; }
.modal.is-open { display: block; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(5,13,27,.66); backdrop-filter: blur(3px); }
.modal-dialog { position: relative; width: min(780px, calc(100% - 28px)); max-height: min(850px, calc(100vh - 40px)); margin: 20px auto; background: white; border-radius: 18px; box-shadow: 0 30px 80px rgba(0,0,0,.3); display: flex; flex-direction: column; overflow: hidden; animation: modal-in .18s ease-out; }
@keyframes modal-in { from { transform: translateY(16px); opacity: 0; } }
.modal-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 24px 26px 18px; border-bottom: 1px solid var(--border); }
.modal-header h2 { margin-bottom: 4px; }
.modal-header p:last-child { color: var(--muted); margin: 0; font-size: 13px; }
.modal-close { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); background: white; color: var(--navy); font-size: 28px; line-height: 1; }
.modal-body { padding: 22px 26px; overflow: auto; }
.conditions-intro { display: flex; gap: 12px; padding: 15px; border-radius: 12px; background: var(--mint); margin-bottom: 16px; }
.conditions-intro strong { display: block; margin-bottom: 3px; }
.conditions-intro p { color: #536878; margin: 0; font-size: 13px; }
.shield-icon { flex: 0 0 29px; height: 29px; border-radius: 50%; display: grid; place-items: center; color: white; background: var(--green); font-weight: 900; }
.condition-list { display: grid; gap: 9px; }
.condition-item { border: 1px solid var(--border); border-radius: 11px; overflow: hidden; }
.condition-item summary { list-style: none; padding: 14px 16px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: 800; background: #fafbfd; }
.condition-item summary::-webkit-details-marker { display: none; }
.condition-item summary span { color: var(--cyan); font-size: 20px; transition: transform .15s ease; }
.condition-item[open] summary span { transform: rotate(45deg); }
.condition-item > div { padding: 12px 16px 14px; border-top: 1px solid var(--border); }
.condition-item p { margin: 7px 0; color: #48566b; font-size: 14px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 26px; border-top: 1px solid var(--border); background: #fafbfd; }
.toast { position: fixed; right: 18px; bottom: 18px; z-index: 200; transform: translateY(20px); opacity: 0; pointer-events: none; color: white; background: var(--navy); border-radius: 10px; padding: 11px 15px; box-shadow: var(--shadow); transition: .2s ease; }
.toast.show { transform: none; opacity: 1; }
body.modal-open { overflow: hidden; }

@media (max-width: 1060px) {
    .form-grid { grid-template-columns: 1fr 1fr; }
    .field-location { grid-column: span 2; }
    .search-button { width: 100%; }
    .content-grid { grid-template-columns: 1fr; }
    .sidebar { padding-top: 0; grid-template-columns: 1fr 1fr; }
    .offer-card { grid-template-columns: 190px minmax(0, 1fr); }
    .offer-price { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--border); display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 4px 18px; text-align: left; }
    .offer-price .button { grid-column: 3; grid-row: 1 / 3; min-width: 160px; }
    .offer-price .text-link { grid-column: 2 / 4; text-align: right; padding-top: 3px; }
    .offer-price .reference { display: none; }
    .tax-note { margin: 0; }
}

@media (max-width: 720px) {
    .container { width: min(100% - 22px, 1180px); }
    .site-header { position: static; }
    .header-inner { min-height: 64px; }
    .mode-badge { display: none; }
    .hero { padding: 38px 0 65px; }
    h1 { font-size: 35px; }
    .form-grid { grid-template-columns: 1fr; }
    .field-location { grid-column: auto; }
    .date-time input { font-size: 13px; }
    .results-head { align-items: flex-start; }
    .trip-summary { display: none; }
    .content-grid { margin-top: -29px; }
    .offer-card { grid-template-columns: 1fr; }
    .vehicle-media { border-right: 0; border-bottom: 1px solid var(--border); padding-top: 28px; }
    .vehicle-media img { height: 160px; }
    .offer-title-row { display: block; }
    .availability { margin-top: 12px; }
    .benefit-grid, .details-grid { grid-template-columns: 1fr; }
    .offer-price { grid-template-columns: 1fr; text-align: left; }
    .offer-price .button, .offer-price .text-link { grid-column: auto; grid-row: auto; width: 100%; text-align: center; }
    .sidebar { grid-template-columns: 1fr; }
    .section-heading { align-items: flex-start; flex-direction: column; }
    .section-heading .button { width: 100%; }
    .raw-tabs { padding-left: 4px; }
    .raw-tab { padding-inline: 10px; font-size: 11px; }
    pre { font-size: 11px; padding: 16px; }
    .modal-dialog { max-height: calc(100vh - 16px); margin: 8px auto; }
    .modal-header, .modal-body, .modal-footer { padding-left: 17px; padding-right: 17px; }
    .modal-footer { flex-direction: column-reverse; }
    .modal-footer .button { width: 100%; }
}

/* API-/Standort-Erweiterungen */
.mode-badge.mode-live .status-dot { background: #ffb64a; box-shadow: 0 0 0 4px rgba(255,182,74,.15); }
.mode-switch { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 0 15px; margin-bottom: 15px; border-bottom: 1px solid var(--border); }
.mode-switch small { color: var(--muted); font-weight: 700; }
.mode-options { display: inline-flex; padding: 4px; border-radius: 11px; background: #eef3f7; }
.mode-options label { position: relative; cursor: pointer; }
.mode-options input { position: absolute; opacity: 0; pointer-events: none; }
.mode-options span { display: block; padding: 8px 12px; border-radius: 8px; color: #56647a; font-size: 13px; font-weight: 800; }
.mode-options input:checked + span { color: var(--navy); background: white; box-shadow: 0 3px 10px rgba(16,33,63,.10); }
.mode-options input:focus-visible + span { outline: 3px solid rgba(10,168,164,.2); }
.field-location { position: relative; }
.field-help { display: block; margin: 5px 2px 0; color: var(--muted); font-size: 11px; }
.location-code-badge { flex: 0 0 auto; margin-right: 8px; padding: 4px 7px; border-radius: 7px; color: var(--cyan-dark); background: var(--mint); font-size: 10px; font-weight: 900; white-space: nowrap; }
.location-results { position: absolute; top: calc(100% - 15px); left: 0; right: 0; z-index: 55; max-height: 320px; overflow-y: auto; padding: 7px; border: 1px solid var(--border); border-radius: 12px; background: white; box-shadow: 0 18px 42px rgba(16,33,63,.20); }
.location-option { width: 100%; border: 0; border-radius: 9px; background: transparent; padding: 10px 11px; text-align: left; color: var(--text); }
.location-option:hover, .location-option.is-active { background: var(--mint); }
.location-option strong, .location-option span { display: block; }
.location-option strong { font-size: 13px; }
.location-option span { margin-top: 2px; color: var(--muted); font-size: 11px; }
.location-empty { padding: 14px; color: var(--muted); font-size: 13px; }
.conditions-loading { min-height: 150px; display: grid; place-items: center; align-content: center; gap: 10px; color: var(--muted); }
.conditions-loading span { width: 28px; height: 28px; border: 3px solid #d9e6e6; border-top-color: var(--cyan); border-radius: 50%; animation: conditions-spin .7s linear infinite; }
.conditions-loading p, .conditions-empty { margin: 0; color: var(--muted); text-align: center; }
@keyframes conditions-spin { to { transform: rotate(360deg); } }

@media (max-width: 720px) {
    .mode-switch { align-items: stretch; flex-direction: column; gap: 8px; }
    .mode-options { display: grid; grid-template-columns: 1fr 1fr; }
    .mode-options span { text-align: center; }
    .location-results { top: calc(100% - 13px); }
}

/* Angebotsdarstellung und Buchungsflow v3 */
.offer-card { grid-template-columns: 220px minmax(0,1fr) 230px; }
.package-badge {
    position: absolute;
    z-index: 3;
    top: 14px;
    left: 14px;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    color: #fff;
    background: var(--navy);
    box-shadow: 0 7px 17px rgba(16,33,63,.18);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.package-premium { color: #4b3500; background: linear-gradient(135deg, #ffe6a2, #f4bf37); }
.package-comfort { background: linear-gradient(135deg, #2d70c9, #27559a); }
.package-inclusive { background: linear-gradient(135deg, #18a879, #107457); }
.package-basic { background: linear-gradient(135deg, #687386, #465165); }

.availability span {
    position: relative;
    animation: availability-pulse 1.7s ease-out infinite;
}
.availability span::after {
    content: "";
    position: absolute;
    inset: -5px;
    border: 1px solid rgba(20,133,95,.45);
    border-radius: 50%;
    animation: availability-ring 1.7s ease-out infinite;
}
@keyframes availability-pulse {
    0%, 100% { transform: scale(1); }
    45% { transform: scale(1.28); }
}
@keyframes availability-ring {
    0% { opacity: .7; transform: scale(.55); }
    75%, 100% { opacity: 0; transform: scale(1.45); }
}
@media (prefers-reduced-motion: reduce) {
    .availability span, .availability span::after { animation: none; }
}

.offer-benefits,
.offer-details-panel {
    margin-top: 17px;
    padding-top: 15px;
    border-top: 1px solid var(--border);
}
.offer-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.offer-section-title > span { color: var(--navy); font-size: 13px; font-weight: 900; }
.offer-section-title small { color: var(--green); font-size: 10px; font-weight: 800; text-align: right; }
.inclusion-labels { display: flex; flex-wrap: wrap; gap: 7px; }
.inclusion-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 31px;
    padding: 5px 9px;
    border: 1px solid #cde9df;
    border-radius: 999px;
    color: #21664f;
    background: #f0faf6;
    font-size: 11px;
    font-weight: 800;
}
.inclusion-label svg { width: 15px; flex: 0 0 15px; fill: var(--green); }
.detail-card-grid { display: grid; grid-template-columns: 1fr; gap: 9px; }
.detail-card {
    display: grid;
    grid-template-columns: 31px minmax(0,1fr);
    gap: 10px;
    padding: 12px;
    border: 1px solid #e1e7ef;
    border-radius: 12px;
    background: linear-gradient(180deg, #fbfcfe, #f6f9fc);
}
.detail-card-icon {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--cyan-dark);
    background: var(--mint);
    font-size: 15px;
    font-weight: 900;
}
.detail-card h4 { margin: 1px 0 6px; color: var(--navy); font-size: 12px; }
.detail-card p { margin: 6px 0; color: var(--text); font-size: 11px; }
.detail-card p strong, .detail-card p span { display: block; }
.detail-card p strong { font-weight: 800; }
.detail-card p span { margin-top: 1px; color: var(--muted); }
.select-offer-form { margin: 0; }

/* Stations- und Checkoutseiten */
.flow-page { min-height: calc(100vh - 72px); padding: 34px 0 72px; background: var(--bg); }
.flow-header { margin-bottom: 24px; }
.flow-header h1 { margin-bottom: 7px; color: var(--navy); font-size: clamp(29px,4vw,42px); }
.flow-header > p { color: var(--muted); max-width: 760px; }
.flow-steps {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 8px;
    max-width: 720px;
    margin-bottom: 28px;
}
.flow-step {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 13px;
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--muted);
    background: white;
    font-size: 12px;
    font-weight: 800;
}
.flow-step span {
    width: 25px;
    height: 25px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e9eef5;
    font-size: 11px;
}
.flow-step.complete { color: var(--green); border-color: #cce6dc; background: #f3fbf7; }
.flow-step.complete span { color: white; background: var(--green); }
.flow-step.active { color: var(--navy); border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(10,168,164,.10); }
.flow-step.active span { color: white; background: var(--cyan); }
.flow-layout { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 22px; align-items: start; }
.flow-stack { display: grid; gap: 18px; }
.flow-card { border: 1px solid var(--border); border-radius: var(--radius); background: white; box-shadow: 0 8px 25px rgba(16,33,63,.06); overflow: hidden; }
.flow-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--border); }
.flow-card-header h2, .flow-card-header h3 { margin: 0; color: var(--navy); font-size: 18px; }
.flow-card-body { padding: 20px; }
.station-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.station-card { position: relative; padding: 18px; border: 1px solid var(--border); border-radius: 14px; background: #fafbfd; }
.station-card::before { content: ""; position: absolute; top: 23px; left: 0; width: 4px; height: 43px; border-radius: 0 4px 4px 0; background: var(--cyan); }
.station-card.return::before { background: var(--navy-2); }
.station-type { color: var(--cyan-dark); font-size: 10px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.station-card h3 { margin: 5px 0 6px; color: var(--navy); font-size: 18px; }
.station-address { min-height: 42px; color: var(--muted); font-size: 13px; }
.station-meta { display: grid; gap: 8px; margin-top: 15px; }
.station-meta div { display: flex; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid var(--border); font-size: 12px; }
.station-meta span:first-child { color: var(--muted); }
.station-meta span:last-child { text-align: right; font-weight: 800; }
.station-note { display: flex; gap: 11px; margin-top: 14px; padding: 12px; border-radius: 11px; color: #4d6071; background: var(--mint); font-size: 12px; }
.station-note strong { color: var(--navy); }
.selected-offer { display: grid; grid-template-columns: 118px minmax(0,1fr); gap: 15px; align-items: center; }
.selected-offer img { width: 100%; height: 85px; object-fit: contain; }
.selected-offer h3 { margin: 2px 0 3px; color: var(--navy); font-size: 17px; }
.selected-offer p { margin: 0; color: var(--muted); font-size: 12px; }
.selected-package { display: inline-flex; margin-bottom: 4px; padding: 4px 8px; border-radius: 999px; color: var(--cyan-dark); background: var(--mint); font-size: 10px; font-weight: 900; }
.price-summary { display: grid; gap: 9px; margin: 18px 0; padding-top: 15px; border-top: 1px solid var(--border); }
.price-summary div { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 13px; }
.price-summary .price-total { color: var(--navy); font-size: 17px; font-weight: 900; }
.flow-actions { display: grid; gap: 9px; }
.flow-actions .button { width: 100%; text-decoration: none; }
.flow-back { color: var(--cyan-dark); text-align: center; font-size: 12px; font-weight: 800; text-decoration: none; }
.checkout-form { display: grid; gap: 17px; }
.form-section-title { margin: 0 0 10px; color: var(--navy); font-size: 15px; }
.checkout-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.checkout-field { display: grid; gap: 6px; }
.checkout-field.full { grid-column: 1 / -1; }
.checkout-field span { color: #526075; font-size: 12px; font-weight: 750; }
.checkout-field input, .checkout-field select {
    width: 100%;
    min-height: 48px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: white;
}
.payment-placeholder { display: flex; align-items: flex-start; gap: 12px; padding: 18px; border: 1px dashed #b9c7d6; border-radius: 13px; background: #f8fafc; }
.payment-placeholder-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--cyan-dark); background: var(--mint); font-weight: 900; }
.payment-placeholder h3 { margin: 0 0 4px; font-size: 14px; }
.payment-placeholder p { margin: 0; color: var(--muted); font-size: 12px; }
.checkout-submit-note { margin: 0; color: var(--muted); text-align: center; font-size: 11px; }

@media (max-width: 1060px) {
    .offer-card { grid-template-columns: 190px minmax(0,1fr); }
    .flow-layout { grid-template-columns: 1fr; }
    .flow-sidebar { order: -1; }
}
@media (max-width: 720px) {
    .package-badge { top: 11px; left: 11px; }
    .offer-section-title { align-items: flex-start; flex-direction: column; gap: 3px; }
    .flow-page { padding-top: 22px; }
    .flow-steps { grid-template-columns: 1fr; }
    .flow-step { padding: 8px 10px; }
    .station-grid, .checkout-grid { grid-template-columns: 1fr; }
    .checkout-field.full { grid-column: auto; }
    .selected-offer { grid-template-columns: 90px minmax(0,1fr); }
}

/* v4: thematisch gruppierte Leistungen, klickbare Schritte und Extras */
.flow-step { text-decoration: none; }
a.flow-step { transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
a.flow-step:hover { transform: translateY(-1px); border-color: #a8c8d3; box-shadow: 0 5px 14px rgba(16,33,63,.07); }
.flow-step.disabled { cursor: default; opacity: .72; }

.benefit-groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
    gap: 9px;
}
.benefit-group {
    min-width: 0;
    padding: 12px;
    border: 1px solid #e0e7ef;
    border-radius: 12px;
    background: #fbfcfe;
}
.benefit-group header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.benefit-group h4 { margin: 0; color: var(--navy); font-size: 12px; line-height: 1.25; }
.benefit-group-icon {
    width: 27px;
    height: 27px;
    flex: 0 0 27px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--cyan-dark);
    background: var(--mint);
    font-size: 12px;
    font-weight: 900;
}
.benefit-group-protection .benefit-group-icon { color: #7e5910; background: #fff5d9; }
.benefit-group-service .benefit-group-icon { color: #315b97; background: #edf4ff; }
.benefit-group ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.benefit-group li { display: flex; align-items: flex-start; gap: 6px; color: #425066; font-size: 11px; font-weight: 750; }
.benefit-group li svg { width: 14px; flex: 0 0 14px; margin-top: 1px; fill: var(--green); }
.benefit-groups.compact { grid-template-columns: repeat(3, minmax(0,1fr)); }

.card-subtitle { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.extras-counter {
    white-space: nowrap;
    padding: 5px 9px;
    border-radius: 999px;
    color: var(--cyan-dark);
    background: var(--mint);
    font-size: 11px;
    font-weight: 850;
}
.extras-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.extra-option {
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 84px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fbfcfe;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
}
.extra-option:hover { transform: translateY(-1px); border-color: #abcfd0; box-shadow: 0 7px 18px rgba(16,33,63,.06); }
.extra-option.is-selected { border-color: var(--cyan); background: #f0fbfa; box-shadow: 0 0 0 3px rgba(10,168,164,.10); }
.extra-option input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.extra-check {
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    border: 1px solid #bec9d6;
    border-radius: 8px;
    color: transparent;
    background: white;
    font-size: 13px;
    font-weight: 900;
}
.extra-option.is-selected .extra-check { color: white; border-color: var(--cyan); background: var(--cyan); }
.extra-copy { min-width: 0; }
.extra-copy strong, .extra-copy small { display: block; }
.extra-copy strong { color: var(--navy); font-size: 13px; }
.extra-copy small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.extra-price { white-space: nowrap; color: var(--navy); font-size: 12px; font-weight: 900; }
.extras-note { margin: 12px 0 0; color: var(--muted); font-size: 11px; }
.empty-inline { display: grid; gap: 3px; padding: 15px; border: 1px dashed #bec9d6; border-radius: 12px; background: #fafbfd; }
.empty-inline strong { color: var(--navy); }
.empty-inline span { color: var(--muted); font-size: 12px; }
.sticky-summary { position: sticky; top: 90px; }
[data-grand-total], [data-extras-total] { transition: opacity .12s ease; }
.checkout-extras { display: grid; gap: 7px; margin-top: 17px; padding: 13px; border-radius: 12px; background: #f6f9fc; }
.checkout-extras h4 { margin: 0 0 3px; color: var(--navy); font-size: 12px; }
.checkout-extras div { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 11px; }
.checkout-extras strong { white-space: nowrap; color: var(--navy); }

@media (max-width: 900px) {
    .benefit-groups.compact { grid-template-columns: 1fr; }
    .extras-grid { grid-template-columns: 1fr; }
    .sticky-summary { position: static; }
}
@media (max-width: 560px) {
    .benefit-groups { grid-template-columns: 1fr; }
    .extra-option { grid-template-columns: 28px minmax(0,1fr); }
    .extra-price { grid-column: 2; }
}

/* v5: Hosted Payment Page */
.checkout-flow-layout { grid-template-columns: minmax(0, 1fr) 360px; }
.test-environment-banner {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: -4px 0 22px;
    padding: 14px 16px;
    border: 1px solid #f2cf8d;
    border-radius: 14px;
    color: #714d0b;
    background: #fff8e8;
    box-shadow: 0 6px 18px rgba(83, 58, 9, .05);
}
.test-environment-banner > span { font-size: 21px; }
.test-environment-banner strong { display: block; margin-bottom: 2px; color: #5f4109; }
.test-environment-banner p { margin: 0; font-size: 12px; }
.form-errors { padding: 14px 16px; border: 1px solid #efb8b8; border-radius: 12px; color: #852d2d; background: #fff4f4; }
.form-errors p { margin: 7px 0 0; }
.form-errors ul { margin: 8px 0 0; padding-left: 19px; }
.form-errors li + li { margin-top: 4px; }
.phone-fields { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 8px; }
.consent-check { display: flex; align-items: flex-start; gap: 10px; color: #4d5c70; font-size: 12px; line-height: 1.45; }
.consent-check input { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 1px; accent-color: var(--cyan); }
.payment-start-button { width: 100%; }
.button-link { padding: 0; border: 0; background: none; cursor: pointer; }
.customer-summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.customer-summary-grid div { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--border); border-radius: 11px; background: #fafbfd; }
.customer-summary-grid span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.customer-summary-grid strong { color: var(--navy); font-size: 13px; overflow-wrap: anywhere; }
.payment-security-badge { white-space: nowrap; padding: 6px 10px; border-radius: 999px; color: #176447; background: #eaf8f1; font-size: 10px; font-weight: 900; }
.payment-status { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: #f8fafc; }
.payment-status-indicator { position: relative; width: 11px; height: 11px; flex: 0 0 11px; margin-top: 4px; border-radius: 50%; background: #94a3b8; }
.payment-status strong { display: block; margin-bottom: 2px; color: var(--navy); font-size: 13px; }
.payment-status p { margin: 0; color: var(--muted); font-size: 11px; }
.payment-status.is-loading .payment-status-indicator,
.payment-status.is-processing .payment-status-indicator { background: var(--cyan); animation: paymentPulse 1.5s ease-out infinite; }
.payment-status.is-ready .payment-status-indicator,
.payment-status.is-success .payment-status-indicator { background: var(--green); }
.payment-status.is-error .payment-status-indicator { background: #d64545; }
.payment-status.is-warning .payment-status-indicator { background: #d8951b; }
.payment-status.is-error { border-color: #efb8b8; background: #fff6f6; }
.payment-status.is-warning { border-color: #f0d09a; background: #fffaf0; }
.payment-status.is-success { border-color: #b9dfce; background: #f1fbf6; }
@keyframes paymentPulse { 0% { box-shadow: 0 0 0 0 rgba(10,168,164,.34); } 70% { box-shadow: 0 0 0 8px rgba(10,168,164,0); } 100% { box-shadow: 0 0 0 0 rgba(10,168,164,0); } }
.payment-frame-shell { position: relative; min-height: 280px; border: 1px solid #d6dee8; border-radius: 14px; background: white; overflow: hidden; }
.payment-frame { display: block; width: 100%; min-height: 330px; border: 0; background: white; }
.payment-frame-loader { position: absolute; z-index: 3; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; color: var(--muted); background: rgba(248,250,252,.96); }
.payment-frame-loader[hidden] { display: none; }
.payment-frame-loader span, .payment-auth-spinner { width: 31px; height: 31px; border: 3px solid #dbe5eb; border-top-color: var(--cyan); border-radius: 50%; animation: paymentSpin .8s linear infinite; }
.payment-frame-loader p { margin: 0; font-size: 12px; }
@keyframes paymentSpin { to { transform: rotate(360deg); } }
.payment-auth-overlay { position: absolute; z-index: 4; inset: 0; display: grid; place-content: center; justify-items: center; gap: 9px; padding: 24px; text-align: center; color: var(--navy); background: rgba(255,255,255,.94); }
.payment-auth-overlay[hidden] { display: none; }
.payment-auth-overlay p { max-width: 360px; margin: 0; color: var(--muted); font-size: 12px; }
.payment-test-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 13px 0; }
.payment-test-cards > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 8px; align-items: center; padding: 10px 12px; border: 1px dashed #d7bd84; border-radius: 11px; background: #fffaf0; }
.payment-test-cards span { grid-column: 1 / -1; color: #75520c; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.payment-test-cards code { color: var(--navy); font-size: 12px; font-weight: 800; }
.payment-test-cards button { padding: 0; border: 0; color: var(--cyan-dark); background: none; cursor: pointer; font-size: 10px; font-weight: 900; }
.booking-consent { margin: 14px 0; padding: 12px; border: 1px solid var(--border); border-radius: 11px; background: #fafbfd; }
.payment-actions { display: grid; grid-template-columns: 1fr 1.45fr; gap: 10px; }
.payment-actions .button { width: 100%; }
.payment-actions .button:disabled { cursor: not-allowed; opacity: .5; }
.payment-event-log { margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--border); }
.payment-event-log h3 { margin: 0 0 8px; color: var(--navy); font-size: 12px; }
.payment-event-log ol { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.payment-event-log li { display: grid; grid-template-columns: 62px minmax(0,1fr); gap: 8px; color: #536175; font-size: 10px; }
.payment-event-log time { color: #8a96a6; font-variant-numeric: tabular-nums; }
.payment-parameter-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 12px; }
.payment-parameter-grid div { display: grid; gap: 3px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: #fafbfd; }
.payment-parameter-grid span { color: var(--muted); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.payment-parameter-grid strong { color: var(--navy); font-size: 11px; overflow-wrap: anywhere; }
.payment-json-preview { max-height: 430px; margin: 0; padding: 16px; overflow: auto; border-radius: 12px; color: #d7e9f1; background: #112237; font-size: 10px; line-height: 1.55; white-space: pre; }
.payment-price-note { display: grid; gap: 4px; margin: -5px 0 17px; padding: 12px; border-radius: 11px; color: #245747; background: #effaf5; }
.payment-price-note span { font-size: 10px; font-weight: 850; text-transform: uppercase; }
.payment-price-note strong { color: #114f3a; font-size: 17px; }
.payment-price-note small { color: #4f7266; font-size: 10px; }
.checkout-extras { display: grid; gap: 7px; margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--border); }
.checkout-extras h4 { margin: 0 0 2px; color: var(--navy); font-size: 12px; }
.checkout-extras div { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 11px; }
.checkout-extras strong { color: var(--navy); white-space: nowrap; }

@media (max-width: 1060px) {
    .checkout-flow-layout { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .customer-summary-grid, .payment-test-cards, .payment-actions, .payment-parameter-grid { grid-template-columns: 1fr; }
    .phone-fields { grid-column: 1 / -1; }
    .payment-frame { min-height: 390px; }
    .payment-security-badge { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
    .payment-status-indicator, .payment-frame-loader span, .payment-auth-spinner { animation: none !important; }
}


/* HPP diagnostics */
.payment-diagnostics {
    margin: 14px 0 16px;
    border: 1px solid var(--border, #d7e0ec);
    border-radius: 12px;
    background: #f8fbff;
}
.payment-diagnostics summary {
    cursor: pointer;
    padding: 12px 14px;
    font-weight: 750;
    color: #17345f;
}
.payment-diagnostics[open] summary {
    border-bottom: 1px solid var(--border, #d7e0ec);
}
.payment-diagnostics-grid {
    display: grid;
    gap: 10px;
    padding: 14px;
}
.payment-diagnostics-grid div {
    display: grid;
    gap: 4px;
}
.payment-diagnostics-grid span {
    font-size: .76rem;
    color: #65758d;
}
.payment-diagnostics-grid code {
    display: block;
    overflow-wrap: anywhere;
    padding: 9px 10px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #dce5f0;
    color: #183153;
}
.payment-diagnostics > p {
    margin: 0;
    padding: 0 14px 12px;
    color: #586a82;
    line-height: 1.5;
}
.payment-diagnostic-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0 14px 14px;
}
.payment-diagnostic-actions a,
.payment-diagnostic-actions button {
    border: 1px solid #bccbe0;
    border-radius: 9px;
    background: #fff;
    color: #0f5e71;
    padding: 8px 11px;
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}


/* v5.4: Hinweise zur echten ConsumerIP und bevorzugten Testkarte */
.payment-ip-warning {
    display: grid;
    gap: 4px;
    margin: 12px 0;
    padding: 11px 13px;
    border: 1px solid #f0d09a;
    border-radius: 11px;
    background: #fffaf0;
    color: #6d4b08;
    font-size: 12px;
    line-height: 1.5;
}
.payment-ip-warning strong { color: var(--navy); }
.payment-test-cards > .is-recommended {
    border-style: solid;
    border-color: #79d8cf;
    background: #f1fffc;
}
.payment-test-cards > .is-recommended span { color: var(--cyan-dark); }

/* Dynamic availability/tariff/payment labels (v5.5) */
.availability.is-on-request {
    color: #9a5a08;
    background: #fff4df;
}
.availability.is-on-request span { background: #d88412; }
.availability.is-on-request span::after { border-color: rgba(216,132,18,.45); }
.tariff-code {
    align-self: flex-end;
    margin-bottom: 8px;
    padding: 4px 8px;
    border-radius: 999px;
    color: var(--cyan-dark);
    background: var(--mint);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.payment-type-label {
    display: inline-block;
    margin-left: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #edf2f7;
    color: #526075;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

/* v5.6: verpflichtende Extras und Buchungsanfragen */
.extra-option.is-required {
    cursor: default;
    border-style: solid;
    background: linear-gradient(135deg, #f0fbfa, #f8fcff);
}
.extra-option.is-required .extra-copy strong::after {
    content: "Pflicht";
    display: inline-flex;
    margin-left: .45rem;
    padding: .12rem .42rem;
    border-radius: 999px;
    background: #dff6f3;
    color: #006d68;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .02em;
    vertical-align: middle;
}
.booking-request-banner {
    border-color: #efd39a;
    background: #fffaf0;
}

/* v5.9: ConsumerIP source and booking confirmation */
.payment-ip-success {
    display: grid;
    gap: 4px;
    margin: 12px 0;
    padding: 11px 13px;
    border: 1px solid #9bd6bf;
    border-radius: 11px;
    background: #f1fbf6;
    color: #285f4a;
    font-size: 12px;
    line-height: 1.5;
}
.payment-ip-success strong { color: #124f39; }
.payment-ip-success code { overflow-wrap: anywhere; color: var(--navy); }

.confirmation-page { padding-bottom: 70px; }
.confirmation-hero {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 22px 0 24px;
    padding: 28px;
    border: 1px solid #b8dfcf;
    border-radius: var(--radius);
    background: linear-gradient(135deg, #effbf6, #f8fffd);
    box-shadow: 0 12px 34px rgba(20,133,95,.09);
}
.confirmation-hero h1 { margin-bottom: 7px; font-size: clamp(28px, 4vw, 42px); }
.confirmation-hero p:last-child { max-width: 760px; margin-bottom: 0; color: #4e6c61; }
.confirmation-check {
    flex: 0 0 64px;
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--green);
    box-shadow: 0 0 0 10px rgba(20,133,95,.1);
    font-size: 34px;
    font-weight: 900;
}
.confirmation-layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 22px; align-items: start; }
.confirmation-reference-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.confirmation-reference-grid > div { display: grid; gap: 5px; padding: 14px; border: 1px solid var(--border); border-radius: 11px; background: #fafbfd; }
.confirmation-reference-grid span { color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.confirmation-reference-grid strong { color: var(--navy); font-size: 14px; overflow-wrap: anywhere; }
.confirmation-reference-grid .confirmation-primary-reference { grid-column: 1 / -1; border-color: #8bd2c7; background: #f1fffc; }
.confirmation-reference-grid .confirmation-primary-reference strong { font-size: 22px; color: var(--cyan-dark); }
.confirmation-vehicle { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 22px; align-items: center; }
.confirmation-vehicle img { width: 100%; height: 125px; object-fit: contain; filter: drop-shadow(0 10px 10px rgba(16,33,63,.16)); }
.confirmation-vehicle h3 { margin: 7px 0 3px; color: var(--navy); font-size: 23px; }
.confirmation-vehicle p, .confirmation-vehicle small { margin: 0; color: var(--muted); }
.confirmation-trip-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.confirmation-trip-grid article { padding: 17px; border: 1px solid var(--border); border-radius: 12px; background: #fafbfd; }
.confirmation-trip-grid article > span { color: var(--cyan-dark); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.confirmation-trip-grid h3 { margin: 7px 0 5px; color: var(--navy); font-size: 17px; }
.confirmation-trip-grid p { margin-bottom: 4px; font-weight: 800; }
.confirmation-trip-grid small { color: var(--muted); }
.confirmation-extras { display: grid; gap: 9px; }
.confirmation-extras > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 14px; padding: 11px 0; border-bottom: 1px solid var(--border); }
.confirmation-extras > div:last-child { border-bottom: 0; }
.confirmation-extras span { font-weight: 750; }
.confirmation-extras strong { color: var(--navy); }
.confirmation-extras small { grid-column: 1 / -1; color: var(--muted); }
.confirmation-summary-total { display: grid; gap: 4px; margin-bottom: 18px; padding: 15px; border-radius: 12px; color: #154f3a; background: #effaf5; }
.confirmation-summary-total span { font-size: 10px; font-weight: 900; text-transform: uppercase; }
.confirmation-summary-total strong { color: #104b37; font-size: 25px; }
.confirmation-summary-total small { color: #5c776d; }
.confirmation-security-note { margin-top: 18px; padding: 13px; border: 1px solid #b8dfcf; border-radius: 11px; background: #f5fcf8; }
.confirmation-security-note strong { color: #15543d; font-size: 12px; }
.confirmation-security-note p { margin: 4px 0 0; color: #5b746a; font-size: 11px; }

@media (max-width: 980px) {
    .confirmation-layout { grid-template-columns: 1fr; }
    .confirmation-summary { position: static; }
}
@media (max-width: 680px) {
    .confirmation-hero { align-items: flex-start; padding: 20px; }
    .confirmation-check { flex-basis: 48px; width: 48px; height: 48px; font-size: 25px; box-shadow: 0 0 0 7px rgba(20,133,95,.1); }
    .confirmation-reference-grid, .confirmation-trip-grid { grid-template-columns: 1fr; }
    .confirmation-reference-grid .confirmation-primary-reference { grid-column: auto; }
    .confirmation-vehicle { grid-template-columns: 1fr; text-align: center; }
}

/* v5.10 – polished public UI, responsive flow and mail confirmation */
:root {
    --shadow-soft: 0 10px 30px rgba(16, 33, 63, .075);
    --focus-ring: 0 0 0 4px rgba(10, 168, 164, .16);
}
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:focus-visible { outline: 3px solid rgba(10,168,164,.45); outline-offset: 3px; }
.button, .flow-step, .flow-card, .offer-card, .search-card { -webkit-tap-highlight-color: transparent; }
.content-grid.without-sidebar { grid-template-columns: minmax(0, 1fr); }
.content-grid.without-sidebar .results-section { width: 100%; }
.content-grid.without-sidebar .offer-card { grid-template-columns: 230px minmax(0,1fr) 230px; }
.flow-card, .offer-card, .info-card, .meta-card { box-shadow: var(--shadow-soft); }
.flow-card-header { min-height: 66px; }
.flow-sidebar { min-width: 0; }
.sticky-summary { top: 94px; }

.flow-steps-four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: none;
    width: 100%;
}
.flow-steps-four .flow-step { min-width: 0; justify-content: flex-start; }

.confirmation-mail-note {
    margin-top: 16px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: #f8fafc;
}
.confirmation-mail-note strong { display: block; color: var(--navy); font-size: 12px; }
.confirmation-mail-note p { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.confirmation-mail-note.is-success { border-color: #a8ddc7; background: #f0fbf6; }
.confirmation-mail-note.is-success strong { color: #15543d; }
.confirmation-mail-note.is-warning { border-color: #efcf98; background: #fffaf0; }
.confirmation-mail-note.is-warning strong { color: #7d4d08; }

@media (max-width: 1120px) {
    .container { width: min(100% - 28px, 1100px); }
    .content-grid, .content-grid.without-sidebar { grid-template-columns: 1fr; }
    .sidebar { padding-top: 0; grid-template-columns: repeat(2, minmax(0,1fr)); }
    .offer-card, .content-grid.without-sidebar .offer-card { grid-template-columns: 190px minmax(0,1fr); }
    .offer-price { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; border-top: 1px solid var(--border); border-left: 0; text-align: left; }
    .offer-price .price-label { margin-left: auto; }
    .offer-price .tax-note { margin: 0; }
    .offer-price .select-offer-form { min-width: 190px; }
    .offer-price .text-link { padding: 8px 0; }
    .tariff-code { align-self: center; margin: 0; }
}

@media (max-width: 860px) {
    .header-inner { min-height: 64px; }
    .brand-mark { width: 40px; height: 40px; }
    .brand-mark svg { width: 26px; }
    .mode-badge { padding: 7px 10px; font-size: 11px; }
    .hero { padding: 40px 0 68px; }
    .hero-copy { margin-bottom: 22px; }
    .form-grid { grid-template-columns: 1fr 1fr; }
    .field-location { grid-column: 1 / -1; }
    .search-button { width: 100%; }
    .confirmation-layout, .flow-layout, .checkout-flow-layout { grid-template-columns: 1fr; }
    .flow-sidebar { order: 0; }
    .sticky-summary { position: static; }
    .confirmation-reference-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .confirmation-reference-grid .confirmation-primary-reference { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    .container { width: min(100% - 20px, 680px); }
    .site-header { position: relative; }
    .header-inner { gap: 10px; }
    .brand { gap: 9px; }
    .brand strong { font-size: 15px; }
    .brand small { font-size: 9px; }
    .mode-badge { max-width: 46%; text-align: right; line-height: 1.25; }
    h1 { font-size: clamp(30px, 10vw, 40px); }
    .hero-copy > p:last-child { font-size: 15px; }
    .search-card { padding: 14px; border-radius: 14px; }
    .form-grid { grid-template-columns: 1fr; }
    .field-location, .checkout-field.full, .phone-fields { grid-column: auto; }
    .date-time { display: grid; grid-template-columns: 1fr 110px; }
    .content-grid { margin-top: -30px; }
    .results-head { align-items: flex-start; flex-direction: column; color: var(--navy); }
    .trip-summary { justify-content: flex-start; }
    .trip-summary span { color: #526075; background: white; border-color: var(--border); }
    .offer-card, .content-grid.without-sidebar .offer-card { grid-template-columns: 1fr; }
    .vehicle-media { min-height: 205px; border-right: 0; border-bottom: 1px solid var(--border); }
    .vehicle-media img { max-width: 310px; }
    .offer-main { padding: 20px 16px; }
    .offer-title-row { flex-direction: column; }
    .offer-title-row .availability { align-self: flex-start; }
    .benefit-groups, .detail-card-grid { grid-template-columns: 1fr; }
    .offer-price { grid-column: auto; display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding: 18px 16px; }
    .offer-price .price-label { margin: 0; }
    .offer-price strong { text-align: right; font-size: 25px; }
    .offer-price .per-day, .offer-price .tax-note { grid-column: 1 / -1; }
    .offer-price .select-offer-form, .offer-price .text-link, .offer-price .reference, .offer-price .tariff-code { grid-column: 1 / -1; width: 100%; }
    .offer-price .tariff-code { justify-self: start; width: auto; }
    .sidebar { grid-template-columns: 1fr; }

    .flow-page { padding: 20px 0 50px; }
    .flow-steps, .flow-steps-four {
        display: flex;
        gap: 8px;
        max-width: 100%;
        margin: 0 -2px 22px;
        padding: 2px 2px 8px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
    }
    .flow-step, .flow-steps-four .flow-step {
        flex: 0 0 auto;
        min-width: 168px;
        justify-content: flex-start;
        scroll-snap-align: start;
        white-space: nowrap;
    }
    .flow-header h1 { font-size: 30px; }
    .flow-card-header { align-items: flex-start; padding: 16px; }
    .flow-card-body { padding: 16px; }
    .station-grid, .checkout-grid, .customer-summary-grid, .confirmation-trip-grid, .confirmation-reference-grid { grid-template-columns: 1fr; }
    .confirmation-reference-grid .confirmation-primary-reference { grid-column: auto; }
    .confirmation-hero { gap: 16px; padding: 20px 17px; }
    .confirmation-check { flex: 0 0 46px; width: 46px; height: 46px; font-size: 25px; }
    .confirmation-vehicle { grid-template-columns: 1fr; text-align: center; }
    .confirmation-vehicle img { max-width: 300px; margin: 0 auto; }
    .payment-frame { min-height: 330px; }
    .payment-actions { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
    .container { width: calc(100% - 14px); }
    .header-inner { min-height: 58px; }
    .brand-mark { width: 36px; height: 36px; border-radius: 10px; }
    .brand small { display: none; }
    .mode-badge { padding: 6px 8px; }
    .hero { padding-top: 30px; }
    .search-card, .flow-card, .offer-card, .confirmation-hero { border-radius: 12px; }
    .date-time { grid-template-columns: 1fr 96px; }
    .flow-step, .flow-steps-four .flow-step { min-width: 154px; font-size: 11px; }
    .confirmation-hero { flex-direction: column; }
    .confirmation-hero h1 { font-size: 29px; }
    .confirmation-reference-grid .confirmation-primary-reference strong { font-size: 19px; }
    .price-summary div { align-items: flex-start; }
    .price-summary strong { text-align: right; }
}

/* v5.11: produktionsreife Startseite, eigene Date-/Time-Picker und Angebotsfilter */
:root {
    --surface-soft: #f7f9fc;
    --surface-tint: #edf8f7;
    --focus-ring: 0 0 0 4px rgba(10, 168, 164, .14);
}

.container { width: min(1320px, calc(100% - 40px)); }
.site-header { backdrop-filter: saturate(130%) blur(10px); }
.header-inner { min-height: 70px; }
.header-inner:has(.brand:only-child) { justify-content: flex-start; }
.brand-mark { box-shadow: 0 8px 22px rgba(10,168,164,.24); }

.hero {
    position: relative;
    overflow: visible;
    padding: 62px 0 76px;
    background:
        radial-gradient(circle at 86% 16%, rgba(100,226,220,.17), transparent 23%),
        radial-gradient(circle at 13% 90%, rgba(28,109,137,.32), transparent 28%),
        linear-gradient(132deg, #0d1f3c 0%, #142d50 60%, #0c5265 100%);
}
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .12;
    background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(to bottom, black, transparent 78%);
}
.hero-container { position: relative; z-index: 1; }
.hero-copy { max-width: 880px; margin-bottom: 28px; }
.hero-home .hero-copy h1 { max-width: 850px; }
.hero-copy > p:last-of-type { max-width: 760px; }
.hero-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin: 23px 0 0;
    padding: 0;
    list-style: none;
    color: #d5e2ef;
    font-size: 13px;
    font-weight: 700;
}
.hero-points li { display: inline-flex; align-items: center; gap: 7px; }
.hero-points span { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; color: #0c514f; background: #70e1d4; font-size: 11px; }
.hero-results { padding-top: 38px; padding-bottom: 70px; }
.hero-results .hero-copy { margin-bottom: 20px; }
.hero-results h1 { font-size: clamp(31px, 4vw, 45px); }

.search-card {
    position: relative;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.36);
    border-radius: 20px;
    box-shadow: 0 24px 70px rgba(5,18,39,.28);
}
.search-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 17px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e8edf3;
}
.search-card-heading > div { display: grid; gap: 2px; }
.search-card-kicker { color: var(--cyan-dark); font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.search-card-heading strong { color: var(--navy); font-size: 17px; }
.secure-search-note { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px; color: #255849; background: #edf9f4; font-size: 11px; font-weight: 850; white-space: nowrap; }
.secure-search-note > span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); font-size: 10px; }
.search-form-grid {
    grid-template-columns: minmax(230px, 1.75fr) minmax(205px, 1.35fr) minmax(205px, 1.35fr) minmax(105px, .62fr) minmax(88px, .52fr) minmax(172px, .95fr);
    gap: 12px;
    align-items: start;
}
.field { min-width: 0; }
.field > span:first-child { min-height: 18px; margin-bottom: 7px; color: #435269; font-size: 11px; letter-spacing: .01em; }
.input-wrap, .field-age select, .field-passengers select, .picker-custom {
    min-height: 58px;
    border-radius: 12px;
    border-color: #ccd6e3;
    box-shadow: 0 1px 1px rgba(16,33,63,.02);
}
.input-wrap:hover, .field-age select:hover, .field-passengers select:hover, .picker-custom:hover { border-color: #9db2c7; }
.input-wrap:focus-within, .date-time-picker.is-open .picker-custom, .field-age select:focus, .field-passengers select:focus { outline: 0; border-color: var(--cyan); box-shadow: var(--focus-ring); }
.field-age select, .field-passengers select { width: 100%; padding: 0 12px; background: #fff; }
.field-help { display: block; min-height: 16px; margin: 6px 0 0 2px; color: #778396; font-size: 10px; }
.location-code-badge { right: 10px; }
.search-button { min-height: 58px; margin-top: 25px; border-radius: 12px; font-size: 14px; }
.search-button:focus-visible, .button:focus-visible, .picker-trigger:focus-visible, .filter-choice input:focus-visible + span, .filter-check input:focus-visible + span { outline: 0; box-shadow: var(--focus-ring); }

/* Progressive-enhancement fallback: native inputs remain available without JS. */
.picker-custom { display: none; }
html:not(.js) .date-time-picker { display: grid; grid-template-columns: minmax(0,1fr) 105px; overflow: hidden; }
html:not(.js) .date-time-picker .picker-native { min-height: 56px; padding: 0 9px; }
html:not(.js) .date-time-picker .picker-native + .picker-native { border-left: 1px solid var(--border); }
.js .date-time-picker {
    position: relative;
    display: block;
    min-height: 58px;
    border: 0;
    background: transparent;
    overflow: visible;
}
.js .date-time-picker .picker-native {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
}
.js .picker-custom {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(88px,.68fr);
    overflow: hidden;
    background: #fff;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.picker-trigger {
    min-width: 0;
    min-height: 56px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 11px;
    border: 0;
    color: var(--text);
    background: transparent;
    text-align: left;
}
.picker-trigger + .picker-trigger { border-left: 1px solid #e1e7ef; }
.picker-trigger:hover { background: #f7fafc; }
.picker-trigger svg { flex: 0 0 18px; width: 18px; fill: var(--cyan-dark); }
.picker-trigger span { min-width: 0; display: grid; }
.picker-trigger small { color: #7a8799; font-size: 9px; font-weight: 700; }
.picker-trigger strong { overflow: hidden; color: var(--navy); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.picker-popover {
    position: absolute;
    z-index: 80;
    top: calc(100% + 10px);
    left: 0;
    width: min(370px, calc(100vw - 34px));
    padding: 13px;
    border: 1px solid #cfd9e5;
    border-radius: 16px;
    color: var(--text);
    background: white;
    box-shadow: 0 24px 65px rgba(16,33,63,.22);
}
.date-time-picker[data-picker-align="end"] .picker-popover { right: 0; left: auto; }
.picker-popover[hidden], .picker-popover [hidden] { display: none !important; }
.picker-popover-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 1px 2px 10px; }
.picker-popover-top strong { color: var(--navy); font-size: 14px; }
.picker-close { width: 31px; height: 31px; border: 0; border-radius: 9px; color: #526075; background: #f1f4f8; font-size: 21px; line-height: 1; }
.picker-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 12px; padding: 4px; border-radius: 11px; background: #eef3f7; }
.picker-tabs button { min-height: 34px; border: 0; border-radius: 8px; color: #5b687b; background: transparent; font-size: 11px; font-weight: 800; }
.picker-tabs button.is-active { color: var(--navy); background: white; box-shadow: 0 3px 10px rgba(16,33,63,.08); }
.calendar-header { display: grid; grid-template-columns: 36px 1fr 36px; align-items: center; margin-bottom: 8px; }
.calendar-header strong { text-align: center; color: var(--navy); font-size: 13px; text-transform: capitalize; }
.calendar-header button { height: 34px; border: 1px solid #e0e6ee; border-radius: 9px; color: var(--navy); background: #fff; font-size: 22px; line-height: 1; }
.calendar-header button:hover { border-color: #9bcac8; background: var(--mint); }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.calendar-weekdays { margin-bottom: 4px; }
.calendar-weekdays span { color: #8a95a5; text-align: center; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.calendar-day { aspect-ratio: 1; min-width: 0; border: 0; border-radius: 9px; color: #344156; background: transparent; font-size: 11px; font-weight: 750; }
.calendar-day:hover:not(:disabled) { color: var(--cyan-dark); background: var(--mint); }
.calendar-day.is-outside { color: #afb8c4; }
.calendar-day.is-today { box-shadow: inset 0 0 0 1px #8acbc8; }
.calendar-day.is-selected { color: white; background: var(--cyan); box-shadow: 0 6px 13px rgba(10,168,164,.23); }
.calendar-day:disabled { color: #d6dce4; cursor: not-allowed; }
.calendar-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #edf0f4; }
.calendar-footer button { min-height: 34px; padding: 0 11px; border: 0; border-radius: 9px; color: var(--cyan-dark); background: var(--mint); font-size: 10px; font-weight: 850; }
.calendar-footer .calendar-continue { color: white; background: var(--cyan); }
.time-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; max-height: 276px; padding: 2px; overflow-y: auto; scrollbar-width: thin; }
.time-option { min-height: 39px; border: 1px solid #dce4ed; border-radius: 9px; color: #405067; background: #fff; font-size: 11px; font-weight: 800; }
.time-option:hover { border-color: #8bc9c7; color: var(--cyan-dark); background: var(--mint); }
.time-option.is-selected { color: white; border-color: var(--cyan); background: var(--cyan); }
.date-picker-backdrop { display: none; }

/* Public landing page content */
.trust-strip { position: relative; z-index: 2; margin-top: -34px; }
.trust-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: white;
    box-shadow: 0 14px 38px rgba(16,33,63,.09);
}
.trust-grid article { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 17px 20px; }
.trust-grid article + article { border-left: 1px solid #e7ebf1; }
.trust-grid article > span { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--cyan-dark); background: var(--mint); font-weight: 900; }
.trust-grid strong, .trust-grid small { display: block; }
.trust-grid strong { color: var(--navy); font-size: 12px; }
.trust-grid small { margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.landing-section { padding: 74px 0; }
.landing-section + .landing-section { border-top: 1px solid #e6ebf1; }
.landing-heading { max-width: 720px; margin: 0 auto 30px; text-align: center; }
.landing-heading h2 { margin-bottom: 10px; color: var(--navy); font-size: clamp(27px, 3vw, 38px); letter-spacing: -.025em; }
.landing-heading > p:last-child { color: var(--muted); }
.compact-heading { margin-bottom: 25px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.feature-card { padding: 26px; border: 1px solid var(--border); border-radius: 17px; background: white; box-shadow: 0 8px 24px rgba(16,33,63,.05); }
.feature-icon { width: 45px; height: 45px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 13px; color: var(--cyan-dark); background: var(--mint); font-size: 19px; font-weight: 900; }
.feature-card h3 { margin-bottom: 8px; color: var(--navy); font-size: 18px; }
.feature-card p { margin: 0; color: var(--muted); font-size: 13px; }
.landing-steps-section { background: white; }
.booking-steps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: steps; }
.booking-steps li { position: relative; display: flex; gap: 12px; padding: 20px; border: 1px solid var(--border); border-radius: 15px; background: #fafbfd; }
.booking-steps li > span { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--navy); font-size: 12px; font-weight: 900; }
.booking-steps strong { display: block; margin-bottom: 5px; color: var(--navy); font-size: 13px; }
.booking-steps p { margin: 0; color: var(--muted); font-size: 11px; }
.faq-layout { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(0,1.2fr); gap: 54px; align-items: start; }
.faq-layout .landing-heading { margin: 0; text-align: left; }
.faq-list { display: grid; gap: 10px; }
.faq-list details { border: 1px solid var(--border); border-radius: 13px; background: white; }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 18px; color: var(--navy); cursor: pointer; list-style: none; font-size: 13px; font-weight: 850; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: var(--cyan-dark); font-size: 20px; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { margin: 0; padding: 0 18px 18px; color: var(--muted); font-size: 12px; }

/* Results and filters */
.results-page-grid { grid-template-columns: 1fr; max-width: 1320px; }
.results-page-grid .results-section { min-width: 0; }
.results-page-grid .sidebar { padding-top: 0; grid-template-columns: repeat(2, minmax(0,1fr)); }
.offer-explorer { min-width: 0; }
.offer-toolbar {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 12px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: white;
    box-shadow: 0 7px 20px rgba(16,33,63,.05);
}
.filter-toggle { display: none; min-height: 42px; }
.filter-toggle svg { width: 18px; fill: currentColor; }
.filter-count { min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 999px; color: white; background: var(--cyan); font-size: 9px; }
.offer-toolbar-summary { min-width: 0; display: grid; }
.offer-toolbar-summary strong { color: var(--navy); font-size: 13px; }
.offer-toolbar-summary small { color: var(--muted); font-size: 10px; }
.sort-control { display: flex; align-items: center; gap: 9px; margin-left: auto; }
.sort-control span { color: var(--muted); font-size: 10px; font-weight: 800; }
.sort-control select { min-height: 40px; padding: 0 34px 0 11px; border: 1px solid var(--border); border-radius: 10px; background: #fff; font-size: 11px; font-weight: 750; }
.active-filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.active-filter-bar[hidden] { display: none; }
.active-filter-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.active-filter-chip { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 0 9px; border: 1px solid #abd9d6; border-radius: 999px; color: var(--cyan-dark); background: #effaf9; font-size: 10px; font-weight: 800; }
.active-filter-chip span { font-size: 15px; line-height: 1; }
.active-filter-bar > button { border: 0; color: var(--cyan-dark); background: transparent; font-size: 10px; font-weight: 850; }
.offers-layout { display: grid; grid-template-columns: 275px minmax(0,1fr); gap: 17px; align-items: start; }
.offers-column { min-width: 0; }
.filter-panel {
    position: sticky;
    top: 88px;
    display: grid;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: white;
    box-shadow: 0 8px 24px rgba(16,33,63,.06);
}
.filter-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 18px 13px; }
.filter-panel-header h3 { margin: 1px 0 0; color: var(--navy); font-size: 18px; }
.filter-kicker { color: var(--cyan-dark); font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.filter-close { display: none; width: 34px; height: 34px; border: 0; border-radius: 10px; color: #506078; background: #eef2f6; font-size: 22px; }
.filter-group { margin: 0; padding: 15px 18px; border: 0; border-top: 1px solid #edf0f4; }
.filter-group legend, .filter-group-title > span, .filter-select-label > span { color: #405067; font-size: 11px; font-weight: 850; }
.filter-group-collapsible { padding: 0; }
.filter-group-collapsible > summary {
    min-height: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 18px;
    color: #405067;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
    list-style: none;
}
.filter-group-collapsible > summary::-webkit-details-marker { display: none; }
.filter-group-collapsible > .filter-price-list { margin: 0; padding: 0 18px 15px; }
.filter-group-chevron { color: #708096; font-size: 16px; line-height: 1; transition: transform .18s ease; }
.filter-group-collapsible[open] .filter-group-chevron { transform: rotate(180deg); }
.filter-group-collapsible > summary:hover { background: #f7f9fb; }
.filter-group-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.filter-group-title output { color: var(--cyan-dark); font-size: 11px; font-weight: 900; }
.price-range { width: 100%; accent-color: var(--cyan); }
.range-scale { display: flex; justify-content: space-between; margin-top: 5px; color: #8994a4; font-size: 9px; }
.filter-select-label { display: grid; gap: 7px; }
.filter-select-label select { width: 100%; min-height: 41px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; background: white; font-size: 11px; }
.filter-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 10px; }
.filter-choice { position: relative; }
.filter-choice input { position: absolute; opacity: 0; pointer-events: none; }
.filter-choice span { min-height: 38px; display: grid; place-items: center; padding: 0 7px; border: 1px solid var(--border); border-radius: 9px; color: #526075; background: white; font-size: 10px; font-weight: 500; }
.filter-choice input:checked + span { color: var(--cyan-dark); border-color: #72c6c2; background: var(--mint); }
.filter-choice-stack { display: grid; gap: 9px; margin-top: 11px; }
.filter-check { display: flex; align-items: center; gap: 9px; color: #4d5b70; font-size: 10px; font-weight: 500; }
.filter-check input { width: 16px; height: 16px; accent-color: var(--cyan); }
.filter-select-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.filter-price-list { display: grid; gap: 2px; margin-top: 10px; }
.filter-price-option {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 35px;
    margin: 0 -6px;
    padding: 5px 6px;
    border-radius: 8px;
    color: #263950;
    cursor: pointer;
    transition: background .15s ease;
}
.filter-price-option:hover { background: #f5f9fa; }
.filter-option-main { min-width: 0; display: flex; align-items: center; gap: 8px; }
.filter-option-main input { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--cyan); }
.filter-option-main span { min-width: 0; font-size: 10.5px; font-weight: 500; line-height: 1.25; }
.filter-price-option small { flex: 0 0 auto; color: #68768a; font-size: 9.5px; font-weight: 500; white-space: nowrap; }
.filter-price-option:has(input:checked) { color: var(--cyan-dark); background: var(--mint); }
.filter-price-option:has(input:checked) small { color: var(--cyan-dark); }
.filter-price-option.is-unavailable { opacity: .48; cursor: default; }
.filter-price-option.is-unavailable:hover { background: transparent; }
.filter-group > .filter-price-option { margin-top: 3px; }

.filter-switch { display: flex; align-items: center; gap: 9px; color: #4d5b70; font-size: 10px; font-weight: 500; cursor: pointer; }
.filter-switch input { position: absolute; opacity: 0; }
.filter-switch-track { position: relative; width: 35px; height: 20px; border-radius: 999px; background: #cdd6e1; transition: background .15s ease; }
.filter-switch-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: white; box-shadow: 0 2px 5px rgba(16,33,63,.18); transition: transform .15s ease; }
.filter-switch input:checked + .filter-switch-track { background: var(--cyan); }
.filter-switch input:checked + .filter-switch-track::after { transform: translateX(15px); }
.filter-reset { margin: 0 18px 17px; width: calc(100% - 36px); min-height: 40px; font-size: 10px; }
.filter-backdrop { display: none; }
.offer-card[hidden] { display: none !important; }
.filter-empty-state { padding: 50px 24px; border: 1px dashed #c7d2de; border-radius: 15px; text-align: center; background: rgba(255,255,255,.72); }
.filter-empty-state > span { width: 50px; height: 50px; display: grid; place-items: center; margin: 0 auto 13px; border-radius: 50%; color: var(--cyan-dark); background: var(--mint); font-size: 24px; }
.filter-empty-state h3 { margin-bottom: 5px; color: var(--navy); }
.filter-empty-state p { color: var(--muted); font-size: 12px; }
.filter-empty-state .button { margin-top: 8px; }
.offer-card { transition: transform .18s ease, box-shadow .18s ease; }
.offer-card:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(16,33,63,.10); }

@media (max-width: 1220px) {
    .container { width: min(100% - 30px, 1180px); }
    .search-form-grid { grid-template-columns: minmax(220px,1.65fr) minmax(190px,1.3fr) minmax(190px,1.3fr) minmax(95px,.62fr) minmax(82px,.5fr) minmax(155px,.9fr); }
    .offers-layout { grid-template-columns: 255px minmax(0,1fr); }
}

@media (max-width: 1060px) {
    .search-form-grid { grid-template-columns: 1.35fr 1fr 1fr .58fr .5fr; }
    .search-button { grid-column: 1 / -1; margin-top: 0; }
    .field-help { min-height: 0; }
    .trust-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .trust-grid article:nth-child(3) { border-left: 0; border-top: 1px solid #e7ebf1; }
    .trust-grid article:nth-child(4) { border-top: 1px solid #e7ebf1; }
    .booking-steps { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .feature-grid { gap: 13px; }
}

@media (max-width: 980px) {
    .offers-layout { grid-template-columns: 1fr; }
    .filter-toggle { display: inline-flex; }
    .filter-panel {
        position: fixed;
        z-index: 120;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(365px, calc(100% - 28px));
        max-height: 100dvh;
        overflow-y: auto;
        border-radius: 18px 0 0 18px;
        transform: translateX(105%);
        transition: transform .22s ease;
    }
    .filter-panel.is-open { transform: translateX(0); }
    .filter-close { display: grid; place-items: center; }
    .filter-backdrop { position: fixed; z-index: 110; inset: 0; display: block; border: 0; background: rgba(8,20,40,.54); backdrop-filter: blur(2px); }
    .filter-backdrop[hidden] { display: none; }
    body.filter-panel-open { overflow: hidden; }
    .results-page-grid .sidebar { grid-template-columns: 1fr 1fr; }
    .faq-layout { grid-template-columns: 1fr; gap: 25px; }
    .faq-layout .landing-heading { max-width: 720px; margin: 0 auto; text-align: center; }
}

@media (max-width: 820px) {
    .hero { padding-top: 42px; }
    .search-card-heading { align-items: flex-start; }
    .search-form-grid { grid-template-columns: 1fr 1fr; }
    .field-location { grid-column: 1 / -1; }
    .search-button { grid-column: 1 / -1; }
    .feature-grid { grid-template-columns: 1fr; }
    .feature-card { display: grid; grid-template-columns: 48px 1fr; column-gap: 15px; }
    .feature-card .feature-icon { grid-row: 1 / 3; margin: 0; }
    .feature-card h3 { align-self: end; margin-bottom: 4px; }
    .feature-card p { grid-column: 2; }
}

@media (max-width: 720px) {
    .container { width: calc(100% - 20px); }
    .site-header { position: sticky; }
    .header-inner { min-height: 62px; }
    .hero { padding: 34px 0 52px; }
    .hero-copy { margin-bottom: 21px; }
    .hero-points { display: grid; gap: 8px; }
    .search-card { padding: 15px; border-radius: 16px; }
    .search-card-heading { margin-bottom: 13px; padding-bottom: 12px; }
    .search-card-heading strong { font-size: 14px; }
    .secure-search-note { display: none; }
    .search-form-grid { grid-template-columns: 1fr; }
    .field-location, .search-button { grid-column: auto; }
    .field-help { margin-bottom: 1px; }
    .js .picker-custom { grid-template-columns: minmax(0,1fr) minmax(105px,.7fr); }
    .picker-popover {
        position: fixed;
        z-index: 151;
        right: 10px !important;
        bottom: 10px;
        left: 10px !important;
        top: auto;
        width: auto;
        max-height: calc(100dvh - 20px);
        overflow-y: auto;
        border-radius: 19px;
    }
    .date-picker-backdrop { position: fixed; z-index: 150; inset: 0; display: block; border: 0; background: rgba(7,18,36,.58); backdrop-filter: blur(2px); }
    .date-picker-backdrop[hidden] { display: none; }
    body.date-picker-open { overflow: hidden; }
    .time-grid { grid-template-columns: repeat(4,1fr); max-height: 42dvh; }
    .trust-strip { margin-top: -24px; }
    .trust-grid { grid-template-columns: 1fr; }
    .trust-grid article + article, .trust-grid article:nth-child(3), .trust-grid article:nth-child(4) { border-top: 1px solid #e7ebf1; border-left: 0; }
    .trust-grid article { padding: 14px 16px; }
    .landing-section { padding: 52px 0; }
    .booking-steps { grid-template-columns: 1fr; }
    .offer-toolbar { align-items: stretch; flex-wrap: wrap; }
    .offer-toolbar-summary { order: -1; flex: 1 1 100%; }
    .sort-control { flex: 1; margin-left: 0; }
    .sort-control select { width: 100%; }
    .active-filter-bar { align-items: flex-start; flex-direction: column; }
    .active-filter-bar > button { align-self: flex-end; }
    .results-page-grid .sidebar { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
    .container { width: calc(100% - 14px); }
    .hero h1 { font-size: 31px; }
    .search-card-heading { display: block; }
    .picker-trigger { padding-inline: 8px; }
    .picker-trigger svg { display: none; }
    .picker-trigger strong { font-size: 12px; }
    .time-grid { grid-template-columns: repeat(3,1fr); }
    .feature-card { display: block; }
    .feature-card .feature-icon { margin-bottom: 14px; }
    .feature-card p { grid-column: auto; }
    .filter-toggle, .sort-control { width: 100%; }
    .sort-control { display: grid; grid-template-columns: auto 1fr; }
}


/* v5.12: Pagination, Rücksprung, Ladeanimation und Layer-Korrekturen */
.hero-home { z-index: 4; }
.hero-home .hero-container { z-index: 5; }
.hero-home .search-card { z-index: 6; }
.search-form-grid { position: relative; }
.field-location, .date-time-picker { position: relative; z-index: 1; }
.field-location.is-open, .date-time-picker.is-open { z-index: 240; }
.location-results { z-index: 260; top: calc(100% + 6px); }
.picker-popover { z-index: 270; }
.results-head {
    align-items: center;
    margin-bottom: 14px;
    padding: 18px 20px;
    border: 1px solid rgba(220,227,236,.92);
    border-radius: 16px;
    color: var(--navy);
    background: rgba(255,255,255,.97);
    box-shadow: 0 13px 35px rgba(16,33,63,.10);
}
.results-head .eyebrow { color: var(--cyan-dark); }
.results-head h2 { color: var(--navy); }
.trip-summary span { color: #405067; border-color: #d8e3ec; background: #f4f8fb; }
.return-to-results { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 13px; color: var(--cyan-dark); font-size: 12px; font-weight: 850; text-decoration: none; }
.return-to-results:hover { text-decoration: underline; text-underline-offset: 3px; }

.offer-pagination {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: white;
    box-shadow: 0 8px 24px rgba(16,33,63,.06);
}
.offer-pagination[hidden] { display: none; }
.pagination-numbers { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; }
.pagination-button { min-width: 38px; height: 38px; padding: 0 11px; border: 1px solid #d9e2ec; border-radius: 10px; color: #405067; background: #fff; font-size: 11px; font-weight: 850; }
.pagination-button:hover:not(:disabled) { color: var(--cyan-dark); border-color: #8bc9c7; background: var(--mint); }
.pagination-button[aria-current="page"] { color: white; border-color: var(--cyan); background: var(--cyan); box-shadow: 0 7px 15px rgba(10,168,164,.22); }
.pagination-button:disabled:not([aria-current="page"]) { opacity: .42; }
.pagination-ellipsis { min-width: 24px; display: grid; place-items: center; color: #8994a4; }
.pagination-summary { grid-column: 1 / -1; color: var(--muted); text-align: center; font-size: 10px; font-weight: 750; }

.search-progress-layer { position: fixed; z-index: 500; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(7,19,38,.70); backdrop-filter: blur(7px); }
.search-progress-layer[hidden] { display: none; }
body.search-progress-open { overflow: hidden; }
.search-progress-card { width: min(520px,100%); padding: 30px; border: 1px solid rgba(255,255,255,.65); border-radius: 24px; color: var(--text); background: white; box-shadow: 0 35px 100px rgba(4,14,30,.35); text-align: center; }
.search-progress-card h2 { margin-bottom: 8px; color: var(--navy); font-size: clamp(23px,5vw,31px); }
.search-progress-card > p:not(.eyebrow) { max-width: 420px; margin: 0 auto; color: var(--muted); font-size: 13px; }
.rental-search-animation { position: relative; height: 145px; margin-bottom: 20px; overflow: hidden; border-radius: 18px; background: linear-gradient(#dff4f5 0 61%, #d9e4ea 61% 67%, #34445a 67% 100%); }
.search-sky { position: absolute; inset: 0 0 48px; overflow: hidden; }
.search-cloud { position: absolute; width: 56px; height: 17px; border-radius: 999px; background: rgba(255,255,255,.82); animation: search-cloud 4.5s linear infinite; }
.search-cloud::before, .search-cloud::after { content: ""; position: absolute; bottom: 0; border-radius: 50%; background: inherit; }
.search-cloud::before { left: 10px; width: 24px; height: 24px; }
.search-cloud::after { right: 8px; width: 19px; height: 19px; }
.cloud-one { top: 25px; left: -70px; }
.cloud-two { top: 53px; left: -110px; animation-delay: 1.8s; transform: scale(.75); }
.search-road { position: absolute; right: 0; bottom: 0; left: 0; height: 48px; }
.road-mark { position: absolute; top: 22px; width: 64px; height: 4px; border-radius: 5px; background: #eaf2f4; animation: road-marks 1.1s linear infinite; }
.mark-one { left: 10%; }.mark-two { left: 46%; }.mark-three { left: 82%; }
.search-car { position: absolute; left: 50%; bottom: 31px; width: 112px; height: 39px; transform: translateX(-50%); border-radius: 24px 30px 10px 10px; background: linear-gradient(135deg,#0bb5b0,#087d7a); box-shadow: 0 10px 18px rgba(16,33,63,.24); animation: car-bob .65s ease-in-out infinite alternate; }
.search-car::before { content: ""; position: absolute; left: 22px; top: -20px; width: 65px; height: 27px; transform: skewX(-18deg); border-radius: 14px 19px 0 0; background: #0aa8a4; }
.car-window { position: absolute; z-index: 1; left: 36px; top: -15px; width: 42px; height: 16px; transform: skewX(-18deg); border-radius: 9px 12px 3px 3px; background: #d9f4f4; }
.car-wheel { position: absolute; bottom: -8px; width: 21px; height: 21px; border: 5px solid #233249; border-radius: 50%; background: #c7d3dd; animation: wheel-spin .55s linear infinite; }
.wheel-left { left: 17px; }.wheel-right { right: 15px; }
.search-pin { position: absolute; bottom: 17px; color: #79ded5; font-size: 21px; text-shadow: 0 2px 5px rgba(0,0,0,.25); }
.pin-start { left: 24px; }.pin-end { right: 24px; }
.search-progress-steps { display: flex; justify-content: center; gap: 7px; margin-top: 20px; }
.search-progress-steps span { width: 26px; height: 5px; overflow: hidden; border-radius: 999px; background: #dce5eb; }
.search-progress-steps span::after { content: ""; display: block; width: 100%; height: 100%; transform: translateX(-105%); background: var(--cyan); animation: progress-step 1.6s ease-in-out infinite; }
.search-progress-steps span:nth-child(2)::after { animation-delay: .28s; }.search-progress-steps span:nth-child(3)::after { animation-delay: .56s; }
@keyframes road-marks { from { transform: translateX(0); } to { transform: translateX(-100px); } }
@keyframes wheel-spin { to { transform: rotate(360deg); } }
@keyframes car-bob { to { transform: translateX(-50%) translateY(-2px); } }
@keyframes search-cloud { from { transform: translateX(0); } to { transform: translateX(680px); } }
@keyframes progress-step { 0%,20% { transform: translateX(-105%); } 50%,75% { transform: translateX(0); } 100% { transform: translateX(105%); } }

@media (prefers-reduced-motion: reduce) {
    .search-cloud, .road-mark, .search-car, .car-wheel, .search-progress-steps span::after { animation: none; }
}
@media (max-width: 720px) {
    .results-head { align-items: flex-start; padding: 15px; }
    .offer-pagination { grid-template-columns: 1fr 1fr; }
    .pagination-numbers { grid-column: 1 / -1; grid-row: 1; order: -1; }
    .pagination-prev, .pagination-next { width: 100%; }
    .search-progress-card { padding: 20px 16px; border-radius: 19px; }
    .rental-search-animation { height: 125px; }
}
@media (max-width: 460px) {
    .pagination-numbers .pagination-button { min-width: 34px; padding: 0 8px; }
    .pagination-ellipsis { min-width: 15px; }
}

/* v5.13: getrennte Rückgabestation, Standort-Icons und korrigierte Layer */
.hero-home,
.hero-home .hero-container,
.hero-home .search-card { z-index: auto; }
.hero-home .search-card { overflow: visible; }
.trust-strip { position: relative; z-index: 3; }
.location-search-row,
.search-form-grid { position: relative; }
.location-search-row {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) auto;
    gap: 14px;
    align-items: end;
    margin-bottom: 15px;
}
.location-search-row.has-separate-return {
    grid-template-columns: minmax(240px, 1fr) auto minmax(240px, 1fr);
}
.location-search-row > .field-location { min-width: 0; }
.return-location-field[hidden] { display: none !important; }
.search-form-grid {
    grid-template-columns: minmax(230px, 1.25fr) minmax(230px, 1.25fr) minmax(120px, .58fr) minmax(190px, .92fr);
    align-items: end;
}
.field-age select { min-height: 58px; }
.search-button { margin-top: 25px; }

.same-return-toggle {
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    padding: 9px 12px;
    border: 1px solid #d4dee8;
    border-radius: 12px;
    color: #405067;
    background: #f8fafc;
    cursor: pointer;
    white-space: nowrap;
}
.same-return-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.same-return-control { position: relative; flex: 0 0 38px; width: 38px; height: 22px; border-radius: 999px; background: #cbd5e1; transition: background .18s ease; }
.same-return-control span { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(16,33,63,.22); transition: transform .18s ease; }
.same-return-toggle input:checked + .same-return-control { background: var(--cyan); }
.same-return-toggle input:checked + .same-return-control span { transform: translateX(16px); }
.same-return-toggle input:focus-visible + .same-return-control { box-shadow: var(--focus-ring); }
.same-return-toggle > span:last-child { min-width: 0; display: grid; gap: 1px; }
.same-return-toggle strong { color: var(--navy); font-size: 11px; }
.same-return-toggle small { color: #7a8799; font-size: 9px; }

.location-input-shell {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 58px;
    overflow: visible;
    padding: 0 9px 0 12px;
    border: 1px solid #ccd6e3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 1px rgba(16,33,63,.02);
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.location-input-shell > input[data-location-input] {
    min-width: 0;
    flex: 1;
    height: 54px;
    padding: 0 8px;
    border: 0;
    outline: 0;
    color: var(--text);
    background: transparent;
    font-size: 14px;
}
.location-type-icon {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--cyan-dark);
    background: #edf9f8;
}
.location-type-icon svg { width: 15px; height: 15px; fill: currentColor; }
.field-location.has-selection .location-input-shell {
    border-color: #83c8c4;
    background: #fbfffe;
    box-shadow: inset 0 0 0 1px rgba(10,168,164,.08);
}
.field-location.is-open .location-input-shell,
.field-location .location-input-shell:focus-within {
    border-color: var(--cyan);
    background: #fff;
    box-shadow: var(--focus-ring);
}
.location-code-badge {
    position: static;
    right: auto;
    margin: 0;
    padding: 5px 8px;
    border: 0;
    border-radius: 8px;
    color: #126c69;
    background: #e7f7f5;
    line-height: 1;
}
.field-location:not(.has-selection) .location-code-badge { color: #66758a; background: #eef2f6; }
.field-location,
.date-time-picker { position: relative; z-index: auto; }
.field-location.is-open,
.date-time-picker.is-open { z-index: 320; }
.location-results {
    top: calc(100% + 7px);
    z-index: 340;
    max-height: 350px;
    padding: 7px;
    border-color: #cdd8e4;
    box-shadow: 0 24px 65px rgba(16,33,63,.24);
}
.picker-popover { z-index: 350; }
.location-option {
    display: grid;
    grid-template-columns: 36px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    padding: 10px;
}
.location-option-icon {
    width: 36px;
    height: 36px;
    display: grid !important;
    place-items: center;
    margin: 0 !important;
    border-radius: 10px;
    color: var(--cyan-dark) !important;
    background: #edf9f8;
}
.location-option-icon-airport { color: #176aa5 !important; background: #edf6ff; }
.location-option-icon-railway { color: #75551a !important; background: #fff7e5; }
.location-option-icon svg { width: 18px; height: 18px; fill: currentColor; }
.location-option-content { min-width: 0; display: grid !important; gap: 3px; margin: 0 !important; }
.location-option-content strong { overflow: hidden; color: var(--navy); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.location-option-content > span { margin: 0 !important; color: var(--muted) !important; font-size: 10px !important; line-height: 1.35; }

@media (max-width: 1120px) {
    .location-search-row.has-separate-return { grid-template-columns: minmax(230px,1fr) minmax(230px,1fr); }
    .location-search-row.has-separate-return .same-return-toggle { grid-column: 1 / -1; grid-row: 2; width: fit-content; margin: 0; }
    .search-form-grid { grid-template-columns: 1fr 1fr minmax(120px,.55fr); }
    .search-button { grid-column: 1 / -1; margin-top: 0; }
}

@media (max-width: 820px) {
    .location-search-row,
    .location-search-row.has-separate-return { grid-template-columns: 1fr; }
    .same-return-toggle,
    .location-search-row.has-separate-return .same-return-toggle { grid-column: auto; grid-row: auto; width: 100%; margin: 0; }
    .search-form-grid { grid-template-columns: 1fr 1fr; }
    .field-age { grid-column: 1 / -1; }
    .search-button { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    .location-search-row { gap: 10px; margin-bottom: 12px; }
    .search-form-grid { grid-template-columns: 1fr; }
    .field-age, .search-button { grid-column: auto; }
    .same-return-toggle { min-height: 52px; }
    .location-results {
        position: fixed;
        z-index: 360;
        top: 78px;
        right: 10px;
        bottom: 10px;
        left: 10px;
        max-height: none;
        border-radius: 18px;
    }
}

/* v5.14: kompakte Ergebnissuche, reduzierte Angebotskarten und einheitliche Tarifleistungen */
.hero-results {
    padding-top: 24px;
    padding-bottom: 34px;
}
.hero-results .hero-copy {
    margin-bottom: 14px;
}
.hero-results .hero-copy h1 {
    margin-bottom: 5px;
    font-size: clamp(25px, 3vw, 36px);
}
.hero-results .hero-copy > p:last-child {
    margin: 0;
    max-width: 760px;
    font-size: 14px;
}
.results-search-editor {
    position: relative;
    z-index: 30;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 18px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 16px 40px rgba(5,26,56,.18);
    color: var(--text);
    overflow: visible;
}
.results-search-editor > summary {
    display: grid;
    grid-template-columns: minmax(260px,1.35fr) minmax(300px,1fr) auto;
    align-items: center;
    gap: 18px;
    min-height: 82px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
}
.results-search-editor > summary::-webkit-details-marker { display: none; }
.results-search-route,
.results-search-facts,
.results-search-action {
    display: flex;
    align-items: center;
}
.results-search-route { min-width: 0; gap: 12px; }
.results-search-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    color: var(--cyan-dark);
    background: var(--mint);
}
.results-search-icon svg { width: 21px; height: 21px; fill: currentColor; }
.results-search-route > span:last-child { min-width: 0; display: grid; gap: 3px; }
.results-search-route small,
.results-search-facts small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.results-search-route strong {
    display: block;
    overflow: hidden;
    color: var(--navy);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.results-search-facts {
    justify-content: flex-end;
    gap: 20px;
}
.results-search-facts > span { display: grid; gap: 3px; }
.results-search-facts strong { color: var(--navy); font-size: 12px; white-space: nowrap; }
.results-search-action {
    gap: 8px;
    justify-content: center;
    min-height: 42px;
    padding: 0 15px;
    border: 1px solid #cfe2e5;
    border-radius: 12px;
    color: var(--cyan-dark);
    background: #f2fbfa;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.results-search-action svg { width: 17px; height: 17px; fill: currentColor; transition: transform .2s ease; }
.results-search-editor[open] .results-search-action svg { transform: rotate(180deg); }
.results-search-editor-body {
    padding: 0 12px 12px;
    border-top: 1px solid var(--border);
}
.results-search-editor .search-card-edit {
    margin-top: 12px;
    padding: 14px;
    border: 0;
    border-radius: 14px;
    box-shadow: none;
    background: #f8fafc;
}
.results-search-editor .search-card-heading { margin-bottom: 11px; padding-bottom: 10px; }
.results-search-editor .search-card-heading strong { font-size: 14px; }
.results-search-editor .search-card-kicker,
.results-search-editor .secure-search-note { display: none; }

.offer-card,
.content-grid.without-sidebar .offer-card {
    grid-template-columns: 205px minmax(0,1fr) 218px;
}
.offer-main { padding-top: 23px; padding-bottom: 19px; }
.offer-benefits-modern { margin-top: 14px; padding-top: 13px; }
.benefit-groups-modern {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
}
.benefit-groups-modern .benefit-group {
    min-width: 0;
    padding: 11px;
    border: 1px solid #dde8ed;
    border-radius: 13px;
    background: linear-gradient(180deg,#fff,#f8fbfc);
    box-shadow: 0 5px 13px rgba(16,33,63,.035);
}
.benefit-groups-modern .benefit-group header {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 8px;
}
.benefit-groups-modern .benefit-group-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 10px;
}
.benefit-groups-modern .benefit-group-icon svg { width: 17px; height: 17px; fill: currentColor; }
.benefit-group-heading { min-width: 0; display: grid; gap: 1px; }
.benefit-group-heading h4 { margin: 0; font-size: 11px; }
.benefit-group-heading small { color: var(--muted); font-size: 9px; font-weight: 700; }
.benefit-groups-modern .benefit-group ul { gap: 5px; }
.benefit-groups-modern .benefit-group li { gap: 5px; font-size: 10px; line-height: 1.35; }
.benefit-groups-modern .benefit-group li svg { width: 13px; flex-basis: 13px; }
.benefit-variant-station .benefit-group { padding: 15px; }
.benefit-variant-station .benefit-group li { font-size: 12px; }
.benefit-variant-station .benefit-group-heading h4 { font-size: 13px; }
.benefit-empty,
.benefit-summary-empty { margin: 0; color: var(--muted); font-size: 12px; }

.insurance-disclosure {
    margin-top: 10px;
    border: 1px solid #dce5ed;
    border-radius: 13px;
    background: #fbfcfe;
    overflow: hidden;
}
.insurance-disclosure > summary {
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) 22px;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 9px 12px;
    cursor: pointer;
    list-style: none;
}
.insurance-disclosure > summary::-webkit-details-marker { display: none; }
.insurance-disclosure > summary:hover { background: #f5fafb; }
.insurance-summary-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: #8b650b;
    background: #fff4d5;
}
.insurance-summary-icon svg { width: 18px; height: 18px; fill: currentColor; }
.insurance-summary-copy { min-width: 0; display: grid; gap: 2px; }
.insurance-summary-copy strong { color: var(--navy); font-size: 11px; }
.insurance-summary-copy small { color: var(--muted); font-size: 9px; }
.insurance-chevron { display: grid; place-items: center; color: #627188; }
.insurance-chevron svg { width: 18px; height: 18px; fill: currentColor; transition: transform .18s ease; }
.insurance-disclosure[open] .insurance-chevron svg { transform: rotate(180deg); }
.insurance-disclosure-body { padding: 0 12px 12px; border-top: 1px solid #e4eaf0; }
.insurance-disclosure-body > p:first-child { margin: 12px 0 0; color: var(--muted); font-size: 11px; }
.insurance-detail-list { display: grid; gap: 7px; padding-top: 10px; }
.insurance-detail-list article {
    display: grid;
    grid-template-columns: 25px minmax(0,1fr);
    gap: 8px;
    align-items: start;
    padding: 9px;
    border-radius: 10px;
    background: white;
}
.insurance-status {
    width: 25px;
    height: 25px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: var(--green);
    font-size: 11px;
    font-weight: 900;
}
.insurance-status.is-conditional { color: #7c5c16; background: #fff1c8; }
.insurance-detail-list article > span:last-child { display: grid; gap: 2px; }
.insurance-detail-list strong { color: var(--navy); font-size: 11px; }
.insurance-detail-list small { color: var(--muted); font-size: 9px; }
.insurance-legal-note { margin: 9px 0 0 !important; color: var(--muted); font-size: 9px !important; }

.included-services-card .flow-card-body { display: grid; gap: 12px; }
.checkout-benefit-summary {
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid var(--border);
}
.checkout-summary-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 9px;
}
.checkout-summary-heading h4 { margin: 0; color: var(--navy); font-size: 13px; }
.checkout-summary-heading span {
    padding: 4px 7px;
    border-radius: 999px;
    color: var(--cyan-dark);
    background: var(--mint);
    font-size: 9px;
    font-weight: 900;
}
.benefit-highlight-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.benefit-highlight-list li {
    display: flex;
    gap: 5px;
    align-items: flex-start;
    color: #445166;
    font-size: 10px;
    font-weight: 750;
    line-height: 1.35;
}
.benefit-highlight-list li > span { color: var(--green); font-weight: 900; }
.benefit-highlight-list .benefit-highlight-more { color: var(--cyan-dark); }
.checkout-benefit-summary .insurance-disclosure { margin-top: 9px; }
.checkout-benefit-summary .insurance-disclosure > summary { min-height: 47px; padding: 7px 9px; }
.checkout-benefit-summary .insurance-summary-icon { width: 29px; height: 29px; }
.checkout-benefit-summary .insurance-summary-copy strong { font-size: 10px; }

@media (max-width: 1120px) {
    .results-search-editor > summary { grid-template-columns: minmax(240px,1fr) minmax(260px,.85fr) auto; gap: 12px; }
    .offer-card,
    .content-grid.without-sidebar .offer-card { grid-template-columns: 185px minmax(0,1fr); }
    .benefit-groups-modern { grid-template-columns: repeat(3,minmax(155px,1fr)); }
}

@media (max-width: 860px) {
    .hero-results .hero-copy { display: none; }
    .hero-results { padding-top: 16px; padding-bottom: 22px; }
    .results-search-editor > summary { grid-template-columns: minmax(0,1fr) auto; }
    .results-search-facts { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; padding-left: 54px; }
    .benefit-groups-modern { grid-template-columns: 1fr; }
    .benefit-variant-offer .benefit-group ul {
        display: flex;
        flex-wrap: wrap;
        gap: 5px 10px;
    }
    .benefit-variant-offer .benefit-group li { flex: 0 1 auto; }
}

@media (max-width: 620px) {
    .results-search-editor { border-radius: 15px; }
    .results-search-editor > summary { min-height: 0; padding: 12px; }
    .results-search-route strong { font-size: 12px; white-space: normal; }
    .results-search-icon { width: 36px; height: 36px; flex-basis: 36px; }
    .results-search-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-left: 48px; }
    .results-search-facts strong { white-space: normal; }
    .results-search-action { align-self: start; min-height: 36px; padding: 0 9px; }
    .results-search-action span { display: none; }
    .benefit-highlight-list { grid-template-columns: 1fr; }
    .offer-benefits-modern .offer-section-title { flex-direction: row; }
}
.benefit-groups-modern .benefit-more { color: var(--cyan-dark); font-weight: 850; }
.benefit-groups-modern .benefit-more::before { content: ""; width: 13px; flex: 0 0 13px; }


/* v5.16 – zweistellige Datumsanzeige, kompakte Ergebnisansicht und mobile Flow-Korrekturen */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Die frühere große Suchergebnis-Leiste entfällt; die Toolbar übernimmt die Ergebniszahl. */
.results-page-grid { margin-top: -38px; }

.station-details-disclosure { margin: 0; }
.station-details-disclosure > summary {
    display: none;
    list-style: none;
}
.station-details-disclosure > summary::-webkit-details-marker { display: none; }
/* Auf Desktop bleiben alle Stationsdetails ohne zusätzlichen Klick sichtbar. */
.station-details-disclosure > .station-meta { display: grid !important; }

@media (max-width: 720px) {
    /* Angebotskarten auf kleinen Displays strikt einspaltig halten. Die späten
       Tablet-Regeln früherer Versionen dürfen hier keine zweite Spalte erzeugen. */
    .offer-card,
    .content-grid.without-sidebar .offer-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100%;
        overflow: hidden;
    }
    .offer-card > .vehicle-media,
    .offer-card > .offer-main,
    .offer-card > .offer-price {
        grid-column: 1 !important;
        min-width: 0;
        width: 100%;
    }
    .package-badge {
        top: 13px;
        left: 13px;
        max-width: calc(100% - 26px);
        white-space: normal;
        line-height: 1.2;
    }
    .vehicle-media {
        min-height: 0 !important;
        padding: 48px 16px 15px !important;
        border-right: 0 !important;
        border-bottom: 1px solid var(--border);
    }
    .vehicle-media img {
        width: min(100%, 320px);
        height: 148px !important;
        max-width: 100%;
    }
    .supplier-pill { margin-top: 9px; }
    .offer-main { padding: 18px 15px !important; }
    .offer-title-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }
    .offer-main h3 { font-size: 21px; overflow-wrap: anywhere; }
    .offer-title-row .availability,
    .availability { justify-self: start; align-self: start; margin-top: 0; }
    .spec-list { margin: 15px 0; gap: 8px 13px; }
    .offer-benefits-modern { margin-top: 10px; padding-top: 11px; }
    .benefit-groups-modern { grid-template-columns: minmax(0, 1fr) !important; }
    .benefit-variant-offer .benefit-group ul {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 6px 10px;
    }
    .insurance-disclosure > summary { min-height: 50px; }
    .offer-price {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 5px 12px !important;
        padding: 16px 15px 17px !important;
        border-top: 1px solid var(--border) !important;
        border-left: 0 !important;
        text-align: left !important;
        background: #fbfcfe;
    }
    .offer-price .price-label { grid-column: 1; margin: 0 !important; }
    .offer-price > strong { grid-column: 2; grid-row: 1 / span 2; text-align: right !important; font-size: 25px; }
    .offer-price .per-day { grid-column: 1; }
    .offer-price .tax-note,
    .offer-price .select-offer-form,
    .offer-price .text-link,
    .offer-price .reference,
    .offer-price .tariff-code {
        grid-column: 1 / -1 !important;
        width: 100%;
    }
    .offer-price .tax-note { margin: 4px 0 8px; }
    .offer-price .select-offer-form { min-width: 0 !important; }
    .offer-price .text-link { padding: 10px 0 0; text-align: center; }

    /* Stationsname und Adresse bleiben sichtbar. Die technischen Details sind
       mobil zunächst eingeklappt und lassen sich bei Bedarf öffnen. */
    .station-card { padding: 16px; }
    .station-address { min-height: 0; margin-bottom: 0; }
    .station-details-disclosure { margin-top: 13px; }
    .station-details-disclosure > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 43px;
        padding: 0 11px;
        border: 1px solid var(--border);
        border-radius: 10px;
        color: var(--navy);
        background: #fff;
        cursor: pointer;
        font-size: 12px;
        font-weight: 850;
    }
    .station-details-disclosure:not([open]) > .station-meta { display: none !important; }
    .station-details-disclosure[open] > .station-meta { display: grid !important; }
    .station-details-chevron { color: var(--cyan-dark); font-size: 18px; transition: transform .18s ease; }
    .station-details-disclosure[open] .station-details-chevron { transform: rotate(180deg); }
    .station-meta { margin-top: 9px; }

    /* Kein horizontaler Breadcrumb-Scroller auf Mobilgeräten. */
    .flow-steps,
    .flow-steps-four {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        max-width: none !important;
        width: 100% !important;
        margin: 0 0 20px !important;
        padding: 0 !important;
        overflow: visible !important;
        scroll-snap-type: none !important;
        scrollbar-width: none !important;
    }
    .flow-steps-four { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .flow-step,
    .flow-steps-four .flow-step {
        min-width: 0 !important;
        width: 100%;
        padding: 8px 7px !important;
        gap: 6px;
        justify-content: flex-start;
        white-space: normal !important;
        line-height: 1.22;
        font-size: 10px;
        overflow-wrap: anywhere;
    }
    .flow-step span {
        width: 22px;
        height: 22px;
        flex: 0 0 22px;
    }
}

@media (max-width: 430px) {
    .benefit-variant-offer .benefit-group ul { grid-template-columns: 1fr; }
    .offer-price { grid-template-columns: minmax(0, 1fr) auto !important; }
    .flow-step,
    .flow-steps-four .flow-step { min-width: 0 !important; font-size: 9px; }
}


/* v5.16 – optionales Startseiten-Hintergrundbild und klar getrennte Ergebnis-Toolbar */
.hero-home.hero-home-image {
    background:
        linear-gradient(90deg, rgba(7, 25, 51, .92) 0%, rgba(10, 42, 70, .82) 44%, rgba(8, 72, 86, .52) 100%),
        url("images/hintergrund.jpg") center 43% / cover no-repeat;
}
.hero-home.hero-home-image::before {
    opacity: .055;
}
.hero-home.hero-home-image .hero-copy > p:last-of-type {
    color: rgba(255, 255, 255, .88);
    text-shadow: 0 1px 10px rgba(5, 21, 41, .28);
}
.hero-home.hero-home-image .hero-points {
    text-shadow: 0 1px 8px rgba(5, 21, 41, .34);
}

/* Die Ergebnis-Toolbar beginnt vollständig auf dem grauen Seitenhintergrund
   und erhält Abstand zur eingeklappten Suchzusammenfassung. */
.results-page-grid {
    margin-top: 26px;
}
.hero-results {
    padding-bottom: 26px;
}

@media (max-width: 820px) {
    .hero-home.hero-home-image {
        background-position: center 39%;
    }
    .results-page-grid {
        margin-top: 20px;
    }
}

@media (max-width: 520px) {
    .hero-home.hero-home-image {
        background-position: 58% 38%;
    }
    .results-page-grid {
        margin-top: 16px;
    }
}


/* v5.19 – Hintergrundbild deutlicher sichtbar */
.hero-home.hero-home-image {
    background:
        linear-gradient(90deg,
            rgba(7, 25, 51, .76) 0%,
            rgba(7, 25, 51, .58) 32%,
            rgba(7, 25, 51, .27) 64%,
            rgba(7, 25, 51, .08) 100%),
        url("images/hintergrund.jpg") center 35% / cover no-repeat;
}
.hero-home.hero-home-image::before { opacity: .025; }
.location-input-shell > input[data-location-input]::placeholder {
    color: #738196;
    opacity: 1;
}
.location-code-badge[hidden] { display: none !important; }

@media (max-width: 820px) {
    .hero-home.hero-home-image {
        background-position: 57% 39%;
        background-image:
            linear-gradient(90deg,
                rgba(7, 25, 51, .76) 0%,
                rgba(7, 25, 51, .48) 52%,
                rgba(7, 25, 51, .17) 100%),
            url("images/hintergrund.jpg");
    }
}

@media (max-width: 520px) {
    .hero-home.hero-home-image {
        background-position: 64% 42%;
        background-image:
            linear-gradient(180deg,
                rgba(7, 25, 51, .72) 0%,
                rgba(7, 25, 51, .45) 43%,
                rgba(7, 25, 51, .16) 100%),
            url("images/hintergrund.jpg");
    }
}


/* v5.19 – mobile Stationsauswahl als vollflächiger Dialog */
.mobile-location-modal[hidden] { display: none !important; }
.mobile-location-modal { position: fixed; inset: 0; z-index: 10000; display: none; background: rgba(9, 25, 49, .42); }
.mobile-location-modal__panel { width: min(100%, 720px); min-height: 100%; margin: 0 auto; background: #fff; }
.mobile-location-modal__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px 14px; border-bottom: 1px solid #dce3eb; }
.mobile-location-modal__header h2 { margin: 2px 0 0; color: var(--navy); font-size: 24px; }
.mobile-location-modal__eyebrow { color: var(--cyan-dark); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.mobile-location-modal__close { width: 46px; height: 46px; border: 0; border-radius: 50%; background: #f1f5f8; color: #15233b; font-size: 32px; line-height: 1; }
.mobile-location-modal__search { position: relative; margin: 14px 18px 8px; }
.mobile-location-modal__search-icon { position: absolute; top: 50%; left: 16px; transform: translateY(-50%); color: var(--cyan-dark); font-size: 23px; pointer-events: none; }
.mobile-location-modal__search input { width: 100%; min-height: 58px; padding: 0 18px 0 48px; border: 2px solid #cbd6e2; border-radius: 14px; outline: none; color: var(--navy); background: #fff; font-size: 16px !important; }
.mobile-location-modal__search input:focus { border-color: var(--cyan); box-shadow: 0 0 0 4px rgba(13, 170, 169, .12); }
.mobile-location-modal__status { padding: 4px 20px 10px; color: var(--muted); font-size: 12px; }
.mobile-location-modal__results { overflow-y: auto; overscroll-behavior: contain; border-top: 1px solid #e5eaf0; }
.mobile-location-option { width: 100%; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 15px 18px; border: 0; border-bottom: 1px solid #e1e6ec; background: #fff; text-align: left; }
.mobile-location-option:active { background: #edf8f7; }
.mobile-location-option__icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--cyan-dark); background: #eaf8f7; }
.mobile-location-option__icon--airport { color: #176aa5; background: #edf6ff; }
.mobile-location-option__icon--railway { color: #75551a; background: #fff7e5; }
.mobile-location-option__icon svg { width: 21px; height: 21px; fill: currentColor; }
.mobile-location-option__content { min-width: 0; display: grid; gap: 4px; }
.mobile-location-option__content strong { color: #17233a; font-size: 16px; line-height: 1.25; }
.mobile-location-option__content span { overflow: hidden; color: #59667a; font-size: 13px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.mobile-location-option__code { min-width: 42px; color: #17233a; font-size: 16px; font-weight: 800; text-align: right; }
.mobile-location-modal__empty { padding: 36px 20px; color: var(--muted); text-align: center; }
body.mobile-location-modal-open { overflow: hidden !important; touch-action: none; }

@media (max-width: 720px) {
    .mobile-location-modal { display: block; padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); background: #fff; }
    .mobile-location-modal__panel { height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); min-height: 0; display: grid; grid-template-rows: auto auto auto minmax(0, 1fr); }
    .mobile-location-modal__results { min-height: 0; }
    .field-location [data-location-input] { cursor: pointer; font-size: 16px; }
    .field-location .location-results { display: none !important; }
}

/* v5.20 – mobile Filterkopf, Sortierung und Checkout-Validierung */
.sort-control {
    position: relative;
    min-height: 46px;
    padding: 5px 7px 5px 13px;
    border: 1px solid #d6e0ea;
    border-radius: 14px;
    background: linear-gradient(180deg, #fff 0%, #f8fbfd 100%);
    box-shadow: 0 7px 18px rgba(16, 33, 63, .06);
}
.sort-control::after {
    content: "";
    position: absolute;
    right: 17px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid #1b304e;
    border-bottom: 2px solid #1b304e;
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
}
.sort-control select {
    min-height: 36px;
    padding-right: 38px;
    border: 0;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    color: var(--navy);
    font-size: 12px;
    font-weight: 850;
    outline: 0;
}
.filter-panel-header {
    position: sticky;
    z-index: 4;
    top: 0;
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(8px);
}
.checkout-field { position: relative; }
.checkout-field::after {
    content: "✓";
    position: absolute;
    z-index: 3;
    right: 12px;
    bottom: 13px;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #15956f;
    box-shadow: 0 4px 10px rgba(21,149,111,.24);
    font-size: 13px;
    font-weight: 950;
    opacity: 0;
    transform: scale(.72);
    transition: opacity .16s ease, transform .16s ease;
    pointer-events: none;
}
.checkout-field.is-valid::after { opacity: 1; transform: scale(1); }
.checkout-field.is-valid input,
.checkout-field.is-valid select,
.checkout-field.is-valid .checkout-date-trigger { padding-right: 43px; border-color: #70cbb0; background-color: #fbfffd; }
.checkout-date-picker { width: 100%; }
.checkout-date-trigger {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--navy);
    background: #fff;
    text-align: left;
    font: inherit;
}
.checkout-date-trigger svg { width: 19px; height: 19px; fill: var(--cyan-dark); flex: 0 0 auto; }
.checkout-date-trigger strong { font-size: 14px; }
.checkout-birth-popover { left: 0; right: auto; min-width: min(360px, calc(100vw - 34px)); }
.checkout-birth-field::after { bottom: 13px; }

@media (max-width: 980px) {
    .filter-panel { overflow: hidden; padding-top: env(safe-area-inset-top); }
    .filter-panel-header {
        top: 0;
        min-height: 74px;
        padding: 15px 18px 13px;
        border-bottom: 1px solid #e5ebf1;
    }
    .filter-panel > .filter-group,
    .filter-panel > .filter-reset { position: relative; }
    .filter-panel { overflow-y: auto; overscroll-behavior: contain; }
    .filter-close {
        position: relative;
        z-index: 8;
        display: grid !important;
        place-items: center;
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        border: 1px solid #d7e1ea;
        border-radius: 50%;
        color: #10213f;
        background: #fff;
        box-shadow: 0 7px 18px rgba(16,33,63,.13);
        font-size: 28px;
        line-height: 1;
    }
}

@media (max-width: 720px) {
    .sort-control { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; }
    .checkout-birth-popover { position: fixed; left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); top: auto; min-width: 0; }
}


/* v5.21 – iPhone Filter-Close, Checkout selects/date and invalid-state UX */
.checkout-modern-select {
    width: 100%;
    min-height: 48px;
    padding: 0 44px 0 13px !important;
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--navy);
    background:
        linear-gradient(45deg, transparent 50%, #1b304e 50%) calc(100% - 20px) 20px/6px 6px no-repeat,
        linear-gradient(135deg, #1b304e 50%, transparent 50%) calc(100% - 14px) 20px/6px 6px no-repeat,
        linear-gradient(180deg, #fff 0%, #f8fbfd 100%);
    box-shadow: 0 6px 16px rgba(16,33,63,.04);
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
}
.checkout-native-date { position: relative; width: 100%; }
.checkout-native-date input {
    width: 100%;
    min-height: 48px;
    padding: 0 44px 0 13px;
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--navy);
    background: #fff;
    font: inherit;
    font-size: 16px;
    box-sizing: border-box;
}
.checkout-native-date svg {
    position: absolute;
    right: 13px;
    top: 50%;
    width: 19px;
    height: 19px;
    fill: var(--cyan-dark);
    transform: translateY(-50%);
    pointer-events: none;
}
.checkout-native-date input::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.checkout-field.is-invalid input,
.checkout-field.is-invalid select,
.checkout-field.is-invalid .checkout-native-date input {
    border-color: #d94d59 !important;
    background-color: #fff7f8 !important;
    box-shadow: 0 0 0 3px rgba(217,77,89,.10);
}
.checkout-field.is-invalid > span { color: #b52f3c; }
.consent-check.is-invalid { padding: 10px; border: 1px solid #d94d59; border-radius: 10px; background: #fff7f8; }
.phone-code input { padding-left: 13px; }

@media (max-width: 980px) {
    .filter-panel { z-index: 10000 !important; padding-top: max(70px, calc(env(safe-area-inset-top) + 58px)) !important; }
    .filter-panel-header {
        position: absolute !important;
        top: 0 !important;
        left: 0;
        right: 0;
        min-height: max(70px, calc(env(safe-area-inset-top) + 58px));
        padding: max(12px, env(safe-area-inset-top)) 72px 12px 18px !important;
        box-sizing: border-box;
    }
    .filter-close {
        position: fixed !important;
        z-index: 10002 !important;
        top: max(12px, env(safe-area-inset-top)) !important;
        right: 14px !important;
        display: grid !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .filter-backdrop { z-index: 9999 !important; }
}

/* v5.22 – iOS-sichere Filter-Sidebar und einheitliche Checkout-Feldbreiten */
.checkout-select-field,
.checkout-select-field select,
.checkout-modern-select {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.checkout-field:has([name="birth_date"])::after,
.checkout-field:has([name="country"])::after {
    display: none !important;
}
.checkout-field.is-valid:has([name="birth_date"]) input,
.checkout-field.is-valid:has([name="country"]) select {
    padding-right: 13px !important;
    border-color: var(--border);
    background-color: #fff;
}

@media (max-width: 980px) {
    .filter-panel {
        position: fixed !important;
        z-index: 2147483001 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        padding-top: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        isolation: isolate;
    }
    .filter-panel-header {
        position: sticky !important;
        z-index: 2147483002 !important;
        top: 0 !important;
        min-height: calc(76px + env(safe-area-inset-top)) !important;
        padding: calc(14px + env(safe-area-inset-top)) 76px 14px 20px !important;
        background: #fff !important;
        border-bottom: 1px solid #e2e8ef;
        box-shadow: 0 5px 18px rgba(16,33,63,.08);
    }
    .filter-close {
        position: absolute !important;
        z-index: 2147483003 !important;
        top: calc(14px + env(safe-area-inset-top)) !important;
        right: 16px !important;
        width: 48px !important;
        height: 48px !important;
        display: grid !important;
        place-items: center !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        color: #10213f !important;
        background: #fff !important;
        border: 1px solid #cfdae5 !important;
        border-radius: 50% !important;
        box-shadow: 0 8px 22px rgba(16,33,63,.15) !important;
        font-size: 32px !important;
        line-height: 1 !important;
    }
    .filter-backdrop {
        z-index: 2147483000 !important;
    }
}

/* v5.23 – Geburtsdatum exakt auf die normale Checkout-Feldbreite begrenzen */
.checkout-birth-field,
.checkout-birth-field .checkout-native-date,
.checkout-birth-field .checkout-native-date input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    box-sizing: border-box !important;
}
.checkout-birth-field {
    overflow: hidden;
}
.checkout-birth-field .checkout-native-date {
    display: block;
    overflow: hidden;
}
.checkout-birth-field .checkout-native-date input {
    display: block;
    margin: 0 !important;
    -webkit-appearance: none;
    appearance: none;
}
@media (max-width: 720px) {
    .checkout-grid,
    .checkout-birth-field,
    .checkout-birth-field .checkout-native-date {
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .checkout-birth-field {
        grid-column: auto !important;
    }
}


/* v5.24 – iOS-Fokus im Ortslayer und einheitlicher Geburtsdatum-Kalender */
.checkout-birth-picker {
    position: relative;
    width: 100%;
    min-width: 0;
}
.checkout-birth-trigger {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 40px;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--navy);
    background: #fff;
    box-sizing: border-box;
    cursor: pointer;
}
.checkout-birth-trigger::before { content: ''; width: 40px; }
.checkout-birth-trigger strong {
    grid-column: 2;
    min-width: 0;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    white-space: nowrap;
}
.checkout-birth-trigger svg {
    grid-column: 3;
    justify-self: end;
    width: 19px;
    height: 19px;
    fill: var(--cyan-dark);
}
.checkout-birth-picker.is-open .checkout-birth-trigger,
.checkout-birth-trigger:focus-visible {
    border-color: var(--cyan);
    box-shadow: 0 0 0 4px rgba(13,170,169,.12);
    outline: none;
}
.checkout-birth-popover {
    left: 0;
    right: auto;
    width: min(330px, calc(100vw - 32px));
    z-index: 10020;
}
.checkout-birth-field.is-invalid .checkout-birth-trigger {
    border-color: #d94d59 !important;
    background-color: #fff7f8 !important;
    box-shadow: 0 0 0 3px rgba(217,77,89,.10);
}
.mobile-location-modal__search input {
    caret-color: var(--cyan-dark);
}
@media (max-width: 720px) {
    .checkout-birth-popover {
        position: fixed !important;
        z-index: 10030 !important;
        left: 14px !important;
        right: 14px !important;
        top: auto !important;
        bottom: calc(14px + env(safe-area-inset-bottom)) !important;
        width: auto !important;
        max-height: min(78dvh, 620px);
        overflow-y: auto;
        border-radius: 18px;
        box-shadow: 0 24px 70px rgba(8,27,53,.28);
    }
    .checkout-birth-trigger strong { font-size: 18px; }
}


/* v5.25 – vollständiger mobiler Checkout-Kalender ohne native Doppelanzeige */
.js .checkout-birth-picker > .picker-native {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 0 !important;
    max-width: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.flow-card.has-open-date-picker {
    overflow: visible !important;
}
.checkout-birth-trigger {
    grid-template-columns: 40px minmax(0, 1fr) 40px !important;
    overflow: hidden;
}
.checkout-birth-trigger strong {
    justify-self: stretch;
    text-align: center !important;
}

@media (max-width: 720px) {
    .checkout-birth-popover {
        position: fixed !important;
        z-index: 10030 !important;
        top: auto !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - env(safe-area-inset-top) - 12px) !important;
        margin: 0 !important;
        padding: 18px 18px calc(22px + env(safe-area-inset-bottom)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border: 0 !important;
        border-radius: 24px 24px 0 0 !important;
        box-sizing: border-box !important;
        box-shadow: 0 -18px 60px rgba(8,27,53,.30) !important;
    }
    .checkout-birth-popover .picker-popover-top {
        position: sticky;
        z-index: 2;
        top: -18px;
        margin: -18px -18px 14px;
        padding: 18px 18px 13px;
        background: rgba(255,255,255,.98);
        border-bottom: 1px solid #e6ebf1;
        backdrop-filter: blur(10px);
    }
    .checkout-birth-popover [data-picker-panel="date"],
    .checkout-birth-popover .calendar-shell,
    .checkout-birth-popover .calendar-days {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .checkout-birth-popover .calendar-shell {
        width: 100%;
        padding: 2px 0 0;
        box-sizing: border-box;
    }
    .checkout-birth-popover .calendar-header {
        grid-template-columns: 46px minmax(0,1fr) 46px;
        margin-bottom: 14px;
    }
    .checkout-birth-popover .calendar-header button {
        height: 44px;
        border-radius: 12px;
        font-size: 28px;
    }
    .checkout-birth-popover .calendar-header strong {
        font-size: 17px;
    }
    .checkout-birth-popover .calendar-weekdays,
    .checkout-birth-popover .calendar-days {
        gap: 6px;
    }
    .checkout-birth-popover .calendar-weekdays {
        margin-bottom: 8px;
    }
    .checkout-birth-popover .calendar-weekdays span {
        font-size: 11px;
    }
    .checkout-birth-popover .calendar-day {
        min-height: 42px;
        aspect-ratio: 1;
        border-radius: 12px;
        font-size: 14px;
    }
    .checkout-birth-popover .calendar-footer {
        margin-top: 14px;
        padding-top: 14px;
    }
    .checkout-birth-popover .calendar-footer button {
        min-height: 44px;
        padding-inline: 16px;
        font-size: 12px;
    }
}


/* v5.26 – nur ein sichtbares Geburtsdatum-Feld */
.checkout-birth-picker > input[type="hidden"] {
    display: none !important;
}
.checkout-birth-picker {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.checkout-birth-trigger {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}


/* v5.27 – Datepicker unabhängig von Checkout-Containern */
body > .checkout-birth-popover {
    position: fixed !important; z-index: 2147483201 !important;
    top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important;
    width: min(390px, calc(100vw - 32px)) !important; max-height: calc(100dvh - 40px) !important;
    margin: 0 !important; padding: 18px !important; overflow-x: hidden !important; overflow-y: auto !important;
    transform: translate(-50%, -50%) !important; border-radius: 20px !important; box-sizing: border-box !important;
    background: #fff !important; box-shadow: 0 28px 90px rgba(8,27,53,.34) !important;
}
body > .checkout-birth-popover .calendar-shell, body > .checkout-birth-popover .calendar-days,
body > .checkout-birth-popover [data-picker-panel="date"] {
    height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important;
}
body > .date-picker-backdrop { z-index: 2147483200 !important; }
@media (max-width: 720px) {
    body > .checkout-birth-popover {
        top: auto !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        width: 100% !important; max-width: none !important; max-height: calc(100dvh - env(safe-area-inset-top) - 10px) !important;
        padding: 18px 18px calc(22px + env(safe-area-inset-bottom)) !important; transform: none !important;
        border-radius: 24px 24px 0 0 !important; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    }
    body > .checkout-birth-popover .picker-popover-top {
        position: sticky; z-index: 2; top: -18px; margin: -18px -18px 14px; padding: 18px 18px 13px;
        background: rgba(255,255,255,.98); border-bottom: 1px solid #e6ebf1;
    }
    body > .checkout-birth-popover .calendar-day { min-height: 42px !important; }
}

/* v5.28 – Such- und Geburtsdatum-Datepicker strikt trennen */
body.search-date-picker-open > .date-picker-backdrop,
.date-picker-backdrop.is-search-context {
    z-index: 150 !important;
    backdrop-filter: blur(2px) !important;
}
body.birthdate-picker-open > .date-picker-backdrop,
.date-picker-backdrop.is-birth-context {
    z-index: 2147483200 !important;
}

/* Search date/time pickers remain compact and are never affected by the
   checkout birthdate bottom-sheet rules. */
.picker-popover--search {
    z-index: 270 !important;
}

@media (max-width: 720px) {
    .picker-popover--search {
        position: fixed !important;
        z-index: 151 !important;
        top: auto !important;
        right: 10px !important;
        bottom: calc(10px + env(safe-area-inset-bottom)) !important;
        left: 10px !important;
        width: auto !important;
        max-width: none !important;
        max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px) !important;
        margin: 0 !important;
        padding: 13px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        transform: none !important;
        border: 1px solid #cfd9e5 !important;
        border-radius: 19px !important;
        box-shadow: 0 24px 65px rgba(16,33,63,.22) !important;
    }

    .picker-popover--search .calendar-shell,
    .picker-popover--search .calendar-days,
    .picker-popover--search [data-picker-panel="date"] {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}


/* v6.1 provider comparison: provider metadata stays inside the media column.
   Only vehicle-media, offer-main and offer-price participate in the offer-card grid. */
.vehicle-source-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 12px;
    max-width: 100%;
}
.vehicle-source-pills .supplier-pill { margin-top: 0; }
.provider-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    max-width: 100%;
    padding: 4px 10px;
    border: 1px solid #dbe7fb;
    border-radius: 999px;
    background: #eef4ff;
    color: #174ea6;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: .01em;
    overflow-wrap: anywhere;
}
@media (max-width: 720px) {
    .vehicle-source-pills { margin-top: 9px; }
}

/* v6.4 – eigenständig scrollbare Filtersidebar */
.filter-panel {
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

@media (min-width: 981px) {
    .filter-panel {
        top: 88px;
        max-height: calc(100dvh - 104px);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .filter-panel-header {
        position: sticky;
        top: 0;
        z-index: 5;
        border-bottom: 1px solid #edf0f4;
        background: rgba(255, 255, 255, .98);
    }
}

@media (max-width: 980px) {
    .filter-panel {
        display: block !important;
        padding-bottom: calc(22px + env(safe-area-inset-bottom)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .filter-panel-header {
        position: sticky !important;
        top: 0 !important;
    }
}


/* v6.5 – sichtbarer Vollkasko-Status, kompakte Benefits und Smart-Sticky-Filter */
.benefit-item-label {
    min-width: 0;
    max-width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.benefit-item-label.has-tooltip {
    cursor: help;
    text-decoration: underline dotted rgba(16, 88, 99, .48);
    text-underline-offset: 3px;
}
.benefit-group-protection .benefit-item-label {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
}
.insurance-summary-copy strong {
    line-height: 1.25;
}
.insurance-summary-copy small {
    line-height: 1.35;
}

@media (min-width: 981px) {
    .offers-layout {
        align-items: stretch;
    }
    .filter-panel {
        position: sticky;
        top: var(--filter-sticky-top, 88px) !important;
        align-self: start;
        max-height: none !important;
        overflow: visible !important;
        overscroll-behavior: auto;
        scrollbar-gutter: auto;
    }
    .filter-panel-header {
        position: static !important;
        backdrop-filter: none;
    }
}

/* Mandatory age-related fee shown consistently on result, station and checkout views. */
.mandatory-fee-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 12px;
    padding: 11px 12px;
    border: 1px solid #efd19b;
    border-radius: 11px;
    color: #6d4a11;
    background: #fff9ed;
    font-size: 12px;
}
.mandatory-fee-notice.is-included {
    border-color: #b9dfcf;
    color: #245747;
    background: #effaf5;
}
.mandatory-fee-notice .mandatory-fee-icon {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: white;
    background: #c9851e;
    font-size: 12px;
    font-weight: 900;
}
.mandatory-fee-notice.is-included .mandatory-fee-icon { background: var(--green); }
.mandatory-fee-notice span:last-child { display: grid; gap: 2px; }
.mandatory-fee-notice strong { color: var(--navy); font-size: 12px; }
.mandatory-fee-notice small { color: inherit; font-size: 11px; line-height: 1.4; }
.fee-variant-offer { margin-bottom: 12px; }
.fee-variant-checkout { margin: 12px 0; }

/* Auto Europe Stripe Payment Element */
.stripe-payment-form{display:grid;gap:18px}.stripe-payment-element{min-height:120px;padding:16px;border:1px solid #dce3ec;border-radius:14px;background:#fff}.payment-status.is-ready .payment-status-indicator{background:#1ea672}.payment-status.is-error .payment-status-indicator{background:#c83535}.payment-status.is-error{border-color:#f0b8b8;background:#fff4f4}.stripe-payment-form .form-errors{margin:0}.stripe-payment-form .button[disabled]{opacity:.55;cursor:not-allowed}

.confirmation-flight-note {
    margin: 0 24px 22px;
    padding: 14px 16px;
    border: 1px solid #dce5ef;
    border-radius: 12px;
    background: #f6f9fc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.confirmation-flight-note span { color: #647187; font-size: .86rem; }
.confirmation-flight-note strong { color: #10213f; letter-spacing: .04em; }

/* v6.10 insurance profile */
.insurance-summary-copy strong {
    line-height: 1.35;
}
.insurance-summary-copy small {
    line-height: 1.35;
}
.insurance-profile-reimbursement .insurance-summary-icon {
    color: #0d6b55;
    background: #def7ed;
}
.insurance-profile-zero_excess .insurance-summary-icon {
    color: #0f6f77;
    background: #def7f8;
}
.insurance-profile-with_excess .insurance-summary-icon {
    color: #8b650b;
    background: #fff4d5;
}
.insurance-detail-primary {
    border: 1px solid #e3eaf0;
}
.insurance-reimbursement-note {
    margin: 2px 0 0;
    padding: 10px 11px;
    border-radius: 10px;
    background: #eef9f4;
    color: #185f4d;
    font-size: 10px;
    line-height: 1.45;
}


/* v6.11 – two complete, provider-neutral benefit columns */
.benefit-groups-modern.benefit-variant-offer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 10px;
}
.benefit-variant-offer .benefit-group {
    height: 100%;
    padding: 13px;
}
.benefit-variant-offer .benefit-group ul {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 7px;
}
.benefit-variant-offer .benefit-group li {
    min-width: 0;
    font-size: 10.5px;
    line-height: 1.42;
}
.benefit-variant-offer .benefit-item-label {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
}
.benefit-group-inclusions .benefit-group-icon {
    color: var(--cyan-dark);
    background: var(--mint);
}
@media (max-width: 860px) {
    .benefit-groups-modern.benefit-variant-offer {
        grid-template-columns: minmax(0, 1fr);
    }
    .benefit-variant-offer .benefit-group ul {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 560px) {
    .benefit-variant-offer .benefit-group ul {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* v6.12 – coverage-authoritative Auto Europe insurance and reordered filters */

/* v6.13 – whitelist-driven, provider-neutral benefit typography */
.benefit-group li,
.benefit-item-label,
.benefit-variant-offer .benefit-group li,
.benefit-variant-station .benefit-group li {
    font-weight: 400 !important;
}
.benefit-item-continuation {
    display: inline-block;
    margin-top: 1px;
    font-weight: 400;
}
.insurance-summary-copy strong,
.insurance-detail-list article strong {
    font-weight: 400 !important;
}
.insurance-summary-copy strong {
    display: block;
}
.benefit-highlight-list li {
    font-weight: 400 !important;
}


/* v6.14 – one qualifying tariff badge, dynamic filters and summary alignment */
.carefree-package-badge {
    position: absolute;
    z-index: 12;
    top: 14px;
    left: 14px;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 6px 11px;
    border: 1px solid rgba(116, 80, 0, .12);
    border-radius: 999px;
    color: #4b3500;
    background: linear-gradient(135deg, #ffe8a8, #f4c33e);
    box-shadow: 0 8px 20px rgba(91, 63, 0, .18);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .045em;
    text-transform: uppercase;
    cursor: help;
    outline: none;
}
.carefree-package-badge:focus-visible {
    box-shadow: 0 0 0 4px rgba(244, 195, 62, .28), 0 8px 20px rgba(91, 63, 0, .18);
}
.carefree-package-tooltip {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    width: min(340px, calc(100vw - 54px));
    padding: 15px 16px;
    border: 1px solid #d9e2ec;
    border-radius: 14px;
    color: #35445b;
    background: #fff;
    box-shadow: 0 18px 45px rgba(16, 33, 63, .22);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.45;
    letter-spacing: normal;
    text-transform: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
    pointer-events: none;
}
.carefree-package-tooltip::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 19px;
    width: 12px;
    height: 12px;
    border-left: 1px solid #d9e2ec;
    border-top: 1px solid #d9e2ec;
    background: #fff;
    transform: rotate(45deg);
}
.carefree-package-tooltip strong {
    display: block;
    margin-bottom: 7px;
    color: var(--navy);
    font-size: 12px;
    font-weight: 850;
}
.carefree-package-tooltip ul {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.carefree-package-tooltip li {
    position: relative;
    padding-left: 18px;
}
.carefree-package-tooltip li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--green);
    font-weight: 900;
}
.carefree-package-badge:hover .carefree-package-tooltip,
.carefree-package-badge:focus .carefree-package-tooltip,
.carefree-package-badge:focus-within .carefree-package-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.price-summary .tariff-considered {
    max-width: 150px;
    margin-left: auto;
    text-align: right;
    line-height: 1.35;
}
.filter-price-option.is-unavailable {
    opacity: .42;
}
.filter-price-option.is-unavailable input {
    cursor: not-allowed;
}
@media (max-width: 720px) {
    .carefree-package-badge { top: 11px; left: 11px; }
    .carefree-package-tooltip { width: min(320px, calc(100vw - 42px)); }
}


/* v6.15 – clearer benefit typography, package qualification and payment consents */
.spec-list {
    color: #33435a;
    font-size: 13.5px;
    font-weight: 500;
}
.benefit-variant-offer .benefit-group li {
    color: #34445a;
    font-size: 11.25px;
    line-height: 1.46;
}
.benefit-variant-station .benefit-group li {
    color: #34445a;
    font-size: 12.75px;
    line-height: 1.5;
}
.benefit-highlight-list li {
    color: #34445a;
    font-size: 11px;
    line-height: 1.45;
}
.benefit-highlight-copy {
    min-width: 0;
    display: block;
    overflow-wrap: anywhere;
}
.benefit-highlight-copy .benefit-item-continuation {
    display: block;
    margin-top: 2px;
}
.checkout-benefit-summary .insurance-summary-copy strong {
    font-size: 11px;
    color: #273950;
}
.checkout-benefit-summary .insurance-summary-copy small,
.insurance-detail-list small {
    color: #52647b;
}
.payment-instruction {
    margin: 2px 0 0;
    color: #42536a;
    font-size: 12px;
    line-height: 1.45;
}
.payment-consents {
    display: grid;
    gap: 0;
}
.payment-consents .booking-consent { margin: 4px 0 0; }
.consent-check a,
.consent-inline-link {
    color: var(--cyan-dark);
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.consent-inline-link {
    display: inline;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.consent-check label { cursor: pointer; }

/* Ergebnisansicht ohne redaktionellen Introblock (v6.17) */
.hero-results.results-no-intro { padding-top: 16px; padding-bottom: 22px; }
.hero-results.results-no-intro .hero-container { max-width: 1400px; }

/* v6.18 – checkout cleanup and calmer primary button typography */
.offer-price .button-primary,
.flow-actions .button-primary,
.payment-start-button,
.payment-actions .button-primary {
    font-weight: 700;
}

/* v6.20 – Markenbezug und Stationskurzübersicht in der Angebotskachel */
.vehicle-source-line {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    max-width: calc(100% - 18px);
    margin-top: 12px;
    padding: 6px 11px;
    border: 1px solid #dbe5ef;
    border-radius: 999px;
    background: rgba(255,255,255,.9);
    color: #516176;
    font-size: 11px;
    line-height: 1.25;
    text-align: center;
    box-shadow: 0 4px 12px rgba(16,33,63,.04);
}
.vehicle-source-line strong {
    font-weight: 800;
}
.vehicle-source-supplier { color: #34445a; }
.vehicle-source-provider { color: #174ea6; }
.vehicle-source-via { font-weight: 500; color: #6a788c; }

.offer-station-trigger {
    width: 100%;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    margin: -4px 0 14px;
    padding: 10px 12px;
    border: 1px solid #dbe5ef;
    border-radius: 12px;
    background: #f7fafc;
    color: #10213f;
    text-align: left;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
.offer-station-trigger:hover,
.offer-station-trigger:focus-visible {
    border-color: #82d8d4;
    background: #f0fbfa;
    box-shadow: 0 8px 20px rgba(14,87,94,.09);
    transform: translateY(-1px);
    outline: none;
}
.offer-station-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e4f7f5;
    color: #087f84;
    font-size: 18px;
}
.offer-station-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}
.offer-station-copy small {
    color: #6a788c;
    font-size: 10px;
    font-weight: 650;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.offer-station-copy strong {
    display: block;
    overflow: hidden;
    color: #20324d;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.offer-station-action {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #007d82;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.offer-station-action span { font-size: 18px; line-height: 1; }

.station-info-dialog { width: min(880px, calc(100% - 28px)); }
.station-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.station-info-card {
    position: relative;
    min-width: 0;
    padding: 20px;
    border: 1px solid #dbe5ef;
    border-radius: 16px;
    background: linear-gradient(145deg, #fff 0%, #f8fafc 100%);
    box-shadow: 0 10px 28px rgba(16,33,63,.06);
}
.station-info-card::before {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 0;
    width: 4px;
    border-radius: 0 4px 4px 0;
    background: #0eadad;
}
.station-info-card-return::before { background: #173b6c; }
.station-info-kicker {
    display: inline-block;
    margin-bottom: 8px;
    color: #087f84;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.station-info-card-return .station-info-kicker { color: #173b6c; }
.station-info-card h3 {
    margin: 0 0 7px;
    color: #10213f;
    font-size: 18px;
    line-height: 1.3;
}
.station-info-address {
    min-height: 38px;
    margin: 0 0 15px;
    color: #53647b;
    font-size: 12.5px;
    line-height: 1.5;
}
.station-info-address.is-placeholder { font-style: italic; color: #7a8798; }
.station-info-facts {
    display: grid;
    gap: 0;
    margin: 0;
    border-top: 1px solid #e5ebf1;
}
.station-info-facts > div {
    display: grid;
    grid-template-columns: minmax(105px, .8fr) minmax(0, 1.2fr);
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid #edf1f5;
}
.station-info-facts dt {
    color: #6b788a;
    font-size: 11px;
}
.station-info-facts dd {
    margin: 0;
    color: #243650;
    font-size: 11.5px;
    font-weight: 650;
    text-align: right;
    overflow-wrap: anywhere;
}
.station-info-note {
    margin-top: 14px;
    padding: 12px 13px;
    border-radius: 11px;
    background: #eaf8f7;
    color: #29485a;
}
.station-info-note strong { display: block; margin-bottom: 4px; font-size: 11px; }
.station-info-note p { margin: 0; font-size: 11px; line-height: 1.5; }

@media (max-width: 720px) {
    .vehicle-source-line { margin-top: 9px; padding: 5px 9px; }
    .offer-station-trigger {
        grid-template-columns: 32px minmax(0, 1fr);
        margin-bottom: 12px;
        padding: 9px 10px;
    }
    .offer-station-icon { width: 32px; height: 32px; }
    .offer-station-action {
        grid-column: 2;
        justify-self: start;
        margin-top: 1px;
        font-size: 10.5px;
    }
    .station-info-grid { grid-template-columns: 1fr; }
    .station-info-card { padding: 17px; }
    .station-info-facts > div { grid-template-columns: minmax(95px, .75fr) minmax(0, 1.25fr); }
}


/* v6.21 – unframed supplier/brand line and station shortcut below it */
.vehicle-source-line {
    max-width: calc(100% - 12px);
    margin-top: 12px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.vehicle-media .offer-station-trigger-media {
    width: calc(100% - 10px);
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 8px;
    margin: 11px 0 0;
    padding: 8px 9px;
    border-radius: 10px;
}
.vehicle-media .offer-station-trigger-media .offer-station-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 16px;
}
.vehicle-media .offer-station-trigger-media .offer-station-copy small { font-size: 9px; }
.vehicle-media .offer-station-trigger-media .offer-station-copy strong {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 10px;
    line-height: 1.25;
}
.vehicle-media .offer-station-trigger-media .offer-station-action {
    font-size: 9px;
    white-space: nowrap;
}
@media (max-width: 720px) {
    .vehicle-media .offer-station-trigger-media { max-width: 360px; }
}

/* v6.22 – breite Stationsinfo auf Desktop und ausgerichtete Preisdetails */
.offer-station-trigger-mobile {
    display: none;
}
.offer-station-trigger-desktop {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 11px;
    margin: -1px 0 14px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #f7fafc;
}
.offer-station-trigger-desktop .offer-station-icon {
    width: 36px;
    height: 36px;
}
.offer-station-trigger-desktop .offer-station-copy small {
    font-size: 9.5px;
}
.offer-station-trigger-desktop .offer-station-copy strong {
    overflow: visible;
    font-size: 11.5px;
    line-height: 1.35;
    text-overflow: clip;
    white-space: normal;
}
.offer-station-trigger-desktop .offer-station-action {
    white-space: nowrap;
}

/* Feste rechte Wertespalte: längere Gebührenhinweise bleiben bündig zu EUR-Werten. */
.flow-sidebar .price-summary > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(122px, 46%);
    align-items: start;
    column-gap: 12px;
}
.flow-sidebar .price-summary > div > strong {
    justify-self: stretch;
    margin-left: 0;
    text-align: right;
    line-height: 1.35;
}
.flow-sidebar .price-summary .tariff-considered,
.flow-sidebar .price-summary .price-summary-detail {
    max-width: none;
    margin-left: 0;
    text-align: right;
}

@media (max-width: 720px) {
    .offer-station-trigger-desktop {
        display: none;
    }
    .vehicle-media .offer-station-trigger-mobile {
        width: min(100%, 360px);
        display: grid;
        grid-template-columns: 32px minmax(0, 1fr) auto;
        gap: 8px;
        margin: 11px 0 0;
        padding: 9px 10px;
        border-radius: 10px;
    }
    .vehicle-media .offer-station-trigger-mobile .offer-station-icon {
        width: 32px;
        height: 32px;
        border-radius: 9px;
        font-size: 16px;
    }
    .vehicle-media .offer-station-trigger-mobile .offer-station-copy small {
        font-size: 9px;
    }
    .vehicle-media .offer-station-trigger-mobile .offer-station-copy strong {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: 10.5px;
        line-height: 1.3;
        white-space: normal;
    }
    .vehicle-media .offer-station-trigger-mobile .offer-station-action {
        align-self: center;
        font-size: 9.5px;
        white-space: nowrap;
    }
    .flow-sidebar .price-summary > div {
        grid-template-columns: minmax(0, 1fr) minmax(118px, 48%);
    }
}

/* v6.24 – Stationsdetails unter dem Versicherungsbereich */
.offer-station-trigger-after-insurance {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 11px;
    margin: 12px 0 0;
    padding: 11px 13px;
    border-radius: 12px;
    background: #f7fafc;
}
.offer-station-trigger-after-insurance .offer-station-copy strong {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    font-size: 11.5px;
    line-height: 1.4;
}
.offer-station-trigger-after-insurance .offer-station-action {
    align-self: center;
}
@media (max-width: 720px) {
    .offer-station-trigger-after-insurance {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 9px;
        margin-top: 10px;
        padding: 10px 11px;
    }
    .offer-station-trigger-after-insurance .offer-station-copy strong {
        font-size: 10.8px;
        line-height: 1.35;
    }
    .offer-station-trigger-after-insurance .offer-station-action {
        grid-column: 2;
        justify-self: start;
        margin-top: 1px;
        font-size: 10px;
    }
}

/* v6.28 – Farbangleichung an die freigegebenen MietwagenPRO-Mocks.
   Ausschließlich visuelle Überschreibungen; Seitenstruktur und Verhalten bleiben unverändert. */
:root {
    --navy: #091d63;
    --navy-2: #0b43ad;
    --cyan: #1c57d5;
    --cyan-dark: #1244b5;
    --mint: #eef4ff;
    --bg: #f5f7fb;
    --card: #ffffff;
    --text: #10245c;
    --muted: #687796;
    --border: #d8e1f1;
    --green: #0a8b5c;
    --green-bg: #eaf8f1;
    --orange: #ff5a00;
    --shadow: 0 16px 44px rgba(9, 35, 99, .11);
    --shadow-soft: 0 10px 30px rgba(9, 35, 99, .075);
    --focus-ring: 0 0 0 4px rgba(28, 87, 213, .15);
    --surface-soft: #f8faff;
    --surface-tint: #eef4ff;
}

body {
    color: var(--text);
    background:
        radial-gradient(circle at 88% 2%, rgba(28, 87, 213, .045), transparent 25%),
        linear-gradient(180deg, #f8faff 0%, var(--bg) 44%, #f7f8fc 100%);
}

:focus-visible { outline-color: rgba(28, 87, 213, .48); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--cyan); }

.site-header {
    background: linear-gradient(100deg, #0b3faa 0%, #062c88 58%, #051f6d 100%);
    box-shadow: 0 5px 18px rgba(3, 22, 76, .22);
}
.header-inner { min-height: 74px; }
.brand {
    position: relative;
    width: 265px;
    min-height: 42px;
    flex: 0 0 auto;
    gap: 0;
}
.brand::before {
    content: "";
    display: block;
    width: 258px;
    height: 38px;
    background: url("images/mietwagenpro-logo-white-orange.png") left center / contain no-repeat;
}
.brand > span { display: none !important; }
.mode-badge {
    color: #f2f6ff;
    background: rgba(4, 27, 92, .26);
    border-color: rgba(255,255,255,.30);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.mode-badge.mode-live { border-color: rgba(255, 165, 88, .55); }

.hero {
    background:
        radial-gradient(circle at 83% 12%, rgba(74, 128, 255, .20), transparent 28%),
        linear-gradient(125deg, #08296f 0%, #0b43ad 58%, #0a64ad 100%);
}
.hero-home.hero-home-image {
    background:
        linear-gradient(90deg,
            rgba(5, 32, 91, .79) 0%,
            rgba(8, 52, 113, .64) 38%,
            rgba(20, 86, 139, .27) 68%,
            rgba(8, 54, 110, .08) 100%),
        url("images/hintergrund.jpg") center 35% / cover no-repeat;
}
.hero::before { opacity: .035; }
.hero .eyebrow { color: rgba(255,255,255,.92); }
.hero-copy > p:last-child,
.hero-home.hero-home-image .hero-copy > p:last-of-type { color: rgba(255,255,255,.92); }
.hero-points { color: #f7f9ff; }
.hero-points span {
    color: #1649b7;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(7, 35, 100, .18);
}

.search-card {
    border-color: rgba(213, 223, 242, .86);
    box-shadow: 0 22px 60px rgba(5, 28, 83, .21);
}
.search-card-kicker, .eyebrow, .category-label, .filter-kicker,
.station-type, .confirmation-trip-grid article > span { color: var(--cyan-dark); }
.search-card-heading strong, h1, h2, h3, h4,
.flow-card-header h2, .flow-card-header h3 { color: var(--navy); }
.secure-search-note {
    color: #123b9c;
    background: #f7faff;
    border: 1px solid #cbd9f2;
}
.secure-search-note > span { background: var(--cyan); }
.input-wrap svg { fill: var(--cyan); }
.input-wrap, .date-time, .picker-custom,
.field-age select, .field-passengers select,
.checkout-field input, .checkout-field select {
    border-color: #cad7ed;
    background: #fff;
}
.input-wrap:hover, .field-age select:hover, .field-passengers select:hover, .picker-custom:hover,
.checkout-field input:hover, .checkout-field select:hover { border-color: #9eb6e4; }
.input-wrap:focus-within, .date-time:focus-within,
.date-time-picker.is-open .picker-custom,
.field-age select:focus, .field-passengers select:focus,
.checkout-field input:focus, .checkout-field select:focus {
    border-color: var(--cyan);
    box-shadow: var(--focus-ring);
}

.button-primary {
    color: #fff;
    background: linear-gradient(180deg, #ff650d 0%, var(--orange) 100%);
    border-color: #f45100;
    box-shadow: 0 10px 24px rgba(255, 90, 0, .24);
}
.button-primary:not(:disabled):hover {
    background: linear-gradient(180deg, #f75a00 0%, #e94d00 100%);
    box-shadow: 0 12px 26px rgba(232, 75, 0, .27);
}
.button-secondary {
    color: var(--navy);
    border-color: #cbd8ed;
    background: #fff;
}
.button-secondary:not(:disabled):hover { border-color: #91abe0; background: #f7faff; }
.text-link, .flow-back, .return-to-results, .consent-check a,
.consent-inline-link, .payment-test-cards button { color: var(--cyan-dark); }

.trip-summary span {
    color: #18346f;
    border-color: #cedbf0;
    background: #f8faff;
}
.results-search-editor,
.offer-toolbar, .filter-panel, .filter-empty-state,
.flow-card, .offer-card, .info-card, .meta-card {
    border-color: var(--border);
    background-color: #fff;
    box-shadow: var(--shadow-soft);
}
.results-search-editor > summary { background: rgba(255,255,255,.98); }
.offer-toolbar-summary strong, .filter-panel-header h3 { color: var(--navy); }
.filter-count, .filter-switch input:checked + .filter-switch-track { background: var(--cyan); }
.active-filter-chip,
.filter-choice input:checked + span,
.filter-price-option:has(input:checked) {
    color: var(--cyan-dark);
    border-color: #a8bfee;
    background: #eef4ff;
}
.filter-price-option:has(input:checked) small { color: var(--cyan-dark); }

.offer-card { box-shadow: 0 10px 28px rgba(9, 35, 99, .075); }
.vehicle-media {
    background: linear-gradient(180deg, #fbfcff 0%, #f1f5fc 100%);
    border-color: var(--border);
}
.vehicle-media img { filter: drop-shadow(0 13px 12px rgba(9,35,99,.17)); }
.vehicle-source-provider { color: var(--cyan-dark); }
.offer-main h3, .offer-price strong { color: var(--navy); }
.spec-list li span, .offer-details summary { color: var(--cyan-dark); }
.offer-station-trigger,
.offer-station-trigger-desktop,
.offer-station-trigger-after-insurance,
.vehicle-media .offer-station-trigger-media,
.vehicle-media .offer-station-trigger-mobile {
    color: var(--navy);
    border-color: #d4dff0;
    background: #f8faff;
}
.offer-station-trigger:hover,
.offer-station-trigger:focus-visible {
    border-color: #95afe3;
    background: #f0f5ff;
    box-shadow: 0 8px 20px rgba(20, 68, 181, .10);
}
.offer-station-icon { color: var(--cyan-dark); background: #eaf1ff; }
.offer-station-action { color: var(--cyan-dark); }
.insurance-summary-icon { color: var(--cyan-dark); background: #eef4ff; }
.insurance-disclosure > summary:hover { background: #f5f8ff; }
.offer-ribbon { background: var(--orange); }

.flow-page { background: transparent; }
.flow-step {
    color: #72809b;
    border-color: #d6e0ef;
    background: #fff;
}
.flow-step span { background: #edf1f7; color: #7c899f; }
.flow-step.complete {
    color: #1645ae;
    border-color: #cbd9f2;
    background: #fff;
}
.flow-step.complete span { color: #fff; background: var(--cyan); }
.flow-step.active {
    color: var(--navy);
    border-color: var(--cyan);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(28,87,213,.09);
}
.flow-step.active span { background: var(--cyan); }
.confirmation-page .flow-step.complete {
    color: var(--green);
    border-color: #cae7da;
}
.confirmation-page .flow-step.complete span { background: var(--green); }
a.flow-step:hover { border-color: #9cb4e1; box-shadow: 0 6px 16px rgba(9,35,99,.08); }

.station-card, .customer-summary-grid div,
.confirmation-reference-grid > div,
.confirmation-trip-grid article,
.payment-parameter-grid div {
    border-color: var(--border);
    background: #fafcff;
}
.station-card::before, .station-info-card::before { background: var(--cyan); }
.station-card.return::before, .station-info-card-return::before { background: #2850a8; }
.station-note, .station-info-note { color: #28436e; background: #eef4ff; }
.selected-package { color: var(--cyan-dark); background: #edf3ff; }
.extra-option:hover { border-color: #aabde1; }
.extra-option.is-selected {
    border-color: var(--cyan);
    background: #f0f5ff;
    box-shadow: 0 0 0 3px rgba(28,87,213,.09);
}
.extra-option.is-selected .extra-check { border-color: var(--cyan); background: var(--cyan); }
.extra-price, .extra-option strong:last-child { color: var(--orange); }
.price-summary .price-total { color: var(--navy); }
.payment-placeholder-icon { color: var(--cyan-dark); background: #edf3ff; }

.test-environment-banner {
    color: #69400c;
    border-color: #f1c36f;
    background: linear-gradient(100deg, #fff9ed 0%, #fff5e2 100%);
}
.test-environment-banner strong { color: #6a4008; }
.payment-security-badge {
    color: #08744d;
    background: #eaf8f1;
}
.payment-status.is-loading .payment-status-indicator,
.payment-status.is-processing .payment-status-indicator { background: var(--cyan); }
@keyframes paymentPulse {
    0% { box-shadow: 0 0 0 0 rgba(28,87,213,.32); }
    70% { box-shadow: 0 0 0 8px rgba(28,87,213,0); }
    100% { box-shadow: 0 0 0 0 rgba(28,87,213,0); }
}
.payment-frame-loader span, .payment-auth-spinner { border-top-color: var(--cyan); }
.payment-price-note, .confirmation-summary-total {
    color: #0b6747;
    background: linear-gradient(135deg, #eefaf4 0%, #e9f8f1 100%);
}
.payment-price-note strong, .confirmation-summary-total strong { color: #08734d; }

.confirmation-hero {
    border-color: #a8dbc8;
    background: linear-gradient(110deg, #f2fcf7 0%, #eaf8f1 100%);
}
.confirmation-reference-grid .confirmation-primary-reference {
    border-color: #9ed6c3;
    background: #effaf5;
}
.confirmation-reference-grid .confirmation-primary-reference strong { color: #08734d; }
.confirmation-security-note {
    border-color: #a8dbc8;
    background: #f2fcf7;
}

.modal-card, .station-info-card {
    border-color: var(--border);
    box-shadow: 0 20px 70px rgba(4, 23, 74, .22);
}
.modal-backdrop { background: rgba(3, 18, 62, .68); }
.toast { background: var(--navy); }

@media (max-width: 860px) {
    .header-inner { min-height: 66px; }
    .brand { width: 222px; min-height: 34px; }
    .brand::before { width: 216px; height: 31px; }
}

@media (max-width: 520px) {
    .header-inner { min-height: 60px; }
    .brand { width: 192px; min-height: 30px; }
    .brand::before { width: 188px; height: 27px; }
    .hero-home.hero-home-image {
        background-image:
            linear-gradient(180deg,
                rgba(5, 32, 91, .78) 0%,
                rgba(7, 47, 106, .53) 45%,
                rgba(8, 54, 110, .18) 100%),
            url("images/hintergrund.jpg");
    }
}

/* v6.29 – gezielte visuelle Nachkorrekturen ohne Struktur- oder Funktionsänderung */

/* Die allgemeine dunkelblaue Überschriftenfarbe darf den Hero nicht überstimmen. */
.hero .hero-copy h1 {
    color: #ffffff;
    text-shadow: 0 2px 10px rgba(3, 22, 76, .16);
}

/* Saubere Rundungen der kompakten Ergebnissuche trotz overflow: visible
   (wird für die vorhandenen Autocomplete-Ebenen benötigt). */
.results-search-editor {
    border-color: #cedaf0;
    background: #ffffff;
    isolation: isolate;
}
.results-search-editor > summary {
    border-radius: 17px;
    background: #ffffff;
    background-clip: padding-box;
}
.results-search-editor[open] > summary {
    border-radius: 17px 17px 0 0;
}
.results-search-editor-body {
    border-radius: 0 0 17px 17px;
    background: #ffffff;
    background-clip: padding-box;
}

/* Alle Einträge im aufgeklappten Versicherungsbereich als einheitliche Karten. */
.insurance-detail-list article {
    border: 1px solid #e3eaf0;
    background: #ffffff;
}

/* v6.30 – kompakter, durchgehender Ergebnis-Header */
body.has-results .site-header,
body.has-results .hero-results {
    background: linear-gradient(90deg, #0b49b3 0%, #083591 58%, #062878 100%);
}

body.has-results .site-header {
    box-shadow: none;
}

body.has-results .header-inner {
    min-height: 66px;
}

body.has-results .hero-results.results-no-intro {
    padding-top: 12px;
    padding-bottom: 20px;
}

body.has-results .hero-results::before {
    display: none;
}

body.has-results .results-search-editor {
    box-shadow: 0 12px 30px rgba(3, 24, 76, .16);
}

@media (max-width: 860px) {
    body.has-results .header-inner {
        min-height: 62px;
    }

    body.has-results .hero-results.results-no-intro {
        padding-top: 8px;
        padding-bottom: 16px;
    }
}

@media (max-width: 520px) {
    body.has-results .header-inner {
        min-height: 58px;
    }

    body.has-results .hero-results.results-no-intro {
        padding-top: 7px;
        padding-bottom: 14px;
    }
}

/* v6.34 – Angebotsliste im freigegebenen MietwagenPRO-Layout.
   Rein visuelle Anpassungen; Filter-, Sortier-, Buchungs- und Dialoglogik bleiben unverändert. */
body.has-results {
    background:
        radial-gradient(circle at 78% 0%, rgba(32, 91, 210, .07), transparent 31%),
        linear-gradient(180deg, #f7f9fd 0%, #f3f6fb 46%, #f7f9fc 100%);
}

body.has-results .container {
    width: min(1540px, calc(100% - 64px));
}

body.has-results .hero-results.results-no-intro .hero-container,
body.has-results .results-page-grid {
    max-width: 1540px;
}

body.has-results .hero-results.results-no-intro {
    padding-top: 10px;
    padding-bottom: 22px;
}

body.has-results .results-page-grid {
    margin-top: 14px;
    padding-bottom: 72px;
}

/* Kompakte Suchzusammenfassung wie im Mockup */
body.has-results .results-search-editor {
    border: 1px solid rgba(220, 228, 244, .98);
    border-radius: 16px;
    box-shadow: 0 14px 34px rgba(3, 25, 82, .15);
}
body.has-results .results-search-editor > summary {
    grid-template-columns: minmax(340px, 1.55fr) minmax(390px, 1fr) auto;
    gap: 0;
    min-height: 94px;
    padding: 16px 22px;
    border-radius: 16px;
}
body.has-results .results-search-route {
    gap: 16px;
    padding-right: 26px;
}
body.has-results .results-search-icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
    border-radius: 50%;
    color: #0b43ad;
    background: #edf3ff;
}
body.has-results .results-search-icon svg {
    width: 24px;
    height: 24px;
}
body.has-results .results-search-route small,
body.has-results .results-search-facts small {
    color: #1556d1;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .055em;
}
body.has-results .results-search-route strong {
    color: #081d62;
    font-size: 16px;
    line-height: 1.3;
}
body.has-results .results-search-facts {
    height: 100%;
    justify-content: stretch;
    gap: 0;
}
body.has-results .results-search-facts > span {
    min-width: 205px;
    justify-content: center;
    padding: 0 28px;
    border-left: 1px solid #dbe3f1;
}
body.has-results .results-search-facts > span:last-child {
    min-width: 155px;
}
body.has-results .results-search-facts strong {
    color: #081d62;
    font-size: 14px;
    line-height: 1.35;
}
body.has-results .results-search-action {
    min-height: 50px;
    margin-left: 18px;
    padding: 0 22px;
    border-color: #2f72eb;
    border-radius: 10px;
    color: #0751d5;
    background: #fff;
    box-shadow: 0 3px 10px rgba(15, 70, 183, .06);
    font-size: 13px;
}
body.has-results .results-search-action:hover {
    background: #f5f8ff;
}

/* Ergebnisleiste */
body.has-results .offer-toolbar {
    min-height: 60px;
    margin-bottom: 16px;
    padding: 10px 14px 10px 20px;
    border-color: #dde5f2;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(9, 35, 99, .055);
}
body.has-results .offer-toolbar-summary {
    display: flex;
    align-items: baseline;
    gap: 22px;
}
body.has-results .offer-toolbar-summary strong {
    font-size: 19px;
    line-height: 1.2;
}
body.has-results .offer-toolbar-summary small {
    font-size: 11px;
    font-weight: 650;
}
body.has-results .sort-control {
    gap: 14px;
}
body.has-results .sort-control span {
    color: #536689;
    font-size: 12px;
}
body.has-results .sort-control select {
    min-width: 200px;
    min-height: 42px;
    padding: 0 38px 0 16px;
    border-color: #d0daec;
    border-radius: 9px;
    color: #10245c;
    font-size: 12px;
    font-weight: 800;
}

/* Seitenlayout und Filter */
body.has-results .offers-layout {
    grid-template-columns: 310px minmax(0, 1fr);
    gap: 18px;
}
body.has-results .filter-panel {
    position: sticky;
    top: var(--filter-sticky-top, 82px) !important;
    max-height: none !important;
    overflow: visible !important;
    border-color: #e0e6f1;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(9, 35, 99, .07);
}
body.has-results .filter-panel-header {
    position: relative !important;
    min-height: 70px;
    padding: 18px 22px 15px;
    border-bottom: 1px solid #e5eaf3;
    background: #fff;
}
body.has-results .filter-panel-header > div {
    display: flex;
    align-items: center;
}
body.has-results .filter-kicker {
    display: none;
}
body.has-results .filter-panel-header h3 {
    margin: 0;
    font-size: 21px;
    letter-spacing: -.02em;
}
body.has-results .filter-reset {
    position: absolute;
    z-index: 7;
    top: 19px;
    right: 17px;
    width: auto;
    min-height: 32px;
    margin: 0;
    padding: 0 7px;
    border: 0;
    color: #0757dc;
    background: transparent;
    font-size: 10px;
    font-weight: 800;
    box-shadow: none;
}
body.has-results .filter-reset:hover {
    color: #063eaa;
    background: #f3f7ff;
}
body.has-results .filter-group {
    padding: 17px 22px;
    border-top-color: #e8edf5;
}
body.has-results .filter-group-collapsible {
    padding: 0;
}
body.has-results .filter-group legend,
body.has-results .filter-group-title > span,
body.has-results .filter-select-label > span,
body.has-results .filter-group-collapsible > summary {
    color: #14264f;
    font-size: 12px;
    font-weight: 850;
}
body.has-results .filter-group-collapsible > summary {
    min-height: 50px;
    padding: 14px 22px;
}
body.has-results .filter-group-collapsible > .filter-price-list {
    padding: 0 22px 16px;
}
body.has-results .filter-price-list {
    gap: 3px;
    margin-top: 9px;
}
body.has-results .filter-price-option {
    min-height: 34px;
    margin: 0 -5px;
    padding: 5px;
}
body.has-results .filter-option-main {
    gap: 9px;
}
body.has-results .filter-option-main input {
    width: 17px;
    height: 17px;
    flex-basis: 17px;
}
body.has-results .filter-option-main span {
    color: #263b69;
    font-size: 10.5px;
}
body.has-results .filter-price-option small {
    color: #64769b;
    font-size: 9.5px;
}

/* Angebotskarten */
body.has-results .offer-list {
    gap: 18px;
}
body.has-results .offer-card,
body.has-results .content-grid.without-sidebar .offer-card {
    grid-template-columns: clamp(210px, 22%, 268px) minmax(0, 1fr) clamp(230px, 22%, 278px);
    border: 1px solid #e1e7f1;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(9, 35, 99, .065);
}
body.has-results .offer-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 36px rgba(9, 35, 99, .095);
}
body.has-results .vehicle-media {
    justify-content: flex-start;
    padding: 46px 22px 22px;
    border-right: 1px solid #e4e9f2;
    background: #fff;
}
body.has-results .vehicle-media img {
    width: min(100%, 250px);
    height: 160px;
    margin-top: 4px;
    filter: drop-shadow(0 14px 12px rgba(9, 35, 99, .17));
}
body.has-results .vehicle-source-line {
    max-width: 100%;
    margin-top: 17px;
    color: #5c6d91;
    font-size: 11px;
    line-height: 1.35;
}
body.has-results .vehicle-source-supplier {
    color: #10245c;
}
body.has-results .vehicle-source-provider {
    color: #0755d4;
}
body.has-results .offer-main {
    padding: 28px 26px 20px;
}
body.has-results .offer-title-row {
    gap: 18px;
}
body.has-results .category-label {
    color: #0758d8;
    font-size: 11px;
    letter-spacing: .055em;
}
body.has-results .offer-main h3 {
    margin: 5px 0 2px;
    color: #071b5c;
    font-size: clamp(23px, 2vw, 28px);
    letter-spacing: -.025em;
}
body.has-results .similar {
    color: #7180a0;
    font-size: 13px;
}
body.has-results .availability {
    gap: 8px;
    padding: 6px 11px;
    color: #078343;
    background: #eaf8ef;
    font-size: 11px;
}
body.has-results .availability.is-on-request {
    color: #d56a00;
    background: #fff4e6;
}
body.has-results .spec-list {
    margin: 20px 0 16px;
    padding: 0 0 16px;
    gap: 10px 20px;
    border-bottom: 1px solid #e6ebf3;
    color: #263b69;
    font-size: 11px;
    font-weight: 600;
}
body.has-results .spec-list li {
    gap: 7px;
}
body.has-results .spec-list li span {
    width: 16px;
    color: #0758d8;
    font-size: 13px;
    text-align: center;
}
body.has-results .offer-benefits-modern {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}
body.has-results .offer-section-title {
    margin-bottom: 9px;
}
body.has-results .offer-section-title > span {
    color: #112650;
    font-size: 11px;
    font-weight: 850;
}
body.has-results .benefit-groups-modern {
    grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
    gap: 11px;
}
body.has-results .benefit-groups-modern .benefit-group {
    padding: 12px 14px;
    border-color: #dce5f3;
    border-radius: 11px;
    background: linear-gradient(145deg, #ffffff 0%, #f8faff 100%);
    box-shadow: none;
}
body.has-results .benefit-groups-modern .benefit-group header {
    margin-bottom: 7px;
}
body.has-results .benefit-groups-modern .benefit-group-icon {
    color: #0a52ca;
    background: #edf3ff;
}
body.has-results .benefit-group-heading h4 {
    color: #132858;
    font-size: 10.5px;
}
body.has-results .benefit-group-heading small {
    color: #6d7b9a;
    font-size: 9px;
}
body.has-results .benefit-variant-offer .benefit-group li {
    color: #263b69;
    font-size: 10px;
    line-height: 1.4;
}
body.has-results .benefit-groups-modern .benefit-group li svg {
    fill: #0758d8;
}
body.has-results .mandatory-fee-notice,
body.has-results .insurance-disclosure {
    margin-top: 10px;
}
body.has-results .insurance-disclosure > summary {
    min-height: 52px;
    border-radius: 11px;
}
body.has-results .offer-station-trigger-after-insurance {
    margin-top: 12px;
    padding: 11px 14px;
    border-color: #dbe4f2;
    border-radius: 10px;
    background: #f8faff;
}
body.has-results .offer-station-icon {
    color: #0758d8;
    background: #edf3ff;
}
body.has-results .offer-station-copy small {
    color: #7280a0;
}
body.has-results .offer-station-copy strong {
    color: #183064;
}
body.has-results .offer-station-action {
    color: #0758d8;
}

/* Preisbereich */
body.has-results .offer-price {
    justify-content: center;
    padding: 28px 20px;
    border-left: 1px solid #e2e7f0;
    background: #fff;
    text-align: center;
}
body.has-results .offer-price .price-label {
    margin-bottom: 6px;
    color: #7180a0;
    font-size: 12px;
}
body.has-results .offer-price > strong {
    color: #071b5c;
    font-size: clamp(33px, 3vw, 42px);
    line-height: 1.05;
}
body.has-results .offer-price .per-day {
    margin-top: 7px;
    color: #617397;
    font-size: 12px;
}
body.has-results .offer-price .tax-note {
    margin: 4px 0 22px;
    color: #6f7e9d;
    font-size: 10.5px;
}
body.has-results .offer-price .button-primary {
    min-height: 56px;
    border-radius: 10px;
    font-size: 14px;
    box-shadow: 0 10px 22px rgba(255, 90, 0, .22);
}
body.has-results .offer-price .text-link {
    padding-top: 14px;
    color: #0758d8;
    font-size: 11px;
}

/* Notebook- und Tabletbreiten */
@media (max-width: 1480px) {
    body.has-results .container {
        width: min(100% - 40px, 1380px);
    }
    body.has-results .offers-layout {
        grid-template-columns: 280px minmax(0, 1fr);
    }
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-columns: clamp(190px, 21%, 230px) minmax(0, 1fr) clamp(218px, 22%, 250px);
    }
    body.has-results .offer-main {
        padding-inline: 22px;
    }
    body.has-results .spec-list {
        gap: 9px 15px;
    }
}

@media (max-width: 1180px) {
    body.has-results .results-search-editor > summary {
        grid-template-columns: minmax(300px, 1fr) minmax(340px, .95fr) auto;
        padding-inline: 18px;
    }
    body.has-results .results-search-facts > span {
        min-width: 165px;
        padding-inline: 20px;
    }
    body.has-results .results-search-facts > span:last-child {
        min-width: 125px;
    }
    body.has-results .results-search-action {
        margin-left: 12px;
        padding-inline: 16px;
    }
    body.has-results .offers-layout {
        grid-template-columns: 1fr;
    }
    body.has-results .filter-toggle {
        display: inline-flex;
    }
    body.has-results .filter-panel {
        position: fixed !important;
        z-index: 120;
        top: 0 !important;
        right: 0;
        bottom: 0;
        width: min(380px, calc(100% - 24px));
        max-height: 100dvh !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-radius: 18px 0 0 18px;
        transform: translateX(105%);
        transition: transform .22s ease;
    }
    body.has-results .filter-panel.is-open {
        transform: translateX(0);
    }
    body.has-results .filter-close {
        display: grid;
        place-items: center;
    }
    body.has-results .filter-panel-header h3 {
        padding-right: 90px;
    }
    body.has-results .filter-reset {
        top: 18px;
        right: 54px;
    }
    body.has-results .filter-backdrop {
        position: fixed;
        z-index: 110;
        inset: 0;
        display: block;
        border: 0;
        background: rgba(4, 19, 58, .55);
        backdrop-filter: blur(2px);
    }
    body.has-results .filter-backdrop[hidden] {
        display: none;
    }
}

@media (max-width: 930px) {
    body.has-results .container {
        width: calc(100% - 28px);
    }
    body.has-results .results-search-editor > summary {
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 13px;
        min-height: 0;
    }
    body.has-results .results-search-route {
        padding-right: 12px;
    }
    body.has-results .results-search-facts {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: stretch;
        border-top: 1px solid #e2e8f2;
    }
    body.has-results .results-search-facts > span {
        flex: 1 1 50%;
        min-width: 0;
        padding: 12px 18px 0;
        border-left: 0;
    }
    body.has-results .results-search-facts > span + span {
        border-left: 1px solid #e2e8f2;
    }
    body.has-results .results-search-action {
        grid-column: 2;
        grid-row: 1;
        margin-left: 0;
    }
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-columns: 205px minmax(0, 1fr);
    }
    body.has-results .offer-price {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: auto minmax(130px, auto) minmax(220px, 310px);
        align-items: center;
        gap: 4px 18px;
        padding: 18px 22px;
        border-top: 1px solid #e2e7f0;
        border-left: 0;
        text-align: left;
    }
    body.has-results .offer-price .price-label,
    body.has-results .offer-price .per-day,
    body.has-results .offer-price .tax-note {
        grid-column: 1;
        margin: 0;
    }
    body.has-results .offer-price > strong {
        grid-column: 2;
        grid-row: 1 / span 3;
        font-size: 34px;
        white-space: nowrap;
    }
    body.has-results .offer-price .select-offer-form {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
    body.has-results .offer-price .text-link {
        grid-column: 3;
        grid-row: 3;
        padding: 0;
        text-align: center;
    }
    body.has-results .offer-price .reference,
    body.has-results .offer-price .tariff-code {
        grid-column: 1 / -1;
    }
}

/* Smartphone */
@media (max-width: 720px) {
    body.has-results .container {
        width: calc(100% - 18px);
    }
    body.has-results .header-inner {
        min-height: 58px;
    }
    body.has-results .brand {
        width: 185px;
        min-height: 29px;
    }
    body.has-results .brand::before {
        width: 181px;
        height: 27px;
    }
    body.has-results .hero-results.results-no-intro {
        padding: 7px 0 12px;
    }
    body.has-results .results-page-grid {
        margin-top: 10px;
    }
    body.has-results .results-search-editor > summary {
        padding: 12px;
        row-gap: 11px;
    }
    body.has-results .results-search-icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }
    body.has-results .results-search-route {
        gap: 10px;
    }
    body.has-results .results-search-route strong {
        font-size: 12px;
        white-space: normal;
    }
    body.has-results .results-search-action {
        min-height: 38px;
        padding: 0 10px;
    }
    body.has-results .results-search-action span {
        display: none;
    }
    body.has-results .results-search-facts {
        display: flex;
        gap: 0;
        padding-left: 0;
    }
    body.has-results .results-search-facts small {
        font-size: 8px;
    }
    body.has-results .results-search-facts strong {
        font-size: 10.5px;
        white-space: normal;
    }
    body.has-results .offer-toolbar {
        gap: 9px;
        padding: 12px;
    }
    body.has-results .offer-toolbar-summary {
        display: grid;
        gap: 1px;
    }
    body.has-results .offer-toolbar-summary strong {
        font-size: 17px;
    }
    body.has-results .filter-toggle,
    body.has-results .sort-control {
        flex: 1 1 calc(50% - 5px);
        width: auto;
    }
    body.has-results .filter-toggle {
        min-width: 118px;
    }
    body.has-results .sort-control {
        display: block;
    }
    body.has-results .sort-control span {
        display: none;
    }
    body.has-results .sort-control select {
        width: 100%;
        min-width: 0;
    }
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-columns: minmax(0, 1fr) !important;
        border-radius: 15px;
    }
    body.has-results .vehicle-media {
        grid-column: 1;
        padding: 36px 15px 14px !important;
        border-right: 0;
        border-bottom: 1px solid #e3e8f1;
    }
    body.has-results .vehicle-media img {
        width: min(100%, 300px);
        height: 145px !important;
    }
    body.has-results .vehicle-source-line {
        margin-top: 10px;
    }
    body.has-results .offer-main {
        grid-column: 1;
        padding: 18px 15px !important;
    }
    body.has-results .offer-title-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
    }
    body.has-results .offer-main h3 {
        font-size: 22px;
    }
    body.has-results .spec-list {
        gap: 8px 13px;
        font-size: 10.5px;
    }
    body.has-results .benefit-groups-modern {
        grid-template-columns: minmax(0, 1fr);
    }
    body.has-results .benefit-variant-offer .benefit-group ul {
        grid-template-columns: minmax(0, 1fr);
    }
    body.has-results .offer-station-trigger-after-insurance {
        grid-template-columns: 32px minmax(0, 1fr);
    }
    body.has-results .offer-station-trigger-after-insurance .offer-station-action {
        grid-column: 2;
    }
    body.has-results .offer-price {
        grid-column: 1;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 5px 12px !important;
        padding: 16px 15px 17px !important;
        text-align: left !important;
    }
    body.has-results .offer-price .price-label,
    body.has-results .offer-price .per-day {
        grid-column: 1;
    }
    body.has-results .offer-price > strong {
        grid-column: 2;
        grid-row: 1 / span 2;
        font-size: 27px;
        text-align: right;
    }
    body.has-results .offer-price .tax-note,
    body.has-results .offer-price .select-offer-form,
    body.has-results .offer-price .text-link,
    body.has-results .offer-price .reference,
    body.has-results .offer-price .tariff-code {
        grid-column: 1 / -1 !important;
        grid-row: auto;
    }
    body.has-results .offer-price .tax-note {
        margin: 2px 0 8px;
    }
    body.has-results .offer-price .button-primary {
        min-height: 52px;
    }
}

@media (max-width: 430px) {
    body.has-results .results-search-facts > span {
        padding-inline: 9px;
    }
    body.has-results .offer-toolbar-summary small {
        font-size: 9px;
    }
    body.has-results .filter-toggle,
    body.has-results .sort-control {
        flex-basis: 100%;
    }
    body.has-results .filter-panel {
        width: calc(100% - 12px);
    }
}

/* v6.35 – Stationszeile über die gesamte linke Angebotsfläche */
body.has-results .offer-card,
body.has-results .content-grid.without-sidebar .offer-card {
    grid-template-areas:
        "vehicle main price"
        "station station price";
    grid-template-rows: auto auto;
}
body.has-results .vehicle-media { grid-area: vehicle; }
body.has-results .offer-main { grid-area: main; }
body.has-results .offer-price { grid-area: price; }
body.has-results .offer-station-trigger-after-insurance {
    grid-area: station;
    align-self: end;
    width: auto;
    margin: 0 18px 18px;
    padding: 12px 15px;
}

@media (max-width: 930px) {
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-areas:
            "vehicle main"
            "station station"
            "price price";
    }
    body.has-results .offer-station-trigger-after-insurance {
        margin: 0 18px 18px;
    }
}

@media (max-width: 720px) {
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-areas:
            "vehicle"
            "main"
            "station"
            "price";
    }
    body.has-results .offer-station-trigger-after-insurance {
        width: auto;
        margin: 0 15px 15px;
        padding: 10px 11px;
    }
}

/* v6.39 – kompaktere Typografie ohne Änderungen an der Buchungslogik */
.checkout-page .flow-header h1,
.station-page .flow-header h1 {
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.14;
    letter-spacing: -.02em;
}

body.has-results .offer-main h3 {
    font-size: clamp(20px, 1.65vw, 24px);
    line-height: 1.22;
}

body.has-results .offer-price > strong {
    font-size: clamp(29px, 2.4vw, 36px);
}

@media (max-width: 930px) {
    body.has-results .offer-main h3 { font-size: 20px; }
    body.has-results .offer-price > strong { font-size: 30px; }
}

@media (max-width: 720px) {
    .checkout-page .flow-header h1,
    .station-page .flow-header h1 { font-size: 26px; }
    body.has-results .offer-main h3 { font-size: 19px; }
    body.has-results .offer-price > strong { font-size: 24px; }
}


/* v6.40 – stabiler Kartenumbruch im Notebook-Zwischenbereich */
@media (min-width: 931px) and (max-width: 1180px) {
    body.has-results .offer-card,
    body.has-results .content-grid.without-sidebar .offer-card {
        grid-template-columns: 205px minmax(0, 1fr);
        grid-template-areas:
            "vehicle main"
            "station station"
            "price price";
    }

    body.has-results .vehicle-media,
    body.has-results .offer-main,
    body.has-results .offer-price {
        min-width: 0;
    }

    body.has-results .offer-price {
        grid-column: 1 / -1;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(130px, auto) minmax(210px, 280px);
        align-items: center;
        gap: 4px 18px;
        padding: 18px 22px;
        border-top: 1px solid #e2e7f0;
        border-left: 0;
        text-align: left;
    }

    body.has-results .offer-price .price-label,
    body.has-results .offer-price .per-day,
    body.has-results .offer-price .tax-note {
        grid-column: 1;
        margin: 0;
    }

    body.has-results .offer-price > strong {
        grid-column: 2;
        grid-row: 1 / span 3;
        justify-self: end;
        max-width: 100%;
        white-space: nowrap;
    }

    body.has-results .offer-price .select-offer-form {
        grid-column: 3;
        grid-row: 1 / span 2;
        width: 100%;
        min-width: 0;
    }

    body.has-results .offer-price .select-offer-form .button {
        width: 100%;
        min-width: 0;
    }

    body.has-results .offer-price .text-link {
        grid-column: 3;
        grid-row: 3;
        padding: 0;
        text-align: center;
    }

    body.has-results .offer-price .reference,
    body.has-results .offer-price .tariff-code {
        grid-column: 1 / -1;
    }
}

/* v6.45 – primäre Buchungsaktion in der linken Aktionsspalte zentrieren */
.payment-actions-submit-left .button-primary {
    grid-column: 1;
    justify-self: center;
    width: min(100%, 390px);
}
.hosted-payment-card[data-hosted-payment] .payment-actions-submit-left {
    margin-top: 18px;
}
.benefit-groups-modern.benefit-variant-confirmation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.benefit-variant-confirmation .benefit-group {
    height: 100%;
    padding: 14px;
}
.benefit-variant-confirmation .benefit-group li {
    font-size: 12px;
    line-height: 1.5;
}
.confirmation-empty-state {
    padding: 13px 14px;
    border: 1px dashed #bec9d6;
    border-radius: 11px;
    color: var(--muted);
    background: #fafbfd;
    font-size: 12px;
}
@media (max-width: 720px) {
    .payment-actions-submit-left .button-primary {
        grid-column: 1;
        width: 100%;
    }
    .benefit-groups-modern.benefit-variant-confirmation {
        grid-template-columns: 1fr;
    }
}


/* v6.51 – mobile Angebotsseiten und Checkout-Reihenfolge */
@media (max-width: 1060px) {
    .checkout-flow-layout > .flow-sidebar { order: -1; }
    .checkout-flow-layout > .flow-stack { order: 0; }
}
@media (max-width: 720px) {
    body.has-results .offer-pagination:not([hidden]) { display: grid; }
}

/* v6.52 – Angebots-Pagination auch gegen spätere mobile Grid-Regeln absichern */
body.has-results .offer-card[hidden],
body.has-results .offer-card.is-filtered-out,
body.has-results .offer-card.is-page-hidden,
body.has-results .content-grid.without-sidebar .offer-card[hidden],
body.has-results .content-grid.without-sidebar .offer-card.is-filtered-out,
body.has-results .content-grid.without-sidebar .offer-card.is-page-hidden {
    display: none !important;
}

/* v6.53 – echte serverseitige Angebotsseiten und identische Stationsansicht */
.pagination-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.pagination-button.is-disabled {
    cursor: default;
    opacity: .42;
    pointer-events: none;
}

@media (max-width: 720px) {
    /* Mobil dieselben Stationsinformationen wie auf dem Desktop direkt zeigen. */
    .station-details-disclosure {
        margin-top: 0;
    }
    .station-details-disclosure > summary {
        display: none !important;
    }
    .station-details-disclosure > .station-meta,
    .station-details-disclosure:not([open]) > .station-meta,
    .station-details-disclosure[open] > .station-meta {
        display: grid !important;
        margin-top: 15px;
    }
}


/* v6.54 – schnelle AJAX-Pagination bei weiterhin maximal 15 ausgelieferten Karten */
.offer-explorer.is-loading .offer-list,
.offer-explorer.is-loading [data-offer-pagination-container] {
    opacity: .58;
    pointer-events: none;
    transition: opacity .16s ease;
}
.offer-explorer.is-loading .offer-list {
    min-height: 280px;
}