/* =========================================================
   RYAN CRAWLEY GOLF — Clean Unified CSS (Ixion + Fullscreen Hero)
   ========================================================= */

/* -------- Fonts & brand -------- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700;800&family=Inter:wght@400;500;600&display=swap');

:root{
  --rcg-green:#1F5E36;
  --rcg-green-600:#2C7A4A;
  --rcg-charcoal:#111C14;
  --rcg-offwhite:#F9F7F4;
  --rcg-text:#2B2B2B;
  --rcg-muted:#6B7280;
  --rcg-gold:#C5A572;
  --rcg-border:#E7E2D9;

  --font-heading:'Poppins',sans-serif;
  --font-body:'Inter',sans-serif;
}

/* -------- Global polish -------- */
html, body { overflow-x: hidden !important; }
body{ color:var(--rcg-text); background:#fff; font-family:var(--font-body); }
a{ color:var(--rcg-green); text-decoration:none; }
a:hover,a:focus{ color:var(--rcg-green-600); text-decoration:underline; text-decoration-color:var(--rcg-gold); text-underline-offset:2px; }
h1,h2,h3,h4{ color:var(--rcg-green); font-family:var(--font-heading); font-weight:700; line-height:1.2; }

/* Buttons */
.button,.btn,button,input[type="submit"],.wp-block-button__link{
  background:var(--rcg-green); color:#fff !important; border:1px solid var(--rcg-green);
  border-radius:10px; padding:12px 20px; font-weight:600;
}
.button:hover,.btn:hover,button:hover,input[type="submit"]:hover,.wp-block-button__link:hover{
  background:var(--rcg-green-600); border-color:var(--rcg-green-600);
}

/* Header (default pages) */
.site-header{ background:#fff; border-bottom:1px solid var(--rcg-border); }
.site-header a{ color:var(--rcg-text); }
.site-header a:hover{ color:var(--rcg-green); }

/* =========================================================
   HOME — Fullscreen video hero + header over video
   ========================================================= */

/* 0) Remove theme "header media" & top spacing on HOME (but keep header visible) */
.home .custom-header,
.home .custom-header-media,
.home .has-header-image .custom-header { display:none !important; }

.home .site-content,
.home .content-area,
.home #primary,
.home .hentry,
.home .entry-content { margin-top:0 !important; padding-top:0 !important; }

/* Hide any search/top utility rows on HOME that create a white band */
.home .top-header,
.home .top-bar,
.home .header-top,
.home .site-header .widget-area,
.home #masthead .widget-area,
.home .site-header .search-form,
.home .site-header .search-toggle,
.home .site-header .search-field,
.home .site-header .search-submit,
.home .site-header .search-icon,
.home .site-header .menu-search,
.home .site-header .header-search { display:none !important; }

/* If a Search block was placed as the first content block, hide it on HOME */
.home .entry-content > .wp-block-search:first-child { display:none !important; }

/* 1) Header sits over hero on HOME and is transparent */
.home .site-header,
.home #masthead{
  position:absolute !important;
  top:0; left:0; right:0;
  background:transparent !important;
  border:0 !important; box-shadow:none !important;
  margin:0 !important; padding:0 !important;
  z-index:1000;
}
.home .site-header a,
.home #masthead a { color:#fff !important; }
.home .site-header a:hover,
.home #masthead a:hover { color:var(--rcg-gold) !important; }

/* 2) True full-bleed for Gutenberg Full width blocks on HOME */
.home .entry-content > .alignfull,
.home .entry-content > .wp-block-cover.alignfull,
.home .entry-content > .wp-block-group.alignfull,
.home .site-content .entry-content > .alignfull,
.home .site-content .entry-content > .wp-block-cover.alignfull,
.home .site-content .entry-content > .wp-block-group.alignfull,
.wp-site-blocks > .wp-block-cover.alignfull,
.wp-site-blocks > .wp-block-group.alignfull{
  position:relative !important;
  width:100vw !important; max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  left:0 !important; right:0 !important;
  overflow:hidden !important;
}

/* 3) First Cover (or a Cover with class "home-hero") becomes the fullscreen hero */
.home .wp-block-cover:first-of-type,
.home .wp-block-cover-image:first-of-type,
.home .home-hero.wp-block-cover,
.home .home-hero.wp-block-cover-image{
  min-height:100svh !important;
  min-height:100vh !important;
  border-radius:0 !important;
  margin-top:0 !important;
}

/* 4) Video/image actually fills the frame */
.home .wp-block-cover:first-of-type .wp-block-cover__video-background,
.home .wp-block-cover:first-of-type .wp-block-cover__image-background,
.home .home-hero .wp-block-cover__video-background,
.home .home-hero .wp-block-cover__image-background{
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important;
  object-fit:cover !important; object-position:50% 50% !important;
  display:block !important; opacity:1 !important; z-index:0 !important;
}

/* 5) Hero inner content */
.home .wp-block-cover:first-of-type .wp-block-cover__inner-container,
.home .home-hero .wp-block-cover__inner-container{
  position:relative !important; z-index:2 !important;
  display:grid !important; align-content:end !important; justify-items:start !important;
  gap:10px !important;
  padding:clamp(96px,14vh,140px) clamp(24px,6vw,120px) clamp(64px,10vh,140px) clamp(24px,6vw,120px) !important;
  max-width:1200px !important; margin-inline:auto !important;
}

/* Hero overlay */
.home .wp-block-cover.hero-overlay::before,
.home .home-hero.hero-overlay::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.28) 40%,
    rgba(0,0,0,.16) 70%,
    rgba(0,0,0,.10) 100%);
  mix-blend-mode:multiply; pointer-events:none; z-index:1;
}

/* Hero typography */
.home .home-hero h1{
  font-family:var(--font-heading); font-weight:800;
  font-size:clamp(2.2rem,5.8vw,3.8rem); color:#fff;
  line-height:1.08; letter-spacing:.02em;
}
.home .home-hero p{
  font-family:var(--font-body); color:rgba(255,255,255,.9);
  font-size:clamp(1rem,2vw,1.25rem); max-width:60ch;
}

/* =========================================================
   SECTION BACKGROUNDS
   ========================================================= */
