@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../fonts/open-sans-latin.woff2") format("woff2");
}

:root {
    --verband-petrol: #0a4658;
    --verband-rot: #b52a3a;
    --verband-lila: #7c3d6f;
    --verband-linie: #ddd9d4;
    --verband-text: #000000;
    --verband-flaeche: #ffffff;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    background: var(--verband-flaeche);
    color: var(--verband-text);
    font-family: "Open Sans", Helvetica, Verdana, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

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

a { color: var(--verband-petrol); }

a:hover { text-decoration: none; }

h1, h2, h3, p { overflow-wrap: break-word; hyphens: auto; }

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

:focus-visible {
    outline: 2px solid var(--verband-petrol);
    outline-offset: 3px;
}

.verband-skip {
    position: absolute;
    left: 8px;
    top: -40px;
    background: #fff;
    color: var(--verband-petrol);
    padding: 8px 12px;
    z-index: 50;
}

.verband-skip:focus { top: 8px; }

.verband-kopf {
    display: flex;
    align-items: stretch;
    height: 5.4375rem;
    background: #f1f3f2;
    position: sticky;
    top: 0;
    z-index: 30;
    overflow: visible;
}

.verband-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    align-self: flex-start;
    min-width: 11.5625rem;
    max-width: 14.625rem;
    height: 5.4375rem;
    padding: 0 1rem;
    text-decoration: none;
    color: var(--verband-petrol);
}

.verband-logo--platte {
    background: #fff;
    z-index: 32;
    margin-top: 0.625rem;
    height: auto;
    min-height: 7.25rem;
    padding: 0.85rem 1.15rem 1.15rem;
}

.verband-logo--zeichen {
    background: #fff;
    color: var(--verband-petrol);
}

.verband-logo__bild { width: 52px; height: auto; }

.verband-logo__name {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    color: var(--verband-petrol);
    white-space: pre-line;
}

.verband-logo--zeichen .verband-logo__name { color: var(--verband-petrol); }

.verband-menueknopf {
    display: none;
    margin: 22px 12px;
    background: transparent;
    border: 0;
    color: var(--verband-petrol);
    font: inherit;
    font-weight: 500;
    cursor: pointer;
}

.verband-nav { flex: 1; }

.verband-nav__liste {
    display: flex;
    align-items: stretch;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0 0 0 0.5rem;
    height: 5.4375rem;
}

.verband-nav__punkt {
    position: relative;
    margin-left: 1.25rem;
}

.verband-nav__punkt::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 100%;
    height: 0.1875rem;
    background: #7c3d6f;
    transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-nav__punkt:hover::before,
.verband-nav__punkt:focus-within::before { right: 0; }

.verband-nav__knopf,
.verband-sucheknopf,
.verband-schnellknopf {
    background: transparent;
    border: 0;
    color: var(--verband-petrol);
    font: inherit;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    cursor: pointer;
    padding: 0.3125rem 0 0;
}

.verband-nav__knopf {
    display: flex;
    align-items: center;
    height: 5.4375rem;
}

.verband-sucheknopf {
    width: 1.875rem;
    height: 1.875rem;
    margin-right: 0.75rem;
    padding: 0;
    font-size: 0;
    color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 28 28'%3E%3Cpath fill='%230A4658' d='M11.3 3.2a8 8 0 1 1 0 16 8 8 0 0 1 0-16zm0 1.8a6.2 6.2 0 1 0 0 12.4 6.2 6.2 0 0 0 0-12.4zm6.9 12.2 5.2 5.2a1.1 1.1 0 0 1-1.6 1.6l-5.2-5.2a9.6 9.6 0 0 0 1.6-1.6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.5rem 1.5rem;
}

.verband-schnellknopf {
    position: relative;
    padding: 0 1.625rem 0 0;
    font-size: 1.125rem;
    font-weight: 500;
}

.verband-schnellknopf::after {
    content: "";
    position: absolute;
    top: calc(50% - 0.45rem);
    right: 0.15rem;
    width: 0.55rem;
    height: 0.55rem;
    border-right: 2px solid #0a4658;
    border-bottom: 2px solid #0a4658;
    transform: rotate(45deg);
}

