/* =============================================================================
 *  Project:   Kassel Immobilien — Public Portal
 *  Location:  /assets/css/public.css
 *  File:      public.css
 *  Function:  Brand theme for the PUBLIC SITE ONLY. v2.0 switches the
 *             consumer-facing palette from emerald to the ImmobilienDesk
 *             blue/navy mock (primary blue #2563EB on a white shell; navy
 *             #0F172A for the sell CTA, stats and footer). Carries the brand
 *             tokens (duplicated from theme.css so the two contexts stay
 *             independent), the minimal Bootstrap overrides actually used on
 *             the public site (buttons, focus rings, links, .card border),
 *             and the entire .pub-* layer: hero v2, sticky white nav with
 *             "Merkliste" + "Objekt bewerten" CTA, trust strip, listing
 *             card v2 with €/m² price tag, category tiles, why-us, sell CTA,
 *             testimonials, stats bar, footer; plus the exposé page
 *             (hero gallery + lightbox, scroll-spy tabs, highlights, 3-col
 *             panel with energy A+/H bar, Lage iframe, three-card sticky
 *             aside).
 *  Version:   2.0.0
 *  Build:     2026.06.04.2300
 * -----------------------------------------------------------------------------
 *  Changelog:
 *    2.0.0  2026-06-04  Blue palette swap; white sticky nav with Merkliste +
 *                       Objekt-bewerten CTA; navy sell-CTA/stats/footer;
 *                       listing card €/m² slot; sidebar split into three
 *                       cards (hero / Ansprechpartner / Trust); actions
 *                       trio (Merken/Teilen/Drucken).
 *    1.0.0  2026-06-04  Extracted .pub-* + base overrides from theme.css.
 * ============================================================================= */


/* =============================================================================
 *  Brand tokens (duplicated from theme.css so the public site does not depend
 *  on the dashboard's stylesheet ever being on the page).
 * ============================================================================= */
:root {
  /* Primary blue (Tailwind blue 600 / 700 / 50) */
  --brand-primary:     #2563EB;
  --brand-primary-600: #1D4ED8;
  --brand-primary-050: #EFF6FF;
  --brand-primary-100: #DBEAFE;

  /* Navy used for stats bar, sell CTA, footer */
  --brand-navy:        #0F172A;     /* slate-900 */
  --brand-navy-2:      #1E2A4A;     /* slate-800-ish */
  --brand-navy-3:      #1E3A8A;     /* blue-900 — used inside gradients */

  /* Warm accent (used very sparingly — admin impersonation banner only) */
  --brand-accent:      #B07D2B;

  /* Semantic */
  --brand-success:     #16A34A;     /* green-600 */
  --brand-danger:      #DC2626;     /* red-600 */
  --brand-warning:     #F59E0B;     /* amber-500 */

  /* Greys */
  --brand-ink:         #0F172A;     /* slate-900 */
  --brand-body:        #475569;     /* slate-600 */
  --brand-muted:       #94A3B8;     /* slate-400 */
  --brand-line:        #E2E8F0;     /* slate-200 */
  --brand-canvas:      #F8FAFC;     /* slate-50 */
  --surface:           #FFFFFF;

  /* Map onto Bootstrap so .btn-primary / focus / links pick up the brand */
  --bs-primary:        var(--brand-primary);
  --bs-primary-rgb:    37, 99, 235;
  --bs-success:        var(--brand-success);
  --bs-danger:         var(--brand-danger);
  --bs-warning:        var(--brand-warning);
  --bs-body-color:     var(--brand-body);
  --bs-body-bg:        var(--surface);
  --bs-border-color:   var(--brand-line);
  --bs-link-color:     var(--brand-primary-600);
  --bs-link-hover-color: var(--brand-primary);
}

/* =============================================================================
 *  Base typography + minimal Bootstrap refinements used by the public site
 * ============================================================================= */
body { color: var(--brand-body); }
h1, h2, h3, h4, h5, h6 { color: var(--brand-ink); }
.text-secondary { color: var(--brand-muted) !important; }
.card { border-color: var(--brand-line); }

/* Buttons */
.btn-primary {
  --bs-btn-bg: var(--brand-primary);
  --bs-btn-border-color: var(--brand-primary);
  --bs-btn-hover-bg: var(--brand-primary-600);
  --bs-btn-hover-border-color: var(--brand-primary-600);
  --bs-btn-active-bg: var(--brand-primary-600);
  --bs-btn-color: #fff; --bs-btn-hover-color: #fff;
}
.btn-outline-primary {
  --bs-btn-color: var(--brand-primary);
  --bs-btn-border-color: var(--brand-primary);
  --bs-btn-bg: #fff;
  --bs-btn-hover-bg: var(--brand-primary);
  --bs-btn-hover-border-color: var(--brand-primary);
  --bs-btn-hover-color: #fff;
}
.btn-outline-secondary {
  --bs-btn-color: var(--brand-body);
  --bs-btn-border-color: var(--brand-line);
  --bs-btn-hover-bg: var(--brand-canvas);
  --bs-btn-hover-border-color: #CBD5E1;
  --bs-btn-hover-color: var(--brand-ink);
}

