/* ═══════════════════════════════════════════════════════════════════
   ESTAMPES VILLA — Layout Fix v2
   Uses "html body" prefix throughout for maximum specificity over
   WordPress 6.7 / Gutenberg inline styles and block library CSS.
═══════════════════════════════════════════════════════════════════ */

/* ─── 1. ROOT WRAPPERS ──────────────────────────────────────────── */

html body .wp-site-blocks,
html body .wp-site-blocks > * {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body #page,
html body .site,
html body .site-content,
html body #content,
html body .entry-content,
html body .post-content,
html body article.est-onepage,
html body article.page {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

html body .entry-content > *,
html body .post-content > * {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 100% !important;
}
html body .is-layout-flow > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 100% !important;
}

/* ─── 2. HERO ───────────────────────────────────────────────────── */

html body .est-hero {
  position: relative !important;
  width: 100% !important;
  max-width: 100vw !important;
  height: 100vh !important;
  min-height: 640px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: flex-end !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

html body .est-hero .est-hero-media,
html body .est-hero .wp-block-video,
html body .est-hero .est-hero-media > .wp-block-group {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  z-index: 0 !important;
}

html body .est-hero video,
html body .est-hero .wp-block-video video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

html body .est-hero::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: linear-gradient(to top, rgba(26,23,20,0.78) 0%, rgba(26,23,20,0.22) 45%, rgba(26,23,20,0.06) 100%) !important;
  pointer-events: none !important;
}

html body .est-hero .est-hero-content,
html body .est-hero > .wp-block-group.est-hero-content {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 80px 88px !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  background: none !important;
}

html body .est-hero .est-hero-content .wp-block-heading,
html body .est-hero .est-hero-content .wp-block-paragraph,
html body .est-hero .est-hero-content .wp-block-buttons {
  max-width: 700px !important;
  width: 100% !important;
}

html body .est-hero h1,
html body .est-hero .est-hero-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: clamp(2.8rem, 5.5vw, 5.2rem) !important;
  font-weight: 300 !important;
  line-height: 1.08 !important;
  color: #faf8f4 !important;
  text-shadow: 0 2px 40px rgba(0,0,0,0.25) !important;
  letter-spacing: -0.01em !important;
  text-align: left !important;
  margin-bottom: 22px !important;
}

html body .est-hero .est-hero-sub {
  font-size: 0.9rem !important;
  font-weight: 300 !important;
  color: rgba(250,248,244,0.68) !important;
  max-width: 440px !important;
  margin-bottom: 40px !important;
  text-align: left !important;
}

/* ─── 3. HERO BUTTONS ───────────────────────────────────────────── */

html body .est-hero .wp-block-buttons {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 !important;
}

html body .est-hero .wp-block-button { margin: 0 !important; }

html body .est-hero .is-style-est-btn-primary .wp-block-button__link {
  background: #faf8f4 !important;
  color: #2d2820 !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.63rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  padding: 14px 32px !important;
  box-shadow: none !important;
}

html body .est-hero .is-style-est-btn-ghost .wp-block-button__link {
  background: transparent !important;
  color: #faf8f4 !important;
  border: none !important;
  border-bottom: 1px solid rgba(250,248,244,0.45) !important;
  border-radius: 0 !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.63rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  padding: 14px 0 !important;
  box-shadow: none !important;
}

/* ─── 4. NAV ────────────────────────────────────────────────────── */

html body #est-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  max-width: none !important;
}

/* ─── 5. ALL SECTIONS FULL WIDTH ────────────────────────────────── */

