/* ==========================================================================
   Grapple · Astra + core-block neutralisation
   Generated. Do not edit this block in the client stylesheet; edit the
   template at grapple/css/astra-reset.css.tmpl and rebuild.

   Everything below is UNDOING A DEFAULT, not styling anything. Each rule is
   here because it broke a real build. Scope: .rh-grapple
   ========================================================================== */

.rh-grapple{overflow-x:clip}

/* Astra prints its body-font-size customizer setting as a ROOT size, inline and
   responsive: html{font-size:106.25%} on desktop, 96.9% under 921px. Every rem
   in a design built against 16px is then 6% too big on desktop and 3% too small
   on tablets and phones, uniformly, which is exactly the kind of drift nobody
   sees and every measurement against the mockup does. Pin the root to 16px. */
html:has(> body.rh-grapple){font-size:100%}

/* Astra boxes .entry-content and caps its width. Full-bleed needs both gone. */
.rh-grapple .site-content .ast-container,
.rh-grapple .entry-content{max-width:none;padding-left:0;padding-right:0;margin:0}
.rh-grapple .site-main{padding:0}
.rh-grapple .entry-content > .alignfull{
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  max-width:100vw;width:100vw;
}
.rh-grapple .ast-page-builder-template .entry-header{display:none}

/* Core's flow layout puts a block-gap between sibling blocks. Between two
   full-bleed bands that reads as a seam of page background, so sections butt
   directly against each other and own their own vertical rhythm. */
.rh-grapple .entry-content > *{margin-block-start:0;margin-block-end:0}

/* Astra sets an explicit heading colour, so inherited white renders BLACK.
   Colour is handed back to the cascade; the client sheet paints it. */
.rh-grapple h1,.rh-grapple h2,.rh-grapple h3,.rh-grapple h4{margin:0;color:inherit}

/* Astra's dynamic CSS prints, inline and AFTER this file:
     @media (max-width:767px){ h1,h2 { font-size:clamp(1.5rem,4.5vw,3.5rem)!important } }
   A bare !important on h1/h2 silently shrinks EVERY heading on mobile, whatever
   type scale the design set, and it is invisible on desktop. Only another
   !important can beat it. So the scale is declared once as custom properties by
   the client sheet and applied here, important, at scope specificity — one
   !important in the whole build instead of one per heading rule.
   Scoped to .entry-content, NOT the whole body: the scope class lives on
   <body>, so an unscoped !important here also repaints the site header and
   footer, which have their own much smaller type. */
.rh-grapple .entry-content h1{font-size:var(--h1)!important}
.rh-grapple .entry-content h2{font-size:var(--h2)!important}
.rh-grapple .entry-content h3{font-size:var(--h3)!important}

/* THE SPECIFICITY OF A RESET. Each rule below wraps ONLY THE SCOPE in :where(),
   so it carries exactly the specificity of the default it is clearing and wins
   on source order (this file loads after core and Astra). That is the band that
   works: above core's `.wp-block-cover` (0,1,0), below every design rule
   `.rh-grapple .rh-x` (0,2,0).
     - Plain `.rh-grapple .x` (0,2,0) was too strong: `ul.wp-block-list` outranked
       the design's `.rh-rail__list` and zeroed its padding.
     - Wrapping the WHOLE selector, `:where(.rh-grapple .x)` (0,0,0), was too weak:
       core's cover padding and 430px floor, core's figure margin and Astra's
       `ul{list-style:disc}` all came back, and a mockup review caught every one.
   Where Astra's default is itself (0,2,0), the reset matches it at (0,2,0). */

/* core column gaps / stacking, replaced by each section's own grid rhythm */
:where(.rh-grapple) .wp-block-columns{margin-bottom:0;gap:0}
:where(.rh-grapple) .wp-block-column{min-width:0}

/* core cover defaults: 1em padding and a 430px floor (0,1,0) */
:where(.rh-grapple) .wp-block-cover{padding:0;min-height:0}
:where(.rh-grapple) .wp-block-cover__inner-container{width:100%;max-width:none}
:where(.rh-grapple) .wp-block-cover .wp-block-cover__background{display:none}
/* Astra pads every top-level block (0,2,0): 80px on desktop, 30px on phones,
   which pushed interior hero copy 30px in from the mockup's gutter. */
:where(.rh-grapple) .entry-content > .wp-block-cover{padding-left:0;padding-right:0}

/* Astra prints an inline `z-index:1` on cover inner containers, and it lands
   after this file in the cascade. CSS gradient scrims also sit at z-index 1,
   so without this they paint OVER the copy instead of under it. Specificity
   cannot win against a later same-weight rule, hence !important. */
.rh-grapple .wp-block-cover > .wp-block-cover__inner-container{z-index:2!important}

/* Flow layout adds a block-gap between every sibling inside a cover. Wrapped in
   :where() so this drops to ZERO specificity: a reset must never outrank the
   real rules it exists to clear. Without :where() this silently zeroes a hero
   subheading's margin-top and butts the copy against the headline. */
:where(.rh-grapple .wp-block-cover .is-layout-flow) > * + *{margin-block-start:0}

/* Core centres cover content and sizes the inner container to its content, so
   `justify-content:flex-end` has nothing to push against and copy floats in the
   middle of the tile. Stretch it to full height instead. */
.rh-grapple .wp-block-cover{align-items:stretch}
.rh-grapple .wp-block-cover > .wp-block-cover__inner-container{flex:1 1 auto}

/* Astra injects, AFTER this file and at specificity 0,3,2:
     body .wp-block-cover:not(.has-text-color.has-link-color) p
       { color: var(--ast-global-color-3) }
   That repaints every paragraph inside every cover to Astra's grey, which is
   what washes text out over photography. A later rule of equal weight cannot be
   beaten on specificity, so this is important by necessity. Client rules that
   set a specific colour must qualify by element (p.foo) to stay above it. */
.rh-grapple .wp-block-cover p{color:inherit!important}

/* core/button chrome */
:where(.rh-grapple) .wp-block-buttons{gap:0}
:where(.rh-grapple) .wp-block-button .wp-block-button__link{border-radius:0;text-decoration:none}

/* core/list default indent */
:where(.rh-grapple) ul.wp-block-list{margin:0;padding:0;list-style:none}

/* core/image figure margins */
:where(.rh-grapple) figure.wp-block-image{margin:0}
:where(.rh-grapple) figure.wp-block-image img{display:block;width:100%}


/* ==========================================================================
   Rhaus + Co (Michael + Joanna Ruesch) — page design
   Ported from mockups/01-home.html to the native core-block DOM.

   The blocks carry semantic rh-* classes and nothing else; every visual
   decision lives here. That is what keeps the page editable: they can retype a
   heading or swap a photo in Gutenberg and the design holds, because the design
   was never stored in the block attributes.

   The Astra/core neutralisation above this block is generated by Grapple and is
   shared with every other build. Only the design is here.

   Scoped to .rh-grapple, which the loader puts on <body> for every Grapple-built
   page. One stylesheet, every page; the rh-* section classes decide what applies
   where, so a page that has no towns grid pays nothing for the towns rules.
   ========================================================================== */