/* WCAG 2.2 — visible focus on interactive elements */
a:focus-visible, .btn:focus-visible, .form-control:focus-visible,
.form-select:focus-visible, .nav-link:focus-visible, button:focus-visible {
  outline: 3px solid var(--brand-primary);
  outline-offset: 2px;
}

/* =============================================================================
 *  Public portal skin (.pub-*)
 * ============================================================================= */
.pub-body { background: var(--brand-canvas); }
.pub-skip {
  position: absolute; left: 1rem; top: .5rem; z-index: 1080; background: #fff;
  padding: .5rem .9rem; border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0,0,0,.12);
}
.pub-main { min-height: 60vh; background: var(--brand-canvas); }

/* --- TOP NAVIGATION (white, sticky) ---------------------------------------- */
.pub-nav {
  background: #fff;
  border-bottom: 1px solid var(--brand-line);
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
.pub-nav .nav-link {
  color: var(--brand-body) !important;
  font-weight: 600;
  font-size: .95rem;
  padding-inline: .9rem;
}
.pub-nav .nav-link:hover { color: var(--brand-primary) !important; }
.pub-nav .nav-link.active { color: var(--brand-ink) !important; }
.pub-brand {
  display: inline-flex; align-items: center; gap: .55rem;
  color: var(--brand-ink) !important;
  font-weight: 700; font-size: 1.15rem; text-decoration: none;
}
.pub-mark {
  width: 32px; height: 32px; border-radius: 9px;
  display: grid; place-items: center;
  background: var(--brand-primary); color: #fff; font-size: 1rem;
}
.pub-pill { border-radius: 999px !important; font-weight: 600; }

/* "Merkliste" link in top nav (heart + text + counter) */
.pub-nav-merken {
  display: inline-flex; align-items: center; gap: .35rem;
  color: var(--brand-body);
  font-weight: 600; font-size: .92rem;
  text-decoration: none;
  padding-inline: .6rem;
}
.pub-nav-merken i { color: var(--brand-primary); font-size: 1.05rem; }
.pub-nav-merken:hover { color: var(--brand-primary); }
.pub-nav-merken-count {
  display: inline-grid; place-items: center;
  min-width: 18px; height: 18px; padding-inline: .35rem;
  border-radius: 9px; background: var(--brand-primary); color: #fff;
  font-size: .68rem; font-weight: 700;
}

/* --- HERO V2 (tabs + 4-field search) -------------------------------------- */
.pub-hero { color: #fff; padding: clamp(2.5rem, 6vw, 5rem) 0; }
.pub-hero-v2 {
  background:
    linear-gradient(120deg, rgba(15, 23, 42, .85) 0%, rgba(30, 58, 138, .70) 55%, rgba(37, 99, 235, .55) 100%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,.15) 0%, transparent 50%),
    var(--brand-navy);
  padding: clamp(2.4rem, 5vw, 4.4rem) 0 clamp(3.6rem, 6vw, 5.2rem);
  color: #fff;
}
.pub-hero-inner { max-width: 900px; }
.pub-hero-title {
  font-weight: 700; font-size: clamp(1.9rem, 4.5vw, 3.2rem);
  line-height: 1.06; margin-bottom: .8rem;
  color: #fff; text-wrap: balance;
}
.pub-hero-sub {
  font-size: clamp(1rem, 2vw, 1.18rem);
  color: rgba(255,255,255,.92); margin-bottom: 1.6rem;
}
.pub-hero-accent { color: #93C5FD !important; }       /* light blue accent on "Zuhause" */

.pub-search-card {
  display: block; background: #fff; padding: .6rem;
  border-radius: 16px; box-shadow: 0 24px 60px rgba(15, 23, 42, .28);
  margin-top: 1.4rem;
}
.pub-search-tabs {
  display: inline-flex; gap: .25rem; padding: .25rem; background: var(--brand-canvas);
  border-radius: 10px; margin: .2rem .2rem .6rem;
}
.pub-search-tab {
  background: transparent; border: 0; color: var(--brand-body);
  padding: .42rem .95rem; font-weight: 600; font-size: .88rem;
  border-radius: 8px; cursor: pointer; transition: background .15s, color .15s;
}
.pub-search-tab:hover { color: var(--brand-ink); }
.pub-search-tab.active {
  background: #fff; color: var(--brand-primary);
  box-shadow: 0 2px 6px rgba(15, 23, 42, .07);
}

.pub-search-fields {
  display: grid; grid-template-columns: 2fr 1.2fr 1fr 1fr;
  gap: .35rem; align-items: stretch;
}
@media (max-width: 991.98px) { .pub-search-fields { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .pub-search-fields { grid-template-columns: 1fr; } }
.pub-search-field {
  display: flex; flex-direction: column; padding: .3rem .6rem .35rem;
  border-radius: 10px; cursor: text;
}
.pub-search-field + .pub-search-field { border-left: 1px solid var(--brand-line); }
@media (max-width: 991.98px) { .pub-search-field + .pub-search-field { border-left: 0; } }
.pub-search-field:hover { background: var(--brand-canvas); }
.pub-search-label {
  font-size: .7rem; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--brand-muted);
}
.pub-search-input { display: inline-flex; align-items: center; gap: .35rem; }
.pub-search-input i { color: var(--brand-primary); flex: 0 0 auto; }
.pub-search-card .form-control,
.pub-search-card .form-select {
  border: 0; padding: .25rem 0; box-shadow: none; background: transparent;
  font-size: .98rem; color: var(--brand-ink);
}
.pub-search-card .form-select { padding-right: 1.5rem; }
.pub-search-go {
  width: 100%; border-radius: 12px; padding-block: .8rem;
  font-weight: 700; font-size: 1rem; margin-top: .5rem;
}

/* --- SECTIONS + HEADINGS -------------------------------------------------- */
.pub-section { padding-block: clamp(2rem, 4vw, 3.2rem); }
.pub-h1 { font-weight: 700; font-size: clamp(1.6rem, 3.4vw, 2.3rem); color: var(--brand-ink); }
.pub-h2 { font-weight: 700; font-size: 1.5rem; color: var(--brand-ink); }
.pub-h3 { font-weight: 700; font-size: 1.12rem; margin-bottom: .8rem; color: var(--brand-ink); }
.pub-bc { --bs-breadcrumb-divider: '›'; font-size: .9rem; color: var(--brand-muted); }
.pub-bc a { color: var(--brand-body); text-decoration: none; }
.pub-bc a:hover { color: var(--brand-primary); text-decoration: underline; }
.pub-bc .breadcrumb-item.active { color: var(--brand-ink); }

/* --- TRUST STRIP ---------------------------------------------------------- */
.pub-trust-strip { padding-block: 1rem 0; }
.pub-trust-cell {
  display: flex; align-items: center; gap: .8rem;
  background: #fff; border: 1px solid var(--brand-line); border-radius: 12px;
  padding: .85rem 1rem; height: 100%;
}
.pub-trust-ico {
  width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center;
  border-radius: 10px; background: var(--brand-primary-050);
  color: var(--brand-primary); font-size: 1.1rem;
}
.pub-trust-title { font-weight: 700; font-size: .92rem; color: var(--brand-ink); }
.pub-trust-text  { font-size: .8rem; color: var(--brand-muted); }

/* --- LISTING CARD V2 ------------------------------------------------------ */
.pub-card {
  position: relative; padding: 0;
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  overflow: hidden; height: 100%;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.pub-card:hover {
  transform: translateY(-2px);
  border-color: #CBD5E1;
  box-shadow: 0 18px 40px rgba(15, 23, 42, .10);
}
.pub-card-link {
  display: block !important;
  color: inherit !important;
  text-decoration: none !important;
}
.pub-card-link:hover .pub-card-title { color: var(--brand-primary); }
.pub-card-media {
  position: relative; aspect-ratio: 4 / 3;
  background: var(--brand-canvas); overflow: hidden;
}
.pub-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Marketing tag pill (Top Angebot / Exklusiv / Neu / Empfohlen) — blue */
.pub-card-tag {
  position: absolute; top: .7rem; left: .7rem; z-index: 2;
  background: var(--brand-primary); color: #fff;
  font-size: .72rem; font-weight: 700; letter-spacing: .02em;
  padding: .3rem .6rem; border-radius: 6px;
  box-shadow: 0 6px 18px rgba(37, 99, 235, .35);
}
.pub-card .pub-card-kind {
  position: absolute; top: .7rem; left: auto !important; right: .7rem !important;
  background: rgba(255,255,255,.95); color: var(--brand-ink);
  font-size: .72rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .25rem .55rem; border-radius: 6px;
}
.pub-card-body { padding: 1rem 1rem 1.1rem; }
.pub-card-title {
  font-size: 1.05rem; font-weight: 700; line-height: 1.3;
  margin: .15rem 0 .35rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  transition: color .15s;
  color: var(--brand-ink);
}
.pub-card-loc { color: var(--brand-muted); font-size: .88rem; }
.pub-card-loc i { color: var(--brand-primary); }
.pub-card-facts {
  display: flex; flex-wrap: wrap; gap: .8rem;
  margin-top: .7rem; color: var(--brand-body); font-size: .85rem;
}
.pub-card-facts i { color: var(--brand-primary); margin-right: .2rem; }
.pub-card-foot {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  margin-top: .9rem;
  gap: .5rem;
}
.pub-card-price-block { display: flex; flex-direction: column; gap: .1rem; }
.pub-card-price {
  font-weight: 800; font-size: 1.15rem; color: var(--brand-ink);
  line-height: 1.1;
}
.pub-card-price-sqm {
  font-size: .8rem; color: var(--brand-muted); font-weight: 500;
}
.pub-card-heart {
  flex: 0 0 36px;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--brand-line); background: #fff; color: var(--brand-muted);
  display: grid; place-items: center; cursor: pointer; padding: 0;
  transition: color .15s, border-color .15s, background .15s, transform .15s;
}
.pub-card-heart:hover { color: var(--brand-danger); border-color: #FCA5A5; background: #FEF2F2; }
.pub-card-heart.is-on { color: var(--brand-danger); border-color: #FCA5A5; background: #FEF2F2; }
.pub-card-heart.is-on .bi-heart::before { content: "\F417"; }

/* "No image" placeholder */
.pub-card .pub-card-noimg {
  background: linear-gradient(135deg, #F1F5F9 0%, #E2E8F0 100%);
  color: #94A3B8;
  display: grid; place-items: center; aspect-ratio: 4 / 3;
  font-size: 3rem;
}
.pub-card .pub-card-noimg::after {
  content: 'Foto folgt';
  display: block;
  font-size: .75rem; font-weight: 600;
  color: #94A3B8;
  margin-top: -.25rem; letter-spacing: .04em; text-transform: uppercase;
}

/* --- CATEGORY TILES ------------------------------------------------------- */
.pub-cats .pub-cat {
  display: flex; flex-direction: column; align-items: center; gap: .35rem;
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  padding: 1.1rem .8rem; text-decoration: none; color: inherit;
  transition: transform .15s, box-shadow .15s, border-color .15s;
  text-align: center; height: 100%;
}
.pub-cats .pub-cat:hover {
  transform: translateY(-2px); border-color: #CBD5E1;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
}
.pub-cat-ico {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--brand-primary-050); color: var(--brand-primary);
  display: grid; place-items: center; font-size: 1.4rem;
}
.pub-cat-label { font-weight: 700; color: var(--brand-ink); }
.pub-cat-count { font-size: .8rem; color: var(--brand-muted); }

/* --- WHY US -------------------------------------------------------------- */
.pub-why {
  background: var(--brand-primary-050);
  padding-block: clamp(2.2rem, 4vw, 3.4rem);
  margin-block: 1rem;
}
.pub-why-cell { background: transparent; padding: 1.1rem 1rem; border-radius: 14px; height: 100%; }
.pub-why-ico {
  width: 44px; height: 44px; border-radius: 12px;
  background: #fff; color: var(--brand-primary);
  display: grid; place-items: center; font-size: 1.3rem; margin-bottom: .8rem;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .12);
}
.pub-why-title { font-weight: 700; color: var(--brand-ink); margin-bottom: .15rem; }
.pub-why-text  { color: var(--brand-body); font-size: .92rem; }

/* --- SELL CTA (navy gradient) -------------------------------------------- */
.pub-sell {
  display: grid; grid-template-columns: 1.2fr 1fr;
  gap: 1.5rem; align-items: stretch;
  background: linear-gradient(120deg, var(--brand-navy) 0%, var(--brand-navy-3) 100%);
  color: #fff;
  border-radius: 18px; padding: clamp(1.6rem, 3vw, 2.4rem) clamp(1.4rem, 3vw, 2.2rem);
  box-shadow: 0 28px 60px -20px rgba(15, 23, 42, .45);
  overflow: hidden; position: relative;
}
.pub-sell::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 90% 10%, rgba(147, 197, 253, .18), transparent 55%);
}
@media (max-width: 767.98px) { .pub-sell { grid-template-columns: 1fr; } }
.pub-sell-text { position: relative; z-index: 1; }
.pub-sell-title {
  font-weight: 700; font-size: clamp(1.45rem, 2.8vw, 2rem); margin: 0 0 .35rem;
  color: #fff;
}
.pub-sell-sub { color: rgba(255,255,255,.85); margin-bottom: 1rem; }
.pub-sell-list { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; gap: .35rem; }
.pub-sell-list li { display: flex; align-items: center; gap: .6rem; color: #fff; font-weight: 500; }
.pub-sell-list i {
  flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%;
  background: rgba(255,255,255,.18); display: inline-grid; place-items: center;
  color: #93C5FD; font-size: .85rem;
}
.pub-sell-visual { position: relative; z-index: 1; display: grid; align-items: end; }
.pub-sell-card {
  background: #fff; color: var(--brand-ink);
  border-radius: 14px; padding: 1rem 1.2rem;
  box-shadow: 0 26px 60px -10px rgba(0,0,0,.35);
  align-self: center; justify-self: end; width: min(100%, 320px);
}
.pub-sell-card-sub { font-size: .8rem; color: var(--brand-muted); }
.pub-sell-card-price {
  font-weight: 700; font-size: 1.9rem; color: var(--brand-ink); margin-block: .1rem .35rem;
}
.pub-sell-card-trend {
  display: inline-flex; align-items: center; gap: .35rem;
  background: var(--brand-primary-050); color: var(--brand-primary-600);
  border-radius: 999px; padding: .25rem .6rem;
  font-size: .8rem; font-weight: 700;
}

/* Compact inline variant used on the exposé page (one-row checkmarks) */
.pub-sell-inline { grid-template-columns: 1.4fr 1fr; padding-block: 1.4rem; }
.pub-sell-inline .pub-sell-checks {
  display: flex; flex-wrap: wrap; gap: 1rem 1.4rem;
  list-style: none; padding: 0; margin: 1rem 0 0;
}
.pub-sell-inline .pub-sell-checks li {
  display: inline-flex; align-items: center; gap: .5rem;
  color: rgba(255,255,255,.92); font-weight: 500; font-size: .92rem;
}
.pub-sell-inline .pub-sell-checks i {
  flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%;
  background: rgba(147, 197, 253, .25); color: #93C5FD;
  display: inline-grid; place-items: center; font-size: .7rem;
}
.pub-sell-inline .pub-sell-visual::before {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 120"%3E%3Crect width="200" height="120" fill="%231e3a8a" rx="14"/%3E%3Cpath d="M30 90 V50 L70 25 L110 50 V90 Z" fill="%231e293b" stroke="%23475569" stroke-width="1"/%3E%3Crect x="40" y="60" width="14" height="22" fill="%2393c5fd" opacity="0.6"/%3E%3Crect x="58" y="60" width="14" height="22" fill="%2393c5fd" opacity="0.5"/%3E%3Crect x="76" y="60" width="14" height="22" fill="%2393c5fd" opacity="0.6"/%3E%3Cpath d="M110 90 V35 L150 15 L190 35 V90 Z" fill="%230f172a" stroke="%23334155" stroke-width="1"/%3E%3Crect x="120" y="50" width="14" height="14" fill="%2393c5fd" opacity="0.6"/%3E%3Crect x="138" y="50" width="14" height="14" fill="%2393c5fd" opacity="0.5"/%3E%3Crect x="156" y="50" width="14" height="14" fill="%2393c5fd" opacity="0.6"/%3E%3Crect x="120" y="70" width="14" height="20" fill="%2393c5fd" opacity="0.4"/%3E%3Crect x="138" y="70" width="14" height="20" fill="%2393c5fd" opacity="0.5"/%3E%3Crect x="156" y="70" width="14" height="20" fill="%2393c5fd" opacity="0.4"/%3E%3C/svg%3E');
  background-size: cover; background-position: center;
  border-radius: 12px; opacity: .9;
}
.pub-sell-inline .pub-sell-visual { min-height: 140px; }

/* --- TESTIMONIALS -------------------------------------------------------- */
.pub-quote {
  background: #fff; border: 1px solid var(--brand-line); border-radius: 16px;
  padding: 1.2rem; height: 100%;
  display: flex; flex-direction: column; gap: .8rem; margin: 0;
}
.pub-quote-stars { color: #F59E0B; font-size: .9rem; }
.pub-quote-stars i + i { margin-left: .12rem; }
.pub-quote-text { font-style: italic; color: var(--brand-body); line-height: 1.55; margin: 0; }
.pub-quote-foot { display: flex; align-items: center; gap: .7rem; margin-top: auto; }
.pub-quote-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--brand-primary-050); color: var(--brand-primary-600);
  display: grid; place-items: center; font-weight: 700;
}
.pub-quote-name { font-weight: 700; color: var(--brand-ink); display: block; line-height: 1.1; }
.pub-quote-role { font-size: .82rem; color: var(--brand-muted); }

/* --- STATS BAR (navy) ---------------------------------------------------- */
.pub-stats {
  background: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-navy-2) 100%);
  color: #fff;
  padding-block: clamp(2rem, 4vw, 3rem);
  margin-block: 1rem;
}
.pub-stat-num {
  font-weight: 800;
  font-size: clamp(1.7rem, 3.4vw, 2.6rem);
  color: #fff; line-height: 1.05;
}
.pub-stat-lbl { color: rgba(255,255,255,.78); font-size: .92rem; margin-top: .25rem; }

