/* ============================================================
   PAGE-V5 · Immobilie bewerten (CTA-/Funnel-Seite, ≠ Bewertungs-Landingpage)
   Selbst-tragend: reused v5-Blöcke (.rv testimonial, .fq faq) + neue Blöcke
   (trust-bar, form-hero foto+text, funnel-embed, logo-strip, geo-hub, rueckruf).
   Lädt NACH tokens → base → page. UI = Sans, Serife nur Display, Hairlines,
   Sand-Panels, EIN Bordeaux-Akzent, Gold nur ★.
   ============================================================ */

.nav__menu a[aria-current="page"]::after { transform: scaleX(1); }
.fh, .fu, .ls, .rv, .geo, .fq, .rk { scroll-margin-top: 88px; }

/* ============================================================
   1 · trust-bar (Fundus trust-bar) — schmale Chip-Leiste unter der Nav.
   ============================================================ */
.tb { background: var(--surface-sand); border-bottom: 1px solid var(--border-light); }
.tb__row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(1rem, 3vw, 2.25rem); padding-block: var(--sp-2); }
.tb__chip { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--fs-small); font-weight: 600; color: var(--text-on-light); }
.tb__chip svg { width: 16px; height: 16px; color: var(--brand); flex: none; }
.tb__chip .star { color: var(--accent-2); }
.tb__sep { width: 1px; height: 16px; background: var(--border-light); }
@media (max-width: 680px) { .tb__sep { display: none; } }

/* ============================================================
   2 · hero-video = form-hero (Variante B_foto_text): Text links + Foto rechts.
   ============================================================ */
.fh { border-bottom: 1px solid var(--border-light); }
.fh__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.fh__eyebrow { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--brand); }
.fh__h1 { margin-top: var(--sp-2); font-family: var(--font-display); font-weight: 560; font-size: clamp(2rem, 3.4vw, 2.9rem); line-height: 1.12; letter-spacing: -.005em; }
.fh__h1 em { font-style: italic; color: var(--brand); }
.fh__sub { margin-top: var(--sp-3); color: var(--text-on-light-dim); font-size: 1.05rem; line-height: 1.6; max-width: 52ch; }
.fh__chips { list-style: none; margin: var(--sp-4) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.fh__chips li { display: flex; align-items: center; gap: .6rem; font-weight: 600; }
.fh__chips .ck { flex: none; width: 24px; height: 24px; border-radius: 999px; background: var(--surface-sand); color: var(--brand); display: grid; place-items: center; }
.fh__chips .ck svg { width: 13px; height: 13px; }
.fh__cta { margin-top: var(--sp-4); }
.fh__proof { margin-top: var(--sp-4); border-left: 3px solid var(--brand); padding-left: var(--sp-3); font-size: .95rem; color: var(--text-on-light-dim); line-height: 1.6; max-width: 48ch; }
.fh__media { margin: 0; border-radius: var(--radius); overflow: hidden; aspect-ratio: 4 / 5; background: var(--surface-sand); }
.fh__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 12%; display: block; }

/* ============================================================
   3 · funnel = form-funnel (iframe-Embed externes Tool = Delivery) — hier
   prominenter, ehrlicher Platzhalter-Slot + Success-Hinweis als Text.
   ============================================================ */
