/* =====================================================================
   Struktur- und Design-Styles aller CMS-Inhaltsblöcke.
   Wird vom Renderer automatisch in jede Seite injiziert.

   Farbschema & Schriften kommen aus dem Layout-Designer als CSS-Variablen
   (mit Standardwerten als Fallback):
   --cms-primary, --cms-accent, --cms-text, --cms-bg, --cms-surface,
   --cms-font-heading, --cms-font-body
   ===================================================================== */

:root {
    --cms-primary: #4f46e5;
    --cms-accent: #f59e0b;
    --cms-text: #1e293b;
    --cms-bg: #ffffff;
    --cms-surface: #f1f5f9;
}

/* :where() hält die Spezifität bei 0, damit der Admin-Editor (der diese
   Datei für die WYSIWYG-Vorschau lädt) sein eigenes Body-Styling behält. */
:where(body) {
    background: var(--cms-bg);
    color: var(--cms-text);
    font-family: var(--cms-font-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
}
:where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--cms-font-heading, inherit);
}

/* ===== Zeilen & flexible Spalten (12er-Raster) ===== */
.cms-row {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 28px;
    margin-bottom: 28px;
}
.cms-col { grid-column: span var(--span, 12); min-width: 0; }
@media (max-width: 768px) {
    .cms-row { gap: 16px; }
    .cms-col { grid-column: span 12; }
}

/* Element über die volle Browserbreite ausbrechen lassen (z. B. Hero) */
.cms-fullwidth {
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

/* Zeile mit vollbreiter Hintergrundfarbe (aus den Zeilen-Einstellungen) */
.cms-section {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-bottom: 28px;
}
.cms-section > .cms-row {
    max-width: 1100px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Wrapper für Block-Gestaltung (Abstände/Farben ohne CSS) */
.cms-block { min-width: 0; }

/* ===== Überschrift ===== */
.cms-heading { margin: 0 0 .5em; letter-spacing: -.3px; }
h1.cms-heading { font-size: 2.3em; }
.cms-heading.cms-v-accent-line { padding-bottom: .3em; position: relative; }
.cms-heading.cms-v-accent-line::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 64px; height: 4px; border-radius: 2px; background: var(--cms-primary);
}
.cms-heading.cms-v-boxed {
    display: inline-block; background: var(--cms-primary); color: #fff;
    padding: .25em .6em; border-radius: .35em;
}
.cms-heading.cms-v-centered { text-align: center; }
.cms-heading.cms-v-centered.cms-v-accent-line::after { left: 50%; transform: translateX(-50%); }

/* ===== Text ===== */
.cms-text p { margin: 0 0 1em; }
.cms-text.cms-v-infobox {
    background: var(--cms-surface); border-radius: 12px; padding: 18px 20px;
}
.cms-text.cms-v-note {
    background: color-mix(in srgb, var(--cms-accent) 12%, transparent);
    border-left: 4px solid var(--cms-accent);
    border-radius: 0 10px 10px 0; padding: 16px 20px;
}

/* ===== Bild ===== */
.cms-figure { margin: 0; }
.cms-figure img.cms-image { max-width: 100%; height: auto; border-radius: 12px; display: block; }
.cms-figure figcaption { font-size: .88em; color: color-mix(in srgb, var(--cms-text) 60%, transparent); padding-top: 7px; }
.cms-figure.cms-v-frame img.cms-image {
    border: 1px solid color-mix(in srgb, var(--cms-text) 15%, transparent);
    padding: 8px; background: #fff; border-radius: 8px;
}
.cms-figure.cms-v-shadow img.cms-image { box-shadow: 0 16px 40px rgba(0, 0, 0, .22); }
.cms-figure.cms-v-round img.cms-image { border-radius: 28px; }

/* ===== Galerie ===== */
.cms-gallery {
    display: grid;
    grid-template-columns: repeat(var(--cols, 3), 1fr);
    gap: 14px;
}
.cms-gallery .cms-gl-item { margin: 0; min-width: 0; }
.cms-gallery img {
    width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
    border-radius: 10px; display: block;
}
.cms-gallery .cms-gl-link { display: block; transition: transform .15s; }
.cms-gallery .cms-gl-link:hover { transform: scale(1.02); }
.cms-gallery figcaption { font-size: .85em; color: color-mix(in srgb, var(--cms-text) 60%, transparent); padding-top: 5px; }
.cms-gallery.cms-v-cards .cms-gl-item {
    background: var(--cms-surface); border-radius: 12px; padding: 10px;
}
.cms-gallery.cms-v-seamless { gap: 3px; }
.cms-gallery.cms-v-seamless img { border-radius: 0; }
@media (max-width: 768px) { .cms-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .cms-gallery { grid-template-columns: 1fr; } }

/* ===== Slider (Bilder) ===== */
.cms-imgslider {
    position: relative; height: var(--h, 420px);
    border-radius: 14px; overflow: hidden; background: #0f172a;
}
.cms-imgslider .cms-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s; }
.cms-imgslider .cms-slide.is-active { opacity: 1; z-index: 1; }
.cms-imgslider .cms-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cms-slide-caption {
    position: absolute; left: 0; right: 0; bottom: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, .65));
    color: #fff; padding: 26px 20px 14px; font-size: .95em;
}

