/* ===========================
   HVAC / Front Page — clean CSS
   Scope expanded to .front-page and .home
   =========================== */

/* Scope + theme vars */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) { --theme-blue: #0d6bf7;
}

/* Spacing helpers */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .section-pad { padding: 60px 0; }
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .section-pad { padding: 40px 0; }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .section-pad { padding: 28px 0; }
}

/* Section titles (H2-like titles only by class) */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .section-title,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__title,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq .section-title{
  font-size: clamp(24px, 4vw, 38px);
  line-height: 1.2;
  margin: 0 0 32px;
  text-align: left;
}
@media (min-width: 992px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .section-title,
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__title,
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq .section-title{
    margin-bottom: 60px;
  }
}

/* H3 sizing only in content sections (does not touch right banners) */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-title,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-title,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-title{
  font-size: clamp(18px, 2.4vw, 24px);
  line-height: 1.25;
}

/* ===========================
   Text + Image hero
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .text h1{
  font-size: clamp(28px, 4.8vw, 44px);
  line-height: 1.15;
  margin: 0 0 12px;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .grid{
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 24px;
  align-items: center;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero.image-left .media{ order:1; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero.image-left .text{ order:2; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero.image-right .text{ order:1; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero.image-right .media{ order:2; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .media img{
  width:100%; height:auto; display:block; border-radius:12px;
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .grid{ grid-template-columns:1fr; }
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .media{ order:1; }
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .hvac-hero .text{ order:2; }
}

/* ===========================
   Why Choose
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose{
  background:#BFE7FB; padding:48px 0; border-radius:12px;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__title{ text-align:center; margin:0 0 12px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__intro{
  max-width:980px; margin:0 auto 28px; text-align:center;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__features{
  display:grid; grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap:14px 24px; list-style:none; padding:0; margin:0 auto; width:60%; justify-items:start;
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__features{ grid-template-columns:1fr; width:100%; }
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__item{ display:flex; align-items:flex-start; gap:10px; text-align:left; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__item.is-full{ grid-column:1 / -1; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__icon svg{ width:22px; height:22px; display:block; fill:#13A3CE; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .why-choose__text{ line-height:1.45; }

/* ===========================
   Our Services
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services{ background:#BFE7FB; border-radius:12px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .section-title{ text-align:center; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services-grid{
  list-style:none; padding:0; margin:16px 0 0;
  display:grid; gap:28px; grid-template-columns: repeat(3, 1fr);
}
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services-grid{ grid-template-columns: 1fr; }
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-card{ display:flex; flex-direction:column; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-title{ text-align:left; margin:0 0 12px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-media{ margin:0 0 14px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-img{ width:100%; height:auto; display:block; border-radius:8px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-desc{ margin:0 0 16px; line-height:1.5; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .service-cta{ margin-top:auto; }

/* ===========================
   Cards x3 (grey boxes)
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-grid{
  list-style:none; margin:0; padding:0;
  display:grid; gap:24px; grid-template-columns:repeat(3, minmax(0,1fr)); align-items:stretch;
}
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-grid{ grid-template-columns:1fr; }
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-card{
  background:#F2F5F7; border:1px solid #E5EDF3; border-radius:12px; padding:24px;
  display:flex; flex-direction:column; height:100%;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-icon img{ width:40px; height:auto; display:block; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-title{ margin:12px 0 10px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-text{ margin:0 0 16px; line-height:1.55; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3-link{ margin-top:auto; display:flex; justify-content:flex-end; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3 .link-more{ font-weight:600; text-decoration:none; transition:color .15s ease; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cards3 .link-more:hover{ color:var(--theme-blue) !important; }

/* ===========================
   FAQ
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq .section-title{ text-align:center; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:12px 48px;
}
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-grid{ gap:10px 28px; }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-grid{ grid-template-columns:1fr; }
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-item{ border-bottom:1px solid #e6eef5; padding:12px 0; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-item summary{
  list-style:none; display:flex; align-items:center; gap:10px; cursor:pointer; font-weight:700;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-item summary::-webkit-details-marker{ display:none; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-item .chev svg{ display:block; transform:rotate(0deg); transition:transform .2s ease; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-item[open] .chev svg{ transform:rotate(90deg); }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq-answer{ margin-top:8px; line-height:1.55; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .faq .faq-subtitle{
  text-align:center; max-width:860px; margin:-8px auto 20px; font-weight:700;
}

/* ===========================
   Blog
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed > .container{ width:100%; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-grid{
  list-style:none; padding:0; margin:16px 0 32px;
  display:grid; gap:24px; grid-template-columns:repeat(3, minmax(0,1fr));
}
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-grid{ grid-template-columns:1fr; }
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-card{
  display:flex; flex-direction:column; background:#fff; border:1px solid #e8eef3; border-radius:12px; overflow:hidden;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-thumb img{ display:block; width:100%; height:auto; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-title{ font-size:clamp(18px, 2.4vw, 24px); line-height:1.25; margin:14px 16px 8px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-title a{ text-decoration:none; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-excerpt{ margin:0 16px 16px; line-height:1.55; color:#38464f; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-cta{ margin-top:auto; padding:14px 16px; border-top:1px solid #e8eef3; display:flex; justify-content:flex-end; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed .link-more{ font-weight:600; text-decoration:none; transition:color .15s ease; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed .link-more:hover{ color:var(--theme-blue) !important; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-more{ display:flex; justify-content:center; margin-top:0; }

/* ===========================
   CTA Band (full width bg)
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band{ --band-bg:#c94955; background:var(--band-bg); color:#fff; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band__title{
  margin:0 0 8px; text-transform:uppercase; font-weight:800; letter-spacing:.02em;
  font-size:1.8em; line-height:1.15; color:#fff;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band__sub{ margin:0 0 6px; opacity:.95; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band__note{ margin:0; opacity:.8; font-size:.9rem; }
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band.section-pad{ padding:40px 0; }
@media (max-width:1024px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band.section-pad{ padding:32px 0; }
}
@media (max-width:767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .cta-band.section-pad{ padding:20px 0; }
}

/* ===========================
   Buttons (base) + fixes
   =========================== */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .btn{
  display:inline-block; padding:12px 20px; border-radius:6px; text-decoration:none; font-weight:700;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .btn-primary{
  border: none !important; outline:none !important; box-shadow:none !important;
}
/* Color for Schedule Service and View All */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .btn-primary{
  background-color:#029cdd; border-color:#029cdd; color:#fff;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed #blogAjaxBtn{
  background-color:#029cdd; border-color:#029cdd; color:#fff;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .btn-ghost-white{
  padding:10px 18px; border:2px solid #fff; color:#fff;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .btn-ghost-white:hover{ background:#fff; color:#1b6fa6; }



/* New left slider (ns-*) */
.ns-slider{
  position:relative; overflow:hidden; border-radius:12px; min-height:360px;
}
@media (max-width:991px){
  .ns-slider{ min-height:320px; }
}
.ns-slides{ position:relative; min-height:inherit; }
.ns-slide{
  position:absolute; inset:0;
  opacity:0; transition:opacity .5s ease;
  background-size:cover; background-position:center; background-repeat:no-repeat;
  background-color:#000;
}
.ns-slide.is-active{ opacity:1; }
.ns-overlay{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; padding:24px; text-align:center; color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.45);
}
.ns-title{
  margin:0; font-weight:800; letter-spacing:.02em; text-transform:uppercase;
  font-size:clamp(24px,3.8vw,42px); line-height:1.1;
}
.ns-desc{
  margin:0; font-size:clamp(15px,2vw,18px); line-height:1.45; max-width:820px;
}
.ns-btn{ font-weight:700; }

/* dots */
.ns-dots{
  position:absolute; right:14px; bottom:14px; display:flex; gap:8px; z-index:5;
}
.ns-dot{
  width:8px; height:8px; border-radius:2px; background:rgba(255,255,255,.55);
  border:none; padding:0; cursor:pointer; transition:all .2s ease;
}
.ns-dot.is-active{ width:18px; background:#fff; }

/* Make left slider match right banners height on desktop */
@media (min-width: 992px){
  .hm-banner .row{ align-items: stretch; }
  .hm-banner-left{ display: flex; }
  .hm-banner-left .ns-slider{
    flex: 1 1 auto;
    height: 100%;
    min-height: 100%;
    width: 100%;
    border-radius: 12px;
  }
  .hm-banner-left .ns-slides{
    height: 100%;
    min-height: 100%;
  }
}
@media (max-width: 991.98px){
  .hm-banner-left .ns-slider{
    height: auto;
    min-height: 320px;
  }
}

/* Force white title/desc in custom slider */
.hm-banner-left .ns-slider .ns-title{ color:#fff !important; text-shadow:0 2px 8px rgba(0,0,0,.45); }
.hm-banner-left .ns-slider .ns-desc{ color:#fff !important; }

/* Round right banners only on this page (ID 2300) */
body.page-id-2300 .hm-banner-right .banner-box,
body.page-id-2300 .hm-banner-right .hbr-left-in,
body.page-id-2300 .hm-banner-right .blue-box.banner-box-grid,
body.page-id-2300 .hm-banner-right .red-box.banner-box-grid{
  border-radius:12px !important;
  overflow:hidden;
}
body.page-id-2300 .hm-banner-right .hbr-left-in > img{
  display:block;
  width:100%;
  height:auto;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
}

/* Fix hover blocked by hidden slides */
.ns-slide{ pointer-events:none; }
.ns-slide.is-active{ pointer-events:auto; z-index:2; }

/* Remove text shadow on slider button text */
.hm-banner-left .ns-slider .ns-btn{ text-shadow:none !important; }

/* Add subtle hover for "Schedule Service" and "VIEW ALL" */
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .btn-primary,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed #blogAjaxBtn{
  background-color:#029cdd;
  border-color:#029cdd;
  color:#fff;
  transition: background-color .2s ease, border-color .2s ease;
}
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .btn-primary:hover,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .btn-primary:focus,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed #blogAjaxBtn:hover,
body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .blog-feed #blogAjaxBtn:focus{
  background-color:#018fc9;
  border-color:#018fc9;
  color:#fff;
}

@media (max-width: 767px){
  body:is(.page-template-hvac-installation, .page-template-hvac-installation-php, .front-page, .home) .services .service-cta{
    display: flex;
    justify-content: center;
    text-align: center;
    margin-bottom: 20px;
  }
}


