/* Optimized styles to replace inline styles */

/* Hero background images */
.hero-home {
  background-image: url('../househeaderhero2.webp');
}

.hero-about {
  background-image: url('../fbcompanylogo2.webp');
}

.hero-contact {
  background-image: url('../footerhero.webp');
}

.hero-portfolio {
  background-image: url('../img/catherine/after/livingroom2.webp');
}

.hero-thankyou {
  background-image: url('../footerhero.webp');
}

.hero-privacy {
  background-image: url('../househeaderhero2.webp');
}

/* Service card headers and hero sections */
.service-interior, .hero-interior {
  background-image: url('../img/modded/finishedkitchen.webp');
}

.service-exterior, .hero-exterior {
  background-image: url('../img/catherine/after/fronthouse.webp');
}

.service-custom, .hero-custom {
  background-image: url('../img/catherine/after/bedroom1.webp');
}

/* Logo styles */
.navbar-brand img {
  opacity: 1;
  max-width: 180px;
  height: auto;
}

/* Additional optimizations */
.portfolio-item img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Add prefers-reduced-motion support */
@media (prefers-reduced-motion: reduce) {
  .fade-in {
    transition: none;
  }
  
  .btn {
    transition: none;
  }
}

/* Media queries for responsive images */
@media (max-width: 768px) {
  .hero-section {
    min-height: 400px;
    height: 50vh;
  }
  
  h1 {
    font-size: 2rem;
  }
  
  .service-card-header {
    height: 180px;
  }
}

/* Add @supports for older browsers */
@supports not (display: grid) {
  .portfolio-grid {
    display: flex;
    flex-wrap: wrap;
  }
  
  .portfolio-item {
    width: 100%;
    margin-bottom: 1rem;
  }
  
  @media (min-width: 768px) {
    .portfolio-item {
      width: 48%;
      margin-right: 2%;
    }
  }
}

/* Privacy page styles */
.privacy-main {
  padding-left: 30px;
  padding-right: 30px;
}

.privacy-title {
  margin-bottom: 20px;
  color: #235567;
  text-align: center;
}

.privacy-row {
  max-width: 100%;
}

.privacy-content-row {
  margin: auto;
}

.privacy-content-col {
  margin: auto;
}

.privacy-text {
  color: #235567;
}

/* Hero additional styles */
.hero-privacy {
  background-color: #e1eaed;
  height: 35vh;
}

/* Privacy page section styles */
#section1 {
  background-color: #f4f7ff;
  background-position: left top;
  background-repeat: no-repeat;
  padding-top: 20px;
  padding-right: 30px;
  padding-bottom: 20px;
  padding-left: 30px;
  border-top-width: 0px;
  border-bottom-width: 0px;
  border-color: #eae9e9;
  border-top-style: solid;
  border-bottom-style: solid;
}