/* ==========================================================================
   Website immobilienbewertung-erfurt.de – eigenes Stylesheet
   Ersetzt das Ynfinite-Theme. Klassennamen folgen dem uebernommenen Markup,
   die Werte (Groessen, Abstaende, Farben) wurden an der Bestandsseite gemessen
   (tools/stilabgleich.py).

   Fliessende Groessen: F(a, b) = a rem bei 400 px Breite, b rem bei 2560 px,
   dazwischen linear:  calc(a*1rem + (b - a) * ((100vw - 25rem) / 135))
   ========================================================================== */

/* ---------------------------------------------------------------- Schriften */
@font-face { font-family: "Roboto"; font-weight: 300; font-display: swap; src: url("/assets/fonts/roboto/roboto-v30-latin-300.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-weight: 400; font-display: swap; src: url("/assets/fonts/roboto/roboto-v30-latin-regular.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-weight: 500; font-display: swap; src: url("/assets/fonts/roboto/roboto-v30-latin-500.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-weight: 700; font-display: swap; src: url("/assets/fonts/roboto/roboto-v30-latin-700.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 300; font-display: swap; src: url("/assets/fonts/raleway/raleway-v28-latin-300.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 400; font-display: swap; src: url("/assets/fonts/raleway/raleway-v28-latin-regular.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 500; font-display: swap; src: url("/assets/fonts/raleway/raleway-v28-latin-500.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 700; font-display: swap; src: url("/assets/fonts/raleway/raleway-v28-latin-700.woff2") format("woff2"); }

/* ---------------------------------------------------------------- Variablen */
:root {
  /* Farben der Marke */
  --rot: #e50203;
  --schwarz: #151414;
  --weiss: #ffffff;
  --grau: #efefef;
  --hellgrau: #f7f7f7;
  --dunkelgrau: #4c4c4c;

  --schrift: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --schrift-titel: "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

  --fl: ((100vw - 25rem) / 135);                 /* Faktor fuer fliessende Groessen */
  --text: calc(0.9rem + 0.35 * var(--fl));        /* Fliesstext */
  --text-klein: calc(0.75rem + 0.3 * var(--fl));
  --text-knopf: calc(0.825rem + 0.325 * var(--fl));
  --text-nav: calc(1.2rem + 0.4 * var(--fl));
  --h1: calc(2rem + 1.45 * var(--fl));
  --h2: calc(1.75rem + 0.9 * var(--fl));
  --h3: calc(1.5rem + 0.7 * var(--fl));
  --h4: calc(1.25rem + 0.35 * var(--fl));
  --h5: var(--text);
  --zahl: calc(2.5rem + 0.4 * var(--fl));

  --abstand: calc(1.5rem + 1 * var(--fl));        /* Grundabstand (Spalten, Innenabstaende) */
  --abstand-halb: calc(var(--abstand) / 2);
  --item-gap: var(--abstand);                     /* Abstand der Folien (wird im Markup verwendet) */
  --abstand-gross: calc(2.5rem + 1.5 * var(--fl));
  --fluss: 11vmin;                                /* Abstand zwischen Sektionen */
  --zeile: calc(var(--text) * 1.4);               /* Abstand Text zu Text */

  --rand: calc(7vmin + 8 * var(--fl));            /* Seitenrand innen */
  --breite: min(140rem, calc(100vw - 2 * (8 * ((100vw - 64rem) / 66))));
  --breite-schmal: min(90rem, calc(100vw - 2 * (12 * ((100vw - 64rem) / 66))));

  --kopf-hoehe: 6rem;
  --radius-knopf: 30px;
  --zeit: 0.33s;
  --knopf-innen: 0.55rem 1.3rem;
}

/* ---------------------------------------------------------------- Grundlagen */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body {
  font-family: var(--schrift);
  font-size: 100%;
  line-height: 1.5;
  letter-spacing: 0.25px;
  color: var(--schwarz);
  background: var(--weiss);
}
body.preload * { transition: none !important; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; object-fit: contain; }
ul, ol { list-style: none; }
a { color: inherit; font-weight: 700; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
figure { position: relative; overflow: hidden; }
strong, b { font-weight: 700; }
fieldset { border: 0; }

#jumpToBody {
  position: absolute; top: 1rem; left: 0; right: 0; margin: auto; width: fit-content;
  z-index: 9999; opacity: 0; pointer-events: none;
}
#jumpToBody:focus { opacity: 1; pointer-events: all; }

/* ---------------------------------------------------------------- Typografie */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .tagline {
  font-family: var(--schrift-titel);
  font-weight: 400;
  line-height: 1.2;
}
h1, .h1 { font-size: var(--h1); }
h2, .h2 { font-size: var(--h2); }
h3, .h3 { font-size: var(--h3); }
h4, .h4 { font-size: var(--h4); font-weight: 500; }
h5, .h5 { font-size: var(--h5); font-weight: 600; }
h6, .h6 { font-size: var(--text-klein); font-weight: 600; }
.tagline { font-size: var(--text); margin-bottom: calc(var(--zeile) * 0.25); }
p.tagline, .stars.tagline { font-family: var(--schrift); font-size: var(--text-klein); line-height: 1.4; margin-bottom: calc(var(--zeile) * 0.125); }
.stars.tagline { display: flex; align-items: center; line-height: calc(1em + 0.5rem); }
.tagline--simple { font-family: var(--schrift-titel); line-height: 1.2; }
.fw300 { font-weight: 300 !important; }
.fw700 { font-weight: 700 !important; }
.small { font-size: var(--text); }
.number { font-size: var(--zahl); line-height: 1.2; }

p, li, blockquote, .item__content__text, .text, label, dd, dt { font-size: var(--text); line-height: 1.4; }

/* Abstaende zwischen Textbausteinen */
p, ul, ol, blockquote, .item__content__text, .text, figure, img { margin-bottom: var(--zeile); }
:is(p, ul, ol, blockquote, .item__content__text, .text, figure):last-child { margin-bottom: 0; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) { margin-bottom: var(--zeile); }
:is(p, ul, ol) + :is(h1, h2, h3, h4, h5, h6) { margin-top: calc(var(--zeile) * 2); }
.m0 { margin: 0 !important; }
.mt-a { margin-top: auto !important; }

/* Aufzaehlungen im Fliesstext */
.yn-article__text ul, .yn-article__text ol, .item__content__text ul, .section--seo ul {
  padding-left: 1.25em;
}
.yn-article__text ul { list-style: disc; }
.yn-article__text ol { list-style: disc; }  /* wie auf der Bestandsseite */
ul[style*="circle"] { list-style: none !important; padding-left: 0; }
.yn-article__text ul[style*="circle"] > li {
  position: relative; background: var(--rot); color: var(--weiss); padding: 0.4em 0.8em 0.4em 2.4em; margin-bottom: 0.5em;
}
.yn-article__text ul[style*="circle"] > li::before {
  content: "\f058"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0.8em; top: 0.4em;
}
.yn-article__text a:not(.button) { color: var(--rot); }

/* ---------------------------------------------------------------- Raster */
.inner {
  width: 100%;
  max-width: var(--breite);
  margin-left: auto; margin-right: auto;
  padding-left: var(--rand); padding-right: var(--rand);
}
.inner--narrow { max-width: var(--breite-schmal); }
.inner + .inner { padding-top: calc(var(--fluss) / 2); }

.row { display: flex; flex-wrap: wrap; margin: calc(var(--abstand-halb) * -1); }
.row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; padding: 0 var(--abstand-halb); margin: var(--abstand-halb) 0; }
.row--gap { margin: calc(var(--abstand) * -1); }
.row--gap > [class*="col-"] { padding: 0 var(--abstand); margin: var(--abstand) 0; }
.row > .m0 { margin: 0 !important; }
.bottom-xs { align-items: flex-end; }
.between-xs { justify-content: space-between; }
.col-xs-12 { flex-basis: 100%; max-width: 100%; }
@media (min-width: 48rem) {
  .row > .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .middle-md { align-items: center; }
}
@media (min-width: 64rem) {
  .row > .col-md { flex: 1 1 0; max-width: 100%; }
  .row > .col-md-12 { flex: 0 0 100%; max-width: 100%; }
  .row > .col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .row > .col-md-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
  .row > .col-md-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
  .row > .col-md-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
  .row > .col-md-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
}
@media (min-width: 75rem) {
  .row > .col-lg { flex: 1 1 0; max-width: 100%; }
  .row > .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .row > .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .row > .col-lg-offset-6 { margin-left: 50% !important; }
}

.flex { display: flex; }
.flex-row { flex-direction: row; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.align-center { align-items: center; }
.justify-start { justify-content: flex-start; }
.justify-end { justify-content: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.gap { gap: var(--abstand); }
.gap-half { gap: var(--abstand-halb); }
.text-center, .content-center { text-align: center; }
.content-center { display: flex; flex-direction: column; align-items: center; justify-content: center; }
@media (max-width: 64rem) { .hidden-md { display: none !important; } }
@media (max-width: 48rem) { .hidden-sm { display: none !important; } }

/* ---------------------------------------------------------------- Sektionen */
section { position: relative; padding-bottom: var(--fluss); background-color: var(--weiss); scroll-margin-top: 5rem; }
.site__content { padding-top: var(--kopf-hoehe); }
.site__content > section:first-of-type:not(.section--banner, .bg) { padding-top: calc(var(--fluss) * 0.66); }
.site__content > section:first-of-type:only-child:not(.section--banner, .bg) { padding-top: var(--fluss); }
section.bg { padding-top: var(--fluss); padding-bottom: var(--fluss); }
section.bg.flow-half { padding-top: calc(var(--fluss) / 2); padding-bottom: calc(var(--fluss) / 2); }
section.p0 { padding: 0; }
.section--banner { padding-bottom: 0; }
.section--banner + section, .teaser--regions + section, .listing--regions + section,
.bg + section:not([class*="banner"], .bg), .details--section + section.bg { padding-top: var(--fluss); }
.section--process, .section--counter, .section--property-forms, .section--seo, .teaser--locations, .section--error,
.listing--services { padding-top: var(--fluss); }

/* Hintergruende */
.bg { background-color: var(--grau); color: var(--schwarz); }
.bg--light { background-color: var(--weiss); }
.bg--pri { background-color: var(--weiss); }
.bg--dark { background-color: var(--schwarz); color: var(--weiss); }
.bg--accent { background-color: var(--rot); color: var(--weiss); }
figure.bg-image { position: absolute; inset: 0; z-index: -1; margin: 0 !important; }
.bg-image img { width: 100%; height: 100%; object-fit: cover; margin: 0; }
section.bg--dark { isolation: isolate; }

/* Abdunkeln von Bildern */
.darken { position: relative; }
.darken::after { content: ""; position: absolute; inset: 0; z-index: 5; background-color: #7f7f7f; opacity: 0.6; pointer-events: none; }
.darken--extreme::after { background-color: var(--dunkelgrau); opacity: 0.9; }
.section--banner .darken::after { background-color: #0a0a0a; opacity: 0.6; }

/* ---------------------------------------------------------------- Knoepfe */
.button {
  position: relative; display: inline-block; overflow: hidden; isolation: isolate;
  font-family: var(--schrift); font-size: var(--text-knopf); font-weight: 500; line-height: calc(1em + 0.5rem);
  letter-spacing: 0.5px; text-align: center; text-decoration: none;
  padding: var(--knopf-innen); border-radius: var(--radius-knopf);
  color: var(--schwarz); cursor: pointer; transition: color var(--zeit) ease;
}
.button--solid { display: block; width: fit-content; font-weight: 400; color: var(--weiss); }
.button--solid::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-color: var(--rot); transition: filter var(--zeit) ease;
}
.button--solid:hover::before { filter: brightness(0.85); }
.bg--accent .button--solid, .bg--dark .button--solid { color: var(--schwarz); }
.bg--accent .button--solid::before, .bg--dark .button--solid::before { background-color: var(--weiss); }
.bg--dark .yn-cookie-consent .button--solid { color: var(--weiss); }
.section--banner .button--solid { color: var(--schwarz); }
.section--banner .button--solid::before { background-color: var(--weiss); }
.button--border {
  border: 1px solid currentColor; box-shadow: inset 0 0 0 0.5px currentColor;
  margin-top: calc(var(--zeile) * 1.325);
}
.button--border:hover { background-color: var(--schwarz); color: var(--weiss); }
.button--text {
  display: block; padding: 0; border-radius: var(--radius-knopf);
  font-size: var(--text); font-weight: 700; line-height: 1.4; text-decoration: underline; white-space: nowrap;
}
.button--text:hover { color: var(--rot); }
.buttons, .yn-buttons { display: flex; flex-wrap: wrap; gap: calc(var(--text-knopf) * 0.666); }
.content-center .yn-buttons, .section--cta .yn-buttons { justify-content: center; }

/* ---------------------------------------------------------------- Kopfzeile */
.site__header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: var(--kopf-hoehe);
  background-color: var(--weiss); color: var(--schwarz); transition: transform 0.3s ease-in-out;
}
.site__header.nav-up { transform: translateY(calc(var(--kopf-hoehe) * -1)); }
.js-nav-open .site__header.nav-up { transform: none; }
.site__header > .inner { height: 100%; padding-top: var(--abstand-halb); padding-bottom: var(--abstand-halb); gap: var(--abstand); }
.site__header .left-container > div { gap: var(--abstand); }
.header__logo, .footer__logo { display: flex; align-items: center; gap: 0.35rem; text-decoration: none; }
.header__logo { display: block; position: relative; height: 72px; margin: -4px 0; }
.header__logo figure { width: fit-content; overflow: hidden; }
.header__logo figure, .footer__logo figure { height: 100%; margin: 0; overflow: visible; }
.header__logo img { height: 72px; width: auto; margin: 0; }
.header__logo figure:first-child { display: none; }
.nav__bar { display: flex; align-items: center; gap: 0 1rem; }
.nav__bar p { display: flex; align-items: center; gap: 0.5rem; margin: 0; letter-spacing: 0.5px; white-space: nowrap; }
.site__header .nav__bar .button--text { text-decoration: none; letter-spacing: 0.5px; }
.site__header .flex-column .button--text { line-height: calc(1em + 0.5rem); }
.site__header .flex-column .button--text { text-decoration: none; overflow: visible; }
.site__header .flex-column .button--text p { display: block; line-height: 1.4; font-weight: 400; }
.site__header .flex-column .button--text i { display: inline-block; margin-right: 8px; font-size: var(--text-klein); }

/* Menueknopf (drei Striche) */
.nav__button {
  position: relative; z-index: 100; display: flex; flex-direction: column; justify-content: center; align-items: center;
  width: 50px; aspect-ratio: 1; padding: 8px; border-radius: var(--radius-knopf); isolation: isolate;
}
.nav__button::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background-color: var(--schwarz); }
.nav__button__icon {
  display: block; width: 100%; height: 3px; background-color: var(--weiss); transition: all var(--zeit) ease;
}
.nav__button__icon:not(:last-of-type) { margin-bottom: 5px; }
body:not(.js-nav-open) .nav__button:hover .nav__button__icon:nth-of-type(odd) { width: 70%; }
.js-nav-open .nav__button__icon:nth-of-type(1) { transform: translateY(8px) rotate(45deg); }
.js-nav-open .nav__button__icon:nth-of-type(2) { width: 0; }
.js-nav-open .nav__button__icon:nth-of-type(3) { transform: translateY(-8px) rotate(-45deg); }
.js-nav-open { overflow: hidden; }

/* Menue-Ueberlagerung */
.site__navigation {
  position: fixed; inset: 0; z-index: 99; display: flex; align-items: flex-start;
  overflow-y: auto; background-color: rgba(255, 255, 255, 0.97);
  visibility: hidden; opacity: 0; transition: opacity var(--zeit) ease, visibility var(--zeit) ease;
}
.js-nav-open .site__navigation { visibility: visible; opacity: 1; }
.site__navigation .inner { padding-top: calc(var(--fluss) + var(--kopf-hoehe) / 3); padding-bottom: var(--fluss); }
.nav__site { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1px; }
.nav__site > li {
  flex-basis: 100%; align-self: stretch;   /* Bloecke einer Zeile gleich hoch, wie bisher */
  padding: var(--abstand); background-color: var(--rot); color: var(--weiss);
  font-size: var(--text-nav); line-height: 1.4; opacity: 0; transform: translateY(1rem);
  transition: opacity var(--zeit) ease, transform var(--zeit) ease;
  transition-delay: calc(var(--nav-list-delay, 0) * 0.05s);
}
.js-nav-open .nav__site > li { opacity: 1; transform: none; }
.nav__site > li > a, .nav__site > li > span {
  display: inline-block; font-family: var(--schrift-titel); font-size: var(--text-nav); font-weight: 700;
  text-decoration: none; margin-bottom: var(--zeile);
}
.nav__site__sub { margin-top: calc(var(--text) * 0.4636); font-size: var(--text); line-height: 1.4; }
.nav__site__sub li { display: block; margin-bottom: 4px; padding: 2px 0; font-size: calc(var(--text) - 0.1rem); line-height: 1.4; }
.nav__site__sub a { display: block; position: relative; text-decoration: none; }
.nav__site__sub a:hover { text-decoration: underline; }
@media (min-width: 48rem) { .nav__site > li { flex-basis: calc(50% - 0.5px); } }
@media (min-width: 64rem) { .nav__site > li { flex-basis: calc(33.334% - 0.6667px); } }
@media (min-width: 75rem) { .nav__site > li { flex-basis: calc(25% - 0.75px); } }

.mobile-navigation { display: none; position: fixed; right: var(--abstand); bottom: var(--abstand); z-index: 150; gap: 8px; }
.mobile-navigation__button {
  display: flex; align-items: center; justify-content: center; width: fit-content; padding: 4px 16px;
  border-radius: var(--radius-knopf); background-color: var(--schwarz); color: var(--weiss); overflow: hidden;
}
.mobile-navigation__button .nav__button { width: 42px; padding: 8px; overflow: hidden; }
.mobile-navigation__button .nav__button::after { display: none; }
@media (max-width: 48rem) {
  .mobile-navigation { display: flex; }
  .site__header .nav__button { display: none; }
}

/* ---------------------------------------------------------------- Fusszeile */
.site__footer { background-color: var(--schwarz); color: var(--weiss); padding-top: calc(var(--fluss) / 2); }
.site__footer a { color: var(--weiss); }
.footer__left, .footer__right { display: flex; flex-direction: column; justify-content: space-between; gap: var(--abstand-halb); }
.footer__left { align-items: flex-start; text-align: left; }
.footer__right { align-items: flex-end; text-align: right; }
.footer__logo { display: block; position: relative; width: 256px; max-width: 256px; margin-bottom: var(--zeile); }
.footer__logo figure { overflow: hidden; }
.footer__logo figure:last-child { display: none; }
.footer__logo img { width: 100%; height: auto; margin: 0; }
.address { display: flex; flex-direction: column; margin-bottom: calc(var(--zeile) / 2); }
.address h2 { margin-bottom: calc(var(--zeile) / 2); }
.address .text { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: calc(var(--zeile) / 2); }
.address p { font-weight: 400; }
.address a { display: block; }
.social-media { display: flex; align-items: center; justify-content: center; gap: 12px; }
.social-media a { display: flex; align-items: center; justify-content: center; position: relative; font-size: calc(var(--text) + 0.6rem); line-height: 1; text-decoration: none; }
.regions-wrapper { text-align: right; }
.regions-wrapper label { display: block; font-size: var(--text-klein); }
.regions-select { margin-top: 8px !important; background-color: var(--schwarz); color: var(--weiss); white-space: pre-wrap; letter-spacing: normal; }
.nav_footer { flex-direction: column; flex-wrap: wrap; align-items: flex-end; gap: 0.2rem 1rem; text-align: right; }
.site__footer .flex { gap: var(--abstand); align-items: flex-end; }
.footer__bottom { padding: var(--abstand-halb) 0 0.5rem; }
.legal_footer { justify-content: center; flex-wrap: wrap; gap: 0.2rem 1rem; }
.legal_footer .button--text { font-size: var(--text-klein); }
@media (max-width: 48rem) {
  .footer__left, .footer__right { align-items: stretch; text-align: start; }
  .nav_footer { align-items: flex-start; text-align: start; }
  .regions-wrapper { text-align: start; }
  .site__footer .flex { flex-direction: column; align-items: flex-start; }
}

/* ---------------------------------------------------------------- Artikel (Ynfinite-Bausteine) */
.yn-article { font-size: 1rem; }
.yn-article > :last-child { margin-bottom: 0; }
.yn-article__heading { margin-bottom: var(--zeile); }
.yn-article__heading:not(:first-child) { margin-top: calc(var(--zeile) * 2); }
.yn-article__heading > :last-child { margin-bottom: 0; }
.yn-article__text { margin-bottom: var(--zeile); }
.yn-article__intro-text { margin-bottom: var(--zeile); }
.yn-article__intro-text p { font-size: calc(1.1rem + 0.35 * var(--fl)); font-weight: 500; }
.yn-article__links { display: flex; flex-direction: column; gap: 8px; margin-top: calc(var(--zeile) * 1.325); }
.yn-article__image_text { display: flex; flex-direction: row-reverse; gap: var(--abstand); margin-bottom: calc(var(--zeile) * 2); }
.yn-article__text-wrapper { flex: 1 1 0; }
.yn-article__images { margin: calc(var(--zeile) * 1.25) 0; }
.yn-article__images figure { margin: 0; }
.yn-article__images img { width: 100%; }
.yn-article__table-of-contents { margin-bottom: var(--zeile); }
@media (max-width: 64rem) { .yn-article__image_text { display: block; } }

/* Kopf-Symbol vor der ersten Ueberschrift (Logo-Zeichen) */
.intro:not(.noHeadingIcon) .yn-article__heading:first-of-type .heading:first-of-type,
.headingIcon .yn-article__heading:first-of-type .heading:first-of-type {
  display: flex; flex-direction: row; gap: 8px; position: relative;
}
.intro:not(.noHeadingIcon) .yn-article__heading:first-of-type .heading:first-of-type::before,
.headingIcon .yn-article__heading:first-of-type .heading:first-of-type::before {
  content: ""; display: block; flex: none; height: 1.2em; aspect-ratio: 52 / 62; background-color: currentColor;
  -webkit-mask: url("/assets/img/icon.svg") no-repeat center / contain; mask: url("/assets/img/icon.svg") no-repeat center / contain;
}

/* Einleitung ueber Listen und Teasern */
.intro { margin-bottom: calc(var(--zeile) * 2); max-width: 60rem; }
.intro.no-max-width { max-width: none; }
.intro .yn-article { margin-bottom: 0; }
.intro > .button--border { margin-top: calc(var(--zeile) * 1.325); }
@media (max-width: 48rem) { h1.tagline, h2.tagline, h3.tagline { font-size: var(--text-klein); } }

/* ---------------------------------------------------------------- Banner */
.section--banner { color: var(--weiss); }
.banner { position: relative; min-height: 450px; }
.banner--full { min-height: 630px; }
@media (max-width: 64rem) { .banner--full { min-height: 450px; } }
.banner .splide, .banner .splide__track, .banner .splide__list, .banner .splide__slide { min-height: inherit; }
.banner__media { position: absolute; inset: 0; margin: 0 !important; }
.banner__media img { width: 100%; height: 100%; object-fit: cover; margin: 0; }
.banner__container {
  position: relative; z-index: 80; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  min-height: inherit; color: var(--weiss);
}
.banner__container .inner { width: 100%; min-height: inherit; padding-top: var(--rand); padding-bottom: var(--rand); line-height: calc(1em + 0.5rem); }
.banner__content { display: flex; flex-direction: column; justify-content: center; color: var(--weiss); }
.banner__content :is(h1, h2, h3, h4, p, li, .tagline) { color: var(--weiss); }
.banner__content .heading { font-size: var(--h2); }
.banner--half { min-height: 50vh; }
.banner--half .banner__container .row { min-height: inherit; }
@media (min-width: 64rem) { .banner--half .middle-md { align-items: center; } }
/* Platzhalter reserviert im Banner den Platz fuer das Bewertungsformular (liegt darueber) */
.property-form-placeholder { min-height: calc(820px + 6.25vw); }
.property-form-container { position: absolute; inset: 0; z-index: 90; pointer-events: none; color: var(--schwarz); }
.property-form-container .inner { width: 100%; padding-top: var(--rand); padding-bottom: var(--rand); }
.property-form-container .banner__content { pointer-events: all; }
/* Formular-Rahmen: grauer Kasten nur mit .bg (im Banner der Immobiliensuche steht das Formular frei auf dem Bild) */
.property-form-wrapper.bg { background-color: var(--grau); color: var(--schwarz); border-radius: 10px; overflow: hidden; padding: var(--abstand-gross); }
.property-form-wrapper .yn-cookie-consent { background-color: var(--grau); padding: 48px; }
.property-form-wrapper iframe { width: 100%; border: 0; }
.property-form-container .row { height: 100%; }
@media (max-width: 48rem) { .property-form-wrapper.bg { padding: var(--abstand); } }

/* ---------------------------------------------------------------- Einzelne Sektionstypen */
.section--info figure.rounded { border-radius: 10px; margin: 0; }
.section--info figure img { width: 100%; margin: 0; }
.section--cta .inner { display: flex; align-items: center; justify-content: center; text-align: center; }
.section--cta .yn-article__heading .heading { justify-content: center; }
.section--cta .yn-article__links { align-items: center; }
.section--article .yn-article__text h2 { font-size: var(--h2); margin-bottom: var(--zeile); }
.section--seo .item :is(p, li, ul) { font-size: var(--text-klein); line-height: 1.4; margin-bottom: calc(var(--text-klein) * 0.7); }
.section--seo .item ul { list-style: disc; padding-left: 24px; }
.section--seo h3 { font-size: var(--h3); margin: 0 0 calc(var(--text-klein) * 0.7); }
.section--error { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: calc(100vh - var(--kopf-hoehe)); padding-top: var(--fluss); }
.section--error .number { font-size: calc(var(--h1) + 4.6rem); line-height: 1.2; margin-bottom: calc(var(--zeile) * 0.25); }

/* Prozess-Schritte und Zahlen */
.section--process .row { counter-reset: prozess; margin-bottom: calc(var(--zeile) * 1.5); }
.item--process { counter-increment: prozess; }
.item--process::before { content: counter(prozess); display: flex; font-family: var(--schrift-titel); font-size: var(--zahl); line-height: 0.9; color: inherit; margin-bottom: var(--zeile); }
.item--counter .number { margin-bottom: calc(var(--zeile) * 0.25); }

/* Kontaktbereich mit Formular */
.section--form { color: var(--weiss); }
.section--form .intro .heading, .section--form .intro p, .section--form .intro li { color: var(--weiss); }
.section--form .yn-article__text ul[style*="circle"] > li { background: var(--weiss); color: var(--schwarz); }

/* Karte: Platzhalter bis zur Zustimmung */
.yn-cookie-consent { background-color: rgba(0, 0, 0, 0.086); border-radius: 16px; padding: calc(1.5rem + 1.5 * var(--fl)) 1rem; text-align: center; }
.yn-cookie-consent__inner { display: flex; flex-direction: column; align-items: center; max-width: 42rem; margin: 0 auto; }
.yn-cookie-consent__inner h3 { margin-bottom: var(--zeile); }

/* ---------------------------------------------------------------- Elemente (Karten) */
.item { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; overflow: hidden; height: 100%; }
.item :is(.item__media, img, figure) { margin-bottom: 0 !important; }
.item__media { position: relative; width: 100%; overflow: hidden; }
.item__media:not(.logo, .no-ar, .quote) img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform 0.6s ease; }
.item--link:has(a:hover) .item__media:not(.logo) img { transform: scale(1.05); }
.item__media a { display: block; }
.item__content { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0%; min-height: auto; width: 100%; }
.item--news .item__content, .item--occasions .item__content { padding-top: var(--abstand-halb); }
.item__content .heading { display: block; text-decoration: none; margin-bottom: calc(var(--zeile) / 2); }
.item__content .heading:hover { color: var(--rot); }
.item__content h2.h4 { margin-bottom: calc(var(--zeile) / 2); }
.item__content .heading h2 { margin-bottom: 0; }
.item__content__text { position: relative; overflow: hidden; display: block; line-height: calc(1em + 0.5rem); margin-bottom: calc(var(--zeile) * 0.75); }
.item__content__text:not(.no-fade-out) { max-height: calc(3 * (1em + 0.5rem)); }
.item__content__text:not(.no-fade-out)::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: calc(1em + 0.5rem);
  background-image: linear-gradient(to right, transparent 33.33%, var(--flaeche, var(--weiss)));
}
.bg .item__content__text { --flaeche: var(--grau); }
.bg--pri .item__content__text, .bg--light .item__content__text { --flaeche: var(--weiss); }
.item__content__text p { margin: 0; }
.item--border { border: 1px solid currentColor; padding: var(--abstand-halb); }
.item--padding { padding: var(--abstand); }
.item--padding--small { padding: var(--abstand-halb); }
.item--rounded { border-radius: 10px; }

/* Leistungen */
.item--services .item__content { padding: 0; }

/* Team */
.item--single { flex-direction: row; align-items: stretch; gap: var(--abstand); }
.item--single .item__content, .item--single .item__media:not(.logo) { flex: 1; max-width: calc(50% - var(--abstand) / 2); }
.item--team .item__media img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.item--team .text-wrapper { display: flex; flex-direction: column; }
.item--team .text-wrapper a { font-weight: 700; text-decoration: none; }
@media (max-width: 48rem) {
  .item--single { flex-direction: column; align-items: flex-start; gap: 0; }
  .item--single .item__content, .item--single .item__media:not(.logo) { max-width: none; width: 100%; }
  .item--single .item__content { padding-top: var(--abstand-halb); }
}

/* Auszeichnungen */
.item--awards .item__media.logo { width: 100%; }
.item--awards .item__media.logo img { width: 100%; max-height: 10rem; object-fit: contain; }
.item--awards.only-image .item__media.logo img { width: auto; height: calc(5rem + 2 * var(--fl)); max-height: none; }
.item--awards .item__content { padding-top: var(--abstand-halb); }
.item--awards h2 { margin-bottom: calc(var(--zeile) / 2); }

/* Werte */
.item--values { background-color: var(--grau); }
.item--values .item__content::before {
  content: ""; display: block; width: 50px; height: 50px; margin-bottom: var(--zeile); background-color: var(--schwarz);
  -webkit-mask: var(--icon) no-repeat center / contain; mask: var(--icon) no-repeat center / contain;
}
.item--values h4 { margin-bottom: calc(var(--zeile) / 2); }

/* FAQ als Karte (Listenseite) */
.item--faq { cursor: pointer; }
.item--faq h2 { margin-bottom: calc(var(--zeile) / 2); }
.item--faq .item__preview { display: none; }
.item--faq .item_replace { display: block; position: relative; overflow: hidden; }
.item--faq.hide .item_replace { max-height: calc(var(--zeile) * 4.2); }
.item--faq.hide .item_replace::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: var(--zeile);
  background-image: linear-gradient(to right, transparent 33.33%, var(--grau));
}
.item--faq .toggle__button { margin-top: calc(var(--zeile) / 2); }

/* Regionen */
.region-wrapper { position: relative; padding: var(--fluss) 0; }
.region-wrapper > figure { position: absolute; inset: 0; margin: 0 !important; }
.region-wrapper > figure img { width: 100%; height: 100%; object-fit: cover; margin: 0; }
.region-wrapper > .inner { position: relative; z-index: 6; }
.region-wrapper .intro :is(.heading, .tagline, p) { color: var(--weiss); }
.region-wrapper .intro .button--border { color: var(--weiss); }
.item--regions .item__content { padding: var(--abstand); max-width: 50%; }
@media (max-width: 64rem) { .item--regions .item__content { max-width: none; } }

/* Standorte */
.item--locations { flex-direction: row; align-items: flex-start; }
.item--locations .item__media { flex: 1 1 0; align-self: stretch; }
.item--locations .item__media img { height: 100%; aspect-ratio: auto !important; }
.item--locations .item__content { justify-content: center; padding: var(--fluss) var(--abstand); }
@media (max-width: 48rem) {
  .item--locations { flex-direction: column; }
  .item--locations .item__content { padding: var(--abstand); justify-content: normal; }
}

/* Kundenstimmen */
.gallery--wrapper { display: flex; flex-direction: column; gap: var(--abstand); }
.gallery { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; gap: var(--abstand); }
.gallery__column { display: flex; flex-direction: column; justify-content: center; gap: var(--abstand); flex: 1 1 0; }
.gallery__column--left { align-items: flex-end; }
.gallery__column--right { align-items: flex-start; }
.gallery__column.mobile { display: none; }
@media (max-width: 48rem) {
  .gallery { flex-direction: column; }
  .gallery__column--left, .gallery__column--right { display: none; }
  .gallery__column.mobile { display: flex; width: 100%; }
}
.item--feedback { padding: calc(2.25rem + 1.5 * var(--fl)); height: auto; width: 100%; }
.item--feedback .quote { display: block; font-size: calc(2.5rem + 1.5 * var(--fl)); line-height: 1; margin-bottom: calc(var(--zeile) * 0.75); color: var(--weiss); }
.item--feedback .item__content { color: var(--weiss); }
.item--feedback h2 { color: var(--weiss); margin-bottom: calc(var(--zeile) / 2); }
.item--feedback .date { font-family: var(--schrift-titel); font-size: 0.85em; font-weight: 400; }
.item--feedback blockquote { position: relative; overflow: hidden; margin-bottom: calc(var(--zeile) * 0.75); }
.item--feedback.hide blockquote { max-height: calc(var(--zeile) * 3); }
.item--feedback.hide blockquote::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: var(--zeile);
  background-image: linear-gradient(to right, transparent 33.33%, var(--rot));
}
.item--feedback blockquote p { margin-bottom: calc(var(--zeile) / 2); }
.toggle__button { display: block; padding: 0; font-weight: 700; font-size: var(--text-knopf); text-decoration: underline; color: inherit; }
.feedbackInfo { margin: 0; font-size: var(--text-klein); font-weight: 600; line-height: 1.2; }
.feedback .gallery--wrapper { margin-bottom: var(--abstand-halb); }

/* Vertrauen: Auszeichnungen unter den Kundenstimmen */
.awards { display: flex; flex-direction: column; align-items: center; gap: var(--abstand); margin-top: calc(var(--fluss) / 2); }
.awards_heading { display: flex; flex-direction: column; align-items: center; text-align: center; }
.awards_heading h3 { margin-bottom: 0; }
.awards_heading .button--border { margin-top: var(--abstand-halb); }

/* ---------------------------------------------------------------- Schieberegler */
/* Grundfunktion kommt aus splide-core.min.css (MIT); hier nur das Aussehen */
.splide__slide { list-style: none; margin: 0; }
.splide__controls {
  position: relative; z-index: 99; display: flex; align-items: center; justify-content: center; gap: 8px;
  width: fit-content; margin: var(--zeile) auto 0; padding: 0.5rem; isolation: isolate;
}
.splide__controls::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: var(--weiss); opacity: 0.7; }
.splide__controls { overflow: hidden; color: var(--schwarz); }
.splide--overlay .splide__controls { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto auto calc(var(--fluss) / 4); height: fit-content; }
.splide__controls > * { position: relative; z-index: 1; }
.splide__arrow { display: flex; align-items: center; justify-content: center; width: 20px; font-size: 20px; line-height: 24px; color: var(--rot); border-radius: 50%; opacity: 0.7; }
.splide__arrow:hover { opacity: 1; }
.splide__arrow:disabled { opacity: 0; }
.splide__pagination { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; width: fit-content; }
.splide__pagination li { display: flex; }
.splide__pagination__page {
  width: calc(0.625rem + 0.075 * var(--fl)); aspect-ratio: 1; margin: 3px; border-radius: 50%;
  background-color: var(--rot); opacity: 0.6; transition: opacity var(--zeit) ease, transform var(--zeit) ease;
}
.splide__pagination__page.is-active { opacity: 1; transform: scale(1.3); }
.splide:has(.splide__pagination > li:only-child) .splide__controls { display: none; }