/* --- "View all" link CTA ------------------------------------------------- */
.pub-link-cta {
  color: var(--brand-primary); font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: .35rem; font-size: .93rem;
}
.pub-link-cta:hover { color: var(--brand-primary-600); text-decoration: underline; }

/* =============================================================================
 *  DETAIL V2 — exposé page
 * ============================================================================= */
.pub-detail-bg { background: var(--brand-canvas); }

/* ---- HERO GALLERY -------------------------------------------------------- */
.pub-hero-gallery { display: grid; gap: .6rem; margin-bottom: 1.4rem; }
.pub-hero-gallery .pub-gallery-main {
  border: 0; padding: 0; background: var(--brand-line); cursor: zoom-in;
  display: block; width: 100%; position: relative;
  aspect-ratio: 16 / 10; border-radius: 16px; overflow: hidden;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
}
.pub-hero-gallery .pub-gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pub-img-tag {
  position: absolute; top: 1rem; left: 1rem;
  background: var(--brand-primary); color: #fff;
  border-radius: 6px; padding: .35rem .75rem;
  font-weight: 700; font-size: .82rem;
  display: inline-flex; align-items: center; gap: .35rem;
  box-shadow: 0 10px 30px rgba(37, 99, 235, .35);
}
.pub-img-count {
  position: absolute; bottom: 1rem; right: 1rem;
  background: rgba(15, 23, 42, .85); color: #fff;
  font-size: .82rem; font-weight: 600; padding: .35rem .65rem;
  border-radius: 8px; display: inline-flex; align-items: center; gap: .35rem;
}

