/* Kfz-Technik Hofer (Demo): freie Werkstatt in St. Pölten.
   Asphalt/Anthrazit + heller Beton + Signalrot, Oswald (Versalien) für
   Überschriften und Zahlen, Rubik für Text. Motiv: Warnstreifen, Telemetrie-
   Leisten, große Zahlen, Checklisten. */

@font-face { font-family: "Oswald"; font-weight: 500; font-display: swap; src: url("/demo/fonts/oswald-500.woff2") format("woff2"); }
@font-face { font-family: "Oswald"; font-weight: 600; font-display: swap; src: url("/demo/fonts/oswald-600.woff2") format("woff2"); }
@font-face { font-family: "Rubik"; font-weight: 400; font-display: swap; src: url("/demo/fonts/rubik-400.woff2") format("woff2"); }
@font-face { font-family: "Rubik"; font-weight: 500; font-display: swap; src: url("/demo/fonts/rubik-500.woff2") format("woff2"); }
@font-face { font-family: "Rubik"; font-weight: 700; font-display: swap; src: url("/demo/fonts/rubik-700.woff2") format("woff2"); }

:root {
  --asphalt: #1b1d20; --anthracite: #2a2d31; --concrete: #e4e2dd; --red: #d7261e; --red-ink: #c41f18; --red-light: #ff6b61;
  --bg: #f2f1ee; --surface: #e8e6e1; --ink: #17191c; --muted: #55595e; --line: #cfccc5;
  --accent: #d7261e; --on-accent: #fff; --accent-soft: #f7dcda;
  --head: "Oswald", "Arial Narrow", sans-serif; --body: "Rubik", system-ui, sans-serif;
  --r: 3px; --maxw: 76rem;
  --stripes: repeating-linear-gradient(-45deg, var(--red) 0 14px, var(--asphalt) 14px 28px);
}
body { font-size: 1.02rem; }
h1, h2, h3, h4 { font-weight: 600; text-transform: uppercase; letter-spacing: .01em; }
::selection { background: var(--red); color: #fff; }

/* Dunkle Flächen: Tokens umdrehen, damit Kit-Bausteine (Wizard, Felder) mitziehen */
.sh, .sf--dark, .k-hero, .k-section--dark, .pk, .k-aside--dark, .k-cta {
  --bg: var(--asphalt); --surface: var(--anthracite); --ink: #f1f0ec; --muted: #a9adb2; --line: #44484d;
  --accent-soft: rgb(215 38 30 / .25);
  color-scheme: dark; background: var(--bg); color: var(--ink);
}
.k-wrap { max-width: var(--maxw); margin-inline: auto; padding-inline: 1rem; }
@media (min-width: 40em) { .k-wrap { padding-inline: 2rem; } }

/* ---------------------------------------------------------- Grundbausteine */
.btn { border-radius: var(--r); font-family: var(--head); font-weight: 500; text-transform: uppercase; letter-spacing: .05em; font-size: 1rem; padding-inline: 1.4em; }
.btn:hover { background: #b81f18; border-color: #b81f18; }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn--ghost:hover { background: transparent; border-color: var(--ink); }
.k-btn-dark { border-color: #6a6e73; }
.btn--light { background: #fff; color: var(--asphalt); border-color: #fff; }
.btn--light:hover { background: var(--concrete); border-color: var(--concrete); }
.k-kicker { display: flex; align-items: center; gap: .6rem; font: 500 .82rem/1.3 var(--head); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: .9rem; }
.k-kicker::before { content: ""; width: 1.6rem; height: .55rem; background: var(--stripes); flex: none; }
.k-kicker--red { color: var(--red-ink); }
.k-section--dark .k-kicker--red, .k-hero .k-kicker, .k-cta .k-kicker { color: var(--red-light); }
.k-h2 { font-size: clamp(1.9rem, 5vw, 3rem); line-height: 1.05; }
.k-h3 { font-size: clamp(1.35rem, 3vw, 1.7rem); line-height: 1.1; }
.k-head { max-width: 40rem; margin-bottom: 2.25rem; }
.k-head > p:not(.k-kicker) { margin-top: .9rem; color: var(--muted); }
.k-head--row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem; max-width: none; }
.k-link { font-weight: 500; text-decoration: underline; text-decoration-color: var(--red); text-decoration-thickness: 2px; text-underline-offset: .3em; }
.k-link:hover { color: var(--red-ink); }
.k-link--light:hover { color: var(--red-light); }
.k-center { text-align: center; margin-top: 2rem; }
.k-section { padding-block: clamp(3.5rem, 8vw, 6rem); }
.k-section--tight { padding-top: 2rem; }
.k-section--concrete { background: var(--concrete); }
.k-section--dark { position: relative; }
.k-section--dark::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: var(--stripes); }
.k-tag { display: inline-block; padding: .1rem .45rem; border-radius: 2px; background: var(--asphalt); color: #fff; font: 500 .72rem/1.4 var(--head); letter-spacing: .08em; text-transform: uppercase; vertical-align: .1em; }
.k-checks { list-style: none; padding: 0; display: grid; gap: .55rem; margin-block: 1.25rem 1.5rem; }
.k-checks li { position: relative; padding-left: 2rem; }
.k-checks li::before { content: "✓"; position: absolute; left: 0; top: .1rem; display: grid; place-items: center; width: 1.3rem; height: 1.3rem; background: var(--red); color: #fff; font-size: .75rem; font-weight: 700; border-radius: 2px; }
.k-price { font: 600 1.9rem/1 var(--head); font-variant-numeric: tabular-nums; }
:focus-visible { outline-color: var(--red); }
.sh :focus-visible, .k-hero :focus-visible, .k-section--dark :focus-visible, .pk :focus-visible, .sf--dark :focus-visible, .k-cta :focus-visible, .k-aside--dark :focus-visible { outline-color: #fff; }

/* ---------------------------------------------------------- Kopf */
.my-booking { background: var(--red); color: #fff; font-weight: 500; }
.my-booking a { color: #fff; font-weight: 700; }
.my-booking .k-tag { background: #fff; color: var(--red-ink); }
.my-booking :focus-visible { outline-color: #fff; }
.sh { position: relative; border-bottom: 6px solid transparent; border-image: var(--stripes) 1; }
.sh__in { padding-block: .7rem; }
.k-logo { display: flex; align-items: center; gap: .65rem; }
.k-logo__mark { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; background: var(--red); color: #fff; font: 600 1.6rem/1 var(--head); transform: skewX(-10deg); }
.k-logo__txt { display: grid; line-height: 1; }
.k-logo__name { font: 600 1.55rem/1 var(--head); text-transform: uppercase; letter-spacing: .06em; }
.k-logo__sub { font: 500 .68rem/1.3 var(--head); text-transform: uppercase; letter-spacing: .16em; color: var(--muted); margin-top: .2rem; }
.sh__nav li a { font-family: var(--head); font-weight: 500; text-transform: uppercase; letter-spacing: .06em; font-size: 1.05rem; }
.sh__nav a[aria-current="page"] { color: var(--red-light); }
.sh__cta { justify-self: start; }
.sh__status { color: var(--muted); font-weight: 500; }
@media (min-width: 60em) {
  .sh__nav li a { font-size: .95rem; }
  .sh__nav a[aria-current="page"] { text-decoration-color: var(--red); }
}

/* ---------------------------------------------------------- Startseite: Hero */
.k-hero { display: grid; overflow: hidden; }
.k-hero__media { position: relative; }
.k-hero__media img, .k-hero__media .ph { width: 100%; height: 100%; aspect-ratio: 16 / 10; object-fit: cover; clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%); }
.k-hero__text { padding: 1.5rem 1rem 3rem; max-width: 40rem; }
.k-hero__h { font-size: clamp(2.3rem, 8vw, 4.4rem); line-height: 1; }
.k-hero__h span { display: block; color: var(--red-light); }
.k-hero__lead { margin-top: 1.25rem; color: #d4d4d0; font-size: 1.08rem; max-width: 34rem; }
.k-hero__act { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.k-hero__act .btn--ghost { color: #fff; }
.k-hero__status { margin-top: 1.5rem; }
@media (min-width: 60em) {
  .k-hero { grid-template-columns: 1fr 1.05fr; min-height: 34rem; }
  .k-hero__media { order: 2; }
  .k-hero__media img, .k-hero__media .ph { position: absolute; inset: 0; aspect-ratio: auto; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
  .k-hero__text { align-self: center; padding: 4rem 1rem 4rem max(2rem, calc((100vw - var(--maxw)) / 2 + 2rem)); max-width: none; }
}

/* Telemetrie-Leiste */
.k-tele { display: grid; grid-template-columns: 1fr 1fr; margin: 0; background: var(--anthracite); color: #f1f0ec; border-top: 4px solid var(--red); }
.k-tele p { display: grid; gap: .1rem; padding: 1.1rem 1rem; border-right: 1px solid #44484d; border-bottom: 1px solid #44484d; }
.k-tele b { font: 600 clamp(1.8rem, 6vw, 2.6rem)/1 var(--head); font-variant-numeric: tabular-nums; }
.k-tele span { font: 500 .78rem/1.3 var(--head); text-transform: uppercase; letter-spacing: .12em; color: #a9adb2; }
@media (min-width: 48em) { .k-tele { grid-template-columns: repeat(4, 1fr); } .k-tele p { border-bottom: 0; padding: 1.4rem 2rem; } .k-tele p:last-child { border-right: 0; } }

/* Zweispaltig */
.k-split { display: grid; gap: 2.5rem; align-items: start; }
.k-split__img { margin-top: 2rem; }
.k-split__img img, .k-split__img .ph { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
@media (min-width: 60em) { .k-split { grid-template-columns: .9fr 1.1fr; gap: 4rem; } }

/* Leistungskarten */
.k-cards { list-style: none; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); }
.k-cards a { position: relative; display: grid; gap: .35rem; height: 100%; padding: 1.4rem 1.25rem 1.25rem; background: var(--anthracite); border-left: 4px solid #44484d; text-decoration: none; transition: border-color .15s, background .15s; }
.k-cards a:hover { border-left-color: var(--red); background: #33363b; }
.k-cards__no { font: 600 2.6rem/1 var(--head); color: transparent; -webkit-text-stroke: 1.5px var(--red-light); }
.k-cards__n { font: 600 1.3rem/1.15 var(--head); text-transform: uppercase; margin-top: .4rem; }
.k-cards__d { font-size: .92rem; color: var(--muted); }
.k-cards__m { display: flex; justify-content: space-between; gap: 1rem; margin-top: .6rem; padding-top: .6rem; border-top: 1px dashed #55595e; font-variant-numeric: tabular-nums; font-weight: 500; }
.k-cards__go { font: 500 .85rem/1 var(--head); text-transform: uppercase; letter-spacing: .1em; color: var(--red-light); margin-top: .4rem; }

/* Ablauf */
.k-flow { display: grid; gap: 1rem; }
.k-steps { list-style: none; padding: 0; display: grid; gap: 0; counter-reset: st; border-top: 2px solid var(--ink); }
.k-steps li { counter-increment: st; display: grid; grid-template-columns: 3.5rem 1fr; gap: .2rem 1rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); }
.k-steps li::before { content: "0" counter(st); grid-row: span 2; font: 600 2.4rem/1 var(--head); color: var(--red-ink); }
.k-steps b { font: 600 1.25rem/1.2 var(--head); text-transform: uppercase; }
.k-steps span { color: var(--muted); }
@media (min-width: 60em) {
  .k-flow { grid-template-columns: .8fr 1.6fr; gap: 4rem; align-items: start; }
  .k-steps { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; }
}

/* Meister */
.k-meister { display: grid; gap: 2.5rem; align-items: center; }
.k-meister__img { position: relative; }
.k-meister__img img, .k-meister__img .ph { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.k-meister__img::after { content: ""; position: absolute; left: 1rem; right: 1rem; bottom: -10px; height: 10px; background: var(--stripes); }
.k-meister p:not(.k-kicker) { margin-top: 1rem; }
@media (min-width: 60em) { .k-meister { grid-template-columns: 1fr 1fr; gap: 4.5rem; } }

/* Beitragskarten */
.k-posts { list-style: none; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.k-post a { display: grid; gap: .55rem; height: 100%; text-decoration: none; }
.k-post img, .k-post .ph { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: .4rem; filter: saturate(.85); transition: filter .2s; }
.k-post a:hover img { filter: none; }
.k-post__meta { font-size: .85rem; color: var(--muted); }
.k-post__t { font: 600 1.3rem/1.15 var(--head); text-transform: uppercase; }
.k-post a:hover .k-post__t { color: var(--red-ink); }
.k-post__x { color: var(--muted); font-size: .95rem; }
.k-posts--two .k-post a { padding: 1.4rem; background: var(--bg); border-top: 4px solid var(--red); }
.k-section--concrete .k-h2 { margin-bottom: 1.5rem; }

/* Abschluss-Band */
.k-cta { --bg: var(--red); position: relative; overflow: hidden; }
.k-cta::after { content: ""; position: absolute; top: 0; bottom: 0; right: -4rem; width: 45%; background: repeating-linear-gradient(-45deg, rgb(0 0 0 / .16) 0 18px, transparent 18px 36px); pointer-events: none; }
.k-cta__in { position: relative; z-index: 1; padding-block: 3.5rem; display: grid; gap: 1rem; justify-items: start; }
.k-cta p { color: #fff; font-size: 1.1rem; }
.k-cta .btn--light { color: var(--red-ink); }

/* ---------------------------------------------------------- Unterseiten */
.k-page-hero { padding-block: clamp(2.5rem, 7vw, 4.5rem) clamp(2rem, 5vw, 3rem); background: var(--concrete); border-bottom: 6px solid transparent; border-image: var(--stripes) 1; }
.k-page-hero p:not(.k-kicker) { max-width: 44rem; margin-top: 1rem; color: var(--muted); font-size: 1.08rem; }
.k-page-h { font-size: clamp(2.2rem, 6.5vw, 4rem); line-height: 1.02; max-width: 22ch; }
.k-page-hero--slim .k-page-h { font-size: clamp(2rem, 5.5vw, 3.2rem); }
.k-page-hero--stripes { background: linear-gradient(90deg, var(--concrete) 70%, transparent), repeating-linear-gradient(-45deg, #d8d5cf 0 14px, var(--concrete) 14px 28px); }
.k-jump { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.5rem; }
.k-jump a { padding: .5rem .8rem; border: 1.5px solid var(--ink); font: 500 .85rem/1.2 var(--head); text-transform: uppercase; letter-spacing: .08em; text-decoration: none; }
.k-jump a:hover { background: var(--ink); color: var(--bg); }

/* Leistungen */
.k-offers { display: grid; gap: clamp(3rem, 8vw, 5.5rem); padding-block: clamp(3rem, 8vw, 5rem); }
.k-offer { display: grid; gap: 1.75rem; align-items: center; scroll-margin-top: 4rem; }
.k-offer__img { position: relative; }
.k-offer__img img, .k-offer__img .ph { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.k-offer__no { position: absolute; left: 0; bottom: 0; padding: .4rem .8rem .2rem; background: var(--asphalt); color: #fff; font: 600 2.4rem/1 var(--head); border-top: 4px solid var(--red); }
.k-offer__text p { margin-top: .8rem; }
.k-offer__foot { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; }
@media (min-width: 60em) {
  .k-offer { grid-template-columns: 1fr 1fr; gap: 4rem; }
  .k-offer--flip .k-offer__img { order: 2; }
  .k-offer--flip .k-offer__no { left: auto; right: 0; }
}

/* Preisrechner (dunkle Fläche) */
.k-calc { display: grid; gap: 1rem; }
.k-wiz { padding: clamp(1rem, 3vw, 2rem); background: var(--anthracite); border-top: 4px solid var(--red); }
.k-wiz .opt { --bg: var(--asphalt); border-radius: var(--r); }
.k-wiz .opt__name { font-family: var(--head); font-weight: 500; text-transform: uppercase; letter-spacing: .03em; font-size: 1.08rem; }
.k-wiz .wiz-step legend { text-transform: uppercase; }
.k-wiz .estimate { background: var(--asphalt); border-left: 4px solid var(--red); }
.k-wiz .estimate__val { font-size: clamp(1.7rem, 5vw, 2.3rem); font-weight: 600; }
.k-wiz .wiz-sum { background: var(--asphalt); }
@media (min-width: 60em) { .k-calc { grid-template-columns: .75fr 1.25fr; gap: 4rem; align-items: start; } }

/* Einlagerung */
.k-store { display: grid; gap: 2.5rem; align-items: center; }
.k-store p:not(.k-kicker) { margin-top: 1rem; }
.k-store__img img, .k-store__img .ph { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (min-width: 60em) { .k-store { grid-template-columns: 1.1fr .9fr; gap: 4rem; } }

/* ---------------------------------------------------------- Pickerl-Rechner */
.pk { position: relative; padding: clamp(1.25rem, 4vw, 2rem); border-top: 6px solid transparent; border-image: var(--stripes) 1; }
.pk__form { display: grid; gap: 1.1rem; }
.pk__set { border: 0; padding: 0; min-width: 0; display: grid; gap: .75rem; }
.pk__legend { font: 600 1.35rem/1.15 var(--head); text-transform: uppercase; margin-bottom: .75rem; padding: 0; }
.pk__legend--sm { font-size: 1.05rem; }
.pk__row { display: grid; grid-template-columns: 1.3fr 1fr; gap: .75rem; }
.pk select { min-height: 3rem; background: var(--anthracite); border-radius: var(--r); }
.pk__hint { font-size: .85rem; color: var(--muted); }
.pk__more { border: 1px dashed var(--line); padding: .8rem 1rem; }
.pk__more summary { cursor: pointer; font-weight: 500; }
.pk__more[open] summary { margin-bottom: 1rem; }
.pk__form .btn { justify-self: start; }
.pk__out { margin-top: 1.75rem; padding-top: 1.5rem; border-top: 1px solid var(--line); display: grid; gap: .5rem; justify-items: start; }
.pk__out:focus { outline: none; }
.pk__badge { display: inline-flex; align-items: center; gap: .5rem; padding: .3rem .75rem; font: 600 .95rem/1.2 var(--head); text-transform: uppercase; letter-spacing: .08em; background: #1e7a3c; color: #fff; }
.pk__badge::before { content: ""; width: .6rem; height: .6rem; border-radius: 50%; background: currentColor; }
.pk__out[data-state="due"] .pk__badge { background: #f2b705; color: #1b1d20; }
.pk__out[data-state="late"] .pk__badge { background: var(--red); animation: k-blink 1.2s steps(2) 3; }
.pk__out[data-state="err"] .pk__badge { background: #55595e; }
@keyframes k-blink { 50% { opacity: .55; } }
.pk__label { margin-top: .5rem; font: 500 .8rem/1.2 var(--head); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.pk__due { font: 600 clamp(2.6rem, 10vw, 4.2rem)/1 var(--head); text-transform: uppercase; font-variant-numeric: tabular-nums; }
.pk__out[data-state="late"] .pk__due { color: var(--red-light); }
.pk__window { color: #d4d4d0; }
.pk__msg { max-width: 38rem; }
.pk__line { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); width: 100%; margin: 1rem 0 1.25rem; border-top: 2px solid var(--line); }
.pk__line li { position: relative; display: grid; gap: .1rem; padding: .9rem .5rem 0 0; }
.pk__line li::before { content: ""; position: absolute; top: -7px; left: 0; width: 12px; height: 12px; background: var(--line); transform: rotate(45deg); }
.pk__line li:first-child::before { background: var(--red); }
.pk__line b { font: 600 1.05rem/1.2 var(--head); text-transform: uppercase; }
.pk__line span { font-size: .78rem; color: var(--muted); }
.pk--compact .pk__out .btn { margin-top: .25rem; }

/* Pickerl-Seite */
.k-pk-page { display: grid; gap: 2.5rem; align-items: start; }
.k-rule { padding: 1.5rem; background: #fff; border-left: 4px solid var(--red); }
.k-rule__list { list-style: none; padding: 0; margin: 1rem 0 1.5rem; display: grid; gap: .6rem; }
.k-rule__list li { display: grid; grid-template-columns: 3.2rem 1fr; align-items: center; gap: .8rem; }
.k-rule__list b { display: grid; place-items: center; height: 3.2rem; background: var(--asphalt); color: #fff; font: 600 2.2rem/1 var(--head); }
.k-rule__h { font-size: 1.1rem; margin-bottom: .6rem; }
.k-window { display: grid; grid-template-columns: repeat(6, 1fr); gap: 3px; margin-bottom: .9rem; }
.k-window span { padding: .45rem 0; text-align: center; background: var(--concrete); font: 500 .85rem/1 var(--head); font-variant-numeric: tabular-nums; }
.k-window .is-due { background: var(--red); color: #fff; text-transform: uppercase; letter-spacing: .04em; }
@media (min-width: 60em) { .k-pk-page { grid-template-columns: 1.4fr 1fr; gap: 3rem; } }

.k-checklist { padding: clamp(1.25rem, 3vw, 2rem); background: var(--anthracite); border-top: 4px solid var(--red); }
.k-checklist__count { font: 600 1.6rem/1 var(--head); text-transform: uppercase; margin-bottom: 1rem; font-variant-numeric: tabular-nums; }
.k-checklist ul { list-style: none; padding: 0; margin-bottom: 1.5rem; }
.k-checklist li + li { border-top: 1px solid var(--line); }
.k-checklist .chk { padding: .8rem 0; cursor: pointer; }
.k-checklist .chk b { display: block; font-weight: 500; }
.k-checklist .chk small { display: block; color: var(--muted); font-size: .85rem; }
.k-checklist .chk:has(input:checked) b { text-decoration: line-through; text-decoration-color: var(--red-light); color: var(--muted); }
.k-checklist__done { display: none; margin-bottom: 1rem; padding: .7rem 1rem; background: #1e7a3c; color: #fff; font-weight: 500; }
.k-checklist.is-complete .k-checklist__done { display: block; }

.k-grid3 { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.k-box { padding: 1.5rem; background: #fff; border-top: 4px solid var(--asphalt); }
.k-box__h { font-size: 1.2rem; margin-bottom: .6rem; }
.k-box p { color: var(--muted); }

/* ---------------------------------------------------------- Termin */
.k-booking { display: grid; gap: 2rem; align-items: start; }
.k-booking .bk { --bk-bg: #fff; border-radius: var(--r); border-top: 4px solid var(--red); }
.bk__legend { text-transform: uppercase; }
.bk-opt, .bk-day, .bk-slot { border-radius: var(--r); }
.bk__progress li span { border-radius: 2px; }
.k-aside { padding: 1.5rem; background: #fff; border-left: 4px solid var(--red); display: grid; gap: .5rem; align-content: start; }
.k-aside .k-checks { margin-block: .75rem 1rem; }
.k-aside .k-checks li { font-size: .95rem; }
.k-aside a:not(.btn) { font-weight: 500; }
@media (min-width: 60em) { .k-booking { grid-template-columns: 1fr 19rem; } .k-aside { position: sticky; top: 4rem; } }

/* ---------------------------------------------------------- Blog */
.k-section .blog-tools .search input { border-radius: var(--r); background: #fff; }
.chip { border-radius: 2px; font-family: var(--head); text-transform: uppercase; letter-spacing: .06em; font-weight: 500; }
.chip[aria-pressed="true"] { background: var(--red); border-color: var(--red); color: #fff; }
.k-posts--list .k-post a { padding-bottom: 1.25rem; border-bottom: 2px solid var(--ink); }
.k-empty { padding: 2rem; background: #fff; text-align: center; color: var(--muted); }
.k-crumb { font: 500 .85rem/1.3 var(--head); text-transform: uppercase; letter-spacing: .12em; color: var(--muted); margin-bottom: 1rem; }
.k-crumb a { color: var(--red-ink); }
.k-article-hero .k-page-h { font-size: clamp(2rem, 5.5vw, 3.3rem); max-width: 26ch; }
.k-article-hero .k-post__meta { font-size: .9rem; }
.k-article { padding-block: 2rem 4rem; }
.k-article__img img, .k-article__img .ph { width: 100%; max-height: 32rem; aspect-ratio: 3 / 2; object-fit: cover; }
.k-article__body { display: grid; gap: 2.5rem; margin-top: 2.5rem; }
.prose h2 { font-size: 1.6rem; }
.prose a { color: var(--red-ink); font-weight: 500; }
.prose strong { font-weight: 500; color: var(--ink); background: linear-gradient(transparent 62%, var(--accent-soft) 62%); }
.prose blockquote { background: #fff; border-left-color: var(--red); }
.prose ol { list-style: none; counter-reset: li; padding-left: 0; }
.prose ol li { counter-increment: li; position: relative; padding-left: 2.4rem; }
.prose ol li::before { content: counter(li); position: absolute; left: 0; top: .1rem; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; background: var(--asphalt); color: #fff; font: 600 .9rem/1 var(--head); }
.k-article__cta { align-self: start; padding: 1.5rem; background: var(--asphalt); color: #f1f0ec; border-top: 6px solid transparent; border-image: var(--stripes) 1; display: grid; gap: .75rem; justify-items: start; }
.k-article__cta-h { font: 600 1.35rem/1.15 var(--head); text-transform: uppercase; }
.k-article__cta p:not(.k-article__cta-h) { color: #c9c9c5; font-size: .95rem; }
.k-article__cta :focus-visible { outline-color: #fff; }
@media (min-width: 60em) { .k-article__body { grid-template-columns: minmax(0, 42rem) 18rem; justify-content: space-between; } .k-article__cta { position: sticky; top: 4rem; } }

/* ---------------------------------------------------------- Kontakt */
.k-contact { display: grid; gap: 2rem; align-items: start; }
.k-form { display: grid; gap: 1.5rem; padding: clamp(1.25rem, 3vw, 2rem); background: #fff; border-top: 4px solid var(--red); }
.k-form .btn { justify-self: start; }
.k-form__set { border: 0; padding: 0; min-width: 0; }
.k-form__set legend { margin-bottom: .9rem; padding: 0; }
.k-seg { display: flex; flex-wrap: wrap; gap: .4rem; }
.k-seg label { position: relative; }
.k-seg input { position: absolute; opacity: 0; }
.k-seg span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem 1rem; border: 1.5px solid var(--line); font: 500 .95rem/1.2 var(--head); text-transform: uppercase; letter-spacing: .06em; cursor: pointer; }
.k-seg input:checked + span { background: var(--asphalt); border-color: var(--asphalt); color: #fff; }
.k-seg input:focus-visible + span { outline: 3px solid var(--red); outline-offset: 2px; }
.fld input, .fld select, .fld textarea { border-radius: var(--r); }
.k-aside--dark { border-left: 0; border-top: 6px solid transparent; border-image: var(--stripes) 1; gap: 1rem; }
.k-aside--dark address { font-style: normal; line-height: 1.8; }
.k-aside--dark a:not(.btn) { color: #fff; }
.k-aside--dark .btn { justify-self: start; }
@media (min-width: 60em) { .k-contact { grid-template-columns: 1fr 22rem; gap: 3rem; } }

/* ---------------------------------------------------------- Fuß */
.sf--dark { margin-top: 0; border-top: 6px solid transparent; border-image: var(--stripes) 1; }
.sf--dark .sf__name { font-family: var(--head); text-transform: uppercase; letter-spacing: .05em; font-size: 1.5rem; }
.sf--dark .sf__h { font-family: var(--head); font-weight: 500; text-transform: uppercase; letter-spacing: .12em; color: var(--red-light); }
.sf--dark a { color: #fff; }
.sf--dark .sf__legal { border-top-color: #44484d; }
.sf--dark .hours tr.is-today { color: #fff; }
main + .sf { margin-top: 0; }

/* Rechtsseiten */
.legal h1 { font-size: clamp(1.9rem, 5vw, 2.8rem); }
.legal h2 { font-size: 1.25rem; }