:root {
  --kb-header-height: 149px;
}

.gallery-products .splide__track,
.gallery-products .splide__list {
  height: 300px;
}

.gallery-logos .splide__track,
.gallery-logos .splide__list {
  height: 120px;
}

.kb-advanced-slider-wrap { background-color: #1a1a1a; }

/* =============================================================
   Doodlebuggers — Kadence Migration: Additional CSS
   Migrated from: hugyourhome.com (custom Divi child theme)
   
   HOW THIS WORKS:
   - The "Free Online Estimate" floating button HTML is injected
     site-wide via Kadence Hooked Elements (HTML Editor element),
     hooked to wp_footer. Manage it at:
     Appearance > Kadence > Elements
   - The CSS below styles that button on desktop and mobile.
   ============================================================= */

/* Target first item in utility nav only */
.utility-nav .kb-navigation > li:first-child .kb-nav-link-content {
    /* background-color: #09A144; */
}

/* Force "Swap" behavior for your specific fonts */
@font-face {
  font-family: 'Lato';
  font-display: swap;
  src: inherit;
}
@font-face {
  font-family: 'Josefin Sans';
  font-display: swap;
  src: inherit;
}

/* Standardize full-width cover image heights across pages, anchored to bottom */
figure.wp-block-image.alignfull.size-full img {
    width: 100%;
    aspect-ratio: 2000 / 347;
    height: auto;
    object-fit: cover;
    object-position: bottom;
}

.single-content h1, .single-content h2, .single-content h3, .single-content h4, .single-content h5, .single-content h6 {
    margin: 0.5em 0 !important;
}

figure.wp-block-image.alignfull.size-full {
    margin-bottom: 0;
}

h2 {
	line-height: 1.1em;
}

.fix-btn-icon a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.btn-phone:hover .kt-btn-inner-text {
	font-weight: bold;
  text-decoration: underline;
}

.wp-block-kadence-navigation .sub-menu a:hover {
  text-decoration: underline;
}

.slide-top .kb-slide-bg {
  background-position: center top !important;
}

.kb-header-container.kb-header-sticky-wrapper { 
  position: fixed !important; 
  width: 100% !important; 
}

/* 1. Hide the Middle Row logo strictly on Mobile (screens 767px and smaller) */
@media (max-width: 767px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* 2. Hide the Top Row logo on Tablet AND Desktop (screens 768px and larger) */
@media (min-width: 768px) {
  .hide-on-tablet {
    display: none !important;
  }
}

/* 1. Target the button directly and adjust the column sizes */
.kt-button.align-icon-left {
    display: grid !important;
    /* Reduced the side columns to 24px to give more room to the middle text column (1fr) */
    grid-template-columns: 24px 1fr 24px !important; 
    align-items: center !important;
    /* Reduced the internal button padding from 20px down to 10px so the text can stretch closer to the edges */
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* 2. Lock the icon to the left zone */
.kt-button.align-icon-left .kt-btn-svg-icon {
    grid-column: 1 !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: flex-start !important;
}

/* 3. Lock the text perfectly in the center zone */
.kt-button.align-icon-left .kt-button-text {
    grid-column: 2 !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 !important;
    /* Optional: Ensure the text itself isn't carrying extra padding that forces it to wrap */
    padding: 0 !important; 
}

.kb-search15561_8c1535-3a .kb-search-icon-submit, .kb-search15561_9648cb-b4 .kb-search-icon-submit {
    padding-left: 10px !important;
    padding-right: 10px !important;
    right: 0 !important;
}

@media (max-width: 1024px) {
  .wp-block-kadence-header-row-center .wp-block-kadence-header-column-tablet-left {
    flex-shrink: 0 !important;
    flex-basis: auto !important;
  }

  .hide-on-mobile .wp-block-site-logo img {
    width: 210px !important;
    min-width: 210px !important;
    max-width: 210px !important;
  }

  .wp-block-kadence-header-row-center .wp-block-kadence-header-column-tablet-center {
    flex-shrink: 1 !important;
    flex-basis: auto !important;
    min-width: 0 !important;
  }
}

@media (max-width: 767px) {
  .wp-block-kadence-header-column-tablet-center .kt-btn-width-type-fixed {
    width: auto !important;
  }
}

/* prevents headings from wrapping around images in posts */

.entry-content h2, .entry-content h3, .entry-content h4 {
    clear: both;
	  margin-top: 0.5em
}

.entry-content .wp-block-list {
    overflow: hidden;
}

.single .content-area {
    padding-top: 1.5rem !important;
}

/* prevents gap below nav except where needed */

.content-area {
    margin-top: 0;
}

.home #primary {
    margin-top: 1.5rem;
}

.single .entry-content .wp-block-image figure.alignright img,
.single .entry-content .wp-block-image figure.alignleft img {
    width: 300px !important;
    height: 300px !important;
    object-fit: cover !important;
}

@media (max-width: 767px) {
  .entry-content figure.alignright,
  .entry-content figure.alignleft {
    float: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .entry-content figure.alignright img,
  .entry-content figure.alignleft img {
    width: 100% !important;
    height: auto !important;
    max-height: 300px !important;
    object-fit: cover !important;
  }
}

/* ============================================================
   GALLERY STYLES — Doodlebuggers Kadence Migration
   Add to: Kadence > Customizer > General > Custom CSS
   ============================================================ */

/* 1px light grey outline matching original FooGallery style */
.wp-block-gallery .wp-block-image img {
  box-shadow: 0 0 0 1px #ddd;
}

/* Hover effect — fade in dark overlay on thumbnail */
.wp-block-gallery .wp-block-image {
  position: relative;
  overflow: hidden;
}

.wp-block-gallery .wp-block-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: background 0.35s ease;
  pointer-events: none;
  z-index: 1;
}

.wp-block-gallery .wp-block-image:hover::after {
  background: rgba(0, 0, 0, 0.35);
}

/* Partial last row — prevent images stretching to fill the grid.
   In a 3-column flex gallery, a partial last row has either:
   - 1 image: it sits at position 3n+1 and is :last-child
   - 2 images: first sits at 3n+1 (:nth-last-child(2)), second at 3n+2 (:last-child)
   flex-grow:0 stops expansion; max-width pins to one column width. */

/* 1 image in last row */
.wp-block-gallery.columns-3 .wp-block-image:last-child:nth-child(3n + 1) {
  flex-grow: 0;
  max-width: calc(33.33% - 6px);
}

/* 2 images in last row — first of the two (at position 3n+1) */
.wp-block-gallery.columns-3 .wp-block-image:nth-last-child(2):nth-child(3n + 1) {
  flex-grow: 0;
  max-width: calc(33.33% - 6px);
}

/* 2 images in last row — second of the two (at position 3n+2) */
.wp-block-gallery.columns-3 .wp-block-image:last-child:nth-child(3n + 2) {
  flex-grow: 0;
  max-width: calc(33.33% - 6px);
}

/* =========================================
   Yoast FAQ Block
   ========================================= */

.schema-faq-question {
  display: block;
  font-family: 'Josefin Sans', sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0;
  color: #189a36;
  clear: none;
}

@media (min-width: 768px) {
  .schema-faq-question { font-size: 22px; }
}

@media (min-width: 1025px) {
  .schema-faq-question { font-size: 24px; }
}

/* Single source of truth: all spacing above each question */
.single-content .schema-faq-section,
.wp-block-yoast-faq-block .schema-faq-section {
  margin-top: 36px !important;
  margin-bottom: 0 !important;
}

/* First question on the page: no top gap */
.wp-block-yoast-faq-block:first-of-type .schema-faq-section:first-child {
  margin-top: 0 !important;
}

/* Override Kadence specificity for Q margin */
.single-content .wp-block-yoast-faq-block .schema-faq-question {
  margin-top: 0 !important;
  margin-bottom: 2px !important;
}

/* Answer */
.schema-faq-answer {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* FAQ blocks: zero own margins so they never add to spacing */
.single-content .wp-block-yoast-faq-block,
.wp-block-yoast-faq-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Images between FAQ blocks: collapse wrapper, zero its margins */
.wp-block-yoast-faq-block + .wp-block-image {
  overflow: visible;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Block after image: also zero top margin */
.wp-block-image + .wp-block-yoast-faq-block {
  margin-top: 0 !important;
}

/* =============================================================
   Free Online Estimate — Floating Button
   HTML is injected site-wide via Kadence Hooked Elements
   (HTML Editor element, hooked to wp_footer).
   Manage the HTML at: Appearance > Kadence > Elements
   ============================================================= */

/* Desktop */
.side-buttons a {
  background: rgb(13, 190, 210);
  color: white;
  font-weight: 700;
  position: fixed;
  bottom: 80px;
  right: 1%;
  padding: 1%;
  font-size: 18px;
  border-style: solid;
  border-width: 1px 0px 1px 1px;
  border-color: rgb(30, 107, 82);
  z-index: 9999 !important;
}

.side-buttons a:hover,
.side-buttons a:active {
  background: rgb(30, 107, 82);
  transition: background 1s linear;
}

/* Mobile (max-width: 768px) */
@media only screen and (max-width: 768px) {
  .side-buttons a {
    background: rgb(13, 190, 210);
    color: white;
    font-weight: 700;
    position: fixed;
    bottom: 80px;
    right: 1%;
    padding: 2%;
    font-size: 18px;
    border: 1px solid rgb(30, 107, 82);
    border-radius: 100px;
    margin-bottom: 0;
    z-index: 9999 !important;
  }
}

/* -----------------------------------------------
   Home hero blue section — bottom alignment fix
   Row Layout: home-hero-row
   Right column: home-hero-right-col
   ----------------------------------------------- */
@media (min-width: 1025px) {
  .home-hero-right-col .kt-inside-inner-col {
    min-height: unset !important;
    padding-bottom: 24px !important;
  }
  .home-hero-right-col .kt-inside-inner-col > p,
  .home-hero-right-col .kt-inside-inner-col .wp-block-kadence-advancedheading {
    max-width: 100% !important;
  }
  .home-hero-slide-1 h1.wp-block-heading {
    font-size: 40px !important;
    line-height: 44px !important;
    font-weight: 500 !important;
  }
}
@media (max-width: 1024px) {
  .home-hero-row .kt-row-column-wrap {
    min-height: unset !important;
  }
  .home-hero-right-col .kt-inside-inner-col {
    min-height: unset !important;
    padding-bottom: 24px !important;
    padding-right: 16px !important;
  }
  .home-hero-slider .kb-advanced-slide-inner-wrap {
    padding-left: 24px !important;
    padding-right: 24px !important;
    background-size: cover !important;
    background-position: center center !important;
  }
}
.home-hero-slider .kb-advanced-slide h2.wp-block-kadence-advancedheading {
  max-width: 100% !important;
}
@media (max-width: 1024px) and (min-width: 768px) {
  .home-hero-slide-1 h1.wp-block-heading {
    font-size: 30px !important;
    line-height: 33px !important;
  }
  .home-hero-right-col .kt-inside-inner-col > p,
  .home-hero-right-col .kt-inside-inner-col .wp-block-kadence-advancedheading {
    max-width: 100% !important;
  }
  .home-hero-slider .kb-advanced-slide {
    flex: 1 !important;
  }
}
@media (max-width: 767px) {
  .home-hero-slide-1 h1.wp-block-heading {
    font-size: 30px !important;
    line-height: 33px !important;
  }
  .home-hero-slider p {
    font-size: 18px !important;
    line-height: 22px !important;
  }
  .home-hero-slider .kb-advanced-slide-inner-wrap {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .home-hero-right-col .kt-inside-inner-col {
    padding-bottom: 24px !important;
  }
}

/* Fixes Kadence Advanced Header sticky */
.kb-header-container.kb-header-sticky-wrapper {
  position: fixed !important;
  width: 100% !important;
}

/* Prevent content jump on desktop load */
@media (min-width: 1025px) {
  .kb-header-placeholder-wrapper {
    min-height: 149px;
  }
}

/* Prevent transparent flash before JS fires on load */
.header-desktop-sticky .kb-header-container.item-at-start {
  background: #fff;
}