@font-face {
    font-family: "Merriweather";
    src: url("/assets/fonts/merriweather/Merriweather-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Merriweather";
    src: url("/assets/fonts/merriweather/Merriweather-Italic.ttf") format("truetype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Merriweather";
    src: url("/assets/fonts/merriweather/Merriweather-Bold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Merriweather";
    src: url("/assets/fonts/merriweather/Merriweather-BoldItalic.ttf") format("truetype");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}


@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-Regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-RegularItalic.otf") format("opentype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-SemiBold.otf") format("opentype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-SemiBoldItalic.otf") format("opentype");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-Bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/assets/fonts/atkinson-hyperlegible-next/AtkinsonHyperlegibleNext-BoldItalic.otf") format("opentype");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

/* =========================================================
   Grundeinstellungen
   ========================================================= */

:root {
    --bordeaux: #800000;
    --bordeaux-dark: #650000;
    --text: #707070;
    --surface: #ffffff;
    --border: #d8d8d8;
    --aside-line: #eadadd;
    --max-width: 1180px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 100%;
}

body {
    margin: 0;
    background: #ffffff;
    color: var(--text);
    font-family: "Merriweather", Georgia, serif;
    font-size: 1rem;
    line-height: 1.75;
}

a {
    color: var(--bordeaux);
    text-decoration: none;
}

a:hover {
    color: var(--bordeaux-dark);
}

/* Tastaturfokus für Links und Buttons */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

/* Dezenter Fokus für Formularfelder */
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: none;
    border-color: var(--bordeaux);
    box-shadow: 0 0 0 2px rgba(128, 0, 0, 0.18);
}


/* =========================================================
   Barrierefreiheit
   ========================================================= */

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 9999;

    padding: .75rem 1rem;

    background: #ffffff;
    color: #000000;
}

.skip-link:focus {
    left: 1rem;
    top: 1rem;
}


/* =========================================================
   Header
   ========================================================= */

.site-header {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--bordeaux);
    color: #ffffff;
}

.site-header::before,
.site-header::after,
.site-header__inner::before {
    content: "";
    position: absolute;
    pointer-events: none;
    border-radius: 46% 54% 62% 38% / 58% 43% 57% 42%;
    filter: blur(30px);
    transform-origin: center;
    will-change: transform, border-radius;
}

.site-header::before {
    z-index: 0;
    width: 48%;
    height: 145%;
    left: -12%;
    top: -28%;
    background: rgba(190, 55, 70, .78);
    animation: headerLavaDriftOne 18s ease-in-out infinite alternate;
}

.site-header::after {
    z-index: 0;
    width: 42%;
    height: 150%;
    right: -10%;
    bottom: -35%;
    background: rgba(60, 0, 0, .82);
    animation: headerLavaDriftTwo 22s ease-in-out -7s infinite alternate;
}

.site-header__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 255px;
    margin: 0;
    padding: 2.5rem 1rem;

    display: grid;
    place-items: center;
}

.site-header__inner::before {
    z-index: 0;
    width: 38%;
    height: 132%;
    left: 33%;
    top: -18%;
    background: rgba(165, 25, 45, .68);
    animation: headerLavaDriftThree 20s ease-in-out -13s infinite alternate;
}

.site-brand {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.site-brand img {
    display: block;
    width: min(300px, 80vw);
    max-width: 100%;
    height: auto;
    margin: 0;
}

@keyframes headerLavaDriftOne {
    0% {
        transform: translate3d(0, 0, 0) scale(1) rotate(-4deg);
        border-radius: 46% 54% 62% 38% / 58% 43% 57% 42%;
    }
    45% {
        transform: translate3d(24vw, 12px, 0) scale(1.18) rotate(7deg);
        border-radius: 61% 39% 45% 55% / 42% 61% 39% 58%;
    }
    100% {
        transform: translate3d(12vw, -10px, 0) scale(.92) rotate(2deg);
        border-radius: 38% 62% 56% 44% / 63% 39% 61% 37%;
    }
}

@keyframes headerLavaDriftTwo {
    0% {
        transform: translate3d(0, 0, 0) scale(.95) rotate(3deg);
        border-radius: 53% 47% 39% 61% / 42% 57% 43% 58%;
    }
    50% {
        transform: translate3d(-20vw, -16px, 0) scale(1.2) rotate(-8deg);
        border-radius: 39% 61% 58% 42% / 61% 37% 63% 39%;
    }
    100% {
        transform: translate3d(-8vw, 8px, 0) scale(1.04) rotate(-2deg);
        border-radius: 62% 38% 48% 52% / 38% 59% 41% 62%;
    }
}

@keyframes headerLavaDriftThree {
    0% {
        transform: translate3d(-10vw, 10px, 0) scale(.85) rotate(-6deg);
        border-radius: 44% 56% 64% 36% / 55% 40% 60% 45%;
    }
    55% {
        transform: translate3d(12vw, -12px, 0) scale(1.14) rotate(8deg);
        border-radius: 63% 37% 43% 57% / 37% 63% 37% 63%;
    }
    100% {
        transform: translate3d(-2vw, 5px, 0) scale(.96) rotate(1deg);
        border-radius: 37% 63% 55% 45% / 61% 41% 59% 39%;
    }
}


/* =========================================================
   Hauptnavigation
   ========================================================= */

.site-nav {
    background: #ffffff;
}

.site-nav__inner {
    width: min(100% - 2rem, var(--max-width));
    margin-inline: auto;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: 0 2.6rem;
}

.site-nav a {
    display: block;

    padding: 1.25rem 0 1.05rem;

    color: var(--text);

    font-size: 1rem;
    text-decoration: none;
}

.site-nav a:hover,
.site-nav a:focus-visible,
.site-nav a[aria-current="page"] {
    color: var(--bordeaux);
}

/* Desktop: Unterstreichung läuft von links nach rechts ein */
@media (min-width: 701px) {
    .site-nav a {
        position: relative;
    }

    .site-nav a::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: .75rem;

        width: 100%;
        height: 4px;

        background: #800000;

        transform: scaleX(0);
        transform-origin: left center;
        transition: transform .28s ease;
    }

    .site-nav a:hover::after,
    .site-nav a:focus-visible::after,
    .site-nav a[aria-current="page"]::after {
        transform: scaleX(1);
    }
}

.menu-toggle-wrap {
    display: none;
}


/* =========================================================
   Seitenlayout
   ========================================================= */

.site-layout {
    width: min(100% - 2rem, var(--max-width));
    margin: 4rem auto 2rem;

    display: grid;
    grid-template-columns: minmax(0, 2.55fr) minmax(270px, 1fr);
    gap: 4rem;

    align-items: start;
}

.site-main {
    min-width: 0;
    padding: 0;
    background: transparent;
    margin-bottom: 5rem;
}

.site-main h1 {
    margin-top: 0;

    color: var(--bordeaux);

    font-weight: 400;
    line-height: 1.3;
}


/* =========================================================
   Allgemeine Buttons
   ========================================================= */

button,
.button,
input[type="submit"] {
    border: 0;
    border-radius: 0;

    padding: .7rem 1rem;

    background: var(--bordeaux);
    color: #ffffff;

    font: inherit;
    cursor: pointer;
}

button:hover,
.button:hover,
input[type="submit"]:hover {
    background: var(--bordeaux-dark);
}


/* =========================================================
   Sidebar
   ========================================================= */

.site-aside {
    min-width: 0;

    font-size: 1rem;
    line-height: 1.75;
}

.aside-section {
    margin-bottom: 2rem;
    padding-bottom: 0;

    border: 0;
}

.aside-section h2 {
    display: flex;
    align-items: flex-end;
    gap: .45rem;

    margin: 0 0 1rem;
    padding: 0 0 .35rem;

    border-bottom: 4px solid var(--aside-line);

    color: #333333 /*var(--bordeaux)*/;

    font-size: .95rem;
    font-weight: 400;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.aside-section h2 i {
    position: relative;
    top: .2rem;

    color: #a86f6f;

    font-size: 1.35rem;

    transform: rotate(-15deg);
}

.aside-section p {
    margin: .3rem 0;
}

.site-aside address {
    font-style: normal;
}


/* =========================================================
   Suche
   Nur eine Linie unter dem Suchfeld
   ========================================================= */

.aside-search {
    margin-bottom: 2rem;
    padding-bottom: 0;

    border: 0;
}

.site-search {
    margin: 0;
    padding: 0;

    border: 0;
}

.site-search__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;

    border-bottom: 1px solid #cccccc;
}

.site-search input {
    min-width: 0;
    min-height: 42px;

    padding: .5rem .35rem;

    border: 0;
    border-radius: 0;
    box-shadow: none;

    background: transparent;
    color: var(--text);

    font: inherit;
}

.site-search input::placeholder {
    color: #777777;
    opacity: 1;
}

.site-search button {
    min-width: 42px;
    min-height: 42px;

    padding: 0;

    border: 0;
    border-radius: 0;
    box-shadow: none;

    background: transparent;
    color: var(--bordeaux);
}

.site-search button:hover,
.site-search button:focus-visible {
    background: #f5f5f5;
    color: var(--bordeaux-dark);
}


/* =========================================================
   Sidebar – Kontaktdaten
   ========================================================= */

.gmaps-link {
    padding: .65em 0 0;
}

.gmaps-link a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}

.gmaps-link i {
    color: var(--bordeaux);
    font-size: 1rem;
}

p.what3words {
    padding: .35em 0 .65em;
}

.aside-contact {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
}

.aside-contact-mail {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    padding: .65em 0 0;
}

.aside-contact i {
    width: 1.1rem;
    margin-top: .35rem;

    color: var(--bordeaux);

    text-align: center;
}


/* E-Mail-Spamschutz */

.email-reveal {
    display: inline;

    min-height: 0;
    padding: 0;

    border: 0;

    background: transparent;
    color: var(--bordeaux);

    font: inherit;
    text-align: left;
    text-decoration: underline;

    cursor: pointer;
}

.email-reveal:hover,
.email-reveal:focus-visible {
    background: transparent;
    color: var(--bordeaux-dark);
}


/* =========================================================
   Bürozeiten
   Keine Linien zwischen den einzelnen Tagen
   ========================================================= */

.office-hours {
    width: 100%;

    border-collapse: collapse;

    /*font-size: .875rem;*/
}

.office-hours th,
.office-hours td {
    padding: .38rem .2rem;
    border: 0;
    border-bottom: 1px solid #dddddd;

    text-align: left;
    vertical-align: top;
}

.office-hours tr:last-child th,
.office-hours tr:last-child td {
    border-bottom: 0;
}

.office-hours th {
    width: 40%;

    font-weight: 400;
}

.office-hours-hint {
    margin: 1rem 0 0;
    font-size: .875rem;
    line-height: 1.6;
}

.office-hours-hint i {
    margin-right: 0;
    font-size: 1em;
    line-height: inherit;
    vertical-align: baseline;
    color: var(--text);
}


/* =========================================================
   Online-Terminanfrage in der Sidebar
   ========================================================= */

.aside-button {
    display: block;

    width: 100%;
    margin: 1.35rem 0 .75rem 0;
    padding: .75rem 1rem;

    background: var(--bordeaux);
    color: #ffffff;

    text-align: center;
    text-decoration: none;
}

.aside-button:hover,
.aside-button:focus-visible {
    background: var(--bordeaux-dark);
    color: #ffffff;
}

.aside-hint {
    font-style: italic;
    font-size: .75rem;
    line-height: 1.65;
}

/* =========================================================
   Sidebar – Weitere Profile
   ========================================================= */
.aside-profile-links {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    align-items: center;
    gap: .9rem;
}

.aside-profile-item {
    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 0;
}

.aside-profile-item a {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    border: 0;
    background: transparent;
}

.aside-profile-item a:hover,
.aside-profile-item a:focus-visible {
    border: 0;
    background: transparent;
}

.aside-profile-item img {
    display: block;

    max-width: 150px;
    max-height: 42px;

    width: auto;
    height: auto;
}

/* =========================================================
   Sidebar – Rechtsgebiete
   ========================================================= */

.aside-legal-nav {
    display: grid;
    gap: .1rem;
}

.aside-legal-nav a {
    display: block;
    padding: .3rem 0 .3rem 15px;

    border-left: 0 solid transparent;

    color: var(--text);
    text-decoration: none;
}

.aside-legal-nav a:hover,
.aside-legal-nav a:focus-visible {
    padding-left: 11px;
    border-left: 4px solid var(--bordeaux);

    color: var(--text);
}

/* =========================================================
   Startseite
   ========================================================= */

.home-panorama {
    margin-bottom: 2.5rem;
}

.home-panorama img {
    display: block;

    width: 100%;
    height: auto;

    padding: 4px;

    border: 1px solid #d8d8d8;

    background: #ffffff;
}

.home-sections {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem;

    margin-bottom: 3.5rem;
}

.home-sections a {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 48px;

    padding: .7rem 1rem;

    border: 0;
    border-radius: 0;

    background: var(--bordeaux);
    color: #ffffff;

    font-size: 0.9375rem;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
}

.home-sections a:hover,
.home-sections a:focus-visible {
    background: var(--bordeaux-dark);
    color: #ffffff;
}

.home-intro h1 {
    margin: 0 0 1.7rem;

    color: #333333;

    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: .08em;

    text-align: center;
    text-transform: uppercase;
}

.home-intro h2 {
    margin: 0 0 1.7rem;

    color: #333333;

    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: .06em;

    text-transform: uppercase;
}

.home-intro h2 em {
    font-weight: 400;
    font-style: italic;
    text-transform: none;
    color: #777777;
}

.home-intro p {
    margin: 0 0 1.5rem;

    /*font-size: 0.9375rem;*/
    font-style: italic;
    /*font-style: normal;*/
    line-height: 1.75;
}

/* Leitgedanke auf der Startseite */
.home-intro p:first-of-type {
    margin-bottom: 1.8rem;

    text-align: center;
}

.home-intro p:first-of-type strong {
    display: block;

    color: var(--bordeaux);

    font-weight: 600;
    letter-spacing: .015em;
}

/* Hervorgehobene Rechtsgebiete */
.home-intro strong {
    color: var(--bordeaux);
}

/* Terminvereinbarung – Abschlussbereich der Startseite */

.home-appointment {
    margin-top: 3.25rem;
    padding: 2.4rem 0 0;
    border-top: 1px solid #dddddd;
}

.home-appointment__header {
    margin-bottom: 1.45rem;
}

.home-appointment__header h2 {
    margin: 0;
    color: #333333;
    font-size: clamp(1.35rem, 2.3vw, 1.8rem);
    font-weight: 400;
    letter-spacing: .06em;
    line-height: 1.35;
    text-transform: uppercase;
}

.home-appointment__accent {
    display: block;
    width: 34px;
    height: 3px;
    margin-top: .65rem;
    background: var(--bordeaux);
}

.home-appointment__lead {
    margin: 0 0 1.25rem;
    color: var(--text);
    font-size: 1rem;
    line-height: 1.7;
}

.home-appointment__action {
    margin: 0 0 .85rem;
}

.home-appointment__button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-width: min(100%, 320px);
    min-height: 54px;
    padding: .82rem 1.15rem;
    border: 0;
    border-radius: 5px;
    background: var(--bordeaux);
    color: #ffffff;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
}

.home-appointment__button:hover,
.home-appointment__button:focus-visible {
    background: var(--bordeaux-dark);
    color: #ffffff;
}

.home-appointment__button i {
    font-size: .78rem;
    transition: transform .24s ease;
}

.home-appointment.is-form-open .home-appointment__button i {
    transform: rotate(180deg);
}

.home-appointment__note {
    margin: 0;
    color: #777777;
    font-size: .875rem;
    font-style: italic;
    line-height: 1.6;
}

/* Aufklappbares Terminformular auf der Startseite */
.js .home-appointment__form-panel {
    display: grid;
    grid-template-rows: 0fr;
    margin-top: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        grid-template-rows .36s ease,
        opacity .24s ease,
        margin-top .36s ease,
        visibility 0s linear .36s;
}

.js .home-appointment__form-panel.is-open {
    grid-template-rows: 1fr;
    margin-top: 1.5rem;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
        grid-template-rows .42s ease,
        opacity .26s ease .06s,
        margin-top .42s ease,
        visibility 0s linear 0s;
}

.home-appointment__form-shell {
    min-height: 0;
    overflow: hidden;
}

.home-appointment__form-card {
    padding: 1.5rem;
    border: 1px solid #e1dada;
    border-radius: 7px;
    background: #fbf9f9;
    box-shadow: 0 8px 24px rgba(70, 45, 48, .06);
}

.home-appointment__form-heading {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: .9rem;
    margin-bottom: 1.2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e4dddd;
}

.home-appointment__form-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 6px;
    background: #f2e8e9;
    color: var(--bordeaux);
    font-size: 1.1rem;
}

.home-appointment__form-heading h3 {
    margin: 0 0 .15rem;
    color: #333333;
    font-size: 1.1rem;
    font-weight: 400;
}

.home-appointment__form-heading p {
    margin: 0;
    color: #777777;
    font-size: .86rem;
    line-height: 1.55;
}

.home-appointment__form-card .contact-form {
    margin-top: 1.35rem;
}