.section--offwhite{ background:var(--rcg-offwhite); position:relative; }
.section--dark{ background:var(--rcg-charcoal); color:#fff; position:relative; }
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4{ color:#fff; }
.section--dark a{ color:#fff; } .section--dark a:hover{ color:var(--rcg-gold); }

/* =========================================================
   ABOUT RYAN — full-width breakout section
   ========================================================= */
.home .entry-content > .wp-block-group.about-ryan,
.home .entry-content > .about-ryan {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
  background: #fffefb;
  padding: clamp(40px, 6vw, 90px) 0 !important;
}

.about-ryan .about-inner {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: 0 clamp(20px, 4vw, 60px) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: clamp(24px, 4vw, 64px) !important;
  align-items: center !important;
}

.about-ryan .about-inner img {
  flex: 1 1 350px;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.about-ryan .about-inner > div {
  flex: 1 1 550px;
  line-height: 1.8;
  max-width: 65ch;
}

@media (max-width: 768px) {
  .about-ryan .about-inner { flex-direction: column !important; gap: 24px !important; }
  .about-ryan .about-inner > div { max-width: 100% !important; }
}

/* =========================================================
   MISC FIXES
   ========================================================= */
body.admin-bar #wpadminbar { position: fixed; top: 0; }

/* =========================
   Full-bleed helper (safe)
   ========================= */
.home .entry-content > .band-full,
.home .entry-content > .wp-block-group.band-full,
.home .entry-content .wp-block-group > .wp-block-group.band-full {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
  overflow: visible !important;           /* so badges/images aren't clipped */
}

/* Center an "inner" row inside any band */
.band-full > .tour-inner,
.band-full > .about-inner {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: 0 clamp(20px, 4vw, 60px) !important;
}

/* =========================
   TOUR QUALITY — layout
   ========================= */
.band-full.tour-quality {
  background: #f9f9f7;                    /* light tint */
  padding: clamp(40px, 6vw, 90px) 0 !important;
}

/* Use flex so your 2 columns wrap nicely on small screens */
.tour-inner {
  display: flex !important;
  gap: clamp(24px, 4vw, 64px) !important;
  align-items: flex-start !important;
  flex-wrap: wrap !important;
}
.tour-inner > .wp-block-column { min-width: 300px; }
.tour-inner img { width: 100%; height: auto; border-radius: 10px; }

/* =========================
   ABOUT RYAN — layout
   ========================= */
.band-full.about-ryan {
  background: #fffefb;                     /* subtle warm tint */
  padding: clamp(40px, 6vw, 90px) 0 !important;
}

/* Small polish: avoid accidental clipping by theme wrappers */
.home .wrap,
.home .site-content,
.home .entry-content { overflow: visible !important; }

/* ===== Full-bleed breakout for 2 sections (safe, scoped) ===== */

/* Make the section band span the viewport */
.home .entry-content > .wp-block-group.tour-quality,
.home .entry-content > .wp-block-group.about-ryan {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

/* Inner max-width container */
.tour-quality .tour-inner,
.about-ryan .about-inner {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: 0 clamp(20px, 4vw, 60px) !important;
}

/* ===== Restore/keep Gutenberg Columns behavior (66/33, gaps, wrapping) ===== */
.tour-quality .tour-inner.wp-block-columns,
.about-ryan  .about-inner.wp-block-columns {
  display: flex !important;           /* ensure flex, not grid */
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: clamp(24px, 4vw, 64px) !important;
}

/* Let Gutenberg’s inline flex-basis control 66/33; don't cap widths */
.tour-quality .tour-inner .wp-block-column,
.about-ryan  .about-inner .wp-block-column {
  min-width: 0 !important;            /* prevents unwanted wrapping */
  max-width: none !important;         /* avoids equalizing columns */
}

/* Image hygiene inside these sections only */
.tour-quality .tour-inner img,
.about-ryan  .about-inner img {
  width: 100% !important;
  height: auto !important;
  border-radius: 12px;
  display: block;
}

/* Stack on phones */
@media (max-width: 768px) {
  .tour-quality .tour-inner,
  .about-ryan  .about-inner {
    flex-direction: column !important;
    gap: 24px !important;
  }
}

/* ===== Fix: stop Columns stacking on desktop for these two sections ===== */

/* Force real row layout on desktop; only stack on small screens */
@media (min-width: 900px) {
  .tour-quality .tour-inner,
  .about-ryan  .about-inner,
  .tour-quality .wp-block-columns,
  .about-ryan  .wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;   /* don't wrap into a new row */
    gap: clamp(24px, 4vw, 64px) !important;
    align-items: flex-start !important;
  }

  /* prevent any width caps that cause wrapping */
  .tour-quality .wp-block-column,
  .about-ryan  .wp-block-column {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
  }
}

/* Still stack on phones/tablets */
@media (max-width: 899.98px) {
  .tour-quality .tour-inner,
  .about-ryan  .about-inner,
  .tour-quality .wp-block-columns,
  .about-ryan  .wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 24px !important;
  }
}

/* Safety: if any previous code set grid, kill it */
.tour-quality .tour-inner,
.about-ryan  .about-inner {
  display: flex !important;
}

/* ===== FINAL HARD OVERRIDES (Tour Quality + About Ryan) ===== */

/* Make sure these two sections are true two-column on desktop */
@media (min-width: 900px) {
  .tour-quality .wp-block-columns,
  .about-ryan  .wp-block-columns,
  .tour-quality .tour-inner,
  .about-ryan  .about-inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;        /* don't drop to a new line */
    gap: clamp(24px, 4vw, 64px) !important;
    align-items: flex-start !important;
  }

  /* Let Gutenberg control 66/33 via its inline flex-basis; never force a wrap */
  .tour-quality .wp-block-columns > .wp-block-column,
  .about-ryan  .wp-block-columns > .wp-block-column,
  .tour-quality .tour-inner > .wp-block-column,
  .about-ryan  .about-inner > .wp-block-column {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    flex-grow: 0 !important; /* prevent equalizing widths */
  }
}

/* Stack only on tablets/phones */
@media (max-width: 899.98px) {
  .tour-quality .wp-block-columns,
  .about-ryan  .wp-block-columns,
  .tour-quality .tour-inner,
  .about-ryan  .about-inner {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 24px !important;
  }
}

/* Safety: kill any stray grid declarations that slipped in */
.tour-quality .tour-inner,
.about-ryan  .about-inner {
  display: flex !important;
}

/* =========================================================
   🔧 FINAL OVERRIDE — Restore 2-Column Layout for Tour Quality + About Ryan
   ========================================================= */

/* Stop any theme CSS from stacking or changing column layout */
.tour-quality .wp-block-columns,
.about-ryan  .wp-block-columns {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: clamp(24px, 4vw, 64px) !important;
}

/* Make sure both columns have their correct proportional widths */
.tour-quality .wp-block-columns > .wp-block-column:first-child,
.about-ryan  .wp-block-columns > .wp-block-column:first-child {
  flex: 0 0 66% !important;
  max-width: 66% !important;
}
.tour-quality .wp-block-columns > .wp-block-column:last-child,
.about-ryan  .wp-block-columns > .wp-block-column:last-child {
  flex: 0 0 33% !important;
  max-width: 33% !important;
}

/* Prevent any full-width column bug */
.tour-quality .wp-block-column,
.about-ryan  .wp-block-column {
  min-width: 0 !important;
  width: auto !important;
}

/* Stack only on small screens */
@media (max-width: 900px) {
  .tour-quality .wp-block-columns,
  .about-ryan  .wp-block-columns {
    flex-direction: column !important;
  }
  .tour-quality .wp-block-columns > .wp-block-column,
  .about-ryan  .wp-block-columns > .wp-block-column {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}

/* =========================================================
   CLEAN LAYOUT — Tour Quality & About Ryan
   ========================================================= */

/* Full-width group band */
.band-full {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

.band-full .wp-block-columns {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: clamp(40px, 6vw, 90px) clamp(20px, 4vw, 60px) !important;
}

/* Column behavior — 2 across desktop, stacked mobile */
@media (min-width: 900px) {
  .band-full .wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: clamp(24px, 4vw, 64px) !important;
  }

  .band-full .wp-block-column:first-child { flex: 0 0 66% !important; }
  .band-full .wp-block-column:last-child { flex: 0 0 33% !important; }
}

@media (max-width: 899px) {
  .band-full .wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  .band-full .wp-block-column {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}

/* =========================================================
   ✅ FINAL WORKING FIX — About Ryan + Tour Quality
   ========================================================= */

/* Keep both sections full-width */
.band-full {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

/* Center and constrain the inner content */
.tour-inner,
.about-inner {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: clamp(40px, 6vw, 90px) clamp(20px, 4vw, 60px) !important;
}

/* ----- Desktop: 2 columns side by side ----- */
@media (min-width: 900px) {
  .tour-inner.wp-block-columns,
  .about-inner.wp-block-columns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: clamp(24px, 4vw, 64px) !important;
  }

  .tour-inner.wp-block-columns > .wp-block-column:first-child,
  .about-inner.wp-block-columns > .wp-block-column:first-child {
    flex: 0 0 66% !important;
    max-width: 66% !important;
  }

  .tour-inner.wp-block-columns > .wp-block-column:last-child,
  .about-inner.wp-block-columns > .wp-block-column:last-child {
    flex: 0 0 33% !important;
    max-width: 33% !important;
  }
}

/* ----- Mobile: stack columns ----- */
@media (max-width: 899.98px) {
  .tour-inner.wp-block-columns,
  .about-inner.wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  .tour-inner.wp-block-columns > .wp-block-column,
  .about-inner.wp-block-columns > .wp-block-column {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}

/* ===== Full-bleed band for Groups with class 'band-full' ===== */
.band-full{
  position:relative!important;
  left:50%!important; right:50%!important;
  margin-left:-50vw!important; margin-right:-50vw!important;
  width:100vw!important; max-width:100vw!important;
  box-sizing:border-box!important;
}

/* Center the Columns row inside the band */
.band-full > .wp-block-columns{
  max-width:1150px!important;
  margin:0 auto!important;
  padding:clamp(40px,6vw,90px) clamp(20px,4vw,60px)!important;
  box-sizing:border-box!important;
}

/* Some themes nest an extra Group around Columns—cover that too */
.band-full > .wp-block-group > .wp-block-columns{
  max-width:1150px!important;
  margin:0 auto!important;
  padding:clamp(40px,6vw,90px) clamp(20px,4vw,60px)!important;
  box-sizing:border-box!important;
}

/* —— DESKTOP: force two columns side-by-side —— */
@media (min-width:900px){
  .band-full > .wp-block-columns,
  .band-full > .wp-block-group > .wp-block-columns,
  .band-full .wp-block-columns.is-layout-flex{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:clamp(24px,4vw,64px)!important;
  }
  /* 66 / 33 split */
  .band-full .wp-block-columns > .wp-block-column:first-child{ flex:0 0 66%!important; max-width:66%!important; }
  .band-full .wp-block-columns > .wp-block-column:last-child{  flex:0 0 33%!important; max-width:33%!important; }
  /* safety: don't let hidden rules force 100% */
  .band-full .wp-block-column{
    min-width:0!important; width:auto!important; max-width:none!important; flex-grow:0!important;
  }
}

/* —— MOBILE/TABLET: stack —— */
@media (max-width:899.98px){
  .band-full .wp-block-columns{
    display:flex!important; flex-direction:column!important; gap:24px!important;
  }
  .band-full .wp-block-column{
    flex:1 1 100%!important; max-width:100%!important;
  }
}

/* ===== TOUR QUALITY — hard fix, any nesting depth ===== */

/* Make the band full-bleed just in case */
.band-full.tour-quality{
  position:relative!important;
  left:50%!important; right:50%!important;
  margin-left:-50vw!important; margin-right:-50vw!important;
  width:100vw!important; max-width:100vw!important;
}

/* Center the inner row and set content width (0,1,or 2 wrapper Groups) */
.band-full.tour-quality > .wp-block-columns,
.band-full.tour-quality > .wp-block-group > .wp-block-columns,
.band-full.tour-quality > .wp-block-group > .wp-block-group > .wp-block-columns{
  max-width:1150px!important;
  margin:0 auto!important;
  padding:clamp(40px,6vw,90px) clamp(20px,4vw,60px)!important;
  box-sizing:border-box!important;
}

/* Desktop: force two columns side-by-side */
@media (min-width:900px){
  .band-full.tour-quality > .wp-block-columns,
  .band-full.tour-quality > .wp-block-group > .wp-block-columns,
  .band-full.tour-quality > .wp-block-group > .wp-block-group > .wp-block-columns{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:clamp(24px,4vw,64px)!important;
  }
  .band-full.tour-quality .wp-block-columns > .wp-block-column:first-child{ flex:0 0 66%!important; max-width:66%!important; }
  .band-full.tour-quality .wp-block-columns > .wp-block-column:last-child{  flex:0 0 33%!important; max-width:33%!important; }
  .band-full.tour-quality .wp-block-column{ min-width:0!important; width:auto!important; max-width:none!important; }
}

/* Mobile: stack */
@media (max-width:899.98px){
  .band-full.tour-quality .wp-block-columns{
    display:flex!important; flex-direction:column!important; gap:24px!important;
  }
  .band-full.tour-quality .wp-block-column{
    flex:1 1 100%!important; max-width:100%!important;
  }
}

/* Image hygiene */
.band-full.tour-quality img{ width:100%!important; height:auto!important; border-radius:10px; display:block; }

/* =========================================================
   TOUR QUALITY — correct column order for 33/66 layout
   ========================================================= */

/* Only affects desktop width (side-by-side) */
@media (min-width: 900px) {
  /* First column should be 33%, second 66% */
  #tour-quality .wp-block-columns:first-of-type > .wp-block-column:nth-child(1) {
    flex: 0 0 33% !important;
    max-width: 33% !important;
    min-width: 0 !important;
  }
  #tour-quality .wp-block-columns:first-of-type > .wp-block-column:nth-child(2) {
    flex: 0 0 66% !important;
    max-width: 66% !important;
    min-width: 0 !important;
  }
}

/* =========================================================
   TOUR QUALITY — force correct layout using an ID anchor
   ========================================================= */

/* Make the band full-bleed (safe even if already styled) */
#tour-quality {
  position: relative !important;
  left: 50% !important; right: 50% !important;
  margin-left: -50vw !important; margin-right: -50vw !important;
  width: 100vw !important; max-width: 100vw !important;
  box-sizing: border-box !important;
  background: #f9f9f7; /* optional tint; remove if you don't want it */
}

/* Constrain and center the FIRST columns row inside Tour (any nesting depth) */
#tour-quality .wp-block-columns:first-of-type {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: clamp(40px, 6vw, 90px) clamp(20px, 4vw, 60px) !important;
  box-sizing: border-box !important;
}

/* ---- Desktop: two columns side-by-side (66/33) ---- */
@media (min-width: 900px) {
  #tour-quality .wp-block-columns:first-of-type {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: clamp(24px, 4vw, 64px) !important;
  }

  /* 66/33 split */
  #tour-quality .wp-block-columns:first-of-type > .wp-block-column:nth-child(1) {
    flex: 0 0 66% !important; max-width: 66% !important;
    min-width: 0 !important;
  }
  #tour-quality .wp-block-columns:first-of-type > .wp-block-column:nth-child(2) {
    flex: 0 0 33% !important; max-width: 33% !important;
    min-width: 0 !important;
  }
}

