/* ============================================================
   Banana Stand starter styles
   Skin a client site by changing the variables below, then
   layering brand-specific section styles at the bottom.
   ============================================================ */
:root {
  --color-brand:    #0057FF;  /* primary brand color  */
  --color-brand-2:  #FFB200;  /* secondary / accent   */
  --color-dark:     #1d1d1f;  /* dark bands, footer   */
  --color-light:    #f5f6f8;  /* light bands          */
  --color-text:     #222;
  --color-text-inv: #fff;
  --font-heading:   Georgia, 'Times New Roman', serif;
  --font-body:      -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --container:      1200px;
  --section-pad:    72px;
  --radius:         8px;
}

/* ---- Base ---- */
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-body); color: var(--color-text); line-height: 1.6; }
h1, h2, h3, h4 { font-family: var(--font-heading); line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: clamp(2rem, 5vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.4rem); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-brand); }

.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.container--narrow { max-width: 820px; }
.center-text { text-align: center; }

/* ---- Sections ---- */
.page-section { position: relative; }
.block { padding: var(--section-pad) 0; }
.block__no-space-top { padding-top: 0; }
.block__no-space-bottom { padding-bottom: 0; }
.section-title + .section-subtitle { margin-top: -0.5em; }
.section-subtitle { font-size: 1.15rem; opacity: .8; margin-bottom: 1.5em; }

/* Background bands (set per-section in the editor) */
.bg-band-dark  { background: var(--color-dark);  color: var(--color-text-inv); }
.bg-band-brand { background: var(--color-brand); color: var(--color-text-inv); }
.bg-band-light { background: var(--color-light); }
.bg-band-dark a:not(.site-btn), .bg-band-brand a:not(.site-btn) { color: inherit; }

/* ---- Buttons ---- */
.site-btn {
  display: inline-block; padding: 14px 28px; border-radius: var(--radius);
  background: var(--color-brand); color: #fff; text-decoration: none;
  font-weight: 700; transition: filter .15s ease; margin: 4px;
}
.site-btn:hover { filter: brightness(1.12); }
.site-btn--ghost { background: transparent; border: 2px solid currentColor; color: inherit; }

/* ---- Header / footer ---- */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.08); }
.site-header__inner { display: flex; align-items: center; gap: 24px; padding-top: 12px; padding-bottom: 12px; }
.site-logo img { max-height: 56px; width: auto; }
.site-nav { margin-left: auto; }
.site-nav__menu { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.site-nav__menu a { text-decoration: none; color: var(--color-text); font-weight: 600; }
.site-nav__menu a:hover { color: var(--color-brand); }
.site-phone { font-weight: 700; text-decoration: none; white-space: nowrap; }
.nav-toggle { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.nav-toggle span { display: block; width: 24px; height: 3px; background: var(--color-text); margin: 4px 0; border-radius: 2px; }

.site-footer { background: var(--color-dark); color: #fff; margin-top: 0; }
.site-footer a { color: #fff; }
.site-footer__inner { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; padding: 56px 24px; }
.site-footer__legal { border-top: 1px solid rgba(255,255,255,.15); padding: 16px 0; font-size: .9rem; }
.site-footer img { max-height: 64px; width: auto; }

/* ---- Hero ---- */
.hero-section { color: var(--color-text-inv); overflow: hidden; }
.hero-section__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.hero-section__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.hero-section__content { position: relative; padding: 140px 24px; text-align: center; }
.hero-section--small .hero-section__content { padding: 80px 24px; }
.hero-section--plain { background: var(--color-brand); }
.hero-section__subtitle { font-size: 1.3rem; }
/* Service-landing hero: copy left, quote form right (TMM standard) */
.hero-section--with-form .hero-section__content { display: grid; grid-template-columns: 1.2fr minmax(320px, 420px); gap: 48px; align-items: center; text-align: left; }
.hero-section--with-form .hero-section__buttons { justify-content: flex-start; }
.hero-section__embed { background: #fff; color: var(--color-text); border-radius: var(--radius, 8px); padding: 28px 24px; box-shadow: 0 16px 40px rgba(0,0,0,.25); }
.embed-phone { margin-top: 14px; text-align: center; font-weight: 600; }
.embed-phone a { color: var(--color-brand); text-decoration: none; }
@media (max-width: 900px) { .hero-section--with-form .hero-section__content { grid-template-columns: 1fr; text-align: center; } .hero-section--with-form .hero-section__buttons { justify-content: center; } }
.hero-section__logo, .hero-section__icon { margin: 0 auto 20px; max-height: 110px; width: auto; }

/* ---- Image + text ---- */
.image-text__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.image-text--img-right .image-text__media { order: 2; }
.image-text__media img { border-radius: var(--radius); }

/* ---- Image background CTA ---- */
.with-image-bg { color: var(--color-text-inv); }
.with-image-bg__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.with-image-bg__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.55); }
.with-image-bg__content { position: relative; }

/* ---- Grids ---- */
.icon-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 32px; margin: 40px 0; text-align: center; }
.icon-grid__item img { margin: 0 auto 14px; max-height: 72px; width: auto; }

.service-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; margin: 40px 0; }
.service-card { display: block; background: #fff; border-radius: var(--radius); box-shadow: 0 4px 18px rgba(0,0,0,.10); padding: 28px; text-decoration: none; color: inherit; transition: transform .15s ease; }
.service-card:hover { transform: translateY(-4px); }
.service-card img { border-radius: var(--radius); margin-bottom: 16px; }
.service-card__more { color: var(--color-brand); font-weight: 700; }

.post-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; margin: 40px 0; }
.post-card h3 { margin-top: 12px; }
.post-card a { text-decoration: none; color: inherit; }

/* ---- Gallery ---- */
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin: 32px 0; }
.gallery-grid img { width: 100%; height: 220px; object-fit: cover; border-radius: var(--radius); }
.gallery-carousel { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 32px 0; padding-bottom: 8px; }
.gallery-carousel .gallery-item { flex: 0 0 320px; scroll-snap-align: start; }
.gallery-carousel img { width: 320px; height: 220px; object-fit: cover; border-radius: var(--radius); }

/* ---- Logo strip ---- */
.logo-strip { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 40px; }
.logo-strip img { max-height: 64px; width: auto; filter: grayscale(1); opacity: .75; transition: all .15s ease; }
.logo-strip img:hover { filter: none; opacity: 1; }

/* ---- FAQ ---- */
.faq-list { margin-top: 32px; }
.faq-item { border-bottom: 1px solid rgba(0,0,0,.12); padding: 4px 0; }
.faq-item summary { cursor: pointer; font-weight: 700; padding: 14px 0; list-style: none; position: relative; padding-right: 32px; }
.faq-item summary::after { content: "+"; position: absolute; right: 4px; font-size: 1.4rem; color: var(--color-brand); }
.faq-item[open] summary::after { content: "\\2212"; }
.faq-item__answer { padding: 0 0 16px; }

/* ---- Map / embeds / video ---- */
.map-section__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.embed-wrap { margin: 24px auto; max-width: 100%; }
.embed-wrap iframe { max-width: 100%; border: 0; }
.video-wrap { position: relative; aspect-ratio: 16 / 9; margin: 24px 0; }
.video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--radius); }