/* ===== Hero (volle Breite) ===== */
.cms-hero {
    position: relative; height: var(--hero-h, 65vh); min-height: 320px;
    overflow: hidden; background: #0f172a; margin-bottom: 36px;
}
.cms-hero .cms-slide {
    position: absolute; inset: 0; opacity: 0; transition: opacity .8s;
    background-size: cover; background-position: center;
    display: flex; align-items: center; justify-content: center;
}
.cms-hero .cms-slide.is-active { opacity: 1; z-index: 1; }
.cms-hero-overlay { position: absolute; inset: 0; }
.cms-hero-overlay.is-light { background: rgba(0, 0, 0, .2); }
.cms-hero-overlay.is-medium { background: rgba(0, 0, 0, .42); }
.cms-hero-overlay.is-dark { background: rgba(0, 0, 0, .62); }
.cms-hero-content {
    position: relative; z-index: 2; text-align: center; color: #fff;
    max-width: 820px; padding: 0 24px;
}
.cms-hero-content h2 {
    font-size: clamp(1.9em, 5vw, 3.4em); margin: 0 0 .3em;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .45); letter-spacing: -.5px;
}
.cms-hero-content p {
    font-size: clamp(1em, 2vw, 1.25em); margin: 0 0 1.3em;
    text-shadow: 0 1px 10px rgba(0, 0, 0, .5);
}

