/* --------------------------------------------------------------------------
   01 · Lokale Schriften und Grundtypografie
   -------------------------------------------------------------------------- */

@font-face {
    font-family: Gagalin;
    src: url("../fonts/gagalin-regular-webfont.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Titillium Web";
    src: url("../fonts/titillium-web-v14-latin-regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Titillium Web";
    src: url("../fonts/titillium-web-v14-latin-700.woff2") format("woff2");
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "IcoMoon Ultimate";
    src: url("../fonts/evv-icons.woff2") format("woff2");
    font-weight: 400;
    font-display: block;
}

body {
    background-color: #fafafa;
    font-family: "Titillium Web", sans-serif;
    line-height: 1.75;
}

button,
input,
select,
textarea {
    font: inherit;
}

/* --------------------------------------------------------------------------
   02 · Einstieg – responsives Raster und Bild
   -------------------------------------------------------------------------- */

.evv-hero {
    display: grid;
    color: #111;
    font: 1rem / 1.75 "Titillium Web", sans-serif;
    gap: clamp(1.5rem, 3vw, 2rem);
    width: min(100% - 2rem, 75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

.evv-hero > .content-element-group {
    min-width: 0;
}

.evv-hero .content-image figure {
    margin: 0;
}

.evv-hero .content-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0.75rem;
}

.evv-kompass-hero .content-image figure {
    padding: clamp(0.75rem, 2vw, 1.5rem);
    border-radius: 0.75rem;
    background: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-kompass-hero .content-hyperlink:has(+ .evv-kompass-meta) {
    margin-block-end: 0;
}

.evv-kompass-hero .evv-kompass-meta {
    margin-block: 0.375rem 0;
    font-size: 0.875rem;
    font-weight: 700;
    text-align: center;
}

.evv-kompass-hero .evv-kompass-meta p {
    margin-block: 0;
}

@media (min-width: 48rem) {
    .evv-hero {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* --------------------------------------------------------------------------
   03 · Einstieg – Überschrift und Hervorhebungen
   -------------------------------------------------------------------------- */

:is(.evv-hero, .evv-gipfel, .evv-cards-intro, .evv-angebot, .evv-feedback-intro, .evv-about, .evv-faq, .evv-phr, .evv-kompass-signup, .evv-kompass-section) .evv-kicker {
    display: inline-block;
    margin: 0 0 0.5rem;
    padding: 0.25rem 1rem;
    border-radius: 4px;
    background-color: #808080;
    color: #fff;
    font: 400 0.75rem / 1.2 Gagalin, sans-serif;
}

.evv-hero h1 {
    margin: 0 0 1rem;
    font: 400 clamp(1.5rem, 2.25vw, 1.75rem) / 1.5 Gagalin, sans-serif;
}

.evv-gipfel h2 mark,
.evv-angebot :is(h2, h3) mark,
.evv-feedback-intro h2 mark,
.evv-about mark,
.evv-faq h2 mark,
.evv-cards-intro h2 mark,
.evv-phr h2 mark,
.evv-kompass-signup h2 mark,
.evv-kompass-section h2 mark,
.evv-phr .rte > ul + p mark,
.evv-unsubscribe-card :is(h2, h3) mark,
.evv-hero h1 mark,
.evv-hero h1 .highlight {
    display: inline;
    color: inherit;
    background: linear-gradient(180deg, transparent 65%, #ceff00 65%);
}

.evv-kompass-signup {
    width: min(100% - 2rem, 42rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    scroll-margin-block-start: 8rem;
    color: #111;
    font: 1rem / 1.75 "Titillium Web", sans-serif;
}

.evv-kompass-signup h2 {
    margin: 0 0 1rem;
    font: 400 clamp(1.375rem, 3vw, 1.75rem) / 1.3 Gagalin, sans-serif;
}

/* --------------------------------------------------------------------------
   04 · Einstieg – Terminbutton
   -------------------------------------------------------------------------- */

:root {
    --evv-primary-cta-size: 1.0625rem;
    --evv-primary-cta-padding: 0.9375rem 1.875rem;
    --evv-compact-cta-size: 0.75rem;
}

@media (min-width: 1200px) {
    :root {
        --evv-primary-cta-size: 1.133rem;
        --evv-primary-cta-padding: 1rem 2rem;
        --evv-compact-cta-size: 0.8rem;
    }
}

@media (min-width: 1400px) {
    :root {
        --evv-primary-cta-size: 1rem;
        --evv-compact-cta-size: 0.875rem;
    }
}

:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink {
    margin-block-start: 1.5rem;
    text-align: center;
}

:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a {
    display: inline-block;
    padding: var(--evv-primary-cta-padding);
    border-radius: 5px;
    background: #005f6a;
    color: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    font: 400 var(--evv-primary-cta-size) / 1.2 Gagalin, sans-serif;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
}

:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a,
.evv-header-cta a,
:is(.evv-dialog-cta, .evv-card-dialog .content-hyperlink) a {
    transition: background-color 220ms ease-in-out, color 220ms ease-in-out;
}

:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a:hover,
:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a:focus-visible,
:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a:active {
    background-color: #ceff00;
    color: #111;
}

:is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a:focus-visible {
    outline: 2px solid #005f6a;
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    :is(.evv-hero, .evv-gipfel, .evv-angebot, .evv-faq, .evv-error-page, .evv-phr, .evv-kompass-section) .content-hyperlink a,
    .evv-header-cta a,
    :is(.evv-dialog-cta, .evv-card-dialog .content-hyperlink) a {
        transition: none;
    }
}

/* --------------------------------------------------------------------------
   05 · Kopfbereich – Kontaktleiste, Logo und Navigation
   -------------------------------------------------------------------------- */

body:has(header > .evv-contact) {
    margin: 0;
}

header:has(> .evv-logo) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1.5rem 1.5rem;
    padding: 1.5rem max(1rem, calc((100% - 75rem) / 2)) 1.25rem;
    background-color: #fafafa;
    color: #111;
    font: 1rem / 1.5 "Titillium Web", sans-serif;
}

.evv-contact-bar {
    background-color: #fafafa;
    color: #111;
    border-bottom: 2px solid #005f6a;
}

.evv-contact {
    display: flex;
    width: min(100% - 2rem, 75rem);
    margin-inline: auto;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 1.25rem;
    box-sizing: border-box;
    min-height: 2.75rem;
    font-size: 0.9375rem;
    line-height: 1.15;
}

.evv-contact > :first-child {
    margin-inline-end: auto;
}

.evv-contact a {
    color: inherit;
    text-decoration: none;
}

.evv-contact a:hover,
.evv-contact a:focus-visible {
    color: #005f6a;
    text-decoration: none;
}

.evv-contact > :is(span, a) {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.evv-contact > :is(span, a)::before {
    color: #005f6a;
    font: 400 1.125rem / 1 "IcoMoon Ultimate";
    content: var(--evv-contact-icon);
}

.evv-contact > span {
    --evv-contact-icon: "\ea4d";
}

.evv-contact a[href^="tel:"] {
    --evv-contact-icon: "\ea26";
}

.evv-contact a[href^="mailto:"] {
    --evv-contact-icon: "\ea31";
}

.evv-logo {
    justify-self: start;
}

.evv-logo img {
    display: block;
    max-width: 100%;
    height: auto;
}

.evv-nav {
    position: relative;
}

.evv-nav .invisible:not(:focus) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.evv-nav a.invisible:focus {
    position: absolute;
    z-index: 1;
    inset-block-start: 100%;
    inset-inline-end: 0;
    width: max-content;
    padding: 0.5rem 0.75rem;
    background-color: #fff;
}

.evv-nav:not(.navigation-main, .nav-wrapper) ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.evv-nav a,
.evv-nav strong {
    color: #005f6a;
    font: 400 1.125rem / 1.25 Gagalin, sans-serif;
}

:is(.evv-header-cta, .evv-dialog-cta, .evv-card-dialog .content-hyperlink) a {
    display: inline-block;
    padding: 0.625rem 1.5rem;
    border-radius: 5px;
    background-color: #005f6a;
    color: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    font: 400 var(--evv-compact-cta-size) / 1.2 Gagalin, sans-serif;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}

:is(.evv-header-cta, .evv-dialog-cta, .evv-card-dialog .content-hyperlink) a:is(:hover, :focus-visible) {
    background-color: #ceff00;
    color: #111;
}

@media (min-width: 48rem) {
    header > :is(.evv-nav, .nav-wrapper, .evv-header-cta) {
        align-self: end;
        margin-block-end: 0.5rem;
    }
}

@media (max-width: 47.999rem) {
    header:has(> .evv-logo) {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .evv-contact {
        padding-block: 0.5rem;
    }

    .evv-contact > :first-child {
        flex-basis: 100%;
    }

    .evv-nav {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}

/* Contao's accessible navigation uses a numeric viewport width in pixels. */
:root {
    --nav-breakpoint: 768;
}

header:has(> .evv-logo) {
    --nav-color: #005f6a;
    --nav-active-color: #005f6a;
    --nav-burger-line-color: #005f6a;
    --nav-mobile-background: #fafafa;
    --nav-mobile-color: #005f6a;
    --nav-mobile-active-background: #fff;
    --nav-mobile-active-color: #005f6a;
    --nav-mobile-active-border-color: #005f6a;
    --nav-mobile-btn-clr: #005f6a;
    --nav-mobile-separator-color: #ddd;
    --nav-mobile-icon: var(--nav-icon);
    --nav-submenu-background: #fafafa;
}

header .navigation-main :is(a, strong):not(.invisible) {
    font-family: Gagalin, sans-serif;
    font-weight: 400;
}

body.nav-is-desktop header .navigation-main .level_2 {
    min-inline-size: 12rem;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0 4px 15px rgb(17 17 17 / 15%);
}

body.nav-is-desktop header .navigation-main .level_2 li > :is(a, strong):is(:hover, :focus-visible),
body.nav-is-mobile header .navigation-main li > :is(a, strong):is(:hover, :focus-visible) {
    --nav-color: #fff;
    --nav-active-color: #fff;
    --nav-mobile-color: #fff;
    --nav-mobile-active-color: #fff;
    background-color: #005f6a;
    color: #fff;
}

body.nav-is-mobile header .navigation-main .level_2 {
    display: flex;
    flex-direction: column;
    padding-inline-start: 0.75rem;
}

body.nav-is-mobile header .navigation-main .level_1 > li > .btn-toggle-submenu {
    display: none;
}

body.nav-is-mobile header .navigation-main .level_2 > li > :is(a, strong) {
    font-size: var(--nav-mobile-font-size);
}

header .nav-burger:focus-visible {
    outline: 2px solid #005f6a;
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   06 · Kopfbereich – IcoMoon-Schnelllinks
   -------------------------------------------------------------------------- */

.evv-header-icons {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.evv-header-icons a {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    color: #111;
    text-decoration: none;
}

.evv-icon::before {
    font: 400 1.375rem / 1 "IcoMoon Ultimate";
    content: var(--evv-icon);
}

.evv-icon--search { --evv-icon: "\eb30"; }
.evv-icon--calendar { --evv-icon: "\ea60"; }
.evv-icon--whatsapp { --evv-icon: "\eef2"; }
.evv-icon--instagram { --evv-icon: "\eef1"; }
.evv-icon--linkedin { --evv-icon: "\ef28"; }

.evv-icon--left,
.evv-feedback .swiper-button-prev { --evv-icon: "\edc5"; }
.evv-icon--right,
.evv-feedback .swiper-button-next { --evv-icon: "\edbd"; }
.evv-icon--up { --evv-icon: "\edb9"; }

:is(.evv-header-icons, .evv-footer-social) a:is(:hover, :focus-visible) .evv-icon--calendar {
    color: #ff6600;
}

:is(.evv-header-icons, .evv-footer-social) a:is(:hover, :focus-visible) .evv-icon--whatsapp {
    color: #25d366;
}

:is(.evv-header-icons, .evv-footer-social) a:is(:hover, :focus-visible) .evv-icon--instagram {
    color: #e1306c;
}

:is(.evv-header-icons, .evv-footer-social) a:is(:hover, :focus-visible) .evv-icon--linkedin {
    color: #0077b5;
}

.evv-mobile-quicklinks {
    display: none;
}

@media (width < 768px) {
    header .navigation-main:has(> .evv-mobile-quicklinks) {
        display: flex;
        flex-direction: column;
    }

    header .navigation-main:has(> .evv-mobile-quicklinks) > .level_1 {
        flex: none;
    }

    header .navigation-main > .evv-mobile-quicklinks {
        display: block;
        flex: none;
        margin-block-start: auto;
        padding-block-start: 1.25rem;
        padding-block-end: env(safe-area-inset-bottom, 0px);
    }

    header .evv-mobile-quicklinks .evv-header-icons {
        display: flex;
        inline-size: fit-content;
        max-inline-size: 100%;
        margin-inline: auto;
        justify-content: center;
        flex-wrap: wrap;
    }

    header .navigation-main .evv-mobile-quicklinks .evv-header-icons a {
        display: grid;
        flex: none;
        width: 44px;
        height: 44px;
        padding: 0;
    }
}

.evv-header-icons img {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
}

@media (min-width: 48rem) {
    header:has(> .evv-header-icons) {
        row-gap: 0.5rem;
    }

    header:has(> .evv-header-icons) > .evv-logo {
        grid-area: 1 / 1 / 3 / 2;
        margin-block-start: 0.75rem;
    }

    .evv-header-icons {
        grid-area: 1 / 2 / 2 / 4;
        align-self: end;
    }

    header:has(> .evv-header-icons) > :is(.evv-nav, .nav-wrapper) {
        grid-area: 2 / 2 / 3 / 3;
    }

    header:has(> .evv-header-icons) > .evv-header-cta {
        grid-area: 2 / 3 / 3 / 4;
    }
}

@media (max-width: 47.999rem) {
    .evv-header-icons {
        grid-column: 1 / -1;
        grid-row: 3;
        justify-content: flex-start;
    }
}

/* --------------------------------------------------------------------------
   07 · Kopfbereich – Website-Suche
   -------------------------------------------------------------------------- */

.evv-header-search {
    position: relative;
    grid-area: 1 / 2 / 2 / 4;
    align-self: end;
    justify-self: end;
    margin-inline-end: 9.5rem;
}

.evv-header-search-toggle {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.evv-header-search-toggle:is(:hover, :focus-visible) {
    color: #005f6a;
}

.evv-header-search-dialog {
    position: fixed;
    inset: 0;
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
    padding: 1rem;
    border: 0;
    background: transparent;
    color: #fff;
    font: 1rem / 1.5 "Titillium Web", sans-serif;
}

.evv-header-search-dialog[open] {
    display: grid;
    place-items: center;
}

.evv-header-search-dialog::backdrop {
    background: rgb(15 28 38 / 70%);
}

.evv-header-search-dismiss {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    margin: 0;
}

.evv-header-search-dismiss button {
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 0;
    background: rgb(30 30 30 / 60%);
    color: #fff;
    font: 1.75rem / 1 sans-serif;
    cursor: pointer;
}

.evv-header-search-panel {
    box-sizing: border-box;
    width: min(50rem, 100%);
    padding-inline: clamp(0.5rem, 3vw, 1.5rem);
    border-bottom: 1px solid rgb(255 255 255 / 65%);
}

.evv-header-search-panel .formbody {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.evv-header-search-panel .widget-text {
    flex: 1 1 auto;
    min-width: 0;
}

.evv-header-search-panel label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.evv-header-search-panel input[type="search"] {
    box-sizing: border-box;
    width: 100%;
    min-height: 3.375rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    font-size: clamp(1.125rem, 3vw, 1.5rem);
}

.evv-header-search-panel input[type="search"]::placeholder {
    color: rgb(255 255 255 / 65%);
}

.evv-header-search-panel input[type="search"]:focus {
    outline: none;
}

.evv-header-search-panel:focus-within {
    border-bottom-color: #fff;
}

.evv-header-search-panel button[type="submit"] {
    display: grid;
    width: clamp(2.75rem, 7vw, 4.125rem);
    height: 2.75rem;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 0;
    cursor: pointer;
}

.evv-header-search-panel button[type="submit"]::before {
    font: 400 1.5rem / 1 "IcoMoon Ultimate";
    content: "\eb30";
}

.evv-header-search-dialog button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -2px;
}

@media (max-width: 47.999rem) {
    .evv-header-search {
        grid-area: 3 / 1 / 4 / 2;
        justify-self: start;
        margin-inline-end: 0;
    }

    header:has(> .evv-header-search) > .evv-header-icons {
        padding-inline-start: 2.5rem;
    }
}

/* --------------------------------------------------------------------------
   08 · Suchergebnisseite – Einleitung, Formular und Treffer
   -------------------------------------------------------------------------- */

.evv-search-page {
    color: #111;
    font: 1rem / 1.75 "Titillium Web", sans-serif;
}

.evv-search-intro {
    padding: clamp(2.5rem, 8vw, 7rem) 1rem clamp(1.75rem, 4vw, 3rem);
    text-align: center;
}

.evv-search-intro h2 {
    margin: 0;
    font: 400 1.5rem / 1.2 Gagalin, sans-serif;
}

.evv-search-intro p {
    margin: 0.25rem 0 0;
}

.evv-search-intro mark,
.evv-search-page .search_default mark {
    color: inherit;
    background: linear-gradient(180deg, transparent 65%, #ceff00 65%);
}

.evv-search-page .mod_search {
    width: min(100% - 2rem, 76.75rem);
    margin: 0 auto;
    padding-block-end: clamp(2.5rem, 8vw, 7rem);
}

.evv-search-page .mod_search .invisible {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.evv-search-page .mod_search input[type="search"] {
    box-sizing: border-box;
    width: 100%;
    min-height: 3rem;
    padding-inline: 1rem;
    border: 0;
    border-radius: 4px;
    background-color: #f3f3f3;
    color: inherit;
    font: inherit;
}

.evv-search-page .mod_search .widget-submit {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem 1rem;
    margin-block: 1.5rem 0.5rem;
}

.evv-search-page .mod_search .widget-radio {
    margin-inline-end: auto;
}

.evv-search-page .mod_search fieldset {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin: 0;
    padding: 0;
    border: 0;
}

.evv-search-page .mod_search input[type="radio"] {
    accent-color: #005f6a;
}

.evv-search-page .mod_search button[type="submit"] {
    min-height: 3rem;
    padding: 0.75rem 2rem;
    border: 0;
    border-radius: 5px;
    background-color: #005f6a;
    color: #fff;
    font: 400 0.875rem / 1.2 Gagalin, sans-serif;
    cursor: pointer;
}

.evv-search-page .mod_search button[type="submit"]:is(:hover, :focus-visible) {
    background-color: #ceff00;
    color: #111;
}

.evv-search-page .search_default {
    padding-block: 0.75rem;
}

.evv-search-page .search_default h3 {
    margin: 0;
    font: 400 1.25rem / 1.2 Gagalin, sans-serif;
}

.evv-search-page .search_default h3 a {
    color: #111;
    text-decoration: none;
}

.evv-search-page .search_default h3 a:hover {
    color: #005f6a;
    text-decoration: underline;
}

.evv-search-page .search_default :is(.context, .url) {
    margin: 0.35rem 0 0;
    overflow-wrap: anywhere;
}

/* --------------------------------------------------------------------------
   09 · Gemeinsames Seitenbanner – Seitentitel und Navigationspfad
   -------------------------------------------------------------------------- */

:is(.evv-page-banner, .evv-search-banner) {
    display: grid;
    align-content: center;
    box-sizing: border-box;
    min-block-size: 159px;
    padding: 1.5rem 1rem;
    background-color: #17233a;
    background-image:
        linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)),
        url("../pixabay/mountains-276995_1920.webp");
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
    font: 1rem / 1.75 "Titillium Web", sans-serif;
    text-align: center;
}

@media (min-width: 1200px) {
    :is(.evv-page-banner, .evv-search-banner) {
        min-block-size: 164px;
    }
}

@media (min-width: 1400px) {
    :is(.evv-page-banner, .evv-search-banner) {
        min-block-size: 316px;
    }
}

:is(.evv-page-banner, .evv-search-banner) h1 {
    margin: 0;
    color: #ceff00;
    font: 400 clamp(1.75rem, 4vw, 2.75rem) / 1.2 Gagalin, sans-serif;
    overflow-wrap: anywhere;
}

:is(.evv-page-banner, .evv-search-banner) .mod_breadcrumb ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.25rem 0.5rem;
    margin: 0.75rem 0 0;
    padding: 0;
    list-style: none;
}

:is(.evv-page-banner, .evv-search-banner) .mod_breadcrumb li + li::before {
    margin-inline-end: 0.5rem;
    content: "·";
}

:is(.evv-page-banner, .evv-search-banner) .mod_breadcrumb a {
    color: inherit;
    text-decoration: none;
}

:is(.evv-page-banner, .evv-search-banner) .mod_breadcrumb a:hover {
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   10 · Kopfbereich – Sticky-Navigation und kompaktes Logo
   -------------------------------------------------------------------------- */

header:has(> .evv-logo) {
    position: sticky;
    z-index: 10;
    top: 0;
}

.evv-sticky-marker {
    display: block;
    height: 1px;
    margin-block-end: -1px;
    pointer-events: none;
}

.evv-logo img.evv-logo-sticky {
    display: none;
}

.evv-is-stuck > .evv-logo:has(.evv-logo-sticky) img:not(.evv-logo-sticky) {
    display: none;
}

.evv-is-stuck > .evv-logo img.evv-logo-sticky {
    display: block;
    width: 4rem;
}

/* Match Contao's --nav-breakpoint before its navigation script runs. */
@media (width < 768px) {
    .evv-contact-bar,
    header:has(> .evv-logo) > :is(.evv-header-cta, .evv-header-search, .evv-header-icons) {
        display: none;
    }

    header:has(> .evv-logo) > :is(.evv-nav, .nav-wrapper) {
        grid-area: 1 / 2 / 2 / 3;
        justify-self: end;
    }

    header > .evv-logo:has(.evv-logo-sticky) img:not(.evv-logo-sticky) {
        display: none;
    }

    header > .evv-logo img.evv-logo-sticky {
        display: block;
        width: 4rem;
    }
}

@media (min-width: 48rem) {
    header.evv-is-stuck:has(> .evv-header-icons) > :is(.evv-header-search, .evv-header-icons) {
        display: none;
    }

    header.evv-is-stuck:has(> .evv-header-icons) > .evv-logo {
        grid-area: 1 / 1 / 2 / 2;
        display: grid;
        align-items: center;
        min-height: 3.25rem;
        margin-block-start: 0;
    }

    header.evv-is-stuck:has(> .evv-header-icons) > :is(.evv-nav, .nav-wrapper) {
        grid-area: 1 / 2 / 2 / 3;
    }

    header.evv-is-stuck:has(> .evv-header-icons) > .evv-header-cta {
        grid-area: 1 / 3 / 2 / 4;
    }

    header.evv-is-stuck:has(> .evv-header-icons) > :is(.evv-nav, .nav-wrapper, .evv-header-cta) {
        align-self: center;
        margin-block-end: 0;
    }
}

/* --------------------------------------------------------------------------
   11 · Kennst du das? – Kartenraster und Dialoge
   -------------------------------------------------------------------------- */

.evv-cards-intro {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    margin-block-end: 2rem;
    text-align: right;
}

.evv-cards-intro h2 {
    margin: 0;
    font: 400 clamp(1.375rem, 2.25vw, 1.75rem) / 1.5 Gagalin, sans-serif;
}

.evv-cards {
    display: grid;
    gap: 2rem;
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
}

.evv-cards > .content-element-group {
    min-width: 0;
    padding: 1.25rem;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    text-align: center;
}

.evv-cards figure {
    margin: 0;
}

.evv-cards img {
    max-width: 100%;
    height: auto;
}

.evv-cards > .content-element-group > :is(.content-image, .content-text, .content-element-group) {
    margin-block-end: 2rem;
}

.evv-cards > .content-element-group > .content-image img {
    display: block;
    width: min(100%, 167px);
    margin-inline: auto;
}

.evv-cards > .content-element-group > .content-text p {
    margin: 0;
}

.evv-cards > .content-element-group > .content-text h3 {
    margin: 0 0 1rem;
    padding-block: 0.9375rem;
    font: 400 1.40625rem / 1.2 Gagalin, sans-serif;
    letter-spacing: 0.05rem;
    text-transform: uppercase;
}

@media (min-width: 1200px) {
    .evv-cards > .content-element-group > .content-text h3 {
        font-size: 1.5rem;
    }
}

.evv-card-dialog-open {
    display: inline-block;
    padding: var(--evv-primary-cta-padding);
    border: 0;
    border-radius: 5px;
    background-color: #005f6a;
    color: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    font: 400 var(--evv-primary-cta-size) / 1.2 Gagalin, sans-serif;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 220ms ease-in-out, color 220ms ease-in-out;
}

.evv-card-dialog-open:is(:hover, :focus-visible, :active) {
    background-color: #ceff00;
    color: #111;
}

@media (prefers-reduced-motion: reduce) {
    .evv-card-dialog-open {
        transition: none;
    }
}

.evv-card-dialog {
    position: fixed;
    inset: 0;
    box-sizing: border-box;
    width: min(900px, calc(100% - 2rem));
    max-height: calc(100% - 2rem);
    margin: auto;
    padding: clamp(1.5rem, 5vw, 2.75rem);
    border: 0;
    border-radius: 15px;
    overflow: auto;
    background: #fff;
    color: #111;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    text-align: start;
}

.evv-card-dialog h2 {
    margin: 0 0 1rem;
    font: 400 clamp(1.375rem, 3vw, 1.75rem) / 1.5 Gagalin, sans-serif;
    letter-spacing: 0.1px;
    text-transform: uppercase;
}

.evv-card-dialog .evv-card-dialog-image {
    margin-block-end: 1rem;
}

.evv-card-dialog-image img {
    display: block;
    width: 100%;
    border-radius: 15px;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

@media (min-width: 48rem) {
    .evv-card-dialog .evv-card-dialog-image {
        float: inline-end;
        width: min(50%, 391px);
        margin-inline-start: 1rem;
    }
}

.evv-card-dialog :is(.evv-dialog-cta, .content-hyperlink) {
    clear: both;
    margin-block-start: 1.5rem;
    text-align: center;
}

.evv-cards h3 mark,
.evv-card-dialog mark {
    color: inherit;
    background: linear-gradient(180deg, transparent 65%, #ceff00 65%);
}

.evv-card-dialog[open] {
    display: block;
}

.evv-card-dialog::backdrop {
    background: rgb(17 17 17 / 70%);
}

@media (prefers-reduced-motion: no-preference) {
    @supports (transition-behavior: allow-discrete) and (overlay: auto) {
        .evv-card-dialog {
            opacity: 0;
            transform: scale(1.5);
            transition:
                opacity 500ms cubic-bezier(0, 0, 0.25, 1),
                transform 500ms cubic-bezier(0, 0, 0.25, 1),
                display 500ms allow-discrete,
                overlay 500ms allow-discrete;
        }

        .evv-card-dialog:is([open], :popover-open) {
            opacity: 1;
            transform: scale(1);
            transition-duration: 240ms;
            transition-timing-function: ease;
        }

        .evv-card-dialog::backdrop {
            background-color: transparent;
            transition:
                background-color 500ms cubic-bezier(0.47, 0, 0.74, 0.71),
                display 500ms allow-discrete,
                overlay 500ms allow-discrete;
        }

        .evv-card-dialog:is([open], :popover-open)::backdrop {
            background-color: rgb(17 17 17 / 70%);
            transition-duration: 240ms;
            transition-timing-function: ease;
        }

        @starting-style {
            .evv-card-dialog:is([open], :popover-open) {
                opacity: 0;
                transform: scale(0.97);
            }

            .evv-card-dialog:is([open], :popover-open)::backdrop {
                background-color: transparent;
            }
        }
    }
}

.evv-card-dialog-close {
    position: absolute;
    inset-block-start: 0.5rem;
    inset-inline-end: 0.5rem;
    width: 2.75rem;
    height: 2.75rem;
    border: 0;
    background: transparent;
    color: #005f6a;
    cursor: pointer;
    font: 1.75rem / 1 sans-serif;
}

@supports not selector(:popover-open) {
    .evv-card-dialog-open,
    .evv-card-dialog-close {
        display: none;
    }

    .evv-card-dialog {
        position: static;
        display: block;
        width: auto;
        max-height: none;
        padding: 0;
        box-shadow: none;
        opacity: 1;
        transform: none;
    }
}

@media (min-width: 48rem) {
    .evv-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* --------------------------------------------------------------------------
   12 · Footer – Kontakt, Partner und rechtliche Links
   -------------------------------------------------------------------------- */

.evv-footer {
    padding: clamp(3rem, 8vw, 6.5rem) max(1rem, calc((100% - 76.75rem) / 2)) 2.25rem;
    background-color: #111;
    color: #fff;
}

.evv-footer a {
    color: inherit;
    text-decoration: none;
}

.evv-footer a:is(:hover, :focus-visible) {
    color: #ceff00;
}

.evv-footer h2 {
    margin-block: 0 0.75rem;
    color: inherit;
    font: 400 1.125rem / 1.25 Gagalin, sans-serif;
}

.evv-footer-grid {
    display: grid;
    gap: 1.75rem 2rem;
}

.evv-footer-grid > * {
    min-inline-size: 0;
}

.evv-footer address {
    font-style: normal;
    overflow-wrap: anywhere;
}

.evv-footer-contact p {
    position: relative;
    margin: 0 0 0.875rem;
    padding-inline-start: 2rem;
}

.evv-footer-contact-icon {
    position: absolute;
    inset-block-start: 0.2rem;
    inset-inline-start: 0;
    inline-size: 1.375rem;
    color: #ceff00;
    text-align: center;
    font: 700 1.375rem / 1 sans-serif;
}

.evv-footer-contact-icon--pin {
    inline-size: 1.375rem;
    block-size: 1.375rem;
    background-color: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M19 9c0 5-7 10-7 10S5 14 5 9a7 7 0 1 1 14 0Z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3Cpath d='M6 18c-5 2 0 5 6 5s11-3 6-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.evv-footer-contact-icon--phone {
    --evv-icon: "\ea26";
}

.evv-footer-social ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.evv-footer-social a {
    display: grid;
    min-inline-size: 2rem;
    min-block-size: 2.75rem;
    place-items: center start;
    text-decoration: none;
}

.evv-footer-partners {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}

.evv-footer-partners :is(figure, p) {
    margin: 0;
}

.evv-footer-partners img {
    display: block;
    max-inline-size: min(100%, 15rem);
    inline-size: auto;
    block-size: auto;
    object-fit: contain;
}

.evv-footer-hours {
    text-align: start;
}

.evv-footer-hours h2 {
    text-align: end;
}

.evv-footer-hours p {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.25rem 1rem;
    margin: 0;
    padding-block: 0.5rem;
}

.evv-footer-hours p + p {
    border-block-start: 1px solid rgb(206 255 0 / 55%);
}

.evv-footer-hours .evv-footer-hours-note {
    justify-content: flex-end;
    color: #ceff00;
    font-weight: 700;
}

.evv-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem 1.5rem;
    margin-block-start: 3rem;
    padding-block-start: 2rem;
    border-block-start: 1px solid #555;
    font-size: 0.9375rem;
}

.evv-footer-bottom p,
.evv-footer-bottom ul {
    margin: 0;
}

.evv-footer-bottom ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem clamp(1rem, 2.5vw, 2rem);
    padding: 0;
    list-style: none;
}

.evv-footer-bottom a {
    font: 400 0.875rem / 1.4 Gagalin, sans-serif;
    text-transform: uppercase;
}

@media (max-width: 47.999rem) {
    .evv-footer-bottom {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .evv-footer-bottom ul {
        justify-content: center;
    }
}

.evv-footer-bottom a:is(
    .evv-footer-link-accent,
    [href="https://frankseffers.design"],
    [href="https://frankseffers.design/"],
    [href="https://www.frankseffers.design"],
    [href="https://www.frankseffers.design/"]
) {
    color: #ceff00;

    &:is(:hover, :focus-visible) {
        color: #fff;
    }
}

@media (min-width: 48rem) {
    .evv-footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 64rem) {
    .evv-footer-grid {
        grid-template-columns: minmax(0, 3fr) minmax(0, 3fr) minmax(0, 2fr) minmax(0, 4fr);
    }
}

/* --------------------------------------------------------------------------
   13 · Nach-oben-Button
   -------------------------------------------------------------------------- */

.evv-back-to-top {
    position: fixed;
    z-index: 9;
    inset-inline-end: 1.25rem;
    inset-block-end: 1rem;
    display: none;
    place-items: center;
    inline-size: 2.875rem;
    block-size: 2.875rem;
    border-radius: 5px;
    background-color: #005f6a;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 2px 8px rgb(17 17 17 / 20%);
}

body:not(.navigation-open):has(header.evv-is-stuck) .evv-back-to-top {
    display: grid;
}

.evv-back-to-top:is(:hover, :focus-visible) {
    background-color: #ceff00;
    color: #111;
}

.evv-back-to-top .evv-icon::before {
    font-size: 1rem;
}

/* --------------------------------------------------------------------------
   14 · Startseite – Zitat
   -------------------------------------------------------------------------- */

.evv-home-quote {
    margin-inline: auto;
    padding: clamp(3rem, 8vw, 6.5rem) max(1rem, calc((100% - 76.75rem) / 2));
    text-align: center;
}

.evv-home-quote blockquote {
    margin: 0;
}

.evv-home-quote blockquote p {
    margin: 0;
    color: #111;
    font: 400 1.640625rem / 1.75 Gagalin, sans-serif;
    text-transform: uppercase;
}

@media (min-width: 1200px) {
    .evv-home-quote blockquote p {
        font-size: 1.75rem;
    }
}

.evv-home-quote .evv-home-quote-mark {
    display: block;
    margin-block-end: 0.75rem;
    color: #005f6a;
    font: 700 clamp(7.5rem, 15vw, 12rem) / 0.65 Georgia, serif;
}

.evv-home-quote mark {
    color: inherit;
    background: linear-gradient(180deg, transparent 65%, #ceff00 65%);
}

/* --------------------------------------------------------------------------
   15 · Startseite – Weg zum Gipfel
   -------------------------------------------------------------------------- */

.evv-gipfel {
    display: grid;
    align-items: start;
    gap: 2rem;
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    text-align: center;
}

.evv-gipfel > .content-element-group {
    align-self: center;
}

.evv-gipfel h2 {
    margin: 0;
    font: 400 clamp(1.5rem, 2.25vw, 1.75rem) / 1.5 Gagalin, sans-serif;
}

.evv-gipfel .evv-flipbox {
    position: relative;
    perspective: 60rem;
}

.evv-flipbox-toggle {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: 0;
    opacity: 0;
}

.evv-flipbox-card {
    display: grid;
    min-block-size: 9rem;
    border-radius: 10px;
    cursor: pointer;
    transform-style: preserve-3d;
    transition: transform 450ms ease;
}

.evv-flipbox-toggle:checked + .evv-flipbox-card {
    transform: rotateY(180deg);
}

.evv-flipbox-toggle:focus-visible + .evv-flipbox-card {
    outline: 2px solid #005f6a;
    outline-offset: 4px;
}

.evv-flipbox-hit-area {
    position: absolute;
    inset: 0;
    cursor: pointer;
}

.evv-flipbox-face {
    display: grid;
    grid-area: 1 / 1;
    align-content: center;
    gap: 0.625rem;
    padding: clamp(1.5rem, 3.75vw, 3rem) clamp(1rem, 2.5vw, 2rem);
    border-radius: inherit;
    background: #fff;
    color: #111;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
    text-align: center;
    backface-visibility: hidden;
    transition: visibility 0s 225ms;
}

.evv-flipbox-face strong {
    font: 400 1.5rem / 1.25 Gagalin, sans-serif;
    text-transform: uppercase;
}

.evv-flipbox-face strong u {
    text-decoration-color: #ceff00;
    text-decoration-thickness: 4px;
    text-underline-offset: 3px;
}

.evv-flipbox-icon {
    inline-size: 4.6875rem;
    block-size: 4.6875rem;
    box-sizing: content-box;
    padding-block: clamp(1rem, 2.93vw, 2.34375rem);
    margin: 0 auto 0.625rem;
    fill: #808080;
}

.evv-flipbox-back {
    visibility: hidden;
    transform: rotateY(180deg);
}

.evv-flipbox-toggle:checked + .evv-flipbox-card .evv-flipbox-front {
    visibility: hidden;
}

.evv-flipbox-toggle:checked + .evv-flipbox-card .evv-flipbox-back {
    visibility: visible;
}

.evv-flipbox-back .rte > p {
    margin: 0;
    font: 400 1rem / 1.75 "Titillium Web", sans-serif;
}

@media (hover: hover) and (pointer: fine) {
    .evv-flipbox:hover .evv-flipbox-card {
        transform: rotateY(180deg);
    }

    .evv-flipbox:hover .evv-flipbox-front {
        visibility: hidden;
    }

    .evv-flipbox:hover .evv-flipbox-back {
        visibility: visible;
    }
}

@media (prefers-reduced-motion: reduce) {
    .evv-flipbox-card,
    .evv-flipbox-face {
        transition: none;
    }
}

@media (width < 62rem) {
    .evv-gipfel {
        grid-template-rows: auto;
        grid-auto-rows: 1fr;
    }

    .evv-gipfel > .content-element-group:has(> .evv-flipbox) {
        display: grid;
        align-self: stretch;
    }

    .evv-gipfel .evv-flipbox {
        display: grid;
    }
}

@media (min-width: 62rem) {
    .evv-gipfel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* --------------------------------------------------------------------------
   16 · Startseite – 1:1 oder Gruppe
   -------------------------------------------------------------------------- */

.evv-angebot {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem 2rem;
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    color: #111;
}

.evv-angebot-intro {
    grid-column: 1 / -1;
    text-align: center;
}

.evv-angebot-intro .evv-kicker {
    margin-block-end: 0.375rem;
}

.evv-angebot h2 {
    margin: 0;
    font: 400 1.640625rem / 1.5 Gagalin, sans-serif;
}

.evv-angebot h3 {
    margin: 0 0 1rem;
    font: 400 1.40625rem / 1.2 Gagalin, sans-serif;
}

.evv-angebot h4 {
    margin: 0 0 0.5rem;
    font: 400 0.9375rem / 1.2 Gagalin, sans-serif;
}

.evv-angebot .rte p:not(.evv-kicker) {
    margin: 0 0 1rem;
}

.evv-angebot .rte p:last-child:not(.evv-kicker) {
    margin-block-end: 0;
}

.evv-angebot .evv-angebot-gruppe {
    text-align: right;
}

.evv-angebot .content-hyperlink {
    margin-block-start: 2rem;
    text-align: center;
}

@media (width < 1200px) {
    .evv-angebot > .evv-angebot-gruppe {
        margin-block-start: 1rem;
    }
}

@media (min-width: 1200px) {
    .evv-angebot {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .evv-angebot h2 {
        font-size: 1.75rem;
    }

    .evv-angebot h3 {
        font-size: 1.5rem;
    }

    .evv-angebot h4 {
        font-size: 1rem;
    }
}

/* --------------------------------------------------------------------------
   17 · Startseite – Feedback
   -------------------------------------------------------------------------- */

.evv-feedback-intro,
.evv-feedback {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    color: #111;
}

.evv-feedback-intro {
    margin-block: clamp(2rem, 5vw, 4rem) 1rem;
    text-align: right;
}

.evv-feedback-intro .evv-kicker {
    background-color: rgb(17 17 17 / 50%);
}

.evv-feedback-intro h2 {
    margin: 0;
    font: 400 clamp(1.5rem, 2.25vw, 1.75rem) / 1.5 Gagalin, sans-serif;
}

.evv-feedback {
    --evv-feedback-controls-space: 1.75rem;
    display: flow-root;
    margin-block-end: 2rem;
    border-radius: 15px;
    background-color: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-feedback .swiper {
    border-radius: inherit;
    overflow: hidden;
    padding-block-end: var(--evv-feedback-controls-space);
    margin-block-end: calc(-1 * var(--evv-feedback-controls-space));
    --swiper-navigation-color: #005f6a;
    --swiper-pagination-color: #005f6a;
}

.evv-feedback .swiper > .swiper-pagination-progressbar {
    inset: auto 1rem var(--evv-feedback-controls-space);
    width: auto;
    height: 0.5rem;
    --swiper-pagination-progressbar-bg-color: rgb(0 0 0 / 25%);
}

.evv-feedback .swiper :is(.swiper-button-prev, .swiper-button-next) {
    top: auto;
    bottom: calc(var(--evv-feedback-controls-space) - 20px);
    z-index: 11;
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 5px;
    background-color: #ceff00;
}

.evv-feedback .swiper .swiper-button-prev {
    right: calc(2rem + 41px);
    left: auto;
}

.evv-feedback .swiper .swiper-button-next {
    right: 2rem;
}

.evv-feedback .swiper :is(.swiper-button-prev, .swiper-button-next)::before {
    content: var(--evv-icon);
    font: 400 16px / 1 "IcoMoon Ultimate";
    -webkit-text-stroke: 0.5px currentColor;
}

.evv-feedback .swiper-navigation-icon {
    display: none;
}

.evv-feedback .swiper-slide {
    box-sizing: border-box;
    padding: clamp(1.5rem, 5vw, 4rem) clamp(2.5rem, 6.4vw, 5.125rem) 3rem;
    text-align: center;
}

.evv-feedback .content-image figure {
    margin: 0;
}

.evv-feedback .content-image img {
    display: block;
    width: min(100%, 12.5rem);
    height: auto;
    aspect-ratio: 1;
    margin-inline: auto;
    margin-block-end: 0.75rem;
    border-radius: 50%;
    object-fit: cover;
}

.evv-feedback blockquote {
    margin: 1.5rem 0 1rem;
}

.evv-feedback blockquote p {
    margin: 0 0 1rem;
}

.evv-feedback blockquote p:last-child {
    margin-block-end: 0;
}

.evv-feedback .evv-feedback-name {
    display: block;
    color: #005f6a;
    font: 400 1.25rem / 1.2 Gagalin, sans-serif;
    text-transform: uppercase;
}

.evv-feedback .evv-feedback-author {
    margin: 0;
    color: #808080;
    line-height: 1.2;
}

/* --------------------------------------------------------------------------
   18 · Startseite – Über mich
   -------------------------------------------------------------------------- */

.evv-about {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: 5rem 3rem;
}

.evv-about-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    column-gap: 2rem;
}

.evv-about-row > * {
    margin-block-end: 2rem;
}

:is(.evv-about, .evv-faq, .evv-phr) .evv-kicker {
    display: table;
    margin-block-end: 0.375rem;
    background-color: rgb(17 17 17 / 50%);
    text-transform: uppercase;
}

:is(.evv-about, .evv-faq) h2 {
    margin: 0 0 1rem;
    font: 400 clamp(1.5rem, 2.25vw, 1.75rem) / 1.5 Gagalin, sans-serif;
}

.evv-about .rte > p:not(.evv-kicker) {
    margin: 0 0 1rem;
}

.evv-about .rte > p:last-child {
    margin-block-end: 0;
}

.evv-about .content-image figure {
    margin: 0;
}

.evv-about .content-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

@media (min-width: 1200px) {
    .evv-about-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, calc((100% + 2rem) * 5 / 12 - 2rem));
    }

    .evv-about-row--reverse {
        grid-template-columns: minmax(0, calc((100% + 2rem) * 5 / 12 - 2rem)) minmax(0, 1fr);
    }
}

/* --------------------------------------------------------------------------
   19 · Startseite – FAQ
   -------------------------------------------------------------------------- */

.evv-faq {
    display: grid;
    align-items: center;
    gap: 2rem;
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: 5rem 3rem;
    color: #111;
}

.evv-faq-list {
    display: grid;
    gap: 0.3125rem;
}

.evv-faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5em;
    padding: 1em 1.5em;
    border-radius: 10px;
    background: #fff;
    color: #111;
    cursor: pointer;
    font: 400 1.2rem / 1.75 Gagalin, sans-serif;
    overflow-wrap: anywhere;
}

.evv-faq-item summary::-webkit-details-marker {
    display: none;
}

.evv-faq-item summary::after {
    content: "";
    flex: none;
    width: 0.45em;
    height: 0.45em;
    border-right: 0.125em solid;
    border-bottom: 0.125em solid;
    transform: translateY(-0.125em) rotate(45deg);
}

.evv-faq-item[open] summary::after {
    transform: translateY(0.125em) rotate(225deg);
}

.evv-faq-item summary:is(:hover, :focus-visible) {
    color: #005f6a;
}

.evv-faq-item summary:focus-visible {
    outline: 2px solid #005f6a;
    outline-offset: -2px;
}

.evv-faq-answer {
    padding: 1.5rem;
}

.evv-faq-answer > p {
    margin: 0 0 1rem;
}

.evv-faq-answer > p:last-child {
    margin-bottom: 0;
}

.evv-faq .content-hyperlink {
    text-align: left;
}

@media (min-width: 1200px) {
    .evv-faq {
        grid-template-columns: minmax(0, 1fr) minmax(0, calc((100% + 2rem) * 5 / 12 - 2rem));
    }
}

/* --------------------------------------------------------------------------
   20 · Rechtstexte – Impressum und Datenschutzerklärung
   -------------------------------------------------------------------------- */

.evv-legal {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: clamp(3rem, 9vw, 7rem);
    color: #111;
    overflow-wrap: anywhere;
}

.evv-legal h1 {
    margin: 0 0 1rem;
    font: 400 clamp(1.5rem, 2.5vw, 2rem) / 1.2 Gagalin, sans-serif;
}

.evv-legal h2 {
    margin: 0 0 1rem;
    font: 400 clamp(1.25rem, 2.25vw, 1.75rem) / 1.2 Gagalin, sans-serif;
}

:is(.evv-legal, .evv-legal-social) p {
    margin: 0 0 1rem;
}

:is(.evv-legal, .evv-legal-social) p:last-child {
    margin-block-end: 0;
}

.evv-legal--privacy > :not(:first-child):is(h2, h3, h4, h5),
:is(.evv-legal--privacy, .evv-legal-social) .rte > :not(:first-child):is(h2, h3, h4, h5) {
    margin-block-start: 1.5em;
}

:is(.evv-legal, .evv-legal-social) h3 {
    margin-block-end: 0.5rem;
    font: 700 1.25rem / 1.35 "Titillium Web", sans-serif;
}

:is(.evv-legal, .evv-legal-social) :is(h4, h5) {
    margin-block-end: 0.5rem;
    font: 700 1rem / 1.5 "Titillium Web", sans-serif;
}

:is(.evv-legal, .evv-legal-social) ul {
    margin-block: 0 1rem;
    padding-inline-start: 1.5em;
}

:is(.evv-legal, .evv-legal-social) a {
    color: #005f6a;
    text-decoration: underline;
}

.content-text + .content-text.evv-legal-social {
    margin-block-start: 1rem;
}

.content-text.evv-legal.evv-legal--privacy:has(+ .content-text.evv-legal-social) {
    padding-block-end: 0;
}

.content-text.evv-legal--privacy + .content-text.evv-legal-social {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block-end: clamp(3rem, 9vw, 7rem);
    color: #111;
    overflow-wrap: anywhere;
}

.evv-legal-social .rte > h3:first-child {
    margin: 0 0 1rem;
    font: 400 clamp(1.25rem, 2.25vw, 1.75rem) / 1.2 Gagalin, sans-serif;
}

/* --------------------------------------------------------------------------
   21 · Allgemeine Geschäftsbedingungen
   -------------------------------------------------------------------------- */

.evv-legal.evv-agb {
    --evv-agb-section-gap: clamp(3rem, 8.75vw, 7rem);
    padding-block: clamp(3rem, 7.5vw, 6rem) 0;
}

.evv-agb:last-child {
    padding-block-end: var(--evv-agb-section-gap);
}

.evv-agb :is(h2, h3) {
    margin: 0 0 1rem;
    text-align: center;
}

.evv-agb h3 {
    font: 400 clamp(1.125rem, 2vw, 1.5rem) / 1.2 Gagalin, sans-serif;
}

.evv-agb > p + :is(h2, h3) {
    margin-block-start: var(--evv-agb-section-gap);
}

.evv-agb > h2 + h3 {
    margin-block-start: clamp(2rem, 7.5vw, 6rem);
}

.evv-agb :is(h2, h3) mark {
    color: inherit;
    background: linear-gradient(180deg, transparent 65%, #ceff00 65%);
}

.evv-agb > p {
    margin: 0;
    padding: 0.75rem 1rem;
    background: #fff;
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.evv-agb-clause {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 1rem;
}

@media (max-width: 47.999rem) {
    .evv-agb-clause {
        grid-template-columns: 1.5rem minmax(0, 1fr);
        gap: 0.5rem;
    }
}

/* --------------------------------------------------------------------------
   22 · Fehlerseiten
   -------------------------------------------------------------------------- */

.evv-error-page {
    width: min(100% - 2rem, 40rem);
    margin-inline: auto;
    padding-block: clamp(4rem, 10vw, 8rem);
    color: #111;
    text-align: center;
    overflow-wrap: anywhere;
}

.evv-error-page h1 {
    margin: 0 0 1rem;
    font: 400 clamp(1.75rem, 4vw, 2.75rem) / 1.2 Gagalin, sans-serif;
}

.evv-error-code {
    display: table;
    margin: 0 auto 1.25rem;
    padding-block-end: 0.08em;
    border-block-end: 0.05em solid #ceff00;
    color: #005f6a;
    font-size: clamp(5rem, 17vw, 12rem);
    line-height: 0.95;
}

.evv-error-page p {
    margin: 0;
}

.evv-error-page p + p {
    margin-block-start: 1.5rem;
}

.evv-error-page .evv-error-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
}

.evv-error-page a {
    color: #005f6a;
    font-weight: 700;
    text-underline-offset: 0.2em;
}

/* --------------------------------------------------------------------------
   23 · Links aus den Social-Media-Profilen
   -------------------------------------------------------------------------- */

.evv-insta {
    width: min(100% - 2rem, 34rem);
    margin-inline: auto;
    padding-block: clamp(2.5rem, 7vw, 5rem);
    color: #111;
}

.evv-insta h1 {
    margin: 0 0 0.25rem;
    font: 400 clamp(2rem, 6vw, 3rem) / 1.1 Gagalin, sans-serif;
}

.evv-insta p {
    margin: 0;
}

.evv-insta ul {
    display: grid;
    gap: 0.5rem;
    margin: 1.5rem 0 0;
    padding: 0;
    list-style: none;
}

.evv-insta a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    box-sizing: border-box;
    min-block-size: 3.25rem;
    padding: 0.75rem 1.125rem;
    border: 1px solid rgb(0 95 106 / 18%);
    border-radius: 0.625rem;
    background: #fff;
    color: #005f6a;
    font-weight: 700;
    text-decoration: none;
}

.evv-insta a:is(:hover, :focus-visible) {
    border-color: #005f6a;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.evv-insta a:focus-visible {
    outline: 2px solid #005f6a;
    outline-offset: 3px;
}

.evv-insta .evv-insta-home {
    min-block-size: 7.5rem;
    margin-block-end: 0.5rem;
    border-color: #005f6a;
    background:
        linear-gradient(90deg, #005f6a 15%, rgb(0 48 55 / 85%)),
        url("../pixabay/mountains-276995_1920.webp") center / cover;
    color: #fff;
    font: 400 clamp(1.375rem, 4vw, 1.75rem) / 1.2 Gagalin, sans-serif;
}

.evv-insta-home > [aria-hidden="true"] {
    color: #ceff00;
}

/* --------------------------------------------------------------------------
   24 · Newsletter-Abmeldung
   -------------------------------------------------------------------------- */

.evv-unsubscribe {
    display: grid;
    gap: 2rem;
    align-items: start;
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 6vw, 5rem) 3rem;
}

.evv-unsubscribe-card {
    min-width: 0;
    padding: 1.25rem;
    border-radius: 15px;
    background: #fff;
    color: #111;
    font: 400 1rem / 1.75 "Titillium Web", sans-serif;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-unsubscribe-card h2,
.evv-unsubscribe-card h3 {
    margin: 0 0 1rem;
    font: 400 1.5rem / 1.2 Gagalin, sans-serif;
    text-align: left;
    text-transform: uppercase;
}

.evv-unsubscribe-card h2 {
    font-size: 2rem;
}

.evv-unsubscribe-card p {
    margin: 0 0 1rem;
    text-align: left;
}

.evv-unsubscribe-card .content-text {
    margin-block-end: 2rem;
}

.evv-unsubscribe > .content-image figure {
    margin: 0;
}

.evv-unsubscribe > .content-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

@media (min-width: 768px) {
    .evv-unsubscribe {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* --------------------------------------------------------------------------
   25 · Gipfel-Moment – Buchungskalender
   -------------------------------------------------------------------------- */

.evv-booking {
    width: min(100% - 2rem, 76.75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 9vw, 7rem) clamp(2rem, 6vw, 5rem);
}

.evv-booking iframe {
    display: block;
    width: 100%;
    border: 0;
}

.evv-booking .evv-booking-fallback p {
    margin: 0 0 0.25rem;
    font-size: 0.9375rem;
    text-align: right;
}

.evv-booking .evv-booking-fallback a {
    color: #111111;
    text-decoration: none;
}

.evv-booking .evv-booking-fallback a:is(:hover, :focus-visible) {
    color: #005f6a;
}

/* The booking widget adds 64px above the calendar at 720px iframe width. */
@media (min-width: 768px) {
    .evv-booking .evv-booking-fallback a {
        position: relative;
        top: 64px;
        z-index: 1;
    }
}

/* --------------------------------------------------------------------------
   26 · PHR – Einspaltige Angebote
   -------------------------------------------------------------------------- */

.evv-phr {
    width: min(100% - 2rem, 52rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    color: #111;
}

.evv-phr > .content-text ~ .content-text {
    margin-block-start: 1.5rem;
    padding-block-start: 1.5rem;
    border-block-start: 1px solid rgb(17 17 17 / 20%);
}

.evv-phr h2 {
    margin: 0 0 0.75rem;
    font: 400 clamp(1.375rem, 3vw, 1.75rem) / 1.3 Gagalin, sans-serif;
}

.evv-phr > :nth-child(even of .content-text) h2 {
    text-align: right;
}

.evv-phr > :nth-child(even of .content-text) .evv-kicker {
    margin-inline-start: auto;
}

.evv-phr .rte > :is(p, ul):last-child {
    margin-block-end: 0;
}

.evv-phr ul {
    padding-inline-start: 1.25em;
}

.evv-phr > .content-text:first-child + .content-image figure {
    box-sizing: border-box;
    width: min(100%, 17rem);
    margin: 1.25rem auto 0;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-phr > .content-text:first-child + .content-image img {
    display: block;
    width: 100%;
    height: auto;
}

.evv-phr > .content-text:first-child h2 {
    font-size: clamp(1.625rem, 3.4vw, 2.25rem);
}

.evv-phr li::marker {
    color: #005f6a;
}

.evv-phr > .content-hyperlink {
    text-align: left;
}

@media (min-width: 900px) {
    .evv-phr:has(> .content-text:first-child + .content-image) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 17rem);
        column-gap: clamp(2rem, 4vw, 3rem);
    }

    .evv-phr:has(> .content-text:first-child + .content-image) > * {
        grid-column: 1 / -1;
    }

    .evv-phr > .content-text:first-child:has(+ .content-image) {
        grid-column: 1;
    }

    .evv-phr > .content-text:first-child + .content-image {
        grid-column: 2;
        align-self: center;
    }

    .evv-phr > .content-text:first-child + .content-image figure {
        margin: 0;
    }
}

/* Kompass – Inhaltsabschnitte zwischen Einstieg und Anmeldung */
.evv-kompass-section {
    width: min(100% - 2rem, 75rem);
    margin-inline: auto;
    padding-block: clamp(2rem, 5vw, 4rem);
    color: #111;
    font: 1rem / 1.75 "Titillium Web", sans-serif;
}

.evv-kompass-section > .content-text {
    max-width: 48rem;
    margin-inline: auto;
}

.evv-kompass-section :is(h2, h3) {
    margin-block: 0 1rem;
    font: 400 clamp(1.375rem, 3vw, 1.75rem) / 1.3 Gagalin, sans-serif;
}

.evv-kompass-section h3 {
    font-size: 1.125rem;
}

.evv-kompass-audience {
    display: grid;
    align-items: start;
    gap: 2rem;
}

.evv-kompass-audience > :is(.content-text, .content-element-group) {
    min-width: 0;
    padding: 1.25rem;
    border-radius: 15px;
    background: rgb(255 255 255 / 75%);
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-kompass-audience > :nth-child(2) {
    background: rgb(241 249 247 / 75%);
}

.evv-kompass-audience h3 {
    font-size: 1.5rem;
}

.evv-kompass-audience ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.evv-kompass-audience li {
    position: relative;
    padding-inline-start: 2.25rem;
}

.evv-kompass-audience li::before {
    content: "";
    position: absolute;
    inset-block-start: 0.4em;
    inset-inline-start: 0.3em;
    width: 0.45em;
    height: 0.8em;
    border: solid #005f6a;
    border-width: 0 0.15em 0.15em 0;
    transform: rotate(45deg);
}

.evv-kompass-audience > :nth-child(2) li {
    padding-inline: 0 2.25rem;
}

.evv-kompass-audience > :nth-child(2) li::before {
    inset-inline: auto 0.25em;
    width: 0.85em;
    height: 0.85em;
    border: 0;
    background: linear-gradient(45deg, transparent 42%, #ff2600 42% 58%, transparent 58%),
        linear-gradient(-45deg, transparent 42%, #ff2600 42% 58%, transparent 58%);
    transform: none;
}

.evv-kompass-fit > .content-text:first-child {
    max-width: none;
    text-align: center;
}

.evv-kompass-section li + li {
    margin-block-start: 0.5rem;
}

html:has(.evv-kompass-pain, .evv-kompass-fit) {
    container-type: inline-size;
}

.evv-kompass-section.evv-kompass-pain {
    position: relative;
    isolation: isolate;
    display: grid;
    align-items: center;
    gap: 2rem;
    box-sizing: border-box;
    width: 100%;
    padding: clamp(2rem, 6vw, 5rem) max(1rem, calc((100% - 75rem) / 2)) 3rem;
}

:is(.evv-kompass-pain, .evv-kompass-fit)::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset-block: 0;
    inset-inline-start: 50%;
    inline-size: 100cqi;
    translate: -50% 0;
}

.evv-kompass-fit {
    position: relative;
    isolation: isolate;
    padding-block: clamp(2rem, 6vw, 5rem) 3rem;
}

.evv-kompass-fit::before {
    background: linear-gradient(
            to bottom,
            rgb(255 255 255 / 85%) 0,
            rgb(255 255 255 / 82%) 6rem,
            rgb(255 255 255 / 70%) 10rem,
            rgb(255 255 255 / 52%) 15rem,
            rgb(255 255 255 / 40%) 21rem
        ),
        url("../pixabay/people-2576652.webp") center / cover;
    background-color: #e8eeec;
}

.evv-kompass-pain::before {
    background: linear-gradient(rgb(17 17 17 / 40%), rgb(17 17 17 / 40%)),
        url("../pixabay/mountain-4533591_1920.webp") center / cover;
    background-color: #555;
}

.evv-kompass-pain > .content-element-group {
    min-width: 0;
    padding: 1.25rem;
    border-radius: 15px;
    background: rgb(255 255 255 / 75%);
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-kompass-pain > .content-element-group:first-child {
    background: rgb(241 249 247 / 75%);
}

@media (min-width: 75rem) {
    .evv-kompass-pain {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 48rem) {
    .evv-kompass-audience {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .evv-kompass-audience > :nth-child(2) :is(h3, ul) {
        text-align: right;
    }
}

:is(.evv-kompass-value, .evv-kompass-trust) {
    display: grid;
    align-items: center;
    gap: 2rem;
}

:is(.evv-kompass-value, .evv-kompass-trust) > * {
    min-width: 0;
}

:is(.evv-kompass-value, .evv-kompass-trust) .content-image figure {
    margin: 0;
}

:is(.evv-kompass-value, .evv-kompass-trust) .content-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

.evv-kompass-value > .content-element-group,
.evv-kompass-trust > .content-text {
    padding: 1.25rem;
    border-radius: 15px;
    background: #f1f9f7;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-kompass-trust > .content-text {
    max-width: none;
    margin-inline: 0;
}

.evv-kompass-trust .evv-kompass-signature {
    margin-block-end: 0;
    line-height: 1.2;
}

.evv-kompass-trust .evv-kompass-credentials {
    margin-block: 0.2rem 0;
    font-size: 0.75rem;
}

@media (min-width: 75rem) {
    .evv-kompass-value {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    }

    .evv-kompass-trust {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    }
}

/* Kompass – Bestätigung nach der Anmeldung */
.evv-kompass-confirmation h1 {
    margin-block: 0 1rem;
    font: 400 clamp(2rem, 5vw, 3rem) / 1.15 Gagalin, sans-serif;
}

.evv-kompass-confirmation h1 mark {
    background: linear-gradient(transparent 65%, #ceff00 65%);
    color: inherit;
}

.evv-kompass-confirmation {
    display: grid;
    align-items: start;
    gap: clamp(1.5rem, 5vw, 4.5rem);
}

.evv-kompass-confirmation > * {
    min-width: 0;
}

.evv-kompass-confirmation > .content-text {
    max-width: none;
    margin-inline: 0;
}

.evv-kompass-confirmation h2 {
    margin-block: 1rem 0;
    color: #ff0000;
}

.evv-kompass-confirmation .content-image figure {
    margin: 0;
    padding: 1rem;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 0 15px 2px rgb(17 17 17 / 30%);
}

.evv-kompass-confirmation--thanks .content-image figure {
    padding: 0;
    background: transparent;
    box-shadow: none;
}

.evv-kompass-confirmation--thanks .content-image img {
    border-radius: 15px;
}

.evv-kompass-confirmation .content-image img {
    display: block;
    width: 100%;
    height: auto;
}

@media (min-width: 768px) {
    .evv-kompass-confirmation {
        grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr);
    }

    .evv-kompass-confirmation--thanks {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}