.home-appointment__form-card .form-field input[type="text"],
.home-appointment__form-card .form-field input[type="email"],
.home-appointment__form-card .form-field input[type="tel"],
.home-appointment__form-card .form-field input[type="date"],
.home-appointment__form-card .form-field select,
.home-appointment__form-card .form-field textarea,
.home-appointment__form-card .appointment-picker__trigger,
.home-appointment__form-card .appointment-picker__panel,
.home-appointment__form-card .appointment-picker__date-card,
.home-appointment__form-card .appointment-picker__time-card,
.home-appointment__form-card .appointment-time-option__button {
    border-radius: 5px;
}

.home-appointment__form-card .form-submit {
    border-radius: 5px;
}

.home-appointment__form-card .contact-choice {
    min-height: 36px;
    padding: .2rem 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.home-appointment__form-card .contact-choice:hover,
.home-appointment__form-card .contact-choice:focus-within,
.home-appointment__form-card .contact-choice:has(input:checked) {
    border-color: transparent;
    background: transparent;
}

.home-appointment__steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin-top: 2.25rem;
    padding: 2rem 0;
}

.home-appointment-step {
    position: relative;
    min-width: 0;
    text-align: center;
}

.home-appointment-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 22px;
    left: calc(50% + 34px);
    width: calc(100% - 68px + 1.5rem);
    height: 1px;
    background: #dddddd;
}

.home-appointment-step__number {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f2e8e9;
    color: #333333;
    font-size: 1rem;
}

.home-appointment-step h3 {
    margin: .85rem 0 .45rem;
    color: #333333;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.4;
}

.home-appointment-step p {
    margin: 0;
    color: var(--text);
    font-size: .86rem;
    line-height: 1.6;
}

.home-appointment__phone {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    margin-top: .45rem;
    padding: 1.15rem 1.25rem;
    background: #faf7f7;
}

.home-appointment__phone-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: var(--bordeaux);
    font-size: 1.2rem;
}

.home-appointment__phone p {
    margin: 0;
    font-size: .9rem;
    line-height: 1.55;
}

.home-appointment__phone a {
    font-weight: 600;
}

@media (max-width: 700px) {
    .home-appointment {
        margin-top: 2.5rem;
        padding-top: 1.9rem;
    }

    .home-appointment__button {
        width: 100%;
        min-width: 0;
    }

    .home-appointment__form-panel.is-open {
        margin-top: 1.1rem;
    }

    .home-appointment__form-card {
        padding: 1rem;
        border-radius: 6px;
    }

    .home-appointment__form-heading {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: .7rem;
    }

    .home-appointment__form-icon {
        width: 38px;
        height: 38px;
    }

    .home-appointment__form-card .appointment-salutation-grid {
        gap: .3rem 1.1rem;
    }

    .home-appointment__form-card .contact-choice {
        min-height: 36px;
        padding: .2rem 0;
    }

    .home-appointment__steps {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 1.4rem 0 .4rem;
    }

    .home-appointment-step {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 0 .9rem;
        padding: .6rem 0 1.2rem;
        text-align: left;
    }

    .home-appointment-step:not(:last-child)::after {
        top: 48px;
        bottom: -2px;
        left: 21.5px;
        width: 1px;
        height: auto;
    }

    .home-appointment-step__number {
        grid-row: 1 / span 2;
    }

    .home-appointment-step h3 {
        margin: .05rem 0 .28rem;
    }

    .home-appointment-step p {
        font-size: .88rem;
    }

    .home-appointment__phone {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: .75rem;
        padding: 1rem;
    }

    .home-appointment__phone-icon {
        width: 38px;
        height: 38px;
    }
}

/* =========================================================
   Rechtsgebiete
   ========================================================= */

.legal-page > h1 {
    margin-bottom: 2rem;
}

.legal-areas {
    display: grid;
    gap: 0;
}

.legal-area {
    padding: 2rem 1.6rem;
}

.legal-areas > .legal-area:nth-child(odd) {
    background: #ffffff;
}

.legal-areas > .legal-area:nth-child(even) {
    background: #f5f5f5;
}

.legal-area h2 {
    display: flex;
    align-items: center;
    gap: .65rem;

    margin: 0 0 1.25rem;

    color: #333333;

    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.4;
}

.legal-area h2 i {
    flex: 0 0 auto;

    color: #800000;

    font-size: 1rem;
}

.legal-area p {
    margin: 0 0 1.25rem;
}

.legal-area p:last-child {
    margin-bottom: 0;
}

.legal-area ul {
    margin: 1rem 0 1rem 1.4rem;
    padding: 0;

    list-style-type: square;
}

.legal-area li {
    margin-bottom: .35rem;
}

.legal-area li::marker {
    color: #800000;
}

.legal-warning {
    color: #800000;

    font-weight: 600;
    font-style: italic;
    text-align: center;
}

.legal-warning i {
    margin-right: .35rem;
}

/* =========================================================
   Kanzlei / Vita
   ========================================================= */

.vita-page > h1 {
    margin-bottom: 2.5rem;
    text-align: center;
}

.vita-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: 2rem;

    margin-bottom: 2.5rem;
}

.vita-intro__title {
    padding-top: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #cccccc;
}

.vita-intro__title h2 {
    margin: 0;

    color: #525252;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
}

.vita-intro__image {
    text-align: center;
}

.vita-intro__image img {
    display: inline-block;

    width: 256px;
    max-width: 100%;
    height: auto;

    border-radius: 50%;
}

.vita-section {
    margin-top: 2rem;
}

.vita-section-title {
    display: flex;
    align-items: center;
    gap: .65rem;

    margin: 0;

    color: #333333;

    font-size: 1.25rem;
    font-weight: 400;
}

.vita-section-title i {
    color: #800000;
    font-size: 1rem;
}

.vita-row {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 2rem;

    padding: 2.8rem 0;
}

.vita-year {
    font-weight: 400;
}

.vita-content p {
    margin: 0 0 .75rem;
}

.vita-content p:last-child {
    margin-bottom: 0;
}


/* Infotext Bürogemeinschaft */

.vita-tooltip {
    position: relative;

    color: #800000;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-underline-offset: .2em;

    cursor: help;
}

.vita-tooltip__text {
    position: absolute;
    z-index: 20;

    left: 50%;
    bottom: calc(100% + .75rem);

    width: 300px;
    max-width: 75vw;
    padding: .8rem 1rem;

    background: #ffffff;
    border: 1px solid #cccccc;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .12);

    color: #525252;

    font-size: .85rem;
    font-weight: 400;
    line-height: 1.6;
    text-decoration: none;

    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%);
}

.vita-tooltip:hover .vita-tooltip__text,
.vita-tooltip:focus .vita-tooltip__text,
.vita-tooltip:focus-within .vita-tooltip__text {
    opacity: 1;
    visibility: visible;
}


/* Weiterbildung */

.vita-training {
    margin-top: 1rem;
}

.vita-training-image {
    display: block;

    width: 350px;
    max-width: 100%;
    height: auto;

    margin: 4rem 0 0 auto;
}

/* =========================================================
   Dokumente
   ========================================================= */

.documents-page > h1,
.court-page > h1 {
    margin-bottom: 2.5rem;
    text-align: center;
}

.documents-intro {
    max-width: 800px;
    margin: 0 auto 2.5rem;
    text-align: center;
}

.documents-intro > i {
    color: #800000;
    font-size: 1.5rem;
}

.documents-intro h2 {
    margin: .75rem 0 .5rem;
    font-size: 1.2rem;
    font-weight: 400;
}

.document-list,
.external-documents,
.documents-courts {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.document-entry {
    padding: 1.8rem 0;
    border-top: 1px solid #dddddd;
}

.document-entry h2,
.documents-courts h2 {
    display: flex;
    align-items: center;
    gap: .65rem;

    margin: 0 0 1rem;

    color: #333333;

    font-size: 1.1rem;
    font-weight: 400;
}

.document-entry h2 i,
.documents-courts h2 i {
    color: #800000;
}

.document-entry__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    gap: 2rem;
}

.document-entry__content p {
    margin-top: 0;
}

.document-entry__download {
    text-align: center;
}

.document-entry__download p {
    font-size: .875rem;
}

.document-actions {
    display: grid;
    gap: .55rem;
}

.document-preview,
.document-download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;

    width: 100%;
    min-height: 44px;

    padding: .65rem .8rem;

    border: 1px solid #800000;

    text-align: center;
    text-decoration: none;
}

.document-preview {
    background: #ffffff;
    color: #800000;
}

.document-preview:hover,
.document-preview:focus-visible {
    background: #f7f1f1;
    color: #650000;
}

.document-download {
    background: #800000;
    color: #ffffff;
}

.document-internal-link {
    display: inline-block;

    padding: .7rem 1rem;

    border: 1px solid #800000;
    background: #800000;

    color: #ffffff;
    text-decoration: none;
}

.document-download:hover,
.document-download:focus-visible,
.document-internal-link:hover,
.document-internal-link:focus-visible {
    background: #ffffff;
    color: #800000;
}

/* PDF-Vorschau */

.pdf-preview-dialog {
    width: min(1100px, calc(100% - 2rem));
    height: 88vh;
    height: 88dvh;
    max-width: none;
    max-height: none;

    padding: 0;

    border: 1px solid #cfcfcf;
    border-radius: 0;

    background: #ffffff;
    color: var(--text);

    box-shadow: 0 18px 55px rgba(0, 0, 0, .28);
}

.pdf-preview-dialog::backdrop {
    background: rgba(0, 0, 0, .58);
}

.pdf-preview-dialog__inner {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;

    height: 100%;
}

.pdf-preview-dialog__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;

    padding: .9rem 1rem;

    border-bottom: 1px solid #dddddd;
}

.pdf-preview-dialog__header h2 {
    margin: 0;

    color: #333333;

    font-size: 1rem;
    font-weight: 400;
    line-height: 1.4;
}

.pdf-preview-dialog__close-icon {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    padding: 0;

    border: 1px solid #dddddd;

    background: #ffffff;
    color: #525252;

    font-size: 1.1rem;
}

.pdf-preview-dialog__close-icon:hover,
.pdf-preview-dialog__close-icon:focus-visible {
    border-color: #800000;
    background: #ffffff;
    color: #800000;
}

.pdf-preview-dialog__viewer {
    min-height: 0;

    background: #ececec;
}

.pdf-preview-dialog__frame {
    display: block;

    width: 100%;
    height: 100%;

    border: 0;

    background: #ffffff;
}

.pdf-preview-dialog__footer {
    padding: .8rem 1rem 1rem;

    border-top: 1px solid #dddddd;

    background: #ffffff;
}

.pdf-preview-dialog__hint {
    margin: 0 0 .65rem;

    color: #666666;

    font-size: .78rem;
    line-height: 1.5;
}

.pdf-preview-dialog__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
}

.pdf-preview-dialog__actions a,
.pdf-preview-dialog__actions button {
    width: auto;
    min-height: 44px;
}

.pdf-preview-open,
.pdf-preview-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;

    padding: .65rem .8rem;

    border: 1px solid #800000;

    background: #ffffff;
    color: #800000;

    font: inherit;
    text-decoration: none;
}

.pdf-preview-open:hover,
.pdf-preview-open:focus-visible,
.pdf-preview-close:hover,
.pdf-preview-close:focus-visible {
    background: #f7f1f1;
    color: #650000;
}

.pdf-preview-download {
    width: auto;
}

@media (max-width: 700px) {
    .pdf-preview-dialog {
        width: calc(100% - 1rem);
        height: calc(100vh - 1rem);
        height: calc(100dvh - 1rem);
    }

    .pdf-preview-dialog__header {
        padding: .7rem .75rem;
    }

    .pdf-preview-dialog__footer {
        padding: .7rem .75rem .8rem;
    }

    .pdf-preview-dialog__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pdf-preview-dialog__actions a,
    .pdf-preview-dialog__actions button {
        width: 100%;
    }
}

.documents-courts {
    padding: 2rem 0;
    border-top: 1px solid #dddddd;
}

.external-documents {
    margin-top: 2.5rem;
}

.external-documents > h2 {
    text-align: center;
}

.external-document {
    padding: 1.6rem 0;
    border-top: 1px solid #dddddd;
}

.external-document h3 {
    display: flex;
    align-items: center;
    gap: .6rem;

    margin: 0 0 .75rem;

    color: #333333;

    font-size: 1.05rem;
    font-weight: 400;
}

.external-document h3::before {
    content: "";

    flex: 0 0 .45rem;

    width: .45rem;
    height: .45rem;

    background: #800000;
}

.external-document a,
.court-table a {
    color: #800000;
}



/* =========================================================
   Gerichtstermine
   ========================================================= */

.court-intro {
    max-width: 800px;
    margin: 0 auto 2.5rem;
}

.court-intro h2 {
    color: #333333;

    font-size: 1.2rem;
    font-weight: 400;
}

.court-group {
    max-width: 800px;
    margin: 0 auto 2rem;
}

.court-group > h2 {
    margin-bottom: .75rem;
    padding-bottom: .4rem;

    border-bottom: 1px solid #dddddd;

    color: #800000;

    font-size: 1.1rem;
    font-weight: 400;
}

/* Gebäude vor dem Städtenamen */
.court-group > h2 > i {
    margin-right: 8px;
}

.court-table-wrap {
    overflow-x: auto;
}

.court-table {
    width: 100%;
    border-collapse: collapse;
}

.court-table th,
.court-table td {
    padding: .65rem .5rem;

    border: 0;

    text-align: left;
    vertical-align: top;
}

.court-table th {
    width: 34%;
    font-weight: 400;
}

.court-table td {
    width: 33%;
}

/* Kleines Symbol für externen Link */
.court-table a i {
    margin-left: .25rem;

    color: #cccccc;

    font-size: .75em;
}

.court-table tbody tr:hover {
    background: #f2f2f2;
}

.court-external-note {
    max-width: 800px;
    margin: 2rem auto 0;

    font-size: .875rem;
}

.court-external-note i {
    margin-right: .4rem;
    color: #800000;
}

/* =========================================================
   Bewertungen
   ========================================================= */

.reviews-page > h1 {
    margin-bottom: 2rem;
    text-align: center;
}

.reviews-intro {
    max-width: 800px;
    margin: 0 auto 3rem;

    text-align: center;
}

.reviews-message {
    max-width: 800px;
    margin: 2rem auto;

    text-align: center;
}

.reviews-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 2.2rem;
}

/* Kopfbereich */

.review-card__head {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);

    gap: .9rem;

    margin: 0 .65rem 1.4rem;
}

.review-avatar {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 68px;
    height: 68px;

    border: 3px solid #eeeeee;
    border-radius: 50%;

    background: #f8f8f8;
    color: #d4d4d4;

    font-size: 2rem;
}

.review-card__meta {
    min-width: 0;
    padding-top: .15rem;

    font-size: .82rem;
    line-height: 1.55;
}

.review-card__author-rating {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: .3rem .6rem;
}

.review-card__author strong {
    color: #333333;
}

.review-stars {
    display: inline-flex;
    gap: .12rem;

    color: #800000;

    font-size: .8rem;
}

.review-card__areas {
    margin-top: .15rem;
}

.review-card__areas strong {
    color: #800000;
}

.review-card__date {
    display: block;

    margin-top: .45rem;

    color: #888888;

    font-size: .72rem;
}

/* Bewertungs-Sprechblase */

.review-card__body {
    position: relative;

    padding: 1.15rem 1rem 1.35rem;

    background: #f4f4f4;
}

.review-card__body::before {
    content: "";

    position: absolute;

    top: -12px;
    left: 27px;

    width: 0;
    height: 0;

    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #f4f4f4;
}

.review-card__title {
    display: grid;
    grid-template-columns: 2.15rem minmax(0, 1fr);
    align-items: start;
    gap: .55rem;

    margin: 0 0 .85rem;

    color: #333333;

    font-size: 1rem;
    font-weight: 600;
    font-style: italic;
    line-height: 1.5;
}

.review-card__quote {
    position: relative;
    top: -.08rem;

    color: #d8d8d8;

    font-size: 2rem;
    line-height: 1;

    text-align: center;
}

.review-card__text {
    font-style: italic;
    line-height: 1.65;
}

/* Antwort der Kanzlei */

.review-reply {
    margin-top: 1.4rem;
    padding-top: 1rem;

    border-top: 1px solid #dddddd;
}

.review-reply__title {
    margin: 0 0 .4rem;

    color: #800000;

    font-size: .85rem;
    font-weight: 600;
}

.review-reply__text {
    font-size: .85rem;
    font-style: normal;
    line-height: 1.6;
}

/* Seitennavigation Bewertungen */

.reviews-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;

    gap: .8rem 1.2rem;

    margin-top: 3rem;
}

.reviews-pagination__pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: .3rem;
}

.reviews-pagination a,
.reviews-pagination__current {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    min-height: 34px;

    padding: .3rem .55rem;

    text-decoration: none;
}

.reviews-pagination a {
    color: #800000;
}

.reviews-pagination a:hover,
.reviews-pagination a:focus-visible {
    background: #f2f2f2;
    color: #650000;
}

.reviews-pagination__current {
    background: #800000;
    color: #ffffff;
}

.reviews-pagination__prev,
.reviews-pagination__next {
    gap: .4rem;
}

/* =========================================================
   Bewertungsstatistik Sidebar
   ========================================================= */

.review-stats {
    margin-top: .25rem;
}


/* Durchschnitt */

.review-stats__summary {
    margin-bottom: 1.15rem;
}

.review-stats__rating {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;

    margin-bottom: .45rem;
}

