/* === Red Barn Media Group - Custom Styles - SGT Paul === */

/* ========================================
   HOME HERO STYLES
   ======================================== */
/* * {
  outline: 1px solid red;
  } */
.sgt-paul-hero-intro {
  margin-top: 117px;
  width: 100%;
  height: 600px;
  background: #eef6ff;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 0;
}

.sgt-paul-hero-intro h1 {
  font-size: 3.5rem;
  line-height: 1;
  font-style: normal;
}

.sgt-paul-hero-intro h2 {
  font-size: 1.5rem;
}

.sgt-paul-hero-intro.sub-page h1 {
  font-size: 2.5rem;
  line-height: 1;
}

.sgt-paul-hero-intro.sub-page h2 {
  font-size: 1.25rem;
}


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

/* Logo Row Borders */
.logo-row .border-end {
  border-width: 2px !important;
  padding-right: 0.75rem !important;
  margin-right: 0.75rem !important;
}

/* Background Images */
.sgtp-bg-intro-rollover {
  background: url(../img/sgtp-intro-rollover-600-429.webp) center center;
  background-size: cover;
  width: 600px;
  height: 100%;
  min-height: 500px;
}

.sgtp-bg-expert-solutions {
  background: url(../img/sgtp-solutions-bg-1800-877.webp) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 650px;
}

.sgtp-bg-why-choose {
  background: url(../img/sgtp-why-choose-bg-1800-1085.svg) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 900px;
}

.sgtp-bg-why-choose-flipped {
  background: url(../img/sgtp-flipped-why-choose-bg-1800-1085.svg) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 900px;
}

.sgtp-van-lower {
  position: absolute;
  bottom: -100px;
  right: 0;
  width: 100%;
  z-index: 10 !important;
}

.sgtp-bg-review-testimonial {
  background: url(../img/sgtp-review-bg-1800-486.webp) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 400px;
}

.sgtp-bg-salute {
  background: url(../img/sgtp-salute-card-450-213.svg) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 210px;
}

.sgtp-bg-veteran-discount-banner {
  background: url(../img/sgtp-discount-bg-1800-413.svg) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 400px;
}

.sgtp-bg-lets-get-started {
  background: url(../img/sgtp-get-started-bg-1800-749.webp) center center;
  background-size: cover;
  width: 100%;
  height: fit-content;
  min-height: 600px;
}


/* ========================================
   NAV PILLS STYLES
   ======================================== */

.nav-pills {
  gap: 0 !important;
}

.nav-pills .nav-item {
  padding: 0 !important;
}

.nav-pills .nav-link {
  background-color: #05163a !important;
  border: 2px solid #ffffff;
  color: #ffffff;
  border-radius: 0;
  padding: 1.5rem 1rem;
  text-align: center;
  transition: all 0.3s ease;
  margin: 0;
  min-height: 120px;
  width: 180px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
}

.col-12.col-lg-5 .nav-pills .nav-item {
  display: flex !important;
}

.nav-pills .sub-nav-pill {
  width: 100% !important;
  align-self: stretch;
}

.nav-pills .nav-link:hover {
  background-color: rgba(243, 209, 80, 0.1) !important;
  border-color: #f3d150 !important;
}

.nav-pills .nav-link.active {
  background-color: #f3d150 !important;
  border-color: #f3d150 !important;
  color: #000000 !important;
}

.nav-pills .nav-link.active .fa-stack .fa-circle {
  color: #000000 !important;
}

.nav-pills .nav-link.active .fa-stack .fa-stack-1x {
  color: #f3d150 !important;
}

.nav-pills .nav-link:not(.active) .fa-stack .fa-circle {
  color: #ffffff !important;
}

.nav-pills .nav-link:not(.active) .fa-stack .fa-stack-1x {
  color: #05163a !important;
}


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

.sgtp-accordion-button {
  background-color: #2547a0 !important;
}

.sgtp-accordion-fill .accordion-collapse {
  background-color: #2547a0 !important;
}

/* Custom Accordion - Remove default caret and add custom icon */
.col-12.col-lg-6.bg-white.rounded-end .p-5 .accordion .accordion-button::after {
  display: none !important;
}

.col-12.col-lg-6.bg-white.rounded-end .p-5 .accordion .accordion-button i {
  transition: all 0.3s ease;
  font-size: 1.25rem;
}

.col-12.col-lg-6.bg-white.rounded-end .p-5 .accordion .accordion-button.collapsed i {
  color: #ffffff !important;
}

.col-12.col-lg-6.bg-white.rounded-end .p-5 .accordion .accordion-button:not(.collapsed) i {
  color: #f3d150 !important;
}