html body .est-section-snapshot,
html body .est-stats-bar,
html body .est-section-spaces,
html body .est-section-quote,
html body .est-section-gallery,
html body .est-section-services,
html body .est-section-inquiry {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* ─── 6. SNAPSHOT SECTION ───────────────────────────────────────── */

html body .est-snapshot-grid.wp-block-columns {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 80px !important;
  max-width: 1280px !important;
  margin: 0 auto 80px !important;
  padding: 0 80px !important;
  align-items: start !important;
  flex-wrap: unset !important;
}

html body .est-snapshot-grid > .wp-block-column {
  width: auto !important;
  flex-basis: auto !important;
  flex-grow: 0 !important;
  margin: 0 !important;
}

html body .est-island-grid.wp-block-columns {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 80px !important;
  flex-wrap: unset !important;
  border-top: 1px solid #e8e0d0 !important;
  border-bottom: 1px solid #e8e0d0 !important;
}

html body .est-island-grid > .wp-block-column { width: auto !important; flex-basis: auto !important; flex-grow: 0 !important; margin: 0 !important; }
html body .est-island-text { padding: 52px 60px 52px 0 !important; border-right: 1px solid #e8e0d0 !important; }
html body .est-distances   { padding: 52px 0 52px 60px !important; }

/* ─── 7. STATS BAR ──────────────────────────────────────────────── */

html body .est-stats-bar { background: #1a1714 !important; padding: 64px 80px !important; }

html body .est-stats-inner.wp-block-columns {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0 !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  flex-wrap: unset !important;
}

html body .est-stats-inner > .wp-block-column { width: auto !important; flex-basis: auto !important; flex-grow: 0 !important; margin: 0 !important; }

/* ─── 8. SPACES SECTION ─────────────────────────────────────────── */

html body .est-spaces-header {
  max-width: 1280px !important;
  margin: 0 auto 72px !important;
  padding: 0 80px !important;
}

html body .est-space-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 540px !important;
  margin-bottom: 3px !important;
  flex-wrap: unset !important;
}

html body .est-space-row > .wp-block-group {
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  flex-basis: auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
}

html body .est-space-row > .wp-block-group.est-space-image {
  overflow: hidden !important;
  position: relative !important;
  min-height: 480px !important;
  padding: 0 !important;
}

html body .est-space-row > .wp-block-group.est-space-image figure,
html body .est-space-row > .wp-block-group.est-space-image .wp-block-image {
  height: 100% !important;
  margin: 0 !important;
  max-width: none !important;
}

html body .est-space-row > .wp-block-group.est-space-image img {
  width: 100% !important;
  height: 100% !important;
  min-height: 480px !important;
  object-fit: cover !important;
  max-width: none !important;
  display: block !important;
}

html body .est-space-row > .wp-block-group.est-space-content {
  padding: 72px 80px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  background: #f5f0e8 !important;
}

html body .est-space-row.est-reversed > .wp-block-group.est-space-content { background: #faf8f4 !important; }
html body .est-space-row.est-reversed { direction: rtl !important; }
html body .est-space-row.est-reversed > * { direction: ltr !important; }

/* Pool house */
html body .est-pool-house {
  position: relative !important;
  min-height: 440px !important;
  display: flex !important;
  align-items: flex-end !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body .est-pool-house > .wp-block-image,
html body .est-pool-house > .wp-block-image img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  margin: 0 !important;
  z-index: 0 !important;
}

html body .est-pool-house::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to top, rgba(26,23,20,0.78) 0%, rgba(26,23,20,0.1) 60%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

html body .est-pool-house .est-pool-house-content {
  position: relative !important;
  z-index: 2 !important;
  padding: 56px 80px !important;
  max-width: 640px !important;
}

html body .est-pool-house .est-pool-house-content h3 { color: #faf8f4 !important; }
html body .est-pool-house .est-pool-house-content p  { color: rgba(250,248,244,0.72) !important; }

/* ─── 9. PULL QUOTE ─────────────────────────────────────────────── */

html body .est-section-quote { padding: 100px 80px !important; text-align: center !important; background: #faf8f4 !important; }
html body .est-quote-inner   { max-width: 820px !important; margin: 0 auto !important; }

/* ─── 10. GALLERY ───────────────────────────────────────────────── */

html body .est-section-gallery {
  padding: 100px 0 100px 80px !important;
  overflow: hidden !important;
  background: #faf8f4 !important;
}

html body .est-gallery-header {
  max-width: calc(1280px + 80px) !important;
  padding-right: 80px !important;
  margin-bottom: 48px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
}

html body .est-gallery-viewport { overflow: hidden !important; width: 100% !important; }

html body .est-gallery-viewport .wp-block-gallery {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-template-columns: unset !important;
  columns: unset !important;
  transition: transform 0.55s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
  will-change: transform !important;
  align-items: stretch !important;
}

html body .est-gallery-viewport .wp-block-gallery figure.wp-block-image,
html body .est-gallery-viewport .wp-block-gallery .blocks-gallery-item {
  flex: 0 0 auto !important;
  width: calc((100vw - 80px - 54px) / 3.5) !important;
  margin: 0 !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  position: relative !important;
}

html body .est-gallery-viewport .wp-block-gallery figure img {
  width: 100% !important;
  height: 460px !important;
  object-fit: cover !important;
  display: block !important;
  max-width: none !important;
  transition: transform 0.55s ease !important;
}

html body .est-gallery-viewport .wp-block-gallery figure:hover img { transform: scale(1.04) !important; }

html body .est-gallery-viewport .wp-block-gallery figcaption,
html body .est-gallery-viewport .wp-block-gallery .wp-element-caption {
  position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 32px 16px 14px !important;
  font-size: 0.55rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(250,248,244,0.65) !important;
  background: linear-gradient(to top, rgba(26,23,20,0.5) 0%, transparent 100%) !important;
  text-align: left !important;
  margin: 0 !important;
}

/* ─── 11. SERVICES ──────────────────────────────────────────────── */

html body .est-section-services { padding: 120px 80px !important; background: #f5f0e8 !important; }

html body .est-services-grid.wp-block-columns {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 100px !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  align-items: center !important;
  flex-wrap: unset !important;
}

html body .est-services-grid > .wp-block-column { width: auto !important; flex-basis: auto !important; flex-grow: 0 !important; margin: 0 !important; }

/* ─── 12. INQUIRY ───────────────────────────────────────────────── */

html body .est-section-inquiry { padding: 140px 80px !important; background: #1a1714 !important; }
html body .est-inquiry-inner   { max-width: 680px !important; margin: 0 auto !important; text-align: center !important; }

/* ─── 13. RESPONSIVE ────────────────────────────────────────────── */

@media (max-width: 1024px) {
  html body .est-snapshot-grid.wp-block-columns,
  html body .est-island-grid.wp-block-columns    { padding: 0 40px !important; }
  html body .est-snapshot-grid.wp-block-columns  { gap: 48px !important; }
  html body .est-stats-bar                        { padding: 56px 40px !important; }
  html body .est-spaces-header                    { padding: 0 40px !important; }
  html body .est-space-row > .wp-block-group.est-space-content { padding: 56px 48px !important; }
  html body .est-pool-house .est-pool-house-content             { padding: 48px 40px !important; }
  html body .est-section-gallery                  { padding: 80px 0 80px 40px !important; }
  html body .est-gallery-header                   { padding-right: 40px !important; }
  html body .est-section-services                 { padding: 80px 40px !important; }
  html body .est-section-inquiry                  { padding: 100px 40px !important; }
  html body .est-hero .est-hero-content           { padding: 0 40px 72px !important; }
}

@media (max-width: 768px) {
  html body .est-hero .est-hero-content           { padding: 0 24px 60px !important; }
  html body .est-hero h1                          { font-size: clamp(2.2rem, 8vw, 3.2rem) !important; }
  html body .est-hero .wp-block-buttons           { flex-direction: column !important; align-items: flex-start !important; }

  html body .est-snapshot-grid.wp-block-columns,
  html body .est-island-grid.wp-block-columns     { grid-template-columns: 1fr !important; padding: 0 24px !important; }
  html body .est-island-text                      { border-right: none !important; border-bottom: 1px solid #e8e0d0 !important; padding: 40px 0 !important; }
  html body .est-distances                        { padding: 40px 0 !important; }

  html body .est-stats-bar                        { padding: 48px 24px !important; }
  html body .est-stats-inner.wp-block-columns     { grid-template-columns: repeat(2, 1fr) !important; }

  html body .est-spaces-header                    { padding: 0 24px !important; }
  html body .est-space-row                        { grid-template-columns: 1fr !important; direction: ltr !important; }
  html body .est-space-row > .wp-block-group.est-space-content { padding: 40px 24px !important; }
  html body .est-space-row > .wp-block-group.est-space-image img { min-height: 280px !important; height: 280px !important; }
  html body .est-pool-house                       { min-height: 360px !important; }
  html body .est-pool-house .est-pool-house-content { padding: 40px 24px !important; }

  html body .est-section-gallery                  { padding: 64px 0 64px 24px !important; }
  html body .est-gallery-header                   { padding-right: 24px !important; flex-wrap: wrap !important; gap: 20px !important; }
  html body .est-gallery-viewport .wp-block-gallery figure.wp-block-image { width: calc(100vw - 48px) !important; }
  html body .est-gallery-viewport .wp-block-gallery figure img              { height: 360px !important; }

  html body .est-section-services                 { padding: 64px 24px !important; }
  html body .est-services-grid.wp-block-columns   { grid-template-columns: 1fr !important; gap: 48px !important; }

  html body .est-section-inquiry                  { padding: 80px 24px !important; }
}

/* ─── 14. NAV LOGO FIX ──────────────────────────────────────────────
   Logo image was rendering oversized and centred.
   Force it small, left-aligned, no interference from WP custom-logo.
─────────────────────────────────────────────────────────────────── */

html body #est-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* The logo anchor wraps either text or an <img> */
html body #est-nav .est-nav-logo {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

/* WP custom-logo wraps in an extra <a> — flatten it */
html body #est-nav .est-nav-logo .custom-logo-link {
  display: flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

/* Cap the logo image height — never let it blow up */
html body #est-nav .est-nav-logo img,
html body #est-nav .est-nav-logo .custom-logo-link img,
html body #est-nav .custom-logo {
  height: 36px !important;
  width: auto !important;
  max-height: 36px !important;
  max-width: 180px !important;
  display: block !important;
  object-fit: contain !important;
  /* Invert to white when nav is over dark hero */
  filter: brightness(0) invert(1) !important;
  transition: filter 0.35s ease !important;
}

/* Once scrolled, show dark logo against light nav background */
html body #est-nav.scrolled .est-nav-logo img,
html body #est-nav.scrolled .custom-logo {
  filter: none !important;
}

/* Fallback text logo (if no image uploaded) */
html body #est-nav .est-nav-logo:not(:has(img)) {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #faf8f4 !important;
}
html body #est-nav.scrolled .est-nav-logo:not(:has(img)) {
  color: #2d2820 !important;
}

/* ─── 15. HERO TITLE: LEFT-ALIGN ────────────────────────────────────
   WP Gutenberg adds text-align: center via inline style when the
   block doesn't have an explicit alignment set.
─────────────────────────────────────────────────────────────────── */

html body .est-hero h1,
html body .est-hero h1.wp-block-heading,
html body .est-hero .est-hero-title,
html body .est-hero .wp-block-heading {
  text-align: left !important;
}

html body .est-hero .est-hero-eyebrow,
html body .est-hero .est-hero-sub,
html body .est-hero .wp-block-paragraph {
  text-align: left !important;
}

/* The hero content group itself must also be left-aligned */
html body .est-hero .est-hero-content,
html body .est-hero .est-hero-content > * {
  text-align: left !important;
}

/* ─── 16. CF7 NUMBER FIELD — STYLED STEPPER ─────────────────────────
   Replaces the browser default number input with a custom
   styled stepper matching the dark inquiry section aesthetic.
   The actual +/- buttons are injected via JS in main.js.
─────────────────────────────────────────────────────────────────── */

/* Wrapper the JS injects around number inputs */
html body .est-inquiry-form-wrap .est-number-wrap {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  border: 1px solid rgba(250,248,244,0.1) !important;
  background: rgba(250,248,244,0.04) !important;
  grid-column: 1 / -1 !important;
}

html body .est-inquiry-form-wrap .est-number-wrap input[type="number"] {
  /* Reset browser stepper arrows */
  -moz-appearance: textfield !important;
  appearance: textfield !important;
  border: none !important;
  background: transparent !important;
  flex: 1 !important;
  text-align: center !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 300 !important;
  color: #faf8f4 !important;
  letter-spacing: 0.04em !important;
  padding: 15px 0 !important;
  outline: none !important;
  width: 100% !important;
}

/* Hide browser's built-in spinner arrows */
html body .est-inquiry-form-wrap input[type="number"]::-webkit-inner-spin-button,
html body .est-inquiry-form-wrap input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Custom stepper buttons */
html body .est-number-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  min-width: 48px !important;
  background: transparent !important;
  border: none !important;
  color: rgba(250,248,244,0.45) !important;
  font-size: 1.2rem !important;
  font-weight: 300 !important;
  cursor: pointer !important;
  transition: color 0.25s, background 0.25s !important;
  line-height: 1 !important;
  padding: 0 !important;
  font-family: 'Jost', sans-serif !important;
  user-select: none !important;
}

html body .est-number-btn:hover {
  color: #faf8f4 !important;
  background: rgba(250,248,244,0.06) !important;
}

html body .est-number-btn:active {
  background: rgba(250,248,244,0.1) !important;
}

/* Dividers between button and input */
html body .est-number-btn-minus {
  border-right: 1px solid rgba(250,248,244,0.08) !important;
}
html body .est-number-btn-plus {
  border-left: 1px solid rgba(250,248,244,0.08) !important;
}

/* Guest count label shown above the stepper */
html body .est-number-label {
  display: block !important;
  color: rgba(250, 248, 244, 0.28) !important;
  text-align: left !important;
  grid-column: 1 / -1 !important;
  padding: 15px 20px;
  width: 100%;
}
.screen-reader-response {
    display: none;
}
/* Current value display inside stepper */
html body .est-number-wrap .est-number-value {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.4rem !important;
  font-weight: 300 !important;
  color: #faf8f4 !important;
  line-height: 1 !important;
  min-width: 48px !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 15px 12px !important;
  pointer-events: none !important;
}

/* ─── 17. SPACES: LEFT-ALIGN ALL TEXT ───────────────────────────────
   WP was centering list items and paragraphs inside space content
   blocks via inherited text-align from the block editor.
─────────────────────────────────────────────────────────────────── */

html body .est-space-content,
html body .est-space-content *,
html body .est-space-content .wp-block-list,
html body .est-space-content .wp-block-list li,
html body .est-space-content .wp-block-paragraph,
html body .est-space-content .wp-block-heading,
html body .est-space-content p,
html body .est-space-content h3,
html body .est-space-content ul,
html body .est-space-content li {
  text-align: left !important;
}

/* Pool house content — all left */
html body .est-pool-house-content,
html body .est-pool-house-content *,
html body .est-pool-house-content .wp-block-heading,
html body .est-pool-house-content .wp-block-paragraph,
html body .est-pool-house-content h3,
html body .est-pool-house-content p {
  text-align: left !important;
}

/* ─── 18. GALLERY HEADER: ARROWS PINNED RIGHT ───────────────────────
   The header row was constrained by max-width matching the content,
   pushing the arrows to centre. Force it to span the full section
   width minus the left padding, with right padding matching.
─────────────────────────────────────────────────────────────────── */

html body .est-section-gallery {
  position: relative !important;
}

html body .est-gallery-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  width: 100% !important;
  max-width: none !important;        /* remove the old 1280px cap */
  padding-right: 80px !important;    /* match the section's left padding */
  margin-bottom: 48px !important;
  box-sizing: border-box !important;
}

/* Title group stays left, controls stay right — make sure neither shrinks */
html body .est-gallery-header > .wp-block-group {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html body .est-gallery-controls {
  flex: 0 0 auto !important;
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  margin-left: auto !important;
}

@media (max-width: 1024px) {
  html body .est-gallery-header { padding-right: 40px !important; }
}
@media (max-width: 768px) {
  html body .est-gallery-header { padding-right: 24px !important; flex-wrap: wrap !important; gap: 16px !important; }
}

/* ─── 19. NAV LOGO — NESTED ANCHOR FIX ─────────────────────────────
   WP's the_custom_logo() outputs <a class="custom-logo-link"> inside
   our .est-nav-logo <a> — but header.php now uses wp_get_attachment_image()
   directly so there's no nested anchor. These rules handle both cases.
─────────────────────────────────────────────────────────────────── */

html body #est-nav .est-nav-logo {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
  line-height: 1 !important;
  padding: 0 !important;
}

/* The logo image — cap size always */
html body #est-nav .est-nav-logo img,
html body #est-nav .est-nav-logo .custom-logo {
  height: 38px !important;
  width: auto !important;
  max-height: 38px !important;
  max-width: 200px !important;
  display: block !important;
  object-fit: contain !important;
  /* White on dark hero */
  filter: brightness(0) invert(1) !important;
  transition: filter 0.35s ease !important;
}

/* Dark logo once nav has scrolled */
html body #est-nav.scrolled .est-nav-logo img,
html body #est-nav.scrolled .est-nav-logo .custom-logo {
  filter: none !important;
}