/* ---------------------------------------------------------------- Aufklapper (FAQ) */
.yn-accordion { position: relative; padding: calc(var(--abstand) / 4) 0; border-top: 1px solid currentColor; }
.yn-accordion:last-child { border-bottom: 1px solid currentColor; }
.yn-accordion__header { position: relative; cursor: pointer; padding: calc(var(--abstand) / 3) calc(var(--abstand) + 12px) calc(var(--abstand) / 3) 0; font-size: 1rem; line-height: 1.5; }
.yn-accordion__header span { font-size: calc(var(--text) + 0.2rem); line-height: calc(1em + 0.5rem); }
.yn-accordion__header::before, .yn-accordion__header::after {
  content: ""; position: absolute; top: 50%; right: var(--abstand); width: 0.75rem; height: 2px; background-color: currentColor;
  transform: translateY(-50%); transition: transform var(--zeit) ease-in-out, opacity var(--zeit) ease;
}
.yn-accordion__header::after { transform: translateY(-50%) rotate(90deg); }
.yn-accordion.is-active .yn-accordion__header::after { transform: translateY(-50%) rotate(90deg) scaleX(0); }
.yn-accordion__content { overflow: hidden; transition: height var(--zeit) ease, visibility var(--zeit) ease; }
.yn-accordion.js-enabled:not(.is-active) .yn-accordion__content { visibility: hidden; }
.yn-accordion__content .yn-article { padding: 0.5rem var(--abstand) 1rem; }
/* Aufklapper innerhalb von Artikeln (z. B. Checklisten): rote Balken */
.yn-article__accordions { margin-bottom: calc(var(--zeile) * 1.25); }
.yn-article__accordions .yn-accordion { border: 0; margin-bottom: 8px; padding: 0; background-color: var(--rot); color: var(--weiss); }
.yn-article__accordions .yn-accordion:last-child { border: 0; }
.yn-article__accordions .yn-accordion__header { padding: 0.5rem calc(var(--abstand) + 12px) 0.5rem var(--abstand-halb); }
.yn-article__accordions .yn-accordion__header { padding-top: 0.55rem; padding-bottom: 0.55rem; }
.yn-article__accordions .yn-accordion__header span { font-size: var(--text); }
.yn-article__accordions .yn-accordion__content .yn-article { background-color: var(--weiss); color: var(--schwarz); }

