/* =========================================================
   1Plus Gutachten – Styles
   Werte 1:1 nach Vorlage (Inter Tight / Inter, Apple-Farbpalette)
   ========================================================= */
/* Schriften lokal eingebunden (DSGVO-konform, keine Google-Server) */
@font-face {
  font-family: "Inter Tight";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("assets/fonts/inter-tight-latin-wght-normal.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("assets/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
}

:root {
  --color-bg: #fff;
  --color-bg-warm: #f5f5f7;
  --color-line: #d2d2d7;
  --color-line-soft: #e8e8ed;
  --color-ink: #1d1d1f;
  --color-ink-soft: #424245;
  --color-ink-muted: #6e6e73;
  --color-gold: #b8912e;
  --color-gold-soft: #d4a73a;
  --color-gold-deep: #8b6e22;
  --color-whatsapp: #25d366;

  --font-display: "Inter Tight", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;

  --text-sm: clamp(.8125rem, .78rem + .2vw, .9375rem);
  --text-base: clamp(1rem, .95rem + .2vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.05rem + .4vw, 1.3125rem);
  --text-xl: clamp(1.25rem, 1.1rem + .7vw, 1.5rem);
  --text-2xl: clamp(1.625rem, 1.3rem + 1.4vw, 2.25rem);
  --text-3xl: clamp(1.875rem, 1.4rem + 2vw, 3.25rem);
  --text-4xl: clamp(2.125rem, 1.5rem + 2.6vw, 4.25rem);
  --text-5xl: clamp(2.5rem, 1.6rem + 3.8vw, 5.75rem);
  --text-hero: clamp(2.625rem, 1.6rem + 5vw, 7rem);

  --ease-out-expo: cubic-bezier(.16, 1, .3, 1);
  --header-h: 80px;
}
@media (min-width: 768px) { :root { --header-h: 96px; } }

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  color: var(--color-ink);
  background: var(--color-bg);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4 { font-family: var(--font-display); font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; }
button { font: inherit; color: inherit; background: none; cursor: pointer; }

main { padding-top: var(--header-h); }
section[id] { scroll-margin-top: var(--header-h); }

.section-inner { max-width: 75rem; margin-inline: auto; }

.eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  letter-spacing: -0.005em;
  color: var(--color-gold-deep);
  font-weight: 600;
}

/* ---------- Reveal-Animation ---------- */
.reveal {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity .9s var(--ease-out-expo), transform .9s var(--ease-out-expo);
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* =========================================================
   HEADER
   ========================================================= */
.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .8);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--color-line-soft);
}
.header__inner {
  max-width: 80rem;
  margin-inline: auto;
  padding-inline: 1.25rem;
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) { .header__inner { padding-inline: 1.5rem; } }

/* Platzhalter-Logo (Höhe wie Vorlage: 48px mobil / 64px Desktop) */
.logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 48px;
  color: var(--color-ink);
  line-height: 1;
  flex-shrink: 0;
}
.logo__img { height: 48px; width: auto; }
.logo__top, .logo__sub { font-family: Georgia, "Times New Roman", serif; font-size: 8px; letter-spacing: .1em; }
.logo__main { font-family: var(--font-display); font-size: 26px; font-weight: 400; transform: scaleX(.72); margin: 1px 0; letter-spacing: -0.01em; }
@media (min-width: 768px) {
  .logo, .logo__img { height: 64px; }
  .logo__top, .logo__sub { font-size: 9px; }
  .logo__main { font-size: 34px; }
}

.nav { display: none; align-items: center; gap: 2rem; }
.nav a {
  color: var(--color-ink-soft);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.025em;
  transition: color .2s;
}
.nav a:hover { color: var(--color-ink); }

.header__phone {
  display: none;
  align-items: center;
  gap: .5rem;
  flex-shrink: 0;
  color: var(--color-ink);
  font-size: 15px;
  font-weight: 600;
  transition: color .2s;
}
.header__phone:hover { color: var(--color-gold-deep); }

@media (min-width: 768px) {
  .nav, .header__phone { display: flex; }
}
@media (min-width: 1024px) {
  .nav { gap: 2.5rem; }
  .nav a, .header__phone { font-size: 16px; }
}

/* Burger */
.burger {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-width: 44px;
  min-height: 44px;
  padding: .75rem;
  margin-right: -.75rem;
}
.burger span { display: block; width: 20px; height: 2px; background: var(--color-ink); border-radius: 2px; transition: transform .25s, opacity .25s; }
.burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (min-width: 768px) { .burger { display: none; } }

.mobile-menu {
  display: none;
  flex-direction: column;
  gap: .25rem;
  padding: 1.5rem 1.25rem;
  background: rgba(255, 255, 255, .95);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  border-top: 1px solid var(--color-line-soft);
}
.mobile-menu.is-open { display: flex; }
.mobile-menu a {
  color: var(--color-ink);
  font-size: var(--text-lg);
  font-weight: 500;
  letter-spacing: -0.025em;
  padding-block: .75rem;
  border-bottom: 1px solid var(--color-line-soft);
}
@media (min-width: 768px) { .mobile-menu, .mobile-menu.is-open { display: none; } }

/* =========================================================
   HERO
   ========================================================= */
.hero {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: auto;
  background: var(--color-ink);
}
@media (min-width: 768px) {
  .hero { min-height: calc(100vh - 6rem); min-height: calc(100svh - 6rem); max-height: 860px; }
}

.hero__bg {
  position: absolute;
  inset: 0;
  background:
    url("assets/hero.jpg") 62% center / cover no-repeat,
    #6f7377;
  filter: brightness(1.14) contrast(1.04) saturate(1.06);
}
@media (max-width: 767px) { .hero__bg { background-position: 72% center; } }
.hero__shade { position: absolute; inset: 0; }
.hero__shade--v { background: linear-gradient(to bottom, rgba(16,20,26,.18), rgba(16,20,26,.05) 45%, rgba(16,20,26,.30)); }
.hero__shade--h { background: linear-gradient(to bottom, rgba(16,22,30,.42), rgba(16,22,30,.45) 55%, rgba(16,22,30,.35)); }
@media (min-width: 768px) {
  .hero__shade--h { background: linear-gradient(to right, rgba(16,22,30,.66) 0%, rgba(16,22,30,.42) 34%, rgba(16,22,30,.04) 58%, rgba(16,22,30,0) 100%); }
}

.hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 1rem 1.25rem 2.5rem;
}
@media (min-width: 768px) { .hero__content { padding: 3rem 2rem 5rem; } }

.hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  align-items: center;
}
@media (min-width: 768px) { .hero__grid { grid-template-columns: 1fr minmax(0, 1fr); gap: 3rem; } }
@media (min-width: 1024px) { .hero__grid { gap: 4rem; } }

.hero__text {
  display: flex;
  flex-direction: column;
  text-align: center;
  color: #fff;
  order: 2;
}
@media (min-width: 768px) { .hero__text { text-align: left; order: 1; } }

.hero__eyebrow { color: var(--color-gold-soft); margin-bottom: .75rem; order: 1; line-height: 1.05; }
@media (min-width: 768px) { .hero__eyebrow { margin-bottom: 1.25rem; } }

.hero__title {
  order: 2;
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 1.5rem + 3.5vw, 4.5rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.05em;
  color: #fff;
  margin-bottom: -0.14em;
  padding-bottom: 0.14em;
}

.hero__lead {
  order: 4;
  color: rgba(255, 255, 255, .85);
  font-size: var(--text-base);
  line-height: 1.625;
  margin-top: 1.25rem;
  max-width: 36rem;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .hero__lead { order: 3; font-size: var(--text-lg); margin-top: 1.5rem; margin-inline: 0; }
}

.hero__buttons {
  order: 3;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: .625rem;
  margin-top: 1.25rem;
  justify-content: center;
}
@media (min-width: 640px) { .hero__buttons { gap: .75rem; } }
@media (min-width: 768px) { .hero__buttons { order: 4; margin-top: 2rem; justify-content: flex-start; } }

.hero__buttons .btn { flex: 1 1 0%; min-width: 9rem; }
@media (min-width: 640px) { .hero__buttons .btn { flex: 0 1 auto; } }

.hero__call { display: none !important; }
@media (min-width: 768px) { .hero__call { display: inline-flex !important; } }

