
.s-seite { background: var(--bg); }
.s-seite .fuss { padding-bottom: calc(56px + var(--sicher-unten)); }

.s-wrap { max-width: calc(760px + 2 * var(--rand)); }
.s-inhalt { padding-bottom: clamp(56px, 10vw, 112px); }

.s-kopf { position: relative; isolation: isolate; padding: calc(var(--kopf) + clamp(18px, 5vw, 56px)) 0 clamp(28px, 5vw, 48px); }
.s-kopf::before {
  content: ""; position: absolute; inset: 0 0 -40px 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(55% 70% at 100% 0%, rgba(255, 102, 0, .10), transparent 70%),
    radial-gradient(45% 60% at 0% 0%, rgba(41, 182, 246, .08), transparent 70%);
}
.s-kopf .titel { margin-top: 2px; hyphens: manual; overflow-wrap: break-word; }
.s-kopf .lead { margin-top: 14px; max-width: 40ch; text-wrap: balance; }

.s-pfad ol { list-style: none; display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 6px -2px; font-size: 14px; color: var(--muted); }
.s-pfad li { display: inline-flex; align-items: center; }
.s-pfad li + li::before { content: ""; width: 6px; height: 6px; margin: 0 10px 0 8px; border-right: 1.5px solid currentColor; border-top: 1.5px solid currentColor; transform: rotate(45deg); opacity: .55; }
.s-pfad a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px; color: var(--ink-2); }
.s-pfad a:hover { color: var(--ink); }
.s-pfad [aria-current="page"] { color: var(--muted); }

.s-skala { margin-top: clamp(22px, 4vw, 32px); width: min(240px, 60%); height: 4px; border-radius: 4px; overflow: hidden;
  background: linear-gradient(90deg, var(--nass-2), var(--nass-3) 28%, var(--neutral) 50%, var(--warm) 74%, var(--orange)); }

.s-stand { margin-top: 18px; font-size: 13px; line-height: 1.7; color: var(--muted); }
.s-stand .s-offen { display: inline-block; }  

.s-karten { display: grid; gap: 14px; grid-template-columns: 1fr; margin-top: 4px; }
@media (min-width: 640px) { .s-karten { grid-template-columns: 1fr 1fr; } }
.s-karte { padding: 22px 22px 20px; box-shadow: var(--schatten-1), inset 0 0 0 1px var(--line); }
.s-karte-titel { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.s-karte p { font-size: 16px; line-height: 1.5; color: var(--ink-2); }
.s-karte p + p { margin-top: 8px; }
.s-knoepfe { display: flex; flex-wrap: wrap; gap: 10px; }
.s-knoepfe .knopf { font-size: 16px; padding: 0 20px; }
.s-karte p.s-zeiten { margin-top: 14px; font-size: 15px; color: var(--muted); }  
.s-gross { font-size: 19px !important; font-weight: 600; letter-spacing: -.015em; color: var(--ink) !important; }
.s-karte a:not(.knopf), .s-text a:not(.knopf) { color: var(--orange-text); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: rgba(184, 70, 0, .35); }
.s-karte a:not(.knopf):hover, .s-text a:not(.knopf):hover { text-decoration-color: currentColor; }
.s-liste { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; font-size: 16px; line-height: 1.5; }
.s-liste dt { color: var(--muted); }
.s-liste dd { color: var(--ink-2); overflow-wrap: anywhere; }
.s-liste .mono { font-size: 15px; }
.s-klein { font-size: 14px !important; color: var(--muted) !important; }

.s-text { margin-top: clamp(24px, 5vw, 40px); }
.s-text > section + section { margin-top: clamp(36px, 6vw, 52px); padding-top: clamp(24px, 4vw, 32px); border-top: 1px solid var(--line); }
.s-text h2 { font-size: clamp(22px, 4.6vw, 28px); line-height: 1.18; letter-spacing: -.022em; font-weight: 700; color: var(--ink); margin-bottom: 14px; scroll-margin-top: calc(var(--kopf) + 16px); }
.s-text h3 { font-size: 18px; line-height: 1.3; letter-spacing: -.012em; font-weight: 600; color: var(--ink); margin: 26px 0 8px; }
.s-text p, .s-text li { font-size: 17px; line-height: 1.6; color: var(--ink-2); hyphens: auto; -webkit-hyphens: auto; }
.s-text p, .s-text li, .s-tabelle td { hyphenate-limit-chars: 12 5 4; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 4; }
.s-wort, .s-offen, .s-pruefen, .s-text code, .s-text a { hyphens: manual; -webkit-hyphens: manual; }
.s-wort { white-space: nowrap; }
.s-text p { max-width: 36rem; }
.s-text p + p, .s-text ul + p, .s-text p + ul, .s-text .karte + p, .s-text p + .karte, .s-text .s-tabelle-rahmen + p { margin-top: 12px; }
.s-text ul { list-style: none; max-width: 36rem; }
.s-text ul li { position: relative; padding-left: 22px; }
.s-text ul li + li { margin-top: 6px; }
.s-text ul li::before { content: ""; position: absolute; left: 4px; top: .68em; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.s-text b { color: var(--ink); font-weight: 600; }
.s-text code { font-family: var(--mono); font-size: .86em; padding: 1px 4px; border-radius: 5px; background: var(--bg-2); color: var(--ink); overflow-wrap: anywhere; }
.s-nr { display: block; font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--orange-text); margin-bottom: 6px; }
.s-karte--adresse { margin-top: 12px; }

.s-nachweis { display: grid; grid-template-columns: 1fr; gap: 2px 24px; }
.s-nachweis dt { font-size: 14px; font-weight: 600; color: var(--ink); margin-top: 14px; }
.s-nachweis dt:first-child { margin-top: 0; }
.s-nachweis dd { font-size: 17px; line-height: 1.55; color: var(--ink-2); }
@media (min-width: 640px) {
  .s-nachweis { grid-template-columns: 200px 1fr; row-gap: 14px; }
  .s-nachweis dt { margin-top: 3px; }
}

.s-kurz { margin: 0 0 clamp(20px, 4vw, 28px); padding: 22px 22px 20px; border-top: 0; border-radius: var(--r-gross);
  background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .74));
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  box-shadow: inset 0 0 0 1px var(--line), inset 0 1px 0 rgba(255, 255, 255, .9), 0 18px 50px rgba(0, 0, 0, .06); }
.s-kurz h2 { font-size: 19px; letter-spacing: -.015em; margin-bottom: 12px; }
.s-kurz li { font-size: 16px; }
@media (min-width: 768px) { .s-kurz { padding: 28px 30px 26px; } }

