/* =====================================================================
   seite-haus.css — Frischlauf 2C · Autohof Wentorf (Autohaus 18)
   Seiten: ueber-uns · kontakt · impressum · datenschutz · bewerten · danke · 404
   Lädt NACH site.css und nutzt ausschließlich deren Tokens (Haut B
   „Die Visitenkarte“, bau-brief §4/§5/§11). Keine neuen Farben, keine
   Schatten, Radius 4 px, 1-px-Kanten in --stahl. Keine automatischen Spalten-Raster
   (Card-Grid-Budget gilt site-weit, premium-gate Regel 1).
   ===================================================================== */

/* =====================================================================
   ÜBER UNS
   ===================================================================== */

/* ---------- Inhaber: Initialen-Tafel über die linke Kante ---------- */
.inhaber {
  margin-top: clamp(4rem, 6vw, 6rem);
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 5vw, 5.5rem);
  align-items: center;
  padding-right: max(var(--rand-rv), calc((100vw - var(--bahn)) / 2));
}
.inhaber__tafel {
  display: flex;
  justify-content: flex-end;
  padding: clamp(2.2rem, 4.5vw, 3.6rem) clamp(1.6rem, 4vw, 3.6rem);
  padding-left: max(var(--rand), calc((100vw - var(--bahn)) / 2));
  background: var(--tafel);
  border: 1px solid var(--tafel-kante);
  border-left: 0;
  border-radius: 0 var(--radius) var(--radius) 0;
  box-shadow: inset 0 -5px 0 var(--leit);
  color: var(--kalk-fest);
}
.inhaber__tafel-innen {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: min(100%, 22rem);
}
.inhaber__initialen {
  font-family: var(--display);
  font-weight: 700;
  font-size: min(var(--fs-xxl), 30vw);
  line-height: 0.86;
  letter-spacing: -0.02em;
  margin-left: -0.05em;
  color: var(--kalk-fest);
}
.inhaber__name {
  margin-top: clamp(1.6rem, 3vw, 2.4rem);
  padding-top: 1rem;
  width: 100%;
  border-top: 1px solid rgba(248, 250, 250, 0.22);
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.35rem;
  line-height: 1.2;
}
.inhaber__rolle {
  margin-top: 0.3rem;
  color: var(--meta-fest);
  font-size: 0.95rem;
}
.inhaber__text {
  min-width: 0;
}
.inhaber__text .h2 {
  max-width: 30rem;
}
.inhaber__text .lead {
  margin-top: 1.3rem;
  max-width: 34rem;
}
.inhaber__text p + p {
  margin-top: 1rem;
}
.inhaber__absatz {
  max-width: 34rem;
}
.inhaber__text .haus__sprachen {
  max-width: 34rem;
}

/* ---------- Zahlen: Fakten-Leiste (Klassen aus site.css), oben mit Kante ---------- */
.fakten--haus {
  margin-top: clamp(3.5rem, 5vw, 5rem);
  border-top: 1px solid var(--stahl);
}
.fakten--haus .fakt__label {
  max-width: 15rem;
}

/* ---------- Statement + Urkunde: Zitat links, Foto über die rechte Kante ---------- */
.zeugnis {
  margin-top: clamp(4.5rem, 7vw, 7rem);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2rem, 5vw, 5.5rem);
  align-items: center;
  padding-left: max(var(--rand), calc((100vw - var(--bahn)) / 2));
}
.zeugnis__text {
  min-width: 0;
}
.zeugnis__zitat {
  margin: 0;
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.75rem, 1.15rem + 1.9vw, 3rem);
  line-height: 1.14;
  letter-spacing: -0.01em;
  text-wrap: pretty;
  max-width: 40rem;
}
.zeugnis__zitat em {
  font-style: normal;
  color: var(--magenta-text);
}
.zeugnis__quelle {
  margin-top: 1.2rem;
  color: var(--meta);
  font-size: 0.95rem;
}
.zeugnis__quelle b {
  color: var(--tinte);
  font-weight: 600;
}
.zeugnis__raum {
  margin-top: clamp(2.2rem, 4vw, 3.2rem);
  padding-top: 1.4rem;
  border-top: 1px solid var(--stahl);
  max-width: 34rem;
}
.zeugnis__raum h3 {
  margin-bottom: 0.55rem;
}
.zeugnis__raum p {
  color: var(--meta);
}
.zeugnis__raum span[lang] {
  color: var(--tinte);
  white-space: nowrap;
}
.zeugnis__urkunde {
  border: 1px solid var(--stahl);
  border-right: 0;
  border-radius: var(--radius) 0 0 var(--radius);
  overflow: hidden;
  background: var(--flaeche);
}
.zeugnis__urkunde img {
  width: 100%;
  height: auto;
  aspect-ratio: 720 / 900;
  object-fit: cover;
}
.zeugnis__urkunde figcaption {
  padding: 0.85rem 1.1rem;
  font-size: 0.9rem;
  color: var(--meta);
  border-top: 1px solid var(--stahl);
  background: var(--grund);
}
.zeugnis__urkunde figcaption b {
  color: var(--tinte);
  font-weight: 600;
}