/* ---------------------------------------------------------------- Seitenweiterschaltung */
.yn-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px; padding-top: calc(var(--fluss) / 2); font-weight: 600; }
.yn-pagination li { display: flex; align-items: center; justify-content: center; min-height: 30px; aspect-ratio: 1; margin: 4px; }
.yn-pagination a, .yn-pagination span {
  display: block; width: 40px; min-height: 40px; aspect-ratio: 1; padding: 0 4px; line-height: 40px; text-align: center;
  text-decoration: none; font-weight: 700;
}
.yn-pagination a { display: flex; align-items: center; justify-content: center; position: relative; }
.yn-pagination__control a { font-size: 24px; padding: 0; }
.yn-pagination__page--active { background-color: var(--hellgrau); }
.yn-pagination__page--active span { display: flex; font-weight: 400; background-color: var(--hellgrau); }
.yn-disabled { opacity: 0.4; pointer-events: none; }

/* ---------------------------------------------------------------- Formulare */
.yn-form { width: 100%; }
.yn-form fieldset { display: flex; flex-direction: column; justify-content: center; }
.yn-form fieldset > legend, .yn-form fieldset > input[type="hidden"] { display: none; }
.yn-form .form-content { width: 100%; text-align: left; }
.yn-form-page { margin-bottom: 16px; }
.yn-form-grid-row { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.yn-form-grid-field { flex: 1 1 0; padding: 0 8px; }
.yn-form-grid-field-12 { max-width: 100%; flex-basis: 100%; }
.yn-form-grid-field-6 { max-width: 50%; }
.yn-form-grid-field-4 { max-width: 33.333%; }
.yn-form-grid-field-3 { max-width: 25%; }
@media (max-width: 48rem) {
  .yn-form-grid-row { flex-direction: column; }
  .yn-form-grid-field { max-width: none; flex-basis: auto; }
}
.widget { margin-bottom: 16px; font-size: var(--text); }
.widget__label { display: block; margin-bottom: calc(var(--zeile) * 0.25); font-size: var(--text-klein); font-weight: 400; }
.widget__input-container { margin-bottom: 0; }
input:not([type="checkbox"], [type="radio"], [type="hidden"], [type="submit"]), select, textarea {
  display: block; width: 100%; font: 300 var(--text) / 1.4 var(--schrift); color: inherit; letter-spacing: 0.25px;
  background: transparent; border: 1px solid currentColor; border-radius: 0;
  padding: calc(var(--text) * 0.7418) calc(var(--text) * 1.1127);
}
textarea { min-height: 128px; resize: vertical; }
select {
  appearance: none; padding-right: calc(var(--text) * 3.7089);
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 1.6em) 50%, calc(100% - 1.2em) 50%;
  background-size: 0.4em 0.4em; background-repeat: no-repeat;
}
.bg--dark select option { color: var(--schwarz); }
::placeholder { color: currentColor; opacity: 0.6; }
.yn-consents { margin: 16px 0; font-size: var(--text-klein); }
.yn-consents .yn_consents_v2 { display: none; }
.yn-consents label, .widget--checkbox label { display: flex; gap: 0.6rem; align-items: flex-start; font-size: var(--text-klein); }
.yn-consents .widget--checkbox, .widget--checkbox { position: relative; }
.yn-consents input[type="checkbox"], .widget--checkbox input[type="checkbox"] { position: absolute; left: 0; top: 0; width: 2px; height: 2px; opacity: 0; z-index: -1; }
.yn-consents label.widget__label, .widget--checkbox label.widget__label { display: flex; align-items: flex-start; gap: 0; line-height: calc(1em + 0.5rem); margin: 0; cursor: pointer; }
.widget--checkbox label.widget__label::before {
  content: ""; flex: none; width: 20px; height: 20px; margin-right: 10.4px; border: 1px solid currentColor;
  background: no-repeat center / 70%;
}
.widget--checkbox input:checked + label::before, .widget--checkbox input:checked ~ label::before {
  background-color: var(--rot); border-color: var(--rot);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2.5' d='M3 8.5l3.2 3L13 4.5'/%3E%3C/svg%3E");
}
.widget--checkbox input:focus-visible + label::before { outline: 2px solid var(--rot); outline-offset: 2px; }
.yn-consents p { font-size: var(--text-klein); }
.yn-form .button { margin-top: 0.5rem; }
.yn-form-response, .yn-error:empty { display: none; }
.yn-error { color: #f74949; margin-bottom: 1rem; }

/* ---------------------------------------------------------------- Einblenden beim Scrollen */
[data-fade-in] { opacity: 0; transform: translateY(3rem); transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; transition-delay: calc(var(--index, 0) * 0.08s); }
[data-fade-in].fade-in, .faded-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-fade-in] { opacity: 1; transform: none; transition: none; } }