/* Scrollable thumbnail strip with chevron buttons */
.pub-gallery-strip-wrap { position: relative; }
.pub-gallery-strip {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 6 * .6rem) / 7);
  gap: .6rem; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: thin;
}
.pub-gallery-strip::-webkit-scrollbar { height: 6px; }
.pub-gallery-strip::-webkit-scrollbar-thumb { background: var(--brand-line); border-radius: 3px; }
@media (max-width: 991.98px) {
  .pub-gallery-strip { grid-auto-columns: calc((100% - 3 * .5rem) / 4); }
}
@media (max-width: 575.98px) {
  .pub-gallery-strip { grid-auto-columns: calc((100% - 2 * .5rem) / 3); }
}
.pub-hero-gallery .pub-gallery-thumb {
  position: relative; border: 0; padding: 0; scroll-snap-align: start;
  aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden;
  background: var(--brand-line); cursor: zoom-in;
}
.pub-hero-gallery .pub-gallery-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .2s, opacity .2s;
}
.pub-hero-gallery .pub-gallery-thumb:hover img { transform: scale(1.06); }
.pub-gallery-strip-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; border-radius: 50%;
  background: #fff; border: 1px solid var(--brand-line);
  display: grid; place-items: center; cursor: pointer;
  box-shadow: 0 4px 12px rgba(15, 23, 42, .15);
  z-index: 2; color: var(--brand-ink);
}
.pub-gallery-strip-nav:hover { background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); }
.pub-gallery-strip-nav.prev { left: -10px; }
.pub-gallery-strip-nav.next { right: -10px; }
.pub-gallery-strip-nav:disabled { opacity: .35; pointer-events: none; }