/* ===== Slider-Steuerung (Slider + Hero) ===== */
.cms-slider-arrow {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
    width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer;
    background: rgba(255, 255, 255, .88); color: #0f172a;
    font-size: 19px; font-weight: 700; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: background .15s;
}
.cms-slider-arrow:hover { background: #fff; }
.cms-slider-arrow.is-prev { left: 14px; }
.cms-slider-arrow.is-next { right: 14px; }
.cms-slider-dots {
    position: absolute; left: 0; right: 0; bottom: 12px; z-index: 5;
    display: flex; justify-content: center; gap: 8px;
}
.cms-slider-dots button {
    width: 10px; height: 10px; border-radius: 50%; border: none; cursor: pointer;
    background: rgba(255, 255, 255, .55); padding: 0;
}
.cms-slider-dots button.is-active { background: #fff; transform: scale(1.25); }

/* ===== Lightbox ===== */
.cms-lightbox {
    position: fixed; inset: 0; z-index: 500;
    background: rgba(10, 12, 20, .93);
    display: flex; align-items: center; justify-content: center; flex-direction: column;
    padding: 30px;
}
.cms-lightbox img {
    max-width: 92vw; max-height: 82vh; border-radius: 8px;
    box-shadow: 0 20px 70px rgba(0, 0, 0, .6);
}
.cms-lightbox-caption { color: #e2e8f0; padding-top: 14px; font-size: .95em; }
.cms-lightbox-close, .cms-lightbox-prev, .cms-lightbox-next {
    position: fixed; z-index: 501; border: none; cursor: pointer;
    background: rgba(255, 255, 255, .12); color: #fff;
    width: 46px; height: 46px; border-radius: 50%; font-size: 20px;
}
.cms-lightbox-close:hover, .cms-lightbox-prev:hover, .cms-lightbox-next:hover { background: rgba(255, 255, 255, .28); }
.cms-lightbox-close { top: 18px; right: 18px; }
.cms-lightbox-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.cms-lightbox-next { right: 18px; top: 50%; transform: translateY(-50%); }

/* ===== Button ===== */
.cms-btn {
    display: inline-block; padding: 11px 22px; border-radius: 9px;
    font-weight: 700; text-decoration: none;
    transition: transform .12s, box-shadow .12s, background .12s;
}
.cms-btn:hover { transform: translateY(-1px); }
.cms-btn-primary { background: var(--cms-primary); color: #fff; }
.cms-btn-primary:hover { box-shadow: 0 6px 18px color-mix(in srgb, var(--cms-primary) 40%, transparent); }
.cms-btn-accent { background: var(--cms-accent); color: #fff; }
.cms-btn-accent:hover { box-shadow: 0 6px 18px color-mix(in srgb, var(--cms-accent) 40%, transparent); }
.cms-btn-outline { border: 2px solid var(--cms-primary); color: var(--cms-primary); }
.cms-btn-ghost { color: var(--cms-primary); background: color-mix(in srgb, var(--cms-primary) 10%, transparent); }
.cms-btn-sm { padding: 7px 14px; font-size: .9em; }
.cms-btn-lg { padding: 14px 30px; font-size: 1.08em; }

/* ===== Video ===== */
.cms-video { aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; }
.cms-video iframe, .cms-video video { width: 100%; height: 100%; border: none; display: block; }

/* ===== Zitat ===== */
.cms-quote {
    margin: 0; padding: 6px 0 6px 22px;
    border-left: 4px solid var(--cms-primary);
    font-size: 1.12em; font-style: italic;
}
.cms-quote p { margin: 0 0 .4em; }
.cms-quote cite {
    display: block; font-style: normal; font-size: .82em; font-weight: 700;
    color: color-mix(in srgb, var(--cms-text) 60%, transparent);
}
.cms-quote.cms-v-card {
    border-left: none; background: var(--cms-surface);
    padding: 24px 26px; border-radius: 14px;
}
.cms-quote.cms-v-big {
    border-left: none; text-align: center; font-size: 1.45em; padding: 28px 10px;
}
.cms-quote.cms-v-big::before {
    content: "\201C"; display: block; font-size: 2.6em; line-height: .6;
    color: var(--cms-primary); font-style: normal; margin-bottom: .25em;
}

/* ===== Akkordeon ===== */
.cms-accordion details {
    border: 1px solid color-mix(in srgb, var(--cms-text) 14%, transparent);
    border-radius: 10px; margin-bottom: 8px; overflow: hidden;
}
.cms-accordion summary {
    cursor: pointer; padding: 13px 16px; font-weight: 700; list-style: none;
    display: flex; align-items: center; justify-content: space-between;
}
.cms-accordion summary::-webkit-details-marker { display: none; }
.cms-accordion summary::after { content: "+"; font-size: 1.2em; color: var(--cms-primary); }
.cms-accordion details[open] summary::after { content: "–"; }
.cms-accordion details[open] summary { color: var(--cms-primary); }
.cms-acc-body { padding: 0 16px 14px; }
.cms-acc-body p { margin: 0 0 .8em; }
.cms-accordion.cms-v-cards details { border: none; background: var(--cms-surface); }

/* ===== News & Events ===== */
.cms-cards { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 22px; }
.cms-cards.is-list, .cms-cards.is-minimal { grid-template-columns: 1fr; gap: 0; }
.cms-card {
    background: var(--cms-surface); border-radius: 14px; overflow: hidden;
    transition: transform .15s, box-shadow .15s;
}
.cms-card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(0, 0, 0, .12); }
.cms-card-img { display: block; }
.cms-card-img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.cms-card-body { padding: 16px 18px 18px; }
.cms-card-body h3 { margin: 0 0 .4em; font-size: 1.08em; }
.cms-card-body h3 a { color: inherit; text-decoration: none; }
.cms-card-body h3 a:hover { color: var(--cms-primary); }
.cms-card-body p { margin: 0; font-size: .93em; color: color-mix(in srgb, var(--cms-text) 75%, transparent); }
.cms-card-date {
    font-size: .8em; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
    color: var(--cms-primary); margin-bottom: 6px;
}
.cms-card-location { font-size: .88em; margin-bottom: 6px; color: color-mix(in srgb, var(--cms-text) 70%, transparent); }
.cms-cards.is-list .cms-card, .cms-cards.is-minimal .cms-card {
    background: none; border-radius: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--cms-text) 12%, transparent);
}
.cms-cards.is-list .cms-card:hover, .cms-cards.is-minimal .cms-card:hover { transform: none; box-shadow: none; }
.cms-cards.is-minimal .cms-card-body { padding: 10px 0; }
.cms-cards.is-list .cms-card-body { padding: 14px 0; }
@media (max-width: 768px) { .cms-cards { grid-template-columns: 1fr; } }
.cms-empty { color: color-mix(in srgb, var(--cms-text) 55%, transparent); font-style: italic; }

/* ===== News-/Event-Detailseite ===== */
.cms-post { max-width: 780px; margin: 0 auto; }
.cms-post-meta {
    font-weight: 600; color: var(--cms-primary); margin-bottom: 18px;
}
.cms-post-image { width: 100%; border-radius: 14px; margin-bottom: 22px; }

/* ===== Sonstiges ===== */
.cms-divider { border: none; border-top: 1px solid color-mix(in srgb, var(--cms-text) 15%, transparent); margin: 8px 0; }

/* ===== Kontaktformular ===== */
.cms-form { display: grid; gap: 14px; max-width: 560px; }
.cms-form label { display: block; font-weight: 600; font-size: .9em; }
.cms-form input, .cms-form textarea {
    display: block; width: 100%; margin-top: 5px;
    padding: 10px 13px; font: inherit; color: inherit;
    border: 1px solid color-mix(in srgb, var(--cms-text) 22%, transparent);
    border-radius: 9px; background: var(--cms-bg); box-sizing: border-box;
}
.cms-form input:focus, .cms-form textarea:focus {
    outline: none; border-color: var(--cms-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--cms-primary) 18%, transparent);
}
.cms-form button { justify-self: start; border: none; cursor: pointer; font: inherit; }
.cms-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.cms-form-note { border-radius: 10px; padding: 14px 18px; margin-bottom: 14px; font-weight: 600; }
.cms-form-note.is-success { background: #dcfce7; color: #166534; }
.cms-form-note.is-error { background: #fee2e2; color: #991b1b; }

/* ===== Menü-Varianten ({{menu:dropdown|mega|vertical|simple}}) ===== */
.cms-menu { list-style: none; margin: 0; padding: 0; }
.cms-menu a { text-decoration: none; }

/* Dropdown (Standard): Hover-Aufklappmenü, beliebig tiefe Ebenen */
.cms-menu-dropdown { display: flex; flex-wrap: wrap; gap: 4px; }
.cms-menu-dropdown li { position: relative; }
.cms-menu-dropdown li.has-children > a::after { content: " ▾"; font-size: .72em; opacity: .7; }
.cms-menu-dropdown ul.submenu {
    display: none; position: absolute; top: 100%; left: 0; min-width: 210px;
    background: var(--cms-bg); color: var(--cms-text);
    border: 1px solid color-mix(in srgb, var(--cms-text) 15%, transparent);
    border-radius: 10px; box-shadow: 0 12px 34px rgba(0, 0, 0, .16);
    list-style: none; margin: 0; padding: 6px; z-index: 70;
}
.cms-menu-dropdown li.has-children:hover > ul.submenu,
.cms-menu-dropdown li.has-children:focus-within > ul.submenu { display: block; }
.cms-menu-dropdown ul.submenu ul.submenu { top: 0; left: 100%; }
.cms-menu-dropdown ul.submenu a { display: block; padding: 8px 12px; border-radius: 7px; color: inherit; font-weight: 500; }
.cms-menu-dropdown ul.submenu a:hover { background: var(--cms-surface); color: var(--cms-primary); }

/* Mega-Menü: breites Panel, Unterseiten als Spalten mit ihren Unterpunkten */
.cms-menu-mega { display: flex; flex-wrap: wrap; gap: 4px; position: relative; }
.cms-menu-mega > li.has-children > a::after { content: " ▾"; font-size: .72em; opacity: .7; }
.cms-mega-panel {
    display: none; position: absolute; top: 100%; left: 0; z-index: 80;
    background: var(--cms-bg); color: var(--cms-text);
    border: 1px solid color-mix(in srgb, var(--cms-text) 14%, transparent);
    border-radius: 14px; box-shadow: 0 22px 60px rgba(0, 0, 0, .2);
    padding: 24px 28px;
    width: max-content; min-width: 420px; max-width: min(92vw, 880px);
}
.cms-mega-panel::before { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
.cms-menu-mega > li:hover > .cms-mega-panel,
.cms-menu-mega > li:focus-within > .cms-mega-panel {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 18px 34px;
}
.cms-mega-head {
    display: block; font-weight: 800; margin-bottom: 8px; padding-bottom: 7px;
    color: var(--cms-text);
    border-bottom: 2px solid color-mix(in srgb, var(--cms-primary) 45%, transparent);
}
.cms-mega-head:hover { color: var(--cms-primary); }
.cms-mega-panel ul { list-style: none; margin: 0; padding: 0; }
.cms-mega-panel ul a {
    display: block; padding: 5px 0; font-weight: 500;
    color: color-mix(in srgb, var(--cms-text) 78%, transparent);
}
.cms-mega-panel ul a:hover { color: var(--cms-primary); }

/* Vertikal: eingerückte Baum-Liste für Sidebar oder Footer */
.cms-menu-vertical { display: block; }
.cms-menu-vertical li { display: block; }
.cms-menu-vertical a { display: block; padding: 7px 11px; border-radius: 8px; color: inherit; font-weight: 600; }
.cms-menu-vertical a:hover { background: var(--cms-surface); color: var(--cms-primary); }
.cms-menu-vertical ul.submenu {
    list-style: none; margin: 0 0 6px; padding-left: 14px;
    border-left: 2px solid color-mix(in srgb, var(--cms-primary) 35%, transparent);
}
.cms-menu-vertical ul.submenu a { font-weight: 500; font-size: .95em; }

/* Einfach: nur oberste Ebene */
.cms-menu-simple { display: flex; flex-wrap: wrap; gap: 4px; }

/* ===== Suchfeld & Suchergebnisse ===== */
.cms-search { display: flex; gap: 10px; max-width: 560px; }
.cms-search input {
    flex: 1; padding: 11px 14px; font: inherit; color: inherit;
    border: 1px solid color-mix(in srgb, var(--cms-text) 22%, transparent);
    border-radius: 9px; background: var(--cms-bg); min-width: 0;
}
.cms-search input:focus { outline: none; border-color: var(--cms-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cms-primary) 18%, transparent); }
.cms-search button { border: none; cursor: pointer; font: inherit; }
.cms-search-page { max-width: 780px; margin: 0 auto; }
.cms-search-count { font-weight: 600; margin: 22px 0 10px; }
.cms-search-hit { padding: 14px 0; border-bottom: 1px solid color-mix(in srgb, var(--cms-text) 12%, transparent); }
.cms-search-hit h3 { margin: 0 0 4px; }
.cms-search-hit p { margin: 0; color: color-mix(in srgb, var(--cms-text) 70%, transparent); font-size: .95em; }

/* ===== Karte (OpenStreetMap) ===== */
.cms-map { position: relative; border-radius: 12px; overflow: hidden; background: var(--cms-surface); }
.cms-map iframe { width: 100%; height: 100%; border: none; display: block; }
.cms-map-link {
    position: absolute; right: 10px; bottom: 10px; font-size: 12px; font-weight: 700;
    background: rgba(255, 255, 255, .92); color: #0f172a; padding: 4px 10px; border-radius: 999px; text-decoration: none;
}

/* ===== Team ===== */
.cms-team { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 22px; }
.cms-team-card { background: var(--cms-surface); border-radius: 14px; padding: 22px; text-align: center; }
.cms-team-card img { width: 110px; height: 110px; object-fit: cover; border-radius: 50%; margin-bottom: 12px; }
.cms-team-card h3 { margin: 0 0 2px; font-size: 1.05em; }
.cms-team-role { color: var(--cms-primary); font-weight: 700; font-size: .85em; margin-bottom: 8px; }
.cms-team-card p { margin: 0; font-size: .92em; color: color-mix(in srgb, var(--cms-text) 75%, transparent); }
@media (max-width: 768px) { .cms-team { grid-template-columns: 1fr; } }

/* ===== Preistabelle ===== */
.cms-pricing { display: grid; grid-template-columns: repeat(var(--cols, 3), 1fr); gap: 20px; align-items: start; }
.cms-price-card {
    background: var(--cms-surface); border-radius: 16px; padding: 26px 24px; text-align: center;
    border: 2px solid transparent;
}
.cms-price-card.is-highlight { border-color: var(--cms-primary); box-shadow: 0 14px 40px color-mix(in srgb, var(--cms-primary) 22%, transparent); }
.cms-price-card h3 { margin: 0 0 8px; }
.cms-price { font-size: 2em; font-weight: 800; color: var(--cms-primary); margin-bottom: 14px; }
.cms-price span { font-size: .45em; font-weight: 600; color: color-mix(in srgb, var(--cms-text) 60%, transparent); }
.cms-price-card ul { list-style: none; margin: 0 0 18px; padding: 0; }
.cms-price-card li { padding: 7px 0; border-bottom: 1px dashed color-mix(in srgb, var(--cms-text) 14%, transparent); font-size: .95em; }
.cms-price-card li:last-child { border-bottom: none; }
@media (max-width: 768px) { .cms-pricing { grid-template-columns: 1fr; } }

/* ===== Countdown ===== */
.cms-countdown { text-align: center; }
.cms-cd-title { font-weight: 800; font-size: 1.2em; margin-bottom: 12px; }
.cms-cd-grid { display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.cms-cd-cell { background: var(--cms-surface); border-radius: 12px; padding: 12px 16px; min-width: 78px; }
.cms-cd-cell b { display: block; font-size: 1.9em; color: var(--cms-primary); }
.cms-cd-cell span { font-size: .78em; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: color-mix(in srgb, var(--cms-text) 60%, transparent); }
.cms-cd-done { font-size: 1.35em; font-weight: 800; color: var(--cms-primary); }

/* ===== Social Media ===== */
.cms-social { display: flex; gap: 10px; flex-wrap: wrap; }
.cms-social a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--sc, var(--cms-primary)); color: #fff !important;
    font-weight: 800; font-size: 15px; text-decoration: none;
    transition: transform .12s;
}
.cms-social a:hover { transform: translateY(-2px) scale(1.06); }
.cms-social.is-small a { width: 34px; height: 34px; font-size: 12px; }
.cms-social.is-large a { width: 54px; height: 54px; font-size: 19px; }

/* ===== Sprachumschalter ({{languages}}) ===== */
.cms-langswitch { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.cms-langswitch a {
    display: block; padding: 5px 10px; border-radius: 7px;
    font-weight: 700; font-size: .82em; letter-spacing: .5px; text-decoration: none; color: inherit;
    opacity: .65;
}
.cms-langswitch li.is-active a, .cms-langswitch a:hover { opacity: 1; background: color-mix(in srgb, var(--cms-primary) 14%, transparent); color: var(--cms-primary); }

/* =====================================================================
   Feinschliff 1.8.1: vertikaler Rhythmus & schönere Blöcke
   ===================================================================== */

/* Abstand zwischen gestapelten Blöcken in einer Spalte */
.cms-team, .cms-pricing, .cms-countdown, .cms-social, .cms-map,
.cms-gallery, .cms-imgslider, .cms-video, .cms-accordion, .cms-cards,
.cms-quote, .cms-formwrap, .cms-search, .cms-figure, .cms-globalblock {
    margin-top: 0;
    margin-bottom: 28px;
}
.cms-col > :last-child { margin-bottom: 0; }
.cms-block { margin-bottom: 28px; }
.cms-block > * { margin-bottom: 0 !important; }

/* ===== Preistabelle – Feinschliff ===== */
.cms-pricing { gap: 26px; align-items: stretch; }
.cms-price-card {
    display: flex; flex-direction: column; position: relative;
    background: var(--cms-bg);
    border: 1px solid color-mix(in srgb, var(--cms-text) 13%, transparent);
    border-radius: 18px; padding: 34px 28px 28px;
    box-shadow: 0 6px 22px rgba(0, 0, 0, .06);
}
.cms-price-card.is-highlight {
    border: 2px solid var(--cms-primary);
    box-shadow: 0 18px 46px color-mix(in srgb, var(--cms-primary) 25%, transparent);
}
.cms-price-card.is-highlight::before {
    content: "Empfohlen";
    position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
    background: var(--cms-primary); color: #fff;
    font-size: .7em; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase;
    padding: 5px 16px; border-radius: 999px; white-space: nowrap;
}
.cms-price-card h3 { margin: 0 0 2px; font-size: 1.15em; letter-spacing: .3px; }
.cms-price { font-size: 2.7em; font-weight: 800; letter-spacing: -1.5px; margin: 4px 0 18px; }
.cms-price span {
    display: block; font-size: .3em; font-weight: 600; letter-spacing: 0;
    color: color-mix(in srgb, var(--cms-text) 55%, transparent); margin-top: 3px;
}
.cms-price-card ul { flex: 1; margin: 0 0 22px; text-align: left; }
.cms-price-card li {
    display: flex; align-items: baseline; gap: 10px;
    padding: 9px 0; font-size: .95em;
    border-bottom: 1px solid color-mix(in srgb, var(--cms-text) 8%, transparent);
}
.cms-price-card li::before {
    content: "✓"; font-weight: 800; color: var(--cms-primary); flex-shrink: 0;
}
.cms-price-card .cms-btn { display: block; text-align: center; margin-top: auto; }

/* ===== Team – Feinschliff ===== */
.cms-team { gap: 26px; }
.cms-team-card {
    background: var(--cms-bg);
    border: 1px solid color-mix(in srgb, var(--cms-text) 12%, transparent);
    border-radius: 18px; padding: 28px 22px;
    box-shadow: 0 6px 22px rgba(0, 0, 0, .05);
}
.cms-team-card img {
    width: 116px; height: 116px; margin-bottom: 14px;
    border: 4px solid color-mix(in srgb, var(--cms-primary) 22%, transparent);
}
.cms-team-role { letter-spacing: .8px; text-transform: uppercase; font-size: .76em; margin-bottom: 10px; }

/* ===== Countdown – Feinschliff ===== */
.cms-cd-title { font-size: 1.35em; margin-bottom: 16px; }
.cms-cd-cell {
    background: var(--cms-bg);
    border: 1px solid color-mix(in srgb, var(--cms-text) 12%, transparent);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .05);
    padding: 14px 18px; min-width: 86px;
}

/* ===== Social – Feinschliff ===== */
.cms-social a { box-shadow: 0 4px 12px color-mix(in srgb, var(--sc, #000) 35%, transparent); }
.cms-social a span { line-height: 1; }