/* ---------- tokens (global-design.json) ---------- */
.rh-grapple{
  --ink:#0A0909;
  --ink-soft:#1C1A19;
  --paper:#FFFFFF;
  --bone:#F5F2ED;
  --stone:#DED7CB;
  --line:#D8D1C6;
  /* Weichert yellow split two ways: --weichert is the true brand yellow and is
     ONLY legible on dark grounds; --brass is the deepened form for text and
     rules on light grounds (5.05:1 on bone, 5.64:1 on white). Both PROVISIONAL
     until brokerage brand guidance confirms the hex. */
  --weichert:#FFCE00;
  --brass:#806320;
  --text:#23201E;
  --text-muted:#6E6862;
  --text-onink:#EDEAE5;
  --onink-body:#B9B4AE;
  --font-head:'Raleway',Georgia,serif;
  --font-body:'Montserrat',-apple-system,Helvetica,Arial,sans-serif;
  --max:1240px;
  --max-wide:1460px;
  --gutter:clamp(20px,5vw,64px);
  --section-y:clamp(88px,11vw,168px);
  --ease:cubic-bezier(0.22,0.61,0.36,1);
  /* Applied !important by the shared reset: Astra overrides bare h1/h2 sizes
     on mobile. Declared here so the scale stays a design decision. */
  --h1:clamp(2.6rem,6.4vw,5.6rem);
  --h2:clamp(1.62rem,2.85vw,2.62rem);
  --h3:clamp(1.05rem,1.5vw,1.32rem);
}

.rh-grapple{
  background:var(--paper);
  font-family:var(--font-body);font-weight:300;font-size:16px;line-height:1.75;
  color:var(--text);-webkit-font-smoothing:antialiased;
}

/* ---------- type ---------- */
.rh-grapple h1,.rh-grapple h2,.rh-grapple h3{
  font-family:var(--font-head);font-weight:200;line-height:1.12;text-transform:uppercase;
}
.rh-grapple h1{letter-spacing:.022em}
.rh-grapple h2{letter-spacing:.032em;line-height:1.16}
.rh-grapple h3{font-weight:300;letter-spacing:.055em}
.rh-grapple p{max-width:68ch;margin:0}

.rh-grapple .rh-eyebrow{
  font-family:var(--font-body);font-size:.68rem;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--brass);margin-bottom:1.35rem;display:block;
}
.rh-grapple .rh-eyebrow--onink{color:var(--weichert)}
.rh-grapple p.rh-eyebrow--onink{color:var(--weichert)!important}
.rh-grapple p.rh-eyebrow:not(.rh-eyebrow--onink){color:var(--brass)!important}
.rh-grapple .rh-lede{font-size:clamp(1.02rem,1.35vw,1.16rem);color:var(--text-muted)}

/* ---------- bands and wraps ---------- */
/* Astra pads alignfull 80px on all four sides and caps it at 1440px. The ways
   strip and the towns grid are edge to edge by design, so both are cleared;
   the banded sections keep their own gutter instead. */
.rh-grapple .rh-band,
.rh-grapple .rh-ways,
.rh-grapple .rh-towns{padding:0;max-width:none}

.rh-grapple .rh-band{padding-block:var(--section-y)}
.rh-grapple .rh-band--bone{background:var(--bone)}
.rh-grapple .rh-band--ink{background:var(--ink);color:var(--text-onink)}
.rh-grapple .rh-band--ink h2,.rh-grapple .rh-band--ink h3{color:var(--paper)}
.rh-grapple .rh-band--ink p{color:var(--onink-body)}

/* core's constrained layout would clamp these to the theme's content width */
/* Two measures, exactly as the mockup has them. `.wrap` (1240) is the default
   for section heads, FAQs, IDX zones, notes and CTAs. `.wrap--wide` (1460) is
   used ONLY by the image-and-argument splits, the paired block, the pathway
   cards and the sitemap. Everything was on the wide measure before, which put
   every heading 100px left of where the mockup draws it. */
.rh-grapple .rh-band > .wp-block-columns,
.rh-grapple .rh-band > .wp-block-group,
.rh-grapple .rh-towns__head,
.rh-grapple .rh-ways__head{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);width:100%;
}
.rh-grapple .rh-band:has(.rh-split2, .rh-hv, .rh-paired, .rh-paths, .rh-smap) > .wp-block-columns,
.rh-grapple .rh-band:has(.rh-split2, .rh-hv, .rh-paired, .rh-paths, .rh-smap) > .wp-block-group,
.rh-grapple .rh-band--wide > .wp-block-columns,
.rh-grapple .rh-band--wide > .wp-block-group{max-width:var(--max-wide)}
.rh-grapple .rh-shead{margin-bottom:clamp(2.6rem,4vw,4rem)}
.rh-grapple .rh-shead h2{max-width:22ch}
.rh-grapple .rh-shead .rh-lede{margin-top:1.2rem}

/* ---------- buttons ---------- */
.rh-grapple .rh-btn .wp-block-button__link{
  display:inline-block;font-family:var(--font-body);font-size:.72rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;padding:1.05rem 2.4rem;
  border:1px solid var(--ink);color:var(--ink);background:transparent;
  transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);
}
.rh-grapple .rh-btn .wp-block-button__link:hover{background:var(--ink);color:var(--paper)}
.rh-grapple .rh-btn--onink .wp-block-button__link{border-color:rgba(255,255,255,.42);color:var(--paper);background:transparent}
.rh-grapple .rh-btn--onink .wp-block-button__link:hover{background:var(--weichert);border-color:var(--weichert);color:var(--ink)}
.rh-grapple .rh-btn--onphoto .wp-block-button__link{
  border-color:rgba(255,255,255,.72);color:#fff;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:rgba(10,9,9,.16);
}
.rh-grapple .rh-btn--onphoto .wp-block-button__link:hover{background:#fff;color:var(--ink);border-color:#fff}

/* text link with a drawn rule */
.rh-grapple .rh-tlink .wp-block-button__link{
  position:relative;background:transparent;border:0;padding:0 0 .38rem;color:inherit;
  font-size:.72rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  display:inline-block;transition:color .4s var(--ease);
}
.rh-grapple .rh-tlink .wp-block-button__link::after{
  content:'';position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--brass);
}
.rh-grapple .rh-tlink .wp-block-button__link:hover{color:var(--brass);background:transparent}
.rh-grapple .rh-band--ink .rh-tlink .wp-block-button__link::after,
.rh-grapple .rh-tlink--oncard .wp-block-button__link::after{background:var(--weichert)}
.rh-grapple .rh-band--ink .rh-tlink .wp-block-button__link{color:var(--paper)}
.rh-grapple .rh-band--ink .rh-tlink .wp-block-button__link:hover{color:var(--weichert)}

/* ==========================================================================
   1 · HERO
   ========================================================================== */
