/* BnBNerd Product Page Fixes */

/* Content width - use Elementor's own variable system */
.elementor:not(.elementor-3344) .e-con.e-parent:not(:first-child) {
  --container-max-width: 900px !important;
  --content-width: min(100%, 900px) !important;
  margin: 0 auto !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
}

/* Don't constrain the hero sections (first e-con parent) */
.elementor .e-con.e-parent:first-child {
  --container-max-width: 100%;
}

/* Boxed sections */
.elementor-section-boxed > .elementor-container {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 20px 40px !important;
}

/* Theme content wrapper */
.single-page-article .entry-content > .elementor {
  max-width: 960px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  box-sizing: border-box !important;
}

/* Text spacing */
.elementor-widget-text-editor p,
h4.elementor-heading-title {
  margin-bottom: 1.2em !important;
  line-height: 1.8 !important;
  font-size: 16px !important;
}

.elementor-widget-heading {
  margin-bottom: 15px !important;
}

.elementor-widget-text-editor {
  margin-bottom: 20px !important;
}

/* Section spacing */
.elementor-top-section {
  margin-bottom: 10px !important;
}

/* SVG icon fix (single source of truth — removed from child theme style.css) */
.elementor .e-font-icon-svg {
  width: var(--e-icon-list-icon-size, 1em) !important;
  height: var(--e-icon-list-icon-size, 1em) !important;
  fill: currentColor;
}
.elementor-icon-list-icon .e-font-icon-svg {
  width: var(--e-icon-list-icon-size, 14px) !important;
  height: var(--e-icon-list-icon-size, 14px) !important;
}

/* PNG checkmark image fix */
img[src*='output-onlinepngtools'] {
  max-width: 24px !important;
  max-height: 24px !important;
  width: 24px !important;
  height: 24px !important;
  vertical-align: middle;
  display: inline-block !important;
}

/* Service page hero — compact height, sized to text */
.elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child {
  padding-top: 15px !important;
  padding-bottom: 0 !important;
}
.elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child .elementor-widget-spacer {
  --spacer-size: 15px !important;
}
.elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child .elementor-shape-bottom svg {
  height: 30px !important;
}


/* Nav link contrast fix — darken to meet 4.5:1 WCAG ratio */
.navi > .main-menu > li > a,
.listing-navi > .main-menu > li > a,
.main-menu > li > a {
  color: #2c3e50 !important;
}

/* Contrast fix - ensure gold/yellow elements have sufficient contrast */
a[style*="color:#FFCC41"],
.elementor-button[style*="background-color:#FFCC41"] {
  color: #1a1a1a !important;
}
a:not([class]) {
  color: #395E74;
}

/* ========================================
   MOBILE RESPONSIVE (max-width: 767px)
   ======================================== */