/* ---- LIGHTBOX ----------------------------------------------------------- */
.pub-lb .modal-body { background: #0c0c0c; min-height: 60vh; }
.pub-lb .pub-lb-stage { width: 100%; height: 72vh; display: grid; place-items: center; padding: 1rem; }
.pub-lb .pub-lb-stage img { max-width: 100%; max-height: 100%; object-fit: contain; }
.pub-lb .pub-lb-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  padding: 0; display: grid; place-items: center;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
.pub-lb .pub-lb-prev { left: .75rem; }
.pub-lb .pub-lb-next { right: .75rem; }
.pub-lb .pub-lb-nav:disabled { opacity: .35; pointer-events: none; }
@media (max-width: 575.98px) { .pub-lb .pub-lb-stage { height: 60vh; } }

/* ---- DETAIL CARDS ------------------------------------------------------- */
.pub-block-card {
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  padding: 1.4rem 1.4rem 1.5rem; margin-bottom: 1rem;
}
.pub-block-card h2.pub-h2 { margin-bottom: 1rem; }

/* ---- HIGHLIGHTS --------------------------------------------------------- */
.pub-highlights {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 1rem;
}
.pub-highlight {
  text-align: center; padding: .25rem;
}
.pub-highlight-ico {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--brand-primary-050); color: var(--brand-primary);
  display: inline-grid; place-items: center; margin-bottom: .5rem; font-size: 1.15rem;
}
.pub-highlight-key { font-weight: 700; color: var(--brand-ink); font-size: .92rem; line-height: 1.1; }
.pub-highlight-val { font-size: .82rem; color: var(--brand-muted); margin-top: .15rem; }