.rh-grapple .rh-hero{min-height:100svh;display:flex;align-items:flex-end;position:relative}
.rh-grapple .rh-hero::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(10,9,9,.62) 0%,rgba(10,9,9,.30) 42%,transparent 72%),
    linear-gradient(0deg,rgba(10,9,9,.52) 0%,transparent 46%);
}
.rh-grapple .rh-hero > .wp-block-cover__inner-container{
  display:flex;align-items:flex-end;
}
.rh-grapple .rh-hero__copy{
  width:100%;max-width:var(--max);margin-inline:auto;
  padding-inline:var(--gutter);padding-bottom:clamp(64px,10vh,132px);
}
.rh-grapple .rh-hero__h1{color:#fff;max-width:15ch}
.rh-grapple .rh-hero p.rh-hero__sub{
  color:rgba(255,255,255,.92)!important;font-size:clamp(1rem,1.5vw,1.2rem);font-weight:300;
  max-width:46ch;margin-top:1.9rem;line-height:1.7;
}
.rh-grapple .rh-hero__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.6rem}

/* ==========================================================================
   2 · PAIRED PRACTICE
   ========================================================================== */
.rh-grapple .rh-paired{
  display:grid;grid-template-columns:.8fr 1.2fr;
  gap:clamp(2.4rem,4.4vw,4.8rem);align-items:center;
}
.rh-grapple .rh-paired__img img{width:100%;aspect-ratio:4/5;object-fit:cover}
.rh-grapple .rh-paired__body h2{margin-bottom:1.6rem;max-width:18ch}
.rh-grapple .rh-paired__body .rh-lede{max-width:62ch}
.rh-grapple .rh-pair{
  display:grid;grid-template-columns:1fr 1fr;gap:2.2rem;
  margin-top:2.8rem;padding-top:2.4rem;border-top:1px solid var(--line);
}
.rh-grapple .rh-pair__name{
  font-family:var(--font-body);font-size:.68rem;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--brass);display:block;margin-bottom:.7rem;
}
.rh-grapple .rh-pair__h{margin-bottom:.55rem}
.rh-grapple .rh-pair__cell p{font-size:.95rem;color:var(--text-muted)}
.rh-grapple .rh-paired__go{margin-top:2.4rem}

/* ==========================================================================
   3 · THREE WAYS IN · full-bleed alternating rows
   ========================================================================== */
