
/* General Styles */
 :root {
      --gold: #d49c00;
      --link-color-hover:#b88800;
      --dark-bg: #020615;
      --text-dark: #1C1C1C;
      --text-muted-dark: #3d3d3d;
         /* Font families */
    --font-body:  'Oxygen', sans-serif;
    --font-heading: 'Archivo', sans-serif;
      --border-radius-card: 30px;
    }

    * { box-sizing: border-box;padding: 0; margin: 0; }

    html, body { scroll-behavior: smooth; overflow-x: hidden; max-width: 100vw; }

    body {
      font-family:var(--font-body);
      color: var(--text-muted-dark);
      overflow-x: hidden;
      position: relative;
      font-size: 16px;
          line-height: 1.625;
      padding-top:5.2rem;
    }



p { margin:0 0 15px; }
p:last-child { margin-bottom:0; }
p:empty { display:none; }
.btn {--bs-btn-padding-x: 2rem;--bs-btn-padding-y: 1rem;font-size: var(--bs-body-font-size);border-radius: 50rem;}
.btn-primary {
	--bs-btn-color:var(--primary-color);
	--bs-btn-bg:var(--color-button-primary);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg:var(--color-button-primary-hover);
	--bs-btn-focus-shadow-rgb: 49,132,253;
	--bs-btn-active-color: #000;
	--bs-btn-border-color: #fff;
	--bs-btn-hover-border-color:#fff;
  	--bs-btn-border-width: 0px;
	box-shadow: 0 -2px 0 0 var(--btn-border-color);
	position: relative;
	overflow: hidden;
	transition: 0.2s;}