.s-tabelle-rahmen { margin-top: 8px; border-radius: var(--r); background: var(--card); box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; }
.s-tabelle { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.s-tabelle thead th { text-align: left; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: 12px 14px 10px; border-bottom: 1px solid var(--line-2); }
.s-tabelle tbody th { text-align: left; vertical-align: top; width: 34%; font-weight: 600; color: var(--ink); padding: 12px 10px 12px 14px; }
.s-tabelle td { vertical-align: top; color: var(--ink-2); padding: 12px 14px 12px 4px; hyphens: auto; -webkit-hyphens: auto; }
.s-tabelle tbody tr + tr > * { border-top: 1px solid var(--line); }

.s-offen, .s-pruefen { border-radius: 6px; padding: 1px 6px; font-family: var(--sans); font-weight: 600; font-size: .9em; letter-spacing: 0;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.s-offen { background: #fff0c2; color: #6b4e00; }
.s-pruefen { background: #e8f0fe; color: var(--navy); }

.s-verzeichnis { margin-bottom: clamp(28px, 5vw, 40px); }
.s-verzeichnis > .s-karte-titel, .s-verzeichnis > .s-verzeichnis-liste { display: none; }
.s-klappe { border-radius: var(--r-gross); background: var(--bg-2); }
.s-klappe summary { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 18px; cursor: pointer; list-style: none; border-radius: inherit; }
.s-klappe summary::-webkit-details-marker { display: none; }
.s-klappe summary .s-karte-titel { margin: 0; color: var(--ink-2); }
.s-klappe-zahl { font-size: 14px; color: var(--muted); }
.s-klappe summary::after { content: ""; margin-left: auto; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: translateY(-2px) rotate(45deg); transition: transform .2s var(--sanft); }
.s-klappe[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.s-klappe-liste { padding: 0 8px 10px 18px; }
.s-verzeichnis ol { list-style: none; display: grid; grid-template-columns: 1fr; }
@media (min-width: 560px) and (max-width: 1099.98px) { .s-verzeichnis ol { grid-template-columns: 1fr 1fr; column-gap: 16px; } }
.s-verzeichnis a { display: flex; align-items: center; gap: 12px; min-height: 44px; font-size: 15px; line-height: 1.3; color: var(--ink-2); }
.s-verzeichnis a:hover { color: var(--ink); }
.s-verzeichnis .mono { font-size: 12px; color: var(--orange-text); min-width: 18px; }
@media (min-width: 1100px) {
  .s-wrap--ds { max-width: calc(1080px + 2 * var(--rand)); }
  .s-raster { display: grid; grid-template-columns: 236px minmax(0, 760px); grid-template-areas: "kurz kurz" "verzeichnis text"; column-gap: 48px; align-items: start; }
  .s-kurz { margin-bottom: 48px; padding-bottom: 18px; }
  .s-kurz ul { columns: 2; column-gap: 44px; max-width: none; }
  .s-kurz ul li { break-inside: avoid; padding-bottom: 8px; hyphens: manual; -webkit-hyphens: manual; text-wrap: pretty; }
  .s-kurz ul li + li { margin-top: 0; }
  .s-klappe { display: none; }
  .s-verzeichnis > .s-karte-titel { display: block; }
  .s-verzeichnis > .s-verzeichnis-liste { display: grid; }
  .s-raster > .s-kurz { grid-area: kurz; }
  .s-raster > .s-verzeichnis { grid-area: verzeichnis; }
  .s-raster > .s-text:not(.s-kurz) { grid-area: text; }
  .s-verzeichnis { position: sticky; top: calc(var(--kopf) + 24px); margin: 0; padding: 0; background: none; border-radius: 0; }
  .s-verzeichnis .s-karte-titel { margin-bottom: 6px; }
  .s-verzeichnis a { min-height: 36px; font-size: 14px; }
  .s-raster .s-text { margin-top: 0; }
}
@media (min-width: 1100px) { .s-raster + .s-zurueck { margin-left: 284px; } }

.s-zurueck { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; margin-top: clamp(48px, 8vw, 72px); padding-top: 20px; border-top: 1px solid var(--line); }
.s-zurueck .pfeil-link { min-height: 44px; }
.s-oben { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--muted); }
.s-oben:hover { color: var(--ink); }

@media print {
  @page { margin: 16mm 16mm 18mm; }
  .s-seite { background: #fff !important; }
  .s-inhalt { padding-bottom: 0; }
  .s-karte { padding: 4mm 5mm; }
  .s-karte-titel { margin-bottom: 2mm; }
  .s-karte p, .s-liste { font-size: 10.5pt; }
  .s-gross { font-size: 12pt !important; }
  .s-kurz { padding: 4mm 5mm !important; }
  .s-kurz li { font-size: 10pt; }
  .s-seite .fuss, .s-pfad, .s-zurueck, .s-verzeichnis, .s-kopf::before { display: none !important; }
  .s-kopf { padding: 2mm 0 4mm; }
  .s-skala { margin-top: 4mm; }
  .s-kopf .titel { font-size: 28pt; }
  .s-kopf .lead { font-size: 13pt; max-width: none; }
  .s-wrap, .s-wrap--ds { max-width: none; padding-inline: 0; }
  .s-raster { display: block !important; }
  .s-karten { grid-template-columns: 1fr 1fr; gap: 4mm; }
  .s-karte, .s-kurz, .s-tabelle-rahmen { box-shadow: none !important; border: 1px solid var(--line-2); backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: #fff !important; }
  .s-text p, .s-text li, .s-nachweis dd { font-size: 10pt; line-height: 1.45; max-width: none; }
  .s-text h2 { font-size: 14pt; }
  .s-text h3 { font-size: 11.5pt; }
  .s-text > section + section { margin-top: 5mm; padding-top: 4mm; }
  .s-text h2 { margin-bottom: 2mm; }
  .s-text { margin-top: 6mm; }
  .s-nachweis { row-gap: 2mm; }
  .s-text a, .s-karte a { color: inherit; text-decoration: none; }
  .s-text ul { list-style: disc outside; padding-left: 1.1em; }
  .s-text ul li { padding-left: .2em; }
  .s-text ul li::before { content: none; }
  .s-text ul li::marker { color: var(--orange-text); }
  .s-knoepfe { display: block; }
  .s-knoepfe .knopf { display: block; min-height: 0; padding: 0; background: none !important; color: var(--ink) !important; font-size: 10.5pt; font-weight: 400; text-align: left; justify-content: start; }
  .s-karte p.s-zeiten { font-size: 9.75pt; margin-top: 2mm; }
  .s-offen, .s-pruefen, .s-skala { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .s-karte, .s-tabelle tr, .s-kurz li, .s-text h2, .s-text h3 { break-inside: avoid; }
  .s-text h2, .s-text h3 { break-after: avoid; }
}