.only-desktop { display: none; }
@media (min-width: 768px) { .only-desktop { display: inline; } .only-mobile { display: none; } }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 48px;
  padding: .875rem 1.625rem;
  border-radius: 980px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-base);
  letter-spacing: -0.01em;
  white-space: nowrap;
  cursor: pointer;
  transition: all .3s var(--ease-out-expo);
}
.btn-lg { font-size: var(--text-lg); min-height: 56px; padding: 1.05rem 2rem; }
.btn-light { background: #fff; color: var(--color-ink); }
.btn-light:hover { background: #f5f5f7; transform: translateY(-1px); }
.btn-whatsapp { background: var(--color-whatsapp); color: var(--color-ink); }
.btn-whatsapp:hover { background: #1da851; transform: translateY(-1px); }

/* Rechte Spalte */
.hero__side { order: 1; display: flex; justify-content: center; }
@media (min-width: 768px) { .hero__side { order: 2; } }

/* Handy: pulsierender Anruf-Button */
.btn-call-pulse {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  width: 8.5rem;
  height: 8.5rem;
  padding: .5rem;
  border-radius: 50%;
  background: #d92d20;
  color: #fff;
  text-align: center;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.015em;
  box-shadow: rgba(217, 45, 32, .65) 0 10px 30px -8px;
}
.btn-call-pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 50%;
  background: rgba(217, 45, 32, .55);
  pointer-events: none;
  animation: call-pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
}
.btn-call-pulse:hover, .btn-call-pulse:active { background: #b42318; }
@keyframes call-pulse {
  0% { opacity: 1; transform: scale(1); }
  70%, 100% { opacity: 0; transform: scale(1.265); }
}
@media (min-width: 768px) { .btn-call-pulse { display: none; } }

/* Desktop: Google-Badge */
.google-badge {
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20rem;
  height: 20rem;
  padding: 16px;
  border-radius: 50%;
  background: conic-gradient(#ea4335 0% 25%, #fbbc05 25% 50%, #34a853 50% 75%, #4285f4 75% 100%);
  box-shadow: rgba(0, 0, 0, .18) 0 8px 24px -10px;
  transition: transform .3s var(--ease-out-expo);
}
.google-badge:hover { transform: translateY(-2px); }
@media (min-width: 768px) { .google-badge { display: inline-flex; } }

.gb-inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  color: var(--color-ink);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: .4rem;
  padding: .75rem;
  line-height: 1.15;
  overflow: hidden;
}
.gb-eyebrow { font-family: var(--font-body); font-size: 1.2rem; font-weight: 600; letter-spacing: -0.005em; line-height: 1; }
.gb-google { font-family: "Product Sans", var(--font-display); font-size: 2.65rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1; }
.gb-cat { font-family: var(--font-body); font-size: 1.05rem; color: var(--color-ink-soft); line-height: 1.2; }
.gb-rating { display: inline-flex; align-items: center; gap: .4rem; line-height: 1; }
.gb-score { font-family: var(--font-body); font-size: 1.8rem; font-weight: 700; line-height: 1; }
.gb-stars { display: inline-flex; gap: 1px; align-items: center; }
.gb-stars svg { width: 22px; height: 22px; fill: #fbbc05; }

/* =========================================================
   VORTEILE-LEISTE
   ========================================================= */
.usp {
  background: #fff;
  border-top: 1px solid var(--color-line-soft);
  border-bottom: 1px solid var(--color-line-soft);
}
.usp__inner { padding: 1.5rem 1rem; }
@media (min-width: 768px) { .usp__inner { padding: 1.75rem 2rem; } }

.usp__row {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
}
@media (min-width: 768px) { .usp__row { flex-direction: row; gap: 3rem; } }

.usp__item {
  display: flex;
  align-items: center;
  gap: .75rem;
  color: var(--color-ink);
  font-size: var(--text-sm);
  font-weight: 500;
  letter-spacing: -0.025em;
}
.usp__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--color-gold); flex-shrink: 0; }
.usp__divider { display: none; width: 1px; height: 1rem; background: var(--color-line); margin-left: 2.25rem; }
@media (min-width: 768px) { .usp__divider { display: inline-block; } }

/* =========================================================
   SECTION: PROBLEME
   ========================================================= */
.section {
  padding-block: clamp(5rem, 10vw, 9rem);
  padding-inline: clamp(1.25rem, 4vw, 2rem);
}

.section-head { max-width: 48rem; margin-bottom: 3.5rem; }
@media (min-width: 768px) { .section-head { margin-bottom: 5rem; } }
.section-head__eyebrow { margin-bottom: 1rem; }

.section-title-narrow {
  font-family: var(--font-display);
  font-size: var(--text-4xl);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.04em;
  color: var(--color-ink);
}
.section-title-narrow .muted { color: var(--color-ink-muted); }

.tile-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  perspective: 1200px;
}
@media (min-width: 768px) { .tile-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.tile {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: clamp(1.75rem, 3vw, 2.75rem);
  border-radius: 1.5rem;
  background: var(--color-bg-warm);
}
.service-tile {
  transform-style: preserve-3d;
  will-change: transform;
  transition: opacity .9s var(--ease-out-expo), transform .4s var(--ease-out-expo), box-shadow .4s var(--ease-out-expo);
}
.service-tile:hover {
  box-shadow: rgba(0, 0, 0, .18) 0 30px 60px -20px, rgba(0, 0, 0, .04) 0 0 0 1px;
}

.tile-eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-ink-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: .75rem;
}
.tile-title {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.025em;
  color: var(--color-ink);
  margin-bottom: .625rem;
}
.tile-body {
  margin-top: .5rem;
  color: var(--color-ink-soft);
  font-size: var(--text-base);
  line-height: 1.55;
}

/* =========================================================
   SECTION: ABLAUF (Verfahren)
   ========================================================= */
.section--warm { background: var(--color-bg-warm); }
.section-head--center { max-width: none; text-align: center; }

.section-title {
  font-family: var(--font-display);
  font-size: var(--text-5xl);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.045em;
  color: var(--color-ink);
  text-align: center;
}

.steps {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 3rem;
}
@media (min-width: 768px) { .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }

.step__num {
  font-family: var(--font-body);
  font-size: var(--text-5xl);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
  color: var(--color-ink);
  margin-bottom: 1.25rem;
}
.step__title {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: var(--color-ink);
  margin-bottom: .75rem;
}
.step__text {
  color: var(--color-ink-soft);
  font-size: var(--text-base);
  line-height: 1.625;
  max-width: 24rem;
}

.steps__cta { margin-top: 3.5rem; text-align: center; }
@media (min-width: 768px) { .steps__cta { margin-top: 5rem; } }

.btn-primary { background: var(--color-ink); color: #fff; }
.btn-primary:hover { background: #2c2c2e; transform: translateY(-1px); }

/* =========================================================
   SECTION: WHATSAPP + iPHONE
   ========================================================= */
.wa-section { overflow: hidden; }
.wa-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 3rem;
  align-items: center;
}
@media (min-width: 768px) { .wa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5rem; } }

.wa-title { margin-bottom: 1.5rem; }
.wa-lead { color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; margin-bottom: 1.25rem; }
.wa-text { color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.625; margin-bottom: 2rem; }
.wa-text strong { color: var(--color-ink); font-weight: 600; }
.wa-note { color: var(--color-ink-muted); font-size: var(--text-sm); margin-top: 1rem; }

.wa-phone { display: flex; justify-content: center; }
@media (min-width: 768px) { .wa-phone { justify-content: flex-end; } }

/* --- iPhone (Werte 1:1) --- */
.iphone { --w: 20rem; width: var(--w); aspect-ratio: 553 / 1200; position: relative; transform: translateZ(0); }
@media (max-width: 640px) { .iphone { --w: 17rem; } }

.iphone-frame {
  position: relative;
  width: 100%;
  height: 100%;
  padding: .45rem;
  border-radius: 3rem;
  background: linear-gradient(145deg, #9a948e, #c9c2bb 18%, #a8a29c 38%, #7a7570, #b1aaa3 82%, #6f6a64);
  box-shadow:
    rgba(255, 255, 255, .18) 0 0 0 1px inset,
    rgba(0, 0, 0, .05) 0 0 0 2px inset,
    rgba(0, 0, 0, .45) 0 30px 80px -20px,
    rgba(0, 0, 0, .3) 0 60px 120px -30px;
}
.iphone-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 3rem;
  background: repeating-linear-gradient(110deg, rgba(255,255,255,.04) 0, rgba(255,255,255,.04) 1px, transparent 1px, transparent 3px);
  pointer-events: none;
  mix-blend-mode: overlay;
}
.iphone-btn {
  position: absolute;
  background: linear-gradient(#6a655f, #4d4843 60%, #6a655f);
  border-radius: 1.5px;
  box-shadow: rgba(0, 0, 0, .2) 0 0 0 1px inset;
}
.iphone-btn-volume-up   { top: 7rem;  left: -.15rem; width: .15rem; height: 2.25rem; border-radius: 1.5px 0 0 1.5px; }
.iphone-btn-volume-down { top: 10rem; left: -.15rem; width: .15rem; height: 2.25rem; border-radius: 1.5px 0 0 1.5px; }
.iphone-btn-action      { top: 5rem;  left: -.18rem; width: .18rem; height: 1.6rem; border-radius: 1.5px 0 0 1.5px; background: linear-gradient(#5a554f, #3a3530 60%, #5a554f); }
.iphone-btn-power       { top: 7.5rem; right: -.15rem; width: .15rem; height: 3rem; border-radius: 0 1.5px 1.5px 0; }

.iphone-screen {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 2.55rem;
  background: #000;
  box-shadow: rgba(0, 0, 0, .6) 0 0 0 1px inset;
}
.iphone-screenshot { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* --- Nachgebauter WhatsApp-Chat (Dark Mode) --- */
.wa-chat {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  color: #e9edef;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", var(--font-body);
  font-size: 12.5px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  background-color: #0b141a;
  background-image:
    radial-gradient(rgba(255,255,255,.035) 1px, transparent 1.5px),
    radial-gradient(rgba(255,255,255,.025) 1px, transparent 1.5px);
  background-size: 18px 18px, 26px 26px;
  background-position: 0 0, 9px 13px;
}
.wa-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.05rem 1.35rem .35rem 1.5rem;
  background: #0b141a;
  font-size: 12.5px;
  font-weight: 600;
}
.wa-icons { display: inline-flex; align-items: center; gap: 4px; fill: #fff; }
.wa-batt { background: #34c759; color: #000; font-size: 8px; font-weight: 700; border-radius: 3px; padding: 1px 3px; line-height: 1.1; }

.wa-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: .45rem .7rem .55rem .5rem;
  background: #0b141a;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.wa-back { color: #e9edef; flex-shrink: 0; }
.wa-avatar {
  width: 24px; height: 24px; border-radius: 50%;
  background: #2a3942; color: #e9edef;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 8px; font-weight: 700; letter-spacing: .02em; flex-shrink: 0;
}
.wa-name { font-weight: 600; font-size: 12px; flex: 1; }
.wa-call { color: #e9edef; }

.wa-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 6px 8px;
  overflow: hidden;
}
.wa-msg {
  position: relative;
  max-width: 86%;
  padding: 5px 8px 16px;
  border-radius: 8px;
}
.wa-out { align-self: flex-end; background: #144d37; border-top-right-radius: 3px; }
.wa-in { align-self: flex-start; background: #202c33; border-top-left-radius: 3px; }
.wa-meta {
  position: absolute;
  right: 7px;
  bottom: 3px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 8.5px;
  color: rgba(233, 237, 239, .6);
}
.wa-img { padding: 3px; width: 72%; }
.wa-photo {
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 6px;
  background:
    url("assets/chat-foto.jpg") center / cover no-repeat,
    linear-gradient(160deg, #8b8f94 0%, #5b6066 45%, #2e3236 100%);
}
.wa-meta--img { right: 9px; bottom: 7px; color: #fff; text-shadow: 0 0 4px rgba(0,0,0,.6); }

.wa-unread {
  align-self: stretch;
  margin: 8px -8px 6px;
  padding: 5px 0;
  text-align: center;
  font-size: 10.5px;
  font-weight: 500;
  color: #e9edef;
  background: rgba(17, 27, 33, .85);
}

.wa-input {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 10px 22px;
  background: #0b141a;
  color: #e9edef;
}
.wa-plus { font-size: 20px; font-weight: 300; line-height: 1; }
.wa-field { flex: 1; height: 24px; border-radius: 14px; background: #202c33; }

/* =========================================================
   SECTION: LEISTUNGEN
   ========================================================= */
/* Große dunkle Kachel */
.feature-wrap { margin-bottom: 1.25rem; }
.tile-dark { background: var(--color-ink); color: #fff; }
.tile-dark .tile-eyebrow { color: var(--color-gold-soft); }
.tile-dark .tile-title { color: #fff; }
.tile-dark .tile-body { color: rgba(255, 255, 255, .72); }

.feature-tile { min-height: 24rem; justify-content: flex-end; }
@media (min-width: 768px) { .feature-tile { min-height: 32rem; } }
.feature-tile__img {
  position: absolute; inset: 0;
  background-position: center; background-size: cover; background-repeat: no-repeat;
  opacity: .5;
}
.feature-tile__shade {
  position: absolute; inset: 0;
  background: linear-gradient(to top, var(--color-ink), rgba(29, 29, 31, .7), transparent);
}
.feature-tile__content { position: relative; z-index: 10; }
.feature-tile__title { max-width: 42rem; }
.feature-tile__text { margin-top: .75rem; max-width: 36rem; }

/* Grid mit Bild-Kacheln */
.svc-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.25rem;
  perspective: 1200px;
}
@media (min-width: 768px) { .svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .svc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.svc-card { min-height: 20rem; padding: 0 !important; flex-direction: column; overflow: hidden; }
@media (min-width: 768px) { .svc-card { min-height: 24rem; } }

.svc-card__img { position: relative; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; }
.service-tile-photo {
  position: absolute; inset: 0;
  background-position: center; background-size: cover; background-repeat: no-repeat;
  filter: contrast(1.08) saturate(1.05) brightness(1.02);
  transition: transform .6s var(--ease-out-expo), filter .4s var(--ease-out-expo);
}
.service-tile-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(rgba(0,0,0,0) 60%, rgba(0,0,0,.06)), radial-gradient(at 30% 30%, rgba(255,220,170,.07), transparent 60%);
  mix-blend-mode: multiply;
  transition: opacity .4s var(--ease-out-expo);
}
.service-tile:hover .service-tile-photo { transform: scale(1.04); filter: contrast(1.1) saturate(1.12) brightness(1.04); }

.svc-card__body { display: flex; flex-direction: column; flex: 1 1 0%; justify-content: flex-end; padding: 1.5rem; }
@media (min-width: 768px) { .svc-card__body { padding: 1.75rem; } }

/* =========================================================
   SECTION: KENNZAHLEN
   ========================================================= */
.section--dark { background: var(--color-ink); color: #fff; }
.stats-head { max-width: 48rem; margin: 0 auto 4rem; text-align: center; }
@media (min-width: 768px) { .stats-head { margin-bottom: 5rem; } }
.stats-eyebrow { color: var(--color-gold-soft); }
.stats-title { color: #fff; }

.stats {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 3rem;
}
@media (min-width: 768px) { .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }

.stat { text-align: center; }
.stat-number {
  font-family: var(--font-display);
  font-size: clamp(3rem, 7vw, 5.5rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.045em;
  color: #fff;
  margin-bottom: .75rem;
}
.stat-label {
  max-width: 18rem;
  margin-inline: auto;
  color: rgba(255, 255, 255, .6);
  font-size: var(--text-base);
  line-height: 1.375;
}

/* --- Google-Badge (Größe L) + Kundenstimme --- */
.stats { margin-bottom: 4rem; }
@media (min-width: 768px) { .stats { margin-bottom: 5rem; } }

.quote-row {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2.5rem;
  align-items: center;
  max-width: 56rem;
  margin-inline: auto;
}
@media (min-width: 768px) { .quote-row { grid-template-columns: auto 1fr; gap: 3.5rem; } }
.quote-row__badge { display: flex; justify-content: center; }
@media (min-width: 768px) { .quote-row__badge { justify-content: flex-end; } }
.quote-row__text { text-align: center; }
@media (min-width: 768px) { .quote-row__text { text-align: left; } }

.google-badge.gb-lg { display: inline-flex; width: 8.5rem; height: 8.5rem; padding: 7px; }
.gb-lg .gb-inner { gap: .1rem; padding: .35rem; line-height: 1.1; }
.gb-lg .gb-eyebrow { font-size: .55rem; }
.gb-lg .gb-google { font-size: 1.2rem; }
.gb-lg .gb-cat { font-size: .5rem; }
.gb-lg .gb-score { font-size: .85rem; }
.gb-lg .gb-stars svg { width: 10px; height: 10px; }
@media (min-width: 768px) {
  .google-badge.gb-lg { width: 14rem; height: 14rem; padding: 12px; }
  .gb-lg .gb-inner { gap: .25rem; padding: .5rem; line-height: 1.15; }
  .gb-lg .gb-eyebrow { font-size: .95rem; }
  .gb-lg .gb-google { font-size: 1.95rem; }
  .gb-lg .gb-cat { font-size: .85rem; }
  .gb-lg .gb-score { font-size: 1.4rem; }
  .gb-lg .gb-stars svg { width: 18px; height: 18px; }
}

.quote {
  font-family: var(--font-body);
  font-size: clamp(1.25rem, 1.1rem + .7vw, 1.5rem);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.025em;
  color: #fff;
  margin-bottom: 1rem;
}
@media (min-width: 768px) { .quote { font-size: var(--text-2xl); } }
.quote-cite { color: rgba(255, 255, 255, .5); font-size: var(--text-sm); }

/* =========================================================
   SECTION: GOOGLE-BEWERTUNGEN (Laufband)
   Werte wie Vorlage, Karten bewusst größer + langsamer
   ========================================================= */
.reviews-section { padding-bottom: 0; }
.reviews-head { max-width: 48rem; margin: 0 auto 3rem; padding-inline: 1.25rem; text-align: center; }
@media (min-width: 768px) { .reviews-head { margin-bottom: 4rem; } }
.reviews-sub {
  max-width: 42rem;
  margin: 1.5rem auto 0;
  color: var(--color-ink-soft);
  font-size: var(--text-lg);
  line-height: 1.625;
}

.reviews-marquee {
  overflow: hidden;
  padding-block: 1rem;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 5%, #000 95%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 5%, #000 95%, transparent 100%);
  transform: translateZ(0);
}
.reviews-track {
  display: flex;
  gap: 1.5rem;
  width: max-content;
  will-change: transform;
  backface-visibility: hidden;
}
.reviews-marquee.is-looped .reviews-track { animation: review-scroll var(--reviews-duration, 140s) linear infinite; }
.reviews-marquee:hover .reviews-track,
.reviews-marquee:focus-within .reviews-track { animation-play-state: paused; }
@keyframes review-scroll {
  from { transform: translateZ(0); }
  to { transform: translate3d(-50%, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .reviews-marquee { -webkit-mask-image: none; mask-image: none; overflow-x: auto; }
  .reviews-marquee.is-looped .reviews-track { animation: none; }
}
/* Bewegung per JavaScript: seitlich ziehen und wischen, senkrecht scrollt die Seite normal weiter */
.reviews-marquee.is-js { touch-action: pan-y; cursor: grab; -webkit-user-select: none; user-select: none; }
.reviews-marquee.is-js .reviews-track { animation: none; }
.reviews-marquee.is-dragging { cursor: grabbing; }
.reviews-marquee.is-dragging .review-card { pointer-events: none; }

.review-card {
  flex: 0 0 26rem;
  display: flex;
  flex-direction: column;
  gap: .9rem;
  padding: 1.75rem;
  background: #fff;
  border: 1px solid var(--color-line-soft);
  border-radius: 1.25rem;
  box-shadow: rgba(0, 0, 0, .03) 0 1px 2px, rgba(0, 0, 0, .08) 0 8px 24px -16px;
}
@media (max-width: 640px) { .review-card { flex: 0 0 20rem; padding: 1.4rem; } }

.review-header { display: flex; align-items: center; gap: .85rem; }
.review-avatar {
  width: 3rem; height: 3rem; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  color: #fff; font-family: var(--font-display); font-weight: 600; font-size: 1.25rem;
}
.review-meta { flex: 1 1 0%; min-width: 0; }
.review-name { font-family: var(--font-display); font-weight: 600; font-size: 1.1rem; color: var(--color-ink); letter-spacing: -0.015em; line-height: 1.2; }
.review-time { font-family: var(--font-body); color: var(--color-ink-muted); font-size: .9rem; margin-top: .1rem; }
.review-google { flex-shrink: 0; opacity: .7; }
.review-stars { display: flex; gap: 2px; }
.review-text {
  font-family: var(--font-body);
  color: var(--color-ink-soft);
  font-size: 1.05rem;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* =========================================================
   SECTION: KOSTEN / § 249 BGB
   ========================================================= */
.cost-head { max-width: 48rem; margin: 0 auto 3.5rem; text-align: center; }
@media (min-width: 768px) { .cost-head { margin-bottom: 5rem; } }
.cost-sub {
  max-width: 42rem;
  margin: 1.5rem auto 0;
  color: var(--color-ink-soft);
  font-size: var(--text-lg);
  line-height: 1.625;
}

.cost-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.25rem;
  perspective: 1200px;
}
@media (min-width: 768px) { .cost-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.cost-tile { min-height: 26rem; }
.cost-tile--list { justify-content: flex-start; }
.cost-tile--zero { justify-content: flex-end; }

.claims { list-style: none; margin-top: .5rem; display: flex; flex-direction: column; gap: 1rem; }
.claims li {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  color: var(--color-ink-soft);
  font-size: var(--text-base);
}
.claims__check { flex-shrink: 0; margin-top: .125rem; }

.cost-zero {
  font-family: var(--font-body);
  font-size: var(--text-hero);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.05em;
  color: rgba(255, 255, 255, .7);
  margin-bottom: .5rem;
}
.cost-zero__text { margin-top: .75rem; margin-bottom: 1.5rem; max-width: 28rem; }
.cost-zero__btn { width: fit-content; }

/* =========================================================
   SECTION: FAQ
   ========================================================= */
.faq-inner { max-width: 56rem; }
.faq-head { text-align: center; margin-bottom: 3rem; }

details { border-bottom: 1px solid var(--color-line); }
details summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.5rem 0;
  list-style: none;
  cursor: pointer;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-lg);
  letter-spacing: -0.015em;
  color: var(--color-ink);
  transition: color .2s var(--ease-out-expo);
}
details summary:hover { color: var(--color-ink-soft); }
details summary::-webkit-details-marker { display: none; }
details summary::after {
  content: "+";
  flex-shrink: 0;
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--color-ink-muted);
  transition: transform .3s var(--ease-out-expo);
}
details[open] summary::after { transform: rotate(45deg); }
details .faq-content {
  color: var(--color-ink-soft);
  font-size: var(--text-base);
  line-height: 1.6;
  padding-bottom: 1.5rem;
}

.faq-cta { margin-top: 2.5rem; text-align: center; }
.btn-outline { color: var(--color-ink); border: 1px solid var(--color-line); background: transparent; }
.btn-outline:hover { border-color: var(--color-ink); background: var(--color-ink); color: #fff; }

/* =========================================================
   SECTION: KONTAKT
   ========================================================= */
.contact { position: relative; overflow: hidden; background: var(--color-ink); color: #fff; }
.contact__bg {
  position: absolute; inset: 0;
  /* Optional: eigenes Foto (z. B. assets/kontakt.jpg) hier als background-image eintragen */
  background: none;
  opacity: .25;
  mix-blend-mode: luminosity;
}
.contact__shade {
  position: absolute; inset: 0;
  background: linear-gradient(to top, var(--color-ink), rgba(29, 29, 31, .85), rgba(29, 29, 31, .7));
}
.contact__inner { position: relative; z-index: 10; max-width: 56rem; text-align: center; }
.contact__eyebrow { color: var(--color-gold-soft); margin-bottom: 1.25rem; }
.contact__title { color: #fff; margin-bottom: 1.5rem; }
.contact__text {
  max-width: 36rem;
  margin: 0 auto 2.5rem;
  color: rgba(255, 255, 255, .65);
  font-size: var(--text-lg);
  line-height: 1.625;
}
.contact__buttons {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  justify-content: center;
  margin-bottom: 2.5rem;
}
@media (min-width: 640px) { .contact__buttons { flex-direction: row; } }
.contact__meta { color: #fff; font-size: var(--text-sm); }

/* =========================================================
   FOOTER
   ========================================================= */
.footer {
  background: var(--color-bg-warm);
  color: var(--color-ink-soft);
  border-top: 1px solid var(--color-line-soft);
}
.footer__inner { padding: 3.5rem 1.25rem; }
@media (min-width: 768px) { .footer__inner { padding: 5rem 2rem; } }

.footer__grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2.5rem;
}
@media (min-width: 768px) {
  .footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4rem; }
  .footer__brand { grid-column: span 2 / span 2; }
}

.footer__logo { display: inline-block; margin-bottom: 1rem; }
.footer__logo-img { height: 48px; width: auto; }
@media (min-width: 768px) {
  .footer__logo { height: 48px; }
  .footer__logo .logo__main { font-size: 26px; }
  .footer__logo .logo__top, .footer__logo .logo__sub { font-size: 8px; }
}
.footer__logo .logo__top, .footer__logo .logo__sub { align-self: center; }

.footer__about { max-width: 28rem; font-size: var(--text-sm); line-height: 1.625; }

.footer__social { display: flex; align-items: center; gap: .75rem; margin-top: 1.5rem; }
.social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 9999px;
  border: 1px solid var(--color-line);
  color: var(--color-ink-soft);
  transition: color .15s, border-color .15s;
}
.social-btn:hover { color: var(--color-ink); border-color: var(--color-ink); }

.footer__head {
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: -0.025em;
  color: var(--color-ink);
  margin-bottom: 1rem;
}
.footer__list { list-style: none; font-size: var(--text-sm); display: flex; flex-direction: column; gap: .5rem; }
.footer__list a, .footer__legal a { transition: color .15s; }
.footer__list a:hover, .footer__legal a:hover { color: var(--color-ink); }

.footer__bottom {
  margin-top: 3.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-line-soft);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  color: var(--color-ink-muted);
  font-size: clamp(.75rem, .7rem + .2vw, .8125rem);
}
@media (min-width: 768px) { .footer__bottom { flex-direction: row; } }
.footer__legal { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; }

/* =========================================================
   UNTERSEITE: FAQ
   ========================================================= */
.page-hero { position: relative; overflow: hidden; background: #fff; }
.hero-glow {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(at 50% 0, rgba(184, 145, 46, .08), rgba(0, 0, 0, 0) 60%);
}
.page-hero__inner { position: relative; padding: 4rem 1.25rem 3rem; text-align: center; }
@media (min-width: 768px) { .page-hero__inner { padding: 6rem 2rem 4rem; } }
.page-hero__eyebrow { margin-bottom: 1.25rem; }

.hero-title {
  font-family: var(--font-display);
  font-size: var(--text-hero);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.05em;
  background: linear-gradient(#1d1d1f, #424245);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: -0.14em;
  padding-bottom: 0.14em;
}
.page-hero__title { max-width: 56rem; margin-inline: auto; }
.page-hero__text {
  max-width: 42rem;
  margin: 1.75rem auto 0;
  color: var(--color-ink-soft);
  font-size: clamp(1.25rem, 1.1rem + .7vw, 1.5rem);
  line-height: 1.625;
}

.faq-cat__title {
  font-family: var(--font-display);
  font-size: var(--text-4xl);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--color-ink);
  margin-bottom: 2rem;
}
.faq-cat--next { margin-top: 4rem; }
@media (min-width: 768px) { .faq-cat--next { margin-top: 6rem; } }

/* =========================================================
   UNTERSEITE: KONTAKT (Kacheln + Formular)
   ========================================================= */
.kc-grid { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 1.25rem; }
.kc-grid--2 { margin-bottom: 1.25rem; }
.kc-grid--3 { margin-bottom: 3rem; }
@media (min-width: 768px) {
  .kc-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.kc-tile { justify-content: flex-end; }
.kc-tile--lg { min-height: 12rem; transition: transform .15s ease; }
.kc-tile--lg:hover { transform: translateY(-.125rem); }
.kc-tile--sm { min-height: 10rem; }

.kc-big {
  font-family: var(--font-body);
  font-size: var(--text-3xl);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.035em;
}
.tile-dark .kc-big { color: rgba(255, 255, 255, .7); }
.kc-body { margin-top: .5rem; }

.kc-tile--wa { background: var(--color-whatsapp); }
.kc-tile--wa .tile-eyebrow { color: rgba(255, 255, 255, .8); }
.kc-tile--wa .kc-big { color: #fff; }
.kc-tile--wa .tile-body { color: rgba(255, 255, 255, .85); }

.kc-mid {
  font-family: var(--font-body);
  font-size: var(--text-2xl);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.025em;
  color: var(--color-ink);
}
.kc-mail {
  font-family: var(--font-body);
  font-size: clamp(1.25rem, 1.1rem + .7vw, 1.5rem);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--color-ink);
  word-break: break-all;
}
.kc-body--sm { margin-top: .25rem; }

/* Formular */
.kf-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 3rem;
  align-items: start;
  margin-top: 4rem;
}
@media (min-width: 768px) { .kf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4rem; margin-top: 6rem; } }
.kf-lead { margin-top: 1.5rem; max-width: 28rem; color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }

.kf-form { display: flex; flex-direction: column; gap: 1.25rem; }
.kf-label {
  display: block;
  margin-bottom: .5rem;
  font-size: var(--text-sm);
  font-weight: 500;
  letter-spacing: -0.025em;
  color: var(--color-ink);
}
.kf-req { color: var(--color-ink-muted); }
.kf-row { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 1rem; }
@media (min-width: 768px) { .kf-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.input, .textarea {
  width: 100%;
  padding: .875rem 1.125rem;
  border: 1px solid var(--color-line);
  border-radius: .875rem;
  background: #fff;
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.5;
  transition: border-color .2s var(--ease-out-expo), box-shadow .2s var(--ease-out-expo);
}
.textarea { resize: vertical; }
.input::placeholder, .textarea::placeholder { color: var(--color-ink-muted); opacity: 1; }
.input:focus, .textarea:focus { border-color: var(--color-ink); outline: none; box-shadow: rgba(29, 29, 31, .08) 0 0 0 4px; }

.kf-hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.kf-consent { display: flex; align-items: flex-start; gap: .75rem; padding-top: .5rem; }
.kf-consent input { margin-top: .25rem; width: 1rem; height: 1rem; flex-shrink: 0; accent-color: var(--color-ink); }
.kf-consent label { font-size: var(--text-sm); color: var(--color-ink-soft); line-height: 1.625; }
.kf-consent a { text-decoration: underline; color: var(--color-ink); }

.kf-submit { width: 100%; border: 0; }
.kf-status { font-size: var(--text-sm); margin-top: -0.5rem; min-height: 1px; }
.kf-status.is-error { color: #dc2626; }
.kf-status.is-ok { color: #15803d; }

/* =========================================================
   UNTERSEITE: ÜBER UNS
   ========================================================= */
.au-profile { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 2.5rem; align-items: center; }
@media (min-width: 768px) { .au-profile { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4rem; } }
.au-photo {
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 1.75rem;
  box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .2);
  background:
    url("assets/hero-fallback.svg") 70% center / cover no-repeat,
    #8d9196;
}
@media (min-width: 768px) { .au-photo { border-radius: 2.25rem; } }
.au-profile__title { margin-bottom: 1.5rem; }
.au-profile__text { display: flex; flex-direction: column; gap: 1.25rem; color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }

.au-head { max-width: 48rem; margin: 0 auto 3.5rem; text-align: center; }
@media (min-width: 768px) { .au-head { margin-bottom: 5rem; } }
.au-tile { min-height: 14rem; justify-content: flex-end; }
.au-tile__body { margin-top: .5rem; }

.wa-avatar--logo { background: #fff; overflow: hidden; }
.wa-avatar--logo img { width: 100%; height: 100%; display: block; }

/* =========================================================
   UNTERSEITE: EINZUGSGEBIET
   ========================================================= */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.text-link { color: var(--color-ink); text-decoration: underline; text-underline-offset: 2px; }
.ez-head { max-width: 42rem; margin: 0 auto 2.5rem; text-align: center; }
.ez-lead { margin-top: 1.5rem; color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }
.ez-grid { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 768px) { .ez-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ez-tile { min-height: 6rem; justify-content: center; align-items: center; text-align: center; }
.ez-tile__name { font-family: var(--font-display); font-size: var(--text-base); font-weight: 600; letter-spacing: -0.025em; color: var(--color-ink); }
a.ez-tile { transition: transform .15s ease; }
a.ez-tile:hover { transform: translateY(-.125rem); }
.ez-search { max-width: 42rem; margin: 0 auto 1.5rem; }
.ez-count { margin-top: .5rem; font-size: clamp(.75rem, .7rem + .2vw, .8125rem); color: var(--color-ink-muted); }
.ez-list { max-width: 42rem; margin-inline: auto; border-radius: 1.75rem; border: 1px solid var(--color-line-soft); background: #fff; overflow: hidden; }
.ez-scroll { max-height: 24rem; overflow-y: auto; }
.ez-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--color-line-soft); }
.ez-row:last-child { border-bottom: 0; }
.ez-row__name { font-size: var(--text-sm); color: var(--color-ink); }
.ez-row__meta { font-size: clamp(.75rem, .7rem + .2vw, .8125rem); color: var(--color-ink-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* .ez-faq: normaler Abstand oben (Abschnitt davor ist weiß, FAQ grau) */
@media (min-width: 768px) { .page-hero--ez .page-hero__inner { padding-top: 8rem; } }
.page-hero--ez .page-hero__title { line-height: 1.15; margin-bottom: 0; padding-bottom: .08em; }


/* =========================================================
   UNTERSEITE: IMPRESSUM / RECHTLICHES
   ========================================================= */
.page-hero--legal .page-hero__inner { padding-bottom: 2.5rem; }
@media (min-width: 768px) { .page-hero--legal .page-hero__inner { padding-bottom: 3rem; } }
.page-hero--legal .page-hero__title { max-width: 48rem; }
.section-narrow { max-width: 56rem; margin-inline: auto; }
.prose-block h2 { font-size: var(--text-2xl); font-weight: 600; line-height: 1.05; letter-spacing: -0.025em; margin-bottom: .75rem; color: var(--color-ink); }
.prose-block h3 { font-size: var(--text-xl); font-weight: 600; line-height: 1.05; letter-spacing: -0.015em; margin-top: 2rem; margin-bottom: .5rem; color: var(--color-ink); }
.prose-block p { color: var(--color-ink-soft); line-height: 1.65; margin-bottom: 1rem; font-size: var(--text-base); }
.prose-block a { color: var(--color-ink); text-decoration: underline; }
.prose-block a:hover { color: var(--color-ink-soft); }

/* Datenschutz */
.prose-block--ds h2 { margin-top: 2.5rem; }
.prose-block--ds h2:first-child { margin-top: 0; }
.prose-block--ds h3 { margin-top: 1.5rem; }
.prose-block ul { color: var(--color-ink-soft); line-height: 1.65; margin-bottom: 1rem; font-size: var(--text-base); list-style: disc; padding-left: 1.5rem; }
.prose-block li { margin-bottom: .4rem; }
.prose-block strong { font-weight: 700; }
.prose-block code { background: var(--color-bg-warm); padding: .1rem .4rem; border-radius: .25rem; font-size: .9em; }
/* Langes Wort im Titel: auf schmalen Bildschirmen verkleinern, damit nichts abgeschnitten wird */
.page-hero--ds .page-hero__title { font-size: min(var(--text-hero), 9.2vw); max-width: none; }


/* =========================================================
   COOKIE-BANNER (nur aktiv mit Google Ads, siehe script.js)
   ========================================================= */
.cookie-banner {
  position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 60;
  background: rgba(255, 255, 255, .96);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid var(--color-line);
  border-radius: 1.25rem;
  padding: 1.25rem;
  box-shadow: rgba(0, 0, 0, .25) 0 30px 80px -30px;
  animation: cookie-slide .5s var(--ease-out-expo) both;
}
.cookie-banner[hidden], [data-cookie-reset][hidden] { display: none; }
@media (min-width: 768px) {
  .cookie-banner { left: auto; right: 1.5rem; bottom: 1.5rem; max-width: 32rem; padding: 1.5rem; }
}
@keyframes cookie-slide { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .cookie-banner { animation: none; } }
.cookie-inner { display: flex; flex-direction: column; gap: 1rem; }
.cookie-title { font-family: var(--font-display); font-weight: 600; font-size: var(--text-lg); line-height: 1.5; letter-spacing: -0.015em; color: var(--color-ink); margin-bottom: .5rem; }
.cookie-body { color: var(--color-ink-soft); font-size: var(--text-sm); line-height: 1.55; }
.cookie-body a { color: var(--color-ink); text-decoration: underline; }
.cookie-actions { display: flex; gap: .625rem; }
.cookie-actions .btn { flex: 1 1 0%; font-size: var(--text-sm); padding: .75rem 1.25rem; min-height: 44px; }


/* =========================================================
   EINBLICKE IN UNSERE GUTACHTEN (Foto-Galerie)
   ========================================================= */
.insights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 1024px) { .insights { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
.insight { position: relative; margin: 0; overflow: hidden; border-radius: 1.5rem; aspect-ratio: 4 / 5; background: var(--color-line-soft); isolation: isolate; }
.insight img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out-expo); }
.insight:hover img { transform: scale(1.04); }
.insight::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(to top, rgba(16, 22, 30, .72) 0%, rgba(16, 22, 30, .25) 38%, rgba(16, 22, 30, 0) 60%); }
.insight__cap { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: flex; flex-direction: column; gap: .2rem; padding: 1rem 1.1rem; color: #fff; }
@media (min-width: 768px) { .insight__cap { padding: 1.4rem 1.5rem; } }
.insight__title { font-family: var(--font-display); font-weight: 600; font-size: var(--text-lg); letter-spacing: -0.015em; line-height: 1.2; }
.insight__meta { font-size: var(--text-sm); color: rgba(255, 255, 255, .78); line-height: 1.4; }

.insight img { position: absolute; inset: 0; }
.insight--wide { grid-column: span 2; aspect-ratio: 8 / 5; }
@media (min-width: 1024px) { .insight--wide { aspect-ratio: auto; } }
.prose-block h2[id] { scroll-margin-top: calc(var(--header-h) + 1.5rem); }


/* =========================================================
   GROSSE KACHEL MIT PORTRÄT + ZITAT
   ========================================================= */
.feature-tile--person { --pad: clamp(1.75rem, 3vw, 2.75rem); padding: var(--pad); min-height: 0; justify-content: flex-start; background: radial-gradient(120% 90% at 85% 100%, #2c2c30 0%, var(--color-ink) 60%); }
.feature-tile__glow { position: absolute; right: -10%; bottom: -30%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(212, 167, 58, .22) 0%, rgba(212, 167, 58, 0) 65%); pointer-events: none; }
.feature-tile--person .feature-tile__content { position: relative; z-index: 2; }
.feature-tile--person .feature-tile__title { font-size: var(--text-3xl); line-height: 1.05; letter-spacing: -0.035em; }
.person-quote { margin: 2rem 0 0; padding-top: 1.75rem; border-top: 1px solid rgba(255, 255, 255, .14); }
.person-quote__mark { color: var(--color-gold-soft); margin-bottom: 1rem; }
.person-quote__text { margin: 0; font-family: var(--font-display); font-size: var(--text-lg); line-height: 1.45; letter-spacing: -0.01em; color: rgba(255, 255, 255, .92); max-width: 34rem; }
.person-quote__by { display: flex; flex-direction: column; gap: .15rem; margin-top: 1.25rem; }
.person-quote__name { font-weight: 600; color: #fff; font-size: var(--text-base); }
.person-quote__role { font-size: var(--text-sm); color: #fff; }
.feature-tile__person { position: relative; z-index: 1; margin: 2rem auto calc(-1 * var(--pad)); width: min(78%, 20rem); }
.feature-tile__person img { display: block; width: 100%; height: auto; }
@media (min-width: 900px) {
  .feature-tile--person { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); column-gap: 2rem; align-items: end; min-height: 34rem; padding-right: 0; }
  .feature-tile--person .feature-tile__content { align-self: center; padding-block: 1rem; }
  .feature-tile__person { margin: calc(-1 * var(--pad)) 0 calc(-1 * var(--pad)); width: 100%; max-width: 27rem; justify-self: center; align-self: end; padding-top: 2.5rem; }
}

/* Neues Logo (quadratisch) */
.logo, .logo__img { height: 60px; }
@media (min-width: 768px) { .logo, .logo__img { height: 76px; } }
.footer__logo, .footer__logo-img { height: 96px; }

/* =========================================================
   VERTRAUEN / NACHWEISE (Urkunden)
   ========================================================= */
.trust-head { margin-bottom: 3rem; }
@media (min-width: 768px) { .trust-head { margin-bottom: 4rem; } }
.trust-lead { margin: 1.5rem auto 0; max-width: 36rem; color: rgba(255, 255, 255, .62); font-size: var(--text-lg); line-height: 1.5; }

.trust-docs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 900px) { .trust-docs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; } }

.trust-doc {
  display: grid; grid-template-columns: 6.25rem minmax(0, 1fr); gap: 1.25rem; align-items: center;
  width: 100%; padding: 1.5rem; text-align: left; font: inherit; color: #fff; cursor: pointer;
  background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .09); border-radius: 1.5rem;
  transition: background .4s var(--ease-out-expo), border-color .4s var(--ease-out-expo), transform .4s var(--ease-out-expo), opacity .9s var(--ease-out-expo);
}
@media (min-width: 640px) { .trust-doc { grid-template-columns: 8.5rem minmax(0, 1fr); gap: 1.75rem; padding: 2rem; } }
.trust-doc:hover { background: rgba(255, 255, 255, .075); border-color: rgba(212, 167, 58, .35); }
.trust-doc:focus-visible { outline: 2px solid var(--color-gold-soft); outline-offset: 3px; }

.trust-doc__paper {
  display: block; padding: 4px; background: #fff; border-radius: 6px;
  box-shadow: rgba(0, 0, 0, .55) 0 22px 40px -14px, rgba(0, 0, 0, .25) 0 2px 6px;
  transform: rotate(-3deg); transition: transform .5s var(--ease-out-expo);
}
.trust-doc + .trust-doc .trust-doc__paper { transform: rotate(2.5deg); }
.trust-doc:hover .trust-doc__paper { transform: rotate(0) scale(1.04); }
.trust-doc__paper img { display: block; width: 100%; height: auto; aspect-ratio: 480 / 680; object-fit: cover; border-radius: 3px; }

.trust-doc__body { display: flex; flex-direction: column; min-width: 0; }
.trust-doc__eyebrow { font-size: var(--text-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--color-gold-soft); margin-bottom: .5rem; }
.trust-doc__title { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; }
.trust-doc__meta { margin-top: .45rem; font-size: var(--text-sm); line-height: 1.45; color: rgba(255, 255, 255, .55); }
.trust-doc__text { margin-top: .7rem; font-size: var(--text-sm); line-height: 1.55; color: rgba(255, 255, 255, .78); }
.trust-doc__link { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1rem; font-size: var(--text-sm); font-weight: 600; color: var(--color-gold-soft); }
.trust-doc:hover .trust-doc__link svg { transform: translateX(3px); }
.trust-doc__link svg { transition: transform .3s var(--ease-out-expo); }

/* helle Variante (Über uns) */
.trust-docs--light .trust-doc { color: var(--color-ink); background: #fff; border-color: var(--color-line-soft); }
.trust-docs--light .trust-doc:hover { border-color: var(--color-line); box-shadow: rgba(0, 0, 0, .12) 0 24px 50px -24px; }
.trust-docs--light .trust-doc__paper { box-shadow: rgba(0, 0, 0, .22) 0 16px 32px -14px, rgba(0, 0, 0, .08) 0 0 0 1px; }
.trust-docs--light .trust-doc__eyebrow, .trust-docs--light .trust-doc__link { color: var(--color-gold-deep); }
.trust-docs--light .trust-doc__meta { color: var(--color-ink-muted); }
.trust-docs--light .trust-doc__text { color: var(--color-ink-soft); }

/* Vertrauenspunkte */
.trust-points { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; margin-top: 3.5rem; padding-top: 3rem; border-top: 1px solid rgba(255, 255, 255, .12); }
@media (min-width: 768px) { .trust-points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; margin-top: 4.5rem; } }
.trust-point__icon { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; color: var(--color-gold-soft); background: rgba(212, 167, 58, .12); margin-bottom: 1rem; }
.trust-point__title { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 600; letter-spacing: -0.015em; color: #fff; margin-bottom: .4rem; }
.trust-point__text { font-size: var(--text-base); line-height: 1.5; color: rgba(255, 255, 255, .6); max-width: 22rem; }

/* Lightbox */
.doc-dialog { border: 0; padding: 0; background: transparent; max-width: min(92vw, 44rem); max-height: 94vh; overflow: visible; }
.doc-dialog::backdrop { background: rgba(10, 10, 12, .84); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.doc-dialog[open] { animation: cookie-slide .4s var(--ease-out-expo) both; }
.doc-dialog__figure { margin: 0; text-align: center; }
.doc-dialog__figure img { display: block; max-width: 100%; max-height: 84vh; width: auto; height: auto; margin: 0 auto; border-radius: 8px; box-shadow: rgba(0, 0, 0, .6) 0 30px 80px -20px; background: #fff; }
.doc-dialog__cap { margin-top: .9rem; color: rgba(255, 255, 255, .78); font-size: var(--text-sm); line-height: 1.4; }
.doc-dialog__close { position: fixed; top: 1rem; right: 1rem; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--color-ink); box-shadow: rgba(0, 0, 0, .3) 0 8px 24px -6px; }
.doc-dialog__close:hover { background: #f5f5f7; }

/* Datenschutz-Hinweis im Formular */
.kf-trust { display: flex; align-items: flex-start; gap: .6rem; margin: 0 0 1.25rem; padding: .85rem 1rem; border-radius: .9rem; background: var(--color-bg-warm); color: var(--color-ink-soft); font-size: var(--text-sm); line-height: 1.45; }
.kf-trust svg { flex: none; margin-top: .1rem; color: var(--color-gold-deep); }
.doc-dialog { position: fixed; inset: 0; margin: auto; height: fit-content; }
@media (max-width: 639px) {
  .trust-doc { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding: 1.5rem 1.5rem 1.75rem; }
  .trust-doc__paper { width: 8rem; margin: .5rem 0 0 .25rem; }
}
/* Vertrauenspunkte ohne Icons: feine Linie mit goldenem Akzent */
.trust-points { border-top: 0; padding-top: 0; }
.trust-point { position: relative; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, .14); }
.trust-point::before { content: ""; position: absolute; top: -1px; left: 0; width: 2.5rem; height: 2px; background: var(--color-gold-soft); }
/* Urkunden groß und gerade */
.trust-doc { grid-template-columns: minmax(0, 1fr) !important; justify-items: center; text-align: center; gap: 2rem !important; padding: clamp(1.75rem, 3.5vw, 3rem) !important; }
.trust-doc__paper, .trust-doc + .trust-doc .trust-doc__paper { width: 100%; max-width: 25rem; margin: 0 !important; padding: 6px; border-radius: 8px; transform: none; }
.trust-doc:hover .trust-doc__paper { transform: translateY(-4px); }
.trust-doc__paper img { aspect-ratio: 1055 / 1491; border-radius: 4px; }
.trust-doc__body { align-items: center; max-width: 30rem; }
.trust-doc { align-content: start; align-items: start; }

/* Ablauf: Nummer + Linien-Icon */
.step__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; padding-bottom: 1.25rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--color-line); }
.step__head .step__num { margin-bottom: 0; }
.step__icon { flex: none; width: clamp(2rem, 1.6rem + 1vw, 2.5rem); height: auto; color: var(--color-ink); margin-bottom: .2rem; }

/* Ablauf: Icon-Badge statt Nummern */
.step__badge {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 4rem; height: 4rem; margin: .75rem 0 2rem .75rem; border-radius: 1.15rem; color: #fff;
  background: linear-gradient(145deg, #dcb555 0%, #c49a34 45%, #9f7b24 100%);
  box-shadow: 0 0 0 .75rem rgba(212, 167, 58, .10), 0 18px 32px -14px rgba(139, 110, 34, .65), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.step__badge .step__icon { width: 1.9rem; height: 1.9rem; margin: 0; color: #fff; }
.step:hover .step__badge { transform: translateY(-2px); }
.step__badge { transition: transform .4s var(--ease-out-expo); }
.step__badge .step__icon { width: 2rem; height: 2rem; filter: drop-shadow(0 1px 1px rgba(110, 85, 20, .25)); }
/* Ablauf-Icons: seriös – dunkle Kachel, kein Ring, kein Gold-Verlauf */
.step__badge {
  width: 3.5rem; height: 3.5rem; margin: 0 0 1.75rem 0; border-radius: .875rem;
  background: linear-gradient(180deg, #2c2c2e 0%, #1d1d1f 100%);
  box-shadow: 0 12px 24px -14px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.step__badge .step__icon { width: 1.65rem; height: 1.65rem; filter: none; color: #fff; }
/* Ablauf-Icons: ruhiger und optisch ausgeglichen */
.step__badge { width: 3.25rem; height: 3.25rem; border-radius: .8rem; margin-bottom: 1.5rem; box-shadow: 0 10px 20px -14px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08); }
.step__badge .step__icon { width: 1.5rem; height: 1.5rem; }
/* Ablauf-Icons: schwarz, plastisch, ohne Kachel, mit Bodenschatten */
.step__badge {
  width: auto; height: auto; padding: 0 0 .9rem; margin: 0 0 1.25rem; border-radius: 0;
  background: none; box-shadow: none; display: inline-flex; flex-direction: column; align-items: center;
}
.step__badge .step__icon {
  width: 3rem; height: 3rem; color: #1d1d1f;
  filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9)) drop-shadow(0 6px 6px rgba(0, 0, 0, .22)) drop-shadow(0 14px 14px rgba(0, 0, 0, .10));
}
.step__badge::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 2.6rem; height: .55rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .28) 0%, rgba(0, 0, 0, .10) 45%, rgba(0, 0, 0, 0) 72%);
  filter: blur(1.5px); transition: transform .4s var(--ease-out-expo), opacity .4s var(--ease-out-expo);
}
.step:hover .step__badge { transform: none; }
.step__badge .step__icon { transition: transform .4s var(--ease-out-expo); }
.step:hover .step__badge .step__icon { transform: translateY(-3px); }
.step:hover .step__badge::after { transform: translateX(-50%) scale(.85); opacity: .75; }

/* Handy: WhatsApp-Button im Hero kompakt statt volle Breite */
@media (max-width: 767px) {
  .hero__buttons { justify-content: center; }
  .hero__buttons .btn-whatsapp { flex: 0 0 auto; min-width: 0; width: auto; min-height: 50px; padding: .8rem 1.75rem; font-size: var(--text-base); }
}

/* Urkunden: ohne Karten-Rahmen, nur das Dokument mit Schatten */
.trust-doc, .trust-docs--light .trust-doc { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0; }
.trust-doc:hover, .trust-docs--light .trust-doc:hover { background: none !important; box-shadow: none !important; }
.trust-docs { gap: 3.5rem 2.5rem; }
@media (min-width: 900px) { .trust-docs { gap: 4rem; } }
.trust-doc__paper { box-shadow: rgba(0, 0, 0, .6) 0 30px 60px -20px, rgba(0, 0, 0, .3) 0 4px 12px; }
.trust-docs--light .trust-doc__paper { box-shadow: rgba(0, 0, 0, .22) 0 28px 50px -22px, rgba(0, 0, 0, .08) 0 0 0 1px; }

/* Leistungs-Kacheln: in jeder Reihe gleich hoch */
.svc-grid { align-items: stretch; }
.svc-grid > div { display: flex; }
.svc-grid > div > .svc-card, .svc-grid > .tile { flex: 1 1 auto; width: 100%; height: 100%; }
.svc-card__body { justify-content: flex-start; }
.svc-grid { grid-auto-rows: 1fr; }
/* Ablauf-Icons: kein Schatten am Icon selbst, nur Bodenschatten darunter */
.step__badge .step__icon { filter: none !important; }
.step__badge { padding-bottom: 1rem; }
.step__badge::after { width: 2.8rem; height: .6rem; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .32) 0%, rgba(0, 0, 0, .12) 45%, rgba(0, 0, 0, 0) 72%); }

/* Vertrauen: reduziert – Urkunden im Fokus, kurze Beschriftung, Siegel-Leiste */
#vertrauen .trust-doc { gap: 1.5rem !important; }
#vertrauen .trust-doc__body { max-width: 24rem; }
#vertrauen .trust-doc__eyebrow { margin-bottom: .4rem; }
#vertrauen .trust-doc__meta { margin-top: .35rem; letter-spacing: .02em; }
.trust-doc__paper { position: relative; }
.trust-doc__zoom {
  position: absolute; right: .9rem; bottom: .9rem; z-index: 1; display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%; background: rgba(29, 29, 31, .82); color: #fff;
  opacity: 0; transform: scale(.9); transition: opacity .3s var(--ease-out-expo), transform .3s var(--ease-out-expo);
}
.trust-doc:hover .trust-doc__zoom, .trust-doc:focus-visible .trust-doc__zoom { opacity: 1; transform: scale(1); }
@media (hover: none) { .trust-doc__zoom { opacity: 1; transform: none; } }

.trust-seal {
  list-style: none; margin: 4.5rem 0 0; padding: 2rem 0 0; border-top: 1px solid rgba(255, 255, 255, .12);
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .75rem 2.25rem;
}
@media (min-width: 768px) { .trust-seal { margin-top: 6rem; } }
.trust-seal li {
  position: relative; font-family: var(--font-display); font-weight: 600; font-size: var(--text-lg);
  letter-spacing: -0.015em; color: #fff;
}
.trust-seal li + li::before {
  content: ""; position: absolute; left: -1.15rem; top: 50%; width: 5px; height: 5px; margin-top: -2.5px;
  border-radius: 50%; background: var(--color-gold-soft);
}
@media (max-width: 639px) {
  .trust-seal { flex-direction: column; gap: .9rem; }
  .trust-seal li + li::before { display: none; }
}
#vertrauen .trust-doc__body { max-width: 30rem; }

/* Siegel-Leiste mit plastischen Icons (Stil wie Ablauf, hier hell auf dunkel) */
.trust-seal--icons { gap: 2.5rem 4.5rem; align-items: flex-start; }
.trust-seal--icons li { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1rem; }
.trust-seal--icons li + li::before { display: none; }
.trust-seal__mark { position: relative; display: inline-flex; padding-bottom: .85rem; }
.trust-seal__icon { width: 2.6rem; height: 2.6rem; transition: transform .4s var(--ease-out-expo); }
.trust-seal__mark::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 2.4rem; height: .5rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .75) 0%, rgba(0, 0, 0, .3) 45%, rgba(0, 0, 0, 0) 72%);
  filter: blur(1.5px); transition: transform .4s var(--ease-out-expo), opacity .4s var(--ease-out-expo);
}
.trust-seal--icons li:hover .trust-seal__icon { transform: translateY(-3px); }
.trust-seal--icons li:hover .trust-seal__mark::after { transform: translateX(-50%) scale(.85); opacity: .75; }
@media (max-width: 639px) { .trust-seal--icons { flex-direction: row; justify-content: space-around; gap: 1.5rem .5rem; } .trust-seal--icons li { flex: 1 1 0; font-size: var(--text-base); } }

/* Vertrauens-Leiste: Gold-Linien-Icons, drei Spalten mit feinen Trennlinien */
.seal {
  list-style: none; margin: 4.5rem 0 0; padding: 0;
  display: grid; grid-template-columns: minmax(0, 1fr);
  border-top: 1px solid rgba(255, 255, 255, .12); border-bottom: 1px solid rgba(255, 255, 255, .12);
}
@media (min-width: 768px) { .seal { margin-top: 6rem; grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.seal__item { display: flex; align-items: center; gap: 1rem; padding: 1.5rem .25rem; }
.seal__item + .seal__item { border-top: 1px solid rgba(255, 255, 255, .08); }
@media (min-width: 768px) {
  .seal__item { justify-content: center; padding: 2rem 1.5rem; }
  .seal__item + .seal__item { border-top: 0; border-left: 1px solid rgba(255, 255, 255, .12); }
}
.seal__mark {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 3rem; height: 3rem; border-radius: 50%; border: 1px solid rgba(212, 167, 58, .45); color: var(--color-gold-soft);
}
.seal__icon { width: 1.5rem; height: 1.5rem; }
.seal__text { display: flex; flex-direction: column; gap: .15rem; text-align: left; }
.seal__title { font-family: var(--font-display); font-weight: 600; font-size: var(--text-lg); letter-spacing: -0.015em; color: #fff; line-height: 1.2; }
.seal__sub { font-size: var(--text-sm); color: rgba(255, 255, 255, .55); line-height: 1.4; }

/* Über uns: Porträt statt Platzhalter */
.au-photo--person { position: relative; overflow: hidden; background: radial-gradient(120% 90% at 70% 100%, #2c2c30 0%, var(--color-ink) 65%) !important; display: flex; align-items: flex-end; justify-content: center; }
.au-photo--person::before, .au-photo--person::after { display: none !important; }
.au-photo__glow { position: absolute; right: -15%; bottom: -25%; width: 80%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(212, 167, 58, .22) 0%, rgba(212, 167, 58, 0) 65%); pointer-events: none; }
.au-photo--person picture { position: relative; z-index: 1; display: block; width: 88%; margin-top: 8%; }
.au-photo--person img { display: block; width: 100%; height: auto; }
.au-photo__badge { position: absolute; left: 1.25rem; bottom: 1.25rem; z-index: 2; display: flex; flex-direction: column; gap: .1rem; padding: .75rem 1rem; border-radius: .9rem; background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 12px 28px -14px rgba(0, 0, 0, .5); }
.au-photo__name { font-family: var(--font-display); font-weight: 600; font-size: var(--text-base); color: var(--color-ink); letter-spacing: -0.01em; }
.au-photo__role { font-size: var(--text-sm); color: var(--color-ink-muted); }
.au-photo__glow { right: 0; bottom: 0; width: 75%; transform: translate(15%, 20%); } .au-photo--person { contain: paint; }
@media (max-width: 639px) { .section-title, .hero-title { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; } }
.au-tile { justify-content: flex-start !important; }

/* Über uns: Hero-Unterzeile, Icons in Kacheln, Nachweise kompakt */
.au-hero-sub { display: block; margin-top: .9rem; font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.6rem); line-height: 1.15; letter-spacing: -0.03em; font-weight: 600; padding-bottom: .1em; }
.au-tile__mark { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; margin-bottom: 1.5rem; border-radius: 50%; border: 1px solid rgba(184, 145, 46, .45); color: var(--color-gold-deep); }
.au-tile__icon { width: 1.5rem; height: 1.5rem; }
.au-nachweise .trust-doc { gap: 1.5rem !important; }
.au-nachweise .trust-doc__body { max-width: 28rem; }

/* Über uns Kacheln: gefüllte 3D-Icons, kein Kreis, dezenter Bodenschatten */
.au-tile__mark {
  position: relative; width: auto; height: auto; border: 0; border-radius: 0; background: none;
  padding-bottom: .7rem; margin-bottom: 1.25rem; align-self: flex-start;
}
.au-tile__icon { width: 2.5rem; height: 2.5rem; display: block; transition: transform .4s var(--ease-out-expo); }
.au-tile__mark::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 2rem; height: .38rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .08) 45%, rgba(0, 0, 0, 0) 72%);
  filter: blur(1px); transition: transform .4s var(--ease-out-expo), opacity .4s var(--ease-out-expo);
}
.au-tile:hover .au-tile__icon { transform: translateY(-2px); }
.au-tile:hover .au-tile__mark::after { transform: translateX(-50%) scale(.85); opacity: .8; }

/* Über uns: Nachweis-Beschriftung einheitlich */
.au-nachweise .trust-doc__body { display: grid; grid-template-rows: auto auto minmax(2.9em, auto) auto auto; justify-items: center; }
.au-nachweise .trust-doc__title { white-space: nowrap; }
.au-nachweise .trust-doc__meta { max-width: 22rem; }
.trust-doc__rule { display: block; width: 2.5rem; height: 2px; margin: 1rem auto .9rem; background: var(--color-gold-soft); border-radius: 2px; }
@media (max-width: 639px) { .au-nachweise .trust-doc__title { white-space: normal; } .au-nachweise .trust-doc__body { grid-template-rows: none; } }

/* Über uns Kacheln: keine Bewegungs-Effekte */
.au-tile, .au-tile:hover { transform: none !important; box-shadow: none !important; }
.au-tile:hover .au-tile__icon { transform: none; }
.au-tile:hover .au-tile__mark::after { transform: translateX(-50%); opacity: 1; }
.au-nachweise .trust-doc__body { display: flex; grid-template-rows: none; } .au-nachweise .trust-doc__meta { line-height: 1.45; min-height: 2.9em; } @media (max-width: 639px) { .au-nachweise .trust-doc__meta { min-height: 0; } }

/* =========================================================
   ÜBER UNS – HERO: Text links, Google-Bewertungs-Illustration rechts
   ========================================================= */
.au-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: center; }
@media (min-width: 1024px) {
  .au-hero__inner { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 4rem; text-align: left; padding-bottom: 6rem; }
  .au-hero .page-hero__title { margin-inline: 0; max-width: none; }
  .au-hero .page-hero__text { margin-left: 0; margin-right: 0; }
}
.au-hero__art { display: flex; justify-content: center; }
.rv-stack { position: relative; width: min(100%, 27rem); height: 22rem; }
@media (min-width: 640px) { .rv-stack { height: 24rem; } }

.rv-card {
  position: absolute; width: 82%; padding: 1.1rem 1.25rem 1.2rem; border-radius: 1.1rem; text-align: left;
  background: linear-gradient(180deg, #ffffff 0%, #f7f7f9 100%);
  border: 1px solid rgba(29, 29, 31, .06);
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(0, 0, 0, .04), 0 18px 34px -18px rgba(29, 29, 31, .35), 0 30px 60px -30px rgba(139, 110, 34, .35);
}
.rv-card--1 { top: 0; left: 0; transform: rotate(-4deg); z-index: 1; }
.rv-card--2 { top: 6.6rem; right: 0; transform: rotate(3deg); z-index: 2; }
.rv-card--3 { top: 13.2rem; left: 6%; transform: rotate(-1.5deg); z-index: 3; }
@media (min-width: 640px) { .rv-card--2 { top: 7.2rem; } .rv-card--3 { top: 14.4rem; } }

.rv-card__head { display: flex; align-items: center; gap: .7rem; margin-bottom: .6rem; }
.rv-card__avatar {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%;
  font-weight: 600; font-size: .95rem; color: #fff; background: linear-gradient(180deg, #e2bc5c 0%, #b8912e 55%, #8b6e22 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}
.rv-card__who { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.25; }
.rv-card__name { font-weight: 600; font-size: .95rem; color: var(--color-ink); }
.rv-card__when { font-size: .78rem; color: var(--color-ink-muted); }
.rv-card__g { flex: none; }
.rv-card__stars { display: flex; gap: 2px; margin-bottom: .45rem; }
.rv-card__text { font-size: .9rem; line-height: 1.5; color: var(--color-ink-soft); }

.rv-stack__shadow {
  position: absolute; left: 50%; bottom: -1.5rem; width: 70%; height: 1.4rem; transform: translateX(-50%); z-index: 0;
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .2) 0%, rgba(0, 0, 0, .07) 45%, rgba(0, 0, 0, 0) 72%);
  filter: blur(3px);
}
/* Bewertungs-Stapel: mehr Abstand, Text jeder Karte lesbar */
.rv-stack { height: 27rem; }
.rv-card { width: 80%; }
.rv-card--2 { top: 8.6rem; }
.rv-card--3 { top: 17.2rem; }
@media (min-width: 640px) { .rv-stack { height: 28.5rem; } .rv-card--2 { top: 9rem; } .rv-card--3 { top: 18rem; } }
@media (min-width: 1024px) { .au-hero-sub { font-size: clamp(1.6rem, .9rem + 1.1vw, 2.15rem); white-space: nowrap; } }

/* Bewertungs-Wand: symmetrisch, 3D-Perspektive */
.rv-wall {
  position: relative; width: 100%; max-width: 40rem; aspect-ratio: 1 / 1; perspective: 1400px;
  -webkit-mask-image: radial-gradient(ellipse 62% 62% at 50% 50%, #000 55%, transparent 100%);
  mask-image: radial-gradient(ellipse 62% 62% at 50% 50%, #000 55%, transparent 100%);
}
.rv-grid {
  position: absolute; left: 50%; top: 50%; width: 150%;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem;
  transform-style: preserve-3d;
  transform: translate(-50%, -50%) rotateX(24deg) rotateY(-16deg) rotateZ(6deg);
}
.rv-grid .rv-card {
  position: relative; inset: auto; width: auto; transform: translateZ(0);
  box-shadow: inset 0 1px 0 #fff, 0 2px 3px rgba(0, 0, 0, .04), 0 26px 30px -22px rgba(29, 29, 31, .45), 0 44px 60px -36px rgba(139, 110, 34, .45);
}
.rv-grid .rv-card:nth-child(2n) { transform: translateZ(28px); }
.rv-grid .rv-card--hero {
  transform: translateZ(90px) scale(1.06);
  box-shadow: inset 0 1px 0 #fff, 0 2px 4px rgba(0, 0, 0, .05), 0 40px 46px -28px rgba(29, 29, 31, .55), 0 70px 90px -50px rgba(139, 110, 34, .6);
}
.rv-grid .rv-card__text { font-size: .85rem; }
@media (max-width: 1023px) { .rv-wall { max-width: 34rem; margin-inline: auto; } }
@media (max-width: 639px) { .rv-grid { width: 190%; gap: 1rem; } .rv-wall { aspect-ratio: 1 / 1.05; } }
/* Bewertungs-Wand v2: spiegelsymmetrisch, weiche Ränder */
.rv-wall {
  -webkit-mask-image: radial-gradient(closest-side at 50% 50%, #000 62%, rgba(0,0,0,.6) 80%, transparent 100%);
  mask-image: radial-gradient(closest-side at 50% 50%, #000 62%, rgba(0,0,0,.6) 80%, transparent 100%);
}
.rv-grid { width: 135%; gap: 1.25rem; transform: translate(-50%, -50%) rotateX(32deg); }
.rv-grid .rv-card, .rv-grid .rv-card:nth-child(2n) { transform: translateZ(0); }
.rv-grid .rv-card:nth-child(2), .rv-grid .rv-card:nth-child(4), .rv-grid .rv-card:nth-child(6), .rv-grid .rv-card:nth-child(8) { transform: translateZ(30px); }
.rv-grid .rv-card--hero { transform: translateZ(95px) scale(1.05); }
@media (max-width: 639px) {
  .rv-grid { width: 150%; gap: .8rem; }
  .rv-grid .rv-card { padding: .8rem .85rem .9rem; border-radius: .9rem; }
  .rv-grid .rv-card__avatar { width: 1.8rem; height: 1.8rem; font-size: .8rem; }
  .rv-grid .rv-card__name { font-size: .8rem; } .rv-grid .rv-card__when { font-size: .68rem; }
  .rv-grid .rv-card__text { font-size: .74rem; } .rv-grid .rv-card__g { width: 16px; height: 16px; }
  .rv-grid .rv-card__stars svg { width: 11px; height: 11px; }
}

/* Bewertungskarten: Google-Optik + echte Materialstärke (3D) */
.rv-grid .rv-card {
  font-family: Roboto, "Inter", system-ui, sans-serif; background: #fff; border: 1px solid #e3e3e8;
  transform-style: preserve-3d;
}
.rv-grid .rv-card::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none;
  background: linear-gradient(180deg, #e9e9ee 0%, #cfcfd6 100%);
  transform: translateZ(-9px);
  box-shadow: 0 30px 40px -18px rgba(29, 29, 31, .45);
}
.rv-grid .rv-card::after {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none;
  background: #c2c2ca; transform: translateZ(-4.5px);
}
.rv-grid .rv-card__avatar { background-image: none; box-shadow: none; font-weight: 500; }
.rv-grid .rv-card__name { font-weight: 500; color: #202124; }
.rv-grid .rv-card__when { color: #70757a; }
.rv-grid .rv-card__text { color: #3c4043; }
.rv-grid .rv-card__stars { gap: 1px; }
@media (min-width: 1024px) { .au-hero__text { align-self: start; padding-top: 2.5rem; } }

/* Nachweise (Über uns): dezentes, transparentes Gitter im Hintergrund */
.au-nachweise { position: relative; isolation: isolate; overflow: hidden; }
.au-nachweise::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(29, 29, 31, .06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(29, 29, 31, .06) 1px, transparent 1px);
  background-size: 48px 48px; background-position: center top;
  -webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 40%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 75% 70% at 50% 40%, #000 30%, transparent 100%);
}

/* Bewertungs-Wand: Karussell der mittleren Reihe (Design unverändert) */
.rv-grid { --rv-gap: 1.25rem; gap: var(--rv-gap); }
@media (max-width: 639px) { .rv-grid { --rv-gap: .8rem; } }
.rv-row { grid-column: 1 / -1; transform-style: preserve-3d; }
.rv-track { display: flex; gap: var(--rv-gap); transform-style: preserve-3d; will-change: transform; }
.rv-track > .rv-card { flex: 0 0 calc((100% - 2 * var(--rv-gap)) / 3); }
.rv-grid .rv-track .rv-card { transform: translateZ(30px); transition: transform 1.1s cubic-bezier(.22, .61, .36, 1), box-shadow 1.1s cubic-bezier(.22, .61, .36, 1); }
.rv-grid .rv-track .rv-card.is-center {
  transform: translateZ(95px) scale(1.05);
  box-shadow: inset 0 1px 0 #fff, 0 2px 4px rgba(0, 0, 0, .05), 0 40px 46px -28px rgba(29, 29, 31, .55), 0 70px 90px -50px rgba(139, 110, 34, .6);
}
.rv-track.is-sliding { transition: transform 1.4s cubic-bezier(.45, 0, .2, 1); }

/* Über uns Hero: drei Vertrauens-Häkchen unter dem Text */
.au-checks { list-style: none; margin: 2rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .9rem; align-items: center; }
@media (min-width: 1024px) { .au-checks { align-items: flex-start; } }
.au-check { display: flex; align-items: center; gap: .8rem; font-size: var(--text-base); font-weight: 500; color: var(--color-ink); line-height: 1.35; }
.au-check__mark { position: relative; flex: none; display: inline-flex; padding-bottom: .3rem; }
.au-check__icon { display: block; width: 1.4rem; height: 1.4rem; }
.au-check__mark::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 1.15rem; height: .22rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, 0) 72%); filter: blur(.5px);
}
.au-checks { align-items: flex-start; width: fit-content; margin-inline: auto; text-align: left; } @media (min-width: 1024px) { .au-checks { margin-inline: 0; } }
/* Häkchen: schlicht grün, nebeneinander */
.au-checks--inline { flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: .75rem 1.75rem; width: auto; }
@media (min-width: 1024px) { .au-checks--inline { justify-content: flex-start; } }
.au-checks--inline .au-check { gap: .45rem; font-weight: 500; }
.au-checks--inline .au-check__icon { width: 1.15rem; height: 1.15rem; color: #1e8e3e; }
@media (min-width: 1024px) { .au-hero__text { padding-top: 0; margin-top: -1rem; } }
@media (min-width: 1024px) { .au-hero__text { margin-top: .5rem; } }

/* Trennlinie zwischen Hero und Profil (Über uns) */
.au-divider { position: relative; max-width: 75rem; margin: 0 auto; padding-inline: clamp(1.25rem, 4vw, 2rem); }
.au-divider::before {
  content: ""; display: block; height: 1px;
  background: linear-gradient(to right, rgba(29, 29, 31, 0) 0%, rgba(29, 29, 31, .14) 20%, rgba(29, 29, 31, .14) 80%, rgba(29, 29, 31, 0) 100%);
}
.au-divider span { position: absolute; left: 50%; top: -1px; width: 3rem; height: 3px; transform: translateX(-50%); border-radius: 3px; background: var(--color-gold-soft); }
.au-divider span { display: none; }
.au-checks--inline .au-check__icon { color: var(--color-gold); }
.au-divider::before { background: linear-gradient(to right, rgba(212, 167, 58, 0) 0%, rgba(212, 167, 58, .85) 20%, rgba(212, 167, 58, .85) 80%, rgba(212, 167, 58, 0) 100%); }
.ez-tile__name { font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); }

/* Einzugsgebiet: schwarze 3D-Stecknadel über dem Ortsnamen */
.ez-tile { gap: .55rem; }
.ez-pin { position: relative; display: inline-flex; padding-bottom: .4rem; }
.ez-pin svg { display: block; width: 1.4rem; height: 1.4rem; }
.ez-pin::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 1.1rem; height: .26rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .28) 0%, rgba(0, 0, 0, .08) 50%, rgba(0, 0, 0, 0) 72%); filter: blur(.6px);
}


/* =========================================================
   EINZUGSGEBIET – HERO MIT KARTE
   ========================================================= */
@media (min-width: 1024px) {
  .ez-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; align-items: center; text-align: left; }
  .page-hero--ez .page-hero__title { margin-inline: 0; }
  .page-hero--ez .page-hero__text { margin-left: 0; margin-right: 0; }
  .ez-legend { justify-content: flex-start !important; }
}
.ez-legend { list-style: none; margin: 1.75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.75rem; font-size: var(--text-sm); font-weight: 500; color: var(--color-ink-soft); }
.ez-legend li { display: inline-flex; align-items: center; gap: .55rem; }
.ez-legend__sw { width: 1rem; height: 1rem; border-radius: 50%; }
.ez-legend__sw--n { background: rgba(212, 167, 58, .28); border: 1.5px solid var(--color-gold); }
.ez-legend__sw--e { background: rgba(212, 167, 58, .08); border: 1.5px dashed var(--color-gold); }

.ez-map { margin: 2.5rem auto 0; max-width: 36rem; border-radius: 1.75rem; overflow: hidden; background: #f1f2f4;
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 30px 60px -30px rgba(29, 29, 31, .35), 0 0 0 1px rgba(29, 29, 31, .06); }
@media (min-width: 1024px) { .ez-map { margin: 0; max-width: none; } }
.ez-map__svg { display: block; width: 100%; height: auto; font-family: var(--font-body); }
.m-land { fill: #f1f2f4; }
.m-r60 { fill: rgba(212, 167, 58, .07); stroke: #b8912e; stroke-width: 1.4; stroke-dasharray: 5 5; }
.m-r25 { fill: rgba(212, 167, 58, .18); stroke: #b8912e; stroke-width: 1.6; }
.m-water { fill: none; stroke: #bcd3e6; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.m-roads-casing polyline { fill: none; stroke: #d6d8dd; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }
.m-roads polyline { fill: none; stroke: #ffffff; stroke-width: 3.6; stroke-linecap: round; stroke-linejoin: round; }
.m-minor polyline { fill: none; stroke: #ffffff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: .95; }
.m-dot { fill: #6e6e73; stroke: #fff; stroke-width: 1.2; }
.m-dot--big { fill: #424245; }
.m-lbl { font-size: 10.5px; font-weight: 500; fill: #6e6e73; paint-order: stroke; stroke: #f1f2f4; stroke-width: 3px; stroke-linejoin: round; }
.m-lbl--big { font-size: 12px; font-weight: 600; fill: #1d1d1f; }
.m-ring { font-size: 10.5px; font-weight: 600; fill: #8b6e22; paint-order: stroke; stroke: #f1f2f4; stroke-width: 3px; letter-spacing: .02em; }
.m-tag rect { fill: #1d1d1f; }
.m-tag text { font-size: 12px; font-weight: 600; fill: #fff; }

@media (min-width: 1024px) { .ez-hero__inner .page-hero__title { font-size: clamp(3rem, 1.4rem + 3.2vw, 4.75rem); line-height: 1.02; } }

/* =========================================================
   EINZUGSGEBIET-CHECK (Karte + Suche)
   ========================================================= */
.ck { position: relative; margin: 2.5rem auto 0; max-width: 36rem; border-radius: 1.75rem; overflow: hidden; background: #e9eef3;
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 30px 60px -30px rgba(29, 29, 31, .35), 0 0 0 1px rgba(29, 29, 31, .06); text-align: left; }
@media (min-width: 1024px) { .ck { margin: 0; max-width: none; } }
.ck-mapwrap { position: relative; }
.ck-map { display: block; width: 100%; height: auto; font-family: var(--font-body); }
.ck-sea { fill: #e6ebf0; }
.ck-nb { fill: #f2f2f0; stroke: #d3d6da; stroke-width: .8; }
.ck-de { fill: #fbfaf7; stroke: #b9bcc2; stroke-width: 1.2; stroke-linejoin: round; }
.ck-r300 { fill: rgba(212, 167, 58, .12); stroke: #b8912e; stroke-width: 1.6; stroke-dasharray: 7 6; }
.ck-rlabel { font-size: 12px; font-weight: 600; fill: #8b6e22; paint-order: stroke; stroke: #fbfaf7; stroke-width: 3px; }
.ck-dot { fill: #6e6e73; stroke: #fff; stroke-width: 1.4; }
.ck-chip rect { fill: #fff; }
.ck-chip text { font-size: 12px; font-weight: 600; fill: #1d1d1f; }
.ck-homechip rect { fill: #1d1d1f; }
.ck-homechip text { font-size: 13px; font-weight: 600; fill: #fff; }
.ck-pulse { fill: rgba(212, 167, 58, .35); transform-box: fill-box; transform-origin: center; animation: ck-pulse 2.6s ease-out infinite; }
@keyframes ck-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(4.2); opacity: 0; } }
.ck-line { stroke: #b8912e; stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 1 6; opacity: 0; }
.ck-line.is-on { opacity: 1; transition: opacity .3s; }
.ck-target { opacity: 0; transition: opacity .2s; }
.ck-target.is-on { opacity: 1; }
.ck-target.is-on .ck-target__drop { animation: ck-drop .7s cubic-bezier(.3, 1.6, .5, 1) both; }
.ck-target.is-on .ck-target__shadow { animation: ck-shadow .7s ease-out both; transform-box: fill-box; transform-origin: center; }
.ck-target.is-on .ck-target__chip { animation: ck-chip .45s .45s ease-out both; }
@keyframes ck-drop { 0% { transform: translateY(-60px); opacity: 0; } 60% { opacity: 1; } 100% { transform: none; opacity: 1; } }
@keyframes ck-shadow { 0% { transform: scale(.2); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes ck-chip { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.ck-target__chip rect { fill: #fff; }
.ck-target__chip text { font-size: 13px; font-weight: 600; fill: #1d1d1f; }
.ck-attr { position: absolute; right: .6rem; bottom: .45rem; margin: 0; font-size: 10px; color: #8e8e93; background: rgba(255,255,255,.75); padding: .1rem .4rem; border-radius: .3rem; }

.ck-search { position: absolute; top: 1rem; left: 1rem; right: 1rem; z-index: 3; display: flex; align-items: center; gap: .5rem;
  padding: .4rem .4rem .4rem .9rem; background: #fff; border-radius: 1rem; box-shadow: 0 8px 24px -10px rgba(29, 29, 31, .35), 0 0 0 1px rgba(29, 29, 31, .06); }
@media (min-width: 640px) { .ck-search { right: auto; width: min(26rem, calc(100% - 2rem)); } }
.ck-search__icon { flex: none; color: var(--color-gold); }
.ck-search__input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 16px; color: var(--color-ink); padding: .55rem 0; }
.ck-search__input::placeholder { color: #8e8e93; }
.ck-search__btn { flex: none; border: 0; border-radius: .75rem; background: var(--color-ink); color: #fff; font: inherit; font-weight: 600; font-size: .95rem; padding: .6rem 1rem; cursor: pointer; }
.ck-search__btn:hover { background: #2c2c2e; }
.ck-suggest { position: absolute; left: 0; right: 0; top: calc(100% + .4rem); margin: 0; padding: .35rem; list-style: none; background: #fff; border-radius: .9rem; box-shadow: 0 16px 32px -14px rgba(29, 29, 31, .4), 0 0 0 1px rgba(29, 29, 31, .06); }
.ck-suggest li { padding: .55rem .7rem; border-radius: .6rem; cursor: pointer; font-size: .95rem; color: var(--color-ink); }
.ck-suggest li span { color: var(--color-ink-muted); font-size: .85rem; margin-left: .35rem; }
.ck-suggest li[aria-selected="true"], .ck-suggest li:hover { background: var(--color-bg-warm); }

.ck-result { display: flex; align-items: flex-start; gap: .75rem; padding: 1.1rem 1.25rem; background: #fff; border-top: 1px solid var(--color-line-soft); font-size: var(--text-base); line-height: 1.45; color: var(--color-ink); }
.ck-result[hidden] { display: none; }
.ck-result__icon { flex: none; width: 1.6rem; height: 1.6rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--color-gold); margin-top: .05rem; }
.ck-result--no .ck-result__icon { background: #8e8e93; }
.ck-result strong { font-weight: 600; }
.ck-result a { color: var(--color-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.ck-result__sub { display: block; margin-top: .2rem; font-size: var(--text-sm); color: var(--color-ink-muted); }
@media (prefers-reduced-motion: reduce) { .ck-pulse { animation: none; opacity: 0; } .ck-target.is-on .ck-target__drop, .ck-target.is-on .ck-target__shadow, .ck-target.is-on .ck-target__chip { animation: none; } }

/* Check-Karte mit echtem Kartenbild (OpenStreetMap) */
.ck-tiles { filter: saturate(.8) contrast(.98); }
.ck-outside { fill: rgba(255, 255, 255, .5); }
.ck-r300 { fill: rgba(212, 167, 58, .08); stroke: #b8912e; stroke-width: 2; stroke-dasharray: 8 6; }
.ck-rlabel { stroke: #fff; }
.ck-dot { fill: #1d1d1f; }

/* Navbar: gefülltes 3D-Telefon-Icon mit kleinem Bodenschatten */
.header__phone-icon { flex: none; width: 18px; height: 18px; filter: drop-shadow(0 1.5px 1px rgba(0, 0, 0, .18)); }

/* Über uns: ruhige Bewertungs-Anordnung (ohne Animation, ohne Kippung) */
.rv-pile { position: relative; width: min(100%, 34rem); margin-inline: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; padding-bottom: 3.5rem; }
.rv-pile__item:nth-child(2), .rv-pile__item:nth-child(4) { transform: translateY(2.75rem); }
.rv-pile .rv-card {
  position: relative; inset: auto; width: auto; height: 100%; transform: none; padding: 1rem 1.05rem 1.1rem;
  font-family: Roboto, "Inter", system-ui, sans-serif; background: #fff; border: 1px solid #e6e6ea; border-radius: 1rem;
  box-shadow: 0 1px 0 #ececf0, 0 2px 0 #e3e3e8, 0 3px 0 #dadae0, 0 4px 0 #d2d2d8, 0 5px 0 #cbcbd2,
              0 14px 18px -10px rgba(29, 29, 31, .28), 0 30px 40px -24px rgba(29, 29, 31, .25);
}
.rv-pile .rv-card::before, .rv-pile .rv-card::after { display: none; }
.rv-pile .rv-card__text { font-size: .85rem; }
.rv-pile .rv-card__name { font-size: .9rem; }
.rv-pile__shadow { position: absolute; left: 50%; bottom: .25rem; width: 78%; height: 1.4rem; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .2) 0%, rgba(0, 0, 0, .07) 45%, rgba(0, 0, 0, 0) 72%); filter: blur(3px); pointer-events: none; }
@media (max-width: 479px) { .rv-pile { gap: .7rem; } .rv-pile .rv-card { padding: .8rem .8rem .9rem; } .rv-pile .rv-card__text { font-size: .78rem; } .rv-pile .rv-card__avatar { width: 1.8rem; height: 1.8rem; font-size: .8rem; } .rv-pile .rv-card__name { font-size: .8rem; } .rv-pile .rv-card__g { width: 16px; height: 16px; } }

/* =========================================================
   ÜBER UNS – Google-Bewertungen: symmetrischer Fächer, ruhig
   ========================================================= */
.rv-fan { width: 100%; max-width: 34rem; margin-inline: auto; }
.rv-fan__stage { position: relative; display: grid; place-items: center; padding: 0 0 1.75rem; }
.rv-fan__stage::after { /* weicher Bodenschatten */
  content: ""; position: absolute; left: 50%; bottom: .25rem; width: 70%; height: 1.5rem; transform: translateX(-50%); z-index: 0;
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(29, 29, 31, .14) 0%, rgba(29, 29, 31, .05) 45%, rgba(29, 29, 31, 0) 72%); filter: blur(4px);
}
.rvc {
  grid-area: 1 / 1; position: relative; z-index: 1; width: 62%; box-sizing: border-box;
  padding: 1.35rem 1.4rem 1.4rem; border-radius: 1.25rem; background: #fff; text-align: left;
  border: 1px solid rgba(29, 29, 31, .07);
  box-shadow: 0 1px 2px rgba(29, 29, 31, .04), 0 10px 24px -12px rgba(29, 29, 31, .14), 0 30px 60px -30px rgba(29, 29, 31, .18);
}
.rvc--c { z-index: 3; }
.rvc--l, .rvc--r { z-index: 2; transform: translateY(1.6rem) scale(.88); box-shadow: 0 1px 2px rgba(29, 29, 31, .03), 0 8px 20px -12px rgba(29, 29, 31, .12); }
.rvc--l { translate: -40% 0; }
.rvc--r { translate: 40% 0; }
.rvc--l::after, .rvc--r::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(rgba(245, 245, 247, .35), rgba(245, 245, 247, .55)); }
.rvc__head { display: flex; align-items: center; gap: .75rem; margin-bottom: .8rem; }
.rvc__avatar { flex: none; width: 2.5rem; height: 2.5rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: 1rem; }
.rvc__who { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.3; }
.rvc__name { font-weight: 600; font-size: .95rem; color: var(--color-ink); letter-spacing: -0.01em; }
.rvc__when { font-size: .8rem; color: var(--color-ink-muted); }
.rvc__head .rv-card__g { flex: none; }
.rvc__stars { display: flex; gap: 2px; margin-bottom: .6rem; }
.rvc__text { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--color-ink-soft); }
.rv-fan__caption { display: flex; align-items: center; justify-content: center; gap: .5rem; margin: 1.25rem 0 0; font-size: var(--text-sm); font-weight: 500; color: var(--color-ink-muted); }
.rv-fan__g { flex: none; }
@media (max-width: 639px) {
  .rvc { width: 74%; padding: 1.05rem 1.1rem 1.15rem; }
  .rvc--l { translate: -26% 0; } .rvc--r { translate: 26% 0; }
  .rvc__avatar { width: 2.15rem; height: 2.15rem; font-size: .9rem; }
  .rvc__name { font-size: .88rem; } .rvc__text { font-size: .85rem; }
}
/* Fächer: klarere Tiefe, symmetrisch */
.rv-fan { max-width: 36rem; }
.rv-fan__stage { padding-bottom: 2.75rem; }
.rvc { width: 64%; }
.rvc--c { box-shadow: 0 1px 2px rgba(29, 29, 31, .05), 0 16px 32px -14px rgba(29, 29, 31, .2), 0 40px 70px -36px rgba(29, 29, 31, .22); }
.rvc--l, .rvc--r { transform: translateY(2.4rem) scale(.84); }
.rvc--l { translate: -44% 0; }
.rvc--r { translate: 44% 0; }
.rvc--l::after, .rvc--r::after { background: linear-gradient(rgba(250, 250, 252, .45), rgba(250, 250, 252, .7)); }
@media (max-width: 639px) { .rvc { width: 76%; } .rvc--l { translate: -24% 0; } .rvc--r { translate: 24% 0; } .rvc--l, .rvc--r { transform: translateY(1.8rem) scale(.86); } }

/* =========================================================
   ÜBER UNS – Google-Bewertungen als Board (2 versetzte Reihen)
   ========================================================= */
.rvb {
  position: relative; width: 100%; max-width: 38rem; margin-inline: auto; padding: 1.5rem 0 1.75rem; overflow: hidden;
  border-radius: 1.75rem; border: 1px solid rgba(29, 29, 31, .06);
  background: linear-gradient(160deg, #fbf8f1 0%, #f6f5f2 45%, #f2f3f6 100%);
  box-shadow: 0 1px 2px rgba(29, 29, 31, .03), 0 30px 60px -40px rgba(29, 29, 31, .25);
}
.rvb__pill { display: flex; width: fit-content; align-items: center; gap: .4rem; margin: 0 auto 1.25rem; padding: .35rem .8rem;
  border-radius: 999px; background: #fff; border: 1px solid rgba(29, 29, 31, .08); font-size: .78rem; font-weight: 600; color: var(--color-ink); letter-spacing: .01em; }
.rvb__rows { display: flex; flex-direction: column; gap: 1rem;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 86%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 86%, transparent 100%); }
.rvb__row { --w: 14.5rem; --gap: 1rem; display: flex; gap: var(--gap); width: max-content; position: relative; left: 50%; transform: translateX(-50%); }
.rvb__row--offset { transform: translateX(calc(-50% + (var(--w) + var(--gap)) / 2)); }
.rvb-card {
  flex: none; width: var(--w); box-sizing: border-box; padding: 1rem 1.05rem 1.05rem; border-radius: 1rem; background: #fff; text-align: left;
  border: 1px solid rgba(29, 29, 31, .07);
  box-shadow: 0 1px 2px rgba(29, 29, 31, .04), 0 10px 22px -14px rgba(29, 29, 31, .18);
  display: flex; flex-direction: column;
}
.rvb-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
.rvb-card__stars { display: flex; gap: 2px; }
.rvb-card__g { flex: none; }
.rvb-card__text { margin: 0 0 .9rem; font-size: .86rem; line-height: 1.5; color: var(--color-ink-soft); flex: 1; }
.rvb-card__by { display: flex; align-items: center; gap: .6rem; }
.rvb-card__avatar { flex: none; width: 2rem; height: 2rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: .85rem; }
.rvb-card__who { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.rvb-card__name { font-weight: 600; font-size: .85rem; color: var(--color-ink); }
.rvb-card__when { font-size: .74rem; color: var(--color-ink-muted); }
@media (max-width: 639px) { .rvb__row { --w: 12.5rem; --gap: .75rem; } .rvb__rows { gap: .75rem; } }

/* =========================================================
   ÜBER UNS – Kundenstimmen als Bento-Raster (Vorlage „recent clients“)
   ========================================================= */
@media (min-width: 1024px) { .au-hero__inner { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); } }
.tsm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(13.5rem, auto); gap: .6rem; width: 100%; max-width: 40rem; margin-inline: auto; text-align: left; }
.tsm--tall { grid-column: 1; grid-row: 1 / span 2; }
.tsm--a { grid-column: 2; grid-row: 1; }
.tsm--b { grid-column: 3; grid-row: 1; }
.tsm--wide { grid-column: 2 / span 2; grid-row: 2; }
.tsm {
  display: flex; flex-direction: column; padding: 1.1rem 1.15rem 1.15rem; border-radius: 1rem; background: #fff; color: var(--color-ink);
  box-shadow: 0 1px 2px rgba(29, 29, 31, .05), 0 6px 16px -10px rgba(29, 29, 31, .18); border: 1px solid rgba(29, 29, 31, .04);
}
.tsm--dark { background: #111113; color: #fff; border-color: #111113; }
.tsm__top { display: flex; align-items: center; gap: .55rem; margin-bottom: 1.1rem; }
.tsm__avatar { flex: none; width: 2.1rem; height: 2.1rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: .85rem; }
.tsm__rating { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; font-weight: 600; color: var(--color-ink-soft); }
.tsm--dark .tsm__rating { color: #fff; }
.tsm__g { margin-left: .15rem; }
.tsm__quote { margin: 0; font-size: .95rem; line-height: 1.45; letter-spacing: -0.005em; color: var(--color-ink); }
.tsm--dark .tsm__quote { color: #fff; font-weight: 500; }
.tsm__by { margin-top: auto; padding-top: 1.25rem; display: flex; flex-direction: column; gap: .15rem; }
.tsm__name { font-size: .85rem; font-weight: 600; }
.tsm__meta { font-size: .78rem; color: var(--color-ink-muted); }
.tsm--dark .tsm__meta { color: rgba(255, 255, 255, .62); }
@media (max-width: 639px) {
  .tsm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(11.5rem, auto); }
  .tsm--tall { grid-column: 1; grid-row: 1 / span 2; }
  .tsm--a { grid-column: 2; grid-row: 1; }
  .tsm--b { grid-column: 2; grid-row: 2; }
  .tsm--wide { grid-column: 1 / span 2; grid-row: 3; }
  .tsm { padding: .95rem; } .tsm__quote { font-size: .88rem; }
}
@media (min-width: 1024px) { .au-hero .page-hero__title { font-size: clamp(3.25rem, 1.2rem + 3.6vw, 5.5rem); } }

/* Bento: Tiefe – mehrstufige Schatten + Bodenschatten unter dem Raster */
.tsm-grid { position: relative; isolation: isolate; padding-bottom: 1.5rem; }
.tsm-grid::after {
  content: ""; position: absolute; z-index: -1; left: 6%; right: 6%; bottom: -.25rem; height: 2.6rem;
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(29, 29, 31, .22) 0%, rgba(29, 29, 31, .08) 45%, rgba(29, 29, 31, 0) 72%);
  filter: blur(6px); pointer-events: none;
}
.tsm {
  position: relative;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 1px rgba(29, 29, 31, .04), 0 2px 4px rgba(29, 29, 31, .04),
              0 10px 20px -10px rgba(29, 29, 31, .16), 0 26px 44px -26px rgba(29, 29, 31, .24);
}
.tsm--dark {
  background: linear-gradient(180deg, #232326 0%, #111113 55%, #0b0b0c 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 2px 4px rgba(0, 0, 0, .08), 0 14px 26px -12px rgba(0, 0, 0, .35), 0 34px 56px -30px rgba(0, 0, 0, .45);
}

/* Gesamtbewertung unter den Kundenstimmen */
.tsm-wrap { width: 100%; max-width: 40rem; margin-inline: auto; }
.tsm-summary {
  display: flex; width: fit-content; align-items: center; gap: .55rem; margin: 1.5rem auto 0; padding: .6rem 1.1rem;
  border-radius: 999px; background: #fff; border: 1px solid rgba(29, 29, 31, .07);
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(29, 29, 31, .05), 0 8px 18px -10px rgba(29, 29, 31, .2);
}
.tsm-summary__g { flex: none; }
.tsm-summary__score { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; color: var(--color-ink); letter-spacing: -0.01em; }
.tsm-summary__stars { display: inline-flex; gap: 1px; }
.tsm-summary__label { font-size: .88rem; font-weight: 500; color: var(--color-ink-muted); }

/* Google-Gesamtbewertung ohne Umrandung */
.tsm-summary{background:none;border:0;box-shadow:none;padding:0;margin-top:1.75rem}

/* Einzugsgebiet: Suchfeld-Icon gefüllt (3D) + Städtenamen auf der Karte */
.ck-search__icon { width: 22px; height: 22px; margin-top: 1px; }
.ck-lbls circle { fill: #2c2c2e; stroke: #fff; stroke-width: 1.2; }
.ck-lbls text { font-family: var(--font-body); font-size: 11.5px; font-weight: 600; fill: #2c2c2e; stroke: #fff; stroke-width: 3; stroke-linejoin: round; paint-order: stroke; letter-spacing: .01em; }

/* Einzugsgebiet: Städte ohne Kärtchen */
.ck-lbl--1 circle { fill: #1d1d1f; stroke: #fff; stroke-width: 1.4; }
.ck-lbl--1 text { font-size: 13.5px; font-weight: 700; fill: #1d1d1f; stroke-width: 3.4; }
.ck-lbl { transition: opacity .2s; }

/* Kundenstimmen-Bento: überarbeitete Karten (Kopf mit Avatar/Name, Sterne, Zitat) + dezente Effekte */
.tsm-grid::before {
  content: ""; position: absolute; z-index: -2; inset: 8% 10% 14%; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(212, 167, 58, .16) 0%, rgba(212, 167, 58, 0) 70%); filter: blur(28px); pointer-events: none;
}
.tsm {
  padding: 1.2rem 1.2rem 1.3rem; border-radius: 1.1rem; border: 1px solid transparent;
  background: linear-gradient(180deg, #fff 0%, #fcfcfd 100%) padding-box,
              linear-gradient(180deg, rgba(29, 29, 31, .10), rgba(29, 29, 31, .03)) border-box;
  transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s cubic-bezier(.2, .7, .2, 1);
}
.tsm--dark {
  border: 1px solid transparent;
  background: radial-gradient(120% 60% at 0% 0%, rgba(212, 167, 58, .14) 0%, rgba(212, 167, 58, 0) 60%) padding-box,
              linear-gradient(180deg, #242427 0%, #121214 55%, #0b0b0c 100%) padding-box,
              linear-gradient(160deg, rgba(226, 188, 92, .55), rgba(255, 255, 255, .06) 45%, rgba(255, 255, 255, .02)) border-box;
}
.tsm__head { display: flex; align-items: center; gap: .6rem; }
.tsm__avatar {
  width: 2.25rem; height: 2.25rem; font-size: .9rem; font-weight: 600; letter-spacing: .01em;
  background: linear-gradient(160deg, color-mix(in srgb, var(--av) 72%, #fff) 0%, var(--av) 55%, color-mix(in srgb, var(--av) 80%, #000) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 2px 5px -1px color-mix(in srgb, var(--av) 55%, transparent);
}
.tsm__who { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.tsm__name { font-size: .86rem; font-weight: 600; color: var(--color-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tsm__meta { font-size: .74rem; color: var(--color-ink-muted); margin-top: .1rem; }
.tsm--dark .tsm__name { color: #fff; }
.tsm__head .tsm__g { flex: none; margin-left: auto; align-self: flex-start; }
.tsm__stars { display: flex; gap: 2px; margin: .95rem 0 .7rem; }
.tsm__stars svg { fill: #f5b301; filter: drop-shadow(0 1px 0 rgba(139, 110, 34, .25)); }
.tsm--dark .tsm__stars svg { fill: #e2bc5c; }
.tsm__quote { font-size: .93rem; line-height: 1.5; color: var(--color-ink-soft); }
.tsm--dark .tsm__quote { color: rgba(255, 255, 255, .92); font-size: 1.12rem; line-height: 1.45; font-weight: 500; letter-spacing: -0.01em; }
.tsm__mark { display: block; margin: .6rem 0 -.6rem; font-family: Georgia, "Times New Roman", serif; font-size: 3.6rem; line-height: 1; height: 2.4rem;
  background: linear-gradient(180deg, #e2bc5c, #8b6e22); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (hover: hover) {
  .tsm:hover { transform: translateY(-4px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 2px 4px rgba(29, 29, 31, .05), 0 16px 28px -12px rgba(29, 29, 31, .22), 0 36px 60px -30px rgba(29, 29, 31, .3); }
  .tsm--dark:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 4px 8px rgba(0, 0, 0, .1), 0 20px 34px -14px rgba(0, 0, 0, .42), 0 44px 70px -34px rgba(0, 0, 0, .5); }
}
@keyframes tsm-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.tsm { animation: tsm-in .7s cubic-bezier(.2, .7, .2, 1) both; }
.tsm--a { animation-delay: .08s; } .tsm--b { animation-delay: .16s; } .tsm--wide { animation-delay: .24s; }
@media (prefers-reduced-motion: reduce) { .tsm { animation: none; transition: none; } .tsm:hover { transform: none; } }
@media (max-width: 639px) {
  .tsm { padding: 1rem; } .tsm__quote { font-size: .86rem; } .tsm--dark .tsm__quote { font-size: 1rem; }
  .tsm__avatar { width: 2rem; height: 2rem; font-size: .8rem; } .tsm__head .tsm__g { width: 16px; height: 16px; }
}
.tsm__rate { display: flex; align-items: center; justify-content: space-between; margin: .95rem 0 .7rem; }
.tsm__rate .tsm__stars { margin: 0; }
.tsm__rate .tsm__g { flex: none; width: 17px; height: 17px; margin: 0; }
.tsm__meta { white-space: nowrap; }
.tsm__head { gap: .55rem; }
.tsm__avatar { width: 2.1rem; height: 2.1rem; }
@media (max-width: 639px) { .tsm__rate .tsm__g { width: 15px; height: 15px; } .tsm__stars svg { width: 13px; height: 13px; } }
.tsm-summary__stars path { fill: #f5b301; }

/* Einzugsgebiet: Karten-Card wie die Bewertungskarten – Rahmen, Verlaufskante, mehrstufige Schatten, Bodenschatten */
.ck-frame { position: relative; isolation: isolate; width: 100%; max-width: 36rem; margin: 2.5rem auto 0; padding-bottom: 1.25rem; }
@media (min-width: 1024px) { .ck-frame { max-width: none; margin: 0; } }
.ck-frame::before {
  content: ""; position: absolute; z-index: -2; inset: 6% 4% 12%; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(212, 167, 58, .18) 0%, rgba(212, 167, 58, 0) 70%); filter: blur(32px); pointer-events: none;
}
.ck-frame::after {
  content: ""; position: absolute; z-index: -1; left: 7%; right: 7%; bottom: -.1rem; height: 2.8rem; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(29, 29, 31, .24) 0%, rgba(29, 29, 31, .08) 45%, rgba(29, 29, 31, 0) 72%);
  filter: blur(7px); pointer-events: none;
}
.ck {
  margin: 0; max-width: none; overflow: visible; padding: .5rem; border-radius: 2rem; border: 1px solid transparent;
  background: linear-gradient(180deg, #fff 0%, #fbfbfc 100%) padding-box,
              linear-gradient(180deg, rgba(29, 29, 31, .11), rgba(29, 29, 31, .03)) border-box;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 1px rgba(29, 29, 31, .04), 0 2px 4px rgba(29, 29, 31, .04),
              0 14px 26px -12px rgba(29, 29, 31, .18), 0 40px 64px -34px rgba(29, 29, 31, .3);
}
.ck-mapwrap { overflow: hidden; border-radius: 1.5rem; background: #e9eef3; }
.ck-mapwrap::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(29, 29, 31, .07), inset 0 1px 2px rgba(29, 29, 31, .06); }
.ck-search {
  top: 1.25rem; left: 1.25rem; right: 1.25rem; border: 1px solid transparent;
  background: linear-gradient(180deg, #fff 0%, #fcfcfd 100%) padding-box,
              linear-gradient(180deg, rgba(29, 29, 31, .10), rgba(29, 29, 31, .03)) border-box;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(29, 29, 31, .05), 0 10px 22px -10px rgba(29, 29, 31, .28), 0 24px 40px -26px rgba(29, 29, 31, .3);
}
@media (min-width: 640px) { .ck-search { right: auto; width: min(26rem, calc(100% - 2.5rem)); } }
.ck-search__btn {
  background: linear-gradient(180deg, #3a3a3d 0%, #1d1d1f 55%, #0c0c0d 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 1px 2px rgba(0, 0, 0, .2), 0 6px 12px -6px rgba(0, 0, 0, .45);
  transition: transform .2s ease, box-shadow .2s ease;
}
.ck-search__btn:hover { background: linear-gradient(180deg, #48484b 0%, #232326 55%, #111113 100%); }
.ck-search__btn:active { transform: translateY(1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 1px 2px rgba(0, 0, 0, .25); }
.ck-attr { right: .75rem; bottom: .6rem; }
.ck-result { background: none; border-top: 0; padding: 1rem .9rem .6rem; }
@media (max-width: 639px) { .ck { padding: .4rem; border-radius: 1.6rem; } .ck-mapwrap { border-radius: 1.25rem; } .ck-search { top: 1rem; left: 1rem; right: 1rem; } }
@media (max-width: 639px) { .ck-attr { font-size: 8px; right: .45rem; bottom: .4rem; padding: .05rem .3rem; } }
/* ohne weißen Rahmen um die Karte */
.ck { padding: 0; border-radius: 1.75rem; overflow: hidden; }
.ck-mapwrap { border-radius: 0; }
.ck-mapwrap::after { content: none; }
.ck-search { top: 1rem; left: 1rem; right: 1rem; }
@media (min-width: 640px) { .ck-search { right: auto; width: min(26rem, calc(100% - 2rem)); } }
.ck-result { padding: 1.1rem 1.25rem; }
@media (max-width: 639px) { .ck { padding: 0; border-radius: 1.5rem; } .ck-mapwrap { border-radius: 0; } }
/* Hero Einzugsgebiet: Text oben an der Karte ausrichten (springt nicht mehr, wenn das Prüfergebnis erscheint) */
.ck-frame { padding-bottom: 0; }
@media (min-width: 1024px) {
  .ez-hero__inner { align-items: start; }
  .ez-hero__text { padding-top: .75rem; }
}
/* Schadenfoto im Chat etwas flacher, damit die Antwort komplett sichtbar ist */
.wa-photo { aspect-ratio: 1 / 1; background-position: center 45%, center; }
/* Vorteile-Leiste am Handy: Punkte bündig untereinander, Block mittig */
@media (max-width: 767px) { .usp__row { display: grid; justify-content: center; justify-items: start; gap: .8rem; } }
/* Einblicke: 1Plus-Logo unten rechts auf jedem Bild */
.insight img.insight__logo, .insight:hover img.insight__logo {
  position: absolute; z-index: 2; inset: auto 1rem 1rem auto; width: 30px; height: auto; object-fit: contain; opacity: .92;
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0, 0, 0, .45)); transform: none; transition: none; pointer-events: none; }
.insight__cap { padding-right: 3.5rem; }
@media (min-width: 768px) {
  .insight img.insight__logo, .insight:hover img.insight__logo { width: 38px; inset: auto 1.25rem 1.3rem auto; }
  .insight__cap { padding-right: 4.25rem; }
}
@media (max-width: 767px) {
  .insight img.insight__logo, .insight:hover img.insight__logo { width: 22px; inset: auto .7rem .8rem auto; }
  .insight__cap { padding: .85rem 2.4rem .8rem .85rem; }
  .insight__meta { font-size: .78rem; }
}
/* Leistungs-Karten: 1Plus-Logo unten rechts auf dem Foto */
.svc-card__img::after { content: ""; position: absolute; right: 0; bottom: 0; width: 45%; height: 55%; pointer-events: none; z-index: 1;
  background: radial-gradient(ellipse at 100% 100%, rgba(10, 12, 16, .45) 0%, rgba(10, 12, 16, .15) 40%, rgba(10, 12, 16, 0) 70%); }
.svc-logo { position: absolute; z-index: 2; right: 1rem; bottom: 1rem; width: 30px; height: auto; opacity: .95; pointer-events: none;
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0, 0, 0, .5)); }
@media (min-width: 768px) { .svc-logo { width: 36px; right: 1.2rem; bottom: 1.1rem; } }
/* WhatsApp-Chat: eigenes Doodle-Muster im Hintergrund (Autos, Werkzeug, Kamera ...) */
.wa-chat { background-image: url("assets/wa-muster.svg"); background-size: 200px 200px; background-position: 0 0; }

/* =========================================================
   STARTSEITE – EINZUGSGEBIETE (kompakt, zwischen Kontakt und Footer)
   ========================================================= */
.ezs { background: #fff; padding-block: clamp(3.5rem, 7vw, 5.5rem); padding-inline: clamp(1.25rem, 4vw, 2rem); border-bottom: 1px solid var(--color-line-soft); }
.ezs__inner { display: grid; gap: 2rem; }
@media (min-width: 900px) { .ezs__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5rem; align-items: center; } }
.ezs__title { margin-bottom: 1rem; }
.ezs__lead { margin: 0; max-width: 30rem; font-size: var(--text-base); line-height: 1.6; color: var(--color-ink-soft); }
.ezs__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--color-line); }
.ezs__item { display: flex; align-items: center; gap: .85rem; padding: 1.05rem .25rem; border-bottom: 1px solid var(--color-line); }
.ezs__pin { flex: none; width: 20px; height: 20px; filter: drop-shadow(0 1.5px 1px rgba(0, 0, 0, .18)); }
.ezs__name { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.0625rem, 1rem + .3vw, 1.2rem); letter-spacing: -0.015em; color: var(--color-ink); }
.ezs__btn { margin-top: 1.5rem; }

/* FAQ: Fragen als H3 (SEO), Optik wie bisher */
.faq-q { margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }

/* Kontakt: E-Mail-Adresse nie umbrechen, Schrift passt sich der Kachelbreite an */
.kc-tile--sm { container-type: inline-size; }
.kc-mail { word-break: normal; overflow-wrap: normal; white-space: nowrap; font-size: clamp(.8rem, 7.8cqi, 1.5rem); }
/* Kontakt: Schloss gefüllt in Gold, 3D mit Schatten unten */
.kf-trust .kf-lock { margin-top: 0; filter: drop-shadow(0 1.5px 1px rgba(90, 70, 20, .3)); }
/* 404-Seite */
.nf-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 2rem; }
/* =========================================================
   LEISTUNGSSEITE UNFALLGUTACHTEN (/leistungen/unfallgutachten)
   ========================================================= */
.lu-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 2rem; }
@media (min-width: 1024px) { .lu-buttons { justify-content: flex-start; } }
.lu-checks { margin-top: 1.75rem; }
.lu-photo { position: relative; margin: 0; width: 100%; overflow: hidden; border-radius: 1.75rem; background: var(--color-line-soft); box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .25); isolation: isolate; }
@media (min-width: 768px) { .lu-photo { border-radius: 2.25rem; } }
.lu-photo > img:first-child { display: block; width: 100%; height: 100%; object-fit: cover; }
.lu-photo--hero { aspect-ratio: 4 / 3; max-width: 36rem; }
.lu-photo--tall { aspect-ratio: 4 / 5; max-width: 30rem; margin-inline: auto; }
.lu-photo--case { aspect-ratio: 4 / 5; border-radius: 1.5rem; margin-bottom: 1.5rem; box-shadow: none; }
.lu-split { align-items: center; }
.section--warm .lu-cost-tile:not(.tile-dark) { background: #fff; }
.lu-cost-tile { min-height: 0; justify-content: flex-start; gap: .25rem; }
@media (min-width: 768px) { .lu-cost-tile { min-height: 18rem; } }
.lu-lead { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 600; line-height: 1.25; letter-spacing: -0.02em; color: var(--color-ink); margin-bottom: .5rem; }
.tile-dark .lu-lead { color: #fff; }
.lu-values { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; perspective: 1200px; }
@media (min-width: 640px) { .lu-values { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lu-value:last-child { grid-column: span 2; } }
@media (min-width: 1200px) { .lu-values { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; } .lu-value:last-child { grid-column: auto; } .lu-value { padding: 1.75rem 1.5rem; } }
.lu-value .tile-title { font-size: var(--text-xl); }
.lu-note { max-width: 42rem; margin: 3rem auto 0; text-align: center; color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }
.steps--4 { gap: 3rem; }
@media (min-width: 768px) { .steps--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem 2rem; } }
@media (min-width: 1024px) { .steps--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; } }
.lu-cta-note { margin-top: 1.25rem; color: var(--color-ink-muted); font-size: var(--text-sm); }
.lu-cases { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; }
@media (min-width: 768px) { .lu-cases { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }
.lu-case .tile-title { margin-top: .25rem; }
.lu-todo { outline: 1.5px dashed var(--color-gold); outline-offset: 4px; border-radius: 4px; color: var(--color-gold-deep) !important; }
.lu-sep { height: 1px; margin: 2.5rem 0; background: var(--color-line); }
.lu-sub { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 600; line-height: 1.15; letter-spacing: -0.025em; color: var(--color-ink); margin-bottom: 1.25rem; }
.section--warm .au-photo--person { box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .3); }
/* Startseite: Kachel Unfallgutachten als Link */
a.svc-card-link { display: block; height: 100%; color: inherit; text-decoration: none; border-radius: 1.5rem; }
a.svc-card-link .svc-card { height: 100%; }
.svc-card__more { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1rem; font-weight: 500; font-size: var(--text-base); color: var(--color-gold-deep); }
a.svc-card-link:hover .svc-card__more { text-decoration: underline; text-underline-offset: 3px; }
a.svc-card-link:focus-visible { outline: 2px solid var(--color-gold); outline-offset: 4px; }
@media (min-width: 1200px) { .lu-value .tile-title { font-size: 1.15rem; } }
@media (min-width: 1024px) { .lu-hero .au-hero__inner { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 3rem; } }
/* Leistungsseiten: weitere Bausteine (KFZ-Wertgutachten) */
.page-hero__text.lu-hero-more { margin-top: 1rem; }
.section--warm .lu-value { background: #fff; }
.lu-info-tile { min-height: 0; gap: .5rem; }
.lu-important { max-width: 42rem; margin: 1.25rem auto 0; text-align: center; color: var(--color-ink); font-size: var(--text-lg); line-height: 1.5; }
.lu-tile-h2 { font-size: var(--text-2xl); margin-bottom: .75rem; }
.lu-tile-btn { margin-top: 1.75rem; }
.lu-ready { max-width: 42rem; margin: 4rem auto 0; text-align: center; color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }
.lu-sub--sm { font-size: var(--text-xl); margin: 1.75rem 0 .5rem; }
.lu-ready .lu-sub--sm { margin-top: 0; }
.lu-case-facts { color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.625; }
.lu-ph { display: flex; align-items: center; justify-content: center; padding: 2rem; text-align: center; background: var(--color-bg-warm); border: 2px dashed var(--color-gold); box-shadow: none; }
.lu-ph .lu-todo { outline: none; }
@media (min-width: 768px) and (max-width: 1023px) { .lu-tiles .tile { padding: 1.5rem; } .lu-tiles .tile-title { font-size: 1.35rem; } .lu-split { grid-template-columns: minmax(0, 1fr); } .lu-split .lu-photo--tall, .lu-split .au-photo { max-width: 26rem; margin-inline: auto; } }
.lu-nw, .lu-nw-all { white-space: nowrap; }
@media (max-width: 480px) { .cost-head--wide .section-title { font-size: 9vw; } }
.cost-head--wide { max-width: 64rem; }
.cost-head--wide .cost-sub { margin-inline: auto; }
.lu-title-fit { font-size: clamp(2rem, 1.4rem + 2vw, 3.4rem); }
/* =========================================================
   RATGEBER (/ratgeber/...)
   ========================================================= */
.rg-title { max-width: 60rem; font-size: clamp(2.4rem, 1.5rem + 4.2vw, 5.25rem); line-height: 1.04; }
.rg-hero-cta { max-width: 44rem; margin: 3rem auto 0; padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: 1.5rem; background: var(--color-bg-warm); }
.rg-hero-cta__q { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; line-height: 1.25; letter-spacing: -0.02em; color: var(--color-ink); }
.rg-hero-cta__t { margin-top: .75rem; color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.6; }
.rg-hero-cta .nf-buttons { margin-top: 1.5rem; }
.rg-h2-big { font-size: var(--text-4xl); }
.rg-table { max-width: 60rem; margin: 0 auto; border-radius: 1.5rem; overflow: hidden; background: #fff; box-shadow: 0 20px 50px -30px rgba(0, 0, 0, .25); }
.rg-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: .35rem; padding: 1.25rem 1.5rem; border-top: 1px solid var(--color-line-soft); color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.55; }
@media (min-width: 768px) { .rg-row { grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 2rem; padding: 1.4rem 2rem; } }
.rg-row:first-child { border-top: 0; }
.rg-row--head { display: none; background: var(--color-ink); color: #fff; font-size: var(--text-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
@media (min-width: 768px) { .rg-row--head { display: grid; } .rg-row--head + .rg-row { border-top: 0; } }
.rg-cell-k { font-family: var(--font-display); font-weight: 600; color: var(--color-ink); font-size: var(--text-lg); letter-spacing: -0.01em; }
.rg-note { margin-top: 1.5rem; padding: 1.25rem 1.5rem; border-left: 3px solid var(--color-gold); border-radius: 0 1rem 1rem 0; background: #fff; color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.6; }
.rg-note strong, .rg-article strong, .lu-important strong { color: var(--color-ink); }
.rg-note--center { max-width: 60rem; margin: 2rem auto 0; }
.rg-article .rg-note { background: var(--color-bg-warm); }
.rg-price { gap: .25rem; }
.rg-price__num { font-family: var(--font-body); font-size: clamp(2.6rem, 1.8rem + 3vw, 4rem); font-weight: 400; line-height: 1; letter-spacing: -0.04em; color: #fff; margin-top: .75rem; }
.rg-price__unit { color: var(--color-gold-soft); font-size: var(--text-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin: .5rem 0 .75rem; }
.rg-price__hint { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .14); color: rgba(255, 255, 255, .6); font-size: var(--text-sm); line-height: 1.55; }
.rg-price__hint strong { color: #fff; }
.rg-split { align-items: start; }
.rg-white-tiles .tile { background: #fff; }
.rg-article { max-width: 46rem; }
.rg-block + .rg-block { margin-top: clamp(3.5rem, 7vw, 5.5rem); padding-top: clamp(3.5rem, 7vw, 5.5rem); border-top: 1px solid var(--color-line-soft); }
.rg-block > p, .rg-box p { color: var(--color-ink-soft); font-size: var(--text-lg); line-height: 1.7; }
.rg-block > p + p, .rg-block > .rg-box + p, .rg-block > p + .rg-box, .rg-block > .rg-examples + p, .rg-block > p + .rg-examples, .rg-block > p + .rg-note { margin-top: 1.25rem; }
.rg-h2 { font-family: var(--font-display); font-size: var(--text-3xl, clamp(1.9rem, 1.4rem + 1.9vw, 3rem)); font-weight: 600; line-height: 1.12; letter-spacing: -0.035em; color: var(--color-ink); margin-bottom: 1.5rem; }
.rg-h3 { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; color: var(--color-ink); margin-bottom: .6rem; }
.rg-box { padding: clamp(1.4rem, 3vw, 2rem); border-radius: 1.25rem; background: var(--color-bg-warm); }
.rg-box p { font-size: var(--text-base); line-height: 1.65; }
.rg-examples { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 640px) { .rg-examples { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rg-quote { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: .5rem 0 1.25rem; }
.rg-quote > div { padding: 1.1rem 1.25rem; border-radius: 1rem; background: #fff; }
.rg-quote__num { display: block; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); line-height: 1; letter-spacing: -0.04em; color: var(--color-ink); }
.rg-quote > div:first-child .rg-quote__num { color: var(--color-gold-deep); }
.rg-quote__lbl { display: block; margin-top: .4rem; color: var(--color-ink-muted); font-size: var(--text-sm); }
.rg-four { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; perspective: 1200px; }
@media (min-width: 640px) { .rg-four { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .rg-four { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rg-four .tile { background: #fff; }
.rg-four .tile-title { font-size: var(--text-xl); }
.rg-sources { padding: 3.5rem clamp(1.25rem, 4vw, 2rem); background: var(--color-bg-warm); color: var(--color-ink-muted); font-size: var(--text-sm); line-height: 1.6; }
.rg-sources__title { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 600; color: var(--color-ink); margin-bottom: .75rem; }
.rg-sources ul { list-style: disc; padding-left: 1.2rem; margin-bottom: 1rem; display: grid; gap: .3rem; }
.rg-sources a { color: var(--color-ink-soft); text-decoration: underline; text-underline-offset: 2px; }
.rg-sources p + p { margin-top: .25rem; }
/* Verweise auf den Kosten-Ratgeber */
.usp__item a { color: inherit; text-decoration: none; }
.usp__item a:hover { text-decoration: underline; text-underline-offset: 3px; }
.lu-more { margin-top: 2rem; text-align: center; }
.lu-more a, .faq-more a, .cost-more { display: inline-flex; align-items: center; gap: .35rem; font-weight: 500; color: var(--color-gold-deep); }
.lu-more a:hover, .faq-more a:hover, .cost-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.cost-more { margin-top: 1.5rem; font-size: var(--text-base); }
.faq-more { margin-top: 1.25rem; }
/* Ratgeber Wertminderung */
.wm-calc { margin-top: .75rem; display: grid; }
.wm-calc__row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .75); font-size: var(--text-base); }
.wm-calc__row span:last-child { font-variant-numeric: tabular-nums; color: #fff; font-size: var(--text-xl); white-space: nowrap; }
.wm-calc__row--sum { border-bottom: 0; color: var(--color-gold-soft); font-weight: 600; }
.wm-calc__row--sum span:last-child { color: var(--color-gold-soft); font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); }
.cost-head .cost-sub + .cost-sub { margin-top: 1rem; }
.wm-steps-title { text-align: center; margin-bottom: 2.5rem; }
.wm-more { margin-top: 1rem; }
.lu-tile-more { display: inline-flex; gap: .35rem; margin-top: .9rem; font-weight: 500; font-size: var(--text-sm); color: var(--color-gold-deep); }
.lu-tile-more:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 768px) and (max-width: 1023px) { .rg-steps .step__title { font-size: 1.4rem; } }
/* Leistungsseite Gebrauchtwagencheck */
.gc-tip { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--color-line); }
.gc-list { list-style: none; margin: 1.25rem 0; padding: 0; display: grid; gap: .6rem; }
.gc-list li { position: relative; padding-left: 1.6rem; color: var(--color-ink); font-size: var(--text-lg); line-height: 1.5; }
.gc-list li::before { content: ""; position: absolute; left: .2rem; top: .62em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--color-gold); }
.gc-btn { margin-top: 1.25rem; }
.svc-more { margin-top: 2.5rem; text-align: center; color: var(--color-ink-soft); font-size: var(--text-lg); }
.svc-more a { display: inline-flex; align-items: center; gap: .35rem; font-weight: 500; color: var(--color-gold-deep); }
.svc-more a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 480px) { .contact__buttons .btn { white-space: normal; text-align: center; line-height: 1.25; } }
.lu-buttons .btn-lg { padding-inline: 1.6rem; }
@media (max-width: 480px) { .lu-buttons .btn, .nf-buttons .btn { white-space: normal; text-align: center; line-height: 1.25; max-width: 100%; } }
.cost-grid + .lu-important { margin-top: 2rem; }
/* Leistungsseite Leasingrückgabe */
.lr-hero-buttons { margin-top: 2.25rem; }
@media (min-width: 768px) { .lr-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lr-row span[role="cell"] { position: relative; padding-left: 1.6rem; color: var(--color-ink); font-size: var(--text-base); }
.lr-row .lr-ok::after, .lr-row .lr-bad::after { content: ""; position: absolute; left: .15rem; top: .55em; width: .55rem; height: .55rem; border-radius: 50%; }
.lr-row .lr-ok::after { background: #1e8e3e; }
.lr-row .lr-bad::after { background: var(--color-gold); }
@media (max-width: 767px) {
  .lr-row { gap: .9rem; }
  .lr-row .lr-ok::before, .lr-row .lr-bad::before { display: block; margin-bottom: .15rem; font-size: var(--text-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--color-ink-muted); }
  .lr-row .lr-ok::before { content: "Normale Gebrauchsspur"; }
  .lr-row .lr-bad::before { content: "Möglicher Schaden"; }
  .lr-row .lr-ok::after, .lr-row .lr-bad::after { top: 2.05em; }
}
.rg-four--warm .tile { background: var(--color-bg-warm); }
.lr-list { margin: 0; padding-left: 1.4rem; display: grid; gap: .5rem; color: var(--color-ink); }
.lr-list li::marker { color: var(--color-gold-deep); font-weight: 600; }
.lr-cta { margin-top: 2rem; }
.svc-more--next { margin-top: .75rem; }
@media (max-width: 480px) { .lr-cta .btn { white-space: normal; text-align: center; line-height: 1.25; max-width: 100%; } }
/* Startseite: breite Kachel unter den 6 Leistungen (Leasingrückgabe) */
.svc-wide { margin-top: 1.25rem; perspective: 1200px; }
.svc-card--wide { min-height: 0; }
@media (min-width: 768px) {
  .svc-card--wide { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 20rem; }
  .svc-card--wide .svc-card__img { aspect-ratio: auto; height: 100%; min-height: 20rem; }
  .svc-card--wide .svc-card__body { justify-content: center; padding: 2.5rem 3rem; }
}
@media (min-width: 1024px) {
  .svc-card--wide { grid-template-columns: minmax(0, calc((100% - 2.5rem) * 2 / 3 + 1.25rem)) minmax(0, 1fr); }
  .svc-card--wide .svc-card__body { padding: 2.75rem 3.25rem; }
  .svc-card--wide .tile-body { max-width: 34rem; }
}
.svc-more a { display: inline; }
/* Vorteile-Leiste: verlinkter Punkt dezent als Link erkennbar */
.usp__item a { text-decoration: underline; text-decoration-color: var(--color-gold); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.usp__item a:hover { color: var(--color-gold-deep); }
/* Ratgeber Wirtschaftlicher Totalschaden */
.ts-title { font-size: clamp(2.3rem, 1.3rem + 3.3vw, 4.4rem); line-height: 1.04; }
.ts-hero-local { max-width: 36rem; margin: 1.5rem auto 0; padding: 1rem 1.25rem; border-left: 3px solid var(--color-gold); border-radius: 0 1rem 1rem 0; background: var(--color-bg-warm); color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.6; text-align: left; }
.ts-hero-local strong { color: var(--color-ink); }
@media (min-width: 1024px) { .ts-hero-local { margin-left: 0; } }
.ts-compare { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; max-width: 60rem; margin: 0 auto; }
@media (min-width: 768px) { .ts-compare { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ts-car:not(.tile-dark) { background: #fff; }
.ts-car:not(.tile-dark) .wm-calc__row { color: var(--color-ink-soft); border-bottom-color: var(--color-line-soft); }
.ts-car:not(.tile-dark) .wm-calc__row span:last-child { color: var(--color-ink); }
.ts-calc .wm-calc__row:last-child { border-bottom: 0; }
.ts-verdict { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: .5rem; width: fit-content; padding: .55rem 1rem; border-radius: 999px; font-weight: 600; font-size: var(--text-sm); }
.ts-verdict::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; }
.ts-verdict--ok { background: rgba(30, 142, 62, .1); color: #16702f; }
.ts-verdict--ok::before { background: #1e8e3e; }
.ts-verdict--total { background: rgba(212, 167, 58, .16); color: var(--color-gold-soft); }
.ts-verdict--total::before { background: var(--color-gold); }
.ts-small { text-align: center; max-width: 42rem; margin-inline: auto; }
.ts-checks { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: start; }
@media (min-width: 900px) { .ts-checks { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2rem; } .ts-checks__photo { position: sticky; top: calc(var(--header-h) + 1.5rem); } }
.ts-checks__photo { aspect-ratio: 4 / 5; max-width: 30rem; margin-inline: auto; }
.ts-checks__list { display: grid; gap: 1rem; }
.ts-checks__list .tile-title { font-size: var(--text-xl); }
.ts-contact-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
/* Ratgeber Gutachten oder Kostenvoranschlag */
/* Orientierung: Nummer, kleine Stufen-Anzeige, Einschätzung unten abgesetzt (ruhig, im Stil der übrigen Kacheln) */
.gk-level .tile-title { font-size: var(--text-xl); margin-bottom: 1.75rem; }
.gk-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.gk-top .tile-eyebrow { margin-bottom: 0; }
.gk-scale { display: inline-flex; gap: 4px; }
.gk-scale i { display: block; width: 18px; height: 4px; border-radius: 2px; background: rgba(29, 29, 31, .12); }
.gk-scale i.on { background: var(--color-gold); }
.tile-dark .gk-scale i { background: rgba(255, 255, 255, .16); }
.tile-dark .gk-scale i.on { background: var(--color-gold-soft); }
.gk-result { margin-top: auto; padding-top: 1.1rem; border-top: 1px solid rgba(29, 29, 31, .1); }
.tile-dark .gk-result { border-top-color: rgba(255, 255, 255, .14); }
.gk-label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-gold-deep); margin-bottom: .35rem; }
.tile-dark .gk-label { color: var(--color-gold-soft); }
.gk-text { margin: 0; font-size: var(--text-base); font-weight: 600; line-height: 1.4; color: var(--color-ink); }
.tile-dark .gk-text { color: #fff; }
.gk-col { gap: .25rem; }
.gk-list { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .8rem; }
.gk-list li { position: relative; padding-left: 1.5rem; font-size: var(--text-base); line-height: 1.5; color: var(--color-ink-soft); }
.tile-dark .gk-list li { color: rgba(255, 255, 255, .8); }
.gk-list li::before { content: ""; position: absolute; left: .15rem; top: .55em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--color-ink-muted); }
.tile-dark .gk-list li::before { background: var(--color-gold); }
.gk-box-white { background: #fff; }
.gk-more { margin-top: 1.5rem; }
.gk-more a { font-weight: 500; color: var(--color-gold-deep); }
.gk-more a:hover { text-decoration: underline; text-underline-offset: 3px; }
/* Ratgeber Fiktive Abrechnung */
.fa-check { list-style: none; max-width: 52rem; margin: 0 auto; padding: 0; display: grid; gap: .75rem; }
.fa-check__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: start; padding: 1.4rem 1.6rem; border-radius: 1.25rem; background: var(--color-bg-warm); }
@media (min-width: 768px) { .fa-check__item { gap: 2rem; padding: 1.6rem 2.2rem; } }
.fa-check__num { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); line-height: 1; letter-spacing: -0.04em; color: var(--color-gold-deep); font-variant-numeric: tabular-nums; padding-top: .1rem; }
.fa-check__title { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; letter-spacing: -0.02em; color: var(--color-ink); margin-bottom: .35rem; }
.fa-check__item p { color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.6; }
.fa-example { max-width: 52rem; margin: 1.5rem auto 0; }
.fa-calc-link { color: inherit; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .4); text-underline-offset: 3px; }

/* ===== Ratgeber Nutzungsausfall ===== */
.na-table { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; margin-top: 1rem; }
.na-row { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid rgba(255, 255, 255, .1); color: #fff; font-size: var(--text-base); font-variant-numeric: tabular-nums; }
.na-row span:first-child { color: rgba(255, 255, 255, .7); font-weight: 600; letter-spacing: .02em; }
.na-row--head { padding-top: 0; border-bottom-color: rgba(255, 255, 255, .22); }
.na-row--head span, .na-row--head span:first-child { color: var(--color-gold-soft); font-size: var(--text-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.na-row--top span:last-child { color: var(--color-gold-soft); font-weight: 600; }
@media (max-width: 380px) { .na-table { column-gap: 1rem; } .na-row { font-size: var(--text-sm); } }
.na-note-warm { background: var(--color-bg-warm); }
.section--warm .na-note-warm { background: #fff; }
.fa-check--white .fa-check__item { background: #fff; }
.na-left-btn { justify-content: flex-start; }

/* Mehr-Links in Kacheln immer unten, in einer Linie (egal wie lang der Text ist) */
.svc-card:not(.svc-card--wide) .svc-card__body { justify-content: flex-start; }
.svc-card:not(.svc-card--wide) .svc-card__more { margin-top: auto; padding-top: 1.25rem; align-self: flex-start; }
.tile > .lu-tile-more { margin-top: auto; padding-top: 1rem; align-self: flex-start; }

/* Verlinkte Wörter im Text: goldbraun wie die Mehr-Links */
.text-link, .usp__item a {
  color: var(--color-gold-deep); font-weight: 500;
  text-decoration: underline; text-decoration-color: rgba(139, 110, 34, .35); text-decoration-thickness: 1px; text-underline-offset: 3px;
  transition: color .2s ease, text-decoration-color .2s ease;
}
.text-link:hover, .text-link:focus-visible, .usp__item a:hover, .usp__item a:focus-visible { color: #6e5618; text-decoration-color: currentColor; }
.contact .text-link, .contact .ts-contact-link, .tile-dark .text-link, .trust-lead .text-link {
  color: var(--color-gold-soft); font-weight: 500;
  text-decoration: underline; text-decoration-color: rgba(212, 167, 58, .45); text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.contact .text-link:hover, .contact .ts-contact-link:hover, .tile-dark .text-link:hover, .trust-lead .text-link:hover { color: #e6c46a; text-decoration-color: currentColor; }

/* ===== Leistung Reparaturbestätigung ===== */
.rb-checks { margin: 1.25rem 0 0 !important; align-items: flex-start; text-align: left; }
.rb-checks li span { color: var(--color-ink-soft); }
.rb-note-white { margin-top: 1.5rem; }
.rb-lead { font-size: var(--text-lg); color: var(--color-ink); }
.au-hero .rb-title { font-size: clamp(2.1rem, 1rem + 3.2vw, 4.1rem); }
/* Ratgeber Parkschaden */
.ps-after { margin-top: 1.25rem; }
.rg-white-tiles .tile.tile-dark { background: var(--color-ink); }

/* ===== Hinweise im Kachel-Stil der Website (statt Goldkante) ===== */
.rg-note, .rg-article .rg-note, .na-note-warm {
  border-left: 0; border-radius: 1.25rem; padding: 1.5rem 1.75rem;
  background: var(--color-bg-warm); color: var(--color-ink-soft); font-size: var(--text-base); line-height: 1.6;
}
.section--warm .rg-note, .section--warm .rg-article .rg-note, .section--warm .na-note-warm, .rb-note-white { background: #fff; }
.rg-note__label {
  display: block; margin-bottom: .5rem;
  font-family: var(--font-body); font-size: var(--text-sm); font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: var(--color-gold-deep);
}
.ts-hero-local { border-left: 0; border-radius: 1.25rem; padding: 1.1rem 1.4rem; background: var(--color-bg-warm); }

/* USP-Leiste: Linien-Icons im Stil der Siegel */
.usp__icon { display: inline-flex; flex-shrink: 0; color: var(--color-gold); }
.usp__icon svg { width: 1.35rem; height: 1.35rem; display: block; filter: drop-shadow(0 1px 1px rgba(110, 85, 20, .25)); }
.section--warm .rg-box { background: #fff; }
/* Leistung Kaskogutachten */
.ks-stack { display: grid; gap: 1rem; }
.ks-stack .tile { padding: 1.6rem 1.75rem; }
.ks-stack .tile-title { font-size: var(--text-xl); margin-bottom: .4rem; }

/* ===== Footer mit Leistungen und Ratgeber ===== */
.footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
.footer__brand { grid-column: 1 / -1; }
.footer__grid > div:nth-child(2) { grid-column: 1 / -1; }
@media (min-width: 768px) {
  .footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3rem 2.5rem; }
  .footer__brand { grid-column: 1 / -1; }
  .footer__grid > div:nth-child(2) { grid-column: auto; }
}
@media (min-width: 1100px) {
  .footer__grid { grid-template-columns: minmax(0, 1.5fr) repeat(4, minmax(0, 1fr)); gap: 3rem; }
  .footer__brand { grid-column: auto; }
}
.footer__list a.footer__all { color: var(--color-gold-deep); font-weight: 500; }
.footer__list a.footer__all:hover { color: var(--color-ink); }

/* ===== Sichtbare Brotkrumen ===== */
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0 0 1.25rem; font-size: var(--text-sm); color: var(--color-ink-muted); }
.crumbs a { color: var(--color-ink-muted); text-decoration: none; }
.crumbs a:hover { color: var(--color-gold-deep); }
.crumbs span[aria-current] { color: var(--color-ink-soft); }
.crumbs .crumbs__sep { color: var(--color-line); }
@media (max-width: 1023px) { .au-hero .crumbs { justify-content: center; } }

/* ===== Übersichtsseiten Leistungen / Ratgeber ===== */
.hub-hero .page-hero__inner { text-align: center; }
.hub-hero .crumbs { justify-content: center; }
.hub-hero .lu-buttons { justify-content: center; }
.hub-hero .page-hero__text { margin-inline: auto; max-width: 44rem; }
.hub-grid .tile { position: relative; }
.hub-link { color: inherit; text-decoration: none; }
.hub-link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: 1; }
.hub-grid .tile:hover .lu-tile-more { color: var(--color-ink); }
.hub-link:focus-visible { outline: none; }
.hub-grid .tile:has(.hub-link:focus-visible) { outline: 2px solid var(--color-gold); outline-offset: 3px; }
.tile-dark .lu-tile-more { color: var(--color-gold-soft); }
.tile-dark .lu-tile-more > span[aria-hidden] { border-color: rgba(212, 167, 58, .5); }
/* Lange Unterzeilen im Hero dürfen umbrechen (sonst abgeschnitten) */
@media (min-width: 1024px) { .au-hero .au-hero-sub { white-space: normal; font-size: clamp(1.45rem, .85rem + 1vw, 1.95rem); } }
/* Foto-Platzhalter (bis eigenes Foto da ist) */
.lu-photo--placeholder { background: linear-gradient(150deg, #c9ccd1 0%, #9aa0a6 50%, #6b7076 100%); }
.lu-more--next { margin-top: .75rem; }
.lu-photo__ph { width: 100%; height: 100%; }
/* Ratgeber: Formulierungshilfe als dunkle Kachel */
.vg-quote { max-width: 52rem; margin: 0 auto; padding: clamp(1.75rem, 4vw, 2.75rem); }
.vg-quote__text { margin-top: .5rem; color: #fff; font-family: var(--font-display); font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); line-height: 1.4; letter-spacing: -0.015em; }
/* Kachel-Links: Pfeil bleibt beim Text, auch wenn er umbricht */
.lu-tile-more { display: inline-block; }

/* Ratgeber-Übersicht: Gruppen mit 2 und 3 Kacheln */
@media (min-width: 1100px) { .rg-four.rg-four--two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 56rem; margin-inline: auto; } }
@media (min-width: 900px) { .rg-four.rg-four--three { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 640px) and (max-width: 899px) { .rg-four.rg-four--three > :last-child { grid-column: span 2; } }

/* Hero: Hintergrundbild etwas dunkler */
.hero__bg { filter: brightness(.72); }

/* Vorteile-Leiste: braunes Band mit Schlagwörtern */
.usp.usp--brown { background: radial-gradient(ellipse 70% 180% at 50% 50%, rgba(212, 167, 58, .2) 0%, rgba(212, 167, 58, 0) 70%), #241d16; border: 0; }
.usp--brown .usp__inner { padding: 1.4rem 1rem; }
.usp__keys { list-style: none; margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; max-width: 64rem; }
.usp__keys li { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .55rem; color: #fff; font-size: .9rem; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; }
.usp__kic { display: inline-flex; }
.usp__kic svg { width: 1.6rem; height: 1.6rem; display: block; }
.usp--brown a { color: #fff; text-decoration: underline; text-decoration-color: var(--color-gold-soft); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.usp--brown a:hover, .usp--brown a:focus-visible { text-decoration-color: #fff; }
@media (min-width: 768px) {
  .usp--brown .usp__inner { padding: 1.6rem 2rem; }
  .usp__keys { display: flex; justify-content: center; gap: 0; }
  .usp__keys li { flex-direction: row; gap: .75rem; padding: 0 2.75rem; font-size: var(--text-lg); }
  .usp__keys li + li { border-left: 1px solid rgba(255, 255, 255, .25); }
}

/* Stadtseiten: Links im Einzugsgebiet */
.ezs__link { display: flex; align-items: center; gap: .85rem; flex: 1; color: inherit; text-decoration: none; }
.ezs__arrow { margin-left: auto; color: var(--color-gold-deep); font-weight: 600; transition: transform .15s ease; }
.ezs__link:hover .ezs__name { color: var(--color-gold-deep); }
.ezs__link:hover .ezs__arrow { transform: translateX(3px); }
a.ez-tile--link { text-decoration: none; color: inherit; box-shadow: inset 0 0 0 1.5px rgba(184, 145, 46, .45); }
.ez-tile__more { font-size: .8rem; font-weight: 600; color: var(--color-gold-deep); }
a.ez-tile--link:hover .ez-tile__name { color: var(--color-gold-deep); }
.ma-facts { margin-top: 1.25rem; font-size: var(--text-sm); color: var(--color-ink-muted); }
.ma-center { justify-content: center; margin-top: 2rem; }

/* Stadtseiten: Fotoplatzhalter und Bildunterschriften */
.lu-photo__ph { position: relative; }
.ma-ph { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 1.25rem; text-align: center; color: rgba(255, 255, 255, .92); font-size: var(--text-sm); line-height: 1.4; }
.ma-ph b { font-size: var(--text-base); font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #fff; }
.ma-cap { margin: .9rem 0 0; font-size: var(--text-sm); line-height: 1.5; color: var(--color-ink-muted); }
.ma-cap strong { color: var(--color-ink); font-weight: 600; }
.ma-wide { max-width: 44rem; margin: 3rem auto 0; }
.ma-wide__photo { aspect-ratio: 16 / 9; }
.ma-wide .ma-cap { text-align: center; }

/* Stadtseiten: dezenter Link zur Startseite nach den Nachweisen */
.ma-more { max-width: 40rem; margin: 3.5rem auto 0; padding-top: 2.25rem; border-top: 1px solid rgba(255, 255, 255, .12); text-align: center; }
.ma-more__title { margin: 0 0 .6rem; font-family: var(--font-display); font-size: var(--text-lg); font-weight: 600; letter-spacing: -.02em; color: #fff; }
.ma-more__text { margin: 0 0 1.1rem; font-size: var(--text-base); line-height: 1.6; color: rgba(255, 255, 255, .66); }
.ma-more__link { display: inline-block; font-weight: 600; color: var(--color-gold-soft); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; text-decoration-color: rgba(212, 167, 58, .5); }
.ma-more__link:hover, .ma-more__link:focus-visible { color: #fff; text-decoration-color: #fff; }
.trust .ma-more { grid-column: 1 / -1; justify-self: center; width: 100%; }

/* Stadtseiten: Vorteile mit grünem Haken unter den Hero-Buttons */
.ma-checks { list-style: none; margin: 1.25rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: var(--text-sm); font-weight: 500; color: var(--color-ink-soft); }
.ma-checks li { display: inline-flex; align-items: center; gap: .4rem; }
.ma-checks li::before { content: ""; flex: none; width: 1rem; height: 1rem; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328a745' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E"); }
@media (max-width: 1023px) { .au-hero .ma-checks { justify-content: center; } }
/* Haken immer nebeneinander */
.ma-checks { flex-wrap: nowrap; gap: .9rem; font-size: .8rem; line-height: 1.3; }
.ma-checks li { flex: 0 1 auto; min-width: 0; align-items: flex-start; gap: .3rem; }
.ma-checks li::before { width: .8rem; height: .8rem; margin-top: .12rem; }
@media (max-width: 639px) { .ma-checks { gap: .55rem; font-size: .75rem; } .ma-checks li { text-align: left; } }
@media (max-width: 639px) { .ma-checks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); font-size: .72rem; gap: .5rem; } }
/* Stadtseiten: Hero-Textblock etwas höher */
.ma-hero .au-hero__inner { padding-top: 3rem; }
@media (max-width: 767px) { .ma-hero .au-hero__inner { padding-top: 2rem; } }
/* Stadtseiten: Linie unter dem Hero durchgehend und hellgrau */
.ma-hero + .au-divider { max-width: none; padding-inline: 0; }
.ma-hero + .au-divider::before { background: var(--color-line); height: 1px; }
/* Stadtseiten: Hero-Text bündig mit dem Logo */
@media (min-width: 768px) { .ma-hero .au-hero__inner { max-width: 80rem; padding-inline: 1.5rem; } }
/* Marburg: Foto links, Text rechts; Foto beginnt auf Höhe der Überschrift */
@media (min-width: 1024px) {
  .ma-split-rev > :first-child { order: 2; }
  .ma-split-rev > :last-child { order: 1; align-self: start; margin-top: 6.75rem; }
}
.lu-split .ma-cap { max-width: 26rem; margin-inline: auto; }

/* ===== Marburg im Startseiten-Design ===== */
.ma-hero2 .crumbs { margin-bottom: 1rem; }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: rgba(255, 255, 255, .78); }
.ma-hero2 .crumbs a:hover { color: #fff; }
.ma-hero2 .crumbs [aria-current] { color: #fff; }
.ma-hero2 .hero__eyebrow { color: var(--color-gold-soft); }
.ma-hero2__sub { font-weight: 600; color: #fff; margin-bottom: .25rem; }
.ma-hero2__more { font-size: var(--text-base); }
.ma-hero2 .ma-checks { color: rgba(255, 255, 255, .88); }
.ma-hero2 .ma-checks li::before { filter: brightness(1.35); }
.ma-lead { margin: 1rem 0 0; max-width: 40rem; font-size: var(--text-base); line-height: 1.6; color: var(--color-ink-soft); }
.ma-feature-more { margin-top: 1.25rem; }
.ma-feature-link { color: var(--color-gold-soft); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(212, 167, 58, .5); }
.ma-feature-link:hover { color: #fff; }
.ma-hero2 .crumbs { order: 0; }
.ma-hero2 .ma-checks { order: 5; margin-top: 1.1rem; }
.ma-hero2 .ma-hero2__sub { margin-top: 1rem; font-size: var(--text-lg); }
.ma-hero2 .ma-hero2__sub + .hero__lead { margin-top: .75rem; }
.ma-hero2 .ma-hero2__more { margin-top: .75rem; color: rgba(255, 255, 255, .8); }
#nachweise .seal { grid-column: 1 / -1; width: 100%; }
@media (min-width: 1200px) {
  .ma-hero2 .ma-checks li { white-space: nowrap; }
  .usp--brown .usp__keys li { white-space: nowrap; }
}

/* Marburg: App-Icons (goldener Verlauf, weißes Symbol) in den Vorbereitungs-Kacheln */
.ma-ic { display: inline-flex; align-items: center; justify-content: center; width: 2.9rem; height: 2.9rem; margin-bottom: 1.1rem; border-radius: .9rem; color: #fff; background: linear-gradient(145deg, #e8c66a 0%, #b8912e 55%, #8b6e22 100%); box-shadow: 0 8px 16px -6px rgba(139, 110, 34, .55), inset 0 1px 0 rgba(255, 255, 255, .4); }
.ma-ic svg { width: 1.4rem; height: 1.4rem; display: block; }
/* Marburg: Vorbereitungs-Kacheln ohne Kartenhintergrund */
.ma-plain-tiles .tile { background: transparent !important; box-shadow: none !important; border: 0 !important; padding-inline: 0; }
.ma-plain-tiles .tile:hover { transform: none; box-shadow: none; }
#leistungen .svc-card-link { max-width: 100%; }
#leistungen .svc-card__more { white-space: normal; }
/* Marburg: Icons ohne Quadrat, golden gefüllt wie bei den drei Schritten */
.ma-ic { width: auto; height: auto; background: none; box-shadow: none; border-radius: 0; margin-bottom: 1rem; }
.ma-ic svg { width: 2.4rem; height: 2.4rem; filter: drop-shadow(0 2px 2px rgba(110, 85, 20, .28)); }
.ma-ic { align-self: flex-start; justify-content: flex-start; }
/* Marburg: Hero-Text wieder bündig mit dem Logo */
@media (min-width: 768px) { .ma-hero2 .hero__content { max-width: 80rem; padding-inline: 1.5rem; } }
/* Marburg: Hero ohne Vollbild-Foto, Bild als Karte rechts neben dem Text */
.ma-hero2 { background: radial-gradient(ellipse 55% 75% at 78% 55%, rgba(212, 167, 58, .16), rgba(212, 167, 58, 0) 70%), linear-gradient(160deg, #1c1c1e 0%, #141414 60%, #121110 100%); }
.ma-hero2 .hero__bg, .ma-hero2 .hero__shade { display: none; }
.ma-hero2__photo { display: none; position: relative; margin: 0; width: 100%; max-width: 34rem; aspect-ratio: 4 / 5; border-radius: 1.5rem; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6), 0 0 0 1px rgba(255, 255, 255, .06); }
.ma-hero2__photo img:first-child { width: 100%; height: 100%; object-fit: cover; object-position: 68% center; display: block; }
.ma-hero2__photo .svc-logo { position: absolute; right: 1rem; bottom: 1rem; width: 2.6rem; height: auto; opacity: .85; }
@media (min-width: 768px) {
  .ma-hero2__photo { display: block; }
  .ma-hero2 .hero__side { align-items: center; justify-content: flex-end; }
}

/* Marburg: heller Hero mit goldenem Lichtverlauf von oben rechts */
main .hero.ma-hero2 {
  background:
    radial-gradient(
      ellipse 105% 130% at 100% 0%,
      #d4bca2 0%,
      rgba(212, 188, 162, .85) 22%,
      rgba(212, 188, 162, .65) 40%,
      rgba(212, 188, 162, .42) 56%,
      rgba(212, 188, 162, .2) 72%,
      rgba(212, 188, 162, .06) 88%,
      rgba(212, 188, 162, 0) 100%
    ),
    #fff;
  color: var(--color-ink);
}
.ma-hero2 .hero__title { color: var(--color-ink); }
.ma-hero2 .hero__lead, .ma-hero2 .ma-hero2__more { color: var(--color-ink-soft); }
.ma-hero2 .ma-hero2__sub { color: var(--color-ink); }
.ma-hero2 .hero__eyebrow { color: var(--color-gold-deep); }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: var(--color-ink-muted); }
.ma-hero2 .crumbs [aria-current] { color: var(--color-ink); }
.ma-hero2 .crumbs a:hover { color: var(--color-ink); }
.ma-hero2 .ma-checks { color: var(--color-ink-soft); }
.ma-hero2 .ma-checks li::before { filter: none; }
.ma-hero2__photo { box-shadow: 0 30px 60px -24px rgba(29, 29, 31, .35), 0 0 0 1px rgba(29, 29, 31, .04); }

/* Marburg: Vorteile-Leiste hell statt braun, goldene Icons, Link ohne Unterstrich */
.usp.usp--brown.ma-band-light { background: #fff; border-top: 1px solid var(--color-line-soft); border-bottom: 1px solid var(--color-line-soft); }
.ma-band-light .usp__keys li { color: var(--color-ink); font-weight: 600; }
.ma-band-light .usp__keys li + li { border-left-color: var(--color-line); }
.ma-band-light a { color: inherit; text-decoration: none; }
.ma-band-light a:hover, .ma-band-light a:focus-visible { color: var(--color-gold-deep); text-decoration: none; }
.ma-band-light .usp__kic svg { filter: drop-shadow(0 1px 1px rgba(110, 85, 20, .25)); }

/* Marburg: Hero mit einfarbigem Braun, helle Schrift */
main .hero.ma-hero2 { background: #5b4535; color: #fff; }
.ma-hero2 .hero__title, .ma-hero2 .ma-hero2__sub { color: #fff; }
.ma-hero2 .hero__lead { color: rgba(255, 255, 255, .88); }
.ma-hero2 .ma-hero2__more { color: rgba(255, 255, 255, .75); }
.ma-hero2 .hero__eyebrow { color: #e3c37a; }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: rgba(255, 255, 255, .72); }
.ma-hero2 .crumbs [aria-current], .ma-hero2 .crumbs a:hover { color: #fff; }
.ma-hero2 .ma-checks { color: rgba(255, 255, 255, .88); }
.ma-hero2 .ma-checks li::before { filter: brightness(1.4); }
.ma-hero2__photo { box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .08); }

/* Marburg: Hero im Stil der dunklen Karte (Schwarz mit warmem Goldschimmer) */
main .hero.ma-hero2 { background: radial-gradient(ellipse 60% 85% at 80% 55%, rgba(212, 167, 58, .18) 0%, rgba(212, 167, 58, .06) 45%, rgba(212, 167, 58, 0) 70%), var(--color-ink); }

/* Marburg: Schilder mit Icons rund um das Hero-Foto */
.ma-photo-wrap { position: relative; width: 100%; max-width: 36rem; padding: 2rem 1.5rem 2.25rem 2.75rem; }
.ma-photo-wrap .ma-hero2__photo { max-width: none; }
.ma-badges { list-style: none; margin: 0; padding: 0; }
.ma-badge { position: absolute; z-index: 2; display: flex; align-items: center; gap: .7rem; padding: .6rem 1rem .6rem .6rem; background: #fff; border-radius: 1rem; box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .55), 0 0 0 1px rgba(0, 0, 0, .04); color: var(--color-ink); line-height: 1.2; white-space: nowrap; }
.ma-badge__ic { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; border-radius: .75rem; background: linear-gradient(145deg, #e8c66a 0%, #b8912e 55%, #8b6e22 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4); }
.ma-badge__ic svg { display: block; }
.ma-badge__txt { display: flex; flex-direction: column; gap: .15rem; }
.ma-badge__txt strong { font-size: .95rem; font-weight: 700; letter-spacing: -.01em; }
.ma-badge__txt small { font-size: .72rem; color: var(--color-ink-muted); }
.ma-badge--tr { top: 3.5rem; right: 0; }
.ma-badge--ml { top: 47%; left: 0; }
.ma-badge--bl { bottom: 0; left: 16%; }
.ma-ring { position: absolute; z-index: 2; top: 0; left: .25rem; width: 7.25rem; height: 7.25rem; border-radius: 50%; background: #fff; box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .55); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--color-ink); }
.ma-ring__svg { position: absolute; inset: .3rem; width: calc(100% - .6rem); height: calc(100% - .6rem); }
.ma-ring__num { position: relative; font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.ma-ring__txt { position: relative; margin-top: .2rem; font-size: .66rem; font-weight: 600; line-height: 1.15; color: var(--color-ink-soft); }
@media (min-width: 768px) and (max-width: 1099px) {
  .ma-photo-wrap { padding: 1.5rem .75rem 2rem 1.5rem; }
  .ma-badge { padding: .45rem .75rem .45rem .45rem; gap: .5rem; }
  .ma-badge__ic { width: 2rem; height: 2rem; border-radius: .6rem; }
  .ma-badge__ic svg { width: 17px; height: 17px; }
  .ma-badge__txt strong { font-size: .8rem; }
  .ma-badge__txt small { font-size: .64rem; }
  .ma-ring { width: 5.75rem; height: 5.75rem; }
  .ma-ring__num { font-size: 1.25rem; }
  .ma-ring__txt { font-size: .58rem; }
  .ma-badge--bl { left: 6%; }
}
@media (max-width: 767px) { .ma-photo-wrap { display: none; } }

/* Marburg: Hero wieder im ursprünglichen Braun (etwas dunkler), helle Schrift */
main .hero.ma-hero2 { background: linear-gradient(135deg, #3b2c23 0%, #2e221b 55%, #261c16 100%); color: #fff; }
.ma-hero2 .hero__title, .ma-hero2 .ma-hero2__sub { color: #fff; }
.ma-hero2 .hero__lead { color: #fff; }
.ma-hero2 .ma-hero2__more { color: #fff; }
.ma-hero2 .hero__eyebrow { color: #e3c37a; }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: rgba(255, 255, 255, .72); }
.ma-hero2 .crumbs [aria-current], .ma-hero2 .crumbs a:hover { color: #fff; }
.ma-hero2 .ma-checks { color: rgba(255, 255, 255, .88); }
.ma-hero2 .ma-checks li::before { filter: brightness(1.4); }
.ma-hero2__photo { box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .08); }
.ma-hero2 .ma-badge, .ma-hero2 .ma-ring { box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .55), 0 0 0 1px rgba(0, 0, 0, .04); }

/* Marburg Handy: Breadcrumb ganz oben, darunter der Anruf-Button */
@media (max-width: 767px) {
  .ma-hero2 .hero__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .ma-hero2 .hero__text { display: contents; }
  .ma-hero2 .crumbs { order: -2; margin-bottom: 1rem; }
  .ma-hero2 .hero__side { order: -1; margin-bottom: 1.25rem; align-self: center; }
}

/* Marburg: Hero-Textblock weiter nach oben (Desktop/Tablet) */
@media (min-width: 768px) {
  main .hero.ma-hero2 { min-height: 0; }
  .ma-hero2 .hero__content { padding-top: 2rem; padding-bottom: 4rem; }
  .ma-hero2 .hero__grid { align-items: start; }
}

/* Marburg: drei echte Schadenfotos statt Platzhalter (Abschnitt Ablauf) */
.ma-wide { max-width: 56rem; }
.ma-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
@media (min-width: 768px) { .ma-trio { gap: 1.25rem; } }
.ma-trio__item { aspect-ratio: 4 / 5; border-radius: 1rem; box-shadow: 0 20px 50px -24px rgba(0, 0, 0, .3); }
@media (min-width: 768px) { .ma-trio__item { border-radius: 1.5rem; } }
.ma-trio__item img:first-child { display: block; width: 100%; height: 100%; object-fit: cover; }
.ma-trio__item .svc-logo { position: absolute; right: .6rem; bottom: .6rem; width: 1.6rem; height: auto; opacity: .85; }
@media (min-width: 768px) { .ma-trio__item .svc-logo { right: 1rem; bottom: 1rem; width: 2.2rem; } }

/* Marburg: letzte Leistungskarte unscharf als Weiterleitung zur Startseite */
.ma-teaser .svc-card { position: relative; }
.ma-teaser__blur { display: flex; flex-direction: column; flex: 1 1 auto; filter: blur(4px); transform: scale(1.04); pointer-events: none; user-select: none; }
.ma-teaser__over { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .7rem; padding: 1.5rem; text-align: center; background: rgba(245, 245, 247, .62); }
.ma-teaser__ic { display: inline-flex; align-items: center; justify-content: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; background: linear-gradient(145deg, #e8c66a 0%, #b8912e 55%, #8b6e22 100%); box-shadow: 0 10px 24px -8px rgba(139, 110, 34, .6); }
.ma-teaser__title { margin: .25rem 0 0; font-size: clamp(1.4rem, 1.1rem + .9vw, 1.85rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: var(--color-gold-deep); max-width: 14ch; }
.ma-teaser__link { font-size: var(--text-base); font-weight: 600; color: var(--color-gold-deep); }
.ma-teaser:hover .ma-teaser__link, .ma-teaser:focus-visible .ma-teaser__link { text-decoration: underline; text-underline-offset: .2em; }

/* Marburg: Schadenfotos zoomen beim Darüberfahren leicht heran (wie Einblicke auf der Startseite) */
.ma-trio__item { isolation: isolate; }
.ma-trio__item img:first-child { transition: transform .8s var(--ease-out-expo); }
.ma-trio__item:hover img:first-child { transform: scale(1.04); }
.ma-trio__item .svc-logo { z-index: 1; }
@media (prefers-reduced-motion: reduce) { .ma-trio__item img:first-child { transition: none; } .ma-trio__item:hover img:first-child { transform: none; } }

/* Marburg: Foto im Abschnitt "ganz Marburg" im Hochformat, mittig zum Textblock, mit deutlichem Schatten */
.lu-photo.ma-photo-land { aspect-ratio: 3 / 4; width: 100%; max-width: 24rem; margin-inline: auto; box-shadow: 0 28px 60px -20px rgba(29, 29, 31, .38), 0 10px 24px -10px rgba(29, 29, 31, .2), 0 0 0 1px rgba(29, 29, 31, .05); }
.lu-photo.ma-photo-land > img:first-child { object-position: 56% 50%; }
#vor-ort .lu-split { align-items: center; }
#vor-ort .lu-split .ma-cap { max-width: 24rem; }
@media (min-width: 768px) { #vor-ort .ma-split-rev > :last-child { align-self: center; margin-top: 0; } }

/* Marburg Hero: Schilder sauber im Zickzack angeordnet (links, rechts, links, rechts), gleicher Überstand auf beiden Seiten */
@media (min-width: 768px) {
  .ma-photo-wrap { padding: 2.25rem 2.25rem 2.25rem 2.25rem; }
  .ma-ring { top: 0; left: 0; }
  .ma-badge--tr { top: 29%; right: 0; left: auto; bottom: auto; transform: none; }
  .ma-badge--ml { top: 58%; left: 0; right: auto; bottom: auto; transform: translateY(-50%); }
  .ma-badge--bl { bottom: 13%; right: 0; left: auto; top: auto; transform: none; }
  .ma-hero2__photo .svc-logo { left: 1rem; right: auto; }
}
@media (min-width: 768px) and (max-width: 1099px) {
  .ma-photo-wrap { padding: 1.75rem 1.25rem; }
  .ma-badge__txt small { display: none; }
}

/* Marburg: "Was ist nach einem Unfall wichtig?" schlicht: weißer Hintergrund, goldene Icons ohne Fläche, feine Trennlinien */
.ma-qs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .ma-qs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ma-qs__item { display: flex; flex-direction: column; padding: 1.75rem 0; border-top: 1px solid var(--color-line-soft); }
.ma-qs__item:first-child { border-top: 0; padding-top: 0; }
@media (min-width: 900px) {
  .ma-qs__item { padding: .25rem 2.5rem; border-top: 0; border-left: 1px solid var(--color-line-soft); }
  .ma-qs__item:first-child { padding-top: .25rem; padding-left: 0; border-left: 0; }
  .ma-qs__item:last-child { padding-right: 0; }
}
.ma-qs__ic { margin-bottom: 1.1rem; }
.ma-qs__ic svg { display: block; width: 2.25rem; height: 2.25rem; filter: drop-shadow(0 2px 2px rgba(110, 85, 20, .28)); }
.ma-qs__title { margin: 0 0 .6rem; font-size: clamp(1.15rem, 1.05rem + .35vw, 1.3rem); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--color-ink); }
.ma-qs__text { margin: 0; color: var(--color-ink-soft); line-height: 1.6; }
.ma-qs__link { margin-top: auto; padding-top: 1.1rem; font-size: var(--text-sm); font-weight: 600; color: var(--color-gold-deep); text-decoration: none; }
.ma-qs__link span { display: inline-block; transition: transform .3s ease; }
.ma-qs__link:hover span, .ma-qs__link:focus-visible span { transform: translateX(4px); }

/* Sprungziel auf der Startseite: Karte Ardijan Dulla (Link von den Stadtseiten) */
#ardijan-dulla { scroll-margin-top: calc(var(--header-h) + 3.5rem); }

/* Marburg: "Was ist nach einem Unfall wichtig?" wieder als Karten (hellgrau, abgerundet), goldene Icons ohne Fläche */
.ma-qs { gap: 1rem; }
@media (min-width: 900px) { .ma-qs { gap: 1.25rem; } }
.ma-qs__item, .ma-qs__item:first-child, .ma-qs__item:last-child { padding: 1.75rem; border: 0; border-radius: 1.5rem; background: var(--color-bg-warm); }
@media (min-width: 900px) { .ma-qs__item, .ma-qs__item:first-child, .ma-qs__item:last-child { padding: 2.25rem 2rem; border-left: 0; } }

/* Marburg: Leistungskarten Unfall und Kasko ohne Link, daher ohne Klick-Effekte (nur die unscharfe Karte ist klickbar) */
.ma-card-static { display: block; height: 100%; border-radius: 1.5rem; }
.ma-card-static .svc-card { height: 100%; transform: none !important; }
.ma-card-static .service-tile:hover { box-shadow: none; }
.ma-card-static .service-tile:hover .service-tile-photo { transform: none; filter: none; }

/* Marburg: "Was ist nach einem Unfall wichtig?" ohne Icons, dafür größere Schrift */
.ma-qs__title { margin-bottom: .85rem; font-size: clamp(1.4rem, 1.15rem + .8vw, 1.75rem); line-height: 1.2; letter-spacing: -.02em; }
.ma-qs__text { font-size: 1.0625rem; line-height: 1.65; }
@media (min-width: 900px) { .ma-qs__text { font-size: 1.125rem; } }

/* Marburg Nachweise: Weg zur Startseite als ruhige Vorschau-Leiste (drei echte Fotos, kurzer Text, goldener Button) */
.trust .ma-more2 { grid-column: 1 / -1; }
.ma-more2 { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; margin-top: 3.5rem; padding: 1.75rem 1.5rem; border: 1px solid rgba(255, 255, 255, .1); border-radius: 1.5rem; background: rgba(255, 255, 255, .035); color: #fff; text-align: center; text-decoration: none; transition: border-color .35s ease, background-color .35s ease; }
@media (min-width: 900px) { .ma-more2 { flex-direction: row; gap: 2rem; padding: 1.5rem 2rem 1.5rem 1.75rem; text-align: left; } }
.ma-more2:hover, .ma-more2:focus-visible { border-color: rgba(212, 167, 58, .45); background: rgba(255, 255, 255, .055); }
.ma-more2__pics { display: flex; flex: none; }
.ma-more2__pics img { width: 3.75rem; height: 4.5rem; object-fit: cover; border-radius: .75rem; border: 2px solid #1d1d1f; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .6); transition: transform .4s var(--ease-out-expo); }
.ma-more2__pics img + img { margin-left: -1rem; }
.ma-more2__pics img:nth-child(1) { transform: rotate(-5deg); }
.ma-more2__pics img:nth-child(3) { transform: rotate(5deg); }
.ma-more2:hover .ma-more2__pics img:nth-child(1) { transform: rotate(-8deg) translateX(-4px); }
.ma-more2:hover .ma-more2__pics img:nth-child(3) { transform: rotate(8deg) translateX(4px); }
.ma-more2__txt { display: flex; flex-direction: column; gap: .35rem; flex: 1 1 auto; min-width: 0; }
.ma-more2__title { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 600; letter-spacing: -.02em; color: #fff; }
.ma-more2__text { font-size: var(--text-base); line-height: 1.55; color: rgba(255, 255, 255, .66); }
.ma-more2__btn { flex: none; display: inline-flex; align-items: center; gap: .4rem; padding: .8rem 1.35rem; border-radius: 999px; background: linear-gradient(145deg, #e8c66a 0%, #b8912e 60%, #9a7a26 100%); color: #1d1d1f; font-weight: 600; white-space: nowrap; box-shadow: 0 10px 22px -12px rgba(212, 167, 58, .7); }
.ma-more2__btn span { display: inline-block; transition: transform .3s ease; }
.ma-more2:hover .ma-more2__btn span { transform: translateX(4px); }

/* Marburg: Karten "Was ist nach einem Unfall wichtig?" verfeinert: goldener Akzentstrich, mehr Luft, feiner Rand */
.ma-qs__item, .ma-qs__item:first-child, .ma-qs__item:last-child { position: relative; padding: 2rem 1.75rem 2.1rem; background: linear-gradient(180deg, #f5f5f7 0%, #f8f8fa 100%); box-shadow: inset 0 0 0 1px rgba(29, 29, 31, .04); }
@media (min-width: 900px) { .ma-qs__item, .ma-qs__item:first-child, .ma-qs__item:last-child { padding: 2.5rem 2.25rem 2.6rem; } }
.ma-qs { counter-reset: maqs; }
.ma-qs__item { counter-increment: maqs; }
.ma-qs__title::before { content: counter(maqs, decimal-leading-zero); display: block; margin-bottom: .9rem; font-family: var(--font-body); font-size: var(--text-sm); font-weight: 600; letter-spacing: .08em; line-height: 1; color: var(--color-gold-deep); }
.ma-qs__text { max-width: 34rem; }

/* Footer heller grau */
.footer { background: #fafafb; }

/* Startseite: 8 Leistungskarten, ab 1200 px vier nebeneinander, darunter zwei nebeneinander */
@media (min-width: 1024px) and (max-width: 1199px) { .svc-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .svc-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; } }
@media (min-width: 1200px) {
  .svc-grid--four .svc-card__body { padding: 1.5rem 1.4rem 1.6rem; }
  .svc-grid--four .tile-title { font-size: 1.5rem; line-height: 1.15; overflow-wrap: anywhere; hyphens: auto; }
  .svc-grid--four .tile-body { font-size: .95rem; }
  .svc-grid--four .svc-card__more { font-size: .9rem; }
}

/* Trennlinie unter dem Hero (Über uns, Leistungen, Ratgeber): durchgehend, hellgrau */
.au-divider { max-width: none; padding-inline: 0; }
.au-divider::before { background: var(--color-line-soft); }

/* Namensschild am Foto: goldenes Prüfzeichen, Name kräftiger, Rolle dezent, weicher Schatten */
.au-photo__badge { flex-direction: row; align-items: center; gap: .75rem; padding: .8rem 1.15rem .8rem .85rem; border-radius: 1rem; background: rgba(255, 255, 255, .94); box-shadow: 0 14px 34px -14px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .6) inset; }
.au-photo__ic { display: inline-flex; flex: none; }
.au-photo__ic svg { display: block; width: 1.9rem; height: 1.9rem; filter: drop-shadow(0 2px 3px rgba(110, 85, 20, .3)); }
.au-photo__txt { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.au-photo__name { font-size: 1.0625rem; font-weight: 700; letter-spacing: -.015em; line-height: 1.2; }
.au-photo__role { font-size: .8125rem; font-weight: 500; letter-spacing: .01em; color: var(--color-ink-muted); line-height: 1.3; }

/* Startseite Einblicke: 12 Fotos, am Desktop vier nebeneinander (3 volle Reihen) */
@media (min-width: 1024px) { .insights { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; } }

/* Unterseiten (Leistungen, Ratgeber, Über uns, FAQ, Kontakt, Einzugsgebiet, Rechtliches): Hero-Text höher, Abstand zum Menü wie auf der Stadtseite Marburg. Startseite unverändert. */
main .page-hero .page-hero__inner { padding-top: 1rem; }
@media (min-width: 768px) {
  main .page-hero .page-hero__inner { padding-top: 2rem; }
  main .page-hero.au-hero .page-hero__inner { padding-top: 1.5rem; }
}
main .page-hero--legal .page-hero__inner { padding-top: 3rem; }
@media (min-width: 768px) {
  main .page-hero--legal .page-hero__inner { padding-top: 4rem; }
  main .page-hero--ez .page-hero__inner { padding-top: 1.25rem; }
}

/* Über uns: Google-Zusammenfassung ist jetzt ein Link zum Unternehmensprofil */
a.tsm-summary { color: inherit; text-decoration: none; cursor: pointer; }
a.tsm-summary:hover, a.tsm-summary:focus-visible { text-decoration: underline; text-underline-offset: .2em; }

/* Startseite Bewertungen: Buttons zum Google-Profil und zum Bewerten */
.reviews-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 2.5rem auto 0; padding: 0 1.25rem 4.5rem; }
@media (min-width: 768px) { .reviews-cta { padding-bottom: 6rem; } }
.reviews-cta__btn { display: inline-flex; align-items: center; gap: .55rem; }
.reviews-cta__btn.btn-primary svg { color: #f5c542; }
.reviews-cta__btn.btn-outline { background: #fff; }
.reviews-cta__btn.btn-outline:hover { color: #fff; }
@media (max-width: 479px) { .reviews-cta__btn { width: 100%; justify-content: center; } }
.reviews-cta__btn svg { flex: none; width: 18px; height: 18px; }

/* Bewertungskarten: alle gleich hoch, langer Text aufklappbar */
.reviews-marquee { padding-block: 1rem 2.5rem; }
.reviews-track { align-items: flex-start; }
.review-card {
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 14px 34px -16px rgba(0, 0, 0, .18);
  transition: transform .3s ease, box-shadow .3s ease;
}
@media (hover: hover) {
  .review-card:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(0, 0, 0, .04), 0 22px 44px -18px rgba(0, 0, 0, .24); }
}
.review-text { -webkit-line-clamp: 4; line-clamp: 4; height: calc(1.55em * 4); }
.review-card.is-open .review-text { -webkit-line-clamp: unset; line-clamp: unset; height: auto; }
.review-more {
  align-self: flex-start; margin-top: -.35rem; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--font-body); font-size: .95rem; font-weight: 500; color: var(--color-gold-deep);
}
.review-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.review-more.is-hidden { visibility: hidden; }

/* Über uns: Kundenstimmen etwas kleiner, damit längere echte Bewertungen passen */
.tsm__quote { font-size: .84rem; line-height: 1.5; }
.tsm--dark .tsm__quote { font-size: .95rem; line-height: 1.45; }
@media (max-width: 639px) { .tsm__quote { font-size: .8rem; } .tsm--dark .tsm__quote { font-size: .88rem; } }

/* Über uns: Kundenstimmen neu angeordnet: oben drei gleich hohe Karten, darunter Ron über die volle Breite */
.tsm-grid { grid-auto-rows: auto; }
.tsm--tall { grid-column: 1; grid-row: 1; }
.tsm--a { grid-column: 2; grid-row: 1; }
.tsm--b { grid-column: 3; grid-row: 1; }
.tsm--wide { grid-column: 1 / -1; grid-row: 2; }
@media (max-width: 639px) {
  .tsm--tall { grid-column: 1; grid-row: 1; }
  .tsm--b { grid-column: 2; grid-row: 1; }
  .tsm--a { grid-column: 1 / -1; grid-row: 2; }
  .tsm--wide { grid-column: 1 / -1; grid-row: 3; }
}

/* Weiterführende Links: Pfeil bleibt beim Umbruch direkt am letzten Wort */
.lu-more a, .faq-more a { display: inline; }

/* Unterseiten: Anfrage- und WhatsApp-Button am Computer immer nebeneinander */
@media (min-width: 1200px) { .lu-buttons .btn-lg { padding-inline: 1.4rem; } }

/* Unterseiten-Hero: Foto im Hochformat, genau so hoch wie der Textblock und mittig dazu */
.lu-hero .lu-photo--hero { aspect-ratio: 4 / 5; max-width: 24rem; margin-inline: auto; }
@media (min-width: 1024px) {
  .lu-hero .au-hero__inner { align-items: stretch; }
  .lu-hero .au-hero__art { position: relative; align-self: stretch; min-height: 26rem; container-type: size; }
  .lu-hero .lu-photo--hero { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: min(100cqh, 38rem, 133.33cqw); width: auto; max-width: 100%; aspect-ratio: 3 / 4; margin: 0; }
}

/* Zweispalter mit Bild links und Text rechts (Computer); auf dem Handy bleibt der Text oben */
@media (min-width: 1024px) { .lu-split--rev > :first-child { order: 2; } }

/* Stadtseite: Teaser-Karte besteht aus vier unscharfen Leistungskarten, darauf "Alle Leistungen ansehen" */
.ma-teaser--grid { position: relative; display: block; flex: 1 1 auto; width: 100%; height: 100%; min-height: 22rem; border-radius: 1.5rem; overflow: hidden; isolation: isolate; }
@media (min-width: 768px) { .ma-teaser--grid { min-height: 24rem; } }
.ma-tgrid { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: .6rem; filter: blur(7px) saturate(.9); opacity: .85; transform: scale(1.03); transition: filter .5s var(--ease-out-expo), opacity .5s var(--ease-out-expo), transform .6s var(--ease-out-expo); }
.ma-tcard { display: flex; flex-direction: column; min-height: 0; overflow: hidden; border-radius: 1.1rem; background: var(--color-bg-warm); }
.ma-tcard__img { flex: 1 1 auto; min-height: 0; background-size: cover; background-position: center; }
.ma-tcard__body { flex: none; padding: .75rem .85rem .85rem; }
.ma-tcard__eye { margin: 0 0 .2rem; font-size: .6rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--color-ink-muted); }
.ma-tcard__title { margin: 0; font-size: 1.05rem; font-weight: 700; letter-spacing: -.02em; color: var(--color-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ma-teaser--grid .ma-teaser__over { background: rgba(245, 245, 247, .55); }
.ma-teaser--grid .ma-teaser__title span { display: inline-block; transition: transform .35s var(--ease-out-expo); }
.ma-teaser--grid:hover .ma-tgrid, .ma-teaser--grid:focus-visible .ma-tgrid { filter: blur(5px) saturate(1); opacity: 1; transform: scale(1.05); }
.ma-teaser--grid:hover .ma-teaser__title span { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) { .ma-tgrid, .ma-teaser--grid .ma-teaser__title span { transition: none; } }

/* Stadtseiten-Hero: hell in warmem Champagner-Beige, Schrift dunkel */
main .hero.ma-hero2 { background: linear-gradient(135deg, #f8f2e7 0%, #fbf7f0 50%, #fdfbf7 100%); color: var(--color-ink); }
.ma-hero2 .hero__title, .ma-hero2 .ma-hero2__sub { color: var(--color-ink); }
.ma-hero2 .hero__lead, .ma-hero2 .ma-hero2__more { color: var(--color-ink-soft); }
.ma-hero2 .hero__eyebrow { color: var(--color-gold-deep); }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: var(--color-ink-muted); }
.ma-hero2 .crumbs [aria-current], .ma-hero2 .crumbs a:hover { color: var(--color-ink); }
.ma-hero2 .ma-checks { color: var(--color-ink-soft); }
.ma-hero2 .ma-checks li::before { filter: none; }
.ma-hero2 .hero__call { background: var(--color-ink); color: #fff; }
.ma-hero2 .hero__call:hover { background: #000; }
.ma-hero2__photo { box-shadow: 0 30px 60px -24px rgba(29, 29, 31, .35), 0 0 0 1px rgba(29, 29, 31, .04); }

/* Stadtseiten-Hero: Foto wieder über den ganzen Hero-Bereich (wie Startseite), Schrift weiß */
main .hero.ma-hero2 { background: var(--color-ink); color: #fff; }
.ma-hero2 .hero__bg, .ma-hero2 .hero__shade { display: block; }
.ma-hero2 .hero__bg { background-position: 68% center; }
.ma-hero2 .ma-photo-wrap { display: none; }
.ma-hero2 .hero__title, .ma-hero2 .ma-hero2__sub, .ma-hero2 .hero__lead, .ma-hero2 .ma-hero2__more { color: #fff; }
.ma-hero2 .hero__eyebrow { color: #e3c37a; }
.ma-hero2 .crumbs, .ma-hero2 .crumbs a, .ma-hero2 .crumbs span { color: rgba(255, 255, 255, .78); }
.ma-hero2 .crumbs [aria-current], .ma-hero2 .crumbs a:hover { color: #fff; }
.ma-hero2 .ma-checks { color: rgba(255, 255, 255, .9); }
.ma-hero2 .ma-checks li::before { filter: brightness(1.4); }
.ma-hero2 .hero__call { background: #fff; color: var(--color-ink); }
.ma-hero2 .hero__call:hover { background: #f2f2f2; }
.ma-hero2 .hero__bg { filter: brightness(.44) contrast(1.05) saturate(.95); }

/* Stadtseite: Vertrauensband unter dem Hero als langsames Laufband mit Haken */
.ma-trust { position: relative; padding: 1.6rem 0 1.75rem; background: #fff; border-bottom: 1px solid var(--color-line-soft); overflow: hidden; }
.ma-trust__label { margin: 0 0 1.1rem; text-align: center; font-size: .95rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-ink); opacity: .38; }
.ma-trust__marquee { overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%); }
.ma-trust__track { display: flex; width: max-content; animation: ma-trust-move 60s linear infinite; }
.ma-trust__list { display: flex; flex: none; list-style: none; margin: 0; padding: 0; }
.ma-trust__list li { display: inline-flex; align-items: center; gap: .65rem; padding: 0 2.75rem; white-space: nowrap; font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; letter-spacing: -.02em; color: var(--color-ink); }
.ma-trust__chk { flex: none; width: 1.45rem; height: 1.45rem; color: #22a447; filter: drop-shadow(0 2px 4px rgba(34, 164, 71, .28)); }
@media (min-width: 768px) { .ma-trust { padding: 2rem 0 2.25rem; } .ma-trust__list li { font-size: 1.6rem; padding: 0 3.5rem; } .ma-trust__chk { width: 1.65rem; height: 1.65rem; } }
.ma-trust:hover .ma-trust__track { animation-play-state: paused; }
@keyframes ma-trust-move { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ma-trust__track { animation: none; } .ma-trust__marquee { overflow-x: auto; } }

/* Stadtseite: Google-Badge im Hero (ohne Ortsangabe) */
.ma-hero2 .hero__side .google-badge { position: relative; z-index: 2; }
@media (min-width: 768px) { .ma-hero2 .hero__side { align-self: center; align-items: center; justify-content: flex-end; } }

/* Stadtseite: echte Kundenstimme aus Marburg */
.ma-review-sec { padding-block: clamp(4rem, 8vw, 6.5rem); background: #fff; }
.ma-review { max-width: 44rem; margin: 0 auto; padding: clamp(1.75rem, 4vw, 2.75rem); border-radius: 1.5rem; background: #fff; border: 1px solid rgba(29, 29, 31, .06); box-shadow: 0 2px 4px rgba(29, 29, 31, .06), 0 12px 28px -8px rgba(29, 29, 31, .16), 0 36px 70px -24px rgba(29, 29, 31, .28); text-align: center; }
.ma-review__top { display: flex; align-items: center; justify-content: center; gap: .75rem; margin-bottom: 1.25rem; }
.ma-review__stars { display: inline-flex; gap: 2px; }
.ma-review__text { margin: 0; font-family: var(--font-display); font-size: clamp(1.2rem, 1rem + .8vw, 1.55rem); font-weight: 500; line-height: 1.45; letter-spacing: -.015em; color: var(--color-ink); }
.ma-review__by { display: inline-flex; align-items: center; gap: .75rem; margin-top: 1.5rem; text-align: left; }
.ma-review__av { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #1a73e8; color: #fff; font-weight: 600; }
.ma-review__by > span:last-child { display: flex; flex-direction: column; line-height: 1.3; }
.ma-review__by strong { font-size: 1rem; color: var(--color-ink); }
.ma-review__by strong + span { font-size: .85rem; color: var(--color-ink-muted); }
.ma-review__link { display: block; margin-top: 1.25rem; font-weight: 500; color: var(--color-gold-deep); text-decoration: none; }
.ma-review__link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Stadtseite "Ganz Marburg": Foto im Hochformat, oben und unten bündig mit dem Textblock */
@media (min-width: 1024px) {
  #vor-ort .lu-split { align-items: stretch; }
  #vor-ort .ma-split-rev > :last-child { position: relative; align-self: stretch; margin-top: 0; min-height: 26rem; }
  #vor-ort .lu-photo.ma-photo-land { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); height: 100%; width: auto; max-width: 100%; aspect-ratio: 3 / 4; margin: 0; }
  #vor-ort .au-profile__text > p:last-child { margin-bottom: 0; }
}
@media (min-width: 1024px) { .ma-hero2 .hero__side .google-badge { margin-right: 5rem; } }

/* Vier Kacheln nebeneinander (z. B. Stadtseite: So bereiten Sie die Begutachtung vor) */
@media (min-width: 640px) { .lu-values--4 .lu-value:last-child { grid-column: auto; } }
@media (min-width: 1200px) { .lu-values--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ma-review-head { text-align: center; margin-bottom: 2.5rem; }

/* Stadtseite Qualifikation: dunkler Hintergrund mit dezent eingeblendetem eigenem Schadensfoto */
#nachweise.section--dark { position: relative; isolation: isolate; overflow: hidden; }
#nachweise.section--dark::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url("assets/einblick-5.jpg") center 40% / cover no-repeat; opacity: .16; mix-blend-mode: luminosity; pointer-events: none; }
#nachweise.section--dark::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, #1d1d1f 0%, rgba(29, 29, 31, .9) 50%, rgba(29, 29, 31, .8) 100%); pointer-events: none; }

/* Stadtseite: "Sehen Sie sich unsere Arbeit an" redaktionell statt Box: Text links, drei Fotos rechts, schlichter Textlink */
.ma-more2 { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "txt" "pics" "btn"; gap: 1.5rem; align-items: center; margin-top: 4rem; padding: 3rem 0 0; border: 0; border-top: 1px solid rgba(255, 255, 255, .12); border-radius: 0; background: none; text-align: left; }
.ma-more2:hover, .ma-more2:focus-visible { border-color: rgba(255, 255, 255, .12); background: none; }
.ma-more2__txt { grid-area: txt; gap: .6rem; }
.ma-more2__title { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: 600; letter-spacing: -.025em; line-height: 1.15; }
.ma-more2__text { max-width: 28rem; }
.ma-more2__pics { grid-area: pics; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; width: 100%; }
.ma-more2__pics img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border: 0; border-radius: .9rem; box-shadow: none; filter: grayscale(1) contrast(1.05) brightness(.85); transform: none !important; transition: filter .6s var(--ease-out-expo), transform .6s var(--ease-out-expo); }
.ma-more2__pics img + img { margin-left: 0; }
.ma-more2:hover .ma-more2__pics img, .ma-more2:focus-visible .ma-more2__pics img { filter: none; }
.ma-more2__btn { grid-area: btn; justify-self: start; padding: 0 0 .3rem; border-radius: 0; background: none; box-shadow: none; color: var(--color-gold-soft); font-weight: 600; border-bottom: 1px solid rgba(227, 195, 122, .45); transition: border-color .3s ease, color .3s ease; }
.ma-more2:hover .ma-more2__btn, .ma-more2:focus-visible .ma-more2__btn { color: #fff; border-bottom-color: #fff; }
@media (min-width: 900px) {
  .ma-more2 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-areas: "txt pics" "btn pics"; column-gap: 4rem; row-gap: 1.75rem; align-items: end; }
  .ma-more2__txt { align-self: end; }
  .ma-more2__btn { align-self: start; }
}
@media (prefers-reduced-motion: reduce) { .ma-more2__pics img { transition: none; } }
@media (hover: none) { .ma-more2__pics img { filter: none; } }
.ma-contact .contact__text { color: #fff; }
.ma-contact .contact__meta { color: #fff; }

/* Startseite: Google-Badge im Hero größer und heller (Stadtseiten unverändert) */
@media (min-width: 768px) {
  .hero:not(.ma-hero2) .google-badge { width: 23rem; height: 23rem; padding: 18px; }
  .hero:not(.ma-hero2) .gb-inner { background: #fff; gap: .5rem; }
  .hero:not(.ma-hero2) .gb-eyebrow { font-size: 1.35rem; color: #1d1d1f; }
  .hero:not(.ma-hero2) .gb-google { font-size: 3rem; }
  .hero:not(.ma-hero2) .gb-cat { font-size: 1.15rem; color: #3c4043; }
  .hero:not(.ma-hero2) .gb-score { font-size: 2.05rem; color: #1d1d1f; }
  .hero:not(.ma-hero2) .gb-stars svg { width: 25px; height: 25px; }
}
/* Startseite: H1 "Ihr KFZ-Gutachter / in Gießen." immer zweizeilig */
@media (min-width: 768px) { .hero:not(.ma-hero2) .hero__title { font-size: 2.65rem; } }
@media (min-width: 1024px) { .hero:not(.ma-hero2) .hero__title { font-size: 3.6rem; } }
@media (min-width: 1280px) { .hero:not(.ma-hero2) .hero__title { font-size: 4.25rem; } }
/* Startseite: Hero-Text unter der H1 weiß und proportional zur Überschrift */
.hero:not(.ma-hero2) .hero__lead { color: #fff; }
@media (min-width: 768px) { .hero:not(.ma-hero2) .hero__lead { font-size: 1.15rem; line-height: 1.55; } }
@media (min-width: 1024px) { .hero:not(.ma-hero2) .hero__lead { font-size: 1.3rem; } }
@media (min-width: 1280px) { .hero:not(.ma-hero2) .hero__lead { font-size: 1.45rem; max-width: 34rem; } }

/* Startseite: Vertrauensband mit grünen Haken, ohne Laufband (3 Punkte) */
.ma-trust--static .ma-trust__list { flex-wrap: wrap; justify-content: center; row-gap: .9rem; margin: 0 auto; max-width: 75rem; }
.ma-trust--static .ma-trust__list a { color: inherit; text-decoration: none; }
.ma-trust--static .ma-trust__list a:hover { color: var(--color-gold-deep); }
@media (max-width: 767px) { .ma-trust--static .ma-trust__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; padding-inline: .75rem; } .ma-trust--static .ma-trust__list li { flex-direction: column; justify-content: flex-start; gap: .45rem; padding: 0; font-size: 1rem; line-height: 1.25; text-align: center; white-space: normal; } }
/* Startseite: Überschrift im Vertrauensband mit feinen Goldlinien statt nur transparent */
.ma-trust--static .ma-trust__label { display: flex; align-items: center; justify-content: center; gap: 1rem; margin: 0 auto 1.25rem; max-width: 34rem; padding-inline: 1.25rem; font-size: .85rem; font-weight: 600; letter-spacing: .16em; color: var(--color-gold-deep); opacity: 1; }
.ma-trust--static .ma-trust__label::before, .ma-trust--static .ma-trust__label::after { content: ""; flex: 1 1 auto; max-width: 5rem; height: 1px; }
.ma-trust--static .ma-trust__label::before { background: linear-gradient(to right, rgba(184, 145, 46, 0), rgba(184, 145, 46, .6)); }
.ma-trust--static .ma-trust__label::after { background: linear-gradient(to left, rgba(184, 145, 46, 0), rgba(184, 145, 46, .6)); }
/* Startseite: "Dafür steht 1Plus Gutachten" transparent mit Verlauf (oben kräftiger, unten blasser), ohne Linien */
.ma-trust--static .ma-trust__label { display: block; max-width: none; padding-inline: 1.25rem; font-size: 1rem; font-weight: 700; letter-spacing: .14em; text-align: center; color: transparent; background: linear-gradient(to bottom, rgba(29, 29, 31, .85) 0%, rgba(29, 29, 31, .4) 100%); -webkit-background-clip: text; background-clip: text; opacity: 1; }
.ma-trust--static .ma-trust__label::before, .ma-trust--static .ma-trust__label::after { content: none; }
@media (max-width: 767px) { .ma-trust--static .ma-trust__label { font-size: .9rem; } }

/* Startseite Kontakt: sehr dunkles eigenes Werkstattfoto im Hintergrund, Text bleibt im Vordergrund */
.contact--photo { isolation: isolate; }
.contact--photo::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url("assets/leistung-unfall.jpg") center 40% / cover no-repeat; opacity: .75; filter: grayscale(.5) brightness(.75) contrast(1.1); pointer-events: none; }
.contact--photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(29, 29, 31, .92) 0%, rgba(29, 29, 31, .62) 50%, rgba(29, 29, 31, .5) 100%); pointer-events: none; }


/* Vertrauens-Leiste Startseite: gefüllte Gold-Symbole ohne Kreis */
#vertrauen .seal__mark { width: auto; height: auto; border: 0; border-radius: 0; background: none; color: var(--color-gold-soft); }
#vertrauen .seal__icon { width: 1.9rem; height: 1.9rem; }

/* Marburg: dritte Leistungskarte offen, vier Leistungen einzeln verlinkt */
.ma-teaser--open { display: flex; flex-direction: column; gap: .6rem; overflow: visible; isolation: auto; }
.ma-teaser--open .ma-tgrid, .ma-teaser--open:hover .ma-tgrid { position: relative; inset: auto; flex: 1 1 auto; min-height: 18rem; filter: none; opacity: 1; transform: none; }
.ma-teaser--open .ma-tcard { color: inherit; text-decoration: none; transition: transform .3s var(--ease-out-expo), box-shadow .3s var(--ease-out-expo); }
.ma-teaser--open .ma-tcard:hover, .ma-teaser--open .ma-tcard:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 24px -14px rgba(29, 29, 31, .35); }
.ma-teaser--open .ma-tcard:hover .ma-tcard__title { color: var(--color-gold-deep); }
.ma-teaser__all { width: 100%; justify-content: center; }

/* Startseite Vertrauen: Einleitungstext weiss */
#vertrauen .trust-lead { color: #fff; }

/* Startseite Kontakt: Text weiss */
#kontakt .contact__text { color: #fff; }

/* Startseite Hero: Text links buendig mit dem Logo in der Navigation */
@media (min-width: 768px) { .hero:not(.ma-hero2) .hero__content { max-width: 80rem; padding-inline: 1.5rem; } }
@media (min-width: 768px) and (max-width: 1023px) { .hero:not(.ma-hero2) .google-badge { margin-right: 1rem; } }

/* Startseite Leistungen: Ansprechpartner-Kachel mit eigenem Hintergrundbild */
#ardijan-dulla.feature-tile--person { background: var(--color-ink) url("assets/ansprechpartner-bg.jpg") center / cover no-repeat; background-image: image-set(url("assets/ansprechpartner-bg.webp") type("image/webp"), url("assets/ansprechpartner-bg.jpg") type("image/jpeg")); }
@media (max-width: 767px) { #ardijan-dulla.feature-tile--person { background-position: 30% center; } }
/* Ansprechpartner-Kachel: Hintergrund etwas abdunkeln */
#ardijan-dulla.feature-tile--person { background-image: linear-gradient(rgba(16, 16, 18, .5), rgba(16, 16, 18, .5)), url("assets/ansprechpartner-bg.jpg"); background-image: linear-gradient(rgba(16, 16, 18, .5), rgba(16, 16, 18, .5)), image-set(url("assets/ansprechpartner-bg.webp") type("image/webp"), url("assets/ansprechpartner-bg.jpg") type("image/jpeg")); }
#ardijan-dulla .feature-tile__text { color: #fff; }
/* Ansprechpartner: Qualifikation unter dem Namen */
.person-quote__cert { display: inline-flex; align-items: center; gap: .45rem; margin-top: .55rem; font-size: var(--text-sm); font-weight: 500; color: var(--color-gold-soft); text-decoration: none; }
.person-quote__cert:hover { text-decoration: underline; text-underline-offset: .2em; }
.person-quote__cert svg { flex: none; }
#transporter { scroll-margin-top: calc(var(--header-h) + 2rem); }

/* Leistungen: Link zur Übersicht */
.svc-extra { margin-top: 2.5rem; display: flex; flex-direction: column; align-items: center; gap: 1.25rem; text-align: center; padding-inline: 1.25rem; }
.svc-extra__btn { display: inline-flex; align-items: center; background: #fff; }

/* Handy: Hero-WhatsApp-Button etwas breiter */
@media (max-width: 767px) {
  .hero__buttons .btn-whatsapp { min-width: 15rem; justify-content: center; }
}

/* Handy: feste Leiste unten mit Anrufen und WhatsApp */
.mcta { display: none; }
@media (max-width: 767px) {
  .mcta {
    display: flex; gap: .6rem;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
    padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .85);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
    border-top: 1px solid var(--color-line);
    transform: translateY(110%);
    transition: transform .35s var(--ease-out-expo);
  }
  .mcta.is-visible { transform: none; }
  .mcta__btn { flex: 1 1 0%; min-height: 52px; justify-content: center; gap: .5rem; font-size: 1.05rem; }
  .mcta__btn svg { flex: none; }
}
@media (prefers-reduced-motion: reduce) { .mcta { transition: none; } }

/* Neues 1Plus-Logo (breiter als das alte): Wasserzeichen auf Fotos angepasst */
.svc-logo { width: 50px; }
@media (min-width: 768px) { .svc-logo { width: 60px; } }
.insight img.insight__logo, .insight:hover img.insight__logo { width: 42px; }
@media (min-width: 768px) { .insight img.insight__logo, .insight:hover img.insight__logo { width: 48px; } }
@media (max-width: 767px) { .insight img.insight__logo, .insight:hover img.insight__logo { width: 32px; } }
.ma-hero2__photo .svc-logo { width: 4.2rem; }
.ma-trio__item .svc-logo { width: 2.7rem; }
@media (min-width: 768px) { .ma-trio__item .svc-logo { width: 3.6rem; } }
.wa-avatar--logo img { object-fit: cover; }
.insight__cap { padding-right: 4rem; }
@media (min-width: 768px) { .insight__cap { padding-right: 4.5rem; } }
@media (max-width: 767px) { .insight__cap { padding-right: 2.9rem; } }

/* Einzugsgebiete: ab 4 Städten am PC zwei Spalten */
@media (min-width: 768px) {
  .ezs__list:has(> li:nth-of-type(4)) { display: grid; grid-template-columns: 1fr 1fr; column-gap: 2.5rem; }
}

/* Über uns: Profil als erster Bereich, höher und mit warmem, ungleichmäßigem Hintergrund */
.au-intro {
  position: relative;
  padding-top: clamp(2rem, 4vw, 3.5rem);
  background:
    radial-gradient(60% 70% at 85% 10%, rgba(226, 188, 92, .06), rgba(226, 188, 92, 0) 70%),
    radial-gradient(55% 60% at 5% 95%, rgba(196, 160, 120, .05), rgba(196, 160, 120, 0) 70%),
    linear-gradient(180deg, #fdfcfa 0%, #faf8f4 100%);
}

/* Über uns, Nachweise: Beschriftung unter den Urkunden klarer und größer */
.au-nachweise .trust-doc__body { max-width: 27rem; margin-top: .5rem; }
.au-nachweise .trust-doc__eyebrow {
  display: inline-flex; align-items: center; gap: .8rem;
  font-size: .78rem; letter-spacing: .16em; color: var(--color-gold-deep); margin-bottom: .75rem;
}
.au-nachweise .trust-doc__eyebrow::before,
.au-nachweise .trust-doc__eyebrow::after { content: ""; width: 1.75rem; height: 1px; background: linear-gradient(90deg, rgba(184, 145, 46, 0), rgba(184, 145, 46, .7)); }
.au-nachweise .trust-doc__eyebrow::after { transform: scaleX(-1); }
.au-nachweise .trust-doc__title { font-size: clamp(1.45rem, 1.15rem + 1vw, 1.8rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1.15; color: var(--color-ink); }
.au-nachweise .trust-doc__meta { margin-top: .55rem; font-size: .98rem; line-height: 1.45; color: var(--color-ink-muted); text-wrap: balance; }
.au-nachweise .trust-doc__rule { display: none; }
.au-nachweise .trust-doc__text { margin-top: 1.1rem; font-size: 1.02rem; line-height: 1.65; color: var(--color-ink-soft); max-width: 25rem; text-wrap: pretty; }

/* Über uns: Google-Bewertungen als Laufband vor dem Kontakt */
.au-reviews .au-head { margin-bottom: 2.5rem; }
@media (min-width: 768px) { .au-reviews .au-head { margin-bottom: 3.5rem; } }
.au-reviews__cta { display: flex; justify-content: center; margin-top: 2rem; }
.au-reviews__cta .btn { display: inline-flex; align-items: center; gap: .55rem; background: #fff; }

/* Ladezeit: WebP-Versionen (ältere Browser nehmen automatisch das JPG aus der Zeile darüber) */
.hero__bg { background-image: image-set(url("assets/hero.webp") type("image/webp"), url("assets/hero.jpg") type("image/jpeg")); }
@media (max-width: 767px) { .hero__bg { background-image: image-set(url("assets/hero-900.webp") type("image/webp"), url("assets/hero.jpg") type("image/jpeg")); } }
#nachweise.section--dark::before { background-image: image-set(url("assets/einblick-5.webp") type("image/webp"), url("assets/einblick-5.jpg") type("image/jpeg")); }

/* Einzugsgebiete: Städte als helle Kacheln statt Linien (Startseite und Marburg) */
.ezs__list,
.ezs__list:has(> li:nth-of-type(4)) {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: .625rem; border-top: 0;
}
.ezs__list:has(> li:nth-of-type(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 480px) { .ezs__list:has(> li:nth-of-type(4)) { gap: .75rem; } }
@media (max-width: 479px) {
  .ezs__list:has(> li:nth-of-type(4)) .ezs__item:not(:has(.ezs__link)),
  .ezs__list:has(> li:nth-of-type(4)) .ezs__link { padding: .95rem .85rem; gap: .6rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__item { gap: .6rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__arrow { width: 1.5rem; height: 1.5rem; font-size: .85rem; }
}
.ezs__item {
  position: relative; padding: 0; border: 0; border-radius: 1rem;
  background: var(--color-bg-warm);
  transition: background-color .2s ease, box-shadow .25s ease, transform .25s ease;
}
.ezs__item > .ezs__pin,
.ezs__item > .ezs__name { position: relative; }
.ezs__item:not(:has(.ezs__link)) { padding: 1.05rem 1.15rem; }
.ezs__link { padding: 1.05rem 1.15rem; border-radius: inherit; }
.ezs__item:has(.ezs__link) { background: #fff; box-shadow: inset 0 0 0 1px var(--color-line-soft), 0 1px 2px rgba(0, 0, 0, .04); }
@media (hover: hover) {
  .ezs__item:has(.ezs__link):hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--color-line), 0 14px 30px -18px rgba(0, 0, 0, .28); }
}
.ezs__link:focus-visible { outline: 2px solid var(--color-gold-deep); outline-offset: 2px; }
.ezs__pin { width: 18px; height: 18px; }
.ezs__name { font-size: clamp(1rem, .96rem + .2vw, 1.0625rem); }
.ezs__arrow { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: rgba(184, 145, 46, .12); font-size: .95rem; }
.ezs__btn { margin-top: 1.25rem; }
/* Städte-Kacheln: weiß mit feinem Rand und weichem Schatten, wie die Bewertungskarten */
.ezs__item {
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--color-line-soft), 0 1px 2px rgba(0, 0, 0, .03), 0 10px 24px -18px rgba(0, 0, 0, .18);
}
.ezs__item:has(.ezs__link) {
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(184, 145, 46, .35), 0 1px 2px rgba(0, 0, 0, .03), 0 12px 26px -18px rgba(184, 145, 46, .35);
}
@media (hover: hover) {
  .ezs__item:has(.ezs__link):hover { box-shadow: inset 0 0 0 1px rgba(184, 145, 46, .6), 0 16px 32px -18px rgba(184, 145, 46, .45); }
}
/* Marburg-Kachel: gleicher Rand wie die anderen, Pfeil ohne Kreis */
.ezs__item:has(.ezs__link) {
  box-shadow: inset 0 0 0 1px var(--color-line-soft), 0 1px 2px rgba(0, 0, 0, .03), 0 10px 24px -18px rgba(0, 0, 0, .18);
}
@media (hover: hover) {
  .ezs__item:has(.ezs__link):hover { box-shadow: inset 0 0 0 1px var(--color-line), 0 16px 32px -18px rgba(0, 0, 0, .28); }
}
.ezs__arrow,
.ezs__list:has(> li:nth-of-type(4)) .ezs__arrow { width: auto; height: auto; border-radius: 0; background: none; font-size: 1.05rem; }

/* Rücklink zur Stadtseite (wird per script.js eingefügt) */
.city-back { background: #fff; border-bottom: 1px solid var(--color-line-soft); }
.city-back__inner { max-width: 75rem; margin-inline: auto; padding: .7rem clamp(1.25rem, 4vw, 2rem); }
.city-back__link { display: inline-flex; align-items: center; gap: .45rem; font-size: var(--text-sm); font-weight: 500; color: var(--color-ink-soft); text-decoration: none; transition: color .15s ease; }
.city-back__link span { transition: transform .15s ease; }
.city-back__link:hover { color: var(--color-gold-deep); }
.city-back__link:hover span { transform: translateX(-3px); }
.city-back__link:focus-visible { outline: 2px solid var(--color-gold-deep); outline-offset: 3px; border-radius: 4px; }

/* Handy-Leiste: im ausgeblendeten Zustand auch für Tastatur und Screenreader unerreichbar */
@media (max-width: 767px) {
  .mcta { visibility: hidden; transition: transform .35s var(--ease-out-expo), visibility 0s linear .35s; }
  .mcta.is-visible { visibility: visible; transition: transform .35s var(--ease-out-expo), visibility 0s; }
}
@media (prefers-reduced-motion: reduce) { .mcta, .mcta.is-visible { transition: none; } }

/* Sterne-Bewertung zwischen Karten und Buttons (Startseite und Über uns) */
.reviews-score { display: flex; justify-content: center; margin: 2.75rem auto 0; padding: 0 1.25rem; }
.reviews-score__card { display: inline-flex; align-items: center; gap: .9rem; filter: drop-shadow(0 5px 6px rgba(0,0,0,.10)); }
.reviews-score__g { display: flex; padding-right: .9rem; border-right: 1px solid var(--color-line-soft); line-height: 0; }
.reviews-score__g svg { width: 34px; height: 34px; flex: none; }
.reviews-score__num { margin: 0; font-size: clamp(2.1rem, 1.8rem + 1.2vw, 2.6rem); font-weight: 700; line-height: 1; letter-spacing: -.03em; color: var(--color-ink); }
.reviews-score__body { display: flex; flex-direction: column; gap: .3rem; }
.reviews-score__stars { display: inline-flex; gap: .1rem; line-height: 0; }
.reviews-score__stars svg { width: 24px; height: 24px; flex: none; }
.reviews-score + .reviews-cta { margin-top: 1.75rem; }
.reviews-score + .au-reviews__cta { margin-top: 1.75rem; }
@media (max-width: 479px) {
  .reviews-score__card { gap: .7rem; }
  .reviews-score__g { padding-right: .7rem; }
  .reviews-score__g svg { width: 28px; height: 28px; }
  .reviews-score__stars svg { width: 21px; height: 21px; }
}

/* Weitere Orte: lange Ortsnamen (z. B. Friedrichsdorf) dürfen auf schmalen Handys nicht über den Rand ragen */
@media (max-width: 400px) {
  .ezs__list:has(> li:nth-of-type(4)) .ezs__link,
  .ezs__list:has(> li:nth-of-type(4)) .ezs__item:not(:has(.ezs__link)) { padding: .9rem .6rem; gap: .4rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__name { font-size: .9375rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__arrow { width: 1.3rem; height: 1.3rem; font-size: .8rem; }
}
@media (max-width: 340px) {
  .ezs__list:has(> li:nth-of-type(4)) { column-gap: .5rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__link,
  .ezs__list:has(> li:nth-of-type(4)) .ezs__item:not(:has(.ezs__link)) { padding: .85rem .5rem; gap: .35rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__name { font-size: .875rem; }
}

/* Einzugsgebiete: sehr schmale Handys (unter 360px), damit lange Ortsnamen in die Kacheln passen */
@media (max-width: 359px) {
  .ezs__list:has(> li:nth-of-type(4)) .ezs__link,
  .ezs__list:has(> li:nth-of-type(4)) .ezs__item:not(:has(.ezs__link)) { padding: .95rem .7rem; gap: .5rem; min-width: 0; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__name { font-size: .95rem; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__pin { display: none; }
}
/* Sehr schmale Handys (unter 360px): Buttons dürfen umbrechen, damit nichts über den Rand ragt */
@media (max-width: 359px) {
  .btn { white-space: normal; text-align: center; }
  .btn-lg { padding-inline: 1.25rem; }
  .rg-h2 { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
}

/* ---------- Hintergrundfotos weiter unten verzögert laden ----------
   Solange ein Abschnitt noch weit unten ist, zeigt er den bisherigen grauen Verlauf statt des Fotos.
   script.js setzt "bg-ready", sobald der Abschnitt näher als 800 px kommt, dann gilt wieder das Originalbild.
   Ohne JavaScript fehlt die Klasse "bg-lazy" am <html>, dann laden alle Fotos wie bisher. */
html.bg-lazy .service-tile-photo:not(.bg-ready) { background-image: linear-gradient(150deg, #c9ccd1 0%, #9aa0a6 50%, #6b7076 100%) !important; }
html.bg-lazy .wa-photo:not(.bg-ready) { background-image: linear-gradient(160deg, #8b8f94 0%, #5b6066 45%, #2e3236 100%) !important; }
html.bg-lazy #ardijan-dulla.feature-tile--person:not(.bg-ready) { background-image: linear-gradient(rgba(16, 16, 18, .5), rgba(16, 16, 18, .5)) !important; }
html.bg-lazy .contact--photo:not(.bg-ready)::before { background-image: none !important; }

/* ---------- Kopfzeile auf dem Tablet (768 bis 1023 px) ----------
   Logo, sechs Menüpunkte und Telefonnummer passen sonst nicht in eine Zeile:
   "Über uns" brach um und die Nummer wurde rechts abgeschnitten. Handy und Desktop bleiben unverändert. */
@media (min-width: 768px) and (max-width: 1023px) {
  .nav { gap: 1.5rem; }
  .nav a { white-space: nowrap; }
}
/* Schmales Tablet: Telefon nur als Symbol (bleibt anklickbar, Nummer wird Screenreadern vorgelesen) */
@media (min-width: 768px) and (max-width: 899px) {
  .nav { gap: 1.25rem; }
  .header__phone { width: 44px; height: 44px; justify-content: center; gap: 0; }
  .header__phone-icon { width: 22px; height: 22px; }
  .header__phone-num { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}

/* ---------- Weitere Orte auf dem Handy (bis 429 px) ----------
   Lange Ortsnamen wie Mengerskirchen oder Friedrichsdorf schoben den Pfeil aus der Kachel.
   Das Ortssymbol entfällt hier, der Name darf schrumpfen, der Pfeil bleibt immer in der Kachel. */
@media (max-width: 429px) {
  .ezs__list:has(> li:nth-of-type(4)) .ezs__pin { display: none; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__link { min-width: 0; }
  .ezs__list:has(> li:nth-of-type(4)) .ezs__arrow { flex: none; }
}
@media (max-width: 340px) {
  .ezs__list:has(> li:nth-of-type(4)) .ezs__name { font-size: .8125rem; }
}

/* ---------- Kachel-Überschriften dürfen nicht abgeschnitten werden ----------
   Lange Wörter wie "Fahrzeugbewertung." oder "Motorradgutachten." passten bei 1024 bis 1279 px
   (iPad quer, kleine Laptops) nicht in die Kachel. Die Schrift wird nur dort so weit kleiner, wie nötig. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .svc-grid .svc-card__body .tile-title,
  .svc-grid .au-tile .tile-title { font-size: calc(3.2vw - 6px); }
}
@media (min-width: 1024px) {
  .lu-tiles.hub-grid .tile-title { font-size: min(2rem, calc(2.4vw + 2.5px)); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .lu-tiles.hub-grid .tile-title { font-size: 1.2rem; }
  .lu-tiles.hub-grid .tile-eyebrow { letter-spacing: .02em; }
  .tile-grid.service-grid:not(.hub-grid):not(.lu-tiles) > .service-tile .tile-title { font-size: min(var(--text-2xl), calc(3.2vw + 2px)); }
  .ps-tiles .tile-body { font-size: .95rem; }
}

/* ---------- Kontaktseite: WhatsApp-Kachel mit dunkler Schrift (besser lesbar, wie die WhatsApp-Buttons) ---------- */
.kc-tile--wa .tile-eyebrow { color: rgba(29, 29, 31, .78); }
.kc-tile--wa .kc-big { color: var(--color-ink); }
.kc-tile--wa .tile-body { color: rgba(29, 29, 31, .86); }