.rh-grapple .rh-ways{background:var(--ink);color:var(--text-onink)}
.rh-grapple .rh-ways__head{
  padding-block:clamp(72px,9vw,132px);margin-bottom:0;
}
.rh-grapple .rh-ways__head h2{color:#fff;max-width:24ch}
.rh-grapple .rh-ways__head p{color:var(--onink-body);margin-top:1.2rem}

.rh-grapple .rh-way{max-width:none;padding:0;margin:0;width:100%}
.rh-grapple .rh-way__grid{
  display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:74vh;gap:0;
}
.rh-grapple .rh-way__media{position:relative;overflow:hidden;flex-basis:auto!important}
.rh-grapple .rh-way__img{position:absolute;inset:0}
.rh-grapple .rh-way__img img{width:100%;height:100%;object-fit:cover}
.rh-grapple .rh-way__body{
  display:flex;flex-direction:column;justify-content:center;flex-basis:auto!important;
  padding:clamp(2.6rem,6vw,6.2rem);background:var(--bone);color:var(--text);
}
.rh-grapple .rh-way--flip .rh-way__body{background:var(--ink);color:var(--text-onink)}
.rh-grapple .rh-way--flip .rh-way__body h2{color:#fff}
.rh-grapple .rh-way--flip .rh-way__body p{color:var(--onink-body)}
.rh-grapple .rh-way__index{
  font-family:var(--font-head);font-size:.8rem;font-weight:300;letter-spacing:.3em;
  color:var(--brass);margin-bottom:1.5rem;display:block;
}
.rh-grapple .rh-way--flip .rh-way__index{color:var(--weichert)}
.rh-grapple .rh-way__h{margin-bottom:1.25rem}
.rh-grapple .rh-way__body p{margin-bottom:2.1rem}
.rh-grapple .rh-way__go{align-self:flex-start}
.rh-grapple .rh-way--flip .rh-tlink .wp-block-button__link{color:var(--paper)}
.rh-grapple .rh-way--flip .rh-tlink .wp-block-button__link::after{background:var(--weichert)}

/* ==========================================================================
   4 · IDX ZONE · a labelled shortcode zone, never a hand-built listing UI
   ========================================================================== */
.rh-grapple .rh-idx{
  border:1px dashed rgba(255,255,255,.28);
  padding:clamp(2.6rem,6vw,4.6rem);margin-top:2.8rem;min-height:120px;
}

/* ==========================================================================
   5 · PATHWAYS
   ========================================================================== */
.rh-grapple .rh-paths{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2rem,3vw,3.2rem);
}
.rh-grapple .rh-paths__col{flex-basis:auto!important}
.rh-grapple .rh-path{
  position:relative;aspect-ratio:1/1;display:flex;align-items:flex-end;background:var(--ink);
}
.rh-grapple .rh-path img.wp-block-cover__image-background{opacity:.82;transition:transform 1.5s var(--ease),opacity .6s var(--ease)}
.rh-grapple .rh-path::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(10,9,9,.94) 0%,rgba(10,9,9,.80) 28%,rgba(10,9,9,.40) 62%,rgba(10,9,9,.16) 100%);
}
.rh-grapple .rh-path:hover img.wp-block-cover__image-background{transform:scale(1.05);opacity:1}
.rh-grapple .rh-path > .wp-block-cover__inner-container{
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(1.7rem,2.4vw,2.5rem);color:#fff;
}
.rh-grapple p.rh-path__index{
  font-family:var(--font-head);font-size:.74rem;font-weight:300;letter-spacing:.3em;
  color:var(--weichert)!important;display:block;margin-bottom:1rem;
}
.rh-grapple .rh-path__h{color:#fff;margin-bottom:.8rem}
.rh-grapple p.rh-path__p{
  color:rgba(255,255,255,.82)!important;font-size:.92rem;line-height:1.65;
  margin-bottom:1.5rem;max-width:32ch;
}
.rh-grapple .rh-path .rh-tlink .wp-block-button__link{color:#fff}
.rh-grapple .rh-path .rh-tlink .wp-block-button__link::after{background:var(--weichert)}
.rh-grapple .rh-path:hover .rh-tlink .wp-block-button__link{color:var(--weichert)}

/* ==========================================================================
   6 · HOME VALUE
   ========================================================================== */
.rh-grapple .rh-hv{
  display:grid;grid-template-columns:1.06fr 1fr;
  gap:clamp(2.4rem,4.4vw,4.4rem);align-items:center;
}
.rh-grapple .rh-hv__img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.rh-grapple .rh-hv__body h2{max-width:20ch}
.rh-grapple .rh-hv__body .rh-lede{max-width:52ch}
.rh-grapple .rh-hv__list{margin:2rem 0 2.4rem}
.rh-grapple .rh-hv__list li{
  position:relative;padding-left:1.9rem;margin-bottom:.85rem;
  color:var(--text-muted);font-size:.96rem;
}
.rh-grapple .rh-hv__list li::before{
  content:'';position:absolute;left:0;top:.72em;width:11px;height:1px;background:var(--brass);
}
.rh-grapple .rh-hv__list li a{color:var(--ink);text-decoration:none}
.rh-grapple .rh-hv__list li a:hover{text-decoration:underline;text-underline-offset:4px}
/* iPhone Safari zooms into any field under 16px when it is tapped. */
@media (max-width:767px){.rh-grapple .gform_wrapper input:not([type=checkbox]):not([type=radio]):not([type=submit]),.rh-grapple .gform_wrapper select,.rh-grapple .gform_wrapper textarea{font-size:16px}}

/* ==========================================================================
   7 · THE TOWNS · full-bleed 3x2 photo tiles
   ========================================================================== */
.rh-grapple .rh-towns{background:var(--paper)}
.rh-grapple .rh-towns__head{padding-block:var(--section-y) clamp(2.2rem,4vw,3.4rem)}
.rh-grapple .rh-towns__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;max-width:none;padding:0;
}
.rh-grapple .rh-towns__col{flex-basis:auto!important}
.rh-grapple .rh-town{
  position:relative;min-height:42vh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--ink);
}
.rh-grapple .rh-town img.wp-block-cover__image-background{
  opacity:.88;transition:transform 1.5s var(--ease),opacity .6s var(--ease);
}
.rh-grapple .rh-town::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(10,9,9,.88) 0%,rgba(10,9,9,.42) 46%,rgba(10,9,9,.08) 100%);
  transition:background .5s var(--ease);
}
.rh-grapple .rh-town:hover img.wp-block-cover__image-background{transform:scale(1.055);opacity:1}
.rh-grapple .rh-town:hover::after{
  background:linear-gradient(0deg,rgba(10,9,9,.80) 0%,rgba(10,9,9,.30) 52%,rgba(10,9,9,.04) 100%);
}
.rh-grapple .rh-town > .wp-block-cover__inner-container{
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(1.5rem,2.2vw,2.3rem);color:#fff;transition:transform .5s var(--ease);
}
.rh-grapple .rh-town:hover > .wp-block-cover__inner-container{transform:translateY(-5px)}
.rh-grapple .rh-town__name{color:#fff;margin-bottom:.3rem}
.rh-grapple .rh-town__name a{color:#fff;text-decoration:none}
.rh-grapple .rh-town__name a:hover{color:var(--weichert)}
.rh-grapple p.rh-town__county{
  font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--weichert)!important;
}

/* ==========================================================================
   8 · CLOSING CTA
   ========================================================================== */
.rh-grapple .rh-cta{
  position:relative;text-align:center;overflow:hidden;
  padding-block:clamp(110px,15vw,210px);
}
.rh-grapple .rh-cta img.wp-block-cover__image-background{filter:saturate(.62) sepia(.14)}
.rh-grapple .rh-cta::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,9,9,.70),rgba(28,22,12,.66));
}
.rh-grapple .rh-cta__inner{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
  display:flex;flex-direction:column;align-items:center;
}
.rh-grapple .rh-cta__h{color:#fff;max-width:20ch;margin:0 auto 1.5rem}
.rh-grapple .rh-cta p.rh-lede{color:rgba(255,255,255,.85)!important;margin:0 auto 2.6rem}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .rh-grapple .rh-paths{grid-template-columns:repeat(2,1fr)}
  .rh-grapple .rh-towns__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1024px){
  .rh-grapple .rh-paired,
  .rh-grapple .rh-hv{grid-template-columns:1fr}
  .rh-grapple .rh-paired__figure{max-width:460px}
}
@media (max-width:860px){
  .rh-grapple .rh-way__grid{grid-template-columns:1fr;min-height:0}
  .rh-grapple .rh-way__media{min-height:52vh}
  /* On one column the photograph leads every row, flipped or not. */
  .rh-grapple .rh-way--flip .rh-way__media{order:0}
  .rh-grapple .rh-way--flip .rh-way__body{order:1}
  .rh-grapple .rh-paths{grid-template-columns:1fr}
  .rh-grapple .rh-path{aspect-ratio:4/3}
  .rh-grapple .rh-towns__grid{grid-template-columns:1fr}
  .rh-grapple .rh-town{min-height:38vh}
  .rh-grapple .rh-pair{grid-template-columns:1fr;gap:1.6rem}
}
@media (max-width:560px){
  .rh-grapple .rh-hero__h1{max-width:100%}
}
@media (prefers-reduced-motion:reduce){
  .rh-grapple *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ==========================================================================
   INTERIOR PAGES
   Everything below is only reachable on a page that carries the matching
   rh-* section class, so a page without a rail pays nothing for the rail rules.
   ========================================================================== */

/* The highlighted word in a heading. Brass on light grounds, the true Weichert
   yellow on dark, because brass disappears into ink and yellow fails on bone. */
.rh-grapple .rh-hl{font-style:normal;color:var(--brass)}
.rh-grapple .rh-chero .rh-hl,
.rh-grapple .rh-cta .rh-hl,
.rh-grapple .rh-band--ink .rh-hl,
.rh-grapple .rh-ways .rh-hl,
.rh-grapple .rh-side .rh-hl{color:var(--weichert)}

/* ---------------------------------------------------- interior hero ------ */
.rh-grapple .rh-chero{
  position:relative;min-height:clamp(374px,44vw,550px);display:flex;align-items:flex-end;
}
.rh-grapple .rh-chero::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(10,9,9,.70) 0%,rgba(10,9,9,.36) 46%,rgba(10,9,9,.10) 78%),
    linear-gradient(0deg,rgba(10,9,9,.62) 0%,transparent 54%);
}
.rh-grapple .rh-chero > .wp-block-cover__inner-container{display:flex;align-items:flex-end}
.rh-grapple .rh-chero__copy{
  width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
  padding-top:clamp(152px,17vh,214px);padding-bottom:clamp(46px,6vh,86px);
}
.rh-grapple .rh-chero__h1{color:#fff;max-width:19ch}
/* The interior H1 is a step down from the home page's. Declared as a token so
   the shared reset can apply it important over Astra's mobile rule. */
.rh-grapple .rh-chero{--h1:clamp(2.05rem,4.4vw,3.85rem)}
.rh-grapple .rh-chero p.rh-chero__sub{
  color:rgba(255,255,255,.9)!important;font-size:clamp(.98rem,1.35vw,1.14rem);
  font-weight:300;max-width:54ch;margin-top:1.35rem;line-height:1.7;
}
.rh-grapple p.rh-crumbs{
  font-size:.655rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.82)!important;margin-bottom:1.5rem;
  text-shadow:0 1px 12px rgba(10,9,9,.6);
}
.rh-grapple .rh-crumbs a{color:rgba(255,255,255,.82);transition:color .35s var(--ease)}
.rh-grapple .rh-crumbs a:hover{color:var(--weichert)}
.rh-grapple .rh-crumbs strong{font-weight:400;color:var(--weichert)}
.rh-grapple .rh-crumbs span{padding-inline:.5rem;opacity:.5}

