/* Multifamily Portfolio Page Specific Styles */
/* Reverse slider animation - marquee scrolling (desktop and mobile) */
.gallery-slider-reverse {
  animation: marqueeScrollReverse 30s linear infinite;
}

@keyframes marqueeScrollReverse {
  0% {
    transform: translateX(calc(-50% - 10px));
  }
  100% {
    transform: translateX(0);
  }
}

/* Space between gallery sections - reduce spacing to 20px */
.landing-gallery + .landing-gallery {
  padding-top: 20px !important;
  margin-top: -100px !important;
}

.portfolio-overview-section {
  background: #1e293b;
  color: white;
  padding: 80px 50px;
}

.portfolio-overview-container {
  max-width: 1200px;
  margin: 0 auto;
}

.portfolio-overview-text {
  font-size: 18px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.95);
  max-width: 1000px;
  margin: 0 auto;
}

.multifamily-properties-section {
  padding: 100px 50px;
  background: #eef1ff;
}

.multifamily-properties-container {
  max-width: 1200px;
  margin: 0 auto;
}

.multifamily-properties-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  align-items: stretch;
}

.multifamily-property-card {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 20px;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.multifamily-property-image {
  position: relative;
  height: 500px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 10px;
  padding: 20px;
}

.property-stats-overlay {
  position: absolute;
  bottom: 30px;
  left: 30px;
  right: 30px;
  background: rgba(255, 255, 255, 0.95);
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  border-radius: 10px;
}

.property-stat {
  text-align: center;
}

.property-stat-label {
  font-size: 14px;
  color: #515151;
  margin-bottom: 4px;
  font-weight: 100;
  border-bottom: 0.1px solid #1f508c;
}

.property-stat-value {
  font-size: 18px;
  font-weight: 600;
  color: #1e293b;
}

.multifamily-property-content {
  padding: 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.multifamily-property-title {
  font-size: 28px;
  font-weight: 500;
  color: #1e293b;
  margin-bottom: 10px;
  letter-spacing: -0.5px;
}

.multifamily-property-location {
  font-size: 16px;
  color: #515151;
  margin-bottom: 20px;
  font-weight: 100;
}

.multifamily-property-description {
  font-size: 16px;
  line-height: 1.7;
  color: #334155;
  margin-bottom: 25px;
}

.multifamily-property-button {
  display: block;
  width: 100%;
  padding: 12px 30px;
  background: white;
  color: #1f508c;
  border: 1px solid #1f508c;
  text-decoration: none;
  border-radius: 4px;
  font-weight: 600;
  font-size: 16px;
  transition: all 0.3s ease;
  text-align: center;
  margin-top: auto;
}

.multifamily-property-button:hover {
  background: #e0f2fe;
  border-color: #1f508c;
}

@media (max-width: 1024px) {
  .multifamily-properties-grid {
    grid-template-columns: 1fr;
  }
}

/* Partners marquee wrapper - hidden on desktop */
.partners-logos-wrapper {
  display: contents;
}

/* Hide duplicated logos on desktop */
.partners-logos-wrapper .partner-logo:nth-child(n + 6) {
  display: none;
}

@media (max-width: 768px) {
  .portfolio-overview-section,
  .multifamily-properties-section {
    padding: 40px 10px;
    font-size: 16px;
    text-align: center;
  }
  .multifamily-property-content {
    padding: 30px 10px;
  }
  .portfolio-overview-text {
    font-size: 16px;
  }
  .property-stats-overlay {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .multifamily-property-description {
    font-size: 14px;
  }
  /* Partners marquee on mobile */
  .partners-logos {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    gap: 40px;
    width: 100%;
  }

  .partners-logos-wrapper {
    display: flex;
    animation: partnersMarquee 30s linear infinite;
    gap: 40px;
  }

  .partners-logos-wrapper .partner-logo {
    flex: 0 0 auto;
    min-width: 120px;
  }

  /* Show all logos (including duplicates) on mobile */
  .partners-logos-wrapper .partner-logo:nth-child(n + 6) {
    display: flex;
  }

  @keyframes partnersMarquee {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(calc(-50% - 20px));
    }
  }

  /* Gallery images - double width on mobile */
  .landing-gallery .gallery-horizontal-item {
    min-width: calc(54% - 30px) !important;
    width: calc(54% - 30px) !important;
  }

  /* Gallery horizontal - marquee scrolling on mobile (same as desktop) */
  .landing-gallery .gallery-horizontal {
    overflow-x: hidden;
    overflow-y: hidden;
  }

  /* Regular slider - marquee animation on mobile */
  .landing-gallery .gallery-slider:not(.gallery-slider-reverse) {
    animation: marqueeScrollMobile 30s linear infinite !important;
  }

  @keyframes marqueeScrollMobile {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(calc(-50% - 10px));
    }
  }

  /* Reverse slider animation - marquee on mobile */
  .gallery-slider-reverse {
    animation: marqueeScrollReverseMobile 30s linear infinite !important;
    will-change: transform !important;
    transition: none !important;
  }

  /* Prevent JavaScript from overriding reverse slider transform on mobile */
  .gallery-horizontal .gallery-slider-reverse {
    transition: none !important;
  }

  /* Ensure reverse slider items don't interfere */
  .gallery-slider-reverse .gallery-horizontal-item {
    transform: none !important;
  }

  @keyframes marqueeScrollReverseMobile {
    0% {
      transform: translateX(calc(-50% - 10px)) !important;
    }
    100% {
      transform: translateX(0) !important;
    }
  }
}

