/* Ordination Dr. Lehner (Demo): ruhige Hausarzt-Ordination in Baden.
   Weiß + tiefes Petrol + sanftes Mint, Source Serif 4 für Überschriften,
   Source Sans 3 für Text. Große Grundschrift (18 px, per Knopf 21 px),
   große Schaltflächen, hoher Kontrast. Motiv: weiche, runde Flächen und
   schlichte Linien-Icons. */

@font-face { font-family: "Source Serif 4"; font-weight: 600; font-display: swap; src: url("/demo/fonts/source-serif-4-600.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 400; font-display: swap; src: url("/demo/fonts/source-sans-3-400.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-display: swap; src: url("/demo/fonts/source-sans-3-600.woff2") format("woff2"); }

:root {
  --bg: #fff; --surface: #eef7f4; --ink: #0d2426; --muted: #38504f; --line: #7a9590;
  --accent: #0f5257; --on-accent: #fff; --accent-soft: #dcefe9;
  --head: "Source Serif 4", Georgia, serif; --body: "Source Sans 3", system-ui, sans-serif;
  --r: 16px; --maxw: 72rem;
  --petrol: #0f5257; --petrol-dark: #0a3a3e; --mint: #eaf5f1; --mint-2: #d5ebe4; --hair: #d3e5df;
  --sos: #8f1d16; --sos-bg: #fdf1ef; --sun: #7a4d00; --sun-bg: #fdf6e3;
}
html { font-size: 112.5%; }
html.o-big { font-size: 131.25%; }
body { font-size: 1rem; line-height: 1.6; background: var(--bg); color: var(--ink); }
h1, h2, h3 { font-weight: 600; letter-spacing: -.01em; }
strong, b { font-weight: 600; }
a { color: var(--petrol); text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--petrol); outline-offset: 3px; border-radius: 4px; }
.ic { width: 1.25em; height: 1.25em; flex: none; }