/* ---------------------------------------------------- sticky rail -------- */
.rh-grapple .rh-rail{
  position:sticky;top:112px;z-index:40;padding:0;max-width:none;
  background:var(--paper);border-bottom:1px solid var(--line);
  box-shadow:0 10px 26px -24px rgba(10,9,9,.55);
}
.rh-grapple .rh-rail__list{
  display:flex;align-items:center;gap:clamp(1.3rem,2.8vw,2.8rem);
  overflow-x:auto;scrollbar-width:none;
  max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
}
.rh-grapple .rh-rail__list::-webkit-scrollbar{display:none}
.rh-grapple .rh-rail__list li{margin:0;flex:0 0 auto}
.rh-grapple .rh-rail a{
  position:relative;white-space:nowrap;display:inline-block;
  font-family:var(--font-body);font-size:.695rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);
  padding-block:1.15rem;text-decoration:none;transition:color .35s var(--ease);
}
.rh-grapple .rh-rail a::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--brass);transform:scaleX(0);transform-origin:left center;
  transition:transform .45s var(--ease);
}
.rh-grapple .rh-rail a:hover{color:var(--ink)}
.rh-grapple .rh-rail a.is-active{color:var(--brass)}
.rh-grapple .rh-rail a.is-active::after{transform:scaleX(1)}
.rh-grapple .rh-rail a:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
/* A jump target must clear the fixed header AND the rail, or the heading lands
   underneath both and the reader thinks the link did nothing. */
.rh-grapple [id]{scroll-margin-top:190px}
/* Same admin-bar correction the fixed header needs. */
body.admin-bar .rh-grapple .rh-rail{top:144px}
body.admin-bar.rh-grapple .rh-rail{top:144px}

/* ---------------------------------------------------- split2 ------------- */
.rh-grapple .rh-split2{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2.4rem,5vw,5rem);align-items:start}
.rh-grapple .rh-split2__lead,.rh-grapple .rh-split2__body{flex-basis:auto!important}
.rh-grapple .rh-split2__lead h2{max-width:20ch}
.rh-grapple .rh-split2__body p + p{margin-top:1.2rem}

/* ---------------------------------------------------- the two sides ------ */
.rh-grapple .rh-sides{padding:0;max-width:none;background:var(--ink)}
.rh-grapple .rh-sides__grid{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:none;padding:0}
.rh-grapple .rh-sides__col{flex-basis:auto!important}
.rh-grapple .rh-side{
  position:relative;min-height:74vh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--ink);
}
.rh-grapple .rh-side img.wp-block-cover__image-background{
  opacity:.9;transition:transform 1.6s var(--ease),opacity .6s var(--ease);
}
.rh-grapple .rh-side::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(10,9,9,.94) 0%,rgba(10,9,9,.58) 52%,rgba(10,9,9,.14) 100%);
  transition:background .5s var(--ease);
}
.rh-grapple .rh-side:hover img.wp-block-cover__image-background{transform:scale(1.045);opacity:1}
.rh-grapple .rh-side:hover::after{
  background:linear-gradient(0deg,rgba(10,9,9,.90) 0%,rgba(10,9,9,.48) 52%,rgba(10,9,9,.08) 100%);
}
.rh-grapple .rh-side > .wp-block-cover__inner-container{
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(2rem,4vw,3.6rem);color:#fff;max-width:46ch;
}
.rh-grapple p.rh-side__i{
  font-family:var(--font-head);font-size:.72rem;font-weight:300;letter-spacing:.3em;
  color:var(--weichert)!important;display:block;margin-bottom:1rem;
}
.rh-grapple .rh-side__h{color:#fff;margin-bottom:.9rem}
.rh-grapple p.rh-side__p{color:rgba(255,255,255,.85)!important;font-size:.96rem;margin-bottom:1.6rem}
.rh-grapple .rh-side .rh-tlink .wp-block-button__link{color:#fff}
.rh-grapple .rh-side .rh-tlink .wp-block-button__link::after{background:var(--weichert)}
.rh-grapple .rh-side:hover .rh-tlink .wp-block-button__link{color:var(--weichert)}

/* ---------------------------------------------------- field notes -------- */
.rh-grapple .rh-notes{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(1.8rem,3vw,3rem) clamp(2rem,4vw,3.6rem);
  margin-top:clamp(2.6rem,4.4vw,3.6rem);
}
.rh-grapple .rh-note{border-top:1px solid var(--weichert);padding-top:1.3rem;flex-basis:auto!important}
.rh-grapple .rh-note__h{--h3:.92rem;letter-spacing:.055em;margin-bottom:.55rem}
.rh-grapple .rh-note p{font-size:.91rem}

/* ---------------------------------------------------- good to know ------- */
.rh-grapple .rh-gtk{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.6rem,2.8vw,2.8rem);
  margin-top:clamp(2.4rem,4vw,3.2rem);
}
.rh-grapple .rh-gtk__c{border-top:1px solid var(--brass);padding-top:1.35rem;flex-basis:auto!important}
.rh-grapple .rh-gtk__h{--h3:.95rem;letter-spacing:.05em;margin-bottom:.6rem}
.rh-grapple .rh-gtk__c p{font-size:.9rem;color:var(--text-muted);margin-bottom:.9rem}

/* ---------------------------------------------------- the agents -------- */
.rh-grapple .rh-agents{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(2.4rem,5vw,5rem);align-items:center}
.rh-grapple .rh-agents__figure,.rh-grapple .rh-agents__body{flex-basis:auto!important}
.rh-grapple .rh-agents__img img{width:100%;aspect-ratio:4/5;object-fit:cover}
.rh-grapple .rh-agents__body h2{margin-bottom:1.3rem;max-width:20ch}
.rh-grapple .rh-agents__body p + p{margin-top:1.05rem}
.rh-grapple .rh-agents__body .wp-block-buttons{margin-top:2.2rem}

/* ---------------------------------------------------- search band -------- */
.rh-grapple .rh-searchcta{
  position:relative;display:flex;align-items:center;justify-content:center;text-align:center;
  padding-block:clamp(84px,11vw,150px);background:var(--ink);overflow:hidden;
}
.rh-grapple .rh-searchcta img.wp-block-cover__image-background{opacity:.38}
.rh-grapple .rh-searchcta::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,9,9,.72),rgba(10,9,9,.86));
}
.rh-grapple .rh-searchcta__inner{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
  display:flex;flex-direction:column;align-items:center;
}
.rh-grapple .rh-searchcta__h{color:#fff;margin-bottom:1.1rem}
.rh-grapple p.rh-searchcta__note{
  color:var(--onink-body)!important;font-size:.95rem;margin:0 auto 2.2rem;max-width:54ch;
}

/* ---------------------------------------------------- FAQ ---------------- */
.rh-grapple .rh-faq{margin-top:clamp(2.4rem,4vw,3.4rem)}
.rh-grapple .rh-faq > .rh-faq__item{max-width:920px}
.rh-grapple .rh-faq > .rh-faq__item:first-child{border-top:1px solid var(--line)}
.rh-grapple .rh-faq__item{border-bottom:1px solid var(--line)}
.rh-grapple .rh-faq__item summary{
  position:relative;cursor:pointer;list-style:none;padding:1.5rem 3rem 1.5rem 0;
  font-family:var(--font-head);font-size:clamp(1rem,1.35vw,1.16rem);font-weight:300;
  text-transform:uppercase;letter-spacing:.04em;transition:color .35s var(--ease);
}
.rh-grapple .rh-faq__item summary::-webkit-details-marker{display:none}
.rh-grapple .rh-faq__item summary::after{
  content:'';position:absolute;right:0;top:50%;width:14px;height:1px;
  background:var(--brass);transform:translateY(-50%);
}
.rh-grapple .rh-faq__item summary::before{
  content:'';position:absolute;right:6.5px;top:50%;width:1px;height:14px;
  background:var(--brass);transform:translateY(-50%);transition:opacity .3s var(--ease);
}
.rh-grapple .rh-faq__item[open] summary::before{opacity:0}
.rh-grapple .rh-faq__item summary:hover{color:var(--brass)}
.rh-grapple .rh-faq__item summary:focus-visible{outline:2px solid var(--brass);outline-offset:4px}
.rh-grapple .rh-faq__item > p{padding-bottom:1.75rem;color:var(--text-muted);font-size:.97rem;max-width:76ch}

/* ---------------------------------------------------- nearby ------------- */
.rh-grapple .rh-nearby{background:var(--bone)}
.rh-grapple .rh-nearby .rh-towns__grid{grid-template-columns:repeat(3,1fr)}
.rh-grapple .rh-nearby .rh-town{min-height:34vh}

/* ---------------------------------------------------- responsive --------- */
@media (max-width:1180px){
  .rh-grapple .rh-rail{top:96px}
}
@media (max-width:1100px){
  .rh-grapple .rh-notes{grid-template-columns:repeat(2,1fr)}
  .rh-grapple .rh-gtk{grid-template-columns:repeat(2,1fr)}
  .rh-grapple .rh-nearby .rh-towns__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1024px){
  .rh-grapple .rh-agents{grid-template-columns:1fr}
  .rh-grapple .rh-agents__figure{max-width:440px}
  .rh-grapple .rh-split2{grid-template-columns:1fr;gap:1.6rem}
}
@media (max-width:860px){
  .rh-grapple .rh-sides__grid{grid-template-columns:1fr}
  .rh-grapple .rh-side{min-height:56vh}
  .rh-grapple .rh-notes{grid-template-columns:1fr}
  .rh-grapple .rh-nearby .rh-towns__grid{grid-template-columns:1fr}
  .rh-grapple [id]{scroll-margin-top:150px}
}
@media (max-width:560px){
  .rh-grapple .rh-gtk{grid-template-columns:1fr}
}

/* Editor-only note in an unprovisioned IDX zone. Visitors never see this. */
.rh-grapple p.rh-idx__note{
  color:var(--text-muted)!important;font-size:.82rem;line-height:1.7;text-align:center;
  max-width:60ch;margin-inline:auto;
}
.rh-grapple .rh-band--ink p.rh-idx__note{color:#8E8983!important}
.rh-grapple .rh-idx__note code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;
  color:var(--brass);letter-spacing:.04em;
}
.rh-grapple .rh-band--ink .rh-idx__note code{color:var(--weichert)}
.rh-grapple .rh-idx__note strong{
  display:block;font-size:.66rem;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--brass);margin-bottom:.6rem;
}
.rh-grapple .rh-band--ink .rh-idx__note strong{color:var(--weichert)}