/* ---- CTA band / contact ---- */
.cta-band:not(.bg-band-dark):not(.bg-band-brand):not(.bg-band-light) { background: var(--color-brand); color: #fff; }
.contact-section:not(.bg-band-light):not(.bg-band-brand) { background: var(--color-dark); color: #fff; }

/* ---- Separator ---- */
.separator { border: 0; }
.separator--line { border-top: 2px solid var(--color-brand-2); width: 120px; margin: 0 auto; }
.separator--spacer { height: 24px; }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  :root { --section-pad: 48px; }
  .image-text__inner, .map-section__inner, .site-footer__inner { grid-template-columns: 1fr; }
  .image-text--img-right .image-text__media { order: 0; }
  .site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; padding: 16px 24px; box-shadow: 0 8px 16px rgba(0,0,0,.12); }
  .site-nav.is-open { display: block; }
  .site-nav__menu { flex-direction: column; gap: 12px; }
  .nav-toggle { display: block; margin-left: auto; }
  .site-header__cta .site-btn { display: none; }
}


/* ---- Optional layouts (v0.10): hero picker, in-page nav, request flyout, content rail, mobile call bar ---- */
[hidden] { display: none !important; }
:root { --bs-header-h: 72px; --bs-subnav-h: 0px; --bs-bar-h: 0px; }
[id] { scroll-margin-top: calc(var(--bs-header-h) + var(--bs-subnav-h) + 16px); }
body { padding-bottom: calc(var(--bs-bar-h) + env(safe-area-inset-bottom, 0px)); }
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; }

/* hero picker tiles: form choices styled as chips, never .site-btn */
.picker { margin-top: 28px; }
.picker__title { font-size: 1.1rem; margin: 0 0 4px; }
.picker__note { opacity: .85; margin: 0 0 12px; }
.picker__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.picker__cell { display: grid; }
.picker__tile { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 16px; border-radius: 999px; border: 2px solid var(--color-brand); color: inherit; text-decoration: none; font-weight: 600; }
.picker__tile[aria-current="true"] { background: var(--color-brand); color: var(--color-text-inv); }
.picker__icon { width: 22px; height: 22px; }

/* in-page nav */
.bs-subnav { position: sticky; top: var(--bs-header-h); z-index: 40; display: flex; align-items: center; gap: 24px; min-height: 52px; padding: 0 24px; background: var(--color-light); }
.bs-subnav__label { margin: 0; font-weight: 600; opacity: .7; white-space: nowrap; }
.bs-subnav__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 24px; overflow-x: auto; scrollbar-width: none; flex: 1; }
.bs-subnav__list::-webkit-scrollbar { display: none; }
.bs-subnav__link { display: inline-flex; align-items: center; min-height: 52px; min-width: 44px; padding: 0 2px; border-bottom: 3px solid transparent; color: var(--color-text); text-decoration: none; font-weight: 600; white-space: nowrap; }
.bs-subnav__link:hover, .bs-subnav__link[aria-current="true"] { color: var(--color-brand); border-bottom-color: var(--color-brand); }
.bs-subnav__tel { font-weight: 700; color: var(--color-text); text-decoration: none; white-space: nowrap; }
.bs-subnav__cta { white-space: nowrap; }
body.has-subnav { --bs-subnav-h: 52px; }
@media (max-width: 900px) { .bs-subnav { gap: 16px; } .bs-subnav__label, .bs-subnav__tel, .bs-subnav__cta { display: none; } }