/* Fallback text logo */
html body #est-nav .est-nav-logo {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #faf8f4 !important;
  transition: color 0.35s ease !important;
}
html body #est-nav.scrolled .est-nav-logo {
  color: #2d2820 !important;
}

/* ─── 20. GALLERY HEADER — SPACE-BETWEEN OVERRIDE ──────────────────
   WP adds is-content-justification-space-between + a flex container
   class. Ensure our padding-right takes effect over WP's flex rules.
─────────────────────────────────────────────────────────────────── */

html body .est-section-gallery .est-gallery-header.wp-block-group {
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 80px !important;
  margin: 0 0 48px 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  flex-wrap: nowrap !important;
}

html body .est-section-gallery .est-gallery-header .est-gallery-controls {
  flex-shrink: 0 !important;
  margin-left: 24px !important;
}

@media (max-width: 1024px) {
  html body .est-section-gallery .est-gallery-header.wp-block-group { padding-right: 40px !important; }
}
@media (max-width: 768px) {
  html body .est-section-gallery .est-gallery-header.wp-block-group { padding-right: 24px !important; flex-wrap: wrap !important; }
}

/* ─── 21. FOOTER — HIDE DEFAULT WP WIDGETS ──────────────────────────
   The footer-about column has default WP Archives/Categories widgets.
   Hide them until real widgets are added via Appearance → Widgets.
─────────────────────────────────────────────────────────────────── */