/* ==========================================================================
   VARIANT E · THE HELD PLATE
   One photograph stays on screen while the chapters scroll past it, swapping at
   each chapter. Pacing comes from the swap rather than from stacked bands.
   ========================================================================== */
.rh-grapple .rh-plate{
  display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2.4rem,5vw,5.5rem);align-items:start;
}
.rh-grapple .rh-plate__media,.rh-grapple .rh-plate__body{flex-basis:auto!important}

.rh-grapple .rh-plate__media{
  position:sticky;top:168px;
  height:calc(100vh - 232px);min-height:440px;
  overflow:hidden;background:var(--ink);
}
body.admin-bar .rh-grapple .rh-plate__media{top:200px;height:calc(100vh - 264px)}
.rh-grapple .rh-plate__img{
  position:absolute;inset:0;
  opacity:0;transform:scale(1.03);
  transition:opacity 1.1s var(--ease),transform 1.6s var(--ease);
}
.rh-grapple .rh-plate__img img{width:100%;height:100%;object-fit:cover}
/* With no JavaScript, show the first plate rather than an empty black panel.
   Once the script takes over it adds .is-live and the swap owns visibility. */
.rh-grapple .rh-plate__img:first-of-type{opacity:1;transform:none}
.rh-grapple .rh-plate__media.is-live .rh-plate__img:first-of-type{opacity:0;transform:scale(1.03)}
.rh-grapple .rh-plate__media.is-live .rh-plate__img.is-shown{opacity:1;transform:none}

.rh-grapple p.rh-plate__count{
  position:absolute;left:0;bottom:0;z-index:2;width:100%;margin:0;
  padding:1.1rem 1.4rem;
  font-family:var(--font-head);font-size:.72rem;font-weight:300;letter-spacing:.3em;
  color:var(--weichert)!important;
  background:linear-gradient(0deg,rgba(10,9,9,.92) 0%,rgba(10,9,9,.62) 55%,transparent 100%);
}

.rh-grapple .rh-chapter{
  padding-block:clamp(3.4rem,9vh,7rem);min-height:56vh;
  display:flex;flex-direction:column;justify-content:center;
}
.rh-grapple .rh-chapter:first-child{padding-top:0}
.rh-grapple p.rh-chapter__i{
  font-family:var(--font-head);font-size:.74rem;font-weight:300;letter-spacing:.3em;
  color:var(--brass);display:block;margin-bottom:1.1rem;
}
.rh-grapple .rh-chapter h2{margin-bottom:1.15rem}
.rh-grapple .rh-chapter p + p{margin-top:1.05rem}
.rh-grapple .rh-chapter__go{margin-top:2rem}
/* The per-chapter figure is the mobile copy of the plate. display:none keeps
   exactly one of the two in the accessibility tree at any width, so a screen
   reader never hears the same photograph twice. */
.rh-grapple .rh-chapter__figure{display:none}

/* compact check list inside a chapter */
.rh-grapple .rh-mini{margin-top:1.8rem}
.rh-grapple .rh-mini li{
  position:relative;padding-left:1.8rem;margin-bottom:1rem;
  font-size:.93rem;color:var(--text-muted);
}
.rh-grapple .rh-mini li::before{
  content:'';position:absolute;left:0;top:.68em;width:11px;height:1px;background:var(--brass);
}
.rh-grapple .rh-mini strong{
  display:block;font-weight:500;color:var(--text);font-size:.92rem;
  letter-spacing:.04em;text-transform:uppercase;margin-bottom:.25rem;
}

@media (max-width:1024px){
  .rh-grapple .rh-plate{grid-template-columns:1fr;gap:0}
  .rh-grapple .rh-plate__media{display:none}
  .rh-grapple .rh-chapter__figure{display:block;margin-bottom:2rem}
  .rh-grapple .rh-chapter__figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
  .rh-grapple .rh-chapter{padding-block:clamp(2.6rem,7vw,4rem);min-height:0;display:block}
  .rh-grapple .rh-chapter:first-child{padding-top:0}
}
@media (prefers-reduced-motion:reduce){
  .rh-grapple .rh-plate__img{transition:none}
}