/* ---- Mobile/tablet: stack ---- */
@media (max-width: 899.98px) {
  #tour-quality .wp-block-columns:first-of-type {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }
  #tour-quality .wp-block-columns:first-of-type > .wp-block-column {
    flex: 1 1 100% !important; max-width: 100% !important;
  }
}

/* Image hygiene */
#tour-quality img {
  width: 100% !important; height: auto !important; display: block; border-radius: 10px;
}

/* =========================================================
   TOUR QUALITY — fix tiny/narrow right column
   Reason: WP "constrained" layout adds max-width to inner blocks.
   This removes those caps only inside the Tour section.
   ========================================================= */

/* Make sure our band is full-bleed (safe if already set) */
.band-full.tour-quality,
#tour-quality{
  position:relative!important;
  left:50%!important; right:50%!important;
  margin-left:-50vw!important; margin-right:-50vw!important;
  width:100vw!important; max-width:100vw!important;
  box-sizing:border-box!important;
}

/* Desktop row + 33/66 split */
@media (min-width:900px){
  .band-full.tour-quality .wp-block-columns{ 
    display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
    gap:clamp(24px,4vw,64px)!important; align-items:flex-start!important; 
    max-width:1150px!important; margin:0 auto!important;
    padding:clamp(40px,6vw,90px) clamp(20px,4vw,60px)!important;
  }
  .band-full.tour-quality .wp-block-columns > .wp-block-column:first-child{
    flex:0 0 33%!important; max-width:33%!important; min-width:0!important;
  }
  .band-full.tour-quality .wp-block-columns > .wp-block-column:nth-child(2){
    flex:0 0 66%!important; max-width:66%!important; min-width:0!important;
  }
}

/* 🔧 Kill the constrained max-width that makes the 66% look tiny */
.band-full.tour-quality .wp-block-column > *,
.band-full.tour-quality .wp-block-column .wp-block-group,
.band-full.tour-quality .wp-block-column .is-layout-constrained > * {
  max-width: none !important;
}

/* WordPress 6+ “constrained layout” specific selector */
.band-full.tour-quality :where(.is-layout-constrained) > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width: none !important;
}

/* If any inner blocks center themselves with margins, undo it */
.band-full.tour-quality .wp-block-column > *{
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Images tidy */
.band-full.tour-quality img{
  width:100% !important; height:auto !important; display:block !important; border-radius:10px;
}

/* Mobile stack stays normal */
@media (max-width:899.98px){
  .band-full.tour-quality .wp-block-columns{
    display:flex!important; flex-direction:column!important; gap:24px!important;
    max-width:1150px!important; margin:0 auto!important;
    padding:clamp(32px,6vw,60px) clamp(20px,4vw,32px)!important;
  }
  .band-full.tour-quality .wp-block-column{ flex:1 1 100%!important; max-width:100%!important; }
}

/* ===== Mobile quick-fix (buttons + type) ===== */
@media (max-width: 480px){
  /* Stop CTA text from breaking: keep it on one line and center it */
  .home .wp-block-button .wp-block-button__link{
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    font-size: 16px !important;
    line-height: 1.1 !important;
    letter-spacing: .02em !important;
  }

  /* Tame big headings in the two bands */
  .band-full.about-ryan h1,
  .band-full.about-ryan h2,
  .band-full.tour-quality h1,
  .band-full.tour-quality h2{
    font-size: clamp(26px, 6.5vw, 34px) !important;
    line-height: 1.15 !important;
    margin-bottom: 10px !important;
  }

  /* Comfortable paragraph size/measure */
  .band-full.about-ryan p,
  .band-full.tour-quality p{
    font-size: clamp(15px, 4.5vw, 17px) !important;
    line-height: 1.7 !important;
  }

  /* A little tighter padding so the page feels balanced */
  .band-full.about-ryan .wp-block-columns,
  .band-full.tour-quality .wp-block-columns{
    padding: 28px 18px !important;
  }
}

/* ===== TOUR QUALITY — fix widths, gaps, image size ===== */
/* Expect the outer Group to have class: `tour-quality` (optionally also `band-full`) */
.tour-quality .wp-block-columns{
  display:flex !important;
  flex-wrap:nowrap !important;          /* keep two columns on desktop */
  align-items:flex-start !important;
  gap: clamp(24px, 4vw, 64px) !important;
}

/* Respect 33/66 on desktop (override any theme caps) */
.tour-quality .wp-block-column{
  max-width:none !important;
  min-width:0 !important;               /* prevents weird shrinking */
  width:auto !important;
  flex-grow:0 !important;
  flex-shrink:1 !important;
}
.tour-quality .wp-block-column:first-child{  /* 33% image column */
  flex-basis:33.333% !important;
}
.tour-quality .wp-block-column:nth-child(2){ /* 66% text column */
  flex-basis:66.666% !important;
}

/* Make the image fill its column nicely with rounded corners */
.tour-quality .wp-block-image img,
.tour-quality img{
  width:100% !important;
  height:auto !important;
  border-radius:12px !important;
  display:block !important;
}

/* Optional: vertically center text with the image */
@media (min-width: 900px){
  .tour-quality .wp-block-columns{ align-items:center !important; }
}

/* ===== MOBILE BEHAVIOR (Tour + About) ===== */
@media (max-width: 782px){
  /* Stack columns and make them full width */
  .tour-quality .wp-block-columns,
  .about-ryan .wp-block-columns{
    display:flex !important;
    flex-direction:column !important;
    flex-wrap:nowrap !important;
    gap:24px !important;
  }
  .tour-quality .wp-block-column,
  .about-ryan .wp-block-column{
    flex-basis:auto !important;
    width:100% !important;
    max-width:none !important;
  }

  /* Stop primary CTAs from breaking into two lines */
  a.wp-block-button__link{
    white-space:nowrap !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:12px 18px !important;
    line-height:1.1 !important;
  }
}

/* ===== Why Choose Us photo stack (matches Chase) ===== */
.why-photos {
  position: relative;
  display: inline-block;
  max-width: 640px;          /* keep it tight like Chase’s */
  margin-left: auto;         /* sits toward the right column */
}

.why-photos .image-top {
  position: relative;
  display: block;
  width: 100%;
  border: 14px solid #fff;   /* thick white “photo” border */
  border-radius: 8px;
  box-shadow: 0 24px 40px rgba(0,0,0,0.25);
  transform: rotate(0.5deg); /* almost straight, very subtle */
  z-index: 1;
}

.why-photos .image-bottom {
  position: absolute;
  width: 66%;                /* smaller than the main shot */
  left: -36px;               /* peeks out to the left */
  bottom: -54px;             /* hangs below the main shot */
  transform: rotate(8deg);   /* noticeable tilt like Chase’s */
  border: 14px solid #fff;
  border-radius: 8px;
  box-shadow: 0 28px 48px rgba(0,0,0,0.35);
  z-index: 2;                /* in front of the top photo */
}

/* Optional: a soft “table” shadow under the stack */
.why-photos .image-bottom::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -22px;
  height: 22px;
  filter: blur(6px);
  background: radial-gradient(closest-side, rgba(0,0,0,0.28), rgba(0,0,0,0));
  z-index: -1;
}