.btn-outline-secondary{border-color:#00000014;box-shadow: 0 -2px 0 0 #C9C9C9;}	
.btn-group-sm>.btn, .btn-sm {--bs-btn-padding-y: 0.7rem;--bs-btn-padding-x: 1.2rem;}
.btn-primary:hover{background-color:var(--color-button-primary-hover);}
.btn:active{background-color:var(--color-button-primary-hover)!important;color: #fff!important;}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 { font-family: var( --font-heading); font-weight:700; color: var(--text-dark); line-height:1.3; position: relative;z-index: 1; padding: 0; margin: 0 0 20px; letter-spacing: -2%; }
h2, .h2 { letter-spacing: 0; line-height: 1.2; }
h1, .h1 { font-size:50px;}
h2, .h2 { font-size:45px;}
h3, .h3 { font-size:32px;}
h4, .h4 { font-size:27px;}
h5, .h5 {font-size:18px;}
ul{list-style: none;padding: 0;}
.text-danger{color: rgba(255, 0, 0, 1)!important;}
a { color:var(--link-color); text-decoration: none; -webkit-transition: all 0.3s; transition: all 0.3s; }
a:hover { color:var(--link-color-hover); }
.link { text-decoration: underline; }
.mt-6{margin-top: 2rem;}
.mb-6{margin-bottom: 2rem;}
input::placeholder {color:#888888;}
.form-group{position: relative;}
label {font-weight: 400;margin-bottom: 5px}
.form-control:focus { box-shadow:none; border:1px solid var(--color-border3);}
textarea.form-control{border-radius: 30px;max-height: 115px;} 
select { appearance:none; } 
.py-50{ padding:50px 0; }
.pt-50{ padding-top: 50px; }
.pb-50{ padding-bottom: 50px; }
.px-6{padding: 0 2rem;}

#msg .alert-success {margin-bottom: 0; font-size: 16px; line-height: 100%; padding: 13px 20px; text-align: center;}
.f_name {
    background-image: url(../images/input-user.svg);
}
.emailid {
    background-image: url(../images/input-envelop.svg);
}
.msg {
    background-image: url(../images/input-msg.svg);
}

.contact-section .form-control.bg-input {
    background-repeat: no-repeat;
    background-position: 20px center;
    padding-left: 50px;
}
.contact-section textarea.form-control.bg-input {
    background-position: 20px 20px;
}


.cs-inputerror{position: absolute; left: 0; top:100%; background-color: #fcd889; border-radius: 5px; font-size: 14px; z-index: 1; line-height: 100%; padding:10px 10px 10px 35px; color: #000000; display: none;}
.cs-inputerror::before{content: ""; position: absolute; left:10px; top:-7px; display: block; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #fcd889; }
.cs-inputerror > .fa-solid
{display: block; position: absolute; left:6px; top:8px; width: 20px; height: 20px; text-align: center; line-height: 20px; font-size: 12px; background-color: #ff8c00; color: #FFFFFF; border-radius: 3px;} 


input:-internal-autofill-selected
{box-shadow: none!important;background-color:transparent!important;padding-left: 10px;}

/* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
STICKY NAVBAR (use fixed to ensure consistent behaviour)
â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */

header #mainNavbar { background: #fff;transition: box-shadow 0.3s; z-index: 1050; width: 100%; }
header #mainNavbar.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,0.10); }
header .navbar-phone { font-family: var(--font-heading);color: var(--text-dark);}
header .navbar-expand-xl .navbar-nav .nav-link{font-family:var(--font-heading); color: var(--text-dark);padding: 0.5rem 1.5rem ; transition: color 0.2s;position: relative;}
.inner-page header .navbar-expand-xl .navbar-nav .nav-link{padding: 0.5rem 1rem;}
header .navbar-nav .nav-link:before {content: '';position: absolute; display: block; width: 100%;max-width: 60px; height: 3px; bottom: 0; opacity: 0; background: var(--link-color-hover);}
header .navbar-nav .nav-link:hover:before {opacity: 1;}
header .navbar-nav .nav-link:hover, header .navbar-nav .nav-link.active {color: var(--link-color-hover);text-shadow: 0 .015em var(--link-color-hover), 0 -.015em var(--link-color-hover), .01em 0 var(--link-color-hover), -.01em 0 var(--link-color-hover);}
.btn-kontakt {background: var(--gold);color: #fff !important; border: none; border-radius: 10px; font-family: var(--font-body);padding: 13px 30px;transition: background 0.2s, transform 0.15s; }
header .navbar-nav .dropdown-menu {padding:0;}
header .navbar-nav .dropdown-menu .dropdown-item{padding: 1rem 1.5rem;     border-bottom: 1px solid #ccc; transition: background 0.2s;}
    .btn-kontakt:hover { background: var(--link-color-hover); transform: translateY(-1px); }
.contant-btn-box{max-width: 250px;width: 100%;}
/* Hamburger color */
header .navbar-toggler { border: none; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; }
header .navbar-toggler:focus { box-shadow: none; }
header .navbar-toggler .navbar-toggler-open,
header .navbar-toggler .navbar-toggler-close { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
header .navbar-toggler .navbar-toggler-close { display: none; font-size: 2.4rem; line-height: 1; color: var(--text-dark); }
header .navbar-toggler.open .navbar-toggler-open { display: none; }
header .navbar-toggler.open .navbar-toggler-close { display: inline-flex; }
header .navbar-brand.d-xl-none img { max-height: 44px; }

@media (min-width: 992px) {
  .navbar .dropdown:hover > .dropdown-menu {
    display: block;
    margin-top: 0;
  }
  .navbar .dropdown:hover > .dropdown-toggle::after {
    transform: rotate(180deg);
  }
}

/* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
       HERO SECTION
â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.hero-section { position: relative; }
.inner-hero-section {position:relative;  position: relative;min-height: 100vh; display: flex;flex-direction: column; justify-content: flex-end; overflow: hidden;}
.inner-hero-section .hero-bg-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:1;border-radius: 30px;}
.inner-hero-section .hero-overlay { position: absolute;inset: 0; background: linear-gradient(180deg, rgba(2, 6, 21, 0) 20%, rgba(2, 6, 21, 0.8) 80%);border-radius:30px;z-index: 1;}
.inner-page .inner-hero-section.custom-gradient .hero-overlay { background: linear-gradient(90deg, #000000 0%, #000000 47%, #00000000 61%);}
.inner-page .inner-hero-section.custom-gradient { background-size: contain; background-position: right; background-repeat: no-repeat;}
.inner-hero-section .hero-content {position: relative;z-index: 2;min-height:100vh;display: flex; flex-direction: column;    justify-content: space-between;  padding:1.5rem 2rem 3rem; }
.inner-hero-section .hero-content .hero-logo { width: 100%;max-width: 375px; padding: 0; display: flex; justify-content: center;    align-items: center;  margin-bottom: 20px; }
.inner-hero-section .hero-content .hero-copy {padding-bottom: 10px; padding-left: 2rem;}
.inner-hero-section .hero-content .hero-copy .hero-title {font-weight: 800;line-height: 1.125; color: #fff;letter-spacing:0%;}
.inner-hero-section .hero-content .hero-copy .hero-subtitle {font-family: var(--font-body);font-size: clamp(16px, 1.5vw, 20px);      color:#fff;  max-width: 760px;line-height: 1.5; margin-bottom: 36px; }
.inner-hero-section .hero-content .hero-copy .hero-subtitle.zweite{max-width: 840px;font-weight: 800;}
.inner-hero-section .hero-content .hero-copy .btn-hero { background: var(--gold); color: #fff; border: none;border-radius: 10px;      padding: 14px 28px; text-decoration: none; display: inline-block; transition: background 0.2s, transform 0.15s;    }
.inner-hero-section .hero-content .hero-copy .btn-hero :hover { background: #b88800; color: #fff; transform: translateY(-2px); }
/* Inner page styles */
.inner-page .inner-hero-section{background-size: cover;background-repeat: no-repeat;background-position: center; border-radius:var(--border-radius-card);}
.inner-page .inner-hero-section .hero-overlay{background: linear-gradient(90deg, #020615B2 0%, #02061580 52%, #0206154D 70%, #02061500 100%);}
.inner-hero-section .hero-content .hero-copy .tag-title{font-family: var(--font-heading);font-size: 22px;font-weight: 600;line-height: 26px; color:#fff;padding:0 12px;border-left:5px solid var(--gold);margin-bottom: 12px;display: inline-block;letter-spacing: -2%;}
/* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
ÃœBER UNS SECTION
â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
#ueber-uns { position: relative; }
#ueber-uns .section-img {border-radius: 20px;overflow: hidden;}
#ueber-uns .section-img img { width: 100%; height: 100%; object-fit: cover;}
#ueber-uns .ueber-uns-title {margin-bottom: 6px;}
#ueber-uns .ueber-uns-desc { font-size: 18px;line-height: 1.78;color: var(--text-muted-dark);max-width: 740px; }

/* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
MIETERSTRUKTUR SECTION
â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */


.inner-page .dark-bg-section .mieterstruktur-intro {

  color: #fff;
  line-height: 1.7;
  max-width: 1020px;
  margin: 0 auto 80px;
}

.inner-page .dark-bg-section .mieterstruktur-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin-bottom: 20px;
}
.inner-page #mieterstruktur.dark-bg-section .mieterstruktur-grid{margin-bottom: 80px;}

.inner-page .dark-bg-section .mieter-item {
  display: flex;
     flex-direction: row;
  align-items: start;
  gap: 20px;

}

.inner-page .dark-bg-section .mieter-icon-img {
  width: 27px;
  height: 27px;
  margin-top: 6px;
  object-fit: contain;
}

.inner-page .dark-bg-section .mieter-name {
  font-size: clamp(20px, 1.5vw, 26px);
  color: #fff;
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
}

.inner-page .dark-bg-section .mieterstruktur-footer {
  max-width: 900px;
  margin: 0 auto;
}

.inner-page .dark-bg-section .mieterstruktur-desc {
  font-size: clamp(16px, 1.5vw, 20px);
  color: #fff;
  line-height: 1.8;
  margin-bottom: 30px;
}

/* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
PORTFOLIO SECTION
â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.dark-bg-section { background: var(--dark-bg); position: relative; z-index: 1; overflow: hidden; }
.dark-bg-section::after {content: '';position: absolute; left: -120px; bottom: -300px; width: 760px; height: 760px;background: rgba(217, 217, 217, 0.5);border-radius: 50%; opacity: 1; mix-blend-mode: hard-light; filter: blur(120px); pointer-events: none;  z-index: 0;}
.ground-section.dark-bg-section::after{content:'';display:none;}
.dark-bg-section .light-title {  color: #fff; line-height: 1.2;letter-spacing :0}
.card-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem;margin-bottom:35px; }
.card-item { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 30px; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.card-item:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,0.24); }
.card-inner { display: block; overflow: hidden; border-radius: inherit; }
.card-inner img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1199px) {
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
}
@media (max-width: 767px) {
  .card-grid { grid-template-columns: 1fr; }
}
#portfolio .mission-band {padding-bottom: 80px; position: relative; }
#portfolio .mission-band .mission-desc {font-size: clamp(16px, 1.5vw, 18px);color: #fff;line-height: 1.7;}
/* Project cards */
#portfolio .project-card {border-radius: var(--border-radius-card); overflow: hidden; position: relative;height: 680px; cursor: pointer; }
#portfolio .project-card > img {position: absolute; inset: 0;width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}
#portfolio .project-card:hover > img { transform: scale(1.05); }
 /* Flex-expand on hover for project cards */
#portfolio .row-flex { display: flex; gap: 10px; align-items: stretch; position: relative; z-index: 1; }
#portfolio .row-flex > [class*="col-"] { flex: 1 1 0; transition: flex 0.5s ease; }
#portfolio .row-flex > [class*="col-"]:hover { flex: 1.75 1 0; }
/* Project details reveal */
#portfolio .project-card .project-details {margin-bottom:50px; color: #fff;list-style: disc; padding-left: 20px; max-height: 0; opacity: 0; overflow: hidden; transition: max-height 0.4s ease, opacity 0.3s ease;line-height: 1.8;}
#portfolio .row-flex > [class*="col-"]:hover .project-details { max-height: 400px; opacity: 1; }
#portfolio .project-card .project-card-overlay {position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 30%, rgba(0,0,0,0.88) 100%); border-radius: var(--border-radius-card); }
#portfolio .project-card .project-card-body {position: absolute; bottom: 0; left: 0; right: 0; padding:30px 25px;}
#portfolio .project-card .project-card-body .location-badge {display: inline-flex; align-items: center; gap: 6px; background: rgba(0,0,0,0.7);  color: #fff;padding: 6px 14px;border-radius: 10px;margin-bottom: 15px; }
#portfolio .project-card .project-card-body .project-title {  color: #fff; line-height: 1.35; margin-bottom: 8px;max-width:540px}
#portfolio .project-card .project-card-body .project-type {font-size: clamp(16px, 1.5vw, 18px); color: #fff; margin: 30px 0;}
#portfolio .project-card .project-card-body .project-cta {color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: 2px; display: inline-block; transition: opacity 0.2s;}
#portfolio .project-card .project-card-body .project-cta:hover {color: var(--link-color-hover); }

.property-card { cursor: pointer; }
.property-section{position: relative;overflow: hidden;}

/* object description gallery design */
.property-section .object-description-gallery { margin-bottom: 40px; }
.property-section .description-card { background:#E8E6DF87; border-radius: 32px; padding: 30px 25px; min-height: 100%; ; }
.property-section .description-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.5rem; }
.property-section .description-list li { position: relative; padding-left: 30px; font-size: 16px; line-height: 1.5; }
.property-section .description-list li::before { content: ""; position: absolute; left: 0; top: 0.3rem; width: 16px; height: 16px; background: url('../images/right-check.svg') no-repeat center/contain; }




/* GrundstÃ¼ck section with right-side full-width image swiper */
.ground-section { background: #020615; color: #fff; position: relative; overflow: hidden; padding: 0; min-height: 50px; }
/* .ground-section .container-lg { position: relative; z-index: 2; } */
.ground-section .ground-slider-panel { position: relative; top: 0; right: 0; width:100%; height: 100%; overflow: hidden; z-index: 1; }
.ground-section .ground-slider-panel .ground-swiper { width: 100%; height: 100%; }
.ground-section .ground-slider-panel .swiper-wrapper { align-items: stretch; }
.ground-section .ground-slider-panel .swiper-slide { width: 100%; display: flex; justify-content: center; height: 100%; }
.ground-section .ground-slider-panel .swiper-slide img { width: 100%; height: 100%; object-fit: cover; min-height: 560px; max-height: 560px; }
.ground-section .ground-slider-panel .swiper-pagination { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 2; }
.ground-section .ground-text { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 80px 60px 80px 0; }
.ground-section .ground-desc { color: rgba(255,255,255,0.85); font-size: clamp(16px, 1.5vw, 18px); line-height: 1.8; margin-bottom: 1.3rem; }
@media (max-width: 1200px) {
  .ground-section .ground-slider-panel { width: 55vw; }
}
@media (max-width: 991px) {
  .ground-section { min-height: auto; }
  .ground-section .ground-slider-panel { position: relative; width: 100%; height: 420px; right: auto; top: auto; }
  .ground-section .ground-text { padding: 60px 0; }
}

/* slide spacing */
.property-section .propertySwiper{padding-bottom:10px;}
.property-section .property-card img{width:100%;height:420px;object-fit:cover;border-radius:var(--border-radius-card);transition: transform 0.5s ease;}

/* bottom area */
.property-section .property-controls{display:flex;align-items:center;justify-content:end;margin-top:20px;}
/* progress bar */

/* arrows */
.property-section .property-nav{display:flex;gap:15px;}
.property-section .property-nav .swiper-button-prev, .property-section .property-nav .swiper-button-next{ position:relative;top:auto;left:auto;right:auto;width:50px;height:50px;border-radius:50%;}
.property-section .property-prev{background:#D49C00B2}
.property-section .property-next{background:var(--gold);}
.property-section .swiper-button-prev:after,
.property-section .swiper-button-next:after{font-size:16px;color:#fff;}


/* FOOTER */
.footer {background: #fff;position: relative; z-index: 1; }
.footer .footer-logo-wrap { display: flex; }
.footer .footer-heading {font-weight: 500; margin-bottom: 25px;}
.footer .footer-divider-v {width: 1px; background: #525252; align-self: stretch; margin: 0 24px; }
.footer .footer-address { line-height: 1.6; margin-bottom: 50px; }
.footer .footer-contact-item { display: flex; align-items: center; gap: 10px; font-family: 'Oxygen', sans-serif;margin-bottom: 12px; }
.footer .footer-nav-link {font-family: 'Archivo', sans-serif;font-size: 16px;text-decoration: none;display: block;line-height: 2.3;transition: color 0.2s;}
.footer .footer-nav-link:hover { color: var(--gold); }
.footer .footer-bottom { border-top: 1px solid #00000029; padding: 22px 0;margin-top: 50px; }
.footer .footer-bottom .footer-copy {font-family: 'Archivo', sans-serif;font-size: 15px;  }
.footer .footer-bottom .social-icons { display: flex; gap: 14px; align-items: center; }
.footer .footer-bottom .social-icon { transition: background 0.2s, transform 0.15s; }
.footer .footer-bottom .social-icon:hover {  transform: translateY(-2px); }

.inner-page .footer{background-color: #000;color:#fff;}
.inner-page .footer .footer-heading {color: #fff;}
.inner-page .footer .footer-divider-v {background: #525252;}
.inner-page .footer .footer-bottom{border-top:1px solid #FFFFFF29;padding:30px 0}

/* Contact section - white background as per screenshot */
.contact-section { background: #ffffff; color: var(--text-dark); position: relative; overflow: hidden; }
.contact-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; }
.contact-section .contact-wrapper { position: relative; z-index: 1;  }
.contact-section .contact-card { padding:20px 0px 20px 0px;}

.contact-section .form-desc { font-size: 15px; line-height: 1.6; color: var(--text-muted-dark); margin-bottom: 18px; }
.contact-section .contact-text {max-width: 860px;margin-bottom:40px; }
.contact-section .csinput-wrp { position: relative; display: block; width: 100%; }
.contact-section .form-control { width: 100%; border-radius: 10px; border: 1px solid #3B3B3B0F; background-color:#E8E6DF87; color: var(--text-dark); padding: 16px 18px; min-height:60px; transition: border-color 0.12s, background 0.12s; }
.contact-section .form-control::placeholder { color: #9b9b9b; }
.contact-section textarea.form-control { min-height: 110px; resize: vertical; padding-top: 12px; }
.contact-section .form-control:focus { outline: none; box-shadow: none; border-color: rgba(212,156,0,0.25); background-color:#f3f2ee; }
.contact-section .submit-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 14px 20px; height: 50px; border-radius: 10px; border: none; background: var(--gold); color: #fff;transition: transform 0.14s, background 0.14s; }
.contact-section .submit-btn:hover { background: var(--link-color-hover); transform: translateY(-2px); color: #fff; }
.contact-section #msg { margin-top: 1rem; }


/* Ensure footer keeps a dark background (no HTML changes). This preserves existing footer structure but restores dark look. */
.inner-page .footer { background: #000; color: #fff; }
.inner-page .footer, .inner-page .footer a, .inner-page .footer .footer-heading, .inner-page .footer .footer-copy { color: #fff; }
.inner-page .footer .footer-bottom { border-top: 1px solid #FFFFFF29; }

/*
FEATURE / SLIDER SECTION */
.slider-card {position: relative; overflow: hidden;padding-right:  30px;}
.slider-card .swiper-slide > img {width: 100%; height: 100%;min-height: 640px;max-height: 640px; object-fit: cover; border-radius: var(--border-radius-card); transition: transform 0.5s ease; cursor: pointer;}

.organisation-swiper { width: 100%; height: 100%; }
.organisation-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.organisation-swiper .swiper-slide { display: flex; align-items: center; justify-content: center; }
.organisation-swiper .swiper-pagination { position: absolute; left: 50%; transform: translateX(-50%); bottom: 18px; }
.organisation-swiper .swiper-pagination-bullet, .ground-slider-panel .swiper-pagination-bullet { background: rgba(255,255,255,0.9); border: 2px solid #fff; width: 20px; height: 20px; opacity: 1; }
.organisation-swiper .swiper-pagination-bullet-active, .ground-slider-panel .swiper-pagination-bullet-active { background: var(--gold); border-color: #fff; width:20px; height:20px; }
.feature-list .feature-item { gap: 14px; align-items: flex-start; }
.feature-icon { width:44px; height:42px;margin-right: 16px; background-repeat: no-repeat; background-position: center; background-size: contain; display: inline-flex; align-items: center; justify-content: center; }
.feature-list h5 { margin: 0 0 6px; font-weight: 600; }
.feature-list p { margin-bottom: 20px; font-size: 16px;}

.lightbox-modal { position: fixed; inset: 0; z-index: 2050; display: none; align-items: center; justify-content: center; background: rgba(0,0,0,0.88); }
.lightbox-modal.open { display: flex; }
.lightbox-backdrop { position: absolute; inset: 0; background: transparent; }
.lightbox-content { position: relative; width: min(1400px, calc(100vw - 32px)); max-height: calc(100vh - 32px); display: flex; align-items: center; justify-content: center; }
.lightbox-image { max-width: 100%; max-height: calc(100vh - 40px); object-fit: contain; border-radius: 14px; box-shadow: 0 28px 80px rgba(0,0,0,0.45); }
.lightbox-close, .lightbox-nav { position: absolute; border: none; background: #D49C00B2; color: #fff; width: 48px; height: 48px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s; font-size: 26px; line-height: 1.5; }
.lightbox-close:hover, .lightbox-nav:hover { background: var(--gold); }
.lightbox-close { top: -20px; right: 0px; }
.lightbox-prev, .lightbox-next { top: 50%; transform: translateY(-50%); }
.lightbox-prev { left: 12px; }
.lightbox-next { right: 12px; }

.cs-row1 p{font-size: 18px;line-height: 42px;max-width: 875px; margin-bottom: 40px;}
.cs-row1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 50px;
}
.quartier-title {
    font-size:clamp(24px, 3vw, 48px);
    margin-bottom: 70px;
}
.cs-sec4row .s1-icon-box .s1-icon-img{min-height: 90px;margin-bottom: 20px;}
.cs-sec4row > .col-md-4{padding-left: 0; padding-right: 0;border-left: 1.5px dashed #444B67;}
.cs-sec4row > .col-md-4:first-child{border-left: none;}


/* Custom grid for Architektur und BauqualitÃ¤t section */
.inner-page .dark-bg-section .custom-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 40px;
}

.custom-grid-item {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  min-height: 260px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.18);
}

.img-overlay-box {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 260px;
}

.img-overlay-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(.4,2,.3,1);
  display: block;
}

.img-gradient-overlay {
  position: absolute;
  left: 0; right: 0; bottom: 0; top: 0;
  background: linear-gradient(180deg, #00000000 0%, #00000006 48%, #000000 100%);
  z-index: 2;
  transition: background 0.4s;
}

.img-overlay-text {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 24px 20px 30px 20px;
  color: #fff;
  font-family: var(--font-heading);
  font-size: clamp(18px, 1.5vw, 22px);
  font-weight: 500;
  letter-spacing: -2%;
  z-index: 3;
  text-shadow: 0 2px 8px rgba(0,0,0,0.25);
  background: none;
  transition: color 0.3s;
}

.img-overlay-box:hover img {
  transform: scale(1.07);
  filter: brightness(1.08);
}

.img-overlay-box:hover .img-gradient-overlay {
  background: linear-gradient(180deg, #00000000 0%, #000000 100%);
}

.img-overlay-box:hover .img-overlay-text {
  color: #ffe082;
}

   /* Map Card Styles */
         .map-image-wrapper {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            cursor: pointer;
         }

         .map-image-blur {
            display: block;
            width: 100%;
            min-height:450px;
            filter: blur(4px);
            transition: all 0.3s ease;
         }

         .map-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.6);
            z-index: 1;
         }

         .map-content {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            z-index: 2;
            padding: 30px;
            text-align: center;
            transition: opacity 0.3s ease;
         }

         .map-text {
            color: #ffffff;
            font-size: 16px;
            line-height: 1.6;
            margin: 0 0 50px 0;
            max-width: 500px;
         }

         .map-load-link {
            color: #ffffff;
            text-decoration: none;
            font-weight: 600;
            padding: 12px 30px;
            border: 2px solid #ffffff;
            border-radius: 5px;
            display: inline-block;
            transition: all 0.3s ease;
         }

         .map-load-link:hover {
            background: #ffffff;
            color: #000000;
         }

         .map-image-wrapper.hidden {
            display: none;
         }

         #mapIframe.visible {
            display: block !important;
         }


.s1-icon-box{text-align: center; padding:10px 16px;}
.sold-overlay-section{position:relative;overflow:hidden;}
.sold-overlay-section .sold-overlay{position:absolute;inset:0% 0 0 0;pointer-events:none;background-image:url("../images/dritten/sold.svg");background-repeat:no-repeat;background-position:center;background-size:95%;opacity:1;z-index: 3;}
.s1-icon-box h5.s1-icon-text{font-size:clamp(20px, 1.5vw, 26px);font-weight:400;color:#3d3d3d;margin-top: 20px;letter-spacing: -2%;line-height: 1.5;}
.sold-overlay-section .s1-icon-box h5.s1-icon-text{font-size:clamp(16px, 1.5vw, 26px);}
.organisation-section h4{font-size:clamp(20px, 1.5vw, 26px);}
.organisation-section p{max-width: 660px;}
.lgbox-img-wrp img{border-radius: 30px; width: 100%; height: 100%; object-fit: cover;}

@media (max-width: 991px) {
  .property-swiper .swiper-pagination { bottom: 12px; }
  .feature-icon { width: 40px; height: 40px; font-size: 18px; }
  .lightbox-content { width: calc(100vw - 20px); }
  .lightbox-close, .lightbox-nav { width: 36px; height: 36px; font-size: 24px; }
  .lightbox-prev { left: 8px; }
  .lightbox-next { right: 8px; }
  .property-section .property-card img{height: 350px;}
  .inner-page .dark-bg-section .mieterstruktur-desc, .card-grid {margin-bottom: 0px;}
  
  .inner-page .inner-hero-section.custom-gradient { background-size: cover; background-position: right; background-repeat: no-repeat;}
  .sold-overlay-section .sold-overlay{background-size:95%;opacity:1;inset:0;}
   .ground-section {
               display: block !important;
               overflow: hidden;
            }

            .ground-section .ground-slider-panel {
               position: relative !important;
               left: 0 !important;
               right: 0 !important;
               width: 100% !important;
               max-width: 100% !important;
               margin-left: 0 !important;
               margin-right: 0 !important;
               height: auto !important;
               z-index: 1 !important;
            }

            .ground-section .ground-slider-panel .swiper-slide img {
               width: 100%;
               height: auto;
               display: block;
            }

            .ground-section .container-lg {
             
               padding-top: 0;
            }

            .ground-section .ground-text {
               padding: 40px 0 60px;
            }

            .contact-section .container {
               max-width: 100% !important;
               width: 100% !important;
               padding-left: 1rem !important;
               padding-right: 1rem !important;
            }

            .contact-section .row.g-5 {
               gap: 1.5rem;
            }

            .contact-section .col-xl-7,
            .contact-section .col-xl-4 {
               flex: 0 0 100% !important;
               width: 100% !important;
               max-width: 100% !important;
            }
}





@media (min-width: 1200px) {

.py-lg-100{padding: 80px 0;}   
.pt-lg-100{padding-top: 80px;}    
.pb-lg-80{padding-bottom: 60px;}
.pb-lg-60{padding-bottom: 40px;}
.pt-lg-80{padding-top: 60px;}   
.functions-section{padding: 60px 0 90px;}
.client-logo-box img{width: 100%;height: 150px;object-fit: contain;}
}


@media (min-width: 1600px) {
      .contant-btn-box{width: 100%;max-width: 320px;}
.container, .container-lg, .container-xl, .container-xxl { max-width:1480px; }
h1, .h1 { font-size:60px;}
h2, .h2 { font-size:55px;}
h3, .h3 { font-size:35px;}
h4, .h4 { font-size:30px;}
h5, .h5 {font-size:22px;}
.d-xxxl-none{ display: none; }
.py-lg-100{padding: 100px 0;}   
.pt-lg-100{padding-top: 100px;}
.pt-lg-80{padding-top: 80px;}    
.pb-lg-80{padding-bottom: 80px;}
.pb-lg-60{padding-bottom: 60px;}
.contact-section .submit-btn{height: 60px;}
.inner-page .dark-bg-section .mieterstruktur-grid{gap:40px 80px;}
.inner-page .dark-bg-section .custom-grid{gap: 40px;}
/* .feature-list p { margin-bottom: 20px; font-size: 18px;} */
.slider-card .swiper-slide > img {min-height: 740px;max-height: 740px;}
#portfolio .project-card {height: 780px;}
#portfolio .project-card .project-card-body { padding:30px 40px;}
.inner-hero-section .hero-content { padding:1.5rem 4rem 5rem; }

}
@media (min-width: 1720px) {
    
 .inner-page .container-lg, .inner-page .container-xl, .inner-page .container-xxl { max-width:1680px; }
.slider-card{padding-right: 60px;}
}

@media (max-width: 1920px) {.property-section .propertySwiper {
    padding-bottom: 10px;
    margin-right: calc(-100vw / 2 + 100% / 2);
    max-width: calc(100vw);}
    .ground-section .ground-slider-panel { position: relative; top: 0; right: 0; width: min(50vw, 952px); height: 100%; overflow: hidden; z-index: 1; }
  }

@media (max-width: 1480px) 
{
  #ueber-uns .ueber-uns-desc{font-size: 16px;}
  .inner-page header .navbar-expand-xl .navbar-nav .nav-link{padding: 0.5rem .75rem;}
h1, .h1 { font-size:48px;}
h2, .h2 { font-size:42px;}
h3, .h3 { font-size:30px;}
h4, .h4 { font-size:27px;}
h5, .h5 {font-size:20px;}
.property-section .property-card img { width: 100%; height: 350px;}
.ground-section .ground-slider-panel .swiper-slide img { min-height: 480px; max-height: 480px; }
}

@media (max-width: 1400px) {

#portfolio .project-card .project-card-body{padding: 40px 20px;}
.cs-sec4row .s1-icon-box .s1-icon-img{min-height: 80px;}
.map-content {font-size:15px;padding: 20px;}

}
@media (max-width: 1280px) {
    .inner-page header .navbar-expand-xl .navbar-nav .nav-link{font-size: 15px;}
.ground-section .ground-text{padding: 60px 30px 60px 0;}
  #portfolio .project-card{height: 520px;}
  .slider-card .swiper-slide > img { min-height: 500px; max-height: 500px;max-height: 500px; }
  #portfolio .row-flex{gap:0;}
  #portfolio .project-card .project-card-body .project-type{margin: 20px 0;}
.btn-kontakt{padding: 12px 20px;}
.slider-card{padding-right: 0;}
.inner-page header .navbar-expand-xl .navbar-nav .nav-link {font-size: 14px;}
}

@media (max-width: 1199px) {

    h1, .h1 { font-size:44px;}
h2, .h2 { font-size:36px;}

h3, .h3 { font-size:30px;}
h4, .h4 { font-size:27px;}
h5, .h5 {font-size:20px;}

.contant-btn-box{max-width: 200px;width: 100%;}
.inner-page .container-fluid.px-6 { padding: 0 1rem; }
.inner-page header .navbar-expand-xl .navbar-nav .nav-link{padding: 1rem 0rem 0rem;font-size: 16px;}
.property-section .property-card img{height: 300px;}
.map-image-blur{max-height: 350px;min-height: 350px;}
}

@media (max-width: 991px) {
  header .navbar-expand-xl .navbar-nav .nav-link {padding: 1rem 0rem 0rem;}
   header.sticky-top {z-index: 1060; }
   .hero-section.px-6 { padding: 0 1rem; }
    .inner-hero-section .hero-content {padding: 1.5rem 1rem 5rem;}
#portfolio .row-flex > [class*="col-"] { flex: none; margin-bottom: 1rem; }
#portfolio .row-flex > [class*="col-"]:hover{flex: none;}
#portfolio .project-card .project-details{opacity: 1; max-height: none; padding: 20px 0 0;}
#portfolio .project-card .project-card-overlay {background: linear-gradient(to bottom, #0000001a, rgba(0, 0, 0, 0.88) 100%);}
.inner-page .dark-bg-section .mieterstruktur-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
  .custom-grid {grid-template-columns: 1fr 1fr; gap: 20px; }
  .property-section .propertySwiper{margin-right: auto;max-width: 100%;}
  .property-section .property-nav{position: absolute; top: 78%; left: 0%; transform: translateY(-50%);width: 100%; display: flex; justify-content: space-between; padding: 0 10px;z-index: 2; }
  .property-section .property-card img{height: 320px;}
  .ground-section{padding:30px 0 70px;}
}

@media (max-width: 767px) {
  .inner-hero-section .hero-content .hero-copy{padding:0 1rem;}
   .footer .footer-divider-v { display: none; }
     .hero-section { min-height: 75vh; }
.inner-page .dark-bg-section .mieterstruktur-grid { grid-template-columns: 1fr; gap: 25px; margin-bottom: 10px;}
.inner-page #mieterstruktur.dark-bg-section .mieterstruktur-grid{margin-bottom: 30px;}
.cs-row1 p{font-size: 16px;line-height: 26px; margin-bottom: 20px;}
.quartier-title{margin-bottom: 40px;}
h1, .h1 { font-size:27px; }
h2, .h2 { font-size:26px; }
h3, .h3 { font-size:20px; }
h4, .h4 { font-size:20px; }
h5, .h5 { font-size:18px; }
.property-section .propertySwiper{margin-right: auto;max-width: 100%;}
.property-section .propertySwiper .swiper-slide{width: calc(100% - 0px)!important;}
 .slider-card .swiper-slide > img { min-height: 400px;max-height: 400px; }
.property-section .property-nav{position: absolute; top: 70%; left: 0%; transform: translateY(-50%);width: 100%; display: flex; justify-content: space-between; padding: 0 10px;z-index: 2; }
.property-section .object-description-gallery .property-nav {top: 78%; transform: translateY(50%);}
.inner-page .inner-hero-section.custom-gradient .hero-overlay { background: linear-gradient(180deg, rgba(2, 6, 21, 0) 20%, rgba(2, 6, 21, 0.8) 80%); }
  .property-section .property-card img{height: 320px;}
   .cs-sec4row > .col-md-4{ border: 0;}
.inner-page .dark-bg-section .mieterstruktur-intro{    margin: 0 auto 30px;}
.container-lg.px-4, .container.px-4  { padding: 0 0.875rem!important; }
.map-content .btn-kontakt{padding: 8px 14px;}
.contact-section .contact-text {    margin-bottom: 20px;}
.ground-section .ground-text{padding: 30px 20px 20px 0;}
.inner-hero-section, .inner-hero-section .hero-content{min-height: 85vh;}
.dark-bg-section::after{left: -80px; bottom: -200px; width: 350px; height: 350px; filter: blur(100px);}
.s1-icon-box{padding: 8px 6px;}
.cs-row1{margin-bottom: 20px;}
.organisation-swiper .swiper-pagination-bullet, .ground-slider-panel .swiper-pagination-bullet{width: 10px; height: 10px;}
.ground-section .ground-slider-panel .swiper-slide img { min-height: 350px; max-height: 350px; }
}

@media (max-width: 575px) {
.property-section .object-description-gallery .property-nav {top: 85%; transform: translateY(50%);}
.btn-group-sm>.btn, .btn-sm{--bs-btn-padding-y: 0.5rem;--bs-btn-padding-x: 0.8rem;}
 .custom-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

}