/* request flyout: desktop edge tab + panel; phone bottom sheet */
.bs-flytab { position: fixed; right: 0; top: 50%; z-index: 110; min-width: 44px; padding: 16px 12px; border: 0; border-radius: var(--radius) 0 0 var(--radius); background: var(--color-brand); color: var(--color-text-inv); font-weight: 700; cursor: pointer; transform: translate(110%, -50%); transition: transform .34s cubic-bezier(.4,0,.2,1); }
.bs-flytab.is-docked { transform: translate(0, -50%); }
.bs-flytab__label { writing-mode: vertical-rl; transform: rotate(180deg); }
.bs-veil { position: fixed; inset: 0; z-index: 115; background: rgba(0,0,0,.6); background: color-mix(in srgb, var(--color-dark) 60%, transparent); }
.bs-flyout { position: fixed; right: 0; top: 50%; z-index: 120; width: min(388px, calc(100vw - 2rem)); max-height: 92vh; overflow: auto; padding: 28px 24px; background: #fff; color: var(--color-text); border-radius: var(--radius) 0 0 var(--radius); box-shadow: 0 16px 40px rgba(0,0,0,.25); transform: translate(108%, -50%); transition: transform .34s cubic-bezier(.4,0,.2,1); }
.bs-flyout.is-open { transform: translate(0, -50%); }
.bs-flyout__close { position: absolute; top: 10px; right: 12px; border: 0; background: none; font-size: 1.6rem; line-height: 1; cursor: pointer; min-width: 44px; min-height: 44px; }
.bs-flyout__title { margin: 0 32px 6px 0; }
.bs-flyout__subtitle { margin: 0 0 12px; opacity: .85; }
.bs-flyout__legal { margin: 14px 0 0; font-size: .85rem; opacity: .8; }
@media (max-width: 900px) {
  .bs-flytab { display: none; }
  .bs-flyout { top: auto; bottom: 0; left: 0; right: 0; width: auto; max-height: 86vh; border-radius: var(--radius) var(--radius) 0 0; transform: translateY(104%); }
  .bs-flyout.is-open { transform: translateY(0); }
}

/* content + sticky form rail */
.bs-rail-body { display: grid; grid-template-columns: minmax(0, 1fr) 344px; gap: 40px; align-items: start; }
.bs-rail__aside { position: sticky; top: calc(var(--bs-header-h) + var(--bs-subnav-h) + 16px); }
.bs-rail__card { background: #fff; padding: 24px; border-radius: var(--radius); box-shadow: 0 12px 32px rgba(0,0,0,.12); }
.bs-rail__title { margin: 0 0 12px; }
@media (max-width: 1100px) { .bs-rail-body { grid-template-columns: minmax(0, 1fr) 320px; } }
@media (max-width: 900px) { .bs-rail-body { grid-template-columns: 1fr; } .bs-rail__aside { display: none; } }

/* mobile call bar (Site Settings toggle) */
.bs-bar { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; height: 60px; padding-bottom: env(safe-area-inset-bottom, 0px); }
.bs-bar__call, .bs-bar__cta { flex: 1; display: flex; align-items: center; justify-content: center; font-weight: 700; text-decoration: none; min-height: 60px; }
.bs-bar__call { background: var(--color-dark); color: var(--color-text-inv); }
.bs-bar__cta { background: var(--color-brand); color: var(--color-text-inv); }
@media (max-width: 900px) { .bs-bar { display: flex; } body.has-call-bar { --bs-bar-h: 60px; } }
@media (prefers-reduced-motion: reduce) { .bs-flytab, .bs-flyout, .bs-subnav__link { transition: none !important; } }

/* ============================================================
   CLIENT SKIN - Ridout Construction (revision 3.1, 2026-10-08).
   Pasted verbatim from the mockups: the :root block from build-mockups.py, then mockups/styles.css.
   Variation is keyed to section ids; the list is at the top of the pasted stylesheet.
   ============================================================ */
:root{
  --color-brand:#D2A31E; --color-brand-2:#841A00; --color-dark:#1C1B1A; --color-light:#F3F3F3;
  --color-text:#1C1B1A; --color-text-inv:#FFFFFF;
  --font-heading:"Plus Jakarta Sans", Verdana, sans-serif;
  --font-body:"Figtree", Verdana, sans-serif;
  --container:1304px; --section-pad:112px; --radius:4px;
  --ink-2:#2B2A28; --ink-3:#141312; --body:#3A3937; --soft:#5E5D5B; --white:#FFFFFF;
  --line:#E2E2E0; --line-dark:rgba(255,255,255,.16); --gold-deep:#B8890F;
  --measure:660px; --unit:8px; --cut:22px; --it-gap:96px;
  --shadow:0 24px 60px rgba(20,19,18,.16);
}

/* Ridout Construction - client skin. Revision 3 (2026-10-05): the revision 2 design on Banana Stand v0.10.0.
   Written against the theme's own classes (markup kit) and the canonical :root tokens, so the Build Skill
   pastes this file under the CLIENT SKIN line unchanged. It loads after the theme's css/custom.css
   (theme-base.css in the mockups) and overrides it.

   HOW VARIATION SURVIVES THE BUILD
   The import carries field values and the section id. It does not carry modifier classes, the Background
   option or the image side. So everything that makes one section differ from another of the same layout
   is keyed to its SECTION ID below. Keep these ids when a section is edited or moved:
     bands, gray:   #checks #rooms #land #tour #counties #homes-here #letters #timeline #process-faq #warranty-faq (+ every map section)
     bands, dark:   #panels #facts #coverage (+ every contact block except #contact-main)
     photo right:   #land #next-generation #in-person
     icon grids:    #steps #timeline #checks #facts #coverage #counties #letters #letters-featured
     card sections: #panels #communities (image panels)  #models (four across)
     image + text:  #owners (framed portrait)  #flyover #tour (wide poster)
     galleries:     #rooms (mosaic)  #gallery-page (bespoke filterable template)
     title strip:   #page-title (Gallery, Contact)
   A section added later in wp-admin gets the plain default for its layout, and its Background option works. */

/* ---------------------------------------------------------------- base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--color-text);font:400 18px/1.62 var(--font-body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-text)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--color-brand);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--font-heading);font-weight:700;letter-spacing:-.022em;line-height:1.08;margin:0 0 .5em;color:inherit;text-wrap:balance}
h1{font-weight:800;font-size:clamp(38px,4.8vw,60px)}
h2{font-size:clamp(30px,3.3vw,46px)}
h3{font-size:clamp(20px,1.8vw,24px);letter-spacing:-.012em;line-height:1.2}
p{margin:0 0 1em}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 32px}
.nw{white-space:nowrap}
/* the theme centers every title block; this design sets them left and centers only where stated */
.page-section .center-text{text-align:left}
.page-section .center-text:empty{display:none}
.page-section .container > .center-text:first-child{margin-bottom:52px}
.section-title{margin:0}
.section-title + .section-subtitle{margin-top:16px}
.section-subtitle{font-size:clamp(18px,1.5vw,21px);line-height:1.55;opacity:1;margin:0;color:var(--body);max-width:56ch}
.entry-content p:last-child{margin-bottom:0}
/* the logo's wide diamond is used only beside items in a set (credentials, counties, names, numbered steps),
   never alone above a title (team review 2026-10-08) */
.text-link{display:inline-block;font:600 16px/1.3 var(--font-heading);color:var(--color-text);text-decoration:none;border-bottom:2px solid var(--color-brand);padding-bottom:3px;transition:color .2s ease}
.text-link:hover{color:var(--color-brand-2)}
.more{margin:22px 0 0}

/* bands, by section id (see the note at the top) */
:is(#checks,#rooms,#land,#tour,#counties,#homes-here,#letters,#timeline,#process-faq,#warranty-faq){background:var(--color-light)}
:is(#panels,#facts,#coverage){background:var(--color-dark);color:var(--color-text-inv)}
.bg-band-dark .section-subtitle,:is(#panels,#facts,#coverage) .section-subtitle{color:rgba(255,255,255,.8)}
.bg-band-brand{color:var(--color-text)}

/* buttons: gold is the one money action, charcoal text on it */
.site-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;margin:0;padding:14px 28px;background:var(--color-brand);color:var(--color-text);font:700 15.5px/1.1 var(--font-heading);text-decoration:none;border:0;border-radius:var(--radius);cursor:pointer;transition:background-color .2s ease,color .2s ease;white-space:nowrap}
.site-btn:hover{background:var(--gold-deep);filter:none}
.hero-section__buttons .site-btn,.with-image-bg .site-btn{min-height:58px;padding:18px 34px;font-size:17px}
/* a button field that is a text link in this design (icon grid and gallery sections, by id) */
:is(#steps,#letters-featured,#rooms) .site-btn{min-height:0;padding:0 0 3px;background:none;border-radius:0;border-bottom:2px solid var(--color-brand);font:600 16px/1.3 var(--font-heading);color:var(--color-text);white-space:normal}
:is(#steps,#letters-featured,#rooms) .site-btn:hover{background:none;color:var(--color-brand-2)}
/* the one extra button, by Blair's instruction: "Ask about land" */
#land .site-btn{margin-top:26px;min-height:58px;padding:18px 34px;font-size:17px}

/* photo tags: a classed line inside a content field, placed on the photo */
.plate{position:absolute;z-index:2;display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px 10px;max-width:calc(100% - 48px);margin:0;padding:10px 16px 10px 14px;background:rgba(20,19,18,.88);color:#fff;font:600 14px/1.3 var(--font-heading)}
.plate::before{content:"";width:15px;height:8px;flex:none;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.plate__name{white-space:nowrap}
.plate__where{font-weight:500;color:rgba(255,255,255,.82)}
.plate__where::before{content:"";display:inline-block;width:1px;height:13px;background:rgba(255,255,255,.3);margin:0 10px -2px 0}

/* ---------------------------------------------------------------- header */
.site-header{position:sticky;top:0;z-index:50;background:var(--white);box-shadow:0 1px 0 var(--line)}
.site-header__inner{display:flex;align-items:center;gap:32px;min-height:124px;padding-top:0;padding-bottom:0}
.site-logo{display:block;flex:none}
.site-logo img{width:152px;height:auto;max-height:none}
.site-nav{margin-left:auto}
.site-nav__menu{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.site-nav__menu > li{position:relative}
.site-nav__menu > li > a{position:relative;display:inline-block;padding:14px 14px;font:600 15.5px/1.2 var(--font-heading);color:var(--color-text);text-decoration:none;white-space:nowrap}
.site-nav__menu a:hover{color:var(--color-text)}
.site-nav__menu > li > a::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;background:var(--color-brand);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.site-nav__menu > li > a:hover::after,.site-nav__menu > li:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor) > a::after{transform:scaleX(1)}
.site-nav .sub-menu{position:absolute;left:0;top:100%;min-width:280px;margin:0;padding:10px 0;list-style:none;background:var(--white);box-shadow:0 18px 40px rgba(20,19,18,.14);border-top:3px solid var(--color-brand);display:none;z-index:60}
.site-nav .sub-menu a{display:block;padding:11px 20px;font:500 15px/1.3 var(--font-heading);color:var(--color-text);text-decoration:none}
.site-nav .sub-menu a:hover{background:var(--color-light)}
.site-nav li.menu-item-has-children:hover > .sub-menu,.site-nav li.menu-item-has-children:focus-within > .sub-menu{display:block}
/* phone sits above the button, so the header needs no extra width for it */
.site-header__cta{display:flex;flex-direction:row-reverse;align-items:center;gap:22px;flex:none}
.site-header__cta .site-phone{display:inline-flex;align-items:center;gap:9px;font:700 16px/1.2 var(--font-heading);color:var(--color-text);text-decoration:none;letter-spacing:-.005em}
.site-header__cta .site-phone::before{content:"";width:21px;height:21px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C1B1A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.9 2z'/%3E%3C/svg%3E") center/contain no-repeat}
.site-header__cta .site-phone:hover{color:var(--color-brand-2)}
.nav-toggle{display:none}

/* ---------------------------------------------------------------- heroes */
.hero-section{padding:0;color:var(--color-text-inv);background:var(--color-dark);overflow:hidden}
.hero-section__content{position:relative;z-index:1;padding:0 32px;text-align:left}
.hero-section__subtitle{font-size:clamp(18px,1.5vw,21px);line-height:1.55;margin:0}

/* full hero: photo behind, copy on the header grid */
.section-hero-full .hero-section__bg::after{background:linear-gradient(90deg,rgba(20,19,18,.88) 0%,rgba(20,19,18,.68) 34%,rgba(20,19,18,.24) 66%,rgba(20,19,18,.06) 100%),linear-gradient(0deg,rgba(20,19,18,.5) 0%,rgba(20,19,18,0) 34%)}
.section-hero-full .hero-section__main{display:flex;flex-direction:column;align-items:flex-start}
.section-hero-full h1{font-size:clamp(42px,5.2vw,74px);line-height:1.02;max-width:13ch;margin-bottom:22px}
.section-hero-full .hero-section__subtitle{max-width:44ch;color:rgba(255,255,255,.92);margin-bottom:34px}
.section-hero-full .hero-section__buttons{order:2}
.section-hero-full .hero-section__content-text{order:3;width:100%}
/* home: the credentials bar overlaps the bottom edge of the photo */
#home-hero{overflow:visible}
#home-hero .hero-section__content{min-height:700px;display:flex;flex-direction:column;justify-content:center;padding-top:64px;padding-bottom:150px}
#home-hero .plate{right:32px;bottom:104px}
.trust-list{position:absolute;left:32px;right:32px;bottom:0;transform:translateY(50%);z-index:3;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--white);color:var(--color-text);border:1px solid var(--line)}
.trust-list li{padding:30px;border-left:1px solid var(--line)}
.trust-list li:first-child{border-left:0}
.trust-list strong{position:relative;display:block;font:700 19px/1.2 var(--font-heading);letter-spacing:-.01em;margin-bottom:6px;padding-left:26px}
.trust-list strong::before{content:"";position:absolute;left:0;top:.36em;width:17px;height:9px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.trust-list span{display:block;font:400 15px/1.45 var(--font-body);color:var(--soft);padding-left:26px}
#home-hero + .page-section{padding-top:196px}

/* service-page hero: the form on the right */
.hero-section--with-form .hero-section__content{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center;padding-top:80px;padding-bottom:104px;text-align:left}
.hero-section--with-form h1{max-width:11ch}
.hero-section--with-form .hero-section__subtitle{margin-bottom:28px}
.hero-section--with-form .plate{left:32px;bottom:32px}
.proof-list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:10px}
.proof-list li{position:relative;padding-left:26px;font:600 15px/1.4 var(--font-heading);color:#fff}
.proof-list li::before{content:"";position:absolute;left:0;top:.4em;width:15px;height:8px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.hero-section__embed{margin:0;background:var(--white);color:var(--color-text);padding:30px 30px 24px;border-radius:0;box-shadow:none;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.embed-phone{margin:16px 0 0;text-align:center;font:600 16px/1.4 var(--font-heading)}
.embed-phone a{color:var(--color-text);text-decoration:none;border-bottom:2px solid var(--color-brand);padding-bottom:1px}
.embed-phone a:hover{color:var(--color-brand-2)}

/* forms (stand-ins for the Lead Monkey embed) */
.form-card__title{font-size:26px;margin:0 0 6px}
.form-micro{font:400 15px/1.5 var(--font-body);color:var(--soft);margin:0 0 16px}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.form-grid--two{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-grid .span-2{grid-column:span 2}
.form-grid .full{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field label{font:600 14px/1.3 var(--font-heading);color:var(--color-text)}
.field input,.field select,.field textarea{width:100%;min-height:44px;padding:9px 12px;font:400 16px/1.4 var(--font-body);color:var(--color-text);background:var(--white);border:1px solid #8E8D8A;border-radius:var(--radius)}
.field textarea{min-height:104px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--color-brand);outline:3px solid rgba(210,163,30,.35);outline-offset:0}
.form-card .site-btn{width:100%;margin-top:16px}
.fine{font:400 14px/1.5 var(--font-body);color:var(--soft);margin:12px 0 0}
.fine a{color:var(--soft)}

/* interior title band: photo with a neutral gradient */
.hero-section--small{min-height:340px;display:flex;align-items:flex-end}
.hero-section--small .hero-section__bg{background-position:center 40%}
.hero-section--small .hero-section__bg::after{background:linear-gradient(180deg,rgba(20,19,18,.28) 0%,rgba(20,19,18,.52) 50%,rgba(20,19,18,.9) 100%)}
.hero-section--small .hero-section__content{width:100%;padding:88px 32px 48px}
.hero-section--small h1{margin-bottom:10px;max-width:20ch}
.hero-section--small .hero-section__subtitle{max-width:52ch;color:rgba(255,255,255,.88)}
/* no photo (policy pages): a short charcoal band */
.hero-section--small:not(:has(.hero-section__bg)){min-height:0}
.hero-section--small:not(:has(.hero-section__bg)) .hero-section__content{padding-top:64px;padding-bottom:44px}
/* Gallery and Contact: no hero by the team's rule. A plain title line on white carries the h1. */
#page-title{background:var(--white);color:var(--color-text)}
#page-title .hero-section__content{padding:72px 32px 0}
#page-title h1{margin:0;max-width:none}
#page-title .hero-section__subtitle{margin-top:12px;color:var(--body)}
#page-title + .page-section{padding-top:40px}

/* ---------------------------------------------------------------- intro */
.section-intro{padding-top:calc(var(--section-pad) / 2)}
.section-intro .container{max-width:900px;text-align:center}
.section-intro .section-title{margin-bottom:24px}
.section-intro .entry-content{font-size:clamp(18px,1.45vw,20px);line-height:1.68;color:var(--body)}
/* legal pages */
#policy .container{max-width:calc(var(--measure) + 64px);text-align:left}
#policy .entry-content{font-size:18px;line-height:1.62}
#policy h2{font-size:24px;margin-top:1.6em}
#policy ul{padding-left:22px}
#policy .updated{color:var(--soft);font:500 14px/1.4 var(--font-heading)}

/* ---------------------------------------------------------------- image + text */
.image-text__inner{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--it-gap);align-items:center;container-type:inline-size}
.image-text__media{position:relative;margin:0;isolation:isolate;align-self:stretch;display:flex}
.image-text__media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:0;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.image-text__body .section-title{max-width:18ch;margin-bottom:.5em}
.image-text__body .entry-content{color:var(--body)}
.image-text .plate{left:32px;bottom:24px;max-width:calc((100cqw - var(--it-gap)) * 5 / 11 - 24px)}
.signature{margin:26px 0 0;padding-top:20px;border-top:1px solid var(--line);font:700 16px/1.4 var(--font-heading);color:var(--color-text)}
.signature span{display:block;font:400 15px/1.4 var(--font-body);color:var(--soft)}
.pull{margin:28px 0 0;padding:0 0 0 24px;border-left:3px solid var(--color-brand);font:600 22px/1.4 var(--font-heading);letter-spacing:-.01em;color:var(--color-text)}
.pull cite{display:block;margin-top:10px;font:500 15px/1.3 var(--font-body);font-style:normal;color:var(--soft)}
/* owners: portrait in a gold frame, not stretched */
#owners .image-text__media{align-self:center;display:block}
#owners .image-text__media img{aspect-ratio:4/5;object-position:center 18%;clip-path:none}
/* wide poster (was the video section): title and caption, then the photo full width with its tag */
:is(#flyover,#tour) .image-text__inner{display:flex;flex-direction:column;align-items:stretch;gap:36px}
:is(#flyover,#tour) .image-text__media{order:2}
:is(#flyover,#tour) .image-text__media img{aspect-ratio:16/9}
:is(#flyover,#tour) .image-text__body .section-title{max-width:none;margin-bottom:14px}
:is(#flyover,#tour) .image-text__body .entry-content{max-width:64ch;color:var(--soft);font-size:16px;line-height:1.55}
:is(#flyover,#tour) .more{margin-top:14px}
:is(#flyover,#tour) .plate{left:32px;bottom:24px;top:auto;transform:none;max-width:calc(100% - 96px)}

/* ---------------------------------------------------------------- image background call to action */
.with-image-bg{padding:140px 0;color:var(--color-text-inv);background:var(--color-dark)}
.with-image-bg__bg::after{background:linear-gradient(90deg,rgba(20,19,18,.9) 0%,rgba(20,19,18,.66) 48%,rgba(20,19,18,.3) 100%)}
.with-image-bg__content{position:relative;z-index:1}
.with-image-bg .section-title{font-size:clamp(34px,4.2vw,56px);max-width:16ch;margin-bottom:14px}
.with-image-bg .entry-content p{font-size:20px;max-width:44ch;margin-bottom:30px;color:rgba(255,255,255,.9)}

/* ---------------------------------------------------------------- icon grid. Default first, then the six uses by id. */
.icon-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px 36px;margin:0;text-align:left}
.icon-grid__item img{margin:0 0 20px;width:52px;height:52px;max-height:none}
.icon-grid__item h3{font-size:21px;margin-bottom:8px}
.icon-grid__item p{margin:0;font-size:16px;line-height:1.55;color:var(--body)}
.section-icon-grid .container > .center-text:last-child{margin-top:36px}

/* numbered diamond for real sequences (#steps, #timeline) */
:is(#steps,#timeline) .icon-grid{counter-reset:step;position:relative}
:is(#steps,#timeline) .icon-grid__item{counter-increment:step;position:relative}
:is(#steps,#timeline) .icon-grid__item::before{content:counter(step);position:absolute;left:0;top:0;width:66px;height:35px;display:grid;place-items:center;background:var(--color-brand-2);color:#fff;font:700 15px/1 var(--font-heading);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}

/* #steps: four across, the link beside the title */
#steps .container{display:grid;grid-template-columns:1fr auto;grid-template-areas:"head link" "grid grid";column-gap:48px;row-gap:56px;align-items:end}
#steps .container > .center-text:first-child{grid-area:head;margin:0}
#steps .container > .center-text:last-child{grid-area:link;margin:0}
#steps .icon-grid{grid-area:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 36px}
#steps .icon-grid::before{content:"";position:absolute;left:0;right:0;top:17px;height:1px;background:var(--line)}
#steps .icon-grid__item{padding-top:64px}

/* #timeline: title on the left, six steps down the right */
#timeline .container{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:88px;align-items:start}
#timeline .container > .center-text:first-child{position:sticky;top:148px;margin:0}
#timeline .icon-grid{display:block}
#timeline .icon-grid__item:not(:last-child)::after{content:"";position:absolute;left:33px;top:35px;bottom:0;width:1px;background:#C9C8C5}
#timeline .icon-grid__item{padding:2px 0 44px 108px;min-height:80px}
#timeline .icon-grid__item:last-child{padding-bottom:0}
#timeline .icon-grid__item h3{font-size:23px}

/* #checks: six ruled cells with purpose-drawn icons */
#checks .icon-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
#checks .icon-grid__item{padding:36px 34px 38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--white)}

/* #facts, #coverage: credentials on charcoal */
:is(#facts,#coverage) .section-title{max-width:22ch}
:is(#facts,#coverage) .icon-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 40px}
:is(#facts,#coverage) .icon-grid__item{position:relative;padding-top:34px;border-top:1px solid var(--line-dark)}
:is(#facts,#coverage) .icon-grid__item::before{content:"";position:absolute;left:0;top:-8px;width:28px;height:15px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
:is(#facts,#coverage) .icon-grid__item h3{font-size:23px;margin-bottom:10px;color:#fff}
:is(#facts,#coverage) .icon-grid__item p{line-height:1.6;color:rgba(255,255,255,.8)}

/* #counties */
#counties .icon-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px}
#counties .icon-grid__item{position:relative;padding:28px 0 30px 34px;border-top:1px solid #C9C8C5}
#counties .icon-grid__item::before{content:"";position:absolute;left:0;top:36px;width:20px;height:11px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
#counties .icon-grid__item h3{font-size:22px;margin-bottom:6px}

/* #letters, #letters-featured: testimonials set as letters, not cards. The theme prints the name first; shown under the letter. */
:is(#letters,#letters-featured) .container{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);grid-template-areas:"head list" "link list";grid-template-rows:auto 1fr;column-gap:88px;align-items:start}
:is(#letters,#letters-featured) .container > .center-text:first-child{grid-area:head;margin:0}
:is(#letters,#letters-featured) .container > .center-text:last-child{grid-area:link;margin:22px 0 0}
:is(#letters,#letters-featured) .section-title{max-width:11ch}
:is(#letters,#letters-featured) .icon-grid{grid-area:list;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 56px}
:is(#letters,#letters-featured) .icon-grid__item{display:flex;flex-direction:column;border-top:1px solid #C9C8C5;padding-top:28px}
:is(#letters,#letters-featured) .icon-grid__item p{order:1;margin:0 0 18px;font:400 17px/1.68 var(--font-body);color:var(--body);white-space:pre-line}
:is(#letters,#letters-featured) .icon-grid__item h3{order:2;position:relative;font:700 15px/1.3 var(--font-heading);margin:auto 0 0;padding-left:26px;letter-spacing:0}
:is(#letters,#letters-featured) .icon-grid__item h3::before{content:"";position:absolute;left:0;top:.3em;width:16px;height:9px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
#letters-featured .icon-grid__item{border-top-color:var(--line)}
#letters-featured .icon-grid__item:first-child{grid-column:1/-1;border-top:3px solid var(--color-brand);padding-top:32px}
#letters-featured .icon-grid__item:first-child p{font:600 clamp(24px,2.5vw,34px)/1.28 var(--font-heading);letter-spacing:-.018em;color:var(--color-text)}

/* ---------------------------------------------------------------- service cards. Default is a photo tile (no card box); #panels and #communities are image panels. */
.service-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px;margin:0}
.service-card{position:relative;display:grid;grid-template-rows:auto 1fr;background:none;border-radius:0;box-shadow:none;padding:0;color:inherit;transition:none}
.service-card:hover{transform:none}
.service-card img{grid-area:1/1;width:100%;aspect-ratio:4/3;object-fit:cover;margin:0;border-radius:0;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.service-card h3{grid-area:1/1;align-self:end;z-index:1;margin:0;padding:72px 18px 14px;color:#fff;font-size:23px;background:linear-gradient(180deg,rgba(20,19,18,0) 0%,rgba(20,19,18,.84) 100%);pointer-events:none}
.service-card__content{grid-area:2/1;display:flex;flex-direction:column;padding:16px 2px 0;font-size:15.5px;line-height:1.5;color:var(--body)}
.service-card__content p{margin:0 0 10px}
.card-links{margin:auto 0 0 !important;padding-top:4px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.card-links .text-link{font-size:15px}
.card-links .text-link::after{content:"";position:absolute;inset:0}
.card-links__alt{position:relative;z-index:1;font:500 14px/1.4 var(--font-heading)}
.card-links__alt a{color:var(--soft)}
/* #models: four across, title and line side by side */
#models .container > .center-text:first-child{margin-bottom:48px}
#models .section-subtitle{margin-top:12px;max-width:none}
@media (min-width:1101px){#models .section-subtitle{white-space:nowrap}}
#models .service-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
/* #panels, #communities: the photo fills the panel, copy at the bottom */
:is(#panels,#communities) .container > .center-text:first-child{text-align:center;margin-bottom:56px}
:is(#panels,#communities) .section-title{margin:0 auto;max-width:22ch}
:is(#panels,#communities) .service-cards{gap:20px}
#communities .service-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
:is(#panels,#communities) .service-card{display:flex;flex-direction:column;justify-content:flex-end;min-height:540px;padding:34px 32px 32px;overflow:hidden;color:#fff;isolation:isolate;background:var(--ink-2);clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
#communities .service-card{min-height:460px;background:var(--color-dark)}
:is(#panels,#communities) .service-card img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;z-index:-2;clip-path:none;transition:transform .7s ease}
:is(#panels,#communities) .service-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,19,18,.04) 28%,rgba(20,19,18,.9) 100%)}
:is(#panels,#communities) .service-card:hover img{transform:scale(1.045)}
:is(#panels,#communities) .service-card h3{align-self:auto;padding:0;background:none;font-size:clamp(24px,2.2vw,30px);margin-bottom:10px}
:is(#panels,#communities) .service-card__content{display:block;padding:0;font-size:16.5px;color:rgba(255,255,255,.9)}
:is(#panels,#communities) .service-card__content p{margin:0 0 18px;max-width:36ch}
:is(#panels,#communities) .card-links{margin:0 !important;padding:0}
:is(#panels,#communities) .text-link{font-size:16px;color:#fff}
:is(#panels,#communities) .text-link:hover{color:var(--color-brand)}

/* ---------------------------------------------------------------- gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0}
.gallery-item{position:relative;display:block;overflow:hidden;background:var(--color-light);cursor:zoom-in;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.gallery-grid img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:0;transition:transform .7s ease}
.gallery-item:hover img{transform:scale(1.04)}
.section-gallery .container > .center-text:first-child{margin-bottom:40px}
.section-gallery .container > .center-text:last-child{margin-top:32px}
/* #rooms: a mosaic of five, the link beside the title */
#rooms .container{display:grid;grid-template-columns:1fr auto;grid-template-areas:"head link" "grid grid";column-gap:48px;row-gap:40px;align-items:end}
#rooms .container > .center-text:first-child{grid-area:head;margin:0}
#rooms .container > .center-text:last-child{grid-area:link;margin:0}
#rooms .gallery-grid{grid-area:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:250px;gap:16px}
#rooms .gallery-item{clip-path:none}
#rooms .gallery-grid img{height:100%;aspect-ratio:auto}
#rooms .gallery-item:first-child{grid-column:span 2;grid-row:span 2}
/* #gallery-page: the bespoke filterable gallery (room and home filters, captions, lightbox) */
.gallery-filters{display:flex;flex-wrap:wrap;gap:16px 44px;margin-bottom:36px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.filter-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.filter-group > span{font:600 14px/1 var(--font-heading);color:var(--soft);margin-right:6px}
.filter-btn{min-height:44px;padding:9px 14px;font:600 14px/1 var(--font-heading);color:var(--color-text);background:var(--white);border:1px solid #8E8D8A;border-radius:var(--radius);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.filter-btn:hover{border-color:var(--color-text)}
.filter-btn.is-active{background:var(--color-dark);border-color:var(--color-dark);color:#fff}
.gallery-item__caption{position:absolute;left:0;bottom:0;right:0;padding:32px 16px 13px;background:linear-gradient(180deg,rgba(20,19,18,0),rgba(20,19,18,.86));color:#fff;font:600 14px/1.3 var(--font-heading)}
.gallery-item.is-hidden{display:none}
.gallery-empty{display:none;padding:32px 0;color:var(--soft);font:500 16px/1.4 var(--font-heading)}
.gallery-empty.is-visible{display:block}
.lightbox{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(20,19,18,.95);padding:24px}
.lightbox.is-open{display:flex}
.lightbox img{max-width:min(1400px,100%);max-height:82vh;width:auto;height:auto;object-fit:contain}
.lightbox figcaption{position:absolute;left:0;right:0;bottom:24px;text-align:center;color:#fff;font:600 15px/1.3 var(--font-heading)}
.lightbox__close,.lightbox__prev,.lightbox__next{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border:0;background:var(--color-brand);color:var(--color-text);font:700 22px/1 var(--font-heading);cursor:pointer;border-radius:var(--radius)}
.lightbox__close{top:24px;right:24px;transform:none}
.lightbox__prev{left:24px}
.lightbox__next{right:24px}

/* ---------------------------------------------------------------- faq */
.section-faq .container{max-width:var(--container);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:88px;align-items:start}
.section-faq .container > .center-text:first-child{margin:0}
.section-faq .section-title{max-width:14ch}
.faq-list{margin:0;border-top:1px solid #C9C8C5}
.faq-item{border-bottom:1px solid #C9C8C5;padding:0}
.faq-item summary{list-style:none;cursor:pointer;padding:24px 52px 24px 0;position:relative;font:600 19px/1.35 var(--font-heading);color:var(--color-text)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";position:absolute;right:4px;top:50%;width:22px;height:12px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);transform:translateY(-50%);transition:background-color .2s ease}
.faq-item[open] summary::after{content:"";background:var(--color-dark)}
.faq-item summary:hover{color:var(--color-brand-2)}
.faq-item__answer{padding:0 0 26px;max-width:var(--measure);color:var(--body)}
.faq-item__answer p{margin:0 0 .8em}
.faq-item__answer p:last-child{margin:0}

/* ---------------------------------------------------------------- service area. The map image has the gray band baked in, so every map section sits on it. */
.map-section{background:var(--color-light)}
.map-section__inner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:center}
.map-section__media{order:2}
.map-section__media img{width:100%;height:auto;border-radius:0}
.map-section__body .section-title{margin-bottom:.5em}
.map-section__body .entry-content{color:var(--body)}
.county-list{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px;font:600 17px/1.3 var(--font-heading);color:var(--color-text)}
.county-list li{position:relative;padding-left:28px}
.county-list li::before{content:"";position:absolute;left:0;top:.36em;width:17px;height:9px;background:var(--color-brand);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.map-section .more{margin-top:28px}

/* ---------------------------------------------------------------- conversion block: phone and form together */
.contact-section{background:var(--color-dark);color:var(--color-text-inv)}
.contact-section .container{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:". form" "head form" "phone form" "note form" ". form";grid-template-rows:1fr auto auto auto 1fr;column-gap:88px}
.contact-section .container > .center-text:first-child{grid-area:head;margin:0}
.contact-section .section-title{font-size:clamp(34px,4vw,54px);max-width:12ch}
.contact-section .section-subtitle{color:rgba(255,255,255,.86);max-width:42ch}
.contact-section .embed-phone{grid-area:phone;margin:22px 0 0;text-align:left;font:500 16px/1.5 var(--font-body);color:rgba(255,255,255,.78)}
.contact-section .embed-phone a{display:block;width:fit-content;margin:2px 0 12px;font:800 clamp(30px,3.4vw,46px)/1.1 var(--font-heading);color:#fff;letter-spacing:-.02em;border-bottom:3px solid var(--color-brand);padding-bottom:6px}
.contact-section .embed-phone a:hover{color:var(--color-brand)}
.contact-section .entry-content{grid-area:note;margin:18px 0 0;font-size:16px;line-height:1.6;color:rgba(255,255,255,.78);max-width:40ch}
.contact-section .embed-wrap{grid-area:form;margin:0;background:var(--white);color:var(--color-text);padding:30px 30px 26px;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.contact-section .form-card__title{font-size:23px;margin-bottom:14px}
/* Contact page: the same block on white */
#contact-main{background:var(--white);color:var(--color-text);padding-bottom:var(--section-pad)}
#contact-main .section-subtitle{color:var(--body)}
#contact-main .embed-phone{color:var(--soft)}
#contact-main .embed-phone a{color:var(--color-text)}
#contact-main .embed-phone a:hover{color:var(--color-brand-2)}
#contact-main .entry-content{color:var(--soft)}
#contact-main .embed-wrap{background:var(--color-light)}

/* ---------------------------------------------------------------- footer */
.site-footer{background:var(--ink-3);color:#fff}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--color-brand)}
.site-footer__inner{display:grid;grid-template-columns:1.5fr 1.6fr .7fr;gap:56px;padding:80px 32px 64px;align-items:start}
.site-footer img{width:176px;max-height:none}
.site-footer__brand .site-phone{display:block;width:fit-content;margin-top:26px;font:800 22px/1.2 var(--font-heading);letter-spacing:-.01em;white-space:nowrap}
.site-address{margin:10px 0 0;font:400 16px/1.65 var(--font-body);color:rgba(255,255,255,.82)}
.site-footer__nav ul{list-style:none;margin:0;padding:0;columns:2;column-gap:40px}
.site-footer__nav li{margin:0 0 10px;break-inside:avoid}
.site-footer__nav a,.site-footer__social a{font:500 15.5px/1.4 var(--font-heading)}
.site-footer__legal{border-top:1px solid var(--line-dark);padding:0;font-size:14px}
.site-footer__legal p{margin:0;padding:18px 0;font:500 14px/1.6 var(--font-heading);color:rgba(255,255,255,.72)}
.site-footer__legal a{color:rgba(255,255,255,.88)}

/* mobile call bar (Site Settings toggle): phone and the one button within thumb reach */
.bs-bar__call,.bs-bar__cta{font:700 15.5px/1.1 var(--font-heading)}
.bs-bar__cta{color:var(--color-text)}

/* ---------------------------------------------------------------- responsive */
@media (min-width:1101px){
  /* photo on the right, by id (the import leaves image side at left) */
  :is(#land,#next-generation,#in-person) .image-text__inner{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
  :is(#land,#next-generation,#in-person) .image-text__media{order:2}
  :is(#land,#next-generation,#in-person) .plate{left:calc(32px + (100cqw - var(--it-gap)) * 6 / 11 + var(--it-gap))}
}
@media (max-width:1280px) and (min-width:1101px){
  .site-header__inner{gap:20px}
  .site-logo img{width:136px}
  .site-nav__menu > li > a{padding:14px 9px;font-size:15px}
  .site-nav__menu > li > a::after{left:9px;right:9px}
  .site-header__cta{gap:14px}
  .site-header__cta .site-btn{padding:14px 20px;font-size:15px}
  .site-header__cta .site-phone{font-size:0;gap:0}
}
@media (max-width:1180px){
  :root{--it-gap:64px}
  #models .service-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .trust-list li{padding:24px 22px}
}
@media (max-width:1100px){
  :root{--section-pad:72px;--cut:16px;--it-gap:44px}
  .container{padding:0 24px}
  /* header: hamburger, a full-screen charcoal menu, phone as an icon */
  .site-header__inner{min-height:84px;gap:8px}
  .site-logo img{width:112px}
  .site-nav{display:none;position:fixed;inset:0;z-index:80;margin:0;background:var(--color-dark);padding:104px 24px 120px;overflow:auto;box-shadow:none}
  .site-nav.is-open{display:block}
  .site-nav__menu{flex-direction:column;gap:0}
  .site-nav__menu > li > a{display:block;padding:15px 0;font-size:22px;color:#fff;border-bottom:1px solid var(--line-dark)}
  .site-nav__menu a:hover{color:#fff}
  .site-nav__menu > li > a::after{display:none}
  .site-nav__menu > li:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor) > a{border-bottom-color:var(--color-brand)}
  .site-nav .sub-menu{position:static;display:block;background:transparent;box-shadow:none;border:0;padding:4px 0 8px;min-width:0}
  .site-nav .sub-menu a{color:rgba(255,255,255,.86);padding:11px 0 11px 22px;font-size:17px}
  .site-nav .sub-menu a:hover{background:transparent;color:var(--color-brand)}
  .site-header__cta{flex-direction:row;align-items:center;gap:8px;margin-left:auto}
  .site-header__cta .site-phone::before{display:none}
  .site-header__cta .site-btn{min-height:46px;padding:12px 18px;font-size:15px}
  .site-header__cta .site-phone{width:48px;height:48px;font-size:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C1B1A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.9 2z'/%3E%3C/svg%3E") center/25px no-repeat}
  .nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:48px;height:48px;margin-left:0;padding:10px;border:0;background:transparent;cursor:pointer;z-index:90;position:relative}
  .nav-toggle span{display:block;width:100%;height:3px;margin:0;background:var(--color-text);border-radius:2px;transition:transform .25s ease,opacity .2s ease}
  .nav-toggle[aria-expanded="true"] span{background:#fff}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  body:has(.site-nav.is-open){overflow:hidden}
  /* heroes */
  .section-hero-full .hero-section__bg::after{background:linear-gradient(180deg,rgba(20,19,18,.5) 0%,rgba(20,19,18,.72) 100%)}
  .hero-section__content{padding-left:24px;padding-right:24px}
  #home-hero .hero-section__content{min-height:0;padding-top:88px;padding-bottom:0}
  #home-hero .hero-section__buttons{order:1}
  #home-hero .hero-section__content-text{order:2;display:flex;flex-direction:column;align-items:flex-start}
  #home-hero .plate{position:static;order:1;margin:36px 0 64px}
  .trust-list{position:static;order:2;transform:none;width:calc(100% + 48px);margin:0 -24px;grid-template-columns:repeat(2,minmax(0,1fr));box-shadow:none;border-bottom:1px solid var(--line)}
  .trust-list li{padding:22px 24px;border-left:0;border-top:1px solid var(--line)}
  .trust-list li:nth-child(odd){border-right:1px solid var(--line)}
  #home-hero + .page-section{padding-top:72px}
  .hero-section--with-form .hero-section__content{grid-template-columns:1fr;gap:36px;padding-top:56px;padding-bottom:64px;text-align:left}
  .hero-section--with-form .hero-section__buttons{justify-content:flex-start}
  .hero-section--with-form .plate{position:static;margin:28px 0 0}
  .hero-section--small{min-height:280px}
  .hero-section--small .hero-section__content{padding:72px 24px 40px}
  .hero-section--small:not(:has(.hero-section__bg)) .hero-section__content{padding-top:56px;padding-bottom:40px}
  #page-title .hero-section__content{padding:48px 24px 0}
  #page-title + .page-section{padding-top:32px}
  /* stacked sections */
  .image-text__inner,.map-section__inner,.section-faq .container,#timeline .container{grid-template-columns:1fr;gap:44px}
  .image-text__media{max-width:640px;align-self:auto;display:block}
  .image-text .plate{left:24px;bottom:auto;top:calc(min(100cqw,640px) * .75 - 24px);transform:translateY(-100%);max-width:calc(min(100cqw,640px) - 24px)}
  #owners .image-text__media{max-width:460px}
  :is(#flyover,#tour) .image-text__inner{gap:28px}
  :is(#flyover,#tour) .image-text__media{max-width:none}
  :is(#flyover,#tour) .plate{left:24px;bottom:16px;max-width:calc(100% - 72px)}
  .map-section__media img{max-width:720px}
  #timeline .container > .center-text:first-child{position:static}
  :is(#letters,#letters-featured) .container{display:block}
  :is(#letters,#letters-featured) .container > .center-text:first-child{margin-bottom:36px}
  :is(#letters,#letters-featured) .container > .center-text:last-child{margin-top:32px}
  :is(#letters,#letters-featured) .icon-grid{gap:36px}
  #steps .icon-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 28px}
  #steps .icon-grid::before{display:none}
  #checks .icon-grid,#counties .icon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #counties .icon-grid{gap:0 32px}
  :is(#facts,#coverage) .icon-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 32px}
  .service-cards,#models .service-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 18px}
  :is(#panels,#communities) .service-cards{grid-template-columns:1fr;gap:16px}
  :is(#panels,#communities) .service-card{min-height:400px}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  #rooms .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px}
  .with-image-bg{padding:96px 0}
  .contact-section .container{display:block}
  .contact-section .embed-wrap{margin-top:40px}
  .site-footer__inner{grid-template-columns:1fr 1fr;gap:40px;padding:64px 24px 48px}
}
@media (max-width:900px){
  /* the theme hides the header button here; the call bar carries it */
  .site-header__cta{gap:0}
  :is(#steps,#rooms) .container{display:block}
  :is(#steps,#rooms) .container > .center-text:first-child{margin-bottom:40px}
  :is(#steps,#rooms) .container > .center-text:last-child{margin-top:32px}
}
@media (max-width:640px){
  body{font-size:17px}
  .site-header__inner{min-height:76px}
  .site-logo img{width:104px}
  .section-hero-full h1{font-size:clamp(38px,10.5vw,46px)}
  .trust-list{grid-template-columns:1fr}
  .trust-list li:nth-child(odd){border-right:0}
  .hero-section__embed,.contact-section .embed-wrap{padding:24px 20px 22px}
  .form-grid,.form-grid--two{grid-template-columns:1fr}
  .form-grid .span-2{grid-column:auto}
  .service-cards,#models .service-cards{grid-template-columns:1fr}
  #steps .icon-grid,#checks .icon-grid,#counties .icon-grid,:is(#facts,#coverage) .icon-grid,:is(#letters,#letters-featured) .icon-grid{grid-template-columns:1fr}
  #timeline .icon-grid__item:not(:last-child)::after{left:28px;top:30px}
  #timeline .icon-grid__item{padding-left:86px}
  :is(#steps,#timeline) .icon-grid__item::before{width:57px;height:30px;font-size:14px}
  #rooms .gallery-grid{grid-auto-rows:150px;gap:10px}
  .gallery-grid{gap:10px}
  .gallery-item__caption{padding:24px 10px 9px}
  .county-list{grid-template-columns:1fr}
  .plate{padding:9px 13px 9px 11px;gap:2px 8px}
  .plate__where::before{margin:0 8px -2px 0}
  .site-footer__inner{grid-template-columns:1fr;gap:34px;padding:52px 24px 40px}
  .lightbox__prev,.lightbox__next{top:auto;bottom:70px;transform:none}
  .pull{font-size:19px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
  html{scroll-behavior:auto}
}