/* Make images behave nicely if you crop them in WP */
.why-photos img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Tablet: slightly reduce overlap so it doesn’t crowd */
@media (max-width: 1024px) {
  .why-photos { max-width: 560px; }
  .why-photos .image-bottom { left: -24px; bottom: -42px; width: 68%; transform: rotate(7deg); }
}

/* Mobile: stack cleanly (no overlap/tilt) */
@media (max-width: 768px) {
  .why-photos {
    max-width: 100%;
  }
  .why-photos .image-top {
    transform: none;
  }
  .why-photos .image-bottom {
    position: static;
    width: 100%;
    transform: none;
    margin-top: 20px;
    box-shadow: 0 16px 28px rgba(0,0,0,0.18);
  }
}

/* === WHY CHOOSE US — true full-bleed band with brand green === */
.why-choose-full{
  position: relative;
  z-index: 0;                     /* background sits behind content */
}

/* Paint a viewport-wide background behind the section */
.why-choose-full::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  left:50%;
  width:100vw;                    /* full browser width */
  margin-left:-50vw;              /* break out of theme container */
 background:
  radial-gradient(1200px 600px at 80% 20%, rgba(255,255,255,0.06), transparent 60%),
  linear-gradient(135deg, var(--rcg-green) 0%, #0E2C25 100%);
}

/* Inner content stays centered and readable */
.why-choose-full > .wp-block-columns{
  max-width: 1200px;              /* tweak if you want wider */
  margin: 0 auto;
  padding: clamp(56px, 8vw, 96px) clamp(20px, 4vw, 60px);
  gap: clamp(24px, 4vw, 48px);
}

/* Text/Image split */
.why-choose-full .wp-block-column:first-child{  /* text */
  flex-basis: 45% !important;
}
.why-choose-full .wp-block-column:last-child{   /* images */
  flex-basis: 55% !important;
}

/* Mobile padding */
@media (max-width:768px){
  .why-choose-full > .wp-block-columns{
    padding: 48px 20px;
  }
}

/* Make sure the section itself is transparent so the ::before shows */
.why-choose-full,
.why-choose-full.has-background {
  background: transparent !important;
}

