/* ========================================
   Red Barn Media Group - Custom Styles 
   Blue Valley Heating & Cooling
   ======================================== */

/* ========================================
   HERO SECTION STYLES
   ======================================== */

/* Main hero intro section */
.bv-hero-intro {
    background: #f4ecdf;
    background-size: cover;
    width: 100%;
    height: 805px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 0;
    overflow: visible;
}

/* Sub-page hero variant */
.bv-hero-intro.sub {
    height: fit-content;
}

/* Hero technician illustration positioning */
.hero-tech {
    position: absolute;
    top: -14rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    pointer-events: none;
}

/* Hero section padding */
.bv-hero-padding {
    padding-top: 10rem;
    padding-bottom: 6rem;
}

/* Hero typography styles */
.bv-hero-intro h1 {
    font-size: 4rem;
    line-height: 1.125;
    font-family: barlow-condensed, sans-serif;
    font-weight: 600;
    font-style: normal;
    color: #fff;
}

.bv-hero-intro h2 {
    font-size: 1.75rem;
    font-family: barlow-condensed, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #fff;
}
/* Sub Hero Image */
.bvhc-ac-sub-hero {
    background: url(../img/bvhc-rollover-air-conditioner-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-furnace-sub-hero {
    background: url(../img/bvhc-rollover-furnace-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}


.bvhc-boiler-sub-hero {
    background: url(../img/bvhc-rollover-boiler-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-commercial-sub-hero {
    background: url(../img/bvhc-rollover-commercial-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-iaq-sub-hero {
    background: url(../img/bvhc-rollover-indoor-air-quality-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-mini-split-sub-hero {
    background: url(../img/bvhc-rollover-mini-split-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-modular-sub-hero {
    background: url(../img/bvhc-rollover-modular-hvac-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-water-heater-sub-hero {
    background: url(../img/bvhc-rollover-water-heater-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-heat-pump-sub-hero {
    background: url(../img/bvhc-rollover-heat-pump-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-sub-hero {
    background: url(../img/bv-rollover-sub-546-279.webp) center center no-repeat;
    background-size: cover;
    width: 546px;
    height: 279px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

/* Hero card background overlay */
.bg-hero-card {
    background: rgba(255, 255, 255, 0.35);
}

/* ========================================
   CONTACT FORM BORDER STYLES
   ======================================== */

/* Outer cream border for contact forms */
.outer-cream {
    background-color: #f4ecdf;
    padding:1px;
}

/* Horizontal rule cream styling */
.hr-cream {
    border: none;
    height: 8px;
    background-color: #f4ecdf;
    width: 100%;
    margin: 0;
}

/* Inner blue border for contact forms */
.inner-blue {
    background-color: #18314c;
    padding: 10px;
}

/* ========================================
   BANNER BACKGROUND STYLES
   ======================================== */

/* Maintenance section banner background */
.bv-banner-maintenance {
    background-image: url('/img/bv-maintenance-banner-xl-2000-784.svg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Rebate card background */
.bg-rebate {
    background: url(../img/bv-rebate-card-xl.svg) center center no-repeat;
    background-size: cover;
    width: 100%;
    min-height: fit-content;
}

/* Financing section technician image positioning */
.bv-financing-tech-image {
    position: absolute;
    right: 0;
    bottom: -50px;
    z-index: 0;
    height: 100%;
    overflow: hidden;
}

.bv-financing-tech-image img {
    height: 100%;
    object-fit: contain;
}

/* ========================================
   FAQ ACCORDION STYLES
   ======================================== */

/* Hide default Bootstrap accordion arrow */
.accordion-button::after {
    display: none !important;
}

/* FAQ icon rotation when expanded */
.accordion-button:not(.collapsed) .faq-icon {
    transform: rotate(90deg);
    transition: transform 0.2s ease-in-out;
}

/* FAQ icon rotation when collapsed */
.accordion-button.collapsed .faq-icon {
    transform: rotate(0deg);
    transition: transform 0.2s ease-in-out;
}

/* Remove focus outline on accordion buttons */
.accordion-button:focus {
    box-shadow: none !important;
    border-color: transparent !important;
}

/* Custom accordion item styling */
.accordion-item {
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #78acb6 !important;
    padding-bottom: 1rem;
}

/* Remove borders from accordion body */
.accordion-body {
    border: none !important;
}

/* ========================================
   RESPONSIVE STYLES
   ======================================== */

/* ========================================
   LARGE DESKTOP (max-width: 1600px)
   ======================================== */
@media (max-width: 1600px) {
    /* Hero section adjustments */
    .bv-hero-intro {
        background: #f4ecdf;
        background-size: cover;
        width: 100%;
        height: 805px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: relative;
        z-index: 0;
        overflow: visible;
    }

    /* Typography adjustments */
    .bv-hero-intro h1 {
        font-size: 3.5rem;
        line-height: 1;
        font-family: barlow-condensed, sans-serif;
        font-weight: 700;
        font-style: normal;
    }

    .bv-hero-intro h2 {
        font-size: 1.5rem;
        font-family: barlow-condensed, sans-serif;
        font-weight: 400;
        font-style: normal;
    }

    /* Banner background adjustments */
    .bv-banner-maintenance {
        background: url(/img/bv-maintenance-banner-lg-1600-628.svg) center center no-repeat;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg-rebate {
        background: url(../img/bv-rebate-card-xl.svg) center center no-repeat;
        background-size: cover;
        width: 100%;
        min-height: fit-content;
    }

    .bv-financing-tech-image {
        position: absolute;
        right: 0;
        bottom: -50px;
        z-index: 0;
        height: 100%;
        overflow: hidden;
    }

    .bv-financing-tech-image img {
        height: 100%;
        object-fit: contain;
    }
}

@media (max-width: 1300px) {
/* Sub Hero Image */
.bvhc-ac-sub-hero {
    background: url(../img/bvhc-rollover-air-conditioner-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-furnace-sub-hero {
    background: url(../img/bvhc-rollover-furnace-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}


.bvhc-boiler-sub-hero {
    background: url(../img/bvhc-rollover-boiler-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-commercial-sub-hero {
    background: url(../img/bvhc-rollover-commercial-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-iaq-sub-hero {
    background: url(../img/bvhc-rollover-indoor-air-quality-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-mini-split-sub-hero {
    background: url(../img/bvhc-rollover-mini-split-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-modular-sub-hero {
    background: url(../img/bvhc-rollover-modular-hvac-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
.bvhc-water-heater-sub-hero {
    background: url(../img/bvhc-rollover-water-heater-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-heat-pump-sub-hero {
    background: url(../img/bvhc-rollover-heat-pump-456-233.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}

.bvhc-sub-hero {
    background: url(../img/bv-rollover-sub-456-325.webp) center center no-repeat;
    background-size: cover;
    width: 409px;
    height: 208px;
    border-radius: 1rem;
    border: 2px solid #18314c;
    padding: 8px;
}
}
/* ========================================
   DESKTOP (max-width: 1200px)
   ======================================== */
@media (max-width: 1200px) {
    /* Hero section adjustments */
    .bv-hero-padding {
        padding-top: 14rem;
        padding-bottom: 6rem;
    }

    .bv-hero-intro {
        background: #f4ecdf;
        background-size: cover;
        width: 100%;
        height: fit-content;
    }

    /* Typography adjustments */
    .bv-hero-intro h1 {
        font-size: 3rem;
    }

    .bv-hero-intro h2 {
        font-size: 1.25rem;
    }

    /* Banner background adjustments */
    .bv-banner-maintenance {
        background: #f4ecdf;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg-rebate {
        background: #78acb6;
        background-size: cover;
        width: 100%;
        min-height: fit-content;
    }

    .bv-financing-tech-image {
        position: relative;
        right: 0;
        bottom: -50px;
        z-index: 0;
        height: 500px;
        overflow: hidden;
    }

    .bv-financing-tech-image img {
        height: 100%;
        object-fit: contain;
    }
}

/* ========================================
   TABLET (max-width: 991px)
   ======================================== */
@media (max-width: 991px) {
        .outer-cream {
        margin-top: 25px;
    background-color: #f4ecdf;
    padding:1px;
}

    /* Hero section adjustments */
    .bv-hero-padding {
        padding-top: 14rem;
        padding-bottom: 6rem;
    }

    .bv-hero-intro {
        background: #f4ecdf;
        background-size: cover;
        width: 100%;
        height: fit-content;
    }

    /* Hero technician image repositioning */
    .hero-tech {
          position: absolute;
    top: -6rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    pointer-events: none;
    }
}

/* ========================================
   MOBILE (max-width: 767px)
   ======================================== */
@media (max-width: 767px) {
    /* Hero section adjustments */
    .bv-hero-intro {
        background: #f4ecdf;
        background-size: cover;
        width: 100%;
        height: fit-content;
    }

    /* Hide hero technician image on mobile */
    .hero-tech {
        display: none !important;
    }

    .bvhc-ac-sub-hero,.bvhc-furnace-sub-hero,.bvhc-boiler-sub-hero,.bvhc-commercial-sub-hero,.bvhc-iaq-sub-hero,.bvhc-mini-split-sub-hero,.bvhc-modular-sub-hero,.bvhc-water-heater-sub-hero,.bvhc-heat-pump-sub-hero,.bvhc-sub-hero {
    background: url(../img/bv-tech-hero-643-657.svg);
    background-size: cover;
    width: 250px;
    height: 255px;
    border-radius: 0;
    border: none;
    padding: 1rem 0;
    left: 0;
    margin-left: auto;
    right: 0;
    margin-right: auto;
    }
      .bv-financing-tech-image {
    display: none;
  }
}

/* ========================================
   SMALL MOBILE (max-width: 450px)
   ======================================== */
@media (max-width: 450px) {

.badge.rounded-pill.px-4.py-2.bg-info.mb-3 {
    /* Your styles here */
    margin-top: 20px;
}
.py-5{
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}
.row.justify-content-center.mt-5.py-5 {
    margin-top: 0rem !important;
    margin-bottom: .7rem !important;
}
/* Additional mobile-specific styles can be added here */
.bv-hero-padding {
    padding-top: 12rem;
    padding-bottom: 3rem;
}
}