/* ---------- Text-Siegel „10 Jahre“ (Fix R1 Punkt 8, bau-brief §3 ueber-uns) ----------
   Karte & Stahl: helle Fläche, 1-px-Stahlkante, läuft wie zuvor die Urkunde über die rechte Kante
   (Layout-Bruch bleibt). Display-Moment nur Zahl (bau-brief §5: Display XXL). Kein Foto — das
   Urkunde-Motiv steht einmal, auf der Startseite (GESETZ Kap. 8). */
.zeugnis__siegel {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: clamp(2rem, 4vw, 3.4rem) max(var(--rand-rv), clamp(1.6rem, 4vw, 3.4rem)) clamp(2rem, 4vw, 3.2rem) clamp(1.6rem, 4vw, 3.4rem);
  background: var(--flaeche);
  border: 1px solid var(--stahl);
  border-right: 0;
  border-radius: var(--radius) 0 0 var(--radius);
}
.zeugnis__siegel-kopf {
  font-size: var(--fs-cap);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--meta);
}
.zeugnis__siegel-kopf b {
  font-weight: 600;
}
.zeugnis__siegel-zahl {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.18em;
  margin: 0.2rem 0 0.4rem;
  font-family: var(--display);
  color: var(--tinte);
  line-height: 0.86;
}
.zeugnis__siegel-ziffer {
  font-weight: 700;
  font-size: clamp(5.5rem, 11vw - 1rem, 10rem);
  letter-spacing: -0.02em;
}
.zeugnis__siegel-wort {
  font-weight: 600;
  font-size: var(--fs-h2);
  letter-spacing: -0.01em;
}
.zeugnis__siegel-text {
  max-width: 24rem;
  padding-top: 1rem;
  border-top: 1px solid var(--stahl);
  color: var(--meta);
}

/* ---------- Einladung: helle Karte mit Adresse, Zeiten, zwei Wegen ---------- */
.einladung {
  margin-top: clamp(3rem, 4.5vw, 4.5rem);
}
.einladung__karte {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 4fr) auto;
  gap: clamp(1.5rem, 4vw, 4rem);
  align-items: end;
  padding: clamp(1.8rem, 4vw, 3.2rem);
  background: var(--flaeche);
  border: 1px solid var(--stahl);
  border-radius: var(--radius);
}
.einladung__adresse {
  margin-top: 0.9rem;
  font-style: normal;
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.25rem, 1rem + 0.8vw, 1.7rem);
  line-height: 1.3;
}
.einladung__zeiten {
  color: var(--meta);
  font-size: 0.98rem;
  line-height: 1.6;
}
.einladung__zeiten b {
  display: block;
  color: var(--tinte);
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.02rem;
  margin-bottom: 0.25rem;
}
.einladung__wege {
  display: grid;
  gap: 0.7rem;
  justify-items: stretch;
}

/* =====================================================================
   KONTAKT
   ===================================================================== */
.anfrage--kontakt {
  margin-top: clamp(4rem, 6vw, 6rem);
  border-top: 0;
  padding-top: 0;
}
.anfrage--kontakt .anfrage__kopf .lead {
  margin-top: 1rem;
  max-width: 24rem;
}