.review-stats__stars {
    display: inline-flex;
    gap: .12rem;

    color: #800000;

    font-size: .88rem;
    line-height: 1;
}

.review-stats__average {
    color: #333333;

    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
}

.review-stats__average small {
    color: #5f5f5f;

    font-size: .72rem;
    font-weight: 400;
}


/* Anzahl Bewertungen */

.review-stats__total,
.review-stats__rated {
    margin: .18rem 0;

    font-size: .78rem;
    line-height: 1.5;
}

.review-stats__total strong {
    color: #333333;
    font-weight: 600;
}

.review-stats__rated {
    color: #5f5f5f;

    font-size: .73rem;
}


/* Verteilung */

.review-stats__distribution {
    display: grid;
    gap: .48rem;
}

.review-stats__row {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 30px;
    align-items: center;
    gap: .5rem;

    font-size: .74rem;
    line-height: 1.2;
}

.review-stats__label {
    color: #666666;
    white-space: nowrap;
}

.review-stats__label i {
    margin-left: .08rem;

    color: #800000;

    font-size: .65rem;
}

.review-stats__bar {
    display: block;

    height: 6px;

    background: #e5e5e5;
}

.review-stats__bar > span {
    display: block;

    height: 100%;

    background: #800000;
}

.review-stats__count {
    color: #666666;

    text-align: right;
}

.reviews-pagination__ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 28px;
    min-height: 34px;

    color: #999999;

    font-size: .9rem;
    line-height: 1;
}

/* Link zur Bewertungsseite */

.review-stats__link {
    margin: 1rem 0 0 !important;
    padding-top: .75rem;

    border-top: 1px solid #e8e8e8;

    font-size: .76rem;
    font-style: italic;
    line-height: 1.5;
}

.review-stats__link a {
    color: #800000;
    text-decoration: none;
}

.review-stats__link a:hover,
.review-stats__link a:focus-visible {
    color: #650000;
}

.review-stats__link i {
    margin-left: .25rem;

    font-size: .72rem;
}

/* Mobil */

@media (max-width: 700px) {

    .reviews-list {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .review-card__head {
        grid-template-columns: 58px minmax(0, 1fr);
        margin-left: 0;
        margin-right: 0;
    }

    .review-avatar {
        width: 54px;
        height: 54px;

        font-size: 1.5rem;
    }
}

/* =========================================================
   Bewertungen – Bewertung abgeben
   ========================================================= */

.reviews-submit-link {
    margin-top: 1.35rem !important;
}

.reviews-submit-button {
    display: inline-flex;
    align-items: center;
    gap: .55rem;

    color: #ffffff;
    text-decoration: none;
}

.reviews-submit-button:hover,
.reviews-submit-button:focus-visible {
    background: var(--bordeaux-dark);
    color: #ffffff;
}

.review-submit-page {
    max-width: 760px;
}

.review-submit-page > h1 {
    margin-bottom: 1.4rem;
}

.review-submit-intro {
    margin-bottom: 2rem;
}

.review-submit-form {
    margin-top: 2.25rem;
}

.review-rating-field {
    margin: 0 0 1.35rem;
    padding: 0;
    border: 0;
}

.review-rating-field legend {
    margin-bottom: .55rem;
    font-weight: 700;
}

.review-star-rating {
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: .16rem;
}

.review-star-rating input {
    position: absolute;

    width: 1px;
    height: 1px;
    margin: -1px;

    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);

    white-space: nowrap;
}

.review-star-rating__star {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 1.75rem;
    height: 1.75rem;

    color: #d3d3d3;

    font-size: 1.35rem;
    line-height: 1;

    cursor: pointer;

    transform-origin: center;
    transition:
        color .16s ease,
        transform .16s ease;
}

.review-star-rating input:checked ~ .review-star-rating__star {
    color: #800000;
}

.review-star-rating:hover .review-star-rating__star {
    color: #d3d3d3;
}

.review-star-rating:hover .review-star-rating__star:hover,
.review-star-rating__star:hover ~ .review-star-rating__star {
    color: #800000;
}

.review-star-rating__star:hover {
    transform: scale(1.18);
}

.review-star-rating input:focus-visible + .review-star-rating__star {
    outline: 2px solid #800000;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .review-star-rating__star {
        transition: none;
    }

    .review-star-rating__star:hover {
        transform: none;
    }
}

.review-submit-notice {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: .85rem;

    margin: 1.8rem 0;
    padding: 1.15rem 0;

    border-top: 1px solid var(--aside-line);
    border-bottom: 1px solid var(--aside-line);
}

.review-submit-notice > i {
    padding-top: .18rem;

    color: #800000;

    font-size: 1.1rem;
    text-align: center;
}

.review-submit-notice p {
    margin: .25rem 0 0;

    font-size: .9rem;
    line-height: 1.6;
}

.review-privacy-check {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: .7rem;
    align-items: start;

    margin: 1.5rem 0 .8rem;

    font-size: .88rem;
    font-weight: 400;
    line-height: 1.6;
}

.review-privacy-check input {
    width: 18px;
    height: 18px;
    margin: .22rem 0 0;
}

.review-submit-back {
    margin-top: 1.5rem;
}

.review-submit-back i {
    margin-right: .3rem;
}


/* =========================================================
   Datenschutz
   ========================================================= */

.privacy-page {
    max-width: 820px;
}

.privacy-page > h1 {
    margin-bottom: 2rem;
}

.privacy-section {
    margin-top: 2.2rem;
    padding-top: 1.8rem;

    border-top: 1px solid #dddddd;
}

.privacy-section h2 {
    margin: 0 0 1rem;

    color: #333333;

    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.45;
}

.privacy-section p:last-child {
    margin-bottom: 0;
}

/* =========================================================
   Formulare
   ========================================================= */

.contact-page,
.appointment-page,
.inkasso-page {
    max-width: 760px;
}

.contact-page > h1,
.appointment-page > h1,
.inkasso-page > h1 {
    margin-bottom: 1.25rem;
}

.contact-form {
    margin-top: 2.5rem;
}

.form-grid {
    display: grid;
    gap: 1rem 1.25rem;
}

.form-grid--2 {
    grid-template-columns: 1fr 1fr;
}

.form-grid--postcode {
    grid-template-columns: 150px 1fr;
}

.form-field {
    margin-bottom: 1.35rem;
}

.form-field label,
.form-field legend {
    display: block;
    margin-bottom: .4rem;

    font-weight: 600;
}

.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="tel"],
.form-field input[type="search"],
.form-field input[type="date"],
.form-field select {
    display: block;

    width: 100%;
    height: 48px;
    min-height: 48px;

    padding: 0 12px;

    border: 1px solid #d7dde5;
    border-radius: 4px;

    background: #ffffff;
    color: var(--text);

    font: inherit;
}

.form-field textarea {
    display: block;

    width: 100%;
    min-height: 180px;

    padding: 12px;

    border: 1px solid #d7dde5;
    border-radius: 4px;

    background: #ffffff;
    color: var(--text);

    font: inherit;
    resize: vertical;
}


/* Online-Terminanfrage */

.appointment-copy-note,
.appointment-binding-note {
    display: flex;
    align-items: flex-start;
    gap: .6rem;

    margin: 1.25rem 0;

    font-size: .9rem;
    line-height: 1.6;
}

.appointment-copy-note i,
.appointment-binding-note i {
    flex: 0 0 auto;
    width: 1.1rem;
    margin-top: .32rem;

    color: var(--bordeaux);
    text-align: center;
}

.appointment-binding-note {
    margin-top: .25rem;
    padding: .85rem 0;

    border-top: 1px solid var(--aside-line);
    border-bottom: 1px solid var(--aside-line);
}

.appointment-salutation-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem 1.35rem;
}

.appointment-picker {
    margin: .2rem 0 1.35rem;
    padding: 0;
    border: 0;
}

.appointment-picker > legend {
    margin-bottom: .55rem;
    font-weight: 600;
}

.appointment-picker__trigger {
    display: none;
    align-items: center;
    gap: .75rem;

    width: 100%;
    min-height: 48px;
    padding: 0 12px;

    border: 1px solid #d7dde5;
    border-radius: 4px;

    background: #ffffff;
    color: var(--text);

    font: inherit;
    text-align: left;
    cursor: pointer;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background-color .15s ease;
}

.js .appointment-picker__trigger {
    display: flex;
}

.appointment-picker__trigger:hover {
    border-color: #b9a1a1;
    background: #fdfbfb;
}

.appointment-picker__trigger:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

.appointment-picker__trigger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 28px;
    width: 28px;
    height: 28px;

    border-radius: 50%;
    background: #f5eded;
    color: var(--bordeaux);
}

.appointment-picker__summary {
    flex: 1 1 auto;
    min-width: 0;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.appointment-picker.has-selection .appointment-picker__summary {
    font-weight: 600;
}

.appointment-picker__chevron,
.appointment-picker__extra-toggle > i {
    flex: 0 0 auto;
    color: #777777;

    transition: transform .18s ease;
}

.appointment-picker.is-open .appointment-picker__chevron,
.appointment-picker__extra-toggle[aria-expanded="true"] > i {
    transform: rotate(180deg);
}

.appointment-picker__panel {
    display: grid;
    grid-template-columns: minmax(270px, .92fr) minmax(0, 1.55fr);
    gap: 1.1rem;

    margin-top: .65rem;
    padding: 1rem;

    border: 1px solid #d7dde5;
    border-radius: 6px;

    background: #ffffff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08);
}

.js .appointment-picker__panel {
    display: none;
}

.js .appointment-picker.is-open .appointment-picker__panel {
    display: grid;
}

.appointment-picker__date-card,
.appointment-picker__time-card {
    min-width: 0;
}

.appointment-picker__date-card {
    padding: .9rem;

    border: 1px solid #eceff2;
    border-radius: 5px;

    background: #fafafa;
}

.appointment-picker__section-title {
    display: flex;
    align-items: center;
    gap: .45rem;

    margin-bottom: .85rem;

    color: var(--bordeaux);
    font-weight: 700;
}

/* Moderner Monatskalender; ohne JavaScript bleibt das native Datumsfeld als Fallback sichtbar. */
.appointment-calendar {
    display: none;
}

.appointment-calendar__native-label {
    margin-bottom: .4rem;
}

.appointment-calendar__native {
    margin: 0;
}

.js .appointment-calendar__native-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.js .appointment-calendar__native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.js .appointment-calendar {
    display: block;
    width: 100%;
}

.appointment-calendar__toolbar {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 36px;
    align-items: center;
    gap: .4rem;

    margin-bottom: .75rem;
}

.appointment-calendar__month {
    min-width: 0;

    color: #333333;

    font-size: .9rem;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
}

.appointment-calendar__nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;

    border: 0;
    border-radius: 50%;

    background: transparent;
    color: #707070;

    font-size: .8rem;
    cursor: pointer;

    transition:
        background-color .15s ease,
        color .15s ease;
}

.appointment-calendar__nav:hover,
.appointment-calendar__nav:focus-visible {
    background: #f6eeee;
    color: var(--bordeaux);
}

.appointment-calendar__nav:disabled {
    background: transparent;
    color: #c9c9c9;
    cursor: default;
}

.appointment-calendar__weekdays,
.appointment-calendar__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .2rem;
}

.appointment-calendar__weekdays {
    margin-bottom: .25rem;
}

.appointment-calendar__weekdays span {
    padding: .15rem 0;

    color: #777777;

    font-size: .67rem;
    font-weight: 600;
    line-height: 1;
    text-align: center;
}

.appointment-calendar__blank {
    min-width: 0;
    aspect-ratio: 1;
}

.appointment-calendar__day {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 1;
    padding: 0;

    border: 0;
    border-radius: 50%;

    background: transparent;
    color: #525252;

    font: inherit;
    font-size: .78rem;
    line-height: 1;
    cursor: pointer;

    transition:
        background-color .15s ease,
        color .15s ease,
        box-shadow .15s ease;
}

.appointment-calendar__day:hover {
    background: #f6eeee;
    color: var(--bordeaux);
}

.appointment-calendar__day:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

.appointment-calendar__day.is-today:not(.is-selected) {
    color: var(--bordeaux);
    font-weight: 600;
}

.appointment-calendar__day.is-today:not(.is-selected)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 14%;

    width: 3px;
    height: 3px;

    border-radius: 50%;
    background: var(--bordeaux);

    transform: translateX(-50%);
}

.appointment-calendar__day.is-selected {
    background: #f2e3e3;
    color: var(--bordeaux);
    font-weight: 600;
    box-shadow: inset 0 0 0 1px rgba(128, 0, 0, .08);
}

.appointment-calendar__day.is-selected::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 12%;

    width: 4px;
    height: 4px;

    border-radius: 50%;
    background: var(--bordeaux);

    transform: translateX(-50%);
}

.appointment-calendar__day:disabled {
    background: transparent;
    color: #c4c4c4;
    cursor: default;
}

.appointment-calendar__day:disabled::after {
    display: none;
}

.appointment-picker__date-help {
    margin: .7rem 0 0;

    color: #666666;
    font-size: .8rem;
    line-height: 1.45;
}

.appointment-picker__time-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .7rem;

    margin: 0 0 .55rem;

    font-size: .86rem;
    font-weight: 600;
}

.appointment-picker__time-heading span {
    color: #777777;
    font-size: .78rem;
    font-weight: 400;
    white-space: nowrap;
}

.appointment-time-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .45rem;
}

.appointment-time-option {
    position: relative;

    display: block !important;
    margin: 0 !important;

    font-weight: 400 !important;
    cursor: pointer;
}

.appointment-time-option input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.appointment-time-option__button {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;
    padding: .45rem .5rem;

    border: 1px solid #cfd4da;
    border-radius: 4px;

    background: #ffffff;
    color: #333333;

    font-size: .9rem;
    line-height: 1.15;
    text-align: center;

    transition:
        border-color .15s ease,
        background-color .15s ease,
        color .15s ease,
        box-shadow .15s ease;
}

.appointment-time-option:hover .appointment-time-option__button {
    border-color: var(--bordeaux);
}

.appointment-time-option input:focus-visible + .appointment-time-option__button {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

.appointment-time-option input:checked + .appointment-time-option__button {
    border-color: var(--bordeaux);
    background: var(--bordeaux);
    color: #ffffff;
    box-shadow: 0 0 0 1px var(--bordeaux);
}

.appointment-picker__extra-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;

    width: 100%;
    margin: .7rem 0 0;
    padding: .55rem .7rem;

    border: 1px solid #e1e4e8;
    border-radius: 4px;

    background: #fafafa;
    color: #555555;

    font: inherit;
    text-align: left;
    cursor: pointer;
}

.appointment-picker__extra-toggle:hover {
    border-color: #cdbbbb;
    background: #f8f4f4;
}

.appointment-picker__extra-toggle:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

.appointment-picker__extra-toggle span {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .2rem .55rem;
}

.appointment-picker__extra-toggle strong {
    font-size: .86rem;
}

.appointment-picker__extra-toggle small {
    color: #777777;
    font-size: .75rem;
}

.appointment-picker__extra {
    margin-top: .55rem;
}

.js .appointment-picker__extra {
    display: none;
}

.js .appointment-picker__extra.is-open {
    display: block;
}

.appointment-picker__extra-note {
    margin: 0 0 .55rem;

    color: #777777;
    font-size: .78rem;
    line-height: 1.45;
}

.appointment-time-option--outside .appointment-time-option__button {
    border-color: #e1e4e8;
    background: #fbfbfb;
    color: #777777;
}

.appointment-time-option--outside:hover .appointment-time-option__button {
    border-color: #b9a1a1;
    background: #f8f4f4;
    color: #555555;
}

.appointment-time-option--outside input:checked + .appointment-time-option__button {
    border-color: var(--bordeaux);
    background: var(--bordeaux);
    color: #ffffff;
}

.appointment-time-option--flexible {
    margin-top: .7rem !important;
}

.appointment-time-option__button--flexible {
    justify-content: flex-start;
    gap: .6rem;

    min-height: 44px;
    padding: .6rem .75rem;

    text-align: left;
}

.appointment-time-option__title {
    flex: 0 0 auto;
    font-weight: 600;
}

.appointment-time-option__subtitle {
    color: #666666;
    font-size: .8rem;
}

.appointment-time-option input:checked + .appointment-time-option__button .appointment-time-option__subtitle {
    color: #ffffff;
}

@media (max-width: 700px) {
    .appointment-picker__panel {
        grid-template-columns: 1fr;
        gap: .9rem;
        padding: .8rem;
    }

    .appointment-picker__date-card {
        padding: .75rem;
    }
}

/* =========================================================
   Gewünschte Kontaktaufnahme
   ========================================================= */

.form-choice {
    margin: 0 0 1.35rem;
    padding: 0;
    border: 0;
}

.form-choice legend {
    margin: 0 0 .65rem;
    font-weight: 600;
}

.contact-choice-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem 1.35rem;
}

.contact-choice {
    position: relative;

    display: inline-flex !important;
    align-items: center;
    gap: .5rem;

    min-height: 36px;
    padding: .2rem 0;
    margin: 0 !important;

    border: 0;
    background: transparent;
    color: inherit;

    font-weight: 400 !important;
    white-space: nowrap;

    cursor: pointer;

    transition: color .15s ease;
}

.contact-choice:hover {
    color: var(--bordeaux);
}

