/*
Theme Name: Country Lawns & Gardens
Theme URI: https://country-lawns-wp.fly.dev
Description: Photo-led one-page theme for Country Lawns & Gardens (Concept A). Full-bleed hero, three programmes, lawn carousel, and booking CTA.
Author: Konsul
Version: 1.6.2
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: country-lawns
*/

:root{
  --ink:#0F3D2A;
  --ink-deep:#082117;
  --gold:#B68B3C;
  --gold-deep:#967327;
  --paper:#FBF8F1;
  --paper-warm:#F4EFE2;
  --paper-pure:#FFFFFF;
  --serif:'Cormorant Garamond', serif;   /* display serif — headings only */
  --text:'Lora', Georgia, serif;          /* readable body serif — body copy, lists, form */
  --display:'Cinzel', serif;
  --ease:cubic-bezier(0.165, 0.84, 0.44, 1);

  /* Fluid scale — every size below tracks the viewport width via clamp()
     (mobile-min → desktop-max). Desktop maxes match the original design. */
  --fs-hero:clamp(30px, 4.8vw, 84px);          /* hero h1 */
  --fs-h2:clamp(30px, 5.2vw, 68px);            /* section + CTA headings */
  --fs-h3:clamp(1.5rem, 1.05rem + 2vw, 1.85rem); /* programme card titles */
  --fs-lead:clamp(1.08rem, 0.92rem + 1vw, 1.46rem); /* hero sub, leads */
  --fs-body:clamp(1.04rem, 0.96rem + 0.45vw, 1.26rem); /* intros, body */
  --fs-price:clamp(1.7rem, 1.2rem + 2vw, 2.1rem);

  --btn-pad-y:clamp(15px, 0.6vw + 12px, 22px);
  --btn-pad-x:clamp(24px, 1.4vw + 16px, 38px);
  --btn-fs:clamp(0.78rem, 0.72rem + 0.2vw, 0.92rem);

  /* Fluid spacing */
  --space-section:clamp(64px, 9vw, 120px);     /* section vertical padding */
  --space-gutter:clamp(22px, 4vw, 32px);       /* section horizontal padding */
  --space-head:clamp(44px, 7vw, 80px);         /* section-head margin-bottom */
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink-deep)}
/* Dark body bg so Safari 26 tints the bottom toolbar/chin dark (no fixed element
   sits there). Content sections all paint their own opaque backgrounds over it. */
body{font-family:var(--text);background:var(--ink-deep);color:var(--ink);font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.container{max-width:1180px;margin:0 auto;padding:0 32px}

/* Subtle scroll-reveal. Gated by .js-anim so content shows if JS/IO is absent.
   Respects prefers-reduced-motion. JS adds .is-visible when each element enters view. */
.js-anim .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js-anim .reveal.is-visible{opacity:1;transform:none}
.programmes-grid .reveal:nth-child(2){transition-delay:.08s}
.programmes-grid .reveal:nth-child(3){transition-delay:.16s}
.programmes-grid .reveal:nth-child(4){transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.js-anim .reveal{opacity:1!important;transform:none!important;transition:none!important}}

/* HERO — full-bleed photo */
.hero{
  position:relative;height:100vh;min-height:680px;
  overflow:hidden;color:#fff;
  display:flex;align-items:flex-end;
}
.hero-bg{
  position:absolute;inset:0;
  background-position:center 78%;background-size:cover;background-repeat:no-repeat;
}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(15,61,42,0.25) 0%, rgba(15,61,42,0.1) 30%, rgba(8,33,23,0.7) 80%, rgba(8,33,23,0.85) 100%);
}
/* Mobile-only hero image carousel (hidden on desktop) */
.hero-carousel{position:absolute;inset:0;display:none}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.2s ease}
.hero-slide.is-active{opacity:1}
.hero-inner{position:relative;z-index:2;width:100%;padding:80px 56px;max-width:1480px;margin:0 auto}
.hero h1{
  font-family:var(--serif);font-weight:500;
  font-size:var(--fs-hero);line-height:1.04;letter-spacing:-0.014em;
  margin-bottom:24px;max-width:none;color:#fff;
  text-shadow:0 2px 30px rgba(0,0,0,0.4);
  white-space:nowrap;
}
.hero h1 em{font-style:italic;color:var(--gold);font-weight:500}
.hero-sub{
  font-style:italic;font-size:var(--fs-lead);line-height:1.5;
  color:rgba(255,255,255,0.92);max-width:1120px;margin-bottom:36px;
  text-shadow:0 1px 12px rgba(0,0,0,0.5);
}
.hero-ctas{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.btn-primary{
  display:inline-flex;align-items:center;gap:14px;
  padding:var(--btn-pad-y) var(--btn-pad-x);background:var(--gold);color:var(--ink-deep);
  font-family:var(--display);font-weight:600;letter-spacing:0.16em;text-transform:uppercase;font-size:var(--btn-fs);
  transition:all .4s var(--ease);cursor:pointer;border:none;
}
.btn-primary::after{content:"→";font-size:1.05em;transition:transform .4s var(--ease)}
.btn-primary:hover{background:#fff;transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,0.3)}
.btn-primary:hover::after{transform:translateX(4px)}
.btn-text{
  color:rgba(255,255,255,0.92);font-family:var(--display);font-weight:500;
  letter-spacing:0.18em;text-transform:uppercase;font-size:0.86rem;
  padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.3);transition:border-color .3s,color .3s;
}
.btn-text:hover{color:var(--gold);border-bottom-color:var(--gold)}

/* STICKY SITE HEADER */
/* Solid (not translucent) so Safari 26 tints the top safe area to match it.
   A translucent bg + backdrop-filter on a fixed header makes iOS 26 render the
   status-bar area white. */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:var(--ink-deep);border-bottom:1px solid rgba(182,139,60,0.32);transition:background .3s,box-shadow .3s;padding-top:env(safe-area-inset-top)}
