/*
 * Auwald Immobilien – Webstra Custom Styles
 * Projekt-spezifische Anpassungen
 */

/* Hero Vollbild (LP München, Augsburg, Index) */
.hero-full-bg {
  position: relative;
  min-height: 53vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero-full-bg .hero-img-crossfade {
  position: absolute;
  inset: 0;
}

.hero-full-bg .hero-img-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-full-bg .hero-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(22, 22, 22, 0.5) 0%,
    rgba(14, 14, 14, 0.64) 48%,
    rgba(0, 0, 0, 0.8) 100%
  );
  pointer-events: none;
}

.hero-full-bg .hero-content {
  position: relative;
  z-index: 1;
}

.hero-full-bg .hero-content .text-body-secondary {
  color: rgba(255, 255, 255, 0.95) !important;
}

/* Hero Box Split (Index – Crossfade Augsburg/München) */
.hero-box-split.hero-img-crossfade {
  position: relative;
}

.hero-box-split .hero-img-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-box-split .hero-img-bg.hero-img-augsburg {
  animation: hero-fade-augsburg 8s ease-in-out infinite;
}

.hero-box-split .hero-img-bg.hero-img-munich {
  animation: hero-fade-munich 8s ease-in-out infinite;
}

@keyframes hero-fade-augsburg {
  0%,
  42% {
    opacity: 1;
  }
  50%,
  92% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes hero-fade-munich {
  0%,
  42% {
    opacity: 0;
  }
  50%,
  92% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/*
 * Spacing-Stufe 6–8 ab lg (992px): Theme-Bootstrap endet bei 5.
 * Quelle: public/src/scss/_utilities.scss ($spacers map-merge).
 * Nach Neu-Build von theme(.min).css können diese Zeilen entfallen, wenn keine Duplikate gewünscht sind.
 */
@media (min-width: 992px) {
  .m-lg-6 {
    margin: 4rem !important;
  }
  .mt-lg-6 {
    margin-top: 4rem !important;
  }
  .me-lg-6 {
    margin-right: 4rem !important;
  }
  .mb-lg-6 {
    margin-bottom: 4rem !important;
  }
  .ms-lg-6 {
    margin-left: 4rem !important;
  }
  .mx-lg-6 {
    margin-right: 4rem !important;
    margin-left: 4rem !important;
  }
  .my-lg-6 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
  }
  .p-lg-6 {
    padding: 4rem !important;
  }
  .pt-lg-6 {
    padding-top: 4rem !important;
  }
  .pe-lg-6 {
    padding-right: 4rem !important;
  }
  .pb-lg-6 {
    padding-bottom: 4rem !important;
  }
  .ps-lg-6 {
    padding-left: 4rem !important;
  }
  .px-lg-6 {
    padding-right: 4rem !important;
    padding-left: 4rem !important;
  }
  .py-lg-6 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
  .gap-lg-6 {
    gap: 4rem !important;
  }

  .m-lg-7 {
    margin: 5rem !important;
  }
  .mt-lg-7 {
    margin-top: 5rem !important;
  }
  .me-lg-7 {
    margin-right: 5rem !important;
  }
  .mb-lg-7 {
    margin-bottom: 5rem !important;
  }
  .ms-lg-7 {
    margin-left: 5rem !important;
  }
  .mx-lg-7 {
    margin-right: 5rem !important;
    margin-left: 5rem !important;
  }
  .my-lg-7 {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
  }
  .p-lg-7 {
    padding: 5rem !important;
  }
  .pt-lg-7 {
    padding-top: 5rem !important;
  }
  .pe-lg-7 {
    padding-right: 5rem !important;
  }
  .pb-lg-7 {
    padding-bottom: 5rem !important;
  }
  .ps-lg-7 {
    padding-left: 5rem !important;
  }
  .px-lg-7 {
    padding-right: 5rem !important;
    padding-left: 5rem !important;
  }
  .py-lg-7 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
  .gap-lg-7 {
    gap: 5rem !important;
  }

  .m-lg-8 {
    margin: 6rem !important;
  }
  .mt-lg-8 {
    margin-top: 6rem !important;
  }
  .me-lg-8 {
    margin-right: 6rem !important;
  }
  .mb-lg-8 {
    margin-bottom: 6rem !important;
  }
  .ms-lg-8 {
    margin-left: 6rem !important;
  }
  .mx-lg-8 {
    margin-right: 6rem !important;
    margin-left: 6rem !important;
  }
  .my-lg-8 {
    margin-top: 6rem !important;
    margin-bottom: 6rem !important;
  }
  .p-lg-8 {
    padding: 6rem !important;
  }
  .pt-lg-8 {
    padding-top: 6rem !important;
  }
  .pe-lg-8 {
    padding-right: 6rem !important;
  }
  .pb-lg-8 {
    padding-bottom: 6rem !important;
  }
  .ps-lg-8 {
    padding-left: 6rem !important;
  }
  .px-lg-8 {
    padding-right: 6rem !important;
    padding-left: 6rem !important;
  }
  .py-lg-8 {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
  }
  .gap-lg-8 {
    gap: 6rem !important;
  }
}

/* Homepage: 4-Schritte-Verkaufsprozess */

.home-sell-step-card {
  background-color: var(--fn-tertiary-bg);
  border: 1px solid var(--fn-border-color);
}

.home-sell-step-card__icon {
  width: 3.25rem;
  height: 3.25rem;
  font-size: 1.35rem;
  flex-shrink: 0;
  box-shadow: 0 0.375rem 1rem rgba(var(--fn-primary-rgb), 0.2);
}

.home-sell-step-card p {
  line-height: 1.65;
}

@media (hover: hover) {
  .home-sell-step-card {
    transition:
      transform 0.25s ease,
      box-shadow 0.25s ease,
      border-color 0.25s ease;
  }

  .home-sell-step-card:hover {
    transform: translateY(-3px);
    border-color: var(--fn-primary-border-subtle);
    box-shadow: 0 0.75rem 2rem rgba(17, 24, 39, 0.08);
  }
}

/* Header-Offcanvas (Mobile): kein grauer Hover-/Tap-Hintergrund auf Nav-Links */
.navbar .offcanvas#navbarNav {
  --fn-navbar-nav-link-action-bg: transparent;
}