@media (max-width: 767px) {
  /* Reduce side padding on mobile */
  .elementor:not(.elementor-3344) .e-con.e-parent:not(:first-child),
  .elementor-section-boxed > .elementor-container,
  .single-page-article .entry-content > .elementor {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* FAQ and custom pages - tighter padding on mobile */
  .single-page-article .entry-content > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Smaller headings on mobile */
  h1.elementor-heading-title,
  h1 {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }
  h2 {
    font-size: 22px !important;
  }
  h3 {
    font-size: 18px !important;
  }

  /* Service hero - even more compact on mobile */
  .elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child {
    padding-top: 10px !important;
  }
  .elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child .elementor-widget-spacer {
    --spacer-size: 10px !important;
  }
  .elementor:not(.elementor-3344):not(.elementor-4618) .e-con.e-parent:first-child .elementor-shape-bottom svg {
    height: 20px !important;
  }

  /* Content container inline styles override for mobile */
  [style*="max-width:900px"] {
    max-width: 100% !important;
    padding: 20px 16px !important;
  }

  /* Footer adjustments */
  .footer-top-wrap .col-md-3 {
    margin-bottom: 20px;
  }

  /* CTA buttons full width on mobile */
  .elementor-button {
    font-size: 16px !important;
    padding: 12px 20px !important;
  }

  /* Pricing cards stack properly */
  .elementor-column.elementor-col-33 {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
}

/* ========================================
   TABLET RESPONSIVE (768px - 1024px)
   ======================================== */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor:not(.elementor-3344) .e-con.e-parent:not(:first-child),
  .elementor-section-boxed > .elementor-container,
  .single-page-article .entry-content > .elementor {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  [style*="max-width:900px"] {
    padding: 30px 24px !important;
  }
}

/* ========================================
   CUSTOM CONTENT STYLES
   (service pages, FAQ, blog, CTA sections)
   ======================================== */

/* Content container — used on service pages, FAQ, blog, privacy, 404 */
.bnb-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 40px 20px;
  box-sizing: border-box;
}
.bnb-content-wide {
  max-width: 900px;
  margin: 0 auto;
  padding: 40px 40px 20px;
  box-sizing: border-box;
}

/* Page headings */
.bnb-page-title {
  font-family: 'Poppins', sans-serif;
  font-size: 36px;
  font-weight: 600;
  color: #395E74;
  margin-bottom: 10px;
}
.bnb-page-subtitle {
  font-size: 18px;
  color: #4F5962;
  margin-bottom: 40px;
}

/* Section headings */
.bnb-section-title {
  font-family: 'Poppins', sans-serif;
  font-size: 28px;
  font-weight: 600;
  color: #395E74;
  margin-bottom: 15px;
}
.bnb-section-subtitle {
  font-family: 'Poppins', sans-serif;
  font-size: 22px;
  font-weight: 600;
  color: #395E74;
  margin-top: 30px;
  margin-bottom: 15px;
}

/* FAQ section headers */
.bnb-faq-section {
  font-family: 'Poppins', sans-serif;
  font-size: 26px;
  font-weight: 600;
  color: #395E74;
  margin-top: 50px;
  margin-bottom: 20px;
  border-bottom: 2px solid #EDF9F9;
  padding-bottom: 10px;
}

/* FAQ accordion */
.bnb-faq-item {
  margin-bottom: 15px;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
}
.bnb-faq-question {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #333;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bnb-faq-question::-webkit-details-marker { display: none; }
.bnb-faq-toggle {
  font-size: 20px;
  color: #395E74;
  transition: transform 0.2s;
}
details[open] .bnb-faq-toggle {
  transform: rotate(45deg);
  display: inline-block;
}
.bnb-faq-answer {
  font-size: 16px;
  line-height: 1.7;
  color: #4F5962;
  margin-top: 12px;
  animation: bnbFadeIn 0.3s ease-in;
}
@keyframes bnbFadeIn {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Body text */
.bnb-body {
  font-size: 16px;
  line-height: 1.8;
  color: #4F5962;
  margin-bottom: 20px;
}
.bnb-body-italic {
  font-size: 16px;
  line-height: 1.8;
  color: #4F5962;
  font-style: italic;
}

/* Lists */
.bnb-feature-list {
  font-size: 16px;
  line-height: 1.8;
  color: #4F5962;
  margin-bottom: 20px;
  padding-left: 20px;
}
.bnb-feature-list li {
  margin-bottom: 12px;
}
.bnb-simple-list li {
  margin-bottom: 8px;
}

/* CTA sections */
.bnb-cta-section {
  text-align: center;
  padding: 50px 40px;
  background: #EDF9F9;
  margin: 20px 0;
}
.bnb-cta-section h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 28px;
  font-weight: 600;
  color: #395E74;
  margin-bottom: 12px;
}
.bnb-cta-section p {
  font-size: 17px;
  color: #4F5962;
  margin-bottom: 25px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* CTA buttons */
.bnb-btn-primary {
  display: inline-block;
  padding: 16px 40px;
  background-color: #FFCC41;
  color: #1a1a1a;
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 500;
  border-radius: 5px;
  text-decoration: none;
}
.bnb-btn-secondary {
  display: inline-block;
  padding: 14px 40px;
  background-color: #395E74;
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 500;
  border-radius: 5px;
  text-decoration: none;
}
.bnb-cta-inline {
  text-align: center;
  margin: 50px 0 30px;
}
.bnb-cta-inline p,
.bnb-cta-inline .bnb-page-subtitle {
  margin-bottom: 25px !important;
}
.bnb-cta-inline .bnb-btn-secondary,
.bnb-cta-inline .bnb-btn-primary {
  margin-top: 10px;
}

/* Blog cards */
.bnb-blog-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
}
.bnb-blog-card {
  display: block;
  padding: 30px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  text-decoration: none;
  transition: box-shadow 0.2s;
}
.bnb-blog-card:hover {
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.bnb-blog-date {
  font-size: 13px;
  color: #999;
  margin-bottom: 5px;
}
.bnb-blog-title {
  font-family: 'Poppins', sans-serif;
  font-size: 22px;
  font-weight: 600;
  color: #395E74;
  margin-bottom: 10px;
}
.bnb-blog-excerpt {
  font-size: 15px;
  line-height: 1.6;
  color: #4F5962;
}

/* Blog post byline */
.bnb-byline {
  font-size: 14px;
  color: #999;
  margin-bottom: 5px;
}

/* 404 page */
.bnb-404-title {
  font-family: 'Poppins', sans-serif;
  font-size: 48px;
  font-weight: 600;
  color: #395E74;
  margin-bottom: 10px;
}
.bnb-404-subtitle {
  font-family: 'Poppins', sans-serif;
  font-size: 24px;
  font-weight: 500;
  color: #333;
  margin-bottom: 20px;
}
.bnb-btn-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 30px;
}
.bnb-btn-outline {
  display: inline-block;
  padding: 14px 30px;
  background-color: transparent;
  color: #395E74;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 500;
  border-radius: 5px;
  text-decoration: none;
  border: 2px solid #395E74;
}

/* Coming soon / notice banner */
.bnb-notice {
  background: #FFF8E1;
  border-left: 4px solid #FFCC41;
  padding: 16px 20px;
  margin-bottom: 30px;
  border-radius: 0 8px 8px 0;
  font-size: 15px;
  line-height: 1.6;
  color: #4F5962;
}
.bnb-notice a {
  color: #395E74;
  font-weight: 600;
}

/* Inline link style */
.bnb-link {
  color: #395E74;
  text-decoration: underline;
}

/* Mobile overrides for custom content */
@media (max-width: 767px) {
  .bnb-content,
  .bnb-content-wide {
    padding: 20px 16px !important;
  }
  .bnb-page-title {
    font-size: 28px;
  }
  .bnb-section-title {
    font-size: 24px;
  }
  .bnb-cta-section {
    padding: 30px 16px;
  }
  .bnb-btn-primary,
  .bnb-btn-secondary {
    font-size: 16px;
    padding: 14px 30px;
  }
}

/* Hide compare panel close button */
.close-compare-panel {
  display: none !important;
}

/* Hide booking search widget if it leaks through */
.search-wrap,
.homey-search-wrap,
.search-calendar-wrap {
  display: none !important;
}

/* Chat widget - prevent overlap on mobile */
@media (max-width: 767px) {
  #bnbnerd-chat-widget,
  [id*="chat-widget"],
  iframe[src*="chat"],
  div[style*="position: fixed"][style*="bottom"] {
    bottom: 10px !important;
    right: 10px !important;
    max-width: 50px !important;
    max-height: 50px !important;
    z-index: 999 !important;
  }

  /* Push chat widget higher on homepage to avoid CTA overlap */
  .elementor-3344 [id*="chat-widget"],
  .elementor-3344 iframe[src*="chat"] {
    bottom: 80px !important;
  }

  /* Compact footer on mobile */
  .footer-top-wrap .widget-title {
    margin-bottom: 8px !important;
    font-size: 18px !important;
  }
  .footer-top-wrap .menu li {
    padding: 3px 0 !important;
  }
  .footer-top-wrap .widget-body p {
    font-size: 14px !important;
  }
}

/* --- Static hero background: real flagship property (The Chateau) ---
   The Elementor slideshow background is JS-painted and blank on the static
   export. Point .hero-section at a real, optimized, LOCAL property image
   (survives production cutover — not an external bnbnerd.com URL) with a
   contrast scrim so the white H1/CTA stay readable. WebP via image-set,
   optimized JPEG fallback. Source: BnBNerd-owned, via Hostfully. */
.hero-section {
  background-image:
    linear-gradient(rgba(22,42,56,.55), rgba(22,42,56,.45)),
    url('/wp-content/uploads/2026/05/chateau-pool-hero.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.hero-section {
  background-image:
    linear-gradient(rgba(22,42,56,.55), rgba(22,42,56,.45)),
    -webkit-image-set(url('/wp-content/uploads/2026/05/chateau-pool-hero.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-pool-hero.jpg') type('image/jpeg'));
  background-image:
    linear-gradient(rgba(22,42,56,.55), rgba(22,42,56,.45)),
    image-set(url('/wp-content/uploads/2026/05/chateau-pool-hero.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-pool-hero.jpg') type('image/jpeg'));
}
.hero-section .elementor-background-overlay { background-color: transparent; }

/* --- Real-property section backgrounds (3120-web-imagery audit 2026-05-15) ---
   Replaces AI-generated / clipart / generic-stock section backgrounds with
   optimized, owned Chateau/Deer Park photography (via Hostfully), and serves
   the optimized versions of the two license-clean Unsplash keepers. Overrides
   the vendor post-<id>.css by selector + !important; each rule covers BOTH the
   static case (background on the element) and the JS case (motion-effects
   layer). WebP via image-set with optimized-JPEG fallback. */
.elementor-4618 .elementor-element.elementor-element-76e31f8,
.elementor-4618 .elementor-element.elementor-element-76e31f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/chateau-living.jpg') !important; }
.elementor-4618 .elementor-element.elementor-element-76e31f8,
.elementor-4618 .elementor-element.elementor-element-76e31f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/chateau-living.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-living.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/chateau-living.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-living.jpg') type('image/jpeg')) !important; }

.elementor-1063 .elementor-element.elementor-element-59feea6,
.elementor-1063 .elementor-element.elementor-element-59feea6 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/deerpark-living.jpg') !important; }
.elementor-1063 .elementor-element.elementor-element-59feea6,
.elementor-1063 .elementor-element.elementor-element-59feea6 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/deerpark-living.webp') type('image/webp'), url('/wp-content/uploads/2026/05/deerpark-living.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/deerpark-living.webp') type('image/webp'), url('/wp-content/uploads/2026/05/deerpark-living.jpg') type('image/jpeg')) !important; }

.elementor-4500 .elementor-element.elementor-element-59feea6,
.elementor-4500 .elementor-element.elementor-element-59feea6 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/chateau-patio.jpg') !important; }
.elementor-4500 .elementor-element.elementor-element-59feea6,
.elementor-4500 .elementor-element.elementor-element-59feea6 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/chateau-patio.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-patio.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/chateau-patio.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-patio.jpg') type('image/jpeg')) !important; }

.elementor-5114 .elementor-element.elementor-element-79019ef,
.elementor-5114 .elementor-element.elementor-element-79019ef > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/chateau-kitchen.jpg') !important; }
.elementor-5114 .elementor-element.elementor-element-79019ef,
.elementor-5114 .elementor-element.elementor-element-79019ef > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/chateau-kitchen.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-kitchen.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/chateau-kitchen.webp') type('image/webp'), url('/wp-content/uploads/2026/05/chateau-kitchen.jpg') type('image/jpeg')) !important; }

.elementor-4960 .elementor-element.elementor-element-50cc4e26,
.elementor-4960 .elementor-element.elementor-element-50cc4e26 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/deerpark-kitchen.jpg') !important; }
.elementor-4960 .elementor-element.elementor-element-50cc4e26,
.elementor-4960 .elementor-element.elementor-element-50cc4e26 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/deerpark-kitchen.webp') type('image/webp'), url('/wp-content/uploads/2026/05/deerpark-kitchen.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/deerpark-kitchen.webp') type('image/webp'), url('/wp-content/uploads/2026/05/deerpark-kitchen.jpg') type('image/jpeg')) !important; }

.elementor-5103 .elementor-element.elementor-element-b3b7842,
.elementor-5103 .elementor-element.elementor-element-b3b7842 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/unsplash-architecture.jpg') !important; }
.elementor-5103 .elementor-element.elementor-element-b3b7842,
.elementor-5103 .elementor-element.elementor-element-b3b7842 > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/unsplash-architecture.webp') type('image/webp'), url('/wp-content/uploads/2026/05/unsplash-architecture.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/unsplash-architecture.webp') type('image/webp'), url('/wp-content/uploads/2026/05/unsplash-architecture.jpg') type('image/jpeg')) !important; }

.elementor-5093 .elementor-element.elementor-element-18280aa,
.elementor-5093 .elementor-element.elementor-element-18280aa > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: url('/wp-content/uploads/2026/05/unsplash-desk.jpg') !important; }
.elementor-5093 .elementor-element.elementor-element-18280aa,
.elementor-5093 .elementor-element.elementor-element-18280aa > .elementor-motion-effects-container > .elementor-motion-effects-layer { background-image: -webkit-image-set(url('/wp-content/uploads/2026/05/unsplash-desk.webp') type('image/webp'), url('/wp-content/uploads/2026/05/unsplash-desk.jpg') type('image/jpeg')) !important; background-image: image-set(url('/wp-content/uploads/2026/05/unsplash-desk.webp') type('image/webp'), url('/wp-content/uploads/2026/05/unsplash-desk.jpg') type('image/jpeg')) !important; }