.site-header-inner{max-width:1480px;margin:0 auto;padding:12px 40px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.site-brand{display:inline-flex;align-items:center}
.site-brand img{height:50px;width:auto;display:block;filter:brightness(0) invert(1)}
.site-header .header-cta{display:inline-flex;align-items:center;gap:12px;padding:13px 24px;background:var(--gold);color:var(--ink-deep);font-family:var(--display);font-weight:600;letter-spacing:0.16em;text-transform:uppercase;font-size:0.78rem;transition:all .35s var(--ease);white-space:nowrap}
.site-header .header-cta::after{content:"→";transition:transform .35s var(--ease)}
.site-header .header-cta:hover{background:#fff;transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,0.3)}
.site-header .header-cta:hover::after{transform:translateX(4px)}
/* WP admin bar offset for logged-in users */
.admin-bar .site-header{top:32px}
/* Offset the fixed header on pages without a full-bleed hero */
body:not(.home){padding-top:calc(76px + env(safe-area-inset-top))}

/* SECTION */
.section{padding:var(--space-section) var(--space-gutter)}
.section-head{text-align:center;max-width:780px;margin:0 auto var(--space-head)}
.section-head .eyebrow{font-family:var(--display);letter-spacing:0.22em;text-transform:uppercase;font-size:0.82rem;color:var(--ink);font-weight:600;display:inline-flex;align-items:center;gap:16px;margin-bottom:18px}
.section-head .eyebrow::before, .section-head .eyebrow::after{content:"";display:inline-block;width:32px;height:1px;background:var(--gold)}
.section-head h2{font-family:var(--serif);font-weight:500;font-size:var(--fs-h2);color:var(--ink);line-height:1.08;letter-spacing:-0.012em;margin-bottom:20px}
.section-head h2 em{font-style:italic;color:var(--gold)}
.section-head p{font-style:italic;color:#5C6F62;font-size:var(--fs-body);line-height:1.65;max-width:54ch;margin:0 auto}

/* PROGRAMMES */
.programmes{background:var(--paper-pure);border-top:1px solid rgba(15,61,42,0.1)}
/* Programmes intro: keep the sub-heading on one line (wraps naturally on narrow screens) */
.programmes .section-head{max-width:940px}
.programmes .section-head p{max-width:none}
.programmes-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1480px;margin:0 auto}
.programme{
  background:var(--paper);border:1px solid rgba(182,139,60,0.4);padding:40px 32px;
  display:flex;flex-direction:column;
  transition:all .45s var(--ease);position:relative;
}
.programme:hover{transform:translateY(-6px);box-shadow:0 30px 60px -32px rgba(15,61,42,0.25);border-color:var(--gold)}
.programme.featured{background:var(--ink-deep);color:#fff}
.featured-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--ink-deep);font-family:var(--display);font-weight:700;letter-spacing:0.2em;font-size:0.72rem;text-transform:uppercase;padding:7px 20px}
.programme-tag{font-family:var(--display);font-weight:600;letter-spacing:0.2em;text-transform:uppercase;font-size:0.76rem;color:var(--ink);margin-bottom:14px}
.programme.featured .programme-tag{color:var(--gold)}
.programme h3{font-family:var(--serif);font-weight:500;font-size:var(--fs-h3);line-height:1.15;color:var(--ink);margin-bottom:14px;letter-spacing:-0.005em}
.programme.featured h3{color:#fff}
.programme-body{font-size:1.08rem;line-height:1.7;color:#4A5C50;margin-bottom:20px}
.programme.featured .programme-body{color:rgba(255,255,255,0.82)}
.programme ul{list-style:none;padding:0;margin:0 0 24px}
.programme ul li{padding:8px 0 8px 22px;position:relative;font-size:1rem;line-height:1.5;color:#4A5C50;border-bottom:1px dashed rgba(182,139,60,0.28)}
.programme ul li:last-child{border-bottom:none}
.programme ul li::before{content:"◆";position:absolute;left:0;top:11px;color:var(--gold);font-size:0.5em}
.programme.featured ul li{color:rgba(255,255,255,0.85);border-bottom-color:rgba(182,139,60,0.3)}
.programme-cta{margin-top:auto;align-self:flex-start;padding:14px 22px;background:var(--ink);color:#fff;font-family:var(--display);font-weight:600;letter-spacing:0.18em;text-transform:uppercase;font-size:0.8rem;transition:all .35s var(--ease)}
.programme-cta:hover{background:var(--gold)}
.programme.featured .programme-cta{background:var(--gold);color:var(--ink-deep)}
.programme.featured .programme-cta:hover{background:#fff}
/* Per-programme pricing (replaces the CTA buttons) */
.programme-price{margin-top:auto;padding-top:18px;border-top:1px solid rgba(182,139,60,0.35)}
.programme.featured .programme-price{border-top-color:rgba(182,139,60,0.4)}
.programme-price .price-amt{display:block;font-family:var(--serif);font-weight:600;color:var(--ink);font-size:var(--fs-price);line-height:1.05;letter-spacing:-0.01em}
.programme-price .price-amt .per{font-family:var(--display);font-weight:600;font-size:0.74rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold-deep);white-space:nowrap}
.programme-price .price-note{display:block;margin-top:9px;font-style:italic;font-size:0.92rem;color:#7A8A7E}
.programme.featured .price-amt{color:#fff}
.programme.featured .price-amt .per{color:var(--gold)}
.programme.featured .price-note{color:rgba(255,255,255,0.68)}
/* Programmes responsive: 4-up desktop → 2×2 tablet → single column mobile */
@media (max-width:1180px){.programmes-grid{grid-template-columns:repeat(2,1fr);max-width:780px}}
@media (max-width:620px){.programmes-grid{grid-template-columns:1fr;max-width:460px}}
/* 4-up desktop: align the title/description (header) row and the price (footer) row
   across all four cards via subgrid, regardless of description/list length */
@media (min-width:1181px){
  .programmes-grid{grid-template-rows:auto auto auto 1fr auto;column-gap:24px;row-gap:0}
  .programme{display:grid;grid-template-rows:subgrid;grid-row:1 / span 5;row-gap:0}
  .programme-price{margin-top:0}
}

/* CAROUSEL */
.carousel-wrap{background:var(--paper);padding:var(--space-section) var(--space-gutter)}
.carousel{position:relative;max-width:1280px;margin:0 auto}
.carousel-track{position:relative;width:100%;aspect-ratio:3/2;background:var(--paper-warm);overflow:hidden;border:1px solid rgba(182,139,60,0.4);box-shadow:0 30px 60px -30px rgba(15,61,42,0.3)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s var(--ease),transform 1.4s var(--ease);transform:scale(1.03);pointer-events:none}
.slide.is-active{opacity:1;transform:scale(1);pointer-events:auto;z-index:2}
.slide img{width:100%;height:100%;object-fit:cover;display:block}
/* Before / After split — two images in one frame */
.ba-split{display:flex;width:100%;height:100%}
.ba-half{position:relative;flex:1 1 50%;height:100%;margin:0;overflow:hidden}
.ba-half + .ba-half{border-left:3px solid var(--paper)}
.ba-half figcaption{position:absolute;top:18px;left:18px;z-index:2;font-family:var(--display);font-weight:600;letter-spacing:0.18em;text-transform:uppercase;font-size:0.72rem;padding:7px 15px;background:rgba(8,33,23,0.82);color:#fff;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.ba-half:last-child figcaption{left:auto;right:18px;background:var(--gold);color:var(--ink-deep)}
@media (max-width:560px){
  .ba-half figcaption{top:10px;left:10px;font-size:0.6rem;padding:5px 10px;letter-spacing:0.12em}
  .ba-half:last-child figcaption{right:10px}
}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:54px;height:54px;border-radius:50%;border:none;background:rgba(8,33,23,0.85);color:#fff;font-size:1.6rem;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);transition:all .3s}
.carousel-arrow:hover{background:var(--gold);transform:translateY(-50%) scale(1.06)}
.carousel-arrow.prev{left:32px}.carousel-arrow.next{right:32px}
.carousel-meta{margin-top:24px;display:flex;justify-content:center;gap:10px}
.dot{width:9px;height:9px;border-radius:50%;background:rgba(15,61,42,0.18);border:none;cursor:pointer;transition:all .4s var(--ease)}
.dot.is-active{background:var(--gold);transform:scale(1.5);box-shadow:0 0 0 4px rgba(182,139,60,0.12)}

/* BOOK A FREE LAWN CHECK — form */
.book{background:var(--paper-pure);border-top:1px solid rgba(15,61,42,0.1)}
.book-form{max-width:760px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.book-form .field{display:flex;flex-direction:column;gap:8px}
.book-form .field-wide{grid-column:1 / -1}
.book-form label{font-family:var(--display);letter-spacing:0.14em;text-transform:uppercase;font-size:0.74rem;font-weight:600;color:var(--ink)}
.book-form label span{color:#8A9A8E;font-weight:500;letter-spacing:0.08em}
.book-form input,.book-form textarea{font-family:var(--serif);font-size:1.08rem;color:var(--ink);background:var(--paper);border:1px solid rgba(182,139,60,0.5);padding:14px 16px;transition:border-color .3s,box-shadow .3s}
.book-form input::placeholder,.book-form textarea::placeholder{color:#9AA89D;font-style:italic}
.book-form input:focus,.book-form textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(182,139,60,0.15)}
.book-form textarea{resize:vertical;line-height:1.5}
.book-form .btn-primary{border:none;width:100%;justify-content:center}
.book-form input[readonly]{background:var(--paper-warm);color:#5C6F62;cursor:default}
.pc-row{display:flex;gap:10px;align-items:stretch}
.pc-row input{flex:1 1 auto;min-width:0}
.pc-find{flex:0 0 auto;border:none;cursor:pointer;padding:0 22px;background:var(--ink);color:#fff;font-family:var(--display);font-weight:600;letter-spacing:0.14em;text-transform:uppercase;font-size:0.74rem;white-space:nowrap;transition:background .3s}
.pc-find:hover{background:var(--gold);color:var(--ink-deep)}
.pc-find:disabled{opacity:0.55;cursor:default}
.pc-select{display:block;width:100%;margin-top:10px;font-family:var(--serif);font-size:1.05rem;color:var(--ink);background:var(--paper);border:1px solid rgba(182,139,60,0.5);padding:13px 14px}
.pc-select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(182,139,60,0.15)}
.pc-note{display:block;min-height:1.15em;margin-top:6px;font-size:0.9rem;font-style:italic;line-height:1.2}
/* Address type-ahead suggestions */
.addr-input-wrap{position:relative}
.addr-suggest{position:absolute;z-index:40;left:0;right:0;top:100%;margin:4px 0 0;padding:0;list-style:none;background:var(--paper-pure);border:1px solid rgba(182,139,60,0.5);box-shadow:0 20px 44px -22px rgba(15,61,42,0.45);max-height:300px;overflow:auto}
.addr-suggest-item{padding:12px 16px;font-family:var(--serif);font-size:1.04rem;line-height:1.35;color:var(--ink);cursor:pointer;border-bottom:1px solid rgba(182,139,60,0.18)}
.addr-suggest-item:last-child{border-bottom:none}
.addr-suggest-item:hover,.addr-suggest-item:focus{background:var(--paper-warm);outline:none}
.pc-note.checking{color:#7A8A7E}
.pc-note.ok{color:#2F7D4F}
.pc-note.err{color:#B23B3B}
.book-success{max-width:760px;margin:0 auto 36px;background:var(--ink-deep);color:#fff;font-style:italic;font-size:1.18rem;line-height:1.5;text-align:center;padding:22px 28px;border-left:3px solid var(--gold)}

/* CONTACT FORM 7 booking form */
.book-form-wrap{max-width:760px;margin:0 auto}
/* WhatsApp inline CTA under the form (Click to Chat plugin) */
.book-or{text-align:center;margin:24px 0 16px;font-style:italic;color:#7A8A7E;font-size:1.02rem;letter-spacing:0.04em}
.book-whatsapp{text-align:center}
.book-whatsapp .ht-ctc-sc{display:block!important;width:100%}
/* WhatsApp button — same shape/size as the gold buttons (tokens), green colour */
.book-whatsapp .ht-ctc-sc-chat button{display:flex!important;width:100%;justify-content:center;align-items:center;gap:12px;background:#25D366;color:var(--ink-deep);border:none;cursor:pointer;padding:var(--btn-pad-y) var(--btn-pad-x);border-radius:0;font-family:var(--display);font-weight:600;letter-spacing:0.16em;text-transform:uppercase;font-size:var(--btn-fs);line-height:1;box-shadow:0 10px 26px -12px rgba(0,0,0,0.4);transition:transform .3s var(--ease),background .3s}
.book-whatsapp .ht-ctc-sc-chat button:hover{background:#1fb457;transform:translateY(-2px)}
.book-whatsapp .ctc_cta{color:var(--ink-deep)}
.book-whatsapp .ht-ctc-sc-chat button::before{content:"";flex:0 0 auto;width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23082117'%3E%3Cpath d='M12.04 2C6.58 2 2.13 6.45 2.13 11.91c0 1.75.46 3.45 1.32 4.95L2 22l5.25-1.38c1.45.79 3.08 1.21 4.79 1.21h.01c5.46 0 9.91-4.45 9.91-9.91 0-2.65-1.03-5.14-2.9-7.01A9.82 9.82 0 0 0 12.04 2zm0 18.15h-.01c-1.52 0-3.01-.41-4.31-1.18l-.31-.18-3.2.84.85-3.12-.2-.32a8.23 8.23 0 0 1-1.26-4.39c0-4.54 3.7-8.24 8.25-8.24 2.2 0 4.27.86 5.82 2.42a8.18 8.18 0 0 1 2.41 5.83c0 4.54-3.7 8.24-8.24 8.24zm4.52-6.16c-.25-.12-1.47-.72-1.69-.81-.23-.08-.39-.12-.56.12-.17.25-.64.81-.79.97-.14.17-.29.19-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.02-.38.11-.51.11-.11.25-.29.37-.43.12-.14.17-.25.25-.41.08-.17.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.41-.42-.56-.43-.14-.01-.31-.01-.48-.01-.17 0-.43.06-.66.31-.23.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.56.12.17 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.11-.22-.17-.47-.29z'/%3E%3C/svg%3E") no-repeat center/contain}
.book .wpcf7{margin:0}
.cf7-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.cf7-grid p{margin:0;min-width:0}
.cf7-grid .wpcf7-form-control-wrap{display:block;min-width:0}
.cf7-grid .f-wide{grid-column:1 / -1}
.cf7-grid label{display:block;font-family:var(--display);letter-spacing:0.14em;text-transform:uppercase;font-size:0.74rem;font-weight:600;color:var(--ink);line-height:1.4}
.cf7-grid label .lbl-sub{color:#8A9A8E;font-weight:500;letter-spacing:0;text-transform:none;font-family:var(--serif);font-style:italic;font-size:0.98rem}
.cf7-grid input[type=text],.cf7-grid input[type=email],.cf7-grid input[type=tel],.cf7-grid textarea{width:100%;min-width:0;margin-top:8px;font-family:var(--text);font-size:1.02rem;color:var(--ink);background:var(--paper);border:1px solid rgba(182,139,60,0.5);padding:14px 16px;transition:border-color .3s,box-shadow .3s}
.cf7-grid input:focus,.cf7-grid textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(182,139,60,0.15)}
.cf7-grid textarea{resize:vertical;min-height:120px;line-height:1.5}
.cf7-grid input::placeholder,.cf7-grid textarea::placeholder{color:#9AA89D;font-style:italic}
.cf7-hint{display:block;margin-top:7px;font-size:0.9rem;font-style:italic;color:#7A8A7E}
/* Ideal Postcodes Address Finder dropdown — readable Lora, larger.
   High specificity + child targeting because the library sizes its own elements. */
.idpc_autocomplete .idpc_ul{background:var(--paper-pure);border:1px solid rgba(182,139,60,0.5);box-shadow:0 20px 44px -22px rgba(15,61,42,0.45);max-height:360px;overflow:auto;margin:4px 0 0;padding:0;list-style:none;z-index:50}
.idpc_autocomplete .idpc_ul .idpc_li,
.idpc_autocomplete .idpc_ul .idpc_li *,
.idpc_autocomplete .idpc_ul .idpc_error{font-family:var(--text)!important;font-size:1.3rem!important;line-height:1.45!important;text-transform:none!important;letter-spacing:0!important}
.idpc_autocomplete .idpc_ul .idpc_li{padding:15px 18px!important;color:var(--ink);cursor:pointer;border-bottom:1px solid rgba(182,139,60,0.18)}
.idpc_autocomplete .idpc_ul .idpc_li:last-child{border-bottom:none}
.idpc_autocomplete .idpc_ul .idpc_li.idpc_hover,.idpc_autocomplete .idpc_ul .idpc_li:hover{background:var(--paper-warm)}
.idpc_autocomplete .idpc_ul .idpc_error{font-style:italic;color:#7A8A7E;padding:13px 18px}
.cf7-grid .wpcf7-submit{width:100%;border:none;border-radius:0;cursor:pointer;margin-top:4px;padding:var(--btn-pad-y) var(--btn-pad-x);background:var(--gold);color:var(--ink-deep);font-family:var(--display);font-weight:600;letter-spacing:0.16em;text-transform:uppercase;font-size:var(--btn-fs);transition:all .4s var(--ease)}
.cf7-grid .wpcf7-submit:hover{background:var(--ink);color:#fff}
.book .wpcf7-not-valid-tip{color:#B23B3B;font-size:0.82rem;font-style:italic;margin-top:6px}
.book input.wpcf7-not-valid,.book textarea.wpcf7-not-valid{border-color:#B23B3B}
.book .wpcf7-response-output{display:none}
.book .wpcf7-form.sent .wpcf7-response-output,
.book .wpcf7-form.invalid .wpcf7-response-output,
.book .wpcf7-form.failed .wpcf7-response-output,
.book .wpcf7-form.unaccepted .wpcf7-response-output,
.book .wpcf7-form.spam .wpcf7-response-output{display:block;margin:22px 0 0!important;padding:16px 20px;font-style:italic;border:1px solid rgba(182,139,60,0.45);background:var(--paper-warm);color:var(--ink)}
.book .wpcf7-form.sent .wpcf7-response-output{border-left:3px solid var(--gold)}
.book .wpcf7-spinner{margin:0 0 0 12px}
/* CF7 emits trailing <p> blocks below the submit (address-finder script, hidden
   fields, honeypot) padded out with <br>s — no visible control, but a tall empty
   gap. The real fields all live inside .cf7-grid, so collapse these. Hidden inputs
   and scripts still function while display:none. */
.book .wpcf7-form > p{display:none}
/* Recent sold prices panel (HM Land Registry) — injected after the postcode field. */
.cl-sold-prices{grid-column:1 / -1;margin-top:2px;background:var(--paper-warm);border:1px solid rgba(182,139,60,0.45);border-left:3px solid var(--gold);padding:18px 22px;animation:cl-sp-in .4s var(--ease)}
.cl-sold-prices.is-empty{border-left-color:rgba(182,139,60,0.45)}
@keyframes cl-sp-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.cl-sp-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--display);font-size:0.82rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink)}
.cl-sp-median{font-family:var(--serif);font-style:italic;font-size:1.1rem;letter-spacing:0;text-transform:none;color:var(--gold-deep)}
.cl-sp-list{list-style:none;margin:12px 0 0;padding:0}
.cl-sp-list li{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid rgba(182,139,60,0.18);font-family:var(--text)}
.cl-sp-list li:last-child{border-bottom:none}
.cl-sp-addr{color:var(--ink);font-size:0.98rem}
.cl-sp-price{flex:0 0 auto;color:var(--ink);font-weight:600;white-space:nowrap}
.cl-sp-price em{font-style:normal;font-weight:400;color:#7A8A7E;font-size:0.88rem}
.cl-sp-note{margin-top:12px;font-family:var(--text);font-size:0.84rem;font-style:italic;color:#7A8A7E;line-height:1.45}
/* "Draw your lawn" tool — Leaflet map + actions, injected after the postcode field. */
#cl-lawn-tool{grid-column:1 / -1;margin-top:2px}
.cl-lawn-head{font-family:var(--display);font-size:0.82rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink)}
.cl-lawn-head span{font-family:var(--serif);font-style:italic;font-size:1rem;letter-spacing:0;text-transform:none;color:#8A9A8E}
.cl-lawn-hint{font-family:var(--text);font-size:0.92rem;color:#5C6F62;margin:6px 0 10px}
.cl-lawn-hint[data-state=busy]{color:var(--gold-deep);font-style:italic}
.cl-lawn-map{position:relative;height:340px;border:1px solid rgba(182,139,60,0.5);background:var(--paper-warm)}
.cl-lawn-x{position:absolute;top:50%;left:50%;width:32px;height:32px;margin:-16px 0 0 -16px;z-index:500;pointer-events:none}
.cl-lawn-x::before,.cl-lawn-x::after{content:"";position:absolute;background:rgba(182,139,60,0.95);box-shadow:0 0 0 1px rgba(8,33,23,0.5)}
.cl-lawn-x::before{left:50%;top:0;width:2px;height:100%;margin-left:-1px}
.cl-lawn-x::after{top:50%;left:0;height:2px;width:100%;margin-top:-1px}
.cl-lawn-map .leaflet-container{font-family:var(--text)}
.cl-lawn-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.cl-lawn-btn{cursor:pointer;border:none;padding:12px 20px;background:var(--gold);color:var(--ink-deep);font-family:var(--display);font-weight:600;letter-spacing:0.12em;text-transform:uppercase;font-size:0.74rem;transition:all .3s var(--ease)}
.cl-lawn-btn:hover{background:var(--ink);color:#fff}
.cl-lawn-btn-ghost{background:transparent;color:var(--ink);border:1px solid rgba(182,139,60,0.6)}
.cl-lawn-btn-ghost:hover{background:var(--paper-warm);color:var(--ink)}
.cl-plot-candidate{cursor:pointer;transition:fill-opacity .2s var(--ease)}
.cl-plot-candidate:hover{fill-opacity:0.28}
.cl-lawn-result{margin-top:12px;font-family:var(--text);font-size:1.05rem;color:var(--ink);background:var(--paper-warm);border-left:3px solid var(--gold);padding:12px 16px}
.cl-lawn-result strong{font-size:1.2rem;color:var(--gold-deep)}
.cl-lawn-note{display:block;margin-top:4px;font-size:0.82rem;font-style:italic;color:#7A8A7E}
.cl-lawn-cost,.cl-lawn-price{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;margin-top:12px;padding-top:12px;border-top:1px dashed rgba(15,61,42,0.25);font-family:var(--text);font-size:0.96rem;color:var(--ink)}
.cl-lawn-cost>b,.cl-lawn-price>b{flex-basis:100%;font-family:var(--display);letter-spacing:0.1em;text-transform:uppercase;font-size:0.72rem;color:var(--gold-deep)}
.cl-lawn-cost>span b,.cl-lawn-price>span b{color:var(--ink)}
.cl-lawn-price>span b{font-size:1.08rem}
.cl-lawn-cost>em,.cl-lawn-price>em{flex-basis:100%;font-size:0.8rem;color:#7A8A7E}
@media (max-width:560px){.cf7-grid{grid-template-columns:1fr}.cl-lawn-map{height:260px}}

/* CTA STRIP */
.cta-strip{background:linear-gradient(180deg,var(--ink) 0%,var(--ink-deep) 100%);color:#fff;padding:clamp(52px,8vw,92px) var(--space-gutter) clamp(18px,2.4vw,30px);text-align:center}
.cta-strip h2{font-family:var(--serif);font-weight:500;font-size:var(--fs-h2);line-height:1.08;color:#fff;margin-bottom:24px;max-width:18ch;margin-left:auto;margin-right:auto}
.cta-strip h2 em{font-style:italic;color:var(--gold)}
.cta-strip p{font-style:italic;color:rgba(232,217,176,0.9);font-size:var(--fs-lead);line-height:1.7;margin-bottom:36px;max-width:48ch;margin-left:auto;margin-right:auto}

/* ABOUT PAGE */
.about{background:var(--paper)}
.about-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,0.82fr) 1fr;gap:56px;align-items:start}
.about-photo{background:var(--paper-pure);padding:14px;border:1px solid rgba(182,139,60,0.4);box-shadow:0 34px 70px -36px rgba(15,61,42,0.4)}
.about-photo img{width:100%;height:auto;display:block}
.about-card{background:var(--paper-pure);border:1px solid rgba(15,61,42,0.12);padding:48px 52px}
.about-card .eyebrow{font-family:var(--display);letter-spacing:0.22em;text-transform:uppercase;font-size:0.74rem;color:var(--gold-deep);font-weight:600;display:block;margin-bottom:14px}
.about-card h1,.about-card h2{font-family:var(--serif);font-weight:500;font-size:clamp(38px,4.4vw,58px);line-height:1.04;letter-spacing:-0.012em;color:var(--ink);margin-bottom:26px}
.about-card .about-lead{font-style:italic;font-size:var(--fs-lead);line-height:1.5;color:var(--ink);margin-bottom:22px}
.about-card p{font-size:var(--fs-body);line-height:1.72;color:#4A5C50;margin-bottom:18px}
.about-card .about-cta{margin-top:18px}
.about-head-m{display:none}
@media (max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:28px;max-width:620px}
  .about-card{padding:36px 28px}
  /* Phone: heading sits above the photo. Desktop keeps it inside the card (untouched).
     Sibling selector means this only applies where a mobile head exists (homepage),
     so the /about page is unaffected. */
  .about-head-m{display:block}
  .about-head-m .eyebrow{font-family:var(--display);letter-spacing:0.22em;text-transform:uppercase;font-size:0.74rem;color:var(--gold-deep);font-weight:600;display:block;margin-bottom:12px}
  .about-head-m h2{font-family:var(--serif);font-weight:500;font-size:clamp(34px,8vw,46px);line-height:1.06;letter-spacing:-0.012em;color:var(--ink);margin:0}
  .about-head-m ~ .about-card > .eyebrow,
  .about-head-m ~ .about-card > h2{display:none}
}

/* FOOTER */
/* Footer shares the CTA strip's dark base so the two read as one continuous block */
footer.site-footer{background:var(--ink-deep);padding:clamp(8px,1.5vw,16px) var(--space-gutter) calc(12px + env(safe-area-inset-bottom));border-top:1px solid rgba(182,139,60,0.22);text-align:center}
/* negative top/bottom margins crop the logo PNG's built-in whitespace so it sits tight */
footer.site-footer img{height:clamp(198px,28.5vw,300px);display:block;margin:-34px auto -18px;filter:brightness(0) invert(1);opacity:0.96}
.footer-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 28px;margin-bottom:18px;font-family:var(--display);letter-spacing:0.16em;text-transform:uppercase;font-size:0.74rem;font-weight:600}
.footer-nav a{color:rgba(255,255,255,0.85);transition:color .3s}
.footer-nav a:hover{color:var(--gold)}
footer.site-footer .motto{font-family:var(--display);letter-spacing:0.32em;font-size:0.66rem;color:var(--gold);text-transform:uppercase;margin-bottom:14px}
footer.site-footer .copy{font-style:italic;color:rgba(255,255,255,0.62);font-size:1rem}

/* Breakpoints below carry only STRUCTURAL changes (layout, header, hero scrim).
   All type & spacing scale fluidly via the :root tokens above. */
@media (max-width:900px){
  .hero-inner{padding:60px 24px}
  .hero h1{white-space:normal;line-height:1.16}   /* desktop keeps one line; wrap below */
  .site-header-inner{padding:10px 22px}
  .site-brand img{height:42px}
  .site-header .header-cta{padding:11px 16px;font-size:0.68rem;letter-spacing:0.1em}
  .programmes-grid{gap:32px}
  .carousel-arrow.prev{left:14px}.carousel-arrow.next{right:14px}
  .carousel-arrow{width:42px;height:42px;font-size:1.2rem}
  body:not(.home){padding-top:calc(62px + env(safe-area-inset-top))}
}
@media (max-width:560px){
  /* Strapline pinned TOP (in the sky); paragraph + button pinned BOTTOM; clean
     lawn between. Scrim darkens both top and bottom so both text zones stay legible. */
  /* Height is locked to the real measured viewport via JS (--hero-h) because
     Safari 26 renders every CSS viewport unit (vh/svh/dvh/lvh) shorter than the
     actual screen. 100vh is only the pre-JS fallback. */
  .hero{height:auto;min-height:100vh;min-height:var(--hero-h,100vh);align-items:stretch;padding:0}
  /* Dedicated portrait image on mobile (overrides the inline desktop image) */
  /* extend the image past the very bottom so it always reaches the screen edge */
  /* Mobile: hide the single desktop image, show the carousel + its scrim */
  .hero-bg{display:none}
  .hero-carousel{display:block;background-color:var(--ink-deep)}
  .hero-carousel::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg, rgba(8,33,23,0.94) 0%, rgba(8,33,23,0.88) 22%, rgba(8,33,23,0.62) 38%, rgba(8,33,23,0.18) 52%, rgba(8,33,23,0.05) 64%, rgba(8,33,23,0.32) 84%, rgba(8,33,23,0.55) 100%)}
  .hero-inner{display:flex;flex-direction:column;padding:calc(116px + env(safe-area-inset-top)) 22px var(--hero-pad-bottom,104px)}
  .hero h1{font-size:40px;line-height:1.14;margin-bottom:16px;text-shadow:0 2px 4px rgba(0,0,0,0.9),0 4px 22px rgba(0,0,0,0.55)}
  .hero-sub{font-style:normal;font-size:1.58rem;line-height:1.5;margin-top:auto;margin-bottom:22px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,0.85),0 2px 16px rgba(0,0,0,0.55)}
  /* In-hero button hidden on mobile — the header CTA is the single call to action */
  .hero-ctas{display:none}
  .hero-sub{order:2}
  .btn-primary{width:100%;justify-content:center}
  .site-header-inner{padding:15px 16px;gap:12px}
  .site-brand img{height:58px}
  .site-header .header-cta{padding:9px 12px;font-size:0.6rem;letter-spacing:0.06em;gap:7px}
  /* Single CTA on mobile lives in the header (top-right); the in-hero button is hidden */
  .section-head .eyebrow{font-size:0.72rem;margin-bottom:14px}
  .programme{padding:32px 26px}
  .about-card{padding:30px 22px}
  .book-form{grid-template-columns:1fr}
  /* Tighten the bottom on mobile: book->footer gap + footer padding + internals */
  .book{padding-bottom:30px}
  footer.site-footer{padding:4px var(--space-gutter) calc(10px + env(safe-area-inset-bottom))}
  footer.site-footer img{height:240px;margin:-28px auto -14px}
  .footer-nav{font-size:0.84rem;margin-bottom:10px}
  footer.site-footer .motto{font-size:0.72rem;margin-bottom:8px}
  footer.site-footer .copy{font-size:1.08rem;line-height:1.45}
}