/* ==========================================================================
   INTEGRATION · classes the page files use that needed styling
   ========================================================================== */

/* A CTA with two buttons. Without this they stack against the left edge of a
   centred band instead of sitting side by side under the copy. */
.rh-grapple .rh-cta__actions{
  display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;
}
.rh-grapple .rh-cta__actions .wp-block-button{margin:0}

/* The IDX zone on a LIGHT ground. The base .rh-idx draws a dashed white rule,
   which is invisible on bone; this is the same frame in the opposite polarity. */
.rh-grapple .rh-idx--light{border-color:var(--line)}
.rh-grapple .rh-listings--light .rh-idx__note code{color:var(--brass)}
.rh-grapple .rh-listings--light .rh-idx__note strong{color:var(--brass)}

/* A nearby-towns grid of five rather than six. Three columns would leave a
   3 + 2 orphan row, so five across on wide screens, then two, then one. */
.rh-grapple .rh-nearby--5 .rh-towns__grid{grid-template-columns:repeat(5,1fr)}
.rh-grapple .rh-nearby--5 .rh-town{min-height:34vh}

/* The external link inside a good-to-know card. */
.rh-grapple .rh-gtk__go{margin-top:.2rem}

@media (max-width:1280px){
  .rh-grapple .rh-nearby--5 .rh-towns__grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1100px){
  .rh-grapple .rh-nearby--5 .rh-towns__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .rh-grapple .rh-nearby--5 .rh-towns__grid{grid-template-columns:1fr}
}

/* The "All communities" button under a towns grid. */
.rh-grapple .rh-towns__foot{
  justify-content:center;
  padding-block:clamp(2.6rem,4vw,3.8rem) var(--section-y);
}

/* ---------------------------------------------------- sitemap ------------ */
.rh-grapple .rh-smap{
  display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1.8rem,3vw,3rem);
}
.rh-grapple .rh-smap__col{flex-basis:auto!important}
.rh-grapple .rh-smap__col h3{
  margin-bottom:1.1rem;padding-bottom:.8rem;border-bottom:1px solid var(--line);
}
.rh-grapple .rh-smap__list li{margin-bottom:.7rem}
.rh-grapple .rh-smap__list a{
  font-size:.8rem;letter-spacing:.08em;color:var(--text-muted);
  text-decoration:none;transition:color .35s var(--ease);
}
.rh-grapple .rh-smap__list a:hover{color:var(--brass)}

/* ---------------------------------------------------- legal prose -------- */
/* Must outrank `.rh-grapple .rh-band > .wp-block-group{max-width:var(--max-wide)}`
   at (0,3,0), or a privacy policy is set to a 1460px measure and is unreadable.
   Matching the band selector exactly and adding the class wins at (0,4,0). */
.rh-grapple .rh-band > .rh-prose,
.rh-grapple .rh-prose{max-width:860px;margin-inline:auto}
.rh-grapple .rh-prose h2{margin-top:2.6rem;margin-bottom:.9rem}
.rh-grapple .rh-prose h2:first-child{margin-top:0}
.rh-grapple .rh-prose p{margin-bottom:1.1rem;color:var(--text-muted)}
.rh-grapple .rh-prose ul{margin:0 0 1.4rem 1.2rem;list-style:disc}
.rh-grapple .rh-prose li{margin-bottom:.5rem;color:var(--text-muted)}

@media (max-width:1100px){.rh-grapple .rh-smap{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.rh-grapple .rh-smap{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.rh-grapple .rh-smap{grid-template-columns:1fr}}

/* ==========================================================================
   INTEGRATION · round 2
   ========================================================================== */

/* ⚠️ `.rh-gtk__c p{color:var(--text-muted)}` above beats `.rh-band--ink p` on
   source order at equal specificity, so good-to-know body copy stayed #6E6862
   on #0A0909: 3.54:1, under the 4.5:1 body threshold. It reads fine on bone and
   fails on ink, which is why a photograph-only contrast pass did not catch it. */
.rh-grapple .rh-band--ink .rh-gtk__c p{color:var(--onink-body)}
.rh-grapple .rh-band--ink .rh-gtk__h{color:var(--paper)}
.rh-grapple .rh-band--ink .rh-gtk__c{border-top-color:var(--weichert)}

/* Every other body column carries this; the paired block was missed, so its two
   ledes ran together. */
.rh-grapple .rh-paired__body p + p{margin-top:1.15rem}

/* Four service cards rather than three. The base .rh-paths is a hard 3-up, so
   without this the fourth card sits alone on a second row. Squarer than the
   3-up because four across is narrower. */
.rh-grapple .rh-paths--4{grid-template-columns:repeat(4,1fr);gap:clamp(1.1rem,1.6vw,1.6rem)}
.rh-grapple .rh-paths--4 .rh-path{aspect-ratio:3/4}
.rh-grapple .rh-paths--4 .rh-path > .wp-block-cover__inner-container{padding:clamp(1.2rem,1.6vw,1.7rem)}
.rh-grapple .rh-paths--4 p.rh-path__p{font-size:.86rem;margin-bottom:1.1rem}
@media (max-width:1100px){.rh-grapple .rh-paths--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.rh-grapple .rh-paths--4{grid-template-columns:1fr}
  .rh-grapple .rh-paths--4 .rh-path{aspect-ratio:4/3}}

/* ---------------------------------------------------- key checks --------- */
/* Farm & Ranch. A photograph behind a LIGHT card holding one stacked checklist.
   The mockup's own classes for this (.kcC*) were never styled, so this follows
   the intent its markup states: light-ground eyebrow, dark type, <ul> of checks
   with a check icon on each (the mockup's own check path, drawn as a mask). */
.rh-grapple .rh-kchecks{
  position:relative;display:flex;align-items:center;max-width:none;
  padding-block:clamp(88px,11vw,168px);
}
.rh-grapple .rh-kchecks img.wp-block-cover__image-background{opacity:1}
.rh-grapple .rh-kchecks::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,9,9,.28),rgba(10,9,9,.42));
}
.rh-grapple .rh-kchecks__wrap{
  width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
}
.rh-grapple .rh-kchecks__card{
  max-width:760px;background:var(--paper);color:var(--text);
  padding:clamp(2.2rem,4.6vw,4.4rem);
  box-shadow:0 30px 60px -34px rgba(10,9,9,.6);
}
.rh-grapple .rh-kchecks__card h2{color:var(--text);margin-bottom:clamp(1.8rem,3vw,2.6rem)}
.rh-grapple .rh-kchecks__card p{color:var(--text-muted)!important;font-size:.93rem}
.rh-grapple .rh-kcheck{
  position:relative;padding:1.25rem 0 1.25rem 2.6rem;border-top:1px solid var(--line);
}
.rh-grapple .rh-kcheck::before{
  content:'';position:absolute;left:0;top:1.45rem;width:18px;height:18px;
  background-color:var(--brass);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 6L9 17l-5-5%22/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 6L9 17l-5-5%22/%3E%3C/svg%3E") center/contain no-repeat;
}
.rh-grapple .rh-kcheck__h{--h3:.95rem;color:var(--text);letter-spacing:.05em;margin-bottom:.35rem}