/* Put the gradient above the page, behind the content */
.why-choose-full { position: relative; }
.why-choose-full::before{
  content:"";
  position:absolute; inset:0;
  left:50%; width:100vw; margin-left:-50vw;
  z-index: 0; /* sit under content, above page */
  background:
    radial-gradient(1200px 600px at 80% 20%, rgba(255,255,255,0.06), transparent 60%),
    linear-gradient(135deg, var(--rcg-green) 0%, #0E2C25 100%);
}

/* Ensure the inner content sits on top of the gradient */
.why-choose-full > .wp-block-columns { position: relative; z-index: 1; }

/* === WHY CHOOSE US — bulletproof full-bleed green gradient === */
.why-choose-full{
  /* break out of Ixion's container to true full width */
  position: relative !important;
  left: 50% !important; right: 50% !important;
  margin-left: -50vw !important; margin-right: -50vw !important;
  width: 100vw !important; max-width: 100vw !important;

  /* force gradient on the block itself (overrides any white bg) */
  background:
    radial-gradient(1200px 600px at 80% 20%, rgba(255,255,255,0.06), transparent 60%),
    linear-gradient(135deg, var(--rcg-green) 0%, #0E2C25 100%) !important;

  /* readable text on dark bg */
  color: #fff !important;
  box-sizing: border-box !important;
}

/* center and pad inner content */
.why-choose-full > .wp-block-columns,
.why-choose-full > .wp-block-group > .wp-block-columns{
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: clamp(56px, 8vw, 96px) clamp(20px, 4vw, 60px) !important;
  gap: clamp(24px, 4vw, 48px) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* ensure text is light over the gradient */
.why-choose-full h1,
.why-choose-full h2,
.why-choose-full h3,
.why-choose-full p,
.why-choose-full a { color: #fff !important; }

/* split: text 45% / images 55% */
.why-choose-full .wp-block-column:first-child{ flex-basis:45% !important; }
.why-choose-full .wp-block-column:last-child{  flex-basis:55% !important; }

/* prevent clipping by theme wrappers */
.wrap, .site-content, .entry-content { overflow: visible !important; }

/* ==== WHY CHOOSE US — make the INNER CONTENT wide ==== */

/* 1) Remove the built-in max-width caps on the Columns row */
.why-choose-full > .wp-block-columns,
.why-choose-full > .wp-block-group > .wp-block-columns,
.why-choose-full .wp-block-columns.alignwide {
  max-width: none !important;   /* remove 1200px cap */
  width: 100% !important;       /* let it fill the band */
  margin: 0 auto !important;
  /* choose one of the presets below for side padding */
  padding-left: clamp(24px, 5vw, 64px) !important;
  padding-right: clamp(24px, 5vw, 64px) !important;
  gap: clamp(24px, 3.5vw, 56px) !important;
}

/* 2) Kill WordPress “constrained layout” inner max-widths inside this section */
.why-choose-full :where(.is-layout-constrained) > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

/* 3) Give the image column more space (tweak as you like) */
.why-choose-full .wp-block-column:first-child {      /* text */
  flex-basis: 42% !important;
}
.why-choose-full .wp-block-column:last-child {       /* images */
  flex-basis: 58% !important;
}

/* 4) Optional: stop any nested Groups from re-constraining */
.why-choose-full .wp-block-group.is-layout-constrained {
  max-width: none !important;
  width: 100% !important;
}

/* ==== WHY CHOOSE US — make the INNER CONTENT full width ==== */

/* 1) Kill all inner max-width caps only inside this section */
.why-choose-full :where(.is-layout-constrained),
.why-choose-full :where(.is-layout-constrained) > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.why-choose-full .wp-block-group,
.why-choose-full .wp-block-columns {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 2) Make the Columns row span the band with comfy side padding */
.why-choose-full > .wp-block-columns {
  width: 100% !important;
  padding-left: clamp(24px, 5vw, 64px) !important;
  padding-right: clamp(24px, 5vw, 64px) !important;
  gap: clamp(24px, 3.5vw, 56px) !important;
}

/* 3) Let the two columns actually use the width (no inner caps) */
.why-choose-full .wp-block-column,
.why-choose-full .wp-block-column > *,
.why-choose-full .wp-block-group .wp-block-group,
.why-choose-full .wp-block-group > * {
  max-width: none !important;
  width: 100% !important;
}

/* 4) Choose the split you want (adjust if images feel too big/small) */
.why-choose-full .wp-block-column:first-child {  /* text */
  flex-basis: 42% !important;
}
.why-choose-full .wp-block-column:last-child {   /* images */
  flex-basis: 58% !important;
}

/* 5) Keep the photo stack from ballooning on ultra-wide screens */
.why-choose-full .why-photos { max-width: min(780px, 90vw) !important; }

/* ==== WHY CHOOSE US — tame photo size + overlap ==== */

/* 1) Cap the whole stack so it scales but never gets giant */
.why-choose-full .why-photos{
  /* grows with viewport, but stays within nice bounds */
  max-width: clamp(420px, 42vw, 640px) !important;
  margin-left: auto;     /* keep stack toward the right */
  overflow: visible;     /* allow the tilted shot to peek out */
}

/* 2) Main (top) photo fills the stack width */
.why-photos .image-top{
  width: 100% !important;
  border-width: 12px !important;
  box-shadow: 0 20px 36px rgba(0,0,0,.25) !important;
  transform: rotate(.5deg);
}

/* 3) Smaller (bottom) photo: soften the tilt & overlap,
      and size it relative to the container so it scales nicely */
.why-photos .image-bottom{
  width: clamp(240px, 28vw, 420px) !important;
  left: clamp(-12px, -2vw, -28px) !important;
  bottom: clamp(-12px, -2.2vw, -32px) !important;
  transform: rotate(6deg) !important;
  border-width: 12px !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.30) !important;
}

/* 4) Give the image column a touch more/less room if needed */
.why-choose-full .wp-block-column:first-child{  /* text */
  flex-basis: 46% !important;
}
.why-choose-full .wp-block-column:last-child{   /* images */
  flex-basis: 54% !important;
}

/* 5) Tablet & down: reduce sizes/overlap sooner */
@media (max-width: 1024px){
  .why-choose-full .why-photos{ max-width: clamp(380px, 50vw, 560px) !important; }
  .why-photos .image-bottom{
    width: clamp(220px, 34vw, 360px) !important;
    left: clamp(-8px, -1.5vw, -18px) !important;
    bottom: clamp(-10px, -2vw, -24px) !important;
    transform: rotate(5deg) !important;
  }
}

/* 6) Mobile: stack cleanly with no overlap (you already had this;
      keeping it here to ensure it wins) */
@media (max-width: 768px){
  .why-photos{ max-width: 100% !important; }
  .why-photos .image-top{ transform: none !important; }
  .why-photos .image-bottom{
    position: static !important;
    width: 100% !important;
    transform: none !important;
    margin-top: 18px !important;
    box-shadow: 0 14px 24px rgba(0,0,0,.18) !important;
  }
}

/* === WHY CHOOSE US — smaller main photo + gentler overlap === */

/* Overall stack: cap smaller so the main image isn't huge */
.why-choose-full .why-photos{
  max-width: clamp(420px, 34vw, 560px) !important;  /* ↓ was 42vw/640 */
}

/* Main (straight) image — slightly smaller inside its container */
.why-photos .image-top{
  width: 94% !important;                  /* ↓ was 100% */
  margin-left: auto !important;
  margin-right: auto !important;
  transform: rotate(0.3deg) !important;   /* a hair of tilt */
  border-width: 12px !important;
}

/* Tilted image — make smaller, push further LEFT & DOWN so it
   covers less of the right-side golfer, and reduce tilt a bit */
.why-photos .image-bottom{
  width: clamp(200px, 22vw, 360px) !important;      /* ↓ smaller */
  left: clamp(-56px, -6vw, -96px) !important;       /* move left more */
  bottom: clamp(-16px, -2.8vw, -36px) !important;   /* nudge lower */
  transform: rotate(4deg) !important;               /* gentler tilt */
  border-width: 12px !important;
}

/* If you still want even less overlap, uncomment the next line: */
/* .why-photos .image-bottom{ z-index: 1 !important; }           */

/* === WHY CHOOSE US — smaller main photo + lower, farther-off front photo === */

/* keep overflow visible so hanging off works */
.why-choose-full .wp-block-column:last-child,
.why-choose-full .why-photos { overflow: visible !important; }

/* overall stack smaller */
.why-choose-full .why-photos{
  max-width: clamp(380px, 30vw, 520px) !important;  /* ↓ smaller stack */
}

/* main (straight) image smaller inside the stack */
.why-photos .image-top{
  width: 90% !important;                   /* ↓ was 94–100% */
  margin: 0 auto !important;
  transform: rotate(0.2deg) !important;
  border-width: 12px !important;
}

/* tilted/front image: a bit smaller, lower, and hanging off more left */
.why-photos .image-bottom{
  width: clamp(210px, 23vw, 340px) !important;      /* ↓ size a touch */
  left: clamp(-84px, -8vw, -120px) !important;      /* ← hangs off more */
  bottom: clamp(-28px, -3.5vw, -48px) !important;   /* ↓ sits lower */
  transform: rotate(5deg) !important;               /* keep some energy */
  border-width: 12px !important;
  z-index: 2 !important;
}

/* tablet tune */
@media (max-width: 1024px){
  .why-choose-full .why-photos{ max-width: clamp(360px, 42vw, 500px) !important; }
  .why-photos .image-bottom{
    left: clamp(-56px, -6vw, -96px) !important;
    bottom: clamp(-20px, -2.6vw, -40px) !important;
    width: clamp(200px, 28vw, 320px) !important;
  }
}

/* === WHY CHOOSE US — move photos right + reduce overlap === */

/* Give the image column more space and push its content to the right edge */
.why-choose-full .wp-block-column:first-child{      /* text */
  flex-basis: 40% !important;
}
.why-choose-full .wp-block-column:last-child{       /* images */
  flex-basis: 60% !important;
  display: flex !important;
  justify-content: flex-end !important;  /* shove the stack to the right */
  align-items: flex-start !important;
}

/* Let the stack grow a bit, but not crazy */
.why-choose-full .why-photos{
  margin-left: auto !important;          /* hugs the right side */
  max-width: clamp(440px, 38vw, 640px) !important;   /* wider than before */
  overflow: visible !important;
}

/* Back (straight) image: a touch smaller so there’s air on the right */
.why-photos .image-top{
  width: 92% !important;                  /* was 94–100% */
  margin: 0 auto !important;
  transform: rotate(0.2deg) !important;
}

/* Front (tilted) image: smaller, lower, and farther left
   so it reveals more of the back golfer and “hangs off” a bit */
.why-photos .image-bottom{
  width: clamp(200px, 20vw, 320px) !important;       /* smaller card */
  left: clamp(-96px, -9vw, -140px) !important;       /* shift left = less cover */
  bottom: clamp(-40px, -4.5vw, -64px) !important;    /* drop lower */
  transform: rotate(4deg) !important;                /* gentler tilt */
  z-index: 2 !important;
}

/* Tablet tune */
@media (max-width: 1024px){
  .why-choose-full .wp-block-column:first-child{ flex-basis: 44% !important; }
  .why-choose-full .wp-block-column:last-child{  flex-basis: 56% !important; }
  .why-choose-full .why-photos{ max-width: clamp(420px, 44vw, 580px) !important; }
  .why-photos .image-bottom{
    left: clamp(-72px, -7vw, -110px) !important;
    bottom: clamp(-32px, -3.8vw, -52px) !important;
    width: clamp(190px, 24vw, 300px) !important;
  }
}

/* Mobile remains stacked cleanly (no overlap) — keep your existing rules */

/* Smaller back image + a hair lower so it doesn’t kiss the top edge */
.why-photos .image-top{
  width: 88% !important;     /* was ~90–100% */
  top: 6px !important;        /* since it's position:relative */
}

/* Front (tilted) image: slightly smaller + lower and a bit further left */
.why-photos .image-bottom{
  width: clamp(190px, 20vw, 310px) !important;  /* a touch smaller */
  left: clamp(-90px, -8vw, -120px) !important;  /* hangs off more to left */
  bottom: clamp(-46px, -5vw, -70px) !important; /* sits lower on the back photo */
}

/* Make the green band extend further at the bottom so borders stay inside */
.why-choose-full > .wp-block-columns{
  padding-top: clamp(56px, 7vw, 96px) !important;
  padding-bottom: clamp(96px, 11vw, 160px) !important;  /* ↑ increase if any border still dips out */
}

/* === WHY CHOOSE US — final polish === */

/* (A) Use your logo gold just for this section (safe + scoped) */
.why-choose-full{
  /* update the gold only inside this band without touching the rest of the site */
  --rcg-gold: #D6B15D; /* logo gold (adjust if you have an exact hex) */
}

/* (B) Enlarge the main heading “Why Choose Us?” */
.why-choose-full h2{
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(48px, 5.6vw, 78px) !important;  /* bigger + responsive */
  line-height: 1.08 !important;
  margin-bottom: clamp(8px, 1vw, 16px) !important;
}

/* (C) Make “UNRIVALED EXPERIENCE” use the logo gold */
.why-choose-full h3{
  color: var(--rcg-gold) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
  font-size: clamp(18px, 2vw, 26px);
}

/* (D) Extend the green band down so borders stay inside */
.why-choose-full > .wp-block-columns{
  padding-top:  clamp(60px, 8vw, 110px) !important;
  padding-bottom: clamp(140px, 12vw, 200px) !important;  /* increase if needed */
  overflow: visible !important;  /* keep photo frames from clipping */
}

/* Safety: never clip the photo stack at the column edge */
.why-choose-full,
.why-choose-full .wp-block-column:last-child{ overflow: visible !important; }

/* === WHY CHOOSE US — final tuned version === */

.why-choose-full {
  --rcg-gold: #D6B15D; /* logo gold */
}

/* Keep Unrivaled Experience the same smaller size but gold */
.why-choose-full h3 {
  color: var(--rcg-gold) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
  font-size: clamp(18px, 2vw, 26px) !important; /* restores original scale */
  line-height: 1.2;
}

/* Make Why Choose Us much larger */
.why-choose-full h2,
.why-choose-full .wp-block-heading,
.why-choose-full h2.wp-block-heading {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(48px, 5.8vw, 82px) !important; /* this scales nicely */
  line-height: 1.06 !important;
  margin-bottom: clamp(8px, 1vw, 16px) !important;
}

/* Extend the green section downward slightly */
.why-choose-full > .wp-block-columns,
.why-choose-full > .wp-block-group > .wp-block-columns,
.why-choose-full .wp-block-columns:first-of-type {
  padding-top: clamp(60px, 8vw, 100px) !important;
  padding-bottom: clamp(160px, 14vw, 260px) !important; /* pushes bottom further */
  overflow: visible !important;
}

/* Keep images inside green area cleanly */
.why-choose-full,
.why-choose-full .wp-block-column:last-child {
  overflow: visible !important;
}

.why-choose-full {
  margin-bottom: 0 !important;
}

.why-choose-full + * {
  margin-top: 0 !important;
}

/* === WHY CHOOSE US — polished final version === */

.why-choose-full {
  --rcg-gold: #D6B15D; /* logo gold color */
}

/* UNRIVALED EXPERIENCE — styled like h3 */
.why-choose-full h3 {
  color: var(--rcg-gold) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
  font-size: clamp(22px, 1.6vw, 30px) !important; /* h3 scale */
  line-height: 1.2;
  margin-bottom: 0.4em;
}

/* === RYAN CRAWLEY — WHY CHOOSE US (balanced layout) === */
:root { --rcg-logo-gold: #D6B15D; }

/* UNRIVALED EXPERIENCE — gold h3 look */
.entry-content .why-choose-full h3,
.entry-content .why-choose-full h3.wp-block-heading {
  color: var(--rcg-logo-gold) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700 !important;
  font-size: clamp(20px, 1.6vw, 30px) !important;
  line-height: 1.2 !important;
  margin-bottom: 0.45em !important;
}

/* WHY CHOOSE US — slightly smaller for one-line fit */
.entry-content .why-choose-full h1,
.entry-content .why-choose-full h1.wp-block-heading {
  color: #fff !important;
  font-family: var(--font-heading, Poppins), sans-serif;
  font-weight: 800 !important;
  font-size: clamp(38px, 4.4vw, 60px) !important; /* smaller for perfect one line */
  line-height: 1.05 !important;
  letter-spacing: 0.01em;
  margin-bottom: clamp(8px, 1vw, 16px) !important;
}

/* Adjust green section padding */
.entry-content .why-choose-full > .wp-block-columns {
  padding-top: clamp(60px, 6vw, 90px) !important;
  padding-bottom: clamp(80px, 8vw, 120px) !important; /* smaller bottom padding */
  overflow: visible !important;
}

/* Widen text column slightly to reduce gap */
.entry-content .why-choose-full .wp-block-column:first-child {
  flex-basis: 58% !important; /* was likely 50% — gives text more width */
}

/* Ensure right image column adapts well */
.entry-content .why-choose-full .wp-block-column:last-child {
  flex-basis: 42% !important;
  overflow: visible !important;
}

/* === WHY CHOOSE US — tighten bottom green only (final override) === */
/* Put this at the very end of your CSS */
:root body .entry-content .why-choose-full > .wp-block-columns{
  /* ~1/4" of green under the front photo on desktop */
  padding-bottom: clamp(22px, 1.6vw, 24px) !important;
  /* keep existing top padding from earlier rules */
}

/* Slightly more room on small screens so it doesn’t feel cramped */
@media (max-width: 768px){
  :root body .entry-content .why-choose-full > .wp-block-columns{
    padding-bottom: clamp(28px, 3vw, 44px) !important;
  }
}

/* === WHY CHOOSE US — force smaller green at bottom + tiny photo nudge === */
/* Put this at the end of your stylesheet */

html body .entry-content .why-choose-full,
html body .entry-content .why-choose-full * { box-sizing: border-box; }

/* 1) Force the band’s bottom padding to be small (about a 1/4" look) */
html body .entry-content .why-choose-full > .wp-block-columns,
html body .entry-content .why-choose-full > .wp-block-group > .wp-block-columns,
html body .wp-site-blocks .entry-content .why-choose-full > .wp-block-columns {
  padding-bottom: 28px !important;   /* adjust to 24px or 32px if needed */
}

/* Safety: kill any other padding-bottom that may sneak in */
html body .entry-content .why-choose-full { padding-bottom: 0 !important; }

/* 2) Nudge the tilted (front) photo slightly LOWER so less green shows */
html body .entry-content .why-choose-full .why-photos .image-bottom {
  bottom: -56px !important;          /* make more negative for less green; try -60px */
}

/* Optional: if still too much green, pull the whole section up a touch */
html body .entry-content .why-choose-full { margin-bottom: -6px !important; }

/* === WHY CHOOSE US — trim green at bottom (force override) === */

/* 1) Make the band’s bottom padding small */
html body .entry-content .why-choose-full > .wp-block-columns,
html body .entry-content .why-choose-full > .wp-block-group > .wp-block-columns {
  padding-bottom: 22px !important;   /* adjust 18–28px to taste */
}

/* 2) Ensure no other padding/margins add extra green */
html body .entry-content .why-choose-full { 
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
html body .entry-content .why-choose-full + * { 
  margin-top: 0 !important;
}

/* 3) Lower the tilted (front) photo slightly so only a thin green strip shows */
html body .entry-content .why-choose-full .why-photos .image-bottom{
  bottom: -60px !important;          /* make more negative for less green; 
                                         e.g. -64px = even less, -56px = more */
}

/* (optional) If you ever still see green from some theme wrapper, clip just the bottom edge */
@supports (overflow: clip) {
  html body .entry-content .why-choose-full { overflow: clip; }
}

/* === WHY CHOOSE US: shrink green under the photos === */
:root{
  /* tweak these two numbers only */
  --why-bottom-strip: 20px;   /* thickness of green under the tilted photo */
  --why-pull-up: 60px;        /* how much to pull the whole green band upward */
}

/* small bottom padding on the inner row */
.entry-content .why-choose-full > .wp-block-columns,
.entry-content .why-choose-full > .wp-block-group > .wp-block-columns{
  padding-bottom: var(--why-bottom-strip) !important;
}

/* pull the section up so less green shows overall */
.entry-content .why-choose-full{
  padding-bottom: 0 !important;
  margin-bottom: calc(-1 * var(--why-pull-up)) !important; /* <-- main fix */
}

/* remove any gap the next section might add back */
.entry-content .why-choose-full + *{
  margin-top: 0 !important;
}

/* keep the tilted photo overlapping nicely */
.entry-content .why-choose-full .why-photos .image-bottom{
  bottom: calc(-1 * (var(--why-bottom-strip) + 40px)) !important; /* nudge if needed */
}

/* === WHY CHOOSE US — hard override to trim green at bottom === */
/* Put this AT THE VERY END of your stylesheet */

.entry-content .why-choose-full.why-choose-full{
  /* visible green strip under the tilted photo */
  --why-strip: 14px;                 /* adjust 12–28px to taste */
  padding-bottom: 0 !important;      /* neutralize section padding */
  margin-bottom: -125px !important;   /* pull whole band upward; tweak -40 to -110 */
  --wp--style--block-gap: 0 !important;
}

.entry-content .why-choose-full.why-choose-full > .wp-block-columns.wp-block-columns,
.entry-content .why-choose-full.why-choose-full > .wp-block-group > .wp-block-columns.wp-block-columns{
  padding-bottom: var(--why-strip) !important;  /* wins over all earlier paddings */
  padding-top: clamp(56px, 7vw, 96px) !important; /* keep your top spacing stable */
}

.entry-content .why-choose-full.why-choose-full + *{
  margin-top: 0 !important;          /* prevent next section from re-adding gap */
}

/* remove any spacers/gaps that could be creating the extra green */
.entry-content .why-choose-full .wp-block-spacer{ display:none !important; height:0 !important; }
.entry-content .why-choose-full > *{ margin-bottom: 0 !important; }

/* keep the tilted photo visible and aligned with the new strip */
.entry-content .why-choose-full,
.entry-content .why-choose-full .wp-block-column:last-child{ overflow: visible !important; }

.entry-content .why-choose-full .why-photos .image-bottom{
  bottom: calc(-40px - var(--why-strip)) !important;  /* nudge if needed */
}

/* ================================
   TOUR QUALITY (#tour-quality)
   Full-bleed band, photo left, wider text
   ================================ */

/* Make the band full-width like Why Choose Us */
body .entry-content #tour-quality{
  position:relative !important;
  left:50% !important; right:50% !important;
  margin-left:-50vw !important; margin-right:-50vw !important;
  width:100vw !important; max-width:100vw !important;
  background:#f9f9f7;
  box-sizing:border-box !important;
  overflow:visible !important;
}

/* Let the FIRST columns row span wide (handles with/without wrapper Group) */
body .entry-content #tour-quality > .wp-block-columns:first-of-type,
body .entry-content #tour-quality > .wp-block-group > .wp-block-columns:first-of-type{
  max-width:none !important;
  width:100% !important;
  margin:0 auto !important;
  padding:clamp(36px,5vw,72px) clamp(18px,3.5vw,56px) !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:clamp(24px,3vw,56px) !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
}

/* Kill “constrained” inner caps just inside this section */
body .entry-content #tour-quality :where(.is-layout-constrained) > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Desktop split: photo 36%, text 64% (wider text column) */
@media (min-width:900px){
  body .entry-content #tour-quality .wp-block-columns:first-of-type > .wp-block-column:first-child{
    flex:0 0 36% !important; max-width:36% !important; min-width:0 !important;
  }
  body .entry-content #tour-quality .wp-block-columns:first-of-type > .wp-block-column:last-child{
    flex:0 0 64% !important; max-width:64% !important; min-width:0 !important;
  }
}

/* Push the photo further left (adjust the negative value to taste) */
@media (min-width:1100px){
  body .entry-content #tour-quality .wp-block-columns:first-of-type > .wp-block-column:first-child{
    margin-left:clamp(-60px, -5vw, -140px) !important;
  }
}