.contact-choice input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.contact-choice__box {
    position: relative;
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 18px;
    height: 18px;

    border: 1.5px solid #9b9b9b;
    border-radius: 50%;

    background: #ffffff;
    color: transparent;
}

.contact-choice__box i {
    display: none;
}

.contact-choice__box::after {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: transparent;
}

.contact-choice:hover .contact-choice__box {
    border-color: var(--bordeaux);
}

.contact-choice input:checked + .contact-choice__box {
    border-color: var(--bordeaux);
    background: #ffffff;
}

.contact-choice input:checked + .contact-choice__box::after {
    background: var(--bordeaux);
}

.contact-choice input:focus-visible + .contact-choice__box {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}


/* =========================================================
   Dateiupload
   ========================================================= */

.form-upload {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 1rem;

    margin: 2rem 0;
    padding: 1.4rem;

    border-top: 1px solid var(--aside-line);
    border-bottom: 1px solid var(--aside-line);

    background: #faf8f8;
}

.form-upload__icon {
    display: flex;
    align-items: flex-start;
    justify-content: center;

    width: auto;
    height: auto;

    padding-top: .15rem;

    border: 0;
    background: transparent;

    color: var(--bordeaux);

    font-size: 1.25rem;
}

.form-upload__content {
    min-width: 0;
}

.form-upload__content > label {
    display: block;

    margin-bottom: .3rem;

    color: var(--bordeaux);

    font-weight: 700;
}

.form-upload__text {
    margin: 0 0 .8rem;

    font-size: .9rem;
    line-height: 1.55;
}

.form-upload input[type="file"] {
    display: block;

    width: 100%;
    max-width: 100%;

    font: inherit;
    font-size: .9rem;
}

.form-upload input[type="file"]::file-selector-button {
    margin-right: .8rem;

    padding: .65rem .9rem;

    border: 1px solid var(--bordeaux);

    background: var(--bordeaux);
    color: #ffffff;

    font: inherit;

    cursor: pointer;
}

.form-upload input[type="file"]::file-selector-button:hover {
    background: var(--bordeaux-dark);
    border-color: var(--bordeaux-dark);
}

.form-upload .form-help {
    margin: .65rem 0 0;

    color: #666666;

    font-size: .8rem;
}

.form-optional,
.form-help,
.form-required,
.form-privacy {
    font-size: .85rem;
    font-weight: 400;
}

.form-help {
    margin: .45rem 0 0;
}

.form-required {
    margin-top: 0;
}

.form-privacy {
    margin: 1.5rem 0;
    line-height: 1.6;
}

.form-submit {
    min-height: 48px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
}

.form-message {
    margin: 1.5rem 0;
    padding: 1rem 1.1rem;

    border-left: 4px solid var(--bordeaux);
}

.form-message--success {
    background: #f3f7f2;
}

.form-message--error {
    background: #faf2f2;
}

.form-message ul {
    margin-bottom: 0;
}

.form-honeypot {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;

    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;

    white-space: nowrap !important;
}


@media (max-width: 600px) {

    .contact-choice-grid,
    .appointment-salutation-grid {
        gap: .3rem 1.05rem;
    }

    .appointment-time-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .appointment-time-option__button--flexible {
        align-items: flex-start;
        flex-direction: column;
        gap: .2rem;
    }

    .form-upload {
        grid-template-columns: 24px minmax(0, 1fr);

        gap: .75rem;

        padding: 1.15rem;
    }

    .form-upload__icon {
        font-size: 1.1rem;
    }
}


/* =========================================================
   Nach oben Button
   ========================================================= */

html {
    scroll-behavior: smooth;
}

.back-to-top {
    position: fixed;
    right: 4.9rem;
    bottom: 2.5rem;
    z-index: 999;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    border: 1px solid transparent;
    border-radius: 50%;

    background: var(--bordeaux);
    color: #ffffff;

    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);

    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s ease,
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.back-to-top:hover,
.back-to-top:focus-visible {
    background: #ffffff;
    color: var(--bordeaux);
    border-color: var(--bordeaux);
}

.back-to-top:focus-visible {
    outline: none;
}

@media (max-width: 700px) {
    .back-to-top {
        right: 1rem;
        bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));

        width: 42px;
        height: 42px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .back-to-top {
        transition: none;
    }
}


/* =========================================================
   Footer
   ========================================================= */

.site-footer {
    margin-top: 0;

    background: #333333;
    color: rgba(255, 255, 255, .82);

    text-align: center;
}

.site-footer__inner {
    width: min(100% - 2rem, var(--max-width));
    margin-inline: auto;

    padding: 2rem 0 2.2rem;
}

.footer-address {
    font-size: .8rem;
    line-height: 1.4;
}

.site-footer a {
    color: rgba(255, 255, 255, .82);
}

.site-footer a:hover,
.site-footer a:focus-visible {
    color: #ffffff;
}

.footer-logo {
    display: block;

    width: 24px;
    height: 24px;

    margin: 1rem auto;

    object-fit: contain;
}

.footer-copyright {
    margin: 0 0 1rem;

    font-size: .75rem;
    font-style: italic;
}

.footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: .3rem .65rem;

    font-size: .72rem;
    text-transform: uppercase;
}

.footer-nav a {
    text-decoration: underline;
}

.footer-nav span {
    color: rgba(255, 255, 255, .45);
}


/* =========================================================
   Lesefortschritt
   ========================================================= */

.reading-progress {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;

    height: 8px;

    pointer-events: none;
}

.reading-progress-fill {
    width: 0;
    height: 100%;

    background: var(--bordeaux);

    transform-origin: left center;
}

@media (max-width: 600px) {

    .site-footer__inner {
        padding: 1.75rem 0 2rem;
    }

    .footer-nav {
        gap: .45rem .6rem;

        line-height: 1.7;
    }
}


/* =========================================================
   Suche
   ========================================================= */

.search-page h1 {
    margin-bottom: 2rem;
}

.search-page-form {
    margin-bottom: 2.5rem;
}

.search-page-form label {
    display: block;

    margin-bottom: .45rem;

    font-weight: 700;
}

.search-page-form__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;

    gap: .75rem;
}

.search-page-form input {
    min-width: 0;
    min-height: 48px;

    padding: .65rem .8rem;

    border: 1px solid var(--border);
    border-radius: 0;

    background: #ffffff;
    color: var(--text);

    font: inherit;
}

.search-page-form button {
    min-height: 48px;

    display: inline-flex;
    align-items: center;

    gap: .5rem;
}

.search-info,
.search-result-count {
    margin: 1.5rem 0;
}

.search-results {
    display: grid;

    gap: 0;
}

.search-result {
    padding: 1.4rem 0;

    border-bottom: 1px solid var(--border);
}

.search-result:first-child {
    border-top: 1px solid var(--border);
}

.search-result h2 {
    margin: 0 0 .65rem;

    font-size: 1.1rem;
    font-weight: 400;
}

.search-result h2 a {
    color: var(--bordeaux);

    text-decoration: none;
}

.search-result h2 a:hover,
.search-result h2 a:focus-visible {
    text-decoration: underline;
}

.search-result p {
    margin: 0 0 .7rem;

    line-height: 1.7;
}

.search-result__link {
    font-size: .875rem;
}


@media (max-width: 600px) {

    .search-page-form__row {
        grid-template-columns: 1fr;
    }

    .search-page-form button {
        justify-content: center;
    }
}


/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 850px) {

    .site-layout {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .site-main {
        padding: 1.5rem;
    }

    .site-aside {
        padding-top: 0.75rem;

        /* bewusst keine Trennlinie oberhalb der Sidebar */
        border-top: 0;
    }
}


/* =========================================================
   Mobile Hauptnavigation
   ========================================================= */

@media (max-width: 700px) {

    .site-header__inner {
        min-height: 140px;

        padding: 1.5rem 1rem;
    }

    .js .menu-toggle-wrap {
        display: block;

        width: min(100% - 2rem, var(--max-width));
        margin-inline: auto;
    }

    .js .menu-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;

        width: 100%;
        min-height: 52px;

        padding: .75rem 0;

        border: 0;
        border-radius: 0;

        background: #ffffff;
        color: var(--text);

        font: inherit;
        font-weight: 700;
        text-align: left;
    }

    .js .menu-toggle:hover {
        background: #ffffff;
        color: var(--bordeaux);
    }

    .js .menu-toggle__label {
        display: flex;
        align-items: center;

        gap: .65rem;
    }

    .js .menu-toggle__icon {
        font-size: 1.35rem;
        line-height: 1;
    }

    .js .site-nav__inner {
        display: none;

        width: 100%;
        margin: 0;
    }

    .js .site-nav__inner.is-open {
        display: block;
    }

    .js .site-nav a {
        display: flex;
        align-items: center;
        justify-content: flex-start;

        width: 100%;
        min-height: 52px;

        padding: .8rem 1rem;

        border-right: 0;
        border-bottom: 1px solid var(--border);

        background: #ffffff;
        color: var(--text);

        text-align: left;
    }

    .js .site-nav a:hover,
    .js .site-nav a:focus-visible {
        background: #f7f7f7;
        color: var(--bordeaux);
    }

    .js .site-nav a[aria-current="page"] {
        padding-left: calc(1rem - 4px);

        border-left: 4px solid var(--bordeaux);
        border-bottom-color: var(--border);

        background: #f8f4f4;
        color: var(--bordeaux);
    }
}


@media (max-width: 600px) {

    .site-layout {
        margin-top: .5rem;
    }

    .home-panorama img {
        padding: 3px;
    }

    .home-intro h1 {
        line-height: 1.25;
        letter-spacing: .055em;
    }

    .home-intro h2 {
        font-size: 1.05rem;
        line-height: 1.5;
        letter-spacing: .045em;
        text-align: center;
    }

    .home-intro p {
        margin-bottom: 1.25rem;
        line-height: 1.7;
    }

    .site-main {
        padding: 1.25rem 1.25rem .5rem;
    }

    .aside-section {
        margin-bottom: 1.75rem;
    }

    .home-panorama {
        margin-bottom: 1.5rem;
    }

    .home-sections {
        grid-template-columns: 1fr;

        gap: .6rem;

        margin-bottom: 2.5rem;
    }

    .home-sections a {
        min-height: 52px;
    }

    .home-intro h1 {
        font-size: 1.3rem;
    }

    .form-grid--2,
    .form-grid--postcode {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .form-submit {
        width: 100%;
    }
}
/* =========================================================
   Kurzauswahl – direkte Dokumente
   ========================================================= */

.aside-quick-documents {
    margin: .55rem 0 0;
    padding: 0;
    list-style: none;
}

.aside-quick-documents li {
    margin: 0 0 .35rem;
}

.aside-quick-documents li:last-child {
    margin-bottom: 0;
}

.aside-quick-documents a {
    display: inline-flex;
    align-items: flex-start;
    gap: .35rem;
    color: var(--text);
    font-size: 1rem;
    line-height: 1.75;
    text-decoration: none;
}

.aside-quick-documents a:hover,
.aside-quick-documents a:focus-visible {
    color: var(--bordeaux);
}

.aside-quick-documents__icon {
    flex: 0 0 auto;
    width: auto;
    height: 1em;
    margin-top: .15em;
}

.aside-quick-documents-more {
    margin: 1rem 0 0 !important;
    text-align: right;
    font-style: italic;
}

.aside-quick-documents-more a {
    color: var(--text);
    text-decoration: none;
}

.aside-quick-documents-more a:hover,
.aside-quick-documents-more a:focus-visible {
    color: var(--bordeaux);
}

.document-entry[id] {
    scroll-margin-top: 1.5rem;
}

.documents-empty-note {
    margin: 0 0 2.5rem;
    padding: 1rem 0;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    color: #666666;
    font-style: italic;
}

/* =========================================================
   Hinweise & Sonderzeiten – öffentliche Hinweise
   ========================================================= */

.office-notice-sidebar__item {
    padding: .2rem 0 .9rem;
}

.office-notice-sidebar__item + .office-notice-sidebar__item {
    padding-top: .9rem;
    border-top: 1px solid #e4e4e4;
}

.office-notice-sidebar__item > strong {
    display: block;
    margin-bottom: .25rem;
    color: #333333;
    font-weight: 600;
}

.office-notice-sidebar__period {
    display: block;
    margin-bottom: .55rem;
    color: var(--bordeaux);
    font-size: .82rem;
    font-style: italic;
}

.office-notice-sidebar__item p {
    margin: .35rem 0;
    font-size: .9rem;
    line-height: 1.6;
}

.office-notice-sidebar__hours {
    padding-top: .45rem;
    border-top: 1px solid #eeeeee;
}

.home-office-notices {
    display: grid;
    gap: .9rem;
    margin: 0 0 2rem;
}

.home-office-notice {
    padding: 1rem 1.15rem;
    border-left: 4px solid var(--bordeaux);
    background: #faf7f7;
}

.home-office-notice h2 {
    margin: 0 0 .45rem;
    color: #333333;
    font-size: 1.1rem;
    font-weight: 400;
}

.home-office-notice p {
    margin: .45rem 0;
}

.home-office-notice__period {
    color: var(--bordeaux);
    font-size: .9rem;
    font-style: italic;
}

.home-office-notice__hours {
    padding-top: .6rem;
    border-top: 1px solid #e4dada;
}

.office-notice-dialog {
    width: min(920px, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #ffffff;
    color: var(--text);
    box-shadow: 0 14px 44px rgba(0, 0, 0, .32);
}

.office-notice-dialog::backdrop {
    background: rgba(0, 0, 0, .58);
}

.office-notice-dialog__shell {
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, .9fr) minmax(0, 1.25fr);
    max-height: calc(100vh - 2rem);
    overflow: auto;
}

.office-notice-dialog__shell:not(:has(.office-notice-dialog__media)) {
    grid-template-columns: 1fr;
}

.office-notice-dialog__media {
    min-height: 100%;
    background: #f2f2f2;
}

.office-notice-dialog__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
}

.office-notice-dialog__content {
    align-self: center;
    padding: 3rem 2.5rem 2.5rem;
    background: #ffffff;
}

.office-notice-dialog__content h2 {
    margin: 0 0 1.25rem;
    color: var(--bordeaux);
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1.4;
}

.office-notice-dialog__content p {
    margin: 0 0 1rem;
    line-height: 1.7;
}

.office-notice-dialog__hours {
    padding-top: .85rem;
    border-top: 1px solid #e4e4e4;
}

.office-notice-dialog__period {
    margin-top: 1.35rem !important;
    padding-top: .8rem;
    border-top: 1px solid #e4e4e4;
    color: #777777;
    font-size: .86rem;
    font-style: italic;
    text-align: right;
}

.office-notice-dialog__close {
    position: absolute;
    top: .55rem;
    right: .65rem;
    z-index: 2;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    background: #ffffff;
    color: #333333;
    font-size: 1.5rem;
    line-height: 1;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .16);
}

.office-notice-dialog__dismiss {
    margin-top: .35rem;
}