/* FAQ Accordion Styles */
.accordion .accordion-button::after {
  display: none !important;
}

.accordion .accordion-button {
  position: relative;
  padding-right: 3rem;
}

.accordion .accordion-button i.fa-arrow-down-right {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s ease;
  font-size: 1.2rem;
}

.accordion .accordion-button:not(.collapsed) i.fa-arrow-down-right {
  transform: translateY(-50%) rotate(45deg) !important;
}

.accordion .accordion-button.collapsed i.fa-arrow-down-right {
  transform: translateY(-50%) rotate(0deg) !important;
}


  .sgt-paul-hero-intro {
    background: url(../img/sgtp-intro-hero-xxl-1800-580.webp) right center;
    width: 100%;
    height: 600px;
    background-size: cover;
  }

  .sgt-paul-hero-intro.sub.ac {
    background: url(../img/sgtp-ac-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 600px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.commercial {
    background: url(../img/sgtp-commercial-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.package {
    background: url(../img/sgtp-package-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.furnace {
    background: url(../img/sgtp-furnace-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.ms {
    background: url(../img/sgtp-ms-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
     .sgt-paul-hero-intro.sub.mob {
    background: url(../img/sgtp-mob-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
     .sgt-paul-hero-intro.sub.tankless {
    background: url(../img/sgtp-tankless-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
      .sgt-paul-hero-intro.sub.tank {
    background: url(../img/sgtp-tank-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
      .sgt-paul-hero-intro.sub.insulation {
    background: url(../img/sgtp-insulation-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
      .sgt-paul-hero-intro.sub.iaq {
    background: url(../img/sgtp-iaq-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
      .sgt-paul-hero-intro.sub.generator {
    background: url(../img/sgtp-generator-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
        .sgt-paul-hero-intro.sub.gas {
    background: url(../img/sgtp-gas-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
/* ========================================
   MEDIA QUERIES
   ======================================== */

/* 2000px and below */
@media (max-width: 2000px) {
  .sgt-paul-hero-intro h1 {
    font-size: 3.25rem;
  }

  .sgt-paul-hero-intro {
    background: url(../img/sgtp-intro-hero-xxl-1800-580.webp) right center;
    width: 100%;
    height: 600px;
    background-size: cover;
  }

  .sgt-paul-hero-intro.sub.ac {
    background: url(../img/sgtp-ac-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 600px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.commercial {
    background: url(../img/sgtp-commercial-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
    .sgt-paul-hero-intro.sub.package {
    background: url(../img/sgtp-package-sub-hero-1825-588.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
}

/* 1600px and below */
@media (max-width: 1600px) {
  .sgt-paul-hero-intro {
    margin-top: 117px;
  }

  .sgt-paul-hero-intro h1 {
    font-size: 2.5rem;
  }

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

  .sgt-paul-hero-intro {
    background: url(../img/sgtp-intro-hero-xxl-1800-580.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }

  .sgt-paul-hero-intro.ac {
    background: url(../img/sgtp-ac-sub-hero-1400-580.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
}

/* 1400px and below */
@media (max-width: 1400px) {
  .sgt-paul-hero-intro {
    margin-top: 117px;
    width: 100%;
    height: 580px;
    background: url(../img/sgtp-intro-hero-xxl-1800-580.webp) right center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 0;
  }
    .sgt-paul-hero-intro.ac {
    background: url(../img/sgtp-ac-sub-hero-1400-580.webp) left center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }
}

/* 1200px and below */
@media (max-width: 1200px) {
  .sgt-paul-hero-intro {
    margin-top: 117px;
    width: 100%;
    height: fit-content;
    padding-top: 4rem;
    padding-bottom: 6rem;
    background: linear-gradient(135deg, #1748a6 0%, #0d367c 50%, #04214f 100%);
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 0;
  }

  .sgt-paul-hero-intro.ac {
    background: url(../img/sgtp-ac-sub-hero-1200-580.webp) right center;
    width: 100%;
    height: 580px;
    background-size: cover;
  }

  .sgtp-bg-veteran-discount-banner {
    background: url(../img/sgtp-discount-bg-1200-413.svg) center center;
    background-size: cover;
  }

  .sgtp-bg-intro-rollover {
    background: url(../img/sgtp-intro-rollover-600-429.webp) center center;
    background-size: cover;
    width: 600px;
    height: 100%;
  }

  .sgtp-bg-expert-solutions {
    background: url(../img/sgtp-solutions-bg-1400-682.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 650px;
  }

  .sgtp-bg-why-choose {
    background: url(../img/sgtp-why-choose-bg-1400-844.svg) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 700px;
  }

  .sgtp-bg-why-choose-flipped {
    background: url(../img/sgtp-flipped-why-choose-bg-1400-844.svg) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 700px;
  }

  .sgtp-bg-lets-get-started {
    background: url(../img/sgtp-get-started-bg-1200-499.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 500px;
  }
}

/* 991px and below */
@media (max-width: 991px) {
  .sgt-paul-hero-intro.sub {
    background: linear-gradient(135deg, #1748a6 0%, #0d367c 50%, #04214f 100%) !important;
    width: 100%;
    height: fit-content !important;
    background-size: cover;
  }

  .sgt-paul-hero-intro.ac {
    background: linear-gradient(135deg, #1748a6 0%, #0d367c 50%, #04214f 100%) !important;
    width: 100%;
    height: fit-content !important;
    background-size: cover;
  }

  .sgtp-bg-veteran-discount-banner {
    background: url(../img/sgtp-discount-bg-991-413.svg) center center;
    background-size: cover;
  }

  .sgtp-bg-intro-rollover {
    background: url(../img/sgtp-intro-rollover-450-321.webp) center center;
    background-size: cover;
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
  }

  .sgtp-bg-expert-solutions {
    background: url(../img/sgtp-solutions-bg-991-483.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 450px;
  }

  .sgtp-bg-why-choose {
    background: url(../img/sgtp-why-choose-bg-991-597.svg) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 500px;
  }

  .sgtp-bg-why-choose-flipped {
    background: url(../img/sgtp-flipped-why-choose-bg-991-597.svg) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 500px;
  }

  .sgtp-bg-lets-get-started {
    background: url(../img/sgtp-get-started-bg-991-412.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 400px;
  }
}

/* 767px and below */
@media (max-width: 767px) {
  .sgt-paul-hero-intro {
    margin-top: 117px;
    width: 100%;
    height: fit-content;
    padding-top: 4rem;
    padding-bottom: 6rem;
    background: linear-gradient(135deg, #1748a6 0%, #0d367c 50%, #04214f 100%);
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 0;
  }

  .sgt-paul-hero-intro.ac {
    margin-top: 117px;
    width: 100%;
    height: fit-content;
    padding-top: 4rem;
    padding-bottom: 6rem;
    background: linear-gradient(135deg, #1748a6 0%, #0d367c 50%, #04214f 100%);
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 0;
  }

  .sgtp-bg-veteran-discount-banner {
    background: url(../img/sgtp-discount-bg-767-413.svg) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 400px;
  }

  .sgtp-bg-intro-rollover {
    background: url(../img/sgtp-intro-rollover-350-250.webp) center center;
    background-size: cover;
    width: 350px;
    height: 250px;
    min-width: 0;
    min-height: 0;
  }

  .sgtp-bg-expert-solutions {
    background: url(../img/sgtp-solutions-bg-767-374.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 350px;
  }

  .sgtp-bg-why-choose {
     background: #2547a0;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 400px;
  }

  .sgtp-bg-why-choose-flipped {
    background: #2547a0;
    background-size: cover;
    width: 100%;
    height: fit-content !important;
    min-height: 400px;
  }

  /* Layout reordering for nav pills and bg-primary-dark div */
  .col-12.col-lg-5 {
    display: flex;
    flex-direction: column;
  }

  .col-12.col-lg-5 .bg-primary-dark.rounded {
    order: 1;
    margin-bottom: 2rem!important;
  }
.col-12.col-lg-5 .bg-primary-dark {
    order: 1;
    margin-bottom: 2rem!important;
  }
  .col-12.col-lg-5 .nav-pills {
    order: 2;
  }

  /* Mobile-specific nav pills styling */
  .nav-pills .nav-link {
    height: 100% !important;
    width: 100% !important;
  }
  .home-nav-pills {
    min-width: 160px !important;
  }
  .sgtp-bg-review-testimonial {
    background: url(../img/sgtp-review-bg-991-417.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 400px;
  }

  .sgtp-bg-lets-get-started {
    background: url(../img/sgtp-get-started-bg-991-412.webp) center center;
    background-size: cover;
    width: 100%;
    height: fit-content;
    min-height: 400px;
  }

  /* Badge row responsive layout */
  .d-flex.align-items-center.mb-3 {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .d-flex.align-items-center.mb-3 .badge {
    margin-right: 0 !important;
    flex: 0 0 calc(50% - 0.25rem);
    text-align: center;
    justify-content: center;
    display: flex;
    align-items: center;
  }

  .d-flex.align-items-center.mb-3 .badge:nth-child(3) {
    flex: 0 0 100%;
    margin-top: 0.5rem;
  }
  .btn{
    margin-bottom: .5rem;
  }
}