.fu { background: var(--surface-light); }
.fu__card { max-width: 820px; margin-inline: auto; background: var(--surface-light-2); border: 1px solid var(--border-light); border-radius: var(--radius); box-shadow: 0 18px 44px rgba(43,35,32,.08); overflow: hidden; }
.fu__slot { border-bottom: 1px dashed var(--border-light); padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.5rem, 4vw, 3rem); text-align: center; background: repeating-linear-gradient(135deg, var(--surface-light) 0 12px, var(--surface-light-2) 12px 24px); }
.fu__slot-ic { width: 44px; height: 44px; margin: 0 auto var(--sp-2); color: var(--brand); }
.fu__slot-ic svg { width: 100%; height: 100%; }
.fu__slot b { display: block; font-family: var(--font-display); font-weight: 560; font-size: clamp(1.2rem, 2.2vw, 1.6rem); color: var(--text-on-light); }
.fu__slot span { display: block; margin-top: .5rem; font-size: var(--fs-small); color: var(--text-on-light-dim); max-width: 46ch; margin-inline: auto; }
.fu__success { padding: clamp(1.25rem, 3vw, 1.75rem) clamp(1.5rem, 4vw, 3rem); display: flex; gap: var(--sp-3); align-items: flex-start; }
.fu__success-ic { flex: none; width: 40px; height: 40px; border-radius: 999px; background: var(--surface-sand); color: var(--brand); display: grid; place-items: center; }
.fu__success-ic svg { width: 20px; height: 20px; }
.fu__success p { color: var(--text-on-light-dim); font-size: .95rem; line-height: 1.6; }
.fu__success b { color: var(--text-on-light); }

/* ============================================================
   4 · siegel = logo-strip — Label + Partner-Siegel (ITAC/Allianz).
   Kein Logo-Asset vorhanden → typografische Platzhalter (Delivery-Asset offen).
   ============================================================ */
.ls { background: var(--surface-light); border-top: 1px solid var(--border-light); padding-block: var(--sp-4); }
.ls__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(1rem, 3vw, 2.5rem); }
.ls__label { font-size: var(--fs-small); font-weight: 600; color: var(--text-on-light-dim); }
.ls__logos { display: inline-flex; align-items: center; gap: clamp(1rem, 3vw, 2rem); }
.ls__logo { font-family: var(--font-text); font-weight: 700; letter-spacing: .04em; color: var(--text-on-light); opacity: .8; padding: .4rem .9rem; border: 1px solid var(--border-light); border-radius: var(--radius-btn); }

/* ============================================================
   5 · bewertungen = testimonial (.rv) — dunkles Band + Elfsight-Slot, 1:1 aus v5.
   ============================================================ */
.rv__head { max-width: 820px; margin-inline: auto; text-align: center; }
.rv__head h2 { color: var(--text-on-dark); }
.rv__head h2 em { font-style: italic; color: var(--brand-glow); }
.rv__head .sub { color: var(--text-on-dark-dim); margin-top: var(--sp-2); }
.rv__proof { margin-top: var(--sp-4); display: flex; align-items: center; justify-content: center; gap: var(--sp-3); flex-wrap: wrap; }
.rv__gbadge { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .9rem; border-radius: 999px; background: var(--glass); border: 1px solid var(--glass-bd); font-size: .9rem; color: var(--text-on-dark); }
.rv__gbadge .g-logo { width: 20px; height: 20px; display: inline-flex; flex: none; }
.rv__gbadge .g-logo svg { width: 20px; height: 20px; display: block; }
.rv__gbadge .stars { color: var(--accent-2); letter-spacing: 1px; }
.rv__gbadge .val strong { color: var(--text-on-dark); font-weight: 700; }
.rv__all { display: inline-flex; align-items: center; gap: .4rem; font-size: var(--fs-small); font-weight: 600; color: var(--text-on-dark); text-decoration: none; }
.rv__all::after { content: "→"; color: var(--brand-glow); }
.rv__all:hover { color: var(--brand-glow); }
.rv__widget { margin: var(--sp-5) auto 0; max-width: 1000px; }
.rv__slot { border: 1px dashed var(--glass-bd); border-radius: var(--radius); padding: clamp(2rem, 5vw, 3.5rem); text-align: center; color: var(--text-on-dark-dim); background: var(--glass); }
.rv__slot-ic { width: 34px; height: 34px; margin: 0 auto var(--sp-2); color: var(--brand-glow); }
.rv__slot-ic svg { width: 100%; height: 100%; }
.rv__slot b { display: block; color: var(--text-on-dark); font-weight: 600; font-size: 1.02rem; }
.rv__slot span { display: block; margin-top: .4rem; font-size: var(--fs-small); }