@media (max-width: 700px) {
    .office-notice-dialog {
        width: calc(100vw - 1rem);
        max-height: calc(100vh - 1rem);
    }

    .office-notice-dialog__shell {
        grid-template-columns: 1fr;
        max-height: calc(100vh - 1rem);
    }

    .office-notice-dialog__media img {
        min-height: 0;
        max-height: 34vh;
        object-fit: cover;
    }

    .office-notice-dialog__content {
        padding: 1.6rem 1.2rem 1.4rem;
    }

    .office-notice-dialog__content h2 {
        padding-right: 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .office-notice-dialog {
        scroll-behavior: auto;
    }
}

/* =========================================================
   Vollmacht-Generator
   ========================================================= */

.documents-generator {
    max-width: 800px;
    margin: 0 auto 2.5rem;
    padding: 1.6rem 0;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

.documents-generator h2 {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: 0 0 .75rem;
    color: #333333;
    font-size: 1.1rem;
    font-weight: 400;
}

.documents-generator h2 i {
    color: var(--bordeaux);
}

.vollmacht-page {
    max-width: 760px;
}

.vollmacht-page > h1 {
    margin-bottom: 1.25rem;
}

.vollmacht-privacy-note {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin: 1.4rem 0;
    padding: .85rem 0;
    border-top: 1px solid var(--aside-line);
    border-bottom: 1px solid var(--aside-line);
    font-size: .9rem;
    line-height: 1.6;
}

.vollmacht-privacy-note i {
    flex: 0 0 auto;
    margin-top: .3rem;
    color: var(--bordeaux);
}

.vollmacht-rubrum {
    margin: 0 0 .25rem;
    padding: 0;
    border: 0;
}

.vollmacht-rubrum legend {
    margin: 0 0 .85rem;
    padding: 0;
    color: #333333;
    font-weight: 700;
}

.vollmacht-rubrum[hidden] {
    display: none;
}

.vollmacht-back-link {
    margin-top: 2rem;
    font-style: italic;
}


/* =========================================================
   Inkasso + Testbetrieb
   ========================================================= */

.inkasso-header-image {
    margin: 0 0 2rem;
}

.inkasso-header-image img {
    display: block;
    width: 100%;
    height: auto;
    padding: 5px;
    border: 1px solid rgba(0, 0, 0, .1);
    background: #ffffff;
}

.inkasso-intro {
    margin-bottom: 2.5rem;
}

.inkasso-appointment {
    padding-top: 1.8rem;
    border-top: 1px solid #dddddd;
}

.inkasso-appointment > h2 {
    margin: 0 0 1rem;
    color: #333333;
    font-size: 1.2rem;
    font-weight: 400;
}

.staging-mail-note {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin: 1rem 0 1.4rem;
    padding: .75rem 0;
    border-top: 1px solid var(--aside-line);
    border-bottom: 1px solid var(--aside-line);
    font-size: .88rem;
    line-height: 1.55;
}

.staging-mail-note i {
    flex: 0 0 auto;
    margin-top: .25rem;
    color: var(--bordeaux);
}

.aside-quick-documents .fa-scale-balanced {
    position: relative;
    top: 4px;
}


@media (prefers-reduced-motion: reduce) {
    .site-header::before,
    .site-header::after,
    .site-header__inner::before {
        animation: none;
        will-change: auto;
    }
}
/*@media (prefers-reduced-motion: reduce) {
    .site-header::before,
    .site-header::after,
    .site-header__inner::before {
        animation-duration: 120s;
        animation-iteration-count: infinite;
    }
}*/

/* Barrierefreiheit: Bewegungen im Terminpicker auf Wunsch des Systems reduzieren. */
@media (prefers-reduced-motion: reduce) {
    .appointment-picker__trigger,
    .appointment-picker__chevron,
    .appointment-picker__extra-toggle > i,
    .appointment-calendar__nav,
    .appointment-calendar__day,
    .appointment-time-option__button,
    .appointment-picker__extra-toggle {
        transition: none !important;
    }
}

/* =========================================================
   Juristische Abkürzungen
   Optik angeglichen an Gerichtstermine
   ========================================================= */

.documents-abbreviations,
.legal-abbreviations-page {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.documents-abbreviations {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    padding: 1.6rem 0;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

.documents-abbreviations h2 {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: 0 0 .75rem;
    color: #333333;
    font-size: 1.1rem;
    font-weight: 400;
}

.documents-abbreviations h2 i {
    color: var(--bordeaux);
}

.legal-abbreviations-page > h1 {
    margin-bottom: .9rem;
}

.legal-abbreviations-page__intro {
    margin: 0 0 1.5rem;
}

.legal-abbreviations-jump {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin: 0 0 2rem;
}

.legal-abbreviations-jump a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.7rem;
    min-height: 2.7rem;
    padding: .35rem .65rem;
    border: 1px solid var(--border);
    background: #ffffff;
    color: var(--bordeaux);
    font-weight: 400;
    line-height: 1;
}

.legal-abbreviations-jump a:hover,
.legal-abbreviations-jump a:focus-visible {
    border-color: var(--bordeaux);
    background: #f2f2f2;
}

/* Wie .court-group bei den Gerichtsterminen */
.legal-abbreviation-group {
    margin: 0 auto 2rem;
    border: 0;
}

.legal-abbreviation-group:last-child {
    border: 0;
}

/* Wie .court-group > h2: Bordeaux, 400, feine Trennlinie */
.legal-abbreviation-group summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    margin-bottom: .75rem;
    padding: 0 2.2rem .4rem 0;
    border-bottom: 1px solid #dddddd;
    color: #800000;
    font-size: 1.1rem;
    font-weight: 400;
}

.legal-abbreviation-group summary::-webkit-details-marker {
    display: none;
}

.legal-abbreviation-group summary::after {
    content: "+";
    position: absolute;
    right: .25rem;
    top: 0;
    color: var(--bordeaux);
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.1;
}

.legal-abbreviation-group[open] summary::after {
    content: "−";
}

.legal-abbreviation-group summary:hover,
.legal-abbreviation-group summary:focus-visible {
    color: #650000;
    border-bottom-color: #800000;
}

.legal-abbreviation-group__content {
    padding: 0;
}

.legal-abbreviation-group table {
    width: 100%;
    border-collapse: collapse;
}

/* Wie .court-table th/td */
.legal-abbreviation-group th,
.legal-abbreviation-group td {
    padding: .65rem .5rem;
    border: 0;
    text-align: left;
    vertical-align: top;
}

/* Abkürzungen ausdrücklich nicht fett */
.legal-abbreviation-group th {
    width: 34%;
    color: inherit;
    font-weight: 400;
}

.legal-abbreviation-group td {
    width: 66%;
}

/* Derselbe Hover wie bei .court-table tbody tr:hover */
.legal-abbreviation-group tbody tr:hover,
.legal-abbreviation-group tbody tr:focus-within {
    background: #f2f2f2;
}

.legal-abbreviations-page__back {
    margin: 2rem 0 0;
}

.legal-abbreviations-page__back a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}

@media (max-width: 640px) {
    .legal-abbreviation-group th,
    .legal-abbreviation-group td {
        display: block;
        width: 100%;
        padding-left: .5rem;
        padding-right: .5rem;
    }

    .legal-abbreviation-group th {
        padding-bottom: .1rem;
    }

    .legal-abbreviation-group td {
        padding-top: .1rem;
    }
}

/* =========================================================
   Hauptnavigation – Submenüs (V21)
   Dokumente / Kontakt
   ========================================================= */

.site-nav__item {
    position: relative;
}

.site-nav__item-main {
    display: flex;
    align-items: stretch;
}

.site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link {
    color: var(--bordeaux);
    border-bottom-color: var(--bordeaux);
}

.site-nav__submenu-toggle {
    display: none;
}

.js .site-nav__submenu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 1.9rem;
    min-width: 1.9rem;
    padding: 0;

    border: 0;
    background: transparent;
    color: #8a8a8a;

    cursor: pointer;
}

.js .site-nav__submenu-toggle:hover,
.js .site-nav__submenu-toggle:focus-visible,
.site-nav__item.is-section-current > .site-nav__item-main > .site-nav__submenu-toggle {
    color: var(--bordeaux);
}

.site-nav__submenu-toggle i {
    font-size: .66rem;
    transition: transform 140ms ease;
}

.site-nav__submenu {
    position: absolute;
    top: calc(100% - 1px);
    left: 50%;
    z-index: 50;

    min-width: 235px;
    padding: .4rem 0;

    border: 1px solid #dddddd;
    border-top: 3px solid var(--bordeaux);
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .11);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, .45rem);

    transition:
        opacity 140ms ease,
        transform 140ms ease,
        visibility 140ms ease;
}

.site-nav .site-nav__submenu a {
    display: block;

    width: 100%;
    padding: .72rem 1rem;

    border: 0;
    background: #ffffff;
    color: var(--text);

    font-size: .84rem;
    line-height: 1.35;
    text-align: left;
    white-space: nowrap;
}

.site-nav .site-nav__submenu a:hover,
.site-nav .site-nav__submenu a:focus-visible {
    border: 0;
    background: #f5f5f5;
    color: var(--bordeaux);
}

.site-nav .site-nav__submenu a[aria-current="page"] {
    padding-left: calc(1rem - 3px);

    border: 0;
    border-left: 3px solid var(--bordeaux);
    background: #f8f4f4;
    color: var(--bordeaux);
}

@media (min-width: 701px) {
    .site-nav__item--has-submenu:hover > .site-nav__submenu,
    .site-nav__item--has-submenu:focus-within > .site-nav__submenu,
    .site-nav__item--has-submenu.is-submenu-open > .site-nav__submenu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0);
    }

    .site-nav__item--has-submenu:hover > .site-nav__item-main .site-nav__submenu-toggle i,
    .site-nav__item--has-submenu:focus-within > .site-nav__item-main .site-nav__submenu-toggle i,
    .site-nav__item--has-submenu.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle i {
        transform: rotate(180deg);
    }
}

/* Mobil: Navigation bleibt vollständig sichtbar – kein Hamburger-Menü. */
@media (max-width: 700px) {
    .js .menu-toggle-wrap {
        display: none;
    }

    .js .site-nav__inner {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;

        width: 100%;
        margin: 0;
    }

    .js .site-nav__item {
        width: 100%;
        min-width: 0;
    }

    .js .site-nav__item-main {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 46px;
        width: 100%;
    }

    .js .site-nav__item:not(.site-nav__item--has-submenu) > .site-nav__item-main {
        grid-template-columns: 1fr;
    }

    .js .site-nav__item-main > .site-nav__link {
        min-width: 0;
        min-height: 52px;
    }

    .js .site-nav__submenu-toggle {
        width: 46px;
        min-width: 46px;
        min-height: 52px;

        border-left: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
        background: #ffffff;
    }

    .js .site-nav__submenu-toggle:hover,
    .js .site-nav__submenu-toggle:focus-visible {
        background: #f7f7f7;
    }

    .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle {
        background: #f8f4f4;
        color: var(--bordeaux);
    }

    .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle i {
        transform: rotate(180deg);
    }

    .js .site-nav__submenu {
        top: 100%;
        left: 0;
        right: auto;

        display: none;
        min-width: max(100%, 235px);
        width: max(100%, 235px);
        padding: .3rem 0;

        border: 1px solid #dddddd;
        border-top: 3px solid var(--bordeaux);
        box-shadow: 0 10px 24px rgba(0, 0, 0, .12);

        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        transition: none;
    }

    .js .site-nav__item:nth-child(even) > .site-nav__submenu {
        left: auto;
        right: 0;
    }

    .js .site-nav__item.is-submenu-open > .site-nav__submenu {
        display: block;
    }

    .js .site-nav .site-nav__submenu a {
        min-height: 46px;
        padding: .7rem 1rem;

        border-bottom: 1px solid var(--border);
        background: #ffffff;

        font-size: .84rem;
    }

    .js .site-nav .site-nav__submenu a:last-child {
        border-bottom: 0;
    }

    .js .site-nav .site-nav__submenu a:hover,
    .js .site-nav .site-nav__submenu a:focus-visible {
        background: #f2f2f2;
    }

    .js .site-nav .site-nav__submenu a[aria-current="page"] {
        padding-left: calc(1rem - 4px);

        border-left: 4px solid var(--bordeaux);
        background: #f8f4f4;
    }

    .js .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link {
        padding-left: calc(1rem - 4px);
        border-left: 4px solid var(--bordeaux);
        border-bottom-color: var(--border);
        background: #f8f4f4;
        color: var(--bordeaux);
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-nav__submenu,
    .site-nav__submenu-toggle i {
        transition: none;
    }
}


/* =========================================================
   Hauptnavigation – Submenü-Optik wie Originalseite (V22)
   ========================================================= */

@media (min-width: 701px) {
    /* Die normale Hauptnavigations-Unterstreichung darf nicht in
       den Einträgen des Dropdowns erscheinen. */
    .site-nav .site-nav__submenu a::after {
        content: none;
        display: none;
    }

    .site-nav__submenu {
        top: 100%;
        left: -20px;

        min-width: 280px;
        padding: 10px 14px;

        border: 1px solid #dddddd;
        border-top: 1px solid #dddddd;
        background: #ffffff;
        box-shadow: 0 3px 10px rgba(0, 0, 0, .16);

        transform: translateY(.25rem);
    }

    /* Dokumente war auf der Originalseite bewusst deutlich breiter. */
    #nav-submenu-3 {
        width: 446px;
        max-width: min(446px, calc(100vw - 2rem));
    }

    #nav-submenu-5 {
        width: 300px;
        max-width: min(300px, calc(100vw - 2rem));
    }

    .site-nav .site-nav__submenu a {
        box-sizing: border-box;
        min-height: 50px;
        padding: 13px 14px;

        border: 0;
        background: #ffffff;
        color: #9a9a9a;

        font-size: 1rem;
        font-weight: 400;
        line-height: 1.45;
        white-space: normal;
    }

    .site-nav .site-nav__submenu a:hover,
    .site-nav .site-nav__submenu a:focus-visible,
    .site-nav .site-nav__submenu a[aria-current="page"] {
        /* 4 px Linie + 10 px Innenabstand = gleiche Textposition wie 14 px ohne Linie. */
        padding-left: 10px;

        border: 0;
        border-left: 4px solid var(--bordeaux);
        background: #f4f4f4;
        color: var(--bordeaux);
    }

    .site-nav__item--has-submenu:hover > .site-nav__submenu,
    .site-nav__item--has-submenu:focus-within > .site-nav__submenu,
    .site-nav__item--has-submenu.is-submenu-open > .site-nav__submenu {
        transform: translateY(0);
    }

    /* Beim geöffneten bzw. aktiven Bereich bleibt – wie im Original –
       die Bordeaux-Linie nur unter dem Hauptpunkt sichtbar. */
    .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link,
    .site-nav__item--has-submenu:hover > .site-nav__item-main > .site-nav__link,
    .site-nav__item--has-submenu:focus-within > .site-nav__item-main > .site-nav__link,
    .site-nav__item--has-submenu.is-submenu-open > .site-nav__item-main > .site-nav__link {
        color: #222222;
    }

    .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__submenu-toggle,
    .site-nav__item--has-submenu:hover > .site-nav__item-main > .site-nav__submenu-toggle,
    .site-nav__item--has-submenu:focus-within > .site-nav__item-main > .site-nav__submenu-toggle,
    .site-nav__item--has-submenu.is-submenu-open > .site-nav__item-main > .site-nav__submenu-toggle {
        color: #222222;
    }
}

/* =========================================================
   Dokumente – ruhige File-List mit kompakter Action Group (V24)
   ========================================================= */

.document-list {
    border-bottom: 1px solid #dddddd;
}

.document-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;

    margin: 0;
    padding: 1.15rem .75rem 1.15rem 1rem;

    border-top: 1px solid #dddddd;
    background: transparent;
    box-shadow: inset 4px 0 0 transparent;

    transition: background-color .16s ease, box-shadow .16s ease;
}

.document-entry:hover,
.document-entry:focus-within {
    background: #f7f7f7;
    box-shadow: inset 4px 0 0 var(--bordeaux);
}

.document-entry__main {
    min-width: 0;
}

.document-entry h2 {
    margin: 0 0 .3rem;

    color: #333333;

    font-size: 1.05rem;
    font-weight: 400;
    line-height: 1.45;
}

.document-entry h2 i {
    flex: 0 0 auto;
    width: 1rem;

    color: var(--bordeaux);

    text-align: center;
}

.document-entry__description {
    margin: 0 0 .28rem;

    color: var(--text);

    line-height: 1.65;
}

.document-entry__meta {
    margin: 0;

    color: #888888;

    font-size: .78rem;
    line-height: 1.45;
}

.document-actions {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
}

.document-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;
    padding: 0;

    border: 1px solid transparent;
    background: transparent;

    color: #777777;
    text-decoration: none;

    transition: border-color .15s ease, background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.document-action--download {
    color: var(--bordeaux);
}

.document-action:hover,
.document-action:focus-visible {
    border-color: #d7d7d7;
    background: #ffffff;
    color: var(--bordeaux);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}

.document-action:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

