/*!
Theme Name: Kadence Child
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: A child theme for the Kadence Theme.
Version: 1.0.0
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* Theme customization starts here
-------------------------------------------------------------- */
/* ==========================================================================
   TABLE OF CONTENTS
   ==========================================================================
   01. GLOBAL
       1.1 General Styles
       1.2 Get In Touch Footer
   02. HOME
       2.1 Typography & Headings
       2.2 Hero Section
       2.3 Value Prop Gallery
       2.4 Culinary Section
       2.5 Remodeled Section
       2.6 Slide Drawer Form
   03. INDEPENDENT LIVING
       3.1 Independent Living Hero & Layout
       3.2 Independent Table
   04. SHARED SECTIONS
       4.1 CTA Curve Banner
       4.2 Thrive Section & Slider
       4.3 Services
       4.4 Contact Us
       4.5 Culinary
       4.6 Cost Calculator
       4.7 Floor Plans & Pricing
       4.8 Photo Gallery & 3D Tour
   05. BLOG
       5.1 Blog Archive
       5.2 Blog Single
   ========================================================================== */


/* ==========================================================================
   01. GLOBAL
   ========================================================================== */

/* --------------------------------------------------------------------------
   1.1 GENERAL STYLES
   -------------------------------------------------------------------------- */
.buttons-curve .kb-button {
  border-radius: 26px 0 74px 26px;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.full-width-no-padding .kt-row-column-wrap {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
@media (min-width: 1760px) {
  .xl-breakpoint-spacer.wp-block-kadence-spacer .kt-block-spacer {
    height: 600px !important;
  }
}

/* --------------------------------------------------------------------------
   1.2 GET IN TOUCH FOOTER
   -------------------------------------------------------------------------- */
.get-in-touch-footer {
  position: relative;
  background-image: none !important; 
  overflow: visible !important;
}

.get-in-touch-footer::after {
  content: "";
  position: absolute;
  /* Pins it to the bottom of the row */
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%; /* Adjust this if you only want the curve at the bottom */
  
  /* The Image Settings */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/bottom-curve-blur.png') !important;
  background-size: contain !important;
  background-position: bottom center !important;
  background-repeat: no-repeat !important;

  /* The Stacking Magic */
  z-index: 90 !important; /* Forces it to the very front */
  pointer-events: none;   /* Makes the image 'invisible' to mouse clicks */
}

.kb-submit-field .form-contact-btn.kb-button.kb-adv-form-submit-button {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  background: var(--global-palette-btn-bg, #3633e1) !important;
}
.kb-submit-field .form-contact-btn.kb-button.kb-adv-form-submit-button:hover {
  color: var(--global-palette-btn-hover, #ffffff) !important;
  background: var(--global-palette-btn-bg-hover, #2f2ffc) !important;
}


/* ==========================================================================
   02. HOME
   ========================================================================== */

/* --------------------------------------------------------------------------
   2.1 TYPOGRAPHY & HEADINGS
   -------------------------------------------------------------------------- */
.hero-h1 mark.kt-highlight {
  display: inline-block;
  text-shadow: -3px 8px 6.4px rgba(0, 0, 0, 0.26);
  transform: rotate(-11.828deg) scaleX(1.5) translateY(-10px) translateX(-3px);
}

@media (max-width: 768px) {
  .hero-h1 mark.kt-highlight {
    position: relative;
    top: 5px;
    left: 5px; 
  }
}

.il-h2 mark.kt-highlight {
  display: inline-block;
  text-shadow: -3px 8px 6.4px rgba(0, 0, 0, 0.26);
  transform: rotate(-11.828deg) scaleX(1.5) translateY(-10px) translateX(-3px);
}

@media (max-width: 768px) {
  .il-h2 mark.kt-highlight {
    position: relative;
    top: 5px;
    left: 5px; 
  }
}

/* --------------------------------------------------------------------------
   2.2 HERO SECTION
   -------------------------------------------------------------------------- */

/* --- The Stage (Container Setup) --- */
/* We must make the row 'Relative' so absolute items stay inside it */
.home-hero-row {
  position: relative !important;
  z-index: 1;
  overflow: visible !important;
}

/* KADENCE FIX: This "breaks" the column containers so the 
   images can float freely across the whole row area */
.home-hero-row .kt-row-column-wrap,
.home-hero-row .wp-block-kadence-column,
.home-hero-row .kt-inside-inner-col {
  position: static !important;
  z-index: auto !important;
  transform: none !important;
}

/* --- Layer 1: The People (Back - Commented Out) --- 
.home-hero-older-couple {
  position: absolute !important;
  z-index: 1; 
  pointer-events: none;
  bottom: 5%;
  right: -5%;
  width: auto !important;
  max-width: none !important;
}
*/

/* --- Layer 1: The People (Locked) --- */
.home-hero-older-couple {
  position: absolute !important;
  z-index: 1;
  pointer-events: none;
  width: 925px !important;
  max-width: none !important;
  left: 50% !important;
  bottom: 5% !important;
  margin-left: -50px !important;
  transform: none !important;
}

/* The Mobile Exception for Layer 1 */
/* Since a 700px image will break a phone screen, 
   we let them be fluid again only on smaller devices. */
@media (max-width: 1024px) {
  .home-hero-older-couple {
    width: 70% !important; 
    left: auto !important;
    right: -5% !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 768px) {
  .home-hero-older-couple {
    width: 460px !important; 
  }
}

/* --- Layer 2: The Curve Divider (Middle) --- */
.home-hero-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 447px; /* Matches your larger design; reduce if too tall */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/home-curve-divider.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}

/* --- Layer 3: Top Level Content --- */
/* Ensures content and price badge sit above hero curves */
.home-hero-inner-row {
  position: relative !important;
  z-index: 3 !important;
}

/* --- Hero Pricing Badge --- */
.hero-price {
  position: absolute !important;
  z-index: 20 !important;
  pointer-events: none;
  display: block !important;
  width: auto !important;
  margin: 0 !important;
}

/* The Star Icon - Specific offsets provided */
.hero-price .kb-svg-icon-wrap {
  position: absolute !important;
  z-index: -1 !important;
  font-size: 73px !important;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.51));
  right: -58px !important;
  top: -48px !important;
}

/* Hero Pricing - Desktop (The "Drag" Factor) */
/* Uses percentages so the gap grows/shrinks with the screen */
@media (min-width: 1410px) {
  .hero-price {
    bottom: 10% !important;
    right: calc((100vw - 1200px) / 2) !important; 
    left: auto !important;
    transform: none !important;
  }
}

/* Hero Pricing - Tablet (Precision Control) */
/* Uses fixed pixels to lock it in place relative to the edge */
@media (max-width: 1409px) and (min-width: 768px) {
  .hero-price {
    bottom: 106px !important; /* Precision height */
    right: 40px !important;  /* Precision distance from edge */
    left: auto !important;
    transform: scale(0.9) !important; /* Sized for tablet */
  }
}

/* Hero Pricing - Mobile (Safe Flow) */
/* Drops into the layout so it doesn't overlap your 'Schedule' button */
@media (max-width: 767px) {
  .hero-price {
    bottom: 94px !important;
    right: 15px !important;
    text-align: center;
    width: fit-content !important;
    transform: scale(0.8) !important;
  }
}

/* --- Sideways Floating Button --- */
.hero-sideways-btn {
  position: absolute !important;
  top: 268px;
  top: 40%;
  right: 21px;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: right center;
  z-index: 100 !important; 
  margin: 0 !important;
  white-space: nowrap;
  padding: 10px 10px 5px 10px !important;
}

@media (max-width: 1024px) {
  .hero-sideways-btn {
    top: 200px;
  }
}

@media (max-width: 767px) {
  .hero-sideways-btn {
    top: 30%;
    padding: 0px 0px 0px 0px !important;
  }
}

/* --------------------------------------------------------------------------
   2.3 VALUE PROP GALLERY
   -------------------------------------------------------------------------- */
/* This targets the main wrapper you've named */
.value-prop-gallery {
  position: relative;
  overflow: visible !important;
  /* Extra padding ensures the 'dip' of the curve doesn't cut off important parts of the photos */
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

/* We apply the clip-path to the inner track to keep the animation smooth */
.value-prop-gallery .splide__track {
  overflow: visible !important;

  /* High-Density Polygon: 18 points create the illusion of a smooth curve */
  clip-path: polygon(
    /* Top Edge (Cerving Downward) */
    0% 0%, 12.5% 4%, 25% 8%, 37.5% 11%, 50% 12%, 62.5% 11%, 75% 8%, 87.5% 4%, 100% 0%, 
    /* Bottom Edge (Curving Upward) */
    100% 100%, 87.5% 96%, 75% 92%, 62.5% 89%, 50% 88%, 37.5% 89%, 25% 92%, 12.5% 96%, 0% 100%
  ) !important;

  /* This 'flares' the sides out slightly as you requested */
  transform: scaleX(1.08);
}

/* Ensure the individual images fill the space properly */
.value-prop-gallery .kadence-blocks-gallery-item-inner {
  transform: none !important;
}

/* --------------------------------------------------------------------------
   2.4 CULINARY SECTION
   -------------------------------------------------------------------------- */
/* Content-Locked Background */
.home-culinary-overlay .kt-image-overlay-wrap {
  background: none;
}
@media (max-width: 1024px) {
  .home-culinary-overlay .image-overlay-subtitle {
    margin: 10px !important;
  }
}

/* --------------------------------------------------------------------------
   2.5 REMODELED SECTION
   -------------------------------------------------------------------------- */
/* 1. Target the row and hide the standard background if you set it in the editor */
.home-remodeled-row {
  position: relative;
  background-image: none !important; 
  overflow: visible !important;
}

/* 2. Create a top-level layer for the curve image */
.home-remodeled-row::after {
  content: "";
  position: absolute;
  /* Pins it to the bottom of the row */
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%; /* Adjust this if you only want the curve at the bottom */
  
  /* The Image Settings */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/bottom-curve-blur.png') !important;
  background-size: contain !important;
  background-position: bottom center !important;
  background-repeat: no-repeat !important;

  /* The Stacking Magic */
  z-index: 90 !important; /* Forces it to the very front */
  pointer-events: none;   /* Makes the image 'invisible' to mouse clicks */
}

/* --------------------------------------------------------------------------
   2.6 SLIDE DRAWER FORM
   -------------------------------------------------------------------------- */
/* --- The Content-Height Drawer --- */
.custom-slide-drawer {
  position: fixed !important;
  /* This centers the drawer vertically on the screen */
  top: 500px !important;
  top: 50% !important;
  transform: translateY(-50%);
  /* 1. The Height Change */
  right: -800px; /* Moves it off-screen */
  width: 500px;
  height: auto !important; /* Hugs the form content */
  max-height: 90vh; /* Safeguard: ensures it doesn't taller than the screen */
  overflow-y: auto; /* Adds a scrollbar ONLY if the form is too tall */
  /* Styling */
  z-index: 9999;
  background: #fff;
  transition: right 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: -10px 0 30px rgba(0,0,0,0.1);
  border-radius: 92px 0 120px 0px;
}

/* 2. The Trigger State */
/* We must keep the translateY(-50%) here so it stays centered while sliding */
body.drawer-active .custom-slide-drawer {
  right: 0 !important;
}

/* 3. The Button (Pull-Tab) */
.drawer-pull-tab {
  position: fixed !important;
  right: 0;
  /* Rotate the button and keep it centered */
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: right bottom;
  z-index: 10000;
  transition: right 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

body.drawer-active .drawer-pull-tab {
  right: 500px !important;
} 

.tour-icon {
  position: absolute;
  top: -18px;
  right: -15px;
}

.form-schedule-a-tour-btn {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

@media (max-width: 1024px) {
  .custom-slide-drawer {
    top: 460px !important;
  }
}

@media (max-width: 767px) {
  .custom-slide-drawer {
    top: 50% !important;
    width: 100%;
  }
}


/* ==========================================================================
   03. INDEPENDENT LIVING
   ========================================================================== */

/* --------------------------------------------------------------------------
   3.1 INDEPENDENT LIVING HERO & LAYOUT
   -------------------------------------------------------------------------- */
.not-home-hero-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 230px;
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/not-home-curve-divider-b.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}
.not-home-hero-row {
  position: relative !important;
  z-index: 1;
  overflow: visible !important;
}
.not-home-hero-row .kt-row-column-wrap,
.not-home-hero-row .wp-block-kadence-column,
.not-home-hero-row .kt-inside-inner-col {
  position: static !important;
  z-index: auto !important;
  transform: none !important;
}
.il-hero-older-couple {
  position: absolute !important;
  z-index: 1;
  pointer-events: none;
  width: 571px !important;
  max-width: none !important;
  left: 62% !important;
  bottom: 3% !important;
  margin-left: -50px !important;
  transform: none !important;
}
@media (max-width: 1024px) {
  .il-hero-older-couple {
    width: 70% !important; 
    left: auto !important;
    right: -5% !important;
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .il-hero-older-couple {
    width: 460px !important;
    bottom: 2% !important;
  }
}
.il-hero-older-table-cards {
  position: absolute !important;
  z-index: 1;
  pointer-events: none;
  width: 571px !important;
  max-width: none !important;
  right: 62% !important;
  bottom: 5% !important;
  margin-left: -50px !important;
  transform: none !important;
}
@media (max-width: 1024px) {
  .il-hero-older-table-cards {
    width: 70% !important; 
    left: auto !important;
    right: 55% !important;
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .il-hero-older-table-cards {
    display: none;
    width: 460px !important; 
  }
}

.kb-row-layout-wrap.il-curve-community {
  background-position: center top 200px;
}
@media (max-width: 1024px) {
  .kb-row-layout-wrap.il-curve-community {
    background-position: center top 400px;
  }
}
@media (max-width: 768px) {
  .kb-row-layout-wrap.il-curve-community {
    background-position: center top 600px;
  }
}

.kb-row-layout-wrap.all-inclusive-living {
  background-position: left bottom -91px;
}

.all-inclusive-living > .kt-row-layout-overlay {
  display: block !important;
  opacity: 1 !important;
  pointer-events: none;
  position: absolute !important;
  top: auto !important;
  bottom: 0 !important;
  left: 23% !important;
  width: 925px !important;
  max-width: none !important;
  height: 100% !important;
  transform: translateX(-50%) translateX(50px) !important;
  background-size: 899px auto !important;
  background-position: bottom right !important;
  background-repeat: no-repeat !important;
  z-index: 2;
}

@media (max-width: 1024px) {
  .all-inclusive-living > .kt-row-layout-overlay {
    transform: translateX(-50%) translateX(-100px) !important;
  }
}

@media (max-width: 768px) {
  .all-inclusive-living > .kt-row-layout-overlay {
    transform: translateX(-50%) translateX(-190px) !important;
    background-size: 710px auto !important;
  }
}

.rh-cta-img {
  position: relative !important;
}
.rh-cta-img img {
  position: absolute;
  top: -59px;
  right: -150px; 
  width: 700px !important;
  max-width: none !important;
  height: auto !important;
  transform: scale(1.05); 
  transform-origin: bottom center;
}
@media (max-width: 1215px) {
  .rh-cta-img img {
    top: 10px;
  }
}
@media (max-width: 1024px) {
  .rh-cta-img img {
    top: -190px;
    transform: scale(.8);
    right: -190px;
  }
}
@media (max-width: 889px) {
  .rh-cta-img img {
    top: -135px;
    right: -240px;
  }
}
@media (max-width: 767px) {
  .rh-cta-img img {
    position: relative !important;
    top: 128px;
    right: 190px;
    transform: scale(1.1);
  }
}
.contact-cta .kt-row-layout-bottom-sep.kt-row-sep-type-crvri {
  z-index: 2;
}

/* --------------------------------------------------------------------------
   3.2 INDEPENDENT TABLE
   -------------------------------------------------------------------------- */
/* A. General Styles (Applies to All Sizes) */
.independent-table.kb-table-container tr {
  border-right: none !important;
  border-left: none !important;
  border-top: none !important;
  height: auto !important; /* Fixes the 100px 'smash' issue */
}

.rh-header-title {
  background: linear-gradient(90deg, var(--global-palette2) 0%, var(--global-palette1) 100%) !important;
}

.independent-table tr:first-child th {
  padding-bottom: 30px;
}

/* B. Desktop Only: The Overlap Effect */
@media (min-width: 768px) {
  .independent-table .rh-header-title {
    margin-left: -100px !important; 
    position: relative;
    z-index: 10;
    padding-left: 40px !important; 
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    box-shadow: -9px 0px 15px 0 rgba(0, 0, 0, 0.2); /* Softened shadow */
  }

  .independent-table table,
  .independent-table th {
    overflow: visible !important;
  }
}

/* C. Mobile Only: The Card Stack Effect */
@media (max-width: 767px) {
  /* 1. Force the table to stack */
  .independent-table table, 
  .independent-table tbody, 
  .independent-table tr, 
  .independent-table th, 
  .independent-table td {
    display: block !important;
    width: 100% !important;
  }

  /* 2. Reset the Desktop Overlap (Crucial) */
  .independent-table .rh-header-title {
    margin-left: 0 !important; /* Removes the -100px shift */
    box-shadow: none !important; /* Removes the side shadow */
    border-radius: 4px 4px 0 0 !important;
    padding-left: 15px !important; 
    text-align: center;
  }

  /* 3. Create the Card Spacing */
  .independent-table tr.kb-table-row {
    margin-bottom: 30px; /* Space between the two 'apartment types' */
    border: 1px solid #eee !important;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  }

  /* 4. Cell Styling */
  .independent-table td.kb-table-data {
    padding: 20px !important;
  }

  /* 5. Icon & Text Alignment */
  .independent-table .kt-adv-heading-has-icon {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px;
    margin-bottom: 12px;
  }

  /* 6. Clean up the empty placeholder cell */
  .independent-table tr:last-child td:first-child:empty {
    display: none !important;
  }

  .independent-table tr:first-child th {
    padding-bottom: 0px;
  }

  .independent-table tr:first-child {
    border: none !important;
  }
}


/* ==========================================================================
   04. SHARED SECTIONS
   ========================================================================== */

/* --------------------------------------------------------------------------
   4.1 CTA CURVE BANNER
   -------------------------------------------------------------------------- */
.cta-curve-banner-transparent {
  /* 1. Layer & Position */
  position: relative;
  z-index: 10;
  
  /* 2. The Background */
  /* We apply the gradient directly to the row so it stays full-width naturally */
  background: linear-gradient(90deg, var(--global-palette1) 0%, var(--global-palette2) 100%) !important;
  
  /* 3. The "Bend" (The Pro Way) */
  /* This creates a perfectly smooth spherical scoop out of the top and bottom */
  /* No polygon points = no 'pointed' center */
  mask-image: radial-gradient(ellipse 120% 120px at 50% -20px, transparent 99%, black 100%),
              radial-gradient(ellipse 120% 120px at 50% calc(100% + 20px), transparent 99%, black 100%);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;

  /* 4. Cleanup */
  border: none !important;
}

/* 5. Content Alignment */
.cta-curve-banner-transparent .kt-row-column-wrap {
  padding-top: 150px !important;
  padding-bottom: 140px !important;
}

/* Ensure the lifestyle image stays behind the bend */
.kb-image12_75fcc8-4f {
  position: relative;
  z-index: 1;
}

/* --------------------------------------------------------------------------
   4.2 THRIVE SECTION & SLIDER
   -------------------------------------------------------------------------- */
/* --- Thrive Content Image Overlay --- */
/* We use the specific Kadence ID to make sure we only target THIS image */
.thrive-content-row > .kt-row-layout-overlay {
  /* 1. Reset Kadence Defaults */
  display: block !important;
  opacity: 1 !important;
  pointer-events: none; /* So you can click buttons 'through' the ladies */

  /* 2. Position as a Floating Canvas */
  position: absolute !important;
  top: auto !important;
  bottom: 0 !important;
  left: 72% !important;
  
  /* 3. The Sizing & Nudge */
  width: 925px !important; /* Your specific width */
  max-width: none !important;
  height: 100% !important; /* Fill the height of the row */
  
  /* This centers the 925px box, then pushes it 50px to the right */
  transform: translateX(-50%) translateX(50px) !important;

  /* 4. Fine-Tune the Image Placement inside that box */
  background-size: 740px auto !important;
  background-position: bottom right !important;
  background-repeat: no-repeat !important;
  
  /* 5. Layering */
  z-index: 2;
}

@media (max-width: 1024px) {
  .thrive-content-row > .kt-row-layout-overlay {
    transform: translateX(-50%) translateX(-100px) !important;
  }
}

@media (max-width: 768px) {
  .thrive-content-row > .kt-row-layout-overlay {
    transform: translateX(-50%) translateX(-190px) !important;
    background-size: 710px auto !important;
  }
}

/* --- Splide Pause on Desktop --- */
@media (min-width: 1025px) {
  /* 1. Dissolve the slider 'gears' so they can't move anything */
  .thrive-slider .splide__track,
  .thrive-slider .splide__list {
    display: contents !important;
    overflow: visible !important;
  }

  /* 2. Turn the parent container into a standard flex row */
  .thrive-slider .splide {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 30px !important; /* Matches your data-slider-gap="30" */
    width: 100% !important;
    transform: none !important;
  }

  /* 3. Hide the 'Clone' slides (The duplicates used for looping) */
  .thrive-slider .splide__slide--clone {
    display: none !important;
  }

  /* 4. Reset the real slides to be a static width */
  .thrive-slider .splide__slide {
    width: calc(20% - 24px) !important; /* Forces 5 items across */
    flex: 0 0 auto !important;
    margin: 0 !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* 5. Hide the navigation helpers */
  .thrive-slider .splide__arrows,
  .thrive-slider .splide__pagination,
  .thrive-slider .splide__toggle {
    display: none !important;
  }
}

.thrive-curve-banner-col-1 {
  position: relative;
  z-index: 10;
  background: linear-gradient(90deg, var(--global-palette1) 0%, var(--global-palette2) 100%) !important;
  mask-image: radial-gradient(ellipse 120% 120px at 90% -20px, transparent 99%, black 100%), radial-gradient(ellipse 120% 120px at 90% calc(100% + 20px), transparent 99%, black 100%);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;
  border: none !important;
}

.thrive-curve-banner-col-2 {
  position: relative;
  z-index: 10;
  background: linear-gradient(180deg, rgba(126,155,80,0.38) 0%, rgba(210,209,122,0.38) 100%);
  mask-image: radial-gradient(ellipse 200% 120px at 50% -16px, transparent 99%, black 100%), radial-gradient(ellipse 200% 120px at 50% calc(100% + 16px), transparent 99%, black 100%);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;
  border: none !important;
}

.thrive-curve-banner-col-3 {
  position: relative;
  z-index: 10;
  background: linear-gradient(90deg, var(--global-palette2) 0%, var(--global-palette1) 100%) !important;
  mask-image: radial-gradient(ellipse 120% 120px at 10% -20px, transparent 99%, black 100%), radial-gradient(ellipse 120% 120px at 10% calc(100% + 20px), transparent 99%, black 100%);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;
  border: none !important;
}

.thrive-curve-banner-col-1 .kb-svg-icon-wrap,
.thrive-curve-banner-col-3 .kb-svg-icon-wrap {
  position: absolute;
  right: 38px;
  margin-bottom: 180px;
}
.thrive-curve-banner-col-2 .kb-svg-icon-wrap {
  position: absolute;
  right: 38px;
  margin-bottom: 125px;
  bottom: 0;
}
@media (max-width: 767px) {
  .thrive-curve-banner-col-1 .kb-svg-icon-wrap,
  .thrive-curve-banner-col-3 .kb-svg-icon-wrap {
    margin-bottom: 145px;
  }
}
.rh-cta-img.rh-cta-thrive-img img {
  top: -64px;
}
@media (max-width: 1215px) {
  .rh-cta-img.rh-cta-thrive-img img {
    top: 4px;
  }
}
@media (max-width: 1024px) {
  .rh-cta-img.rh-cta-thrive-img img {
    top: -195px;
    transform: scale(.8);
    right: -190px;
  }
}
@media (max-width: 812px) {
  .rh-cta-img.rh-cta-thrive-img img {
    top: -141px;
    right: -240px;
  }
}
@media (max-width: 767px) {
  .rh-cta-img.rh-cta-thrive-img img {
    position: relative !important;
    top: 128px;
    right: 190px;
    transform: scale(1.1);
  }
}

.thrive-hero-older-couple {
  position: absolute !important;
  z-index: 1;
  pointer-events: none;
  width: 571px !important;
  max-width: none !important;
  left: 62% !important;
  bottom: 0% !important;
  margin-left: -50px !important;
  transform: none !important;
}
@media (max-width: 1024px) {
  .thrive-hero-older-couple {
    width: 70% !important; 
    left: auto !important;
    right: -5% !important;
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .thrive-hero-older-couple {
    width: 460px !important;
    bottom: 2% !important;
  }
}

/* --------------------------------------------------------------------------
   4.3 SERVICES
   -------------------------------------------------------------------------- */
.service-svg .kt-info-svg-icon path {
  fill: #D2D17A;
  stroke-width: 1.2px;
  stroke: #FFF;
}

.service-svg.suit .kt-info-svg-icon path,
.service-svg.screw .kt-info-svg-icon path {
  fill: none !important;
  stroke: #D2D17A !important;
  stroke-width: 2.5px !important;
  vector-effect: non-scaling-stroke;
}

.service-cards .kt-blocks-info-box-text {
  max-width: 200px;
}

@media (max-width: 767px) {
  .service-cards .kt-blocks-info-box-text {
    max-width: 100%;
  }
  .service-cards .kt-blocks-info-box-media-container {
    margin-bottom: 0 !important;
  }
}

/* --------------------------------------------------------------------------
   4.4 CONTACT US
   -------------------------------------------------------------------------- */
.contact-us-hero-row {
  position: relative !important;
  z-index: 1;
  overflow: visible !important;
}
.contact-us-hero-row .kt-row-column-wrap,
.contact-us-hero-row .wp-block-kadence-column,
.contact-us-hero-row .kt-inside-inner-col {
  position: static !important;
  z-index: auto !important;
  transform: none !important;
}
.contact-us-hero-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 447px; /* Matches your larger design; reduce if too tall */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/contact-us-curve-divider.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}
@media (max-width: 767px) {
  .contact-us-hero-row::after {
    height: 250px;
  }
}
.contact-us-hero-row {
  position: relative !important;
  z-index: 3 !important;
}

/* --------------------------------------------------------------------------
   4.5 CULINARY
   -------------------------------------------------------------------------- */
.il-h2-reg mark.kt-highlight {
  display: inline-block;
  text-shadow: -3px 8px 6.4px rgba(0, 0, 0, 0.26);
  //transform: rotate(-11.828deg) scaleX(1.5) translateY(-10px) translateX(-3px);
}

@media (max-width: 768px) {
  .il-h2-reg mark.kt-highlight {
    position: relative;
    top: 5px;
    left: 5px; 
  }
}

.culinary-hero-rh {
  position: absolute !important;
  z-index: 1;
  pointer-events: none;
  width: 571px !important;
  max-width: none !important;
  left: 69% !important;
  bottom: 0% !important;
  margin-left: -50px !important;
  transform: none !important;
}
@media (max-width: 1024px) {
  .culinary-hero-rh {
    width: 40% !important; 
    left: auto !important;
    right: -5% !important;
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .culinary-hero-rh {
    width: 460px !important;
    bottom: 2% !important;
  }
}

.grad-lh-border {
  border-left: 10px solid; /* Applies 5px solid border only to the left */
  border-image: linear-gradient(to bottom, #D2D17A, #7E9B50) 1;
}

.rh-cta-culinary-img {
  position: relative !important;
}
.rh-cta-culinary-img img {
  position: absolute;
  bottom: -45px;
  right: -150px; 
  width: 700px !important;
  max-width: none !important;
  height: auto !important;
  transform: scale(1.05); 
  transform-origin: bottom center;
}
@media (max-width: 1215px) {
  .rh-cta-culinary-img img {
    bottom: -45px;
  }
}
@media (max-width: 1024px) {
  .rh-cta-culinary-img img {
    bottom: -45px;
    transform: scale(.8);
    right: -190px;
  }
}
@media (max-width: 889px) {
  .rh-cta-culinary-img img {
    bottom: -45px;
    right: -240px;
  }
}
@media (max-width: 767px) {
  .rh-cta-culinary-img img {
    position: relative !important;
    bottom: -45px;
    right: 190px;
    transform: scale(1.1);
  }
}

/* Desktop: 4 columns × 2 rows = 8 slides */
@media (min-width: 1024px) {
    .four-by-four #splide01 .splide__list {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important;
        grid-template-rows: auto auto !important;
        gap: 40px !important;
        transform: none !important;
        flex-wrap: wrap !important;
    }

    .four-by-four #splide01 .splide__slide {
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* Hide clones for a clean 4×2 layout */
    .four-by-four #splide01 .splide__slide--clone {
        display: none !important;
    }

    /* Hide arrows/pagination since it's static on desktop */
    .four-by-four #splide01 .splide__arrow,
    .four-by-four #splide01 .splide__pagination {
        display: none !important;
    }
}

.rh-cta-rooted-img {
  position: relative !important;
}
.rh-cta-rooted-img img {
  position: absolute;
  bottom: 0;
  right: -150px; 
  width: 700px !important;
  max-width: none !important;
  height: auto !important;
  transform: scale(1.05); 
  transform-origin: bottom center;
}
@media (max-width: 1215px) {
  .rh-cta-rooted-img img {
    bottom: 0;
  }
}
@media (max-width: 1024px) {
  .rh-cta-rooted-img img {
    bottom: 0;
    transform: scale(.8);
    right: -190px;
  }
}
@media (max-width: 889px) {
  .rh-cta-rooted-img img {
    bottom: 0;
    right: -240px;
  }
}
@media (max-width: 767px) {
  .rh-cta-rooted-img img {
    position: relative !important;
    bottom: 0;
    right: 190px;
    transform: scale(1.1);
  }
}

/* --------------------------------------------------------------------------
   4.6 COST CALCULATOR
   -------------------------------------------------------------------------- */
.calc-hero-row {
  position: relative !important;
  z-index: 1;
  overflow: visible !important;
}
.calc-hero-row .kt-row-column-wrap,
.calc-hero-row .wp-block-kadence-column,
.calc-hero-row .kt-inside-inner-col {
  position: static !important;
  z-index: auto !important;
  transform: none !important;
}
.calc-hero-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 447px; /* Matches your larger design; reduce if too tall */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/contact-us-curve-divider.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}
.calc-hero-price {
  position: absolute !important;
  z-index: 20 !important;
  pointer-events: none;
  display: block !important;
  width: auto !important;
  margin: 0 !important;
}

.calc-hero-price .kb-svg-icon-wrap {
  position: absolute !important;
  z-index: -1 !important;
  font-size: 73px !important;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.51));
  right: -58px !important;
  top: -48px !important;
}

@media (min-width: 1025px) {
  .calc-hero-price {
    bottom: 7% !important;
    right: 5% !important; 
    left: auto !important;
    transform: none !important;
  }
}

@media (max-width: 1024px) and (min-width: 768px) {
  .calc-hero-price {
    bottom: 75px !important;
    right: 40px !important;
    left: auto !important;
    transform: scale(0.9) !important;
  }
}

@media (max-width: 767px) {
  .calc-hero-price {
    bottom: 48px !important;
    right: 15px !important;
    text-align: center;
    width: fit-content !important;
    transform: scale(0.8) !important;
  }
}

@media (max-width: 768px) {
  .home-hero-older-couple.cost-calc-older-couple {
    bottom: 0 !important; 
  }
}

/* --------------------------------------------------------------------------
   4.7 FLOOR PLANS & PRICING
   -------------------------------------------------------------------------- */
.floor-plan-pricing-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 299px; /* Matches your larger design; reduce if too tall */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/pricing-curve.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}
@media (max-width: 767px) {
  .floor-plan-pricing-row::after {
    height: 150px;
  }
}

/* 1. Turn the container holding both the image and the text into a Grid */
.pricing-bg-img > .kt-inside-inner-col {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}

/* 2. Force BOTH the image and the text wrapper into the exact same grid cell */
.pricing-bg-img > .kt-inside-inner-col > .wp-block-kadence-image,
.pricing-bg-img > .kt-inside-inner-col > .kb-row-layout-wrap {
  grid-area: 1 / 1;
}

/* 3. Make sure the image scales smoothly and resets any default margins */
.pricing-bg-img .wp-block-kadence-image {
  margin: 0 !important;
  width: 100%;
}
.pricing-bg-img .wp-block-kadence-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* 4. Position the text wrapper at the TOP RIGHT over the image */
.pricing-bg-img > .kt-inside-inner-col > .kb-row-layout-wrap {
  display: flex;
  justify-content: flex-end; /* Pushes text to the right */
  align-items: flex-start;   /* Pushes text to the top */
  z-index: 2;
  
  /* Adds a scaling safety gap so text doesn't touch the absolute edge */
  padding-top: 5%;
  padding-right: 7%;
  box-sizing: border-box;
}

/* 5. Clean up the inner text block alignment */
.pricing-bg-overlay-text > .kt-inside-inner-col {
  display: flex;
  flex-direction: column;
  padding: 0 !important; 
  align-items: flex-end;
  text-align: center;
}
.pricing-bg-overlay-text .for-as-low-as.kt-adv-heading3373_45db9b-5e {
  align-self: flex-start;
  text-align: left;
}

/* 6. Ensure the price uses the responsive clamp we fixed earlier */
.pricing-bg-overlay-text .kt-adv-heading3373_efc50e-8d strong {
  display: inline-block;
  font-size: clamp(40px, 5vw, 80px) !important;
  line-height: 1.1;
}

/* 7. Apply fluid typography to the text above and below the price */
.pricing-bg-overlay-text .kt-adv-heading3373_45db9b-5e strong,
.pricing-bg-overlay-text .kt-adv-heading3373_2ecf65-43 strong {
  display: inline-block;
  font-size: clamp(18px, 1vw, 25px) !important;
  line-height: 1.3;
}

.floor-plan-cards .kt-inside-inner-col {
  overflow: hidden;
}

.floor-plan-filters .kb-query-label {
  color: #fff;
}

/* --------------------------------------------------------------------------
   4.8 PHOTO GALLERY & 3D TOUR
   -------------------------------------------------------------------------- */
.threed-tour-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 317px; /* Matches your larger design; reduce if too tall */
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/reverse-curve.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important; 
  pointer-events: none;
  display: block;
}
@media (max-width: 1024px) {
  .threed-tour-row::after {
    height: 270px;
    width: 150%;
  }
}
@media (max-width: 767px) {
  .threed-tour-row::after {
    height: 290px;
  }
}

.photo-gallery-row::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/pricing-curve.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important;
  pointer-events: none;
  display: block;
}


/* ==========================================================================
   05. BLOG
   ========================================================================== */

/* --------------------------------------------------------------------------
   5.1 BLOG ARCHIVE
   -------------------------------------------------------------------------- */
.blog .content-area {
  margin-top: 0rem;
}
.home-hero-older-couple.blog-hero-rh {
  width: 775px !important;
}
@media (max-width: 1024px) {
  .home-hero-older-couple.blog-hero-rh {
    width: 70% !important; 
  }
}
@media (max-width: 768px) {
  .home-hero-older-couple.blog-hero-rh {
    width: 425px !important;
    bottom: 0px !important;
  }
}

article.entry {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important; /* This is the secret ingredient */
}
.entry-content-wrap {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important; 
}
.entry-footer {
    margin-top: auto !important;
}
.blog .entry-header {
  margin-bottom: 0;
}
.blog .loop-entry .entry-content-wrap {
  padding: 1rem;
}
.blog .entry-list-item article .post-thumbnail img {
  padding: 1rem;
}
.blog .loop-entry .entry-header .entry-meta {
  margin-top: 0;
  margin-bottom: 0;
}
.blog .entry-summary {
  margin: 0;
}
.blog .loop-entry .entry-summary p {
  margin: 1em 0 0 0;
}
.blog .more-link-wrap {
  border-radius: 0 49px 0 53px;
  background: linear-gradient(89deg, #7E9B50 2.71%, #D2D17A 99.08%);
  box-shadow: 2px 3px 0 0 rgba(0, 0, 0, 0.49);
  height: 50px;
}
.post-more-link {
  height: 50px;
  display: inline-flex; 
  align-items: center;
  padding: 0 50px; 
  text-decoration: none;
  border-radius: 4px; 
}
.blog a.post-more-link {
  color: #fff;
}
.blog a.post-more-link:hover {
  color: #000;
}
.post-more-link .kadence-svg-iconset {
    margin-bottom: 6px;
}
.blog .entry-list-item article {
  border-radius: 0 0 0 67px;
  border: 0.5px solid #D2D17A;
}

.blog .wp-block-latest-posts.wp-block-latest-posts__list li {
  border-bottom: 1px #D2D17A solid;
  padding-bottom: 1.5rem;
}
.blog .wp-block-latest-posts__list li:first-of-type {
  margin-top: 0;
}
.blog-category-list li {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  border-radius: 0 55px 0 26px;
  border: 1px solid #7E9B50;
  list-style: none;
  margin-bottom: 10px;
}
.blog-category-list li {
  padding-left: 10px;
  padding-right: 30px;
}
.blog-category-list a:hover {
  text-decoration: none;
}

@media screen and (min-width: 1025px) {
  .blog.has-sidebar .content-container {
    grid-gap: 30px;
  }
}
.blog .primary-sidebar {
  border-left: 1px #D2D17A solid;
  padding-left: 20px;
}

/* --------------------------------------------------------------------------
   5.2 BLOG SINGLE
   -------------------------------------------------------------------------- */
.single-post .post-thumbnail.article-post-thumbnail {
  box-shadow: 14px 14px 0px 0px #516631;
}
.single-post .kadence-thumbnail-position-behind {
  margin-bottom: 14px;
}
@media (min-width: 1102px) {
  .single-post .single-entry {
    margin-left: -100px;
    margin-right: -100px;
  }
}
.single-post .post-title .entry-meta {
  border-bottom: 1px #D2D17A solid;
  margin-bottom: 0px;
  padding-bottom: 25px;
}
.single-post .entry-header {
  margin-bottom: 0;
}
.single-post .entry h2 {
  font-size: 40px;
}
.single-post .entry h3 {
  font-size: 30px;
}
.single-post .entry h4 {
  font-size: 28px;
}
.single-post .content-area {
  position: relative;
}
.single-post .content-area::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background-image: url('https://m4tl18gjpp.wpdns.site/wp-content/uploads/2026/05/pricing-curve.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  z-index: 2 !important;
  pointer-events: none;
  display: block;
}