/* ============================================================
   6 · einzugsgebiet = geo-link-hub — Chip-Gruppen (Orte als Text-Pills,
   NICHT verlinkt: keine /standort/-Seiten, Startseiten-Entscheidung).
   ============================================================ */
.geo__aussage { max-width: 62ch; margin-top: var(--sp-2); color: var(--text-on-light-dim); }
.geo__groups { margin-top: var(--sp-3); display: grid; gap: var(--sp-3); }
.geo__group + .geo__group { border-top: 1px solid var(--border-light); padding-top: var(--sp-3); }
.geo__group-label { font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); margin-bottom: .7rem; }
.geo__chips { display: flex; flex-wrap: wrap; gap: .55rem; }
.geo__chip { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .95rem; border-radius: 999px; background: var(--surface-light-2); border: 1px solid var(--border-light); font-weight: 600; font-size: .9rem; color: var(--text-on-light); white-space: nowrap; }
.geo__chip svg { width: 15px; height: 15px; color: var(--brand); flex: none; }

/* Zweispaltig: links Text + Chips, rechts Regions-Foto (Dächer-Motiv wie Startseiten-Band) */
.geo__cols { display: grid; gap: clamp(2rem, 4.5vw, 4.25rem); align-items: center; }
.geo__cols .shead { margin-bottom: 0; }
.geo__photo { margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: 0 18px 44px rgba(43,35,32,.14); }
.geo__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; aspect-ratio: 4 / 3; }
@media (min-width: 901px) {
  .geo__cols { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
  .geo__photo { align-self: center; height: 100%; max-height: 480px; }
  .geo__photo img { aspect-ratio: auto; min-height: 100%; }
}

/* ============================================================
   7 · faq = faq (einspaltig, zentriert — faq-05-Anmutung).
   ============================================================ */
.fq__wrap { max-width: 820px; margin-inline: auto; }
.fq__list { margin-top: var(--sp-4); }
.fq__item { border-bottom: 1px solid var(--border-light); }
.fq__item:first-of-type { border-top: 1px solid var(--border-light); }
.fq__item summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); padding-block: 1.05rem; min-height: 44px; cursor: pointer; font-family: var(--font-text); font-weight: 600; font-size: 1.05rem; list-style: none; }
.fq__item summary::-webkit-details-marker { display: none; }
@media (hover: hover) and (pointer: fine) { .fq__item summary:hover { color: var(--brand); } }
.fq__plus { flex: none; width: 22px; height: 22px; color: var(--brand); display: inline-flex; transition: transform var(--dur) var(--ease); }
.fq__plus svg { width: 100%; height: 100%; }
.fq__item[open] .fq__plus { transform: rotate(45deg); }
.fq__a { padding-bottom: var(--sp-3); color: var(--text-on-light-dim); max-width: 68ch; }

/* ============================================================
   8 · rueckruf = cta-banner (dunkles Band).
   ============================================================ */
.rk__inner { max-width: 720px; margin-inline: auto; text-align: center; }
.rk__inner h2 { color: var(--text-on-dark); }
.rk__inner h2 em { font-style: italic; color: var(--brand-glow); }
.rk__sub { margin-top: var(--sp-2); color: var(--text-on-dark-dim); }
.rk__cta { margin-top: var(--sp-4); }

/* ============================================================
   Mobile-Pass
   ============================================================ */
@media (max-width: 860px) {
  .fh__grid { grid-template-columns: 1fr; }
  .fh__media { order: -1; max-width: 420px; aspect-ratio: 4 / 3; }
}

/* Funnel-Header: nur Logo + Telefon (kein Menü/CTA/Burger) — Fokus auf die Anfrage */
.nav--funnel .nav__inner { justify-content: space-between; }
.nav--funnel .nav__tel--solo { display: inline-flex; padding-left: 0; border-left: 0; }