@media (max-width: 520px) {
    .document-entry {
        align-items: start;
        gap: .55rem;

        padding-right: .35rem;
        padding-left: .75rem;
    }

    .document-entry h2 {
        font-size: 1rem;
    }

    .document-entry__description {
        font-size: .94rem;
    }

    .document-actions {
        gap: 0;
    }

    .document-action {
        width: 38px;
        height: 38px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .document-entry,
    .document-action {
        transition: none;
    }
}

/* =========================================================
   Globaler Darstellungsmodus – Hell / Dunkel (V28)
   ========================================================= */

.theme-toggle {
    position: fixed;
    right: 4.9rem;
    bottom: 2.5rem;
    z-index: 999;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #ffffff;
    color: var(--bordeaux);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    border-color: var(--bordeaux);
    background: var(--bordeaux);
    color: #ffffff;
}

.theme-toggle i {
    font-size: 1rem;
}

@media (max-width: 700px) {
    .theme-toggle {
        right: 4.35rem;
        bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
        width: 42px;
        height: 42px;
    }
}

html[data-theme="dark"] {
    color-scheme: dark;
    --text: #e9e2e2;
    --surface: #2b2627;
    --border: #5b5052;
    --aside-line: #70545a;
}

html[data-theme="dark"] body {
    background: #211e1e;
    color: var(--text);
}

html[data-theme="dark"] a { color: #d4b483; }
html[data-theme="dark"] a:hover,
html[data-theme="dark"] a:focus-visible { color: #e8c79b; }

html[data-theme="dark"] .skip-link {
    background: #f7f1f1;
    color: #171515;
}

html[data-theme="dark"] .site-nav,
html[data-theme="dark"] .site-nav__submenu,
html[data-theme="dark"] .site-nav .site-nav__submenu a,
html[data-theme="dark"] .js .site-nav__submenu-toggle,
html[data-theme="dark"] .js .site-nav .site-nav__submenu a {
    background: #2b2627;
}

html[data-theme="dark"] .site-nav a,
html[data-theme="dark"] .site-nav__submenu-toggle { color: #d7cece; }

/* Primäre Aktionsflächen behalten auch im Dunkelmodus weißen Text. */
html[data-theme="dark"] .aside-button,
html[data-theme="dark"] .home-sections a,
html[data-theme="dark"] .home-appointment__button,
html[data-theme="dark"] .document-download,
html[data-theme="dark"] .document-internal-link,
html[data-theme="dark"] .reviews-submit-button,
html[data-theme="dark"] a.button {
    color: #ffffff;
}

html[data-theme="dark"] .email-reveal {
    color: #d4b483;
}

html[data-theme="dark"] .email-reveal:hover,
html[data-theme="dark"] .email-reveal:focus-visible {
    color: #e8c79b;
}

html[data-theme="dark"] .site-nav a:hover,
html[data-theme="dark"] .site-nav a:focus-visible,
html[data-theme="dark"] .site-nav a[aria-current="page"],
html[data-theme="dark"] .js .site-nav__submenu-toggle:hover,
html[data-theme="dark"] .js .site-nav__submenu-toggle:focus-visible,
html[data-theme="dark"] .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__submenu-toggle {
    color: #d4b483;
}

html[data-theme="dark"] .site-nav__submenu,
html[data-theme="dark"] .js .site-nav__submenu {
    border-color: #554b4c;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .36);
}

html[data-theme="dark"] .site-nav .site-nav__submenu a { color: #c8bebe; }

html[data-theme="dark"] .site-nav .site-nav__submenu a:hover,
html[data-theme="dark"] .site-nav .site-nav__submenu a:focus-visible,
html[data-theme="dark"] .site-nav .site-nav__submenu a[aria-current="page"],
html[data-theme="dark"] .js .site-nav .site-nav__submenu a:hover,
html[data-theme="dark"] .js .site-nav .site-nav__submenu a:focus-visible,
html[data-theme="dark"] .js .site-nav .site-nav__submenu a[aria-current="page"],
html[data-theme="dark"] .js .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link,
html[data-theme="dark"] .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle {
    background: #3b3032;
    color: #d4b483;
}

@media (min-width: 701px) {
    html[data-theme="dark"] .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .site-nav__item--has-submenu:hover > .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .site-nav__item--has-submenu:focus-within > .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .site-nav__item--has-submenu.is-submenu-open > .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__submenu-toggle,
    html[data-theme="dark"] .site-nav__item--has-submenu:hover > .site-nav__item-main > .site-nav__submenu-toggle,
    html[data-theme="dark"] .site-nav__item--has-submenu:focus-within > .site-nav__item-main > .site-nav__submenu-toggle,
    html[data-theme="dark"] .site-nav__item--has-submenu.is-submenu-open > .site-nav__item-main > .site-nav__submenu-toggle {
        color: #f2e9e9;
    }
}

html[data-theme="dark"] .site-main h1,
html[data-theme="dark"] .aside-section h2,
html[data-theme="dark"] .home-intro h1,
html[data-theme="dark"] .home-intro h2,
html[data-theme="dark"] .home-appointment__header h2,
html[data-theme="dark"] .home-appointment-step h3,
html[data-theme="dark"] .legal-area h2,
html[data-theme="dark"] .vita-intro__title h2,
html[data-theme="dark"] .vita-section-title,
html[data-theme="dark"] .document-entry h2,
html[data-theme="dark"] .documents-courts h2,
html[data-theme="dark"] .external-document h3,
html[data-theme="dark"] .court-intro h2,
html[data-theme="dark"] .review-card__author strong,
html[data-theme="dark"] .review-card__title,
html[data-theme="dark"] .review-stats__average,
html[data-theme="dark"] .review-stats__total strong,
html[data-theme="dark"] .privacy-section h2,
html[data-theme="dark"] .pdf-preview-dialog__header h2,
html[data-theme="dark"] .documents-generator h2,
html[data-theme="dark"] .legal-abbreviation-group summary,
html[data-theme="dark"] .search-result h2 {
    color: #f0e8e8;
}

html[data-theme="dark"] .home-intro h2 em,
html[data-theme="dark"] .home-appointment__note,
html[data-theme="dark"] .document-entry__meta,
html[data-theme="dark"] .pdf-preview-dialog__hint,
html[data-theme="dark"] .review-card__date,
html[data-theme="dark"] .review-stats__rated,
html[data-theme="dark"] .review-stats__label,
html[data-theme="dark"] .review-stats__count,
html[data-theme="dark"] .appointment-picker__extra-note,
html[data-theme="dark"] .appointment-time-option__subtitle,
html[data-theme="dark"] .form-upload .form-help,
html[data-theme="dark"] .office-notice-dialog__period { color: #c9bfc0; }

html[data-theme="dark"] .home-panorama img,
html[data-theme="dark"] .vita-tooltip__text,
html[data-theme="dark"] .pdf-preview-dialog,
html[data-theme="dark"] .pdf-preview-dialog__header,
html[data-theme="dark"] .pdf-preview-dialog__footer,
html[data-theme="dark"] .pdf-preview-dialog__close-icon,
html[data-theme="dark"] .pdf-preview-open,
html[data-theme="dark"] .pdf-preview-close,
html[data-theme="dark"] .form-field input[type="text"],
html[data-theme="dark"] .form-field input[type="email"],
html[data-theme="dark"] .form-field input[type="tel"],
html[data-theme="dark"] .form-field input[type="search"],
html[data-theme="dark"] .form-field input[type="date"],
html[data-theme="dark"] .form-field select,
html[data-theme="dark"] .form-field textarea,
html[data-theme="dark"] .appointment-picker__trigger,
html[data-theme="dark"] .appointment-picker__panel,
html[data-theme="dark"] .appointment-picker__date-card,
html[data-theme="dark"] .contact-choice__box,
html[data-theme="dark"] .search-page-form input,
html[data-theme="dark"] .office-notice-dialog__content,
html[data-theme="dark"] .office-notice-dialog__close,
html[data-theme="dark"] .vollmacht-card,
html[data-theme="dark"] .legal-abbreviation-group,
html[data-theme="dark"] .document-action:hover,
html[data-theme="dark"] .document-action:focus-visible {
    background: #2b2627;
    color: var(--text);
    border-color: #554b4c;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .site-search input::placeholder { color: #aaa0a0; }

html[data-theme="dark"] .site-search__row,
html[data-theme="dark"] .office-hours th,
html[data-theme="dark"] .office-hours td,
html[data-theme="dark"] .home-appointment,
html[data-theme="dark"] .home-appointment__steps,
html[data-theme="dark"] .privacy-section,
html[data-theme="dark"] .document-entry,
html[data-theme="dark"] .document-list,
html[data-theme="dark"] .documents-courts,
html[data-theme="dark"] .external-document,
html[data-theme="dark"] .court-group > h2,
html[data-theme="dark"] .court-external-note,
html[data-theme="dark"] .review-reply,
html[data-theme="dark"] .review-stats__link,
html[data-theme="dark"] .search-result,
html[data-theme="dark"] .documents-generator,
html[data-theme="dark"] .legal-abbreviation-intro,
html[data-theme="dark"] .legal-abbreviation-group summary { border-color: #554b4c; }

html[data-theme="dark"] .legal-areas > .legal-area:nth-child(odd) { background: #242021; }

html[data-theme="dark"] .legal-areas > .legal-area:nth-child(even),
html[data-theme="dark"] .review-card__body,
html[data-theme="dark"] .form-upload,
html[data-theme="dark"] .office-notice-sidebar__item,
html[data-theme="dark"] .office-notice-dialog__media,
html[data-theme="dark"] .document-entry:hover,
html[data-theme="dark"] .document-entry:focus-within,
html[data-theme="dark"] .court-table tbody tr:hover,
html[data-theme="dark"] .legal-abbreviation-table tbody tr:hover,
html[data-theme="dark"] .legal-abbreviation-table tbody tr:focus-within { background: #302a2a; }

html[data-theme="dark"] .review-card__body::before { border-bottom-color: #302a2a; }

html[data-theme="dark"] .review-avatar,
html[data-theme="dark"] .review-stats__bar,
html[data-theme="dark"] .appointment-time-option__button,
html[data-theme="dark"] .appointment-time-option--outside .appointment-time-option__button {
    background: #332e2e;
    border-color: #554b4c;
    color: #c8bebe;
}

html[data-theme="dark"] .appointment-time-option:hover .appointment-time-option__button,
html[data-theme="dark"] .appointment-time-option--outside:hover .appointment-time-option__button {
    background: #3b3032;
    border-color: #7a555a;
    color: #f0e8e8;
}

html[data-theme="dark"] .home-appointment__phone { background: #302a2a; }
html[data-theme="dark"] .home-appointment-step__number { background: #422f33; color: #f0e8e8; }
html[data-theme="dark"] .home-appointment-step:not(:last-child)::after { background: #554b4c; }
html[data-theme="dark"] .home-appointment__accent { background: #a92f3f; }
html[data-theme="dark"] .legal-area li::marker,
html[data-theme="dark"] .court-external-note i,
html[data-theme="dark"] .form-upload__icon { color: #d4b483; }

/* Warnhinweise müssen im Dunkelmodus klar lesbar bleiben. */
html[data-theme="dark"] .legal-warning {
    color: #d4b483;
}

/* Kompakte Radio-Auswahl statt großer Auswahlkarten. */
html[data-theme="dark"] .contact-choice {
    color: #e9e2e2;
}

html[data-theme="dark"] .contact-choice:hover,
html[data-theme="dark"] .contact-choice:focus-within {
    color: #f2b2b8;
}

html[data-theme="dark"] .contact-choice__box,
html[data-theme="dark"] .contact-choice input:checked + .contact-choice__box {
    border-color: #9f8f92;
    background: #211e1e;
}

html[data-theme="dark"] .contact-choice:hover .contact-choice__box,
html[data-theme="dark"] .contact-choice input:checked + .contact-choice__box {
    border-color: #d4b483;
}

html[data-theme="dark"] .contact-choice input:checked + .contact-choice__box::after {
    background: #d4b483;
}

html[data-theme="dark"] .home-intro strong,
html[data-theme="dark"] .review-stars,
html[data-theme="dark"] .review-card__areas strong,
html[data-theme="dark"] .review-reply__title,
html[data-theme="dark"] .review-stats__stars,
html[data-theme="dark"] .review-stats__label i,
html[data-theme="dark"] .court-group > h2,
html[data-theme="dark"] .document-entry h2 i,
html[data-theme="dark"] .documents-courts h2 i,
html[data-theme="dark"] .external-document a,
html[data-theme="dark"] .court-table a,
html[data-theme="dark"] .vita-section-title i,
html[data-theme="dark"] .legal-area h2 i,
html[data-theme="dark"] .home-appointment__phone-icon { color: #d4b483; }

html[data-theme="dark"] .form-message--success { background: #1d291f; }
html[data-theme="dark"] .form-message--error { background: #2c1e1f; }
html[data-theme="dark"] .pdf-preview-dialog__viewer { background: #1b1818; }
html[data-theme="dark"] .site-footer { background: #171414; }

html[data-theme="dark"] .theme-toggle {
    border-color: #4b4142;
    background: #2b2627;
    color: #f0b0b6;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .38);
}

html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .theme-toggle:focus-visible {
    border-color: #a92f3f;
    background: #a92f3f;
    color: #ffffff;
}

html[data-theme="dark"] .back-to-top {
    border-color: transparent;
    background: var(--bordeaux);
    color: #ffffff;
}

html[data-theme="dark"] .home-appointment__form-card {
    border-color: #554b4c;
    background: #2b2627;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .home-appointment__form-heading {
    border-bottom-color: #554b4c;
}

html[data-theme="dark"] .home-appointment__form-heading h3 { color: #f3eded; }
html[data-theme="dark"] .home-appointment__form-heading p { color: #c9bfc0; }
html[data-theme="dark"] .home-appointment__form-icon {
    background: #422f33;
    color: #d4b483;
}

html[data-theme="dark"] .home-appointment__form-card .contact-choice,
html[data-theme="dark"] .home-appointment__form-card .contact-choice:hover,
html[data-theme="dark"] .home-appointment__form-card .contact-choice:focus-within,
html[data-theme="dark"] .home-appointment__form-card .contact-choice:has(input:checked) {
    border-color: transparent;
    background: transparent;
}

/* Ältere Dokument-Aktionsklassen bleiben im Dunkelmodus ebenfalls konsistent. */
html[data-theme="dark"] .document-preview,
html[data-theme="dark"] .document-download:hover,
html[data-theme="dark"] .document-download:focus-visible,
html[data-theme="dark"] .document-internal-link:hover,
html[data-theme="dark"] .document-internal-link:focus-visible {
    background: #2b2627;
    color: #d4b483;
    border-color: #a92f3f;
}

@media (prefers-reduced-motion: reduce) {
    .theme-toggle { transition: none; }
}


/* Darkmode – Detailkorrekturen für interaktive Komponenten */
html[data-theme="dark"] .js .site-nav a,
html[data-theme="dark"] .js .menu-toggle,
html[data-theme="dark"] .js .site-nav__submenu-toggle {
    background: #2b2627;
    color: #d7cece;
}

html[data-theme="dark"] .js .site-nav a:hover,
html[data-theme="dark"] .js .site-nav a:focus-visible,
html[data-theme="dark"] .js .menu-toggle:hover,
html[data-theme="dark"] .js .site-nav__submenu-toggle:hover,
html[data-theme="dark"] .js .site-nav__submenu-toggle:focus-visible {
    background: #393232;
    color: #d4b483;
}

html[data-theme="dark"] .js .site-nav a[aria-current="page"],
html[data-theme="dark"] .js .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link {
    background: #3b3032;
    color: #d4b483;
}

html[data-theme="dark"] .site-search button:hover,
html[data-theme="dark"] .site-search button:focus-visible {
    background: #393232;
    color: #d4b483;
}

html[data-theme="dark"] .office-notice-sidebar__item > strong,
html[data-theme="dark"] .home-office-notice h2,
html[data-theme="dark"] .vollmacht-rubrum legend,
html[data-theme="dark"] .inkasso-appointment > h2,
html[data-theme="dark"] .documents-abbreviations h2,
html[data-theme="dark"] .appointment-calendar__month {
    color: #f0e8e8;
}

html[data-theme="dark"] .office-notice-sidebar__period,
html[data-theme="dark"] .home-office-notice__period,
html[data-theme="dark"] .documents-generator h2 i,
html[data-theme="dark"] .documents-abbreviations h2 i,
html[data-theme="dark"] .vollmacht-privacy-note i,
html[data-theme="dark"] .staging-mail-note i,
html[data-theme="dark"] .review-submit-notice > i {
    color: #d4b483;
}

html[data-theme="dark"] .office-notice-sidebar__item + .office-notice-sidebar__item,
html[data-theme="dark"] .office-notice-sidebar__hours,
html[data-theme="dark"] .home-office-notice__hours,
html[data-theme="dark"] .inkasso-appointment,
html[data-theme="dark"] .documents-abbreviations,
html[data-theme="dark"] .documents-empty-note {
    border-color: #554b4c;
}

html[data-theme="dark"] .home-office-notice {
    background: #302a2a;
}

html[data-theme="dark"] .inkasso-header-image img {
    border-color: #554b4c;
    background: #2b2627;
}

html[data-theme="dark"] .legal-abbreviations-jump a {
    border-color: #554b4c;
    background: #2b2627;
    color: #d4b483;
}

html[data-theme="dark"] .legal-abbreviations-jump a:hover,
html[data-theme="dark"] .legal-abbreviations-jump a:focus-visible,
html[data-theme="dark"] .legal-abbreviation-group tbody tr:hover,
html[data-theme="dark"] .legal-abbreviation-group tbody tr:focus-within {
    background: #393232;
}

html[data-theme="dark"] .legal-abbreviation-group summary {
    color: #d4b483;
}

html[data-theme="dark"] .legal-abbreviation-group summary:hover,
html[data-theme="dark"] .legal-abbreviation-group summary:focus-visible {
    color: #e8c79b;
    border-bottom-color: #a92f3f;
}

html[data-theme="dark"] .reviews-pagination a:hover,
html[data-theme="dark"] .reviews-pagination a:focus-visible {
    background: #393232;
    color: #e8c79b;
}

html[data-theme="dark"] .review-star-rating__star {
    color: #716666;
}

html[data-theme="dark"] .review-star-rating input:checked ~ .review-star-rating__star,
html[data-theme="dark"] .review-star-rating:hover .review-star-rating__star:hover,
html[data-theme="dark"] .review-star-rating__star:hover ~ .review-star-rating__star {
    color: #d4b483;
}

html[data-theme="dark"] .appointment-picker__trigger:hover {
    border-color: #7a555a;
    background: #393232;
}

html[data-theme="dark"] .appointment-picker__trigger-icon {
    background: #422f33;
    color: #d4b483;
}

html[data-theme="dark"] .appointment-picker__chevron,
html[data-theme="dark"] .appointment-picker__extra-toggle {
    border-color: #554b4c;
    background: #332e2e;
    color: #d7cece;
}

html[data-theme="dark"] .appointment-picker__extra-toggle:hover,
html[data-theme="dark"] .appointment-picker__extra-toggle:focus-visible {
    border-color: #7a555a;
    background: #3b3032;
    color: #f0e8e8;
}

html[data-theme="dark"] .appointment-picker__extra-toggle small {
    color: #b8aeae;
}

html[data-theme="dark"] .appointment-picker__extra-toggle > i,
html[data-theme="dark"] .appointment-calendar__weekdays span,
html[data-theme="dark"] .appointment-picker__date-help,
html[data-theme="dark"] .appointment-picker__time-heading span {
    color: #b8aeae;
}

html[data-theme="dark"] .appointment-calendar__nav {
    color: #cfc5c5;
}

html[data-theme="dark"] .appointment-calendar__nav:hover,
html[data-theme="dark"] .appointment-calendar__nav:focus-visible,
html[data-theme="dark"] .appointment-calendar__day:hover {
    background: #422f33;
    color: #d4b483;
}

html[data-theme="dark"] .appointment-calendar__nav:disabled,
html[data-theme="dark"] .appointment-calendar__day:disabled {
    color: #6f6666;
}

html[data-theme="dark"] .appointment-calendar__day {
    color: #d7cece;
}

html[data-theme="dark"] .appointment-calendar__day.is-today:not(.is-selected),
html[data-theme="dark"] .appointment-calendar__day.is-selected {
    color: #d4b483;
}

html[data-theme="dark"] .appointment-calendar__day.is-selected {
    background: #3a2b2d;
    box-shadow: inset 0 0 0 1px rgba(224, 154, 161, .25);
}


html[data-theme="dark"] .form-upload input[type="file"]::file-selector-button {
    border-color: #a92f3f;
    background: #800000;
    color: #ffffff;
}

html[data-theme="dark"] .back-to-top:hover,
html[data-theme="dark"] .back-to-top:focus-visible {
    background: #ffffff;
    color: var(--bordeaux);
    border-color: var(--bordeaux);
}

/* =========================================================
   Fehlerseiten
   ========================================================= */

/* Fehlerseiten ohne Sidebar: ruhiger, mittig zentrierter Hauptbereich */
.site-layout--error {
    grid-template-columns: minmax(0, 1fr);
    max-width: 1180px;
}

.site-main--error {
    width: 100%;
    max-width: 1040px;
    margin-inline: auto;
}

.site-main--error .error-page__actions {
    flex-wrap: nowrap;
}

@media (max-width: 700px) {
    .site-main--error .error-page__actions {
        display: grid;
        grid-template-columns: 1fr;
    }
}


.error-page {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
    align-items: center;
    gap: 2.5rem;

    min-height: 430px;
}

.error-page__copy {
    min-width: 0;
}

.error-page__eyebrow {
    margin: 0 0 .55rem;

    color: var(--bordeaux);

    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.error-page__copy > h1 {
    margin: 0 0 1rem;
}

.error-page__lead {
    margin: 0 0 .5rem;

    color: #444444;

    font-size: 1.08rem;
    line-height: 1.65;
}

.error-page__copy > p:not(.error-page__eyebrow):not(.error-page__lead) {
    margin: 0;
}

.error-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;

    margin-top: 1.65rem;
}

.error-page__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;

    min-height: 44px;
    padding: .65rem .85rem;

    border: 1px solid #d5cdcd;
    border-radius: 6px;

    background: #ffffff;
    color: var(--bordeaux);

    font-size: .9rem;
    line-height: 1.3;
    text-decoration: none;
}

.error-page__button:hover,
.error-page__button:focus-visible {
    border-color: var(--bordeaux);
    background: #f8f3f3;
    color: var(--bordeaux-dark);
}

.error-page__button--primary {
    border-color: var(--bordeaux);
    background: var(--bordeaux);
    color: #ffffff;
}

.error-page__button--primary:hover,
.error-page__button--primary:focus-visible {
    border-color: var(--bordeaux-dark);
    background: var(--bordeaux-dark);
    color: #ffffff;
}

.error-page__visual {
    margin: 0;
}

.error-page__visual img {
    display: block;

    width: 100%;
    max-width: 410px;
    height: auto;
    margin-inline: auto;

    border: 1px solid #e5dfda;
    border-radius: 7px;

    box-shadow: 0 12px 30px rgba(46, 31, 26, .08);
}

html[data-theme="dark"] .error-page__eyebrow {
    color: #d4b483;
}

html[data-theme="dark"] .error-page__lead {
    color: #eee5e5;
}

html[data-theme="dark"] .error-page__button {
    border-color: #554b4c;
    background: #2b2627;
    color: #d4b483;
}

html[data-theme="dark"] .error-page__button:hover,
html[data-theme="dark"] .error-page__button:focus-visible {
    border-color: #a92f3f;
    background: #393232;
    color: #e8c79b;
}

html[data-theme="dark"] .error-page__button--primary {
    border-color: #a92f3f;
    background: #8f1e2d;
    color: #ffffff;
}

html[data-theme="dark"] .error-page__button--primary:hover,
html[data-theme="dark"] .error-page__button--primary:focus-visible {
    border-color: #bb4050;
    background: #a92f3f;
    color: #ffffff;
}

html[data-theme="dark"] .error-page__visual img {
    border-color: #554b4c;
    filter: brightness(.78) saturate(.9);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
}

@media (max-width: 700px) {
    .error-page {
        grid-template-columns: 1fr;
        gap: 1.8rem;
        min-height: 0;
    }

    .error-page__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .error-page__button {
        width: 100%;
    }

    .error-page__visual {
        order: 2;
    }

    .error-page__visual img {
        max-width: 420px;
    }
}

/* =========================================================
   V33 – Mobile Navigation + Schutz vor horizontalem Überlauf
   ========================================================= */

/* Robuste Basis für schmale Viewports und eingebettete Fremdinhalte. */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

@supports (overflow: clip) {
    html,
    body {
        overflow-x: clip;
    }
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}

fieldset {
    min-width: 0;
}

.site-layout,
.site-main,
.site-aside,
.site-nav,
.site-nav__inner,
.site-nav__item,
.site-nav__item-main,
.form-field,
.form-grid {
    min-width: 0;
}

@media (max-width: 700px) {
    /* Klassisches, nach unten aufklappendes Hamburger-Menü. */
    .js .menu-toggle-wrap {
        display: block;
        width: 100%;
        margin: 0;
        border-top: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
        background: #ffffff;
    }

    .js .menu-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        width: min(100% - 2rem, var(--max-width));
        min-height: 50px;
        margin-inline: auto;
        padding: .65rem 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: var(--text);
        font: inherit;
        font-size: .95rem;
        font-weight: 400;
        text-align: left;
    }

    .js .menu-toggle:hover,
    .js .menu-toggle:focus-visible {
        background: transparent;
        color: var(--bordeaux);
    }

    .js .menu-toggle__label {
        display: block;
    }

    .js .menu-toggle__icon {
        flex: 0 0 auto;
        width: 1.4rem;
        font-size: 1.15rem;
        line-height: 1;
        text-align: center;
    }

    .js .site-nav__inner {
        display: none;
        grid-template-columns: none;
        width: 100%;
        margin: 0;
        padding: 0;
        border-bottom: 1px solid var(--border);
        background: #ffffff;
    }

    .js .site-nav__inner.is-open {
        display: block;
    }

    .js .site-nav__item {
        position: relative;
        width: 100%;
        min-width: 0;
    }

    .js .site-nav__item-main,
    .js .site-nav__item:not(.site-nav__item--has-submenu) > .site-nav__item-main {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: min(100% - 2rem, var(--max-width));
        margin-inline: auto;
    }

    .js .site-nav__item--has-submenu > .site-nav__item-main {
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .js .site-nav__item-main > .site-nav__link {
        min-width: 0;
        min-height: 50px;
        padding: .78rem 0;
        border: 0;
        border-bottom: 1px solid var(--border);
        background: transparent;
        color: var(--text);
        line-height: 1.4;
        text-align: left;
    }

    .js .site-nav__item-main > .site-nav__link::after {
        content: none;
        display: none;
    }

    .js .site-nav__submenu-toggle {
        width: 48px;
        min-width: 48px;
        min-height: 50px;
        padding: 0;
        border: 0;
        border-bottom: 1px solid var(--border);
        background: transparent;
        color: #777777;
    }

    .js .site-nav__submenu-toggle:hover,
    .js .site-nav__submenu-toggle:focus-visible,
    .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle {
        background: transparent;
        color: var(--bordeaux);
    }

    .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle i {
        transform: rotate(180deg);
    }

    /* Mobile Untermenüs sind Teil des Dokumentflusses, nicht schwebend. */
    .js .site-nav__submenu,
    .js .site-nav__item:nth-child(even) > .site-nav__submenu {
        position: static;
        inset: auto;
        display: none;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        transition: none;
    }

    .js .site-nav__item.is-submenu-open > .site-nav__submenu {
        display: block;
    }

    .js .site-nav .site-nav__submenu a {
        display: flex;
        align-items: center;
        width: 100%;
        min-width: 0;
        min-height: 46px;
        padding: .68rem max(1rem, calc((100% - var(--max-width)) / 2 + 1rem));
        padding-left: 2rem;
        border: 0;
        border-bottom: 1px solid var(--border);
        background: #f7f7f7;
        color: var(--text);
        font-size: .9rem;
        line-height: 1.4;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .js .site-nav .site-nav__submenu a:hover,
    .js .site-nav .site-nav__submenu a:focus-visible,
    .js .site-nav .site-nav__submenu a[aria-current="page"] {
        padding-left: calc(2rem - 4px);
        border-left: 4px solid var(--bordeaux);
        background: #f2eeee;
        color: var(--bordeaux);
    }

    .js .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link {
        padding-left: 0;
        border-left: 0;
        border-bottom-color: var(--border);
        background: transparent;
        color: var(--bordeaux);
    }

    /* Fremd-Widget und Profillogos dürfen den iPhone-Viewport nicht verbreitern. */
    .aside-profile-links {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        width: 100%;
        max-width: 100%;
        gap: .75rem;
    }

    .aside-profile-item,
    .aside-profile-item [data-anw-widget],
    .aside-profile-item [data-anw-widget] > *,
    .aside-profile-item [data-anw-widget] img,
    .aside-profile-item iframe,
    .aside-profile-item img {
        min-width: 0;
        max-width: 100% !important;
    }

    .aside-profile-item [data-anw-widget] {
        width: 100% !important;
    }

    input,
    select,
    textarea,
    button {
        max-width: 100%;
    }

    .site-main p,
    .site-main li,
    .site-aside p,
    .site-aside li,
    .site-footer {
        overflow-wrap: anywhere;
    }
}

html[data-theme="dark"] .js .menu-toggle-wrap,
html[data-theme="dark"] .js .site-nav__inner {
    background: #262223;
}

html[data-theme="dark"] .js .menu-toggle {
    color: #e9e2e2;
}

html[data-theme="dark"] .js .menu-toggle:hover,
html[data-theme="dark"] .js .menu-toggle:focus-visible {
    color: #d4b483;
}

@media (max-width: 700px) {
    html[data-theme="dark"] .js .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .js .site-nav__submenu-toggle {
        background: transparent;
        color: #ddd4d4;
    }

    html[data-theme="dark"] .js .site-nav .site-nav__submenu a {
        background: #2d2829;
        color: #d8cecf;
    }

    html[data-theme="dark"] .js .site-nav .site-nav__submenu a:hover,
    html[data-theme="dark"] .js .site-nav .site-nav__submenu a:focus-visible,
    html[data-theme="dark"] .js .site-nav .site-nav__submenu a[aria-current="page"] {
        background: #382f31;
        color: #d4b483;
    }

    html[data-theme="dark"] .js .site-nav__item.is-section-current > .site-nav__item-main > .site-nav__link,
    html[data-theme="dark"] .js .site-nav__item.is-submenu-open > .site-nav__item-main .site-nav__submenu-toggle {
        color: #d4b483;
    }
}

/* =========================================================
   V34 – Mobile Lesefläche, iPhone/Safari und Barrierefreiheit
   ========================================================= */

/* Verhindert die automatische iOS-Textvergrößerung, die sich je nach
   Browser-Shell unterschiedlich auswirken kann. */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* ---------- Darstellungs-/Barrierefreiheits-Werkzeuge ---------- */

.accessibility-tools {
    display: none;
}

.js .accessibility-tools {
    display: block;
    position: fixed;
    right: 1.25rem;
    bottom: 2.5rem;
    z-index: 1001;
}

.accessibility-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 50%;
    background: var(--bordeaux);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}

.accessibility-toggle:hover,
.accessibility-toggle:focus-visible {
    border-color: var(--bordeaux);
    background: #ffffff;
    color: var(--bordeaux);
}

.accessibility-toggle:focus-visible {
    outline: none;
}

/* Freistehendes Accessibility-Männchen ohne den integrierten weißen Kreis
   des Font-Awesome-Symbols "universal-access". */
.accessibility-toggle > i {
    font-size: 1.45rem;
    line-height: 1;
}

.accessibility-panel {
    position: absolute;
    right: 0;
    bottom: calc(100% + .85rem);
    width: min(22rem, calc(100vw - 2rem));
    max-height: calc(100dvh - 7rem);
    padding: 1rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid #ddd3d3;
    border-radius: 9px;
    background: #ffffff;
    color: var(--text);
    box-shadow: 0 12px 35px rgba(37, 24, 26, .22);
}

.accessibility-panel[hidden] {
    display: none !important;
}

.accessibility-panel__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    align-items: start;
    gap: .75rem;
    margin-bottom: .9rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid #e5dddd;
}

.accessibility-panel__header h2 {
    margin: 0;
    color: #333333;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
}

.accessibility-panel__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #777777;
}

.accessibility-panel__close:hover,
.accessibility-panel__close:focus-visible {
    background: #f5eeee;
    color: var(--bordeaux);
}

.accessibility-control {
    margin-bottom: .8rem;
}

.accessibility-control__label {
    display: block;
    margin-bottom: .45rem;
    color: #444444;
    font-size: .83rem;
    font-weight: 600;
}

.accessibility-font-controls {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 46px;
    align-items: center;
    gap: .55rem;
}

.accessibility-font-controls button {
    width: 46px;
    min-height: 40px;
    padding: .4rem;
    border: 1px solid #d7cdcd;
    border-radius: 5px;
    background: #ffffff;
    color: var(--bordeaux);
    font-weight: 600;
}

.accessibility-font-controls button:hover,
.accessibility-font-controls button:focus-visible {
    border-color: var(--bordeaux);
    background: #f8f2f2;
}

.accessibility-font-controls button:disabled {
    opacity: .42;
    cursor: default;
}

.accessibility-font-value {
    color: #555555;
    font-size: .86rem;
    text-align: center;
}

.accessibility-control--buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.accessibility-option,
.accessibility-reset {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .55rem;
    width: 100%;
    min-height: 42px;
    padding: .55rem .7rem;
    border: 1px solid #ddd3d3;
    border-radius: 5px;
    background: #ffffff;
    color: #555555;
    font-size: .82rem;
    line-height: 1.35;
    text-align: left;
}

.accessibility-option:hover,
.accessibility-option:focus-visible,
.accessibility-option[aria-pressed="true"] {
    border-color: #b98f93;
    background: #f8f1f2;
    color: var(--bordeaux);
}

.accessibility-control--master {
    margin-bottom: .9rem;
}

.accessibility-option--master {
    align-items: flex-start;
    min-height: 58px;
    padding: .7rem .75rem;
}

.accessibility-option--master > i {
    margin-top: .12rem;
    font-size: 1.05rem;
}

.accessibility-option--master > span {
    display: grid;
    gap: .12rem;
}

.accessibility-option--master strong {
    color: inherit;
    font-size: .88rem;
    font-weight: 600;
}

.accessibility-option--master small {
    color: #6d6465;
    font-size: .72rem;
    font-weight: 400;
    line-height: 1.35;
}

.accessibility-option--master[aria-pressed="true"] small {
    color: inherit;
}

.accessibility-option--theme {
    display: none;
    margin-bottom: .55rem;
}

.accessibility-theme {
    min-width: 0;
    margin: 0 0 .55rem;
    padding: 0;
    border: 0;
}

.accessibility-theme .accessibility-control__label {
    margin-bottom: .45rem;
    padding: 0;
}

.accessibility-theme__choices {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .4rem;
}

.accessibility-theme__choice {
    position: relative;
    min-width: 0;
    cursor: pointer;
}

.accessibility-theme__choice input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.accessibility-theme__choice-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 42px;
    padding: .5rem .35rem;
    border: 1px solid #ddd3d3;
    border-radius: 5px;
    background: #ffffff;
    color: #555555;
    font-size: .78rem;
    line-height: 1.2;
    text-align: center;
}

.accessibility-theme__choice:hover .accessibility-theme__choice-content,
.accessibility-theme__choice input:focus-visible + .accessibility-theme__choice-content {
    border-color: #b98f93;
    background: #f8f1f2;
    color: var(--bordeaux);
}

.accessibility-theme__choice input:focus-visible + .accessibility-theme__choice-content {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

.accessibility-theme__choice input:checked + .accessibility-theme__choice-content {
    border-color: var(--bordeaux);
    background: #f8f1f2;
    color: var(--bordeaux);
    font-weight: 600;
}

.accessibility-reset {
    margin-top: .2rem;
    border-color: transparent;
    background: transparent;
    color: #777777;
}

.accessibility-reset:hover,
.accessibility-reset:focus-visible {
    border-color: #ddd3d3;
    background: #f7f4f4;
    color: var(--bordeaux);
}

html[data-a11y-font="1"] {
    font-size: 112.5%;
}

html[data-a11y-font="2"] {
    font-size: 125%;
}

html[data-a11y-contrast="true"] {
    --text: #3f3f3f;
    --border: #aaaaaa;
    --aside-line: #c9aeb2;
}

/* Link-Hervorhebung ist eine eigene Option und nicht an den Kontrastmodus gekoppelt. */
html[data-a11y-links="true"] .site-main a:not(.button):not(.home-appointment__button):not(.reviews-submit-button):not(.error-page__button),
html[data-a11y-links="true"] .site-aside a:not(.aside-button),
html[data-a11y-links="true"] .site-footer a {
    text-decoration: underline;
    text-decoration-thickness: .1em;
    text-underline-offset: .16em;
}

html[data-a11y-readable-font="true"] body {
    font-family: "Atkinson Hyperlegible Next", Arial, sans-serif;
}

/* Im lesefreundlichen Modus Kursivschrift vermeiden */
html[data-a11y-readable-font="true"] body * {
    font-style: normal !important;
}

html[data-a11y-readable-font="true"] button,
html[data-a11y-readable-font="true"] input,
html[data-a11y-readable-font="true"] select,
html[data-a11y-readable-font="true"] textarea {
    font-family: inherit;
}

/*
 * Der optionale Kontrastmodus verstärkt bewusst nur die Darstellung.
 * Die normale Gestaltung bleibt unverändert. Explizite Grautöne werden hier
 * auf die kontrastreiche Textfarbe gehoben, damit sie nicht an den im Layout
 * fest hinterlegten helleren Einzelwerten hängen bleiben.
 */
html[data-a11y-contrast="true"] .site-search input::placeholder,
html[data-a11y-contrast="true"] .home-intro h2 em,
html[data-a11y-contrast="true"] .home-appointment__note,
html[data-a11y-contrast="true"] .home-appointment__form-heading p,
html[data-a11y-contrast="true"] .review-card__date,
html[data-a11y-contrast="true"] .appointment-picker__chevron,
html[data-a11y-contrast="true"] .appointment-picker__extra-toggle > i,
html[data-a11y-contrast="true"] .appointment-calendar__weekdays span,
html[data-a11y-contrast="true"] .appointment-picker__time-heading span,
html[data-a11y-contrast="true"] .appointment-picker__extra-toggle small,
html[data-a11y-contrast="true"] .appointment-picker__extra-note,
html[data-a11y-contrast="true"] .appointment-time-option--outside .appointment-time-option__button,
html[data-a11y-contrast="true"] .office-notice-dialog__period,
html[data-a11y-contrast="true"] .site-nav .site-nav__submenu a,
html[data-a11y-contrast="true"] .js .site-nav__submenu-toggle,
html[data-a11y-contrast="true"] .document-entry__meta,
html[data-a11y-contrast="true"] .document-action,
html[data-a11y-contrast="true"] .accessibility-panel__close,
html[data-a11y-contrast="true"] .accessibility-reset {
    color: var(--text);
}

/* Im Dunkelmodus muss der Kontrastmodus eine helle Textfarbe behalten. */
html[data-theme="dark"][data-a11y-contrast="true"] {
    --text: #ffffff;
    --surface: #171414;
    --border: #c8c0c0;
    --aside-line: #e0a0a7;
}

html[data-a11y-grayscale="true"] {
    filter: grayscale(1);
}

html[data-theme="dark"] .accessibility-toggle {
    border-color: transparent;
    background: var(--bordeaux);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .28);
}

html[data-theme="dark"] .accessibility-toggle:hover,
html[data-theme="dark"] .accessibility-toggle:focus-visible {
    border-color: var(--bordeaux);
    background: #ffffff;
    color: var(--bordeaux);
}

html[data-theme="dark"] .accessibility-panel {
    border-color: #554b4c;
    background: #262223;
    color: #d8cecf;
}

html[data-theme="dark"] .accessibility-panel__header {
    border-color: #554b4c;
}

html[data-theme="dark"] .accessibility-panel__header h2,
html[data-theme="dark"] .accessibility-control__label {
    color: #f0e8e8;
}

html[data-theme="dark"] .accessibility-panel__close,
html[data-theme="dark"] .accessibility-font-value,
html[data-theme="dark"] .accessibility-reset {
    color: #c9bfc0;
}

html[data-theme="dark"] .accessibility-font-controls button,
html[data-theme="dark"] .accessibility-option {
    border-color: #554b4c;
    background: #302a2a;
    color: #ddd4d4;
}

html[data-theme="dark"] .accessibility-theme__choice-content {
    border-color: #554b4c;
    background: #302a2a;
    color: #ddd4d4;
}

html[data-theme="dark"] .accessibility-theme__choice:hover .accessibility-theme__choice-content,
html[data-theme="dark"] .accessibility-theme__choice input:focus-visible + .accessibility-theme__choice-content,
html[data-theme="dark"] .accessibility-theme__choice input:checked + .accessibility-theme__choice-content {
    border-color: #8b5d62;
    background: #3b3032;
    color: #d4b483;
}

html[data-theme="dark"] .accessibility-font-controls button:hover,
html[data-theme="dark"] .accessibility-font-controls button:focus-visible,
html[data-theme="dark"] .accessibility-option:hover,
html[data-theme="dark"] .accessibility-option:focus-visible,
html[data-theme="dark"] .accessibility-option[aria-pressed="true"] {
    border-color: #8b5d62;
    background: #3b3032;
    color: #d4b483;
}

html[data-theme="dark"] .accessibility-reset:hover,
html[data-theme="dark"] .accessibility-reset:focus-visible,
html[data-theme="dark"] .accessibility-panel__close:hover,
html[data-theme="dark"] .accessibility-panel__close:focus-visible {
    background: #342d2e;
    color: #d4b483;
}

html[data-theme="dark"] .accessibility-option--master small {
    color: #c9bfc0;
}

html[data-theme="dark"] .accessibility-option--master[aria-pressed="true"] small {
    color: inherit;
}

/* ---------- Mobile: mehr Lesefläche und ruhigere Typografie ---------- */

@media (max-width: 700px) {
    body {
        font-size: 1.0625rem;
        line-height: 1.68;
    }

    .site-layout {
        width: 100%;
        margin: 1rem auto 1.5rem;
        padding-inline: 2.5%;
    }

    .site-main {
        width: 100%;
        padding: .45rem 0 .5rem;
        margin-bottom: 3rem;
    }

    .site-aside {
        width: 100%;
        padding-inline: 0;
    }

    .site-main h1 {
        max-width: 100%;
        font-size: clamp(1.8rem, 7.2vw, 2.05rem);
        line-height: 1.22;
        overflow-wrap: break-word;
        hyphens: auto;
    }

    .home-panorama,
    .home-sections,
    .home-intro,
    .home-appointment,
    .privacy-page,
    .imprint-page,
    .documents-page,
    .reviews-page,
    .review-submit-page,
    .vita-page,
    .legal-page,
    .contact-page,
    .appointment-page,
    .inkasso-page,
    .search-page {
        max-width: 100%;
    }

    /* Startseite: lange Versalüberschriften bleiben innerhalb des Displays. */
    .home-intro h1 {
        font-size: clamp(1.45rem, 6.1vw, 1.7rem);
        line-height: 1.2;
        letter-spacing: .035em;
        overflow-wrap: break-word;
        hyphens: auto;
    }

    .home-intro h2,
    .home-appointment__header h2 {
        max-width: 100%;
        font-size: clamp(1.15rem, 5.7vw, 1.45rem);
        line-height: 1.35;
        letter-spacing: .035em;
        overflow-wrap: break-word;
    }

    .home-appointment__form-card {
        padding: .9rem .75rem;
    }

    .home-appointment__form-heading {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: .65rem;
    }

    /* Rechtsgebiete: keine zweite große Innenkante auf kleinen Displays. */
    .legal-page > h1 {
        margin-inline: .35rem;
    }

    .legal-area {
        padding: 1.35rem .55rem;
    }

    .legal-area h2 {
        gap: .55rem;
        font-size: 1.12rem;
    }

    /* Vita: Jahres-/Zeitraumangabe steht über dem dazugehörigen Text. */
    .vita-page > h1 {
        margin-bottom: 1.8rem;
    }

    .vita-intro {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .vita-intro__title {
        padding-top: .4rem;
        padding-bottom: .8rem;
    }

    .vita-intro__image img {
        width: min(210px, 58vw);
    }

    .vita-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .45rem;
        padding: 1.55rem .25rem;
        border-bottom: 1px solid #e3e0e0;
    }

    .vita-row:last-child {
        border-bottom: 0;
    }

    .vita-year {
        color: var(--bordeaux);
        font-size: .9rem;
        font-weight: 600;
        line-height: 1.45;
    }

    .vita-content {
        min-width: 0;
    }

    .vita-content p {
        overflow-wrap: break-word;
        hyphens: auto;
    }

    /* Dokumente: Aktionssymbole bekommen auf Mobilgeräten eine eigene Zeile. */
    .document-entry {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        padding: 1rem .4rem 1rem .55rem;
    }

    .document-entry h2,
    .document-entry__description {
        overflow-wrap: break-word;
        hyphens: auto;
    }

    .document-actions {
        justify-self: end;
        gap: .1rem;
    }

    /* Bewertungsblöcke nutzen die zusätzliche Breite statt großer Außenränder. */
    .review-card__head {
        margin-inline: .2rem;
    }

    .review-card__body {
        padding: 1rem .75rem 1.15rem;
    }

    /* Auf Mobilgeräten bleibt nur ein permanenter Werkzeugknopf sichtbar.
       Der Dunkelmodus sitzt im aufklappbaren Darstellungsmenü. */
    .theme-toggle {
        display: none;
    }

    .js .accessibility-tools {
        right: max(1rem, env(safe-area-inset-right, 0px));
        bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
    }

    .accessibility-toggle {
        width: 44px;
        height: 44px;
    }

    .accessibility-option--theme {
        display: flex;
    }

    .accessibility-panel {
        position: fixed;
        right: max(1rem, env(safe-area-inset-right, 0px));
        bottom: calc(7.8rem + env(safe-area-inset-bottom, 0px));
        width: min(22rem, calc(100vw - 2rem));
        max-height: min(32.5rem, calc(100dvh - 10rem));
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .back-to-top {
        right: calc(max(1rem, env(safe-area-inset-right, 0px)) + 3.5rem);
        bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 420px) {
    .accessibility-control--buttons {
        grid-template-columns: 1fr;
    }

    .site-main h1 {
        font-size: 1.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .accessibility-toggle,
    .accessibility-panel,
    .accessibility-panel * {
        scroll-behavior: auto;
        transition: none !important;
    }
}


/* Tablet: Desktop-Untermenüs innerhalb des Viewports halten. */
@media (min-width: 701px) and (max-width: 1100px) {
    #nav-submenu-3,
    #nav-submenu-5 {
        left: auto;
        right: 0;
    }
}

/* =========================================================
   Darkmode – verbleibende Bordeaux-Akzente auf dunklem Grund
   =========================================================
   Bewusst nur für den Dunkelmodus:
   - dunkles #800000 bleibt im normalen Hellmodus unverändert
   - Aktionsflächen werden auf dunklem Grund etwas heller
   - Text-/Icon-Akzente verwenden weiterhin die gut lesbare helle Roséfarbe
   ========================================================= */

/* Primäre Aktionsflächen: #A63A3A mit Weiß bleibt gut lesbar. */
html[data-theme="dark"] .aside-button,
html[data-theme="dark"] .home-sections a,
html[data-theme="dark"] .home-appointment__button,
html[data-theme="dark"] .document-download,
html[data-theme="dark"] .document-internal-link,
html[data-theme="dark"] .reviews-submit-button,
html[data-theme="dark"] .form-submit,
html[data-theme="dark"] input[type="submit"],
html[data-theme="dark"] a.button,
html[data-theme="dark"] .reviews-pagination__current,
html[data-theme="dark"] .appointment-time-option input:checked + .appointment-time-option__button,
html[data-theme="dark"] .appointment-time-option--outside input:checked + .appointment-time-option__button,
html[data-theme="dark"] .form-upload input[type="file"]::file-selector-button {
    border-color: #a63a3a;
    background: #a63a3a;
    color: #ffffff;
}

/* Für normale Aktionsbuttons bleibt auch Hover mit weißem Text kontrastreich. */
html[data-theme="dark"] .aside-button:hover,
html[data-theme="dark"] .aside-button:focus-visible,
html[data-theme="dark"] .home-sections a:hover,
html[data-theme="dark"] .home-sections a:focus-visible,
html[data-theme="dark"] .home-appointment__button:hover,
html[data-theme="dark"] .home-appointment__button:focus-visible,
html[data-theme="dark"] .reviews-submit-button:hover,
html[data-theme="dark"] .reviews-submit-button:focus-visible,
html[data-theme="dark"] .form-submit:hover,
html[data-theme="dark"] .form-submit:focus-visible,
html[data-theme="dark"] input[type="submit"]:hover,
html[data-theme="dark"] input[type="submit"]:focus-visible,
html[data-theme="dark"] a.button:hover,
html[data-theme="dark"] a.button:focus-visible {
    border-color: #bd4c4c;
    background: #bd4c4c;
    color: #ffffff;
}

/* Floating-Buttons bleiben rund und invertieren bei Hover/Fokus wie bisher. */
html[data-theme="dark"] .accessibility-toggle,
html[data-theme="dark"] .back-to-top {
    background: #a63a3a;
    color: #ffffff;
}

/* Kleine Flächen-/Statusakzente, die zuvor im Darkmode noch dunkelrot wirkten. */
html[data-theme="dark"] .site-nav a::after,
html[data-theme="dark"] .external-document h3::before,
html[data-theme="dark"] .review-stats__bar > span,
html[data-theme="dark"] .reading-progress-fill {
    background: #a63a3a;
}

/* Kleine Text-/Icon-Akzente brauchen auf dunklem Grund mehr Helligkeit. */
html[data-theme="dark"] .vita-tooltip,
html[data-theme="dark"] .documents-intro > i {
    color: #d4b483;
}

/* Markierungspunkte im Terminkalender dürfen nicht im dunklen Bordeaux verschwinden. */
html[data-theme="dark"] .appointment-calendar__day.is-today:not(.is-selected)::after,
html[data-theme="dark"] .appointment-calendar__day.is-selected::after {
    background: #d4b483;
}

/* =========================================================
   Darkmode – letzte Bordeaux-Reste für Text, Icons und Fokus
   =========================================================
   #A63A3A = gefüllte Aktionsflächen mit weißer Schrift
   #D4B483 = Text-, Icon-, Fokus- und Linienakzente auf dunklem Grund
   ========================================================= */

/* Elemente, die im Hellmodus bewusst var(--bordeaux) verwenden,
   brauchen im Dunkelmodus einen helleren Akzent. */
html[data-theme="dark"] .site-search button,
html[data-theme="dark"] .gmaps-link i,
html[data-theme="dark"] .aside-contact i,
html[data-theme="dark"] .appointment-copy-note i,
html[data-theme="dark"] .appointment-binding-note i,
html[data-theme="dark"] .form-upload__content > label,
html[data-theme="dark"] .office-notice-dialog__content h2,
html[data-theme="dark"] .legal-abbreviation-group summary::after,
html[data-theme="dark"] .document-action--download {
    color: #d4b483;
}

/* Aktiver/angesteuerter Eintrag im Desktop-Untermenü:
   die schmale Linie muss auf dunklem Grund ebenfalls gut erkennbar sein. */
@media (min-width: 701px) {
    html[data-theme="dark"] .site-nav .site-nav__submenu a:hover,
    html[data-theme="dark"] .site-nav .site-nav__submenu a:focus-visible,
    html[data-theme="dark"] .site-nav .site-nav__submenu a[aria-current="page"] {
        border-left-color: #d4b483;
    }
}

/* Dokumentzeilen: linke Hervorhebung nicht im dunklen Bordeaux verschwinden lassen. */
html[data-theme="dark"] .document-entry:hover,
html[data-theme="dark"] .document-entry:focus-within {
    box-shadow: inset 4px 0 0 #d4b483;
}

/* Vorhandene Fokusrahmen, die über var(--bordeaux) definiert sind,
   erhalten im Dunkelmodus ebenfalls den hellen Akzent. */
html[data-theme="dark"] :focus-visible {
    outline-color: #d4b483;
}

/* Primäre Fehlerseiten-Schaltfläche an die übrigen Darkmode-Buttons angleichen. */
html[data-theme="dark"] .error-page__button--primary {
    border-color: #a63a3a;
    background: #a63a3a;
    color: #ffffff;
}

html[data-theme="dark"] .error-page__button--primary:hover,
html[data-theme="dark"] .error-page__button--primary:focus-visible {
    border-color: #bd4c4c;
    background: #bd4c4c;
    color: #ffffff;
}
/* =========================================================
   Suchtreffer – Markierung auf der Zielseite
   ========================================================= */
.search-highlight {
    padding: 0 .08em;
    border-radius: 2px;
    background: #fff7cc;
    color: inherit;
}

.search-highlight:focus-visible {
    outline: 2px solid var(--bordeaux);
    outline-offset: 2px;
}

html[data-theme="dark"] .search-highlight {
    background: #7a5c00;
    color: #ffffff;
}

html[data-theme="dark"] .search-highlight:focus-visible {
    outline-color: #d4b483;
}


/* Bürozeiten – aktuellen Tag dezent hervorheben */
.office-hours tr.is-today th,
.office-hours tr.is-today td {
    background: #fcfafa;
}

.office-hours tr.is-today th {
    padding-left: .7rem;
    box-shadow: inset 4px 0 0 var(--bordeaux);
    font-weight: 600;
}

/* Im Darkmode: warme Kupfermarkierung statt Rosa. */
html[data-theme="dark"] .office-hours tr.is-today th,
html[data-theme="dark"] .office-hours tr.is-today td {
    background: #393232;
}

html[data-theme="dark"] .office-hours tr.is-today th {
    box-shadow: inset 4px 0 0 #d4b483;
}