html body #est-footer .widget_block .wp-block-archives,
html body #est-footer .widget_block .wp-block-categories,
html body #est-footer .widget_block h2.wp-block-heading {
  display: none !important;
}

/* ─── 22. WPCF7 HIDDEN FIELDS — REMOVE LAYOUT SPACE ────────────────
   CF7 renders a <fieldset class="hidden-fields-container"> which
   still takes up space in the grid even when display:none'd via CF7's
   own CSS. Force it completely out of the layout.
─────────────────────────────────────────────────────────────────── */

html body .hidden-fields-container,
html body .wpcf7 .hidden-fields-container {
  display: none !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
}

/* ─── 23. FORM GRID — FULL-WIDTH FIELDS ─────────────────────────────
   CF7 wraps each field in <p> tags. The .est-full class should span
   both columns. Also ensure name/email sit side by side correctly.
─────────────────────────────────────────────────────────────────── */

html body .est-inquiry-form-wrap .wpcf7-form {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
}

html body .est-inquiry-form-wrap .wpcf7-form > p {
  margin: 0 !important;
}

html body .est-inquiry-form-wrap .wpcf7-form > p.est-full,
html body .est-inquiry-form-wrap .wpcf7-form > .est-number-wrap {
  grid-column: 1 / -1 !important;
}