.o-wrap { max-width: var(--maxw); margin-inline: auto; padding-inline: 1rem; }
@media (min-width: 40em) { .o-wrap { padding-inline: 2rem; } }
.o-section { padding-block: clamp(3rem, 8vw, 5.5rem); }
.o-section--mint { background: var(--mint); }
.o-section--petrol { background: var(--petrol); color: #fff; }
.o-section--petrol :focus-visible { outline-color: #fff; }
.o-kicker { font-size: .85rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--petrol); margin-bottom: .75rem; }
.o-h2 { font-size: clamp(1.7rem, 4vw, 2.4rem); line-height: 1.15; margin-bottom: .75rem; }
.o-h3 { font-family: var(--head); font-size: 1.3rem; line-height: 1.25; margin-bottom: .4rem; }
.o-lead { font-size: 1.12rem; margin-bottom: 1.25rem; }
.o-small { font-size: .92rem; color: var(--muted); margin-top: .75rem; }
.o-head { max-width: 40rem; margin-bottom: 2rem; }
.o-head p { color: var(--muted); }
.o-head--row { max-width: none; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; }
.o-more { margin-top: 2rem; }
.o-gap { margin-top: 3rem; }
.o-link { display: inline-flex; align-items: center; gap: .4em; min-height: 2.75rem; font-weight: 600; color: var(--petrol); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3em; }
.o-link .ic { width: 1.1em; height: 1.1em; }

/* Buttons und Felder: groß und eindeutig */
.btn { min-height: 3.1rem; padding: .7em 1.35em; border-radius: 14px; font-weight: 600; font-size: 1rem; }
.btn:hover { background: var(--petrol-dark); border-color: var(--petrol-dark); }
.btn--lg { min-height: 3.5rem; font-size: 1.08rem; }
.btn--ghost { background: #fff; color: var(--petrol); border-color: var(--petrol); }
.btn--ghost:hover { background: var(--mint); color: var(--petrol-dark); }
.btn--light { background: #fff; color: var(--petrol); border-color: #fff; }
.btn--light:hover { background: var(--mint); color: var(--petrol-dark); border-color: var(--mint); }
.btn .ic { width: 1.3em; height: 1.3em; }
.fld { font-size: 1rem; gap: .35rem; }
.fld input, .fld select, .fld textarea { min-height: 3.1rem; padding: .7rem .9rem; border-width: 2px; border-radius: 12px; }
.fld input:focus, .fld select:focus, .fld textarea:focus { box-shadow: 0 0 0 4px var(--mint-2); }
.chk { font-size: 1rem; }
.chk input { width: 1.45rem; height: 1.45rem; margin-top: .1rem; }
.chip { min-height: 2.9rem; padding: .5rem 1.2rem; border-width: 2px; font-size: 1rem; font-weight: 600; }
.chip[aria-pressed="true"] { background: var(--petrol); border-color: var(--petrol); color: #fff; }
.search input { min-height: 3.2rem; border-width: 2px; font-size: 1rem; }
.form-done { background: var(--mint); border-radius: 20px; }
.demo-note { font-size: .92rem; }

/* Leiste oben: Status, Notruf, Schrift größer */
.o-util { background: var(--petrol-dark); color: #fff; }
.o-util__in { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; max-width: var(--maxw); margin-inline: auto; padding: .55rem 1rem; }
@media (min-width: 40em) { .o-util__in { padding-inline: 2rem; } }
.o-util__status { font-size: .95rem; }
.o-util__status::before { border: 2px solid #fff; width: .8em; height: .8em; }
.o-util__sos { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .5rem; font-size: .95rem; order: 3; width: 100%; }
.o-util__sos strong { font-size: 1.05rem; }
.o-util__sos .ic { color: #ffd2cc; }
.o-fs { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.75rem; margin-left: auto; padding: .35rem .9rem; border: 2px solid #fff; border-radius: 99px; background: transparent; color: #fff; font-weight: 600; font-size: .95rem; }
.o-fs:hover { background: rgb(255 255 255 / .12); }
.o-fs[aria-pressed="true"] { background: #fff; color: var(--petrol-dark); }
.o-util :focus-visible { outline-color: #fff; }
@media (min-width: 60em) {
  .o-util__sos { order: 0; width: auto; margin-left: auto; }
  .o-fs { margin-left: 0; }
}
.my-booking { background: var(--mint-2); font-size: 1rem; }
.my-booking a { font-weight: 600; }

/* Kopf */
.sh { background: #fff; border-bottom: 1px solid var(--hair); }
.sh__in { padding-block: .8rem; }
.o-logo { display: flex; align-items: center; gap: .7rem; color: var(--petrol); }
.o-logo__mark { width: 2.6rem; height: 2.6rem; }
.o-logo__txt { display: grid; line-height: 1.1; }
.o-logo__name { font-family: var(--head); font-weight: 600; font-size: 1.45rem; color: var(--ink); }
.o-logo__sub { font-size: .82rem; color: var(--muted); letter-spacing: .02em; }
.sh__toggle { width: 3rem; height: 3rem; border: 2px solid var(--hair); border-radius: 12px; color: var(--ink); }
.sh__nav li a { font-weight: 600; font-size: 1.05rem; color: var(--ink); border-color: var(--hair); }
.sh__nav a[aria-current="page"] { color: var(--petrol); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: .35em; }
.sh__cta { min-height: 3rem; }
/* Navigation erst ab 75em nebeneinander (große Schrift braucht Platz) */
@media (min-width: 60em) and (max-width: 74.99em) {
  .sh__in { flex-wrap: wrap; }
  .sh__toggle { display: grid; }
  .sh__nav { display: none; width: 100%; padding-block: .5rem 1rem; }
  .sh__nav.is-open { display: grid; gap: 1rem; }
  .sh__nav ul { display: grid; gap: 0; }
  .sh__nav li a { padding: .7rem 0; border-bottom: 1px solid var(--hair); }
}
@media (min-width: 75em) { .sh__nav ul { gap: 1.75rem; } }

/* Fotos: weiche, runde Rahmen */
.o-photo { overflow: hidden; border-radius: 28px; background: var(--mint); }
.o-photo img, .o-photo .ph { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.o-photo--soft { box-shadow: 0 0 0 10px var(--mint); }

/* Urlaub & Vertretung */
.o-wrap--top { padding-top: 1.25rem; }
.o-away { display: flex; gap: 1rem; align-items: flex-start; padding: 1.1rem 1.25rem; border-radius: 20px; background: var(--sun-bg); border: 2px solid #ecd9a6; }
.o-away__ic { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: #fff; color: var(--sun); flex: none; }
.o-away__ic .ic { width: 1.7rem; height: 1.7rem; }
.o-away__h { font-size: 1.2rem; margin-bottom: .25rem; }
.o-away__sub { margin-top: .4rem; color: var(--muted); }
.o-away__sub span { font-weight: 600; color: var(--ink); }

/* Hero */
.o-hero { display: grid; gap: 2.5rem; max-width: var(--maxw); margin-inline: auto; padding: 2.25rem 1rem 1rem; }
@media (min-width: 40em) { .o-hero { padding-inline: 2rem; } }
@media (min-width: 60em) { .o-hero { grid-template-columns: 1.05fr 1fr; align-items: center; gap: 4rem; padding-top: 3.5rem; } }
.o-hero__h { font-size: clamp(2.2rem, 6vw, 3.5rem); line-height: 1.08; }
.o-hero__lead { margin-top: 1.25rem; font-size: 1.15rem; color: var(--muted); max-width: 34rem; }
.o-hero__act { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.o-hero__media { position: relative; isolation: isolate; padding: 0 0 1.25rem 1.25rem; }
.o-hero__media::before { content: ""; position: absolute; z-index: -1; inset: 2.5rem 1.5rem 0 0; border-radius: 32px; background: var(--mint-2); }
.o-hero__media .o-photo { border-radius: 32px; }

/* Heute: Status + Notruf */
.o-today { display: grid; gap: 1rem; margin-top: 2.5rem; }
@media (min-width: 60em) { .o-today { grid-template-columns: 1.3fr 1fr; } }
.o-panel { position: relative; padding: 1.5rem; border-radius: 22px; background: #fff; border: 2px solid var(--hair); }
.o-panel__ic { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: .75rem; border-radius: 50%; background: var(--mint); color: var(--petrol); }
.o-panel__ic .ic { width: 1.6rem; height: 1.6rem; }
.o-today__h { font-size: 1.35rem; margin-bottom: .6rem; }
.o-status { font-size: 1.2rem; margin-bottom: 1rem; }
.o-status::before { width: .75em; height: .75em; }
.o-hours { font-size: 1rem; max-width: 26rem; }
.o-hours th, .o-hours td { padding: .4rem 0; border-bottom: 1px solid var(--hair); }
.o-hours tr.is-today { color: var(--petrol); }
.hours tr.is-today th::after { content: " · heute"; }
.o-panel--sos { background: var(--sos-bg); border-color: #f0c9c3; }
.o-panel--sos .o-panel__ic { background: #fff; color: var(--sos); }
.o-sos__h { font-size: 1.35rem; margin-bottom: .5rem; }
.o-sos__n { display: grid; grid-template-columns: 5.2rem 1fr; gap: 1rem; align-items: baseline; padding: .6rem 0; border-top: 1px solid #f0c9c3; }
.o-sos__n strong { font-family: var(--head); font-size: 2rem; line-height: 1; color: var(--sos); }
.o-sos__lead { font-size: 1.2rem; color: var(--sos); line-height: 1.4; }

/* Aufgaben-Kacheln */
.o-tasks { list-style: none; padding: 0; display: grid; gap: .9rem; margin-top: 1.25rem; }
@media (min-width: 40em) { .o-tasks { grid-template-columns: 1fr 1fr; } }
.o-task { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; gap: .15rem 1rem; align-items: center; height: 100%; padding: 1.25rem; border: 2px solid var(--hair); border-radius: 22px; background: #fff; text-decoration: none; color: var(--ink); transition: border-color .15s, background .15s; }
.o-task:hover { border-color: var(--petrol); background: var(--mint); }
.o-task__ic { grid-row: 1 / 3; display: grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: 50%; background: var(--mint); color: var(--petrol); }
.o-task:hover .o-task__ic { background: #fff; }
.o-task__ic .ic { width: 1.7rem; height: 1.7rem; }
.o-task__t { font-family: var(--head); font-weight: 600; font-size: 1.25rem; line-height: 1.2; }
.o-task__d { grid-column: 2; font-size: .95rem; color: var(--muted); }
.o-task__go { grid-row: 1 / 3; grid-column: 3; color: var(--petrol); }

/* Leistungen */
.o-leist { list-style: none; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.o-leist--short { gap: .6rem; }
.o-leist--short li { display: flex; align-items: center; gap: .8rem; padding: .7rem 1rem; border-radius: 16px; background: #fff; }
.o-leist--short a { font-weight: 600; font-size: 1.05rem; color: var(--ink); min-height: 2.75rem; display: flex; align-items: center; }
.o-leist__ic { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--mint); color: var(--petrol); flex: none; }
.o-leist--short .o-leist__ic { background: var(--mint-2); }
.o-leist__ic .ic { width: 1.45rem; height: 1.45rem; }
.o-leist__item { display: grid; align-content: start; overflow: hidden; border-radius: 22px; background: #fff; scroll-margin-top: 4rem; }
.o-leist__img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.o-leist__body { display: grid; gap: .5rem; justify-items: start; padding: 1.5rem; }
.o-leist__body p { color: var(--muted); }

/* Zweispaltig */
.o-split { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 60em) { .o-split { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.o-split--hero { align-items: end; }
.o-facts { list-style: none; padding: 0; display: grid; gap: .75rem; margin: 0 0 1.5rem; }
.o-facts li { display: flex; gap: .75rem; align-items: flex-start; }
.o-facts .ic { color: var(--petrol); width: 1.5em; height: 1.5em; }

/* Band: Schrift größer */
.o-fsband { display: grid; gap: 1.25rem; align-items: center; }
@media (min-width: 60em) { .o-fsband { grid-template-columns: auto 1fr auto; gap: 2rem; } }
.o-fsband__ic { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: rgb(255 255 255 / .14); }
.o-fsband__ic .ic { width: 2.4rem; height: 2.4rem; }
.o-fsband p { color: #e3f1ed; max-width: 38rem; }
.o-section--petrol .btn--light[aria-pressed="true"] { background: var(--mint-2); border-color: var(--mint-2); }

/* Karten (Gesundheitsinfos) */
.o-cards { list-style: none; padding: 0; display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.o-card { position: relative; display: grid; grid-template-rows: auto 1fr; overflow: hidden; border-radius: 22px; border: 2px solid var(--hair); background: #fff; transition: border-color .15s; }
.o-card:hover { border-color: var(--petrol); }
.o-card__img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.o-card__body { padding: 1.25rem 1.35rem 1.5rem; }
.o-card__cat { font-size: .85rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--petrol); margin-bottom: .35rem; }
.o-card__h { font-size: 1.25rem; line-height: 1.25; margin-bottom: .5rem; }
.o-card__h a { color: var(--ink); text-decoration: none; }
.o-card__h a::after { content: ""; position: absolute; inset: 0; border-radius: 22px; }
.o-card__h a:focus-visible { outline: none; }
.o-card:has(a:focus-visible) { outline: 3px solid var(--petrol); outline-offset: 3px; }
.o-card__t { color: var(--muted); font-size: .97rem; }

/* Unterseiten-Kopf */
.o-page-hero { padding: clamp(2.25rem, 6vw, 4rem) 0 2.5rem; background: linear-gradient(var(--mint), #fff); }
.o-page-hero--slim { padding-bottom: 1.5rem; }
.o-page-h { font-size: clamp(2rem, 5.5vw, 3.1rem); line-height: 1.1; max-width: 46rem; }
.o-page-hero p:not(.o-kicker) { margin-top: 1rem; max-width: 40rem; font-size: 1.1rem; color: var(--muted); }
.o-jump { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.o-jump a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .4rem 1rem; border: 2px solid var(--petrol); border-radius: 99px; background: #fff; font-weight: 600; text-decoration: none; }
.o-jump a:hover { background: var(--petrol); color: #fff; }

/* Team */
.o-team { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
@media (min-width: 60em) { .o-team { grid-template-columns: 1.6fr 1fr 1fr; align-items: start; } }
.o-team__item { display: grid; gap: 1rem; align-content: start; padding: 1.5rem; border-radius: 22px; background: var(--mint); }
.o-team__item--lead { background: #fff; border: 2px solid var(--hair); }
.o-team__item--lead .o-photo { box-shadow: none; }
.o-team__av { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: var(--petrol); color: #fff; font-family: var(--head); font-size: 1.5rem; }
.o-team__role { font-weight: 600; color: var(--petrol); margin-bottom: .5rem; }
.o-big-ic { display: grid; place-items: center; width: 4rem; height: 4rem; margin-bottom: 1rem; border-radius: 50%; background: #fff; color: var(--petrol); }
.o-big-ic .ic { width: 2.1rem; height: 2.1rem; }

/* Checkliste */
.o-check__list { list-style: none; padding: 0; display: grid; gap: .6rem; margin-top: 1rem; }
.o-check__item { padding: .85rem 1rem; border: 2px solid var(--hair); border-radius: 16px; cursor: pointer; line-height: 1.4; }
.o-check__item span { color: var(--muted); font-size: .95rem; }
.o-check__item strong { color: var(--ink); font-size: 1rem; }
.o-check__item:has(input:checked) { background: var(--mint); border-color: var(--petrol); }
.o-check__done { display: none; margin-top: 1rem; padding: .8rem 1rem; border-radius: 14px; background: var(--petrol); color: #fff; font-weight: 600; }
.is-complete .o-check__done { display: block; }

/* Anfahrt */
.o-way { list-style: none; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.o-way p { color: var(--muted); }

/* Buchung, Rezept, Kontakt: Formular + Seitenspalte */
.o-book { display: grid; gap: 1.5rem; padding-top: 1.5rem; padding-bottom: 1rem; }
@media (min-width: 60em) { .o-book { grid-template-columns: 2fr 1fr; align-items: start; gap: 2.5rem; } .o-book > .o-book__side:first-child { order: 2; } }
.o-book__side { display: grid; gap: 1rem; }
@media (min-width: 60em) { .o-book__side { position: sticky; top: 4rem; } }
.o-booking { display: grid; gap: 1.5rem; }
.o-booking .bk { --bk-bg: #fff; border: 2px solid var(--hair); border-radius: 24px; box-shadow: 0 18px 44px rgb(15 82 87 / .08); }
.bk__progress { font-size: .92rem; }
.bk__progress li span { width: 1.9rem; height: 1.9rem; }
.bk__hint, .bk-opt__desc { font-size: .95rem; }
.bk__cat { font-size: .85rem; color: var(--petrol); }
.bk-opt { padding: 1rem 1.1rem; border-width: 2px; border-color: #a9c4be; }
.bk-opt:hover { border-color: var(--line); }
.bk-opt input { width: 1.4rem; height: 1.4rem; }
.bk-opt__name { font-size: 1.05rem; }
.bk-opt__meta { font-size: .95rem; color: var(--muted); }
.bk-day { min-height: 2.9rem; border-width: 2px; border-color: var(--hair); font-size: 1rem; }
.bk-day:disabled { color: #5c6e6c; }
.bk-slot { min-height: 3rem; border-width: 2px; border-color: var(--hair); font-size: 1rem; }
.bk-slots__grid { grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); }
.bk-cal__nav { width: 3rem; height: 3rem; border-width: 2px; }
.bk__sum { font-size: 1rem; }
.bk-cal__legend { font-size: .88rem; }
.o-ticks { list-style: none; padding: 0; display: grid; gap: .7rem; margin-top: .5rem; }
.o-ticks li { display: flex; gap: .7rem; align-items: flex-start; }
.o-ticks .ic { color: var(--petrol); width: 1.4em; height: 1.4em; }
.o-ticks--lg { margin-bottom: 1rem; font-size: 1.05rem; }

/* Rezeptformular */
.o-form { display: grid; gap: 1.75rem; padding: clamp(1.25rem, 3vw, 2rem); border: 2px solid var(--hair); border-radius: 24px; background: #fff; box-shadow: 0 18px 44px rgb(15 82 87 / .08); }
.o-fs-group { border: 0; padding: 0; min-width: 0; display: grid; gap: 1rem; }
.o-legend { font-family: var(--head); font-weight: 600; font-size: 1.35rem; padding: 0; margin-bottom: .75rem; }
.o-legend--sub { font-size: 1.15rem; margin: .5rem 0 0; }
.o-opts { grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); }
.opt { padding: 1.1rem 1.2rem; border-width: 2px; border-color: #a9c4be; border-radius: 18px; }
.opt__icon { color: var(--petrol); }
.opt__icon .ic { width: 2rem; height: 2rem; }
.opt__name { font-size: 1.1rem; font-weight: 600; }
.opt__desc { font-size: .95rem; }
.o-ready { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.2rem; border-radius: 16px; background: var(--mint); font-weight: 600; }
.o-ready .ic { color: var(--petrol); width: 1.5em; height: 1.5em; margin-top: .05em; }
.o-submit { justify-self: start; }
.o-done__ic { display: grid; place-items: center; width: 4rem; height: 4rem; margin: 0 auto 1rem; border-radius: 50%; background: var(--petrol); color: #fff; }
.o-done__ic .ic { width: 2rem; height: 2rem; }
.o-contact { list-style: none; padding: 0; display: grid; gap: .8rem; margin: .5rem 0 1.5rem; font-size: 1.1rem; }
.o-contact li { display: flex; gap: .75rem; align-items: flex-start; }
.o-contact .ic { color: var(--petrol); width: 1.4em; height: 1.4em; margin-top: .1em; }
.o-contact a { font-weight: 600; }
.o-hours caption { text-align: left; }

/* Gesundheitsinfos: Liste */
.o-blog { padding-top: 2rem; }
.blog-count { font-size: .95rem; margin-bottom: 1rem; }
.o-posts { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.o-post { position: relative; display: grid; overflow: hidden; border-radius: 22px; border: 2px solid var(--hair); background: #fff; transition: border-color .15s; }
.o-post:hover { border-color: var(--petrol); }
.o-post:has(a:focus-visible) { outline: 3px solid var(--petrol); outline-offset: 3px; }
@media (min-width: 48em) { .o-post { grid-template-columns: 17rem 1fr; } }
.o-post__img { width: 100%; height: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.o-post__body { padding: 1.35rem 1.5rem 1.5rem; align-self: center; }
.o-post__body > p:not(.o-card__cat) { color: var(--muted); }
.o-post__h { font-size: clamp(1.25rem, 2.6vw, 1.55rem); line-height: 1.2; margin-bottom: .5rem; }
.o-post__h a { color: var(--ink); text-decoration: none; }
.o-post__h a::after { content: ""; position: absolute; inset: 0; }
.o-post__h a:focus-visible { outline: none; }
.o-empty { padding: 1.5rem; border-radius: 18px; background: var(--mint); }
.o-disclaimer { display: flex; gap: .6rem; align-items: flex-start; margin-top: 2rem; color: var(--muted); font-size: .95rem; }
.o-disclaimer .ic { color: var(--sos); margin-top: .15em; }

/* Gesundheitsinfos: Beitrag */
.o-article__head { padding-top: clamp(2rem, 5vw, 3.5rem); padding-bottom: 1.5rem; max-width: 56rem; }
.o-crumb { font-size: .95rem; color: var(--muted); margin-bottom: 1rem; }
.o-crumb a { font-weight: 600; }
.o-article__meta { display: flex; align-items: center; gap: .5rem; margin-top: 1rem; color: var(--muted); }
.o-article__meta .ic { color: var(--petrol); }
.o-article__img { max-width: 52rem; margin-bottom: 2.5rem; }
.o-article__img img { aspect-ratio: 16 / 9; }
.o-prose { max-width: 40rem; font-size: 1.08rem; line-height: 1.75; }
.prose h2 { font-size: 1.55rem; line-height: 1.2; color: var(--ink); }
.prose li::marker { color: var(--petrol); }
.o-endnote { margin-top: 2rem; padding-top: 1rem; border-top: 2px solid var(--hair); font-style: italic; color: var(--muted); }
.o-article__cta { display: grid; gap: 1.25rem; max-width: 40rem; margin-top: 2.5rem; background: var(--mint); border-color: var(--mint-2); }
.o-cards--two { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }

/* Fuß */
.sf { margin-top: 0; background: var(--petrol-dark); color: #e6f2ef; font-size: 1rem; }
.sf a { color: #fff; }
.sf__name { font-family: var(--head); font-weight: 600; font-size: 1.5rem; color: #fff; }
.sf__tag, .sf__legal { color: #c2dad5; }
.sf__legal { border-color: #275a5e; font-size: .88rem; }
.sf__h { color: #fff; }
.sf .hours { font-size: 1rem; }
.sf .hours tr.is-today { color: #fff; }
.sf .hours tr.is-today td { text-decoration: underline; text-decoration-color: #8fd3c1; text-decoration-thickness: 2px; text-underline-offset: .25em; }
.sf__nav a { display: inline-block; padding-block: .15rem; }
.sf :focus-visible { outline-color: #fff; }
.o-foot__sos { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1.25rem; padding: .8rem 1rem; border-radius: 14px; background: rgb(255 255 255 / .08); }
.o-foot__sos .ic { color: #ffd2cc; margin-top: .15em; }
main { padding-bottom: 4rem; }

/* Rechtsseiten */
.legal__in { font-size: 1rem; }
.legal h2 { font-size: 1.35rem; }