/* Image hygiene */
body .entry-content #tour-quality img{
  width:100% !important; height:auto !important; display:block !important; border-radius:12px !important;
}

/* Mobile stack */
@media (max-width:899.98px){
  body .entry-content #tour-quality > .wp-block-columns:first-of-type,
  body .entry-content #tour-quality > .wp-block-group > .wp-block-columns:first-of-type{
    flex-direction:column !important;
    gap:24px !important;
    padding-left:18px !important; padding-right:18px !important;
  }
  body .entry-content #tour-quality .wp-block-columns:first-of-type > .wp-block-column{
    flex:1 1 100% !important; max-width:100% !important;
  }
}

/* === TOUR QUALITY — make full-bleed & wider (final override) === */
.entry-content .wp-block-group.tour-quality{
  position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
  width:100vw; max-width:100vw;
}

/* Wide inner row */
.entry-content .wp-block-group.tour-quality > .wp-block-columns{
  max-width:1280px;                /* bump this to 1360px if you want even wider */
  margin:0 auto;
  padding:clamp(40px,6vw,90px) clamp(20px,5vw,64px);
  display:flex; gap:clamp(24px,4vw,64px); align-items:center;
}

/* Kill WP “constrained” caps inside this section */
.entry-content .wp-block-group.tour-quality :where(.is-layout-constrained)
  > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width:none; margin-left:0; margin-right:0; width:100%;
}