/* ---- OBJEKTBESCHREIBUNG with read-more ---------------------------------- */
.pub-desc {
  color: var(--brand-body); line-height: 1.65; font-size: .98rem;
  overflow: hidden; max-height: 8.5em; transition: max-height .3s ease;
}
.pub-desc.is-expanded { max-height: 200em; }
.pub-desc p { margin-bottom: .85rem; }
.pub-desc p:last-child { margin-bottom: 0; }
.pub-desc-toggle {
  display: inline-flex; align-items: center; gap: .35rem;
  color: var(--brand-primary); font-weight: 600; text-decoration: none;
  background: transparent; border: 0; padding: .5rem 0 0; margin-top: .6rem;
  font-size: .95rem; cursor: pointer;
}
.pub-desc-toggle:hover { color: var(--brand-primary-600); }
.pub-desc-toggle .bi-chevron-down { transition: transform .2s; }
.pub-desc-toggle.is-expanded .bi-chevron-down { transform: rotate(180deg); }

/* ---- 3-COLUMN PANEL ----------------------------------------------------- */
.pub-three-cell {
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  padding: 1.4rem 1.4rem 1.5rem; height: 100%;
}
.pub-three-h { font-weight: 700; color: var(--brand-ink); margin-bottom: 1rem; font-size: 1.1rem; }
.pub-checklist {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem .8rem;
  font-size: .9rem; color: var(--brand-body);
}
.pub-checklist li { display: flex; align-items: center; gap: .45rem; }
.pub-checklist i {
  flex: 0 0 16px; color: var(--brand-success);
  font-size: .9rem;
}
.pub-kv { margin: 0; }
.pub-kv-row {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: .55rem 0; border-bottom: 1px solid #F1F5F9; font-size: .92rem;
}
.pub-kv-row:last-child { border-bottom: 0; }
.pub-kv-row dt { color: var(--brand-muted); font-weight: 500; margin: 0; }
.pub-kv-row dd { color: var(--brand-ink); font-weight: 700; margin: 0; text-align: right; }