/* ---------- Karte: groß, über die rechte Kante ---------- */
.ort {
  margin-top: clamp(3.5rem, 5.5vw, 5.5rem);
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: clamp(2rem, 4.5vw, 4.5rem);
  align-items: stretch;
  padding-left: max(var(--rand), calc((100vw - var(--bahn)) / 2));
}
.ort__text {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  min-width: 0;
  padding-block: 0.5rem;
}
.ort__adresse {
  font-style: normal;
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.3rem, 1.05rem + 0.8vw, 1.75rem);
  line-height: 1.3;
}
.ort__hinweis {
  color: var(--meta);
  font-size: 0.95rem;
  max-width: 22rem;
}
.ort__karte {
  min-height: clamp(380px, 58vh, 600px);
  border: 1px solid var(--stahl);
  border-right: 0;
  border-radius: var(--radius) 0 0 var(--radius);
  overflow: hidden;
  background: var(--flaeche);
}
.ort__karte iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: clamp(380px, 58vh, 600px);
  border: 0;
}

/* ---------- Öffnungszeiten: Tafel-Zeilen + Status „heute“ ---------- */
.zeiten {
  margin-top: clamp(2.5rem, 3.5vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2rem, 5vw, 5.5rem);
  align-items: start;
  padding-top: clamp(2.2rem, 3.5vw, 3rem);
  border-top: 1px solid var(--stahl);
}
.zeiten__kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem 1.5rem;
}
.zeiten__status {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--tinte);
}
.zeiten__status::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--meta);
  flex: 0 0 auto;
}
.zeiten__status[data-offen="ja"]::before {
  background: #2f8f4e;
}
.zeiten__liste {
  margin: 1.6rem 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--kante);
}
.zeiten__liste li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: baseline;
  padding: 1.05rem 0.2rem;
  border-bottom: 1px solid var(--kante);
  font-family: var(--display);
  font-size: clamp(1.15rem, 1rem + 0.6vw, 1.55rem);
  font-weight: 500;
}
.zeiten__liste li span:last-child {
  font-weight: 600;
  white-space: nowrap;
}
.zeiten__liste li[data-zu] span:last-child {
  color: var(--meta);
  font-weight: 500;
}
.zeiten__liste li[data-heute] {
  box-shadow: inset 3px 0 0 var(--leit);
  padding-left: 1rem;
}
.zeiten__neben {
  display: grid;
  gap: 2rem;
  min-width: 0;
}
.zeiten__block h3 {
  font-family: var(--text);
  font-size: var(--fs-cap);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--meta);
  margin-bottom: 0.7rem;
}
.zeiten__wege {
  display: grid;
  gap: 0.15rem;
}
.zeiten__wege a {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 0.8rem;
  align-items: baseline;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--kante);
  color: var(--tinte);
  text-decoration: none;
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.08rem;
  overflow-wrap: anywhere;
}
.zeiten__wege a span:not([data-mgr-huelle]) {
  font-family: var(--text);
  font-weight: 400;
  font-size: 0.9rem;
  color: var(--meta);
}
.zeiten__block .haus__sprachen {
  margin-top: 0;
}
@media (hover: hover) and (pointer: fine) {
  .zeiten__wege a:hover {
    color: var(--magenta-text);
  }
}

/* =====================================================================
   RECHTSSEITEN (impressum · datenschutz) — heller Textkopf, keine Bühne
   ===================================================================== */
.recht {
  padding-block: clamp(3.5rem, 6vw, 6rem) clamp(1rem, 2vw, 2rem);
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: clamp(2rem, 5vw, 5.5rem);
  align-items: start;
}
.recht__kopf {
  position: sticky;
  top: calc(var(--leiste) + 2rem);
  min-width: 0;
}
.recht__kopf h1 {
  font-weight: 600;
  font-size: var(--fs-h1);
  line-height: 1.06;
  letter-spacing: -0.01em;
  margin-top: 0.6rem;
  overflow-wrap: break-word;
  hyphens: auto;
}
.recht__stand {
  margin-top: 1rem;
  color: var(--meta);
  font-size: 0.92rem;
}
.recht__inhalt {
  margin: 1.8rem 0 0;
  padding: 1.1rem 0 0;
  list-style: none;
  border-top: 1px solid var(--stahl);
  display: grid;
  gap: 0.15rem;
  font-size: 0.92rem;
}
.recht__inhalt a {
  display: block;
  padding: 0.3rem 0;
  color: var(--meta);
  text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  .recht__inhalt a:hover {
    color: var(--magenta-text);
  }
}
.recht__text {
  min-width: 0;
  max-width: 46rem;
}
.recht__text section {
  padding-block: 1.6rem;
  border-top: 1px solid var(--kante);
}
.recht__text section:first-child {
  border-top: 1px solid var(--stahl);
}
.recht__text h2 {
  font-weight: 500;
  font-size: var(--fs-h3);
  line-height: 1.2;
  margin-bottom: 0.7rem;
  scroll-margin-top: calc(var(--leiste) + 1.5rem);
}
.recht__text p,
.recht__text address {
  font-style: normal;
  color: var(--tinte);
  max-width: 44rem;
}
.recht__text p + p,
.recht__text address + p,
.recht__text p + address {
  margin-top: 0.8rem;
}
.recht__text .klein {
  color: var(--meta);
  font-size: 0.94rem;
}
.recht__text a {
  overflow-wrap: anywhere;
}
.recht__marke {
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.3;
}