.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link:hover,
.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link:focus,
.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link:focus-visible,
.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link:active,
.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link.show,
.navbar .offcanvas#navbarNav .navbar-nav > .nav-item > .nav-link.active {
  background-color: transparent !important;
}

/* Header: ≤499px — Kontakt im Offcanvas; Bar-Button ausblenden (Offcanvas immer von links) */
@media (max-width: 499px) {
  .navbar .header-kontakt-bar {
    display: none !important;
  }

  .navbar .header-kontakt-in-menu {
    display: block !important;
  }
}

@media (min-width: 500px) {
  .navbar .header-kontakt-in-menu {
    display: none !important;
  }
}

/* Navbar-Zeile: Flex-Children dürfen schrumpfen ohne Layout zu sprengen */
.navbar.navbar-expand-lg > .container {
  min-width: 0;
}

/* A11y: etwas größere Ziele auf allen Geräten, auf Touch nochmal größer */
.swiper-pagination-clickable .swiper-pagination-bullet {
  position: relative;
  width: 1.1rem;
  height: 1.1rem;
  margin: 0 0.1rem !important;
  background: transparent !important;
  opacity: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.swiper-pagination-clickable .swiper-pagination-bullet::before {
  content: '';
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.3);
  transition:
    transform 0.2s ease,
    opacity 0.2s ease,
    background-color 0.2s ease;
}

.swiper-pagination-clickable .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
  background: var(--swiper-pagination-color, currentColor);
  opacity: 1;
  transform: scale(1.3);
}

@media (pointer: coarse) {
  .swiper-pagination-clickable .swiper-pagination-bullet {
    width: 1.5rem;
    height: 1.5rem;
    margin: 0 0.125rem !important;
  }
}

/* A11y: bessere Lesbarkeit ohne Größen-/Layout-Änderungen */
[data-bs-theme='light'] .action-card .text-body-secondary,
[data-bs-theme='light'] .home-sell-step-card .text-body-secondary,
[data-bs-theme='light'] .bg-body-tertiary .text-body-secondary {
  color: #4f5d6b !important;
}

.footer[data-bs-theme='dark'] .text-body-secondary {
  color: rgba(255, 255, 255, 0.82) !important;
}