.verband-schnellknopf[aria-expanded="true"]::after {
    transform: rotate(225deg);
    top: calc(50% - 0.15rem);
}

.verband-kopf__werkzeuge {
    display: flex;
    align-items: center;
    padding-right: 12px;
}

.verband-suchfeld,
.verband-schnell {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid var(--verband-linie);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
    z-index: 25;
}

.verband-mega {
    position: fixed;
    top: 5.4375rem;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0a4658;
    z-index: 25;
    overflow: auto;
}

.verband-mega ul {
    list-style: none;
    max-width: 100rem;
    margin: 0 auto;
    padding: 3.75rem 5.125rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}

.verband-mega li {
    padding: 1.875rem 2.5rem;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.verband-schnell ul {
    list-style: none;
    margin: 0;
    padding: 28px 32px 36px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 32px;
}

.verband-schnell {
    left: auto;
    right: 0;
    min-width: 280px;
}

.verband-schnell ul { grid-template-columns: 1fr; padding: 16px 20px; }

.verband-schnell a {
    color: var(--verband-petrol);
    text-decoration: none;
    font-weight: 500;
}

.verband-mega a {
    color: #fff;
    text-decoration: none;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.4;
}

.verband-mega a:hover { text-decoration: underline; }

.verband-suchfeld { padding: 24px 32px 32px; }

.verband-suchfeld form,
.verband-suchform,
.verband-vereinssuche {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.verband-suchfeld input,
.verband-suchform input,
.verband-vereinssuche input[type="search"] {
    flex: 1;
    min-width: 200px;
    border: 0;
    border-bottom: 1px solid var(--verband-petrol);
    font: inherit;
    padding: 8px 0;
}

.verband-suchfeld button,
.verband-suchform button,
.verband-vereinssuche button,
.verband-button {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    margin: 0 0.9375rem 0.9375rem 0;
    padding: 0.625rem 1rem;
    border: 0.125rem solid #7c3d6f;
    border-radius: 0.125rem;
    background: #7c3d6f;
    color: #fff;
    box-shadow: none;
    font: inherit;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.4;
    letter-spacing: 0.00625rem;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.verband-button span[aria-hidden] {
    display: inline-block;
    margin-left: 0.5rem;
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-button:hover,
.verband-suchfeld button:hover { color: #fff; background: #7c3d6f; }

.verband-button:hover span[aria-hidden] { transform: rotate(90deg); }

.verband-button:focus {
    border-color: #0a4658;
    background: #fff;
    color: #000;
    box-shadow: 0 0 0 0.2rem #0a4658;
    outline: 0;
}

.verband-social {
    position: fixed;
    left: 8px;
    top: 140px;
    z-index: 15;
    list-style: none;
    margin: 0;
    padding: 0;
}

.verband-social a {
    display: flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    color: var(--verband-petrol);
}

.verband-icon { width: 18px; height: 18px; }

.verband-social--fuss { display: none; position: static; }

.verband-aufmacher {
    position: relative;
    height: calc(100vh - 5.4375rem);
    max-height: 600px;
    background: var(--verband-petrol) center / cover no-repeat;
    overflow: hidden;
}

.verband-aufmacher__bild {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.verband-aufmacher__text {
    position: absolute;
    left: 8%;
    right: 36%;
    bottom: 8%;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
}

.verband-aufmacher__zeile {
    width: fit-content;
    max-width: 100%;
    margin: 0;
    padding: 0.25rem 0;
    background: rgba(10, 70, 88, 0.8);
    box-shadow: rgba(10, 70, 88, 0.8) 0.625rem 0 0, rgba(10, 70, 88, 0.8) -0.625rem 0 0;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.74;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

.verband-start__raster {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    max-width: 90rem;
    margin: 0 auto;
    padding: 2.5rem 1.25rem 0;
    overflow: visible;
}

.verband-start__raster--ohne-nachrichten { grid-template-columns: 1fr; }

.verband-start__nachrichten h1,
.verband-start__termine h2,
.verband-innenseite h2 {
    font-size: 1.375rem;
    font-weight: 400;
    line-height: 1.3;
    color: #000;
    margin: 0 0 1.25rem;
}

.verband-nachrichten-magazin {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0 1.25rem;
}

.verband-nachrichten-magazin__gross,
.verband-nachrichten-magazin .verband-nachrichten {
    min-width: 0;
}

.verband-leit,
.verband-nachricht {
    position: relative;
    background: #fff;
    padding: 1.25rem 0;
    border-bottom: 1px solid #ddd9d4;
    transition: background 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-leit:first-of-type { padding-top: 0; }

.verband-leit:hover,
.verband-nachricht:hover { background: #f5f4f2; }

.verband-leit a,
.verband-nachricht a {
    display: flex;
    text-decoration: none;
    color: inherit;
}

.verband-leit a { flex-direction: column; }

.verband-leit h2,
.verband-nachricht__titel,
.verband-termin__titel {
    color: var(--verband-petrol);
    font-size: 1.1875rem;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    hyphens: auto;
}

.verband-leit__teaser { margin: 0.9375rem 0 0; }

.verband-leit__bildrahmen {
    display: block;
    overflow: hidden;
    margin: 0 0 0.9375rem;
}

.verband-nachricht__bildrahmen {
    flex: 0 0 7.5rem;
    width: 7.5rem;
    margin: 0 0.9375rem 0 0;
    overflow: hidden;
}

.verband-mehr a {
    display: inline-block;
    position: relative;
    margin-left: 1.875rem;
    padding-bottom: 5px;
    color: var(--verband-petrol);
    text-decoration: none;
}

.verband-mehr a::before {
    content: "→";
    position: absolute;
    left: -1.875rem;
}

.verband-mehr a::after {
    content: "";
    position: absolute;
    top: calc(100% - 2px);
    left: 0;
    right: 0;
    height: 2px;
    background: #7c3d6f;
    transition: right 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-mehr a:hover { text-decoration: none; }

.verband-mehr a:hover::after { right: 100%; }

.verband-leit__bild,
.verband-nachricht__bild {
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-leit__bildrahmen .verband-leit__bild {
    width: 100%;
    height: auto;
}

.verband-nachricht__bildrahmen .verband-nachricht__bild {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.verband-einzel__bild {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 1.25rem;
}

.verband-leit:hover .verband-leit__bild { transform: scale(1.025); }

.verband-nachricht:hover .verband-nachricht__bild { transform: scale(1.05); }

.verband-nachrichten { list-style: none; margin: 0; padding: 0; }

.verband-nachricht__text { display: flex; flex-direction: column; flex: 1 1 auto; padding: 0.1875rem; }

.verband-nachricht a:not(:has(.verband-nachricht__bildrahmen)) { display: flex; }

.verband-kacheln, .verband-baender { display: flex; flex-direction: column; }

.verband-start__seite { position: relative; z-index: 2; }

.verband-kachel, .verband-band {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    color: #fff;
    text-decoration: none;
    padding: 1.875rem;
}

.verband-kachel {
    position: relative;
    min-height: 0;
    padding-bottom: 4.6875rem;
}

.verband-kachel__titel, .verband-band__titel {
    font-size: 1.375rem;
    font-weight: 400;
    line-height: 1.3;
    color: #fff;
}

.verband-kachel__text, .verband-band__text { margin: 0; }

.verband-kachel__pfeil {
    position: absolute;
    left: 1.875rem;
    bottom: 0.9375rem;
    width: 1.875rem;
    height: 1.875rem;
    margin: 0;
    font-size: 1.5rem;
    line-height: 1.875rem;
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.verband-kachel:hover .verband-kachel__pfeil { transform: rotate(90deg); }

.verband-start__termine {
    margin-top: 1.875rem;
    padding: 1.875rem 1.875rem 0.625rem;
    background: #fff;
    border: 1px solid #ddd9d4;
}

.verband-flaeche-7c3d6f { background: #7c3d6f; }
.verband-flaeche-1a5c4e { background: #1a5c4e; }
.verband-flaeche-5a1c4d { background: #5a1c4d; }
.verband-flaeche-7a2438 { background: #7a2438; }
.verband-flaeche-1a6d8c { background: #1a6d8c; }

.verband-termin { border-bottom: 1px solid var(--verband-linie); padding: 0.75rem 0; }

.verband-termin:last-of-type { border-bottom: 0; }

.verband-termin__link { text-decoration: none; color: inherit; display: block; }

.verband-termin__datum {
    margin: 0;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.verband-termin__ort, .verband-termin__zeit { margin: 0; }

.verband-termin__hinweis {
    display: inline-block;
    margin: 8px 0 0;
    background: var(--verband-lila);
    color: #fff;
    padding: 2px 8px;
}

.verband-baender {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 2.5rem;
}

.verband-band {
    flex: 1 1 25%;
    aspect-ratio: 1 / 1;
    justify-content: flex-end;
    min-width: 0;
}

.verband-zahlen {
    list-style: none;
    display: flex;
    max-width: 75rem;
    margin: 0 auto;
    padding: 2.5rem 1.25rem 4rem;
}

.verband-zahlen li {
    flex: 1 0 auto;
    padding: 15px 0;
    text-align: center;
}

.verband-zahlen li + li { border-left: 0.125rem solid #d4d0cb; }

.verband-zahl__wert {
    display: block;
    min-height: 4.875rem;
    font-size: 3.25rem;
    font-weight: 400;
    color: var(--verband-petrol);
    line-height: 1.1;
}

.verband-zahl__bez { color: var(--verband-petrol); }

.verband-brotkrumen { max-width: 1140px; margin: 0 auto; padding: 24px 24px 0; }

.verband-brotkrumen ol { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }

.verband-brotkrumen li:not(:last-child)::after { content: ">"; margin-left: 8px; }

.verband-brotkrumen__haus {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--verband-petrol);
    border-bottom: 0;
    position: relative;
    top: 1px;
}

.verband-innenseite__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 48px;
    max-width: 1140px;
    margin: 0 auto;
    padding: 16px 24px 72px;
}

.verband-innenseite h1 {
    margin: 0 0 2.5rem;
    color: var(--verband-petrol);
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.4;
    border-bottom: 1px solid var(--verband-linie);
}

.verband-bereich__titel { margin: 0 0 8px; color: var(--verband-petrol); font-weight: 500; }

.verband-bereich ul { list-style: none; margin: 0; padding: 0; }

.verband-bereich a {
    display: block;
    padding: 10px 0;
    text-decoration: none;
    border-bottom: 1px solid var(--verband-linie);
    color: #000;
}

.verband-bereich a.is-aktiv { border-bottom: 2px solid var(--verband-lila); color: var(--verband-petrol); }

.verband-personen, .verband-dokumente, .verband-vereine, .verband-suchliste {
    list-style: none;
    margin: 0;
    padding: 0;
}

.verband-person, .verband-vereine li, .verband-dokumente li, .verband-suchliste li {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 16px;
    padding: 16px 0;
    border-top: 1px solid var(--verband-linie);
}

.verband-vereine li, .verband-dokumente li, .verband-suchliste li { grid-template-columns: minmax(0, 1fr) auto; }

.verband-person__name { margin: 0; font-weight: 500; color: var(--verband-petrol); }

.verband-person__amt, .verband-person__satz, .verband-person__kontakt { margin: 0; }

.verband-suchart {
    display: block;
    color: var(--verband-petrol);
    font-size: 14px;
    font-weight: 500;
}

.verband-bildnachweise {
    max-width: 90rem;
    margin: 0 auto 2.5rem;
    padding: 0 1.25rem;
}

.verband-bildnachweise__knopf {
    position: relative;
    display: block;
    list-style: none;
    cursor: pointer;
    color: var(--verband-petrol);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    padding: 0.9375rem 3.125rem 0.9375rem 0;
    border-bottom: 3px solid #7c3d6f;
}

.verband-bildnachweise__knopf::-webkit-details-marker { display: none; }

.verband-bildnachweise__knopf::marker { content: ""; }

.verband-bildnachweise__knopf::after {
    content: "";
    position: absolute;
    top: 0.9375rem;
    right: 0.9375rem;
    width: 1.875rem;
    height: 1.875rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='11' viewBox='0 0 17 13'%3E%3Cpath d='M9.5,11.734,2,4.234,4.234,2,9.5,7.266,14.766,2,17,4.234Z' fill='%230A4658'/%3E%3C/svg%3E") center / 70% no-repeat;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.verband-bildnachweise__kasten[open] .verband-bildnachweise__knopf::after {
    transform: rotate(180deg);
}

.verband-bildnachweise__liste {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 -0.625rem;
    padding: 1.25rem 0 0;
}

.verband-bildnachweise__item {
    width: 16.66%;
    padding: 0 0.625rem;
    margin-bottom: 0.9375rem;
    hyphens: auto;
    word-break: break-word;
}

.verband-bildnachweise__thumb {
    display: block;
    width: 100%;
    height: auto;
}

.verband-bildnachweise__text {
    display: inline-block;
    padding: 0.3125rem 0;
    font-size: 0.875rem;
    line-height: 1.4;
}

.verband-fuss {
    border-top: 1px solid #0a4658;
    background: #0a4658;
    color: #fff;
    padding: 3.75rem 1.25rem 0;
}

.verband-fuss__spalten {
    max-width: 90rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem;
}

.verband-fuss h2 {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    color: #fff;
    margin: 0;
}

.verband-fuss h2::after {
    content: "";
    display: block;
    width: 1.875rem;
    height: 0.1875rem;
    background: #fff;
    margin-top: 0.875rem;
    margin-bottom: 1.125rem;
}

.verband-fuss ul { list-style: none; margin: 0; padding: 0; }

.verband-fuss a,
.verband-fuss p,
.verband-fuss li,
.verband-fuss address { color: #fff; text-decoration: none; }

.verband-fuss__recht {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    max-width: 90rem;
    margin: 1.5rem auto 0;
    padding: 0 0 5px;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.4;
}

.verband-fuss__recht a,
.verband-fuss__recht span { color: #fff; }

.verband-fuss__trenn { white-space: pre; }

.verband-adresse { font-style: normal; }

.verband-nachoben {
    position: fixed;
    right: 0.9375rem;
    bottom: 0.9375rem;
    width: 3.125rem;
    height: 3.125rem;
    background: #7c3d6f;
    color: #fff;
    text-indent: -999px;
    overflow: hidden;
    z-index: 50;
}

.verband-nachoben::after {
    content: "↑";
    text-indent: 0;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.verband-hinweis-leer { max-width: 1140px; margin: 48px auto; padding: 0 24px; }

@media (min-width: 48rem) {
    .verband-start__raster { grid-template-columns: minmax(0, 7fr) minmax(240px, 4fr); }
    .verband-aufmacher__zeile { font-size: 2.375rem; line-height: 1.65; }
    .verband-start__nachrichten h1,
    .verband-start__termine h2,
    .verband-innenseite h2,
    .verband-kachel__titel,
    .verband-band__titel { font-size: 1.75rem; }
    .verband-start__nachrichten h1,
    .verband-start__termine h2,
    .verband-innenseite h2 { margin-bottom: 2.5rem; }
    .verband-leit h2,
    .verband-nachricht__titel,
    .verband-termin__titel { font-size: 1.25rem; }
    .verband-innenseite h1 { font-size: 2.375rem; }
    .verband-start__seite { margin-top: -8.125rem; }
}

@media (min-width: 62rem) {
    .verband-aufmacher { max-height: 1200px; }
    .verband-innenseite h1 { font-size: 3.375rem; }
    .verband-logo { max-width: 16.25rem; }
    .verband-nav__knopf { font-size: 1rem; }
    .verband-nachrichten-magazin { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .verband-leit:last-of-type { border-bottom: 0; padding-bottom: 0; }
    .verband-nachrichten .verband-nachricht:first-child { padding-top: 0; }
}

@media (min-width: 75rem) {
    .verband-start__raster { grid-template-columns: minmax(0, 6fr) minmax(220px, 3fr); }
    .verband-nav__knopf { font-size: 1rem; }
}

@media (min-width: 81.3125rem) {
    .verband-nav__punkt { margin-left: 3.125rem; }
    .verband-nav__knopf { font-size: 1.125rem; }
}

@media (max-width: 75rem) {
    .verband-band { flex-basis: 50%; aspect-ratio: auto; min-height: 16rem; }
}

@media (max-width: 61.99875rem) {
    .verband-kopf { position: sticky; }
    .verband-kopf::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: 4.375rem;
        width: 1px;
        background: #ddd9d4;
    }
    .verband-logo--platte { margin-top: 0; min-height: 0; height: 5.4375rem; padding: 0 1rem; }
    .verband-menueknopf {
        display: block;
        position: absolute;
        top: 2.0625rem;
        right: 1.25rem;
        z-index: 40;
        width: 1.875rem;
        height: 1.875rem;
        margin: 0;
        padding: 0;
        background: transparent;
        color: transparent;
    }
    .verband-menueknopf__balken,
    .verband-menueknopf__balken::before,
    .verband-menueknopf__balken::after {
        position: absolute;
        right: 0;
        display: block;
        width: 30px;
        height: 4px;
        background: #0a4658;
        content: "";
        transition: all 0.3s ease-in-out;
    }
    .verband-menueknopf__balken { top: 50%; margin-top: -2px; }
    .verband-menueknopf__balken::before { top: -10px; }
    .verband-menueknopf__balken::after { top: 10px; }
    .verband-menueknopf[aria-expanded="true"] .verband-menueknopf__balken { background: transparent; }
    .verband-menueknopf[aria-expanded="true"] .verband-menueknopf__balken::before { transform: rotate(45deg); top: 0; }
    .verband-menueknopf[aria-expanded="true"] .verband-menueknopf__balken::after { transform: rotate(-45deg); top: 0; }
    .verband-kopf__werkzeuge {
        position: absolute;
        top: 0;
        right: 0;
        height: 5.4375rem;
        padding: 0;
    }
    .verband-sucheknopf {
        position: absolute;
        top: 1.8125rem;
        right: 5.3125rem;
        z-index: 40;
        margin: 0;
    }
    .verband-suchfeld { z-index: 40; }
    .verband-schnellknopf { display: none; }
    body:has(.verband-nav.is-offen) .verband-nachoben { display: none; }
    .verband-nav { display: none; }
    .verband-nav.is-offen {
        display: block;
        position: fixed;
        top: 5.4375rem;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 28;
        background: #0a4658;
        box-shadow: 0 0 0.375rem 0 rgba(0, 0, 0, 0.75);
        overflow: auto;
    }
    .verband-kopf:has(.verband-schnellknopf) .verband-nav.is-offen { top: calc(5.4375rem + 3.75rem); }
    .verband-nav.is-offen ~ .verband-kopf__werkzeuge .verband-schnellknopf {
        display: block;
        position: fixed;
        top: 5.4375rem;
        left: 0;
        right: 0;
        z-index: 29;
        height: 3.75rem;
        padding: 0 1.25rem;
        background: #fff;
        color: #0a4658;
        font-size: 1.125rem;
        font-weight: 500;
        line-height: 3.75rem;
        text-align: left;
    }
    .verband-nav.is-offen ~ .verband-kopf__werkzeuge .verband-schnellknopf::after { border-color: #0a4658; }
    .verband-nav.is-offen ~ .verband-kopf__werkzeuge .verband-schnell {
        position: fixed;
        top: calc(5.4375rem + 3.75rem);
        left: 0;
        right: 0;
        z-index: 29;
        min-width: 0;
        background: #fff;
    }
    .verband-nav.is-offen ~ .verband-kopf__werkzeuge .verband-schnell a {
        display: block;
        padding: 0.625rem 1.25rem;
        border-bottom: 1px solid rgba(10, 70, 88, 0.3);
        color: #0a4658;
    }
    .verband-nav__liste {
        flex-direction: column;
        align-items: stretch;
        height: auto;
        padding: 0 1.25rem 2.5rem;
    }
    .verband-nav__punkt { margin-left: 0; }
    .verband-nav__punkt::before { display: none; }
    .verband-nav__knopf {
        position: relative;
        display: block;
        width: 100%;
        height: auto;
        padding: 0.625rem 2.8125rem 0.625rem 0.625rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
        background: transparent;
        color: #fff;
        font-size: 1.25rem;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
    }
    .verband-nav__knopf[aria-expanded="true"] { font-weight: 500; }
    .verband-nav__knopf::after {
        content: "";
        position: absolute;
        top: 0.85rem;
        right: 0.625rem;
        width: 1.5625rem;
        height: 1.5625rem;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23ffffff' d='M19.4 10.9c.2-.2.2-.5 0-.7l-6-6c-.2-.2-.5-.2-.7 0-.2.2-.2.5 0 .7l5.2 5.2H1.5C1.2 10 1 10.2 1 10.5S1.2 11 1.5 11h16.3l-5.1 5.1c-.2.2-.2.6-.1.8.2.1.6.1.8 0l6-6z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 1.5625rem 1.5625rem;
        transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
    .verband-nav__knopf[aria-expanded="true"]::after { transform: rotate(90deg); }
    .verband-mega { position: static; top: auto; bottom: auto; background: transparent; overflow: visible; }
    .verband-mega ul { max-width: none; padding: 0; grid-template-columns: 1fr; }
    .verband-mega li { padding: 0; border-right: 0; }
    .verband-mega a {
        display: block;
        padding: 0.625rem 0.625rem 0.625rem 1.875rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
        color: #fff;
        font-size: 1.125rem;
        font-weight: 500;
    }
}

@media (max-width: 61.99875rem) {
    .verband-bildnachweise__item { width: 20%; }
}

@media (max-width: 47.99875rem) {
    .verband-bildnachweise__item { width: 25%; }
    .verband-fuss__recht { font-size: 0.8125rem; }
    .verband-social { display: none; }
    .verband-social--fuss { display: flex; gap: 8px; max-width: 1140px; margin: 16px auto 0; }
    .verband-aufmacher { height: auto; max-height: none; }
    .verband-aufmacher__bild { position: relative; height: auto; aspect-ratio: 16 / 9; }
    .verband-aufmacher__text {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        padding: 1.25rem 1.25rem 0.625rem;
        background: #fff;
        border-bottom: 1px solid #ddd9d4;
    }
    .verband-aufmacher__zeile { font-size: 1.5rem; line-height: 1.74; }
    .verband-innenseite__grid,
    .verband-fuss__spalten { grid-template-columns: 1fr; }
    .verband-bereich { order: -1; }
    .verband-person { grid-template-columns: 1fr; }
    .verband-nachricht a { flex-direction: column; }
    .verband-nachricht__bildrahmen {
        flex-basis: auto;
        width: 100%;
        margin: 0 0 0.9375rem;
    }
    .verband-logo { min-width: 0; max-width: 9.5rem; padding: 0 0.75rem; }
    .verband-logo__name { font-size: 14px; line-height: 18px; }
    .verband-zahlen { flex-direction: column; }
    .verband-zahlen li + li { border-left: 0; border-top: 0.125rem solid #d4d0cb; }
    .verband-zahl__wert { min-height: auto; font-size: 2.5rem; }
    .verband-band { flex-basis: 100%; aspect-ratio: auto; min-height: 12rem; }
}

@media (max-width: 35.99875rem) {
    .verband-bildnachweise__item { width: 33.33%; }
    .verband-bildnachweise__text { font-size: 0.8125rem; }
}