/* Name and email take one column each */
html body .est-inquiry-form-wrap .wpcf7-form > p:not(.est-full) {
  grid-column: span 1 !important;
}

@media (max-width: 768px) {
  html body .est-inquiry-form-wrap .wpcf7-form {
    grid-template-columns: 1fr !important;
  }
  html body .est-inquiry-form-wrap .wpcf7-form > p:not(.est-full) {
    grid-column: 1 / -1 !important;
  }
}

/* ─── 24. POOL HOUSE — ISOLATION FIX ───────────────────────────────
   The Lower Level list items were bleeding through because the pool
   house group wasn't creating a proper stacking context.
   Also: the image must be truly contained, content above it.
─────────────────────────────────────────────────────────────────── */

html body .est-pool-house {
  isolation: isolate !important;
  overflow: hidden !important;
  position: relative !important;
  min-height: 480px !important;
  display: flex !important;
  align-items: flex-end !important;
  width: 100% !important;
}

/* The background image — absolute fill, z-index 0 */
html body .est-pool-house > .wp-block-image,
html body .est-pool-house > figure.wp-block-image {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
}

html body .est-pool-house > .wp-block-image img,
html body .est-pool-house > figure.wp-block-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  max-width: none !important;
  display: block !important;
}

/* Dark gradient overlay — z-index 1 */
html body .est-pool-house::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: linear-gradient(
    to top,
    rgba(26,23,20,0.88) 0%,
    rgba(26,23,20,0.55) 40%,
    rgba(26,23,20,0.15) 100%
  ) !important;
  pointer-events: none !important;
}