/* Energy A+→H bar */
.pub-energy { display: grid; gap: .8rem; }
.pub-energy-row { display: flex; align-items: center; gap: .6rem; }
.pub-energy-bar {
  flex: 1; display: grid; grid-template-columns: repeat(9, 1fr); gap: 0;
  height: 18px; border-radius: 6px; overflow: hidden;
}
.pub-energy-bar .seg { height: 100%; position: relative; }
.pub-energy-bar .seg-a { background: #16A34A; }
.pub-energy-bar .seg-b { background: #4CB748; }
.pub-energy-bar .seg-c { background: #AECE3F; }
.pub-energy-bar .seg-d { background: #FFED00; }
.pub-energy-bar .seg-e { background: #FBBB1C; }
.pub-energy-bar .seg-f { background: #EE7E23; }
.pub-energy-bar .seg-g { background: #E63027; }
.pub-energy-bar .seg-h { background: #A51B1B; }
.pub-energy-bar .seg.is-active::after {
  content: ''; position: absolute; inset: -3px;
  border: 2px solid var(--brand-ink); border-radius: 6px;
}
.pub-energy-scale { display: flex; justify-content: space-between; font-size: .72rem; color: var(--brand-muted); margin-top: -.4rem; }
.pub-energy-badge {
  background: #16A34A; color: #fff;
  font-weight: 800; font-size: 1.05rem;
  padding: .35rem .75rem; border-radius: 8px;
  min-width: 48px; text-align: center;
  flex: 0 0 auto;
}

/* ---- LAGE --------------------------------------------------------------- */
.pub-lage-grid {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 1rem; align-items: stretch;
}
@media (max-width: 991.98px) { .pub-lage-grid { grid-template-columns: 1fr; } }
.pub-lage-info {
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  padding: 1.4rem; display: flex; flex-direction: column; gap: .8rem;
}
.pub-lage-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: .55rem; font-size: .92rem; color: var(--brand-body);
}
.pub-lage-list li { display: flex; align-items: center; gap: .55rem; }
.pub-lage-list i { color: var(--brand-success); }
.pub-lage-map {
  width: 100%; height: 100%; min-height: 280px;
  border: 0; border-radius: 14px;
  background: var(--brand-line);
}
.pub-lage-placeholder {
  display: grid; place-items: center; text-align: center;
  color: var(--brand-muted); background: var(--brand-line);
  border-radius: 14px; padding: 1.4rem; min-height: 280px;
}
.pub-lage-placeholder i { font-size: 2.2rem; color: var(--brand-muted); }

/* =============================================================================
 *  Sticky aside — three cards (hero / Ansprechpartner / Trust)
 * ============================================================================= */
.pub-aside { display: grid; gap: 1rem; position: sticky; top: 84px; }
.pub-aside-card {
  background: #fff; border: 1px solid var(--brand-line); border-radius: 14px;
  padding: 1.4rem;
}

.pub-detail-title {
  font-weight: 700; font-size: clamp(1.4rem, 2.4vw, 1.85rem);
  color: var(--brand-ink); margin: 0 0 .35rem; line-height: 1.18;
}
.pub-detail-loc { color: var(--brand-muted); font-size: .92rem; }
.pub-detail-loc i { color: var(--brand-primary); }

.pub-chips { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .75rem; }
.pub-chip {
  font-size: .78rem; font-weight: 600;
  padding: .3rem .7rem; border-radius: 999px; border: 1px solid transparent;
  background: var(--brand-primary-050); color: var(--brand-primary-600);
}
.pub-chip-success { background: #DCFCE7; color: #166534; }
.pub-chip-neutral { background: #F1F5F9; color: var(--brand-body); }

.pub-price {
  font-weight: 800; color: var(--brand-ink); font-size: 2rem;
  margin-top: 1rem; line-height: 1.05;
}
.pub-price-sub { color: var(--brand-muted); font-size: .85rem; margin-top: .15rem; }
.pub-price-sqm {
  color: var(--brand-muted); font-size: .9rem; margin-top: .2rem; font-weight: 500;
}

/* KPI 4-grid */
.pub-kpi {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem;
  margin-top: 1.2rem;
  border-top: 1px solid var(--brand-line); padding-top: 1.2rem;
}
.pub-kpi-cell { text-align: center; padding: .25rem; }
.pub-kpi-ico {
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--brand-primary-050); color: var(--brand-primary);
  display: inline-grid; place-items: center; font-size: .95rem; margin-bottom: .4rem;
}
.pub-kpi-val  { font-weight: 700; font-size: 1rem; color: var(--brand-ink); line-height: 1.1; }
.pub-kpi-lbl  { color: var(--brand-muted); font-size: .72rem; margin-top: .1rem; }
@media (max-width: 575.98px) { .pub-kpi { grid-template-columns: repeat(2, 1fr); gap: .5rem; } }

/* Primary CTAs */
.pub-aside-cta { display: grid; gap: .5rem; margin-top: 1.2rem; }
.pub-aside-cta .btn { padding-block: .65rem; font-weight: 600; }

/* Action trio (Merken / Teilen / Drucken) */
.pub-actions {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .25rem;
  border-top: 1px solid var(--brand-line); padding-top: 1rem; margin-top: 1.2rem;
}
.pub-action {
  background: transparent; border: 0;
  color: var(--brand-body); font-size: .85rem; font-weight: 500;
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  padding: .4rem; border-radius: 8px; cursor: pointer;
  text-decoration: none;
  transition: background .12s, color .12s;
}
.pub-action:hover { background: var(--brand-canvas); color: var(--brand-primary); }
.pub-action i { color: var(--brand-primary); }
.pub-action.is-on { color: var(--brand-danger); }
.pub-action.is-on i { color: var(--brand-danger); }
.pub-action.is-on .bi-heart::before { content: "\F417"; }

/* Ansprechpartner card */
.pub-makler {
  display: flex; align-items: center; gap: .8rem;
  margin-bottom: 1rem;
}
.pub-makler-avatar {
  width: 52px; height: 52px; flex: 0 0 52px; border-radius: 50%;
  background: var(--brand-primary); color: #fff;
  display: grid; place-items: center; font-weight: 700; font-size: 1.1rem;
  overflow: hidden;
}
.pub-makler-name { font-weight: 700; color: var(--brand-ink); line-height: 1.2; }
.pub-makler-role { color: var(--brand-muted); font-size: .82rem; }

.pub-contact-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .55rem; font-size: .92rem; }
.pub-contact-list i {
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--brand-primary-050); color: var(--brand-primary);
  display: inline-grid; place-items: center; font-size: .85rem; margin-right: .5rem;
}
.pub-contact-list a { color: var(--brand-body); text-decoration: none; }
.pub-contact-list a:hover { color: var(--brand-primary); }

/* Trust card (3 reassurance rows) */
.pub-aside-trust-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.pub-aside-trust-list li { display: flex; align-items: flex-start; gap: .75rem; }
.pub-aside-trust-list .ico {
  width: 36px; height: 36px; flex: 0 0 36px; border-radius: 10px;
  background: var(--brand-primary-050); color: var(--brand-primary);
  display: grid; place-items: center; font-size: 1.05rem;
}
.pub-aside-trust-list .ttl { font-weight: 700; color: var(--brand-ink); font-size: .92rem; line-height: 1.2; }
.pub-aside-trust-list .sub { color: var(--brand-muted); font-size: .82rem; margin-top: .1rem; }

/* "Geprüfte Immobilie" trust strip on the detail page bottom */
.pub-detail-trust {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
  padding-block: 1.4rem;
}
@media (max-width: 767.98px) { .pub-detail-trust { grid-template-columns: repeat(2, 1fr); } }

/* =============================================================================
 *  Forms (anti-spam honeypot hidden) + inquiry section
 * ============================================================================= */
.pub-form .form-label { font-weight: 600; font-size: .86rem; }
.pub-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* =============================================================================
 *  Footer
 * ============================================================================= */
.pub-footer {
  background: var(--brand-navy); color: rgba(255,255,255,.78);
  padding-block: 2.6rem 1.4rem; margin-top: 2rem;
}
.pub-footer .pub-brand { color: #fff !important; }
.pub-footer .pub-mark  { background: var(--brand-primary); }
.pub-foot-h { color: #fff; font-size: .95rem; font-weight: 700; margin-bottom: .9rem; }
.pub-foot-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.pub-foot-list a { color: rgba(255,255,255,.74); text-decoration: none; font-size: .92rem; }
.pub-foot-list a:hover { color: #fff; }
.pub-foot-text { color: rgba(255,255,255,.68); font-size: .92rem; }
.pub-foot-bottom {
  border-top: 1px solid rgba(255,255,255,.12); margin-top: 1.6rem; padding-top: 1rem;
  font-size: .85rem; color: rgba(255,255,255,.55);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem;
}
.pub-foot-social { display: inline-flex; gap: .55rem; margin-top: .8rem; }
.pub-foot-social a {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(255,255,255,.08); color: #fff;
  display: inline-grid; place-items: center; text-decoration: none;
  transition: background .15s;
}
.pub-foot-social a:hover { background: var(--brand-primary); }

/* --- legal pages --- */
.pub-legal .pub-h2 { margin-top: 1.6rem; }