/* =====================================================================
   BEWERTEN — dunkle Bühne, gerahmte Karte in der Leitfarbe (GESETZ Kap. 9)
   Themenfest: Text-Tokens auf der Bühne umdefiniert (Kap. 11).
   ===================================================================== */
.bewerten {
  --tinte: var(--kalk-fest);
  --meta: var(--meta-fest);
  --grund: #1e1c20;
  --flaeche: #1e1c20;
  --kante: #34313a;
  --stahl: #6b7175;
  --magenta-text: #ff8fa2;
  position: relative;
  min-height: calc(100svh - var(--leiste));
  display: grid;
  align-items: center;
  padding-block: clamp(3.5rem, 8vw, 6.5rem);
  background: var(--tafel);
  border-bottom: 1px solid var(--tafel-kante);
  color: var(--kalk-fest);
  overflow-anchor: none;
}
/* dunkle Bühne läuft bündig in den Fuß — kein heller Zwischenstreifen */
body:has(.bewerten) .fuss {
  margin-top: 0;
}
.bewerten__inner {
  width: 100%;
  max-width: 46rem;
  margin-inline: auto;
  padding-inline: var(--rand);
  text-align: center;
}
.bewerten__kicker {
  font-size: var(--fs-cap);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--meta-fest);
}
.bewerten h1 {
  margin-top: 0.9rem;
  font-weight: 700;
  font-size: clamp(2.6rem, 1.4rem + 4.6vw, 5.4rem);
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: var(--kalk-fest);
  text-wrap: balance;
}
.bewerten__lead {
  margin: 1.1rem auto 0;
  max-width: 30rem;
  font-size: var(--fs-lead);
  color: var(--meta-fest);
}
.bewerten__karte {
  margin-top: clamp(2rem, 4vw, 2.8rem);
  padding: clamp(1.8rem, 4.5vw, 2.8rem) clamp(1.2rem, 4vw, 2.8rem);
  background: #0f0f12;
  border: 2px solid var(--leit);
  border-radius: var(--radius);
}
.bewerten__stufe h2 {
  font-weight: 600;
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem);
  line-height: 1.1;
  color: var(--kalk-fest);
}
.bewerten__stufe > p {
  margin: 0.8rem auto 0;
  max-width: 30rem;
  color: var(--meta-fest);
}
.bewerten__stufe .knopf {
  margin-top: 1.5rem;
  min-width: min(100%, 18rem);
}
.bewerten__fein {
  margin: 1.2rem auto 0 !important;
  font-size: 0.9rem;
  color: var(--meta-fest);
  max-width: 30rem;
}
.bewerten__fein a {
  color: var(--kalk-fest);
  text-underline-offset: 3px;
}
.sterne {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
.sterne__legend {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.sterne__titel {
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(1.2rem, 0.95rem + 0.9vw, 1.6rem);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--kalk-fest);
}
.sterne__reihe {
  display: flex;
  gap: clamp(0.15rem, 1vw, 0.5rem);
  justify-content: center;
  margin-top: 1.2rem;
}
.stern {
  -webkit-appearance: none;
  appearance: none;
  display: grid;
  place-items: center;
  width: clamp(3rem, 13vw, 4.1rem);
  height: clamp(3rem, 13vw, 4.1rem);
  padding: 0;
  background: none;
  border: 0;
  border-radius: var(--radius);
  cursor: pointer;
  color: var(--leit);
  transition: transform 140ms var(--ease-ui);
}
.stern svg {
  width: 82%;
  height: auto;
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1.4;
  stroke-linejoin: round;
  transition: fill 160ms ease;
}
.stern.an svg {
  fill: currentColor;
}
.stern:active {
  transform: scale(0.94);
}
.stern:focus-visible {
  outline: 2px solid var(--kalk-fest);
  outline-offset: 2px;
}
@media (hover: hover) and (pointer: fine) {
  .stern:hover {
    transform: translateY(-2px);
  }
}
.sterne__hinweis {
  margin-top: 0.9rem;
  font-size: 0.92rem;
  color: var(--meta-fest);
}
/* Stufen-Wechsel ohne Höhensprung: weich einblenden (Zustandswechsel, bau-brief §10) */
.bewerten__stufe:not([hidden]) {
  animation: stufe-ein 260ms var(--ease-ui) both;
}
@keyframes stufe-ein {
  from {
    opacity: 0;
    transform: translate3d(0, 6px, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.bewerten .form {
  margin-top: 1.5rem;
  text-align: left;
  background: transparent;
  border: 0;
  padding: 0;
}
.bewerten .feld label {
  color: var(--kalk-fest);
}
.bewerten .einwilligung {
  color: var(--meta-fest);
}
.bewerten .einwilligung a {
  color: var(--kalk-fest);
}
.bewerten__fertig {
  margin-top: 1.4rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--stahl);
  border-radius: var(--radius);
  color: var(--kalk-fest);
  text-align: left;
}
.bewerten__fertig:focus {
  outline: 2px solid var(--leit);
  outline-offset: 2px;
}

/* =====================================================================
   DANKE + 404 — heller Abschluss, Display-Moment, Weg zurück
   ===================================================================== */
.schluss {
  min-height: calc(78svh - var(--leiste));
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2rem, 5vw, 5.5rem);
  align-items: center;
  padding-block: clamp(3.5rem, 7vw, 6.5rem);
}
.schluss__text {
  min-width: 0;
}
.schluss__titel {
  margin: 0;
}
.schluss__titel .schluss__display,
.schluss__titel .schluss__h1 {
  display: block;
}
.schluss__display {
  font-family: var(--display);
  font-weight: 700;
  font-size: min(var(--fs-xxl), 30vw);
  line-height: 0.86;
  letter-spacing: -0.02em;
  margin-left: -0.04em;
  color: var(--tinte);
}
.schluss__h1 {
  margin-top: clamp(1.2rem, 2.5vw, 2rem);
  font-weight: 600;
  font-size: var(--fs-h1);
  line-height: 1.06;
  letter-spacing: -0.01em;
  max-width: 34rem;
  text-wrap: balance;
}
.schluss__text .lead {
  margin-top: 1.1rem;
  max-width: 32rem;
}
.schluss__text .lead a {
  color: var(--tinte);
  font-weight: 600;
  white-space: nowrap;
}
.schluss__wege {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: 2rem;
}
.schluss__karte {
  padding: clamp(1.6rem, 3.5vw, 2.6rem);
  background: var(--flaeche);
  border: 1px solid var(--stahl);
  border-radius: var(--radius);
  min-width: 0;
}
.schluss__person {
  display: flex;
  align-items: center;
  gap: 1.1rem;
}
.schluss__karte p {
  margin-top: 1.3rem;
  color: var(--meta);
}
.schluss__karte .pfeil-link {
  margin-top: 0.6rem;
}
.schluss__karte .schluss__karte-titel {
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.25;
  color: var(--tinte);
}

/* =====================================================================
   Responsiv
   ===================================================================== */
@media (max-width: 1100px) {
  .einladung__karte {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .einladung__wege {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}
@media (max-width: 900px) {
  .inhaber {
    grid-template-columns: minmax(0, 1fr);
    padding-right: 0;
  }
  .inhaber__tafel {
    margin-right: 12%;
    justify-content: flex-start;
  }
  .inhaber__text {
    padding-left: var(--rand); padding-right: var(--rand-r);
  }
  .fakten--haus .fakt:nth-child(2n) {
    border-right: 0;
  }
  .fakten--haus .fakt:nth-child(-n + 2) {
    border-bottom: 1px solid var(--kante);
  }
  .zeugnis {
    grid-template-columns: minmax(0, 1fr);
  }
  .zeugnis__text {
    padding-right: var(--rand-r);
  }
  .zeugnis__urkunde,
  .zeugnis__siegel {
    margin-left: 14%;
  }
  .ort {
    grid-template-columns: minmax(0, 1fr);
  }
  .ort__text {
    padding-right: var(--rand-r);
  }
  .zeiten {
    grid-template-columns: minmax(0, 1fr);
  }
  .recht {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }
  .recht__kopf {
    position: static;
  }
  .schluss {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }
}
@media (max-width: 560px) {
  .einladung__karte,
  .einladung__wege {
    grid-template-columns: minmax(0, 1fr);
  }
  .inhaber__tafel {
    margin-right: 8%;
  }
  .zeugnis__urkunde,
  .zeugnis__siegel {
    margin-left: 8%;
  }
  .zeiten__wege a {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.1rem;
  }
  .schluss__wege .knopf {
    width: 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bewerten__stufe:not([hidden]) {
    animation: none;
  }
  .stern,
  .stern svg {
    transition: none;
  }
}

/* Augen-Tor 05.10.2026: Inhaber-Karte als Visitenkarte statt Initialen-Kachel „AE“ (las sich wie ein fehlendes Bild). */
.inhaber__eyebrow {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--meta-fest);
}
.inhaber__tafel .inhaber__name {
  margin-top: 1rem;
  font-size: clamp(1.6rem, 2.6vw, 2.1rem);
}
.inhaber__draht {
  display: inline-block;
  margin-top: 1rem;
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--kalk-fest);
  text-decoration: none;
  border-bottom: 3px solid var(--leit);
  padding-bottom: 0.15rem;
  white-space: nowrap;
}
.inhaber__draht--wa {
  margin-top: 0.7rem;
  font-size: 1rem;
  border-bottom-color: rgba(248, 250, 250, 0.35);
}
.inhaber__draht:hover,
.inhaber__draht:focus-visible {
  border-bottom-color: var(--kalk-fest);
}

/* Augen-Tor-Nachlauf 05.10.2026: Die Karte lief rechts unter die festen Knöpfe (Anrufen/WhatsApp
   verdeckten „Kartenfehler melden“/Nutzungsbedingungen). Ab 761 px hält sie den 88-px-Streifen frei. */
@media (min-width: 761px) {
  .ort__karte {
    margin-right: var(--rand-rv);
    border-right: 1px solid var(--stahl);
    border-radius: var(--radius);
  }
}

/* Augen-Tor 05.10.2026: Kartenbild hinter dem Google-Rahmen (Regel steht in site.css; hier wiederholt,
   weil diese Datei nach site.css lädt und .ort__karte oben den Hintergrund mit var(--flaeche) setzt). */
.ort__karte {
  background: var(--flaeche) url("../bilder/karte-suedring-40.webp") center / cover no-repeat;
}
@media (max-width: 760px) {
  .ort__karte {
    background-image: url("../bilder/karte-suedring-40-800.webp");
  }
}


/* Augen-Tor 05.10.2026: Hof-Luftbild in der „So finden Sie uns“-Karte (ueber-uns). */
.einladung__karte--bild {
  grid-template-columns: clamp(9rem, 16vw, 13rem) minmax(0, 6fr) minmax(0, 4fr) auto;
  align-items: center;
}
.einladung__bild {
  margin: 0;
}
.einladung__bild img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 480 / 577;
  object-fit: cover;
  border-radius: var(--radius);
}
@media (max-width: 900px) {
  .einladung__karte--bild {
    grid-template-columns: minmax(0, 1fr);
  }
  .einladung__bild {
    max-width: 16rem;
  }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .einladung__karte--bild {
    grid-template-columns: clamp(9rem, 16vw, 12rem) minmax(0, 1fr) minmax(0, 1fr);
  }
  .einladung__karte--bild .einladung__wege {
    grid-column: 1 / -1;
  }
}

/* Augen-Tor 05.10.2026: Das Urkunden-Foto läuft weiter über die rechte Kante (Layout-Bruch), die
   Bildunterschrift hält aber den 88-px-Streifen der festen Knöpfe frei (Fix-R1-Regel --rand-rv). */
@media (min-width: 761px) {
  .zeugnis__urkunde figcaption {
    padding-right: calc(var(--rand-rv) + 0.5rem);
  }
}