/* Content block — z-index 2, sits above image and overlay */
html body .est-pool-house .est-pool-house-content,
html body .est-pool-house > .wp-block-group:not(.est-pool-house-bg) {
  position: relative !important;
  z-index: 2 !important;
  padding: 56px 80px !important;
  width: 100% !important;
  max-width: 680px !important;
}

/* All text in pool house is white */
html body .est-pool-house .est-pool-house-content h3,
html body .est-pool-house .est-pool-house-content .wp-block-heading,
html body .est-pool-house > .wp-block-group:not(.est-pool-house-bg) h3 {
  color: #faf8f4 !important;
  font-style: italic !important;
  font-size: 2.2rem !important;
  margin-bottom: 6px !important;
}

html body .est-pool-house .est-pool-house-content p,
html body .est-pool-house .est-pool-house-content .wp-block-paragraph,
html body .est-pool-house > .wp-block-group:not(.est-pool-house-bg) p {
  color: rgba(250,248,244,0.75) !important;
  font-size: 0.88rem !important;
  line-height: 1.8 !important;
}

/* Pool house room list — white version of the space-rooms style */
html body .est-pool-house .est-space-rooms,
html body .est-pool-house .wp-block-list {
  list-style: none !important;
  margin-top: 20px !important;
  padding: 0 !important;
}

html body .est-pool-house .est-space-rooms li,
html body .est-pool-house .wp-block-list li {
  font-size: 0.8rem !important;
  color: rgba(250,248,244,0.65) !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid rgba(250,248,244,0.12) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: left !important;
}

html body .est-pool-house .est-space-rooms li::before,
html body .est-pool-house .wp-block-list li::before {
  content: '' !important;
  display: block !important;
  width: 16px !important;
  height: 1px !important;
  background: rgba(250,248,244,0.4) !important;
  flex-shrink: 0 !important;
}

/* Ensure the space tag/label is also readable */
html body .est-pool-house .est-space-tag,
html body .est-pool-house .is-style-est-label {
  color: rgba(250,248,244,0.45) !important;
  margin-bottom: 18px !important;
  display: block !important;
}

@media (max-width: 768px) {
  html body .est-pool-house .est-pool-house-content,
  html body .est-pool-house > .wp-block-group:not(.est-pool-house-bg) {
    padding: 40px 24px !important;
  }
}