/* Split & push image left, give copy more room */
.entry-content .wp-block-group.tour-quality .wp-block-column:first-child{ flex:0 0 50%; }
.entry-content .wp-block-group.tour-quality .wp-block-column:last-child { flex:0 0 50%; }

/* Image should fill its column (don’t shrink) */
.entry-content .wp-block-group.tour-quality .wp-block-image img{
  width:100% !important; height:auto !important; display:block;
}

/* === TOUR QUALITY — full-bleed, wider text, image pushed left (final override) === */

/* 1) Make the Group span the full viewport width */
html body .entry-content .wp-block-group.tour-quality,
html body .wp-site-blocks .entry-content .wp-block-group.tour-quality{
  position: relative !important;
  left: 50% !important; right: 50% !important;
  margin-left: -50vw !important; margin-right: -50vw !important;
  width: 100vw !important; max-width: 100vw !important;
}

/* 2) Wide inner row + comfy side padding */
html body .entry-content .wp-block-group.tour-quality > .wp-block-columns{
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: clamp(8px, 2vw, 24px) !important;   /* less left padding */
  padding-right: clamp(24px, 5vw, 64px) !important; /* keep some right padding */
  gap: clamp(24px, 4vw, 64px) !important;
  align-items: flex-start !important;
}

/* 3) Kill WP’s “constrained layout” caps inside this section */
html body .entry-content .wp-block-group.tour-quality :where(.is-layout-constrained) > :where(:not(.alignfull):not(.alignwide)){
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 4) Desktop column split: wider text, narrower image */
@media (min-width: 1000px){
  html body .entry-content .wp-block-group.tour-quality > .wp-block-columns > .wp-block-column:first-child{
    flex: 0 0 44% !important;   /* image column */
    max-width: 44% !important;
    transform: translateX(-22px) !important; /* nudge image further left */
  }
  html body .entry-content .wp-block-group.tour-quality > .wp-block-columns > .wp-block-column:last-child{
    flex: 0 0 56% !important;   /* text column */
    max-width: 56% !important;
  }
}

/* 5) Make sure the image can actually grow to fill its column */
html body .entry-content .wp-block-group.tour-quality .wp-block-image,
html body .entry-content .wp-block-group.tour-quality .wp-block-image img{
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
}

/* === TOUR QUALITY — make band full-bleed, push photo left, widen text (strong override) === */

/* Catch both cases: you sometimes have "tour-quality band-full" */
html body .entry-content .wp-block-group.tour-quality,
html body .entry-content .wp-block-group.tour-quality.band-full,
html body #tour-quality{
  position:relative !important;
  left:50% !important; right:50% !important;
  margin-left:-50vw !important; margin-right:-50vw !important;
  width:100vw !important; max-width:100vw !important;
}

/* First Columns row inside Tour Quality = wide container with tiny left padding */
html body .entry-content .wp-block-group.tour-quality > .wp-block-columns:first-of-type,
html body .entry-content .wp-block-group.tour-quality.band-full > .wp-block-columns:first-of-type,
html body #tour-quality > .wp-block-columns:first-of-type{
  max-width: 1320px !important;       /* wider desktop container */
  margin: 0 auto !important;
  padding-left: clamp(0px, 1.2vw, 16px) !important;  /* pull content left */
  padding-right: clamp(24px, 5vw, 64px) !important;
  gap: clamp(24px, 4vw, 64px) !important;
  align-items: flex-start !important;
}

/* Kill WP “constrained layout” caps anywhere inside this section */
html body .entry-content .wp-block-group.tour-quality :where(.is-layout-constrained) > :where(:not(.alignfull):not(.alignwide)),
html body .entry-content .wp-block-group.tour-quality [class^="wp-container-"] > :where(:not(.alignfull):not(.alignwide)){
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Desktop split: make text column wider, push image column left */
@media (min-width: 1000px){
  html body .entry-content .wp-block-group.tour-quality > .wp-block-columns:first-of-type > .wp-block-column:first-child{
    flex: 0 0 42% !important;          /* image column width */
    max-width: 42% !important;
    transform: translateX(-36px) !important;  /* shove photo left */
  }
  html body .entry-content .wp-block-group.tour-quality > .wp-block-columns:first-of-type > .wp-block-column:last-child{
    flex: 0 0 58% !important;          /* wider text column */
    max-width: 58% !important;
  }
}

/* Let the image actually fill its column (override inline widths) */
html body .entry-content .wp-block-group.tour-quality .wp-block-image,
html body .entry-content .wp-block-group.tour-quality .wp-block-image img{
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
}

/* If the individual image block has an inline width, nuke it */
html body .entry-content .wp-block-group.tour-quality .wp-block-image[style],
html body .entry-content .wp-block-group.tour-quality .wp-block-image img[style]{
  width: 100% !important;
}

/* === TOUR QUALITY — Reduce top and bottom spacing === */
#tour-quality {
  padding-top: 0px !important;   /* Try 30px–50px range */
  padding-bottom: 0px !important; /* Try 30px–50px range */
}

/* Optional — If the inner columns add extra padding, trim those too */
#tour-quality > .wp-block-columns:first-of-type {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* === ABOUT (Beige / Warm Neutral Style) === */
html body .entry-content .wp-block-group.about-ryan {
  background: #f6f1e7 !important; /* soft beige background */
  color: #1c1c1c !important; /* dark text for contrast */
}

/* Headings - deep green brand color */
html body .entry-content .wp-block-group.about-ryan h1,
html body .entry-content .wp-block-group.about-ryan h2,
html body .entry-content .wp-block-group.about-ryan h3,
html body .entry-content .wp-block-group.about-ryan h4 {
  color: #174832 !important; /* brand green */
}

/* Paragraphs - slightly lighter neutral text tone */
html body .entry-content .wp-block-group.about-ryan p,
html body .entry-content .wp-block-group.about-ryan li {
  color: #2e2e2e !important;
}

/* Links + hover - gold accent */
html body .entry-content .wp-block-group.about-ryan a {
  color: #c6a557 !important; /* brand gold */
}
html body .entry-content .wp-block-group.about-ryan a:hover {
  color: #8a6b32 !important; /* darker gold */
}

