/* ======================================== Immobilien - Filterleiste ======================================== */ .immo-filter-group{display:flex;flex-direction:column;gap:0.4rem;flex:1;min-width:0}.immo-filter-label{font-size:0.8rem;font-variation-settings:var(--font-condensed);color:var(--color-darkgrey);text-transform:uppercase;letter-spacing:0.03em}.immo-filter-buttons{display:flex;gap:0.4rem;flex-wrap:wrap}.immo-filter-btn{padding:0.35rem 0.9rem;border:var(--border-width) solid var(--color-blue);border-radius:var(--button-border-radius);background:var(--color-white);color:var(--color-blue);font-family:inherit;font-size:0.85rem;font-weight:700;cursor:pointer;transition:background 0.2s ease, color 0.2s ease}.immo-filter-btn:hover{background:var(--color-lightblue)}.immo-filter-btn.active{background:var(--color-blue);color:var(--color-white)}.immo-filter-select{padding:0.35rem 0.9rem;border:var(--border-width) solid var(--input-border-color);border-radius:var(--button-border-radius);background:var(--input-background);color:var(--input-color);font-family:inherit;font-size:0.85rem;cursor:pointer}/* ======================================== Immobilien - Liste ======================================== */
.immo-liste{padding:var(--padding-content)}/* ======================================== Immobilien - Karte (Basis) ======================================== */
.immo-card{display:flex;flex-direction:column;background:var(--color-white);border-radius:var(--border-radius);overflow:hidden;text-decoration:none;color:var(--text-color);transition:box-shadow 0.2s ease}.immo-card:hover{box-shadow:0 4px 20px rgba(0, 0, 0, 0.12)}.immo-card-image{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--color-lightgrey)}.immo-card-image img{width:100%;height:100%;object-fit:cover}/* Karte - Swiper */
.immo-card-swiper{width:100%;height:100%}.immo-card-swiper .swiper-slide{display:flex;align-items:center;justify-content:center}.immo-card-swiper .swiper-slide img{width:100%;height:100%;object-fit:cover}.immo-card-swiper .swiper-slide a{display:block;width:100%;height:100%}.immo-card-swiper .swiper-button-prev,
.immo-card-swiper .swiper-button-next{color:var(--color-white);--swiper-navigation-size:1.2rem;background:rgba(0, 0, 0, 0.35);width:2rem;height:2rem;border-radius:50%;opacity:0;transition:opacity 0.2s ease}.immo-card:hover .swiper-button-prev,
.immo-card:hover .swiper-button-next{opacity:1}.immo-card-swiper .swiper-button-prev:hover,
.immo-card-swiper .swiper-button-next:hover{background:rgba(0, 0, 0, 0.6)}/* NEU-Badge:Eckband oben rechts */
.immo-badges{position:absolute;top:0;right:0;z-index:2;overflow:visible}.immo-badges .badge-neu{display:block;position:absolute;top:1.25rem;right:-2.25rem;width:9rem;text-align:center;transform:rotate(45deg);border-radius:0;font-variation-settings:var(--font-condensed)}/* VERKAUFT / RESERVIERT:unten im Bild */
.immo-card-status{position:absolute;top:1rem;left:0;display:flex;z-index:2;border-top-right-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);overflow:hidden}.immo-card-status .badge{padding:0 0.5rem 0 0.25rem}.badge{display:inline-block;font-size:1.25rem;font-weight:700;text-transform:uppercase;font-variation-settings:var(--font-condensed)}.badge-neu{font-size:1.75rem;font-weight:700;line-height:1.1;text-transform:uppercase;background:var(--color-red);color:var(--color-white)}.badge-reserviert{background:var(--color-green);color:var(--color-white)}.badge-verkauft{background:var(--color-red);color:var(--color-white)}/* Karte - Body */
.immo-card-body{flex:1 1 auto;display:flex;flex-direction:column;gap:0.4rem;padding:var(--padding-box);text-decoration:none;color:var(--text-color)}a.immo-card-body:hover{color:var(--text-color)}.immo-card-type{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--color-darkgrey);font-variation-settings:var(--font-condensed)}.immo-card-title{flex:1 1 auto;font-family:var(--font-family-header);font-size:1.1rem;line-height:1.3;margin:0;color:var(--color-black);overflow:hidden;font-variation-settings:var(--font-regular)}.immo-card-location{/* font-size:0.85rem;*/ color:var(--color-black)}.immo-card-details{display:flex;gap:1rem;font-size:0.85rem;color:var(--color-darkgrey);padding-top:0.4rem;border-top:1px solid var(--color-lightgrey);margin-top:0.3rem}.immo-card-details > div{display:flex;align-items:center;gap:0.2rem}.immo-card-details .material-symbols-outlined{font-size:1rem;color:var(--color-blue)}.immo-card-price-meta{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--color-blue);padding-top:0.5rem;margin-top:0.25rem}.immo-card-price{font-family:var(--font-family-header);font-size:1.15rem;font-weight:700;color:var(--color-black)}.immo-card-meta{font-size:0.85rem;color:var(--color-black);font-variation-settings:var(--font-condensed)}.immo-card-teaser{& h1, & h2, & h3, & h4, & h5, & h6{font-family:var(--font-family-header);font-size:1.1rem;line-height:1.3;color:var(--color-blue);margin:0}}/* ======================================== Immobilien - Highlights Slider ======================================== */
.immo-highlights .immo-card{width:calc((var(--main-width) - 2 * var(--gap-contentNarrow)) / 3);height:100%}/* ======================================== Immobilien - Detail ======================================== */ /* Topbar */
.immo-detail-topbar{display:flex;justify-content:space-between;align-items:center}.immo-detail-title{margin:0;color:var(--color-black)}/* ======================================== Galerie (Grid) ======================================== */
.immo-gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-contentNarrow)}.immo-gallery-grid-single{}.immo-gallery-main{position:relative;overflow:hidden;border-radius:var(--border-radius);aspect-ratio:4/3}.immo-gallery-main > .immo-gallery-link{display:block;height:100%}.immo-gallery-main img{width:100%;height:100%;object-fit:cover}.immo-gallery-side{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:var(--gap-contentNarrow);aspect-ratio:4/3;overflow:hidden}.immo-gallery-side > .immo-gallery-link{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border-radius:var(--border-radius)}.immo-gallery-side img{display:block}.immo-gallery-more-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--color-blue-rgb), 0.55);color:var(--color-white);font-size:1rem;font-weight:700;pointer-events:none}.immo-gallery-hidden{display:none}/* ======================================== Detail - Zwei-Spalten-Layout ======================================== */
.immo-detail-content{display:grid;grid-template-columns:2fr 1fr;gap:var(--gap-contentImmo);margin-bottom:2rem}.immo-detail-main{min-width:0;display:flex;flex-direction:column;gap:var(--gap-contentImmo)}.immo-detail-sidebar{background:var(--color-white);border-radius:var(--border-radius);padding:var(--padding-box);position:sticky;top:calc(2rem + var(--topnav-height));align-self:start}/* ======================================== Detail - Preis-Leiste ======================================== */
.immo-detail-price-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.immo-detail-price{display:flex;flex-direction:column}.immo-detail-price-value{font-family:var(--font-family-header);font-size:1.6rem;font-weight:700;color:var(--color-black)}.immo-detail-courtage{font-size:0.85rem;color:var(--color-darkgrey)}.immo-detail-actions{display:flex;gap:0.75rem;align-items:center}/* ======================================== Detail - Kategorisierte Eckdaten (volle Breite, 4 Spalten) ======================================== */
.immo-detail-facts{background:var(--color-white);border-radius:var(--border-radius);padding:var(--padding-box);display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--gap-contentNarrow);margin-bottom:1rem}.immo-facts-category{min-width:0;border-right:2px solid var(--color-blue)}.immo-facts-category:last-child{border-right:0 none}.immo-detail-facts .immo-facts-grid{grid-template-columns:1fr}.immo-facts-category-header{display:flex;gap:0.25rem;align-items:center;margin-bottom:1rem}.immo-facts-category-header > div{display:flex;justify-content:center;align-items:center;width:1.25rem;aspect-ratio:1/1}.immo-facts-category-header > div > img{width:100%}.immo-facts-category-header h4{font-family:var(--font-family-header);font-size:1.15rem;font-weight:700;color:var(--text-header-color);margin:0}.immo-facts-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:1rem}.immo-fact{display:flex;flex-direction:column}.immo-fact-label{font-size:0.9rem}.immo-fact-value{font-weight:500}.immo-zusatz{}/* ======================================== Detail - Sidebar (sticky) ======================================== */ /* ======================================== Detail - Sektionen (Texte) ======================================== */
.immo-detail-section{background:var(--color-white);border-radius:var(--border-radius);padding:var(--padding-box)}.immo-detail-section h3{font-size:1.2rem;margin-bottom:0.75rem}.immo-text{line-height:1.6}.immo-zusatz-text{font-weight:700;margin-bottom:0.5rem}.immo-ausstattung-liste{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2, 1fr);gap:0.4rem}.immo-ausstattung-liste li{padding:0.3rem 0;padding-left:1.5rem;position:relative}.immo-ausstattung-liste li::before{content:'check';font-family:'Material Symbols Outlined';position:absolute;left:0;color:var(--color-green);font-size:1rem}/* ======================================== Detail - Energieausweis ======================================== */
.immo-epass-layout{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}.immo-epass-table{width:100%;border-collapse:collapse}.immo-epass-table td{padding:0.5rem 0;border-bottom:1px solid var(--color-lightgrey);font-size:0.9rem}.immo-epass-table td:first-child{color:var(--color-darkgrey);padding-right:1rem}.immo-epass-table td:last-child{text-align:right;font-weight:700}.immo-epass-label{display:flex;flex-direction:column;gap:0.75rem;padding-top:0.25rem}.immo-epass-klasse-header{display:flex;align-items:center;gap:0.75rem;font-size:0.9rem;color:var(--color-darkgrey)}.immo-epass-badge{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:0.5rem;font-size:1.5rem;font-weight:700;margin-left:auto}.immo-epass-scale{display:flex;gap:0.25rem}.immo-epass-scale-item{flex:1;height:1.1rem;border-radius:0.2rem;opacity:0.7;transition:opacity 0.2s ease}.immo-epass-scale-item.immo-epass-active{opacity:1;outline:2px solid currentColor;outline-offset:1px;position:relative}.immo-epass-scale-range{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--color-darkgrey)}/* Zurueck-Button unterhalb Content */
.immo-detail-bottom{text-align:center;padding:1.5rem 0;margin-bottom:1rem}/* ======================================== Detail - Sidebar ======================================== */
.immo-sidebar-box{display:flex;flex-direction:column;gap:1rem}.immo-sidebar-box h4{font-family:var(--font-family-header);font-size:1.2rem;font-weight:700;color:var(--text-header-color);margin:00}.immo-sidebar-buttons{display:flex;flex-direction:column;gap:1.5rem}/* ======================================== Kontaktformular ======================================== */
.immo-kontakt{background:var(--color-white);border-radius:var(--border-radius);padding:2rem;position:relative}.immo-kontakt h3{font-size:1.3rem;margin-bottom:0.5rem}.immo-kontakt > p{color:var(--color-darkgrey);margin:0 0 1.5rem 0}/* Status-Banner */
.immo-kontakt-status{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;border-radius:var(--border-radius);font-size:0.9rem;margin-bottom:1.5rem;line-height:1.5}.immo-kontakt-status > span{font-size:2rem;flex-shrink:0}.immo-kontakt-status-reserviert{background:rgba(var(--color-green-rgb), 0.15);color:var(--color-green)}.immo-kontakt-status-verkauft{background:rgba(var(--color-red-rgb), 0.15);color:var(--color-red)}/* Formular */
.immo-kontakt-fields{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--gap-contentSmall);margin-bottom:var(--gap-contentSmall)}.immo-kontakt-field{display:flex;flex-direction:column;gap:0.25rem}.immo-kontakt-field label{font-size:0.85rem;font-weight:700;font-variation-settings:var(--font-condensed)}.immo-kontakt-field label.pflicht::after{content:'*';color:var(--color-red);margin-left:0.15rem}.immo-kontakt-field input{padding:0.5rem;border:var(--border-width) solid var(--input-border-color);border-radius:0.5rem;background:var(--input-background);font-family:inherit;font-size:inherit}#immoEmailBest{display:none}.immo-kontakt-datenschutz{display:flex;gap:0.5rem;align-items:flex-start;font-size:0.85rem;line-height:1.5;margin-bottom:var(--gap-contentSmall);padding:0.5rem;border-radius:0.5rem}.immo-kontakt-datenschutz input[type="checkbox"]{margin-top:0.2rem;flex-shrink:0}.immo-kontakt-datenschutz a{color:var(--link-color);text-decoration:underline}.immo-kontakt-datenschutz a:hover{color:var(--link-hover-color)}.immo-kontakt-submit{margin-top:0.5rem}.immo-kontakt-submit .button{padding:0.65rem 2rem;font-size:1rem}/* Erfolg / Fehler */
.immo-kontakt-erfolg{display:flex;align-items:center;gap:0.5rem;padding:1rem;background:rgba(65, 164, 55, 0.15);border-radius:0.5rem;color:var(--color-green);font-weight:700}.immo-kontakt-erfolg .material-symbols-outlined{font-size:1.5rem}.immo-kontakt-fehler{padding:0.75rem 1rem;background:rgba(205, 25, 25, 0.15);border-radius:0.5rem;color:var(--color-red);font-size:0.9rem;margin-bottom:var(--gap-contentSmall)}/* ======================================== Verwaltung (NICHT AENDERN) ======================================== */
.form > .immo-admin-bilder-row{flex-direction:column}.immo-admin-bilder{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:0.75rem;width:100%}.immo-admin-bild{display:flex;flex-direction:column;align-items:center;gap:0.3rem;text-align:center}.immo-admin-bild img{max-width:100%;height:auto}.immo-admin-bild small{word-break:break-word;font-size:0.75rem;color:var(--color-darkgrey)}