/* The "Search every listing" link under an IDX zone. */
.rh-grapple .rh-idx__go{margin-top:2.4rem}

/* An inline rule link inside running prose: the mockup's `.tlink` used in a
   sentence (the legal pages' "contact us"). */
.rh-grapple a.rh-tlink-inline{
  position:relative;display:inline-block;padding-bottom:.38rem;
  font-size:.72rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:inherit;text-decoration:none;transition:color .4s var(--ease);
}
.rh-grapple a.rh-tlink-inline::after{
  content:'';position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--brass);
}
.rh-grapple a.rh-tlink-inline:hover{color:var(--brass)}

/* ---------------------------------------------------- about: what to expect */
/* The mockup's .expect: four across, ONE faint rule over the whole row (not a
   Weichert rule per card, which is good-to-know), full-size white headings, and
   a 26px Weichert line icon above each. The icons are the mockup's own SVG paths,
   drawn as CSS masks: decorative, never in the accessibility tree, and the text
   in every cell stays an editable block. */
.rh-grapple .rh-expect{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.8rem,3vw,3rem);
  margin-top:clamp(2.6rem,4vw,3.6rem);
  /* The rule is drawn on the CONTENT box. As a border it ran out through the
     band's gutter padding to the viewport edge; the mockup's stops at the text. */
  background:linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)) top/100% 1px no-repeat;
  background-origin:content-box;background-clip:content-box;
}
.rh-grapple .rh-expect__item{flex-basis:auto!important;padding-top:clamp(1.8rem,2.6vw,2.4rem)}
.rh-grapple .rh-expect__item::before{
  content:'';display:block;width:26px;height:26px;margin-bottom:1.2rem;
  background-color:var(--weichert);
  -webkit-mask:var(--rh-icon) center/contain no-repeat;mask:var(--rh-icon) center/contain no-repeat;
}
.rh-grapple .rh-expect__h{color:#fff;margin-bottom:.7rem}
.rh-grapple .rh-expect__item p{color:var(--onink-body)!important;font-size:.92rem;line-height:1.7}
@media (max-width:1100px){.rh-grapple .rh-expect{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.rh-grapple .rh-expect{grid-template-columns:1fr}}
.rh-grapple .rh-expect__item--scales{--rh-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3v18%22/%3E%3Cpath d=%22M5 7h14%22/%3E%3Cpath d=%22M5 7l-2.5 6a3.5 3.5 0 007 0L7 7%22/%3E%3Cpath d=%22M19 7l-2.5 6a3.5 3.5 0 007 0L21 7%22/%3E%3C/svg%3E")}
.rh-grapple .rh-expect__item--wrench{--rh-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M14.7 6.3a4 4 0 01-5.4 5.4L4 17v3h3l5.3-5.3a4 4 0 015.4-5.4l-2.6 2.6-2.1-2.1 2.7-2.5z%22/%3E%3C/svg%3E")}
.rh-grapple .rh-expect__item--pin{--rh-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 21s7-5.5 7-11a7 7 0 10-14 0c0 5.5 7 11 7 11z%22/%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%222.6%22/%3E%3C/svg%3E")}
.rh-grapple .rh-expect__item--chat{--rh-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M21 11.5a8.4 8.4 0 01-9 8.4 9 9 0 01-3.9-.9L3 20.5l1.6-4.8A8.3 8.3 0 013.6 11 8.4 8.4 0 0112 3a8.4 8.4 0 019 8.5z%22/%3E%3C/svg%3E")}
.rh-grapple .rh-kchecks__list{border-bottom:1px solid var(--line)}

/* Interior hero on phones, ported from the mockup's own override: the fixed
   clamp height was shorter than the H1 plus subtext needed, so the copy crowded
   the nav. Viewport height, more top padding, and the H1 down a step. Found by
   the 375px mockup review; desktop never showed it. */
@media (max-width:860px){
  .rh-grapple .rh-chero{min-height:76svh;--h1:clamp(1.85rem,8.2vw,2.6rem)}
  .rh-grapple .rh-chero__copy{
    padding-top:clamp(172px,22vh,224px);padding-bottom:clamp(40px,6vh,66px);
  }
  .rh-grapple .rh-chero__h1{max-width:100%}
  .rh-grapple .rh-chero p.rh-chero__sub{font-size:.95rem;max-width:100%;margin-top:1.1rem}
  .rh-grapple p.rh-crumbs{margin-bottom:1.1rem}
}

/* ==========================================================================
   2026-10-29 · Curtis's round on staging
   ========================================================================== */
/* Four field notes sit 2x2, never three and a lone fourth, wherever the block is placed. */
@media (min-width:861px){.rh-grapple .rh-notes:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}}

/* The smaller photo cards read lighter: the photo at full strength under a lighter scrim.
   Measured on staging with grapple/review/photo_contrast.py: every town tile text stays at
   4.7:1 or more; the pathway cards keep their scrim on phones (their small index numerals). */
.rh-grapple .rh-town img.wp-block-cover__image-background{opacity:1}
.rh-grapple .rh-town::after{background:linear-gradient(0deg,rgba(10,9,9,.72) 0%,rgba(10,9,9,.26) 46%,rgba(10,9,9,0) 100%)}
.rh-grapple .rh-town:hover::after{background:linear-gradient(0deg,rgba(10,9,9,.64) 0%,rgba(10,9,9,.18) 52%,rgba(10,9,9,0) 100%)}
.rh-grapple .rh-town :is(h2,h3,p),.rh-grapple .rh-path :is(h2,h3,p){text-shadow:0 1px 14px rgba(10,9,9,.55)}
@media (min-width:861px){
  .rh-grapple .rh-path img.wp-block-cover__image-background{opacity:1}
  .rh-grapple .rh-path::after{background:linear-gradient(0deg,rgba(10,9,9,.94) 0%,rgba(10,9,9,.80) 34%,rgba(10,9,9,.42) 64%,rgba(10,9,9,.06) 100%)}
}

/* Home listings head: the heading left and its line right, so the band fills. */
@media (min-width:861px){
  body.home .rh-listings .rh-shead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:clamp(2.4rem,6vw,6rem);align-items:end}
  body.home .rh-listings .rh-shead .rh-eyebrow{grid-column:1/-1}
  body.home .rh-listings .rh-shead h2{max-width:none;margin:0}
  body.home .rh-listings .rh-shead .rh-lede{margin:0;max-width:40ch}
}

/* Contact: the clients' photo heads the left column. */
.rh-grapple .rh-contact__photo{margin:0 0 clamp(2rem,3.4vw,2.8rem)}
.rh-grapple .rh-contact__photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 30%}

/* Community pages: the plate is the clients, one photo that holds, a little larger.
   On phones it shows once, above the chapters. */
.rh-grapple .rh-plate{grid-template-columns:1.08fr .92fr}
.rh-grapple .rh-plate__img img{object-position:50% 18%}
@media (max-width:1024px){
  .rh-grapple .rh-plate{grid-template-columns:1fr}
  .rh-grapple .rh-plate__media{display:block;position:relative;top:auto;height:auto;aspect-ratio:1/1;margin-bottom:clamp(1.6rem,5vw,2.4rem)}
}