/* Buttons - dark green with gold hover */
html body .entry-content .wp-block-group.about-ryan .wp-block-button__link {
  background: #174832 !important;
  color: #ffffff !important;
  border: none !important;
}
html body .entry-content .wp-block-group.about-ryan .wp-block-button__link:hover {
  background: #0f3527 !important;
  color: #f6f1e7 !important;
}

/* Tighter spacing for a modern, full section look */
html body .entry-content .wp-block-group.about-ryan > .wp-block-columns {
  padding-top: clamp(50px, 6vw, 90px) !important;
  padding-bottom: clamp(50px, 6vw, 90px) !important;
}

/* Force smaller vertical spacing for the About section */
html body .wp-block-group.about-ryan,
html body .wp-block-group.about-ryan > .wp-block-group__inner-container,
html body .wp-block-group.about-ryan > .wp-block-columns {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove extra padding from columns inside About */
html body .wp-block-group.about-ryan .wp-block-column {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* === ABOUT RYAN — tighten vertical spacing (final override) === */

/* 1) Replace the tall clamp padding with a small fixed padding */
:root body .home .entry-content > .wp-block-group.about-ryan{
  padding-top: 10px !important;
  padding-bottom: 24px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 2) Make sure inner wrappers don't re-add padding */
:root body .wp-block-group.about-ryan > .wp-block-columns,
:root body .wp-block-group.about-ryan > .wp-block-group > .wp-block-columns{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 3) Remove theme block gap + any spacers inside this section */
:root body .wp-block-group.about-ryan{ --wp--style--block-gap: 0 !important; }
:root body .wp-block-group.about-ryan .wp-block-spacer{ display:none !important; height:0 !important; }

/* 4) Prevent adjacent sections from adding extra gap */
:root body .wp-block-group.about-ryan + *{ margin-top: 0 !important; }

/* === ABOUT RYAN — compact vertical spacing + centered layout === */

#about-ryan {
  background-color: #f4efe3; /* beige */
  padding-top: 0px !important;     /* tighter top */
  padding-bottom: 0px !important;  /* tighter bottom */
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  --wp--style--block-gap: 0 !important;
}

/* Recenter inner columns */
#about-ryan > .wp-block-columns:first-of-type,
#about-ryan > .wp-block-group > .wp-block-columns:first-of-type {
  max-width: 1150px !important;
  margin: 0 auto !important;
  padding: 0 clamp(20px, 3vw, 40px) !important;
  box-sizing: border-box !important;
  align-items: flex-start !important; /* aligns badges with text top */
}

/* Tighten spacing between columns */
#about-ryan .wp-block-columns {
  gap: 1.5rem !important;
}

/* Compact all text spacing */
#about-ryan :where(h1, h2, h3, p, ul, ol) {
  margin-top: 0.3em !important;
  margin-bottom: 0.3em !important;
  line-height: 1.4 !important;
}

/* Remove any extra space below lists or buttons */
#about-ryan .wp-block-buttons,
#about-ryan ul {
  margin-bottom: 0 !important;
}

/* Prevent any hidden spacer blocks from adding height */
#about-ryan .wp-block-spacer {
  height: 0 !important;
  display: none !important;
}

/* Force homepage hero overlay text to bottom-left */
body.home .home-hero.hero-overlay .wp-block-cover__inner-container {
  position: absolute !important;
  bottom: 2rem !important;      /* distance from bottom */
  left: 1.25rem !important;     /* distance from left */
  right: auto !important;
  top: auto !important;
  text-align: left !important;
  width: auto;
  max-width: 90%;
}

/* Prevent theme centering */
body.home .home-hero.hero-overlay {
  display: block !important;
  justify-content: flex-start !important;
  align-items: flex-end !important;
}

/* Make sure heading/text/buttons all left-align */
body.home .home-hero.hero-overlay [class*="has-text-align"] {
  text-align: left !important;
}

body.home .home-hero.hero-overlay .wp-block-buttons {
  justify-content: flex-start !important;
}

/* Optional: text readability on top of video */
body.home .home-hero.hero-overlay .wp-block-cover__inner-container * {
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

/* Ryan Crawley Golf — mobile overlap fix using existing classes */
/* Desktop unaffected because this only runs under the breakpoint. */

@media (max-width: 900px) { /* use 782px if you prefer WP's tablet break */
  /* Center the photo stack column (optional but tidy) */
  .why-choose-full .wp-block-columns > .wp-block-column:nth-child(2) {
    display: flex;
    justify-content: center;
  }

  /* The Group that wraps BOTH images */
  .why-choose-photos {
    display: grid;            /* both images share one grid cell => overlap */
    place-items: center;
    position: relative;
    isolation: isolate;
    width: min(560px, 90vw);
    margin-inline: auto;
    aspect-ratio: 5 / 6;      /* reserve height so layout doesn’t jump */
  }

  /* Reset any desktop positioning the theme applied */
  .why-choose-photos .wp-block-image {
    grid-area: 1 / 1;
    margin: 0 !important;
    position: static !important;    /* neutralize abs/rel on mobile */
    transform: none;                /* we’ll set our own below */
  }

  /* Keep your existing frame styles from the theme; only size/offset here */
  /* image-top = big back photo */
  .why-choose-photos .image-top img {
    width: 86%;
    height: auto;
    transform: translate(8%, -2%) rotate(0.2deg);
    z-index: 1;
  }

  /* image-bottom = small tilted headshot on top */
  .why-choose-photos .image-bottom img {
    width: 58%;
    height: auto;
    transform: translate(-10%, 14%) rotate(-5deg);
    z-index: 2;
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .why-choose-photos .wp-block-image img { transition: none !important; }
}

@media (max-width: 900px) {
  /* Kill theme/Block-style frames on the FIGURE only */
  .why-choose-photos .wp-block-image {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    filter: none !important;
  }
  /* Remove any pseudo-element “polaroid” frames */
  .why-choose-photos .wp-block-image::before,
  .why-choose-photos .wp-block-image::after {
    content: none !important;
    display: none !important;
  }

  /* Ensure only the IMG carries the clean frame + shadow */
  .why-choose-photos .wp-block-image img {
    outline: 10px solid #fff;          /* keep this */
    box-shadow: 0 12px 30px rgba(0,0,0,.25);
    background: #fff;                   /* prevents dark edges on transparent PNGs */
    border: 0;
  }

  /* If the block style adds a class like is-style-default, neutralize it here */
  .why-choose-photos .wp-block-image.is-style-default,
  .why-choose-photos .wp-block-image.image-top,
  .why-choose-photos .wp-block-image.image-bottom {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }
}

@media (max-width: 900px) {
  .why-choose-photos .image-bottom img {
    width: 64%;
    transform: translate(-18%, -45%) rotate(-5deg); /* raise it higher */
    z-index: 3;
  }

  /* Optional: nudge the larger photo a touch down to keep balance */
  .why-choose-photos .image-top img {
    transform: translate(10%, -2%) rotate(0.2deg);
  }
}

/* ===== ABOUT RYAN — Mobile Layout Fix ===== */
@media (max-width: 900px) {
  /* Expand the About Ryan content area */
  .band-full.about-ryan {
    padding: 2rem 1rem !important;
  }

  .band-full.about-ryan .wp-block-columns {
    max-width: 95vw !important;   /* stretch closer to full screen width */
    margin-inline: auto !important;
    gap: 1.5rem;
  }

  /* Make text column use more space on mobile */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:first-child {
    flex-basis: 100% !important;
    max-width: 100% !important;
  }

  /* Hide extra images in the right column */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child .wp-block-image:nth-of-type(n+3) {
    display: none !important;  /* hides the 3rd and 4th images */
  }

  /* If you prefer to keep just ONE image instead of two, comment the rule above
     and use this instead: */
  /*
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child .wp-block-image:nth-of-type(n+2) {
    display: none !important;
  }
  */

  /* Center the remaining image(s) nicely */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child {
    display: grid;
    justify-items: center;
    row-gap: 1rem;
  }

  /* Optional: smaller images for mobile */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child img {
    max-width: 80%;
    height: auto;
  }
}

/* ===== ABOUT RYAN — Larger & Centered Mobile Badges (v2) ===== */
@media (max-width: 900px) {
  /* 2-column grid centered */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    justify-content: center;
    justify-items: center;
    align-items: center;
    margin: 2rem auto 0;
    width: 100%;
    max-width: 600px; /* allows larger images while staying centered */
  }

  /* Make images much larger */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child img {
    width: 100%;
    max-width: 240px;   /* bump this up from 180px → 240px */
    height: auto;
  }

  /* Hide extra ones beyond first two */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child .wp-block-image:nth-of-type(n+3) {
    display: none !important;
  }

  /* Optional: add some breathing room below images */
  .band-full.about-ryan .wp-block-columns > .wp-block-column:last-child {
    padding-bottom: 2rem;
  }
}

@media (max-width: 900px) {
  .wp-block-cover .wp-block-cover__inner-container p {
    max-width: 25ch; /* ~20 characters per line for a two-line look */
  }
}