/* ---------------------------------------------------------------- Detailseiten */
.details--section > .inner > div > figure { margin-bottom: calc(var(--zeile) * 1.5) !important; }
.details--section > .inner > div > figure img { width: 100%; aspect-ratio: 1920 / 800; object-fit: cover; margin: 0; }
.details--section h1.h2 { margin-bottom: calc(var(--zeile) * 1.25); }
.details--section .yn-article__heading .heading::before { display: none; }

/* ---------------------------------------------------------------- Formular-Rueckmeldungen */
.yn-form.wird-gesendet button[type="submit"] { opacity: 0.6; pointer-events: none; }
.yn-form-response.sichtbar { display: block; }
.yn-form-response__inner { font-size: var(--text); line-height: 1.4; }
.yn-form-response__control { padding-top: var(--abstand); }
.yn-error.sichtbar { display: block; }
.formular-hinweis { padding: 1rem var(--rand); background: var(--rot); color: var(--weiss); font-weight: 500; text-align: center; }
.formular-hinweis--fehler { background: var(--schwarz); }

/* ---------------------------------------------------------------- Immobilien */
/* Objektkarte (Listen und Teaser) */
.item--properties { height: 100%; }
.item--properties .item__media .overlay {
  position: absolute; right: 0; bottom: 0; z-index: 70; margin: 0 !important; width: fit-content;
  padding: var(--knopf-innen); padding-left: 2rem; padding-right: 2rem; font-weight: 400; text-transform: uppercase;
  background-color: var(--rot); color: var(--weiss); border-top-left-radius: 10px;
}
.item--properties .item__content { padding-top: 16px; }
.item--properties .item__media a { position: relative; text-decoration: none; font-size: var(--text); line-height: calc(1em + 0.5rem); }
.item--properties p.tagline { font-family: var(--schrift-titel); font-weight: 500; line-height: 1.2; }
.item--properties h3.no-lh { line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item--properties h3.h5 { margin-top: 0; margin-bottom: calc(var(--zeile) / 2); }
.item--properties .item__content .heading { margin-bottom: 0; }
.item--properties ul { width: 100%; padding: 0; margin-bottom: calc(var(--zeile) * 0.75); list-style: none; font-size: var(--text); line-height: 1.4; }
.item--properties li :is(h1, h2, h3, h4, h5, h6) { font-size: var(--text); line-height: calc(1em + 0.5rem); margin: 0; }
.item--properties .button { margin-top: auto; margin-left: 0 !important; }
.item--properties:not(.item--top-property) h3.h5 { display: block; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.item--properties h3.h5 > a { display: inline; }
@media (max-width: 63.99rem) {
  .item--properties.item--top-property h3.h5 { display: block; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
}
@media (min-width: 64rem) {
  .item--properties.item--top-property { flex-direction: row; align-items: flex-start; }
  .item--properties.item--top-property .item__content { padding-left: var(--abstand); padding-right: var(--abstand); }
  .item--properties.item--top-property figure { min-width: 50%; height: 100%; }
  .item--properties.item--top-property .item__media img { height: 100%; }
  .item--properties.item--top-property .item__content { min-width: 50%; padding-top: 0; }
}
@media (min-width: 75rem) {
  .item--properties.item--top-property figure { min-width: calc(67% - var(--abstand) / 2); }
  .item--properties.item--top-property .item__content { min-width: calc(33% - var(--abstand) / 2); }
}
.item--properties.item--rounded { border-radius: 0; }

/* Objektliste mit Filter */
#listing__filter { margin-top: var(--abstand-halb); }
.listing--properties { min-height: 540px; }
.listing--properties + .section--property-forms { padding-top: 0; }
#listing__filter form .yn-form-grid-row { flex-wrap: wrap; gap: 1rem 0; }
#listing__filter form .yn-form-grid-row > * { flex: 1 1 0; min-width: min(12rem, 100%); max-width: none; }
#listing__filter form .yn-form-grid-row > *:has(.distance-wrapper) { min-width: min(24rem, 100%); }
.distance-wrapper { display: flex; gap: 16px; }
.distance-wrapper > .widget { flex: 1 1 0; }
#listing__filter .widget { margin-bottom: 0; }
#listing__filter .yn-form-page { margin-bottom: 0 !important; }
#listing__filter fieldset { border: 0; padding: 0; margin: 0; }
#listing__filter .search-button { display: none; }
@media (max-width: 48rem) {
  #listing__filter .search-button { display: block; }
  #listing__filter .distance-wrapper { gap: 0; }
  .distance-wrapper { flex-direction: column; }
}
#listing > h2.h3 { margin-bottom: calc(var(--zeile) * 1.5); }
.listing--properties .inner.noPropertiesForm { display: none; padding-top: var(--abstand); }
.noPropertiesForm .property-form-wrapper { width: 100%; margin: auto; }
@media (min-width: 64rem) { .noPropertiesForm .property-form-wrapper { max-width: var(--breite-schmal); } }
.listing--properties:not(:has(.item--properties)) .inner.noPropertiesForm { display: block; }

/* Objektseite: Banner mit Titelbild (Text unten, Hoehe nach Fenster) */
.banner--box { min-height: 50vh; }
@media (min-width: 64rem) { .banner--box { min-height: 70vh; } }
.banner--box .banner__container .row { min-height: inherit; }

/* Objektseite: Inhaltsbereich */
.sections--properties-wrapper, .sections--properties-inner-wrapper { padding: 0; }
.sections--properties-inner-wrapper > section { padding-top: 0; }
.section--description .intro, .section--furnishing .intro, .teaser--map .intro { max-width: none; margin-bottom: 0; }
.teaser--map .intro { margin-bottom: calc(var(--zeile) * 2); }
.toggle-wrapper.hide .toggle_image { display: none; }
.section--gallery .gallery, .section--gallery .gallery__column { gap: var(--abstand-halb); }
.section--gallery .gallery { flex-direction: row; }
@media (min-width: 75rem) {
  .sections--properties-wrapper { max-width: var(--breite); margin: 0 auto; padding-left: var(--rand); padding-right: var(--rand); }
  .sections--properties-inner-wrapper .inner { max-width: none; padding: 0; }
}
.section--gallery .gallery__item, .section--gallery .gallery__item figure, .section--gallery .gallery__item img { width: 100%; margin: 0; }
.section--gallery .gallery__item { overflow: hidden; }
.section--gallery .gallery__item a { display: block; position: relative; text-decoration: none; }
.section--gallery .gallery__item img { display: block; height: auto; }
.section--gallery .toggle__button { flex-basis: 100%; display: flex; justify-content: center; text-decoration: none; }
.toggle-wrapper:not(.hide) .toggle__button { display: none; }
@media (max-width: 48rem) { .section--gallery .gallery { flex-direction: column; } }

/* Objektdaten */
.section--facts { container-type: inline-size; }
.section--facts h2.h3 { margin-bottom: var(--zeile); }
.section--facts ul.list { padding: 0; margin: 0; list-style: none; }
.section--facts ul.list li { padding: 0.5rem 0; border-bottom: 1px solid currentColor; }
.section--facts .row .row > [class*="col-"] { margin-top: 0 !important; margin-bottom: 0 !important; }
@media (min-width: 64rem) { .section--facts .row > .col-md-6 { flex: 0 0 50%; max-width: 50%; } }
@container (max-width: 650px) {
  .section--facts .row > [class*="col-md"] { flex-basis: 100%; max-width: 100%; }
}

/* Energieskala */
.energy-pass { position: relative; display: flex; flex-direction: column; margin-top: var(--abstand); }
.energy-pass__container { display: flex; flex-direction: row; align-items: center; justify-content: center; }
.energy-pass__container--letters {
  height: 2.5rem; border-radius: 10px;
  background: linear-gradient(to right, #508c37 0%, #a7c51b 25%, #fbfc01 50%, #e19213 75%, #c52826);
}
.energy-pass__container--letters .energy-pass__item { display: flex; align-items: center; justify-content: center; text-align: center; color: var(--schwarz); }
.energy-pass__container--letters .energy-pass__item + .energy-pass__item { border-left: 1px solid currentColor; }
.energy-pass__container--numbers { display: none; }
.energy-pass .energy-pass__item { flex: 1 1 var(--width); max-width: var(--width); height: 100%; padding: 4px; font-size: var(--text-klein); }
.energy-pass__pin {
  position: relative; left: min(var(--pos) / 250 * 100%, 100%); transform: translateX(-50%);
  display: block; width: max-content; margin-top: 25px; padding: 0.75rem; border-radius: 10px;
  background-color: var(--schwarz); color: var(--weiss);
}
.energy-pass__pin :is(p, h3) { color: var(--weiss); margin: 0; }
.energy-pass__pin::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 100%; margin: 0 auto -1px; width: 30px; height: 15px;
  background-color: var(--schwarz); clip-path: polygon(0 0, 50% 100%, 100% 0); transform: rotate(180deg);
}
@media (min-width: 48rem) { .energy-pass__container--numbers { display: flex; } }
@media (max-width: 48rem) {
  .energy-pass__pin { background-color: transparent; padding: 0; }
  .energy-pass__pin > * { display: none; }
}

/* Immobiliensuche im Banner (/immobilie-finden): Felder und "Filtern" in einer Zeile auf dem Bild */
.banner .property_filter .widget { margin-bottom: 0; }
.banner .property_filter .distance-wrapper > .widget:last-child { max-width: 12rem; }
.banner select option { color: var(--schwarz); }
@media (min-width: 48rem) {
  .banner .property_filter .form-content { display: flex; flex-direction: row; gap: 16px; }
  .banner .property_filter .yn-form-page { flex: 1 1 0; }
  .banner .property_filter .button--filter { flex: 0 0 auto; align-self: flex-end; min-width: 120px; margin: 0; }
}
@media (max-width: 48rem) {
  .banner .property_filter .distance-wrapper { gap: 8px; }
  .banner .property_filter .distance-wrapper > .widget { max-width: none; margin-bottom: 16px; }
}
/* Finanzierungs-/Suchformular-Sektion: nur direkt unter einem Banner mit Abstand nach oben (wie Bestandsseite) */
main > :not(.section--banner) + .section--property-forms { padding-top: 0; }
/* "Filtern" so hoch wie die Eingabefelder */
.button--filter { padding-top: calc(var(--text) * 0.7418); padding-bottom: calc(var(--text) * 0.7418); }
.banner .property_filter .yn-form-grid-row { gap: 16px 0; }
@media (max-width: 48rem) {
  .banner .property_filter .distance-wrapper > .widget:last-child { max-width: none; }
}
/* Formular im grauen Kasten innerhalb eines Banners (z. B. /tippgeber): dunkle Schrift, roter Knopf wie ausserhalb */
.banner .property-form-wrapper.bg, .banner .property-form-wrapper.bg :is(h1, h2, h3, h4, p, li, label, a, .tagline, .heading) { color: var(--schwarz); }
.section--banner .property-form-wrapper.bg .button--solid { color: var(--weiss); }
.section--banner .property-form-wrapper.bg .button--solid::before { background-color: var(--rot); }
.banner .property-form-wrapper.bg .heading.h3 { font-size: var(--h3); line-height: 1.2; }
.banner .property-form-wrapper.bg .intro { margin-bottom: 0; }
/* Banner mit Formularkasten: Platzhalter-Hoehe setzt website.js (= Hoehe des Kastens). Unter 75rem sitzt der
   Kasten unten im Banner, also unter Ueberschrift und Text (wie Bestandsseite). */
@media (max-width: 74.99rem) {
  .section--banner .property-form-container { top: auto; bottom: 0; height: fit-content; margin-bottom: calc(1.25rem + 16px); }
  .section--banner .property-form-container .row { height: auto; }
}

/* ---------------------------------------------------------------- Online-Immobilienbewertung (Startseite, /immobilie-bewerten) */
/* Karte um das eingebettete Formular (forms.ottogruppe.de); Hoehe des Formulars setzt website.js */
.bewertung-karte {
  background: var(--weiss); color: var(--schwarz); border-radius: 16px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.12);
}
.bewertung-karte__kopf {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px;
  padding: 20px 28px 18px; border-bottom: 1px solid #eceef1;
}
.banner .bewertung-karte .bewertung-karte__titel {
  margin: 0; font-family: var(--schrift-titel); font-size: var(--h4); line-height: 1.2; font-weight: 500; color: var(--schwarz);
}
.bewertung-karte__marke {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 30px;
  background: rgba(229, 2, 3, 0.08); color: var(--rot); font-size: var(--text-klein); font-weight: 600; white-space: nowrap;
}
.bewertung-karte__formular { display: block; width: 100%; height: 460px; min-height: 300px; border: 0; background: #f9fafb; transition: height 0.25s ease; }
.banner .bewertung-karte .bewertung-karte__fuss {
  display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 28px;
  background: #f9fafb; border-top: 1px solid #eceef1; color: #5b6470; font-size: var(--text-klein); line-height: 1.4;
}
.bewertung-karte__fuss i { color: #5b6470; }
@media (max-width: 48rem) {
  .bewertung-karte__kopf { padding: 16px 18px 14px; }
  .banner .bewertung-karte .bewertung-karte__fuss { padding: 10px 18px; }
}
/* Bild hinter dem Formular: dunkler Verlauf statt flacher Abdunklung (Text links bleibt gut lesbar) */
.section--banner:has(.bewertung-karte) .banner__media::after {
  background: linear-gradient(90deg, rgba(10, 10, 10, 0.78) 0%, rgba(10, 10, 10, 0.55) 50%, rgba(10, 10, 10, 0.35) 100%);
  opacity: 1;
}
@media (max-width: 64rem) {
  .section--banner:has(.bewertung-karte) .banner__media::after { background: rgba(10, 10, 10, 0.62); }
}
/* Vertrauenspunkte unter dem Einleitungstext */
.banner__vorteile { list-style: none; padding: 0; margin: calc(var(--zeile) * 1.25) 0 0; display: grid; gap: 10px; }
.banner__content .banner__vorteile li { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--weiss); font-weight: 500; }
.banner__vorteile i { color: var(--weiss); width: 1.2em; text-align: center; }
.banner__vorteile .sterne { color: #fbbc04; letter-spacing: 1px; }