/* ROUND 63 — "Sentinel Homes - Website Changes Sept 26" (63 pages, 16 Sep 2026).
   Site-wide layer loaded after home.css / inner.css on every page, homepage
   included. home.css and home.js are untouched; every override is scoped to
   body.sh-r63 so the cascade is explicit. Blocks are labelled by doc section. */

/* ============================================================ §Focus (Plans p23)
   "Amber focus ring on all fields site-wide; inline buttons included in the
   focus outline; inline buttons don't scale." */
.sh-r63 :is(input,select,textarea):focus-visible{outline:2px solid var(--amber);outline-offset:0;box-shadow:none}
.sh-r63 .book__field input:focus-visible,.sh-r63 .book__field textarea:focus-visible,.sh-r63 .book__field select:focus-visible{outline:2px solid var(--amber);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.sh-r63 :is(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}
.sh-r63 .btn:focus-visible{outline-offset:3px;transform:none}
.sh-r63 .btn:focus-visible::before{transform:translate(-50%,-50%) scale(0)}
.sh-r63 .btn:focus-visible:hover::before{transform:translate(-50%,-50%) scale(1)}
/* Inline field + button (footer subscribe, postcode search, plan filters): the
   ring wraps the pair; the inner button never gets its own ring or scale. */
.sh-r63 .footer__news-row,.sh-r63 .local__search{border-radius:4px;transition:box-shadow .2s}
.sh-r63 .footer__news-row:focus-within,.sh-r63 .local__search:focus-within{box-shadow:0 0 0 2px var(--amber)}
.sh-r63 .footer__news-row:focus-within :is(input,button):focus-visible,.sh-r63 .local__search:focus-within :is(input,button):focus-visible{outline:none;box-shadow:none}
.sh-r63 .footer__news-row button:focus-visible,.sh-r63 .local__search button:focus-visible,.sh-r63 .footer__news-row button:hover,.sh-r63 .local__search button:hover{transform:none}
.sh-r63 .nav__login:focus-visible{outline:2px solid var(--amber);outline-offset:4px}

/* ==================================================== §Nav (p1–8) — no shrink
   "Don't shrink the logo on scroll; the nav doesn't move, only the colours." */
@media (min-width:1024px){
  .sh-r63 .nav.scrolled .nav__inner{padding-top:32px;padding-bottom:32px}
  .sh-r63 .nav.scrolled .nav__logo img{height:55.76px}
  .sh-r63 .nav__inner,.sh-r63 .nav__logo img{transition:filter .3s ease}
  /* Logo left / Contact + Login right sit OUTSIDE the 1440 container, the
     centred link group stays on the grid (doc p2 sketch). */
  .sh-r63 .nav__inner{max-width:none;padding-left:var(--global-padding);padding-right:var(--global-padding)}
  .sh-r63 .nav__links{position:absolute;left:50%;transform:translateX(-50%);max-width:calc(var(--maxw) - 2 * var(--global-padding))}
}
/* Login: plain text button, no outline (doc p1 "Login" under the profile icon). */
.sh-r63 .nav__login{display:inline-flex;align-items:center;gap:6px;background:transparent;border:0;padding:8px 4px;color:var(--off-white);font:600 12px/1.2 var(--sans);letter-spacing:1.44px;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:color .3s ease,opacity .2s}
.sh-r63 .nav__login:hover{opacity:.72}
.sh-r63 .nav.scrolled .nav__login,.sh-r63 .nav.panel-open .nav__login,.sh-inner.sh-r63 .nav__login{color:var(--charcoal)}
.sh-hero.sh-r63 .nav:not(.scrolled):not(.panel-open) .nav__login{color:var(--off-white)}
@media (max-width:1023px){.sh-r63 .nav__login{display:none}}
.sh-r63 .nav__login svg{width:16px;height:16px}
/* RESOURCES tag: white background (doc p3). */
.sh-r63 .nav .panel__tag,.sh-r63 .nav .np__tag,.sh-r63 .panel .tag{background:var(--white);color:var(--charcoal);border-color:transparent}
/* HR dividers inside dropdowns follow the Figma nav component (1px, 12% ink). */
.sh-r63 .panel hr,.sh-r63 .panel__divider,.sh-r63 .np__divider{border:0;border-top:1px solid rgba(66,64,64,.12);margin:12px 0}
/* Region line under CONTACT — always visible, opens the modal (doc p7–8). */
.sh-r63 .nav__region{display:inline-flex;align-items:center;gap:6px;font:600 11px/1.2 var(--sans);letter-spacing:1.32px;text-transform:uppercase;color:inherit;opacity:.85;background:none;border:0;padding:0;cursor:pointer}
.sh-r63 .nav__region svg{width:12px;height:12px}
.sh-r63 .nav__region:hover{opacity:1;text-decoration:underline}
/* Contact panel: CHANGE is green, no opening hours, tidy button padding (doc p7). */
.sh-r63 .panel__office .btn,.sh-r63 .np__office .btn{padding:12px 20px}
.sh-r63 .panel__office .office-hours,.sh-r63 .np__office-hours,.sh-r63 .panel__hours{display:none}
.sh-r63 .panel__change,.sh-r63 [data-sh-region-open].link-btn{color:var(--sage-dark);--underline-base:rgba(105,128,112,.35)}

/* ======================================================= §Modals (shared)
   Lead form (Site check & ballpark pricing, Get in touch…), video lightbox,
   region chooser. Cream card on a charcoal scrim; opens with a soft rise. */
.sh-modal-open{overflow:hidden}
.sh-lead,.sh-vlb,.sh-region{position:fixed;inset:0;z-index:220;display:flex;align-items:center;justify-content:center;padding:24px}
.sh-lead[hidden],.sh-vlb[hidden],.sh-region[hidden]{display:none}
.sh-lead__scrim,.sh-vlb__scrim,.sh-region__scrim{position:absolute;inset:0;background:rgba(40,38,38,.72);opacity:0;transition:opacity .32s var(--ease-soft)}
.is-open > .sh-lead__scrim,.is-open > .sh-vlb__scrim,.is-open > .sh-region__scrim{opacity:1}
.sh-lead__card,.sh-region__card{position:relative;width:min(640px,100%);max-height:calc(100vh - 48px);overflow:auto;background:var(--cream);border-radius:16px;padding:48px;box-shadow:var(--shadow-lg);opacity:0;transform:translateY(18px) scale(.985);transition:opacity .36s var(--ease-soft),transform .42s var(--ease-fluid)}
.is-open > .sh-lead__card,.is-open > .sh-region__card{opacity:1;transform:none}
.sh-lead__close,.sh-vlb__close,.sh-region__close{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;border:0;background:var(--white);color:var(--charcoal);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm);z-index:2;transition:background .2s,transform .2s}
.sh-lead__close:hover,.sh-vlb__close:hover,.sh-region__close:hover{background:var(--warm-sand);transform:rotate(90deg)}
.sh-lead__close svg,.sh-vlb__close svg,.sh-region__close svg{width:18px;height:18px}
.sh-lead__head{margin-bottom:24px;padding-right:40px}
.sh-lead__title{margin:8px 0 12px;font-size:40px}
.sh-lead__sub{color:var(--mid-grey);margin:0}
.sh-lead__form .book__frow[hidden]{display:none}
.sh-lead .book__field--select select{width:100%;border:0;border-radius:4px;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10' fill='none'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23424040' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center/14px;padding:8px 36px 8px 12px;font:400 14px/1.5 var(--sans);color:var(--charcoal);box-shadow:0 1px 2px rgba(0,0,0,.15);appearance:none}
.sh-lead .book__note a{color:inherit;font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.sh-vlb__close{background:rgba(255,255,255,.92)}
.sh-vlb__frame{position:relative;width:min(1200px,100%);aspect-ratio:16/9;max-height:calc(100vh - 48px);background:#000;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-lg);opacity:0;transform:scale(.97);transition:opacity .32s var(--ease-soft),transform .4s var(--ease-fluid)}
.is-open > .sh-vlb__frame{opacity:1;transform:none}
.sh-vlb.is-portrait .sh-vlb__frame{aspect-ratio:9/16;width:min(480px,100%)}
.sh-vlb__frame iframe,.sh-vlb__frame video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;object-fit:contain}
.sh-vlb.is-login .sh-vlb__frame{aspect-ratio:auto;width:min(560px,100%);height:min(720px,calc(100vh - 48px));background:var(--cream)}
.sh-region__card{width:min(560px,100%)}
.sh-region__sub{color:var(--mid-grey);margin:12px 0 24px}
.sh-region__list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sh-region__opt{width:100%;display:flex;align-items:center;gap:12px;background:var(--white);border:0;border-radius:8px;padding:14px 18px;text-align:left;cursor:pointer;color:var(--charcoal);font:500 16px/1.3 var(--sans);box-shadow:var(--shadow-sm);transition:background .2s,transform .2s}
.sh-region__opt:hover{background:var(--warm-sand);transform:translateX(2px)}
.sh-region__opt.is-current{outline:2px solid var(--sage);outline-offset:-2px}
.sh-region__meta{color:var(--mid-grey);margin-left:auto}
.sh-region__opt .arrow{width:16px;height:16px;flex:none}
@media (max-width:767px){
  .sh-lead,.sh-region{padding:0;align-items:flex-end}
  .sh-lead__card,.sh-region__card{border-radius:16px 16px 0 0;padding:32px 24px 40px;max-height:92vh}
  .sh-lead__title{font-size:32px}
  .sh-vlb{padding:12px}
}

/* ================================================ §Forms (KDR p46, Plans p48)
   Gentle validation, submitting state, thank-you in place of the form. */
.sh-r63 .book__field.has-error input,.sh-r63 .book__field.has-error textarea,.sh-r63 .book__field.has-error select,.sh-r63 .has-error > input,.sh-r63 .has-error > textarea{box-shadow:0 1px 2px rgba(0,0,0,.15),0 0 0 2px var(--terracotta)}
.sh-ferr{margin:-4px 0 0;font:500 13px/1.4 var(--sans);color:var(--terracotta);animation:sh-ferr .25s var(--ease-soft)}
@keyframes sh-ferr{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.sh-fnote{margin:0;padding:12px 16px;border-radius:4px;font:500 14px/1.5 var(--sans);background:var(--terracotta);color:var(--off-white)}
.btn.is-submitting{pointer-events:none;opacity:.85}
.sh-spin{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;margin-right:8px;vertical-align:-2px;animation:sh-spin .7s linear infinite}
@keyframes sh-spin{to{transform:rotate(360deg)}}
.sh-thanks{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;min-height:320px;padding:40px 32px;background:var(--cream);border-radius:16px;opacity:0;transform:translateY(10px);transition:opacity .5s var(--ease-soft),transform .6s var(--ease-fluid)}
.sh-thanks.is-in{opacity:1;transform:none}
.sh-thanks:focus{outline:none}
.sh-thanks__title{margin:0;font-size:40px}
.sh-thanks__body{margin:0;max-width:440px;color:var(--mid-grey)}
.sh-thanks__body a{color:var(--charcoal);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.sh-thanks__contact{margin-top:8px}
.sf--sage .sh-thanks,.sf--warm-sand .sh-thanks{background:var(--off-white)}
.sh-lead .sh-thanks{background:transparent;min-height:240px;padding:24px 0}
.footer .sh-thanks{background:transparent;min-height:0;padding:0;align-items:flex-start;text-align:left;gap:6px}
.footer .sh-thanks__title{font-size:20px;color:var(--cream)}
.footer .sh-thanks__body{font-size:14px;color:rgba(255,255,255,.7)}
.footer .sh-thanks__contact{display:none}

/* ================================================= §Image lightbox aspect (p18, p31, p42)
   Whole image at its own aspect, no crop; the card wraps the image. */
.sh-r63 .glb.sh-r63-glb .glb__card{aspect-ratio:auto;width:auto;max-width:min(1400px,100%);max-height:100%;background:transparent;box-shadow:none;display:flex;align-items:center;justify-content:center}
.sh-r63 .glb.sh-r63-glb .glb__img{width:auto;height:auto;max-width:100%;max-height:calc(100vh - 192px);object-fit:contain;border-radius:16px;box-shadow:var(--shadow-lg)}
.sh-r63 .glb.sh-r63-glb .glb__info{left:0;right:0}
.sh-r63 .glb.sh-r63-glb .glb__info.is-empty{display:none}
.sh-r63 .glb .sh-glb-video{max-width:100%;max-height:calc(100vh - 192px);border-radius:16px;display:block;background:#000}
@media (max-width:767px){.sh-r63 .glb.sh-r63-glb .glb__img{max-height:calc(100vh - 120px)}}

/* ==================================================== §Horizontal scrollers (p10, p30, p33, p42)
   Track starts at the container edge, runs to the page edge, ends with the
   global padding on the right; native swipe; thicker grab bar on hover. */
.sh-r63 .sh-hs{overflow-x:auto;overflow-y:visible;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:transparent transparent;padding-bottom:18px;margin-bottom:-18px;cursor:grab}
.sh-r63 .sh-hs.is-grab{cursor:grabbing;scroll-snap-type:none;user-select:none}
.sh-r63 .sh-hs > *{scroll-snap-align:start}
.sh-r63 .sh-hs::-webkit-scrollbar{height:6px}
.sh-r63 .sh-hs::-webkit-scrollbar-track{background:transparent}
.sh-r63 .sh-hs::-webkit-scrollbar-thumb{background:transparent;border-radius:6px;transition:background .2s}
.sh-r63 .sh-hs:hover{scrollbar-color:rgba(66,64,64,.45) rgba(66,64,64,.08)}
.sh-r63 .sh-hs:hover::-webkit-scrollbar{height:10px}
.sh-r63 .sh-hs:hover::-webkit-scrollbar-thumb{background:rgba(66,64,64,.45)}
.sh-r63 .sh-hs:hover::-webkit-scrollbar-track{background:rgba(66,64,64,.08)}
/* Bleed: the wrapper is inside the grid; the track's own right padding = the
   global gutter so the last card finishes on the page padding. */
.sh-r63 .sh-hs--bleed{margin-right:calc(-1 * max(var(--global-padding), (100vw - var(--maxw)) / 2 + var(--global-padding)));padding-right:var(--global-padding);scroll-padding-right:var(--global-padding)}
.sh-r63 .sh-hs--bleed::after{content:"";flex:none;width:1px}

/* ============================================================= §Cards
   Whole card hover = button hover (p10, p37, p39); text panel covers the
   image on hover; crop at the card edge; images never shrink. */
.sh-r63 [data-sh-card-link]{cursor:pointer}
.sh-r63 .sh-card-hover:hover .btn::before,.sh-r63 [data-sh-card-link]:hover .btn::before{transform:translate(-50%,-50%) scale(1)}
.sh-r63 .sh-card-hover:hover .btn,.sh-r63 [data-sh-card-link]:hover .btn{transform:translateY(-2px)}
.sh-r63 .sh-card-hover:hover .btn .arrow,.sh-r63 [data-sh-card-link]:hover .btn .arrow,.sh-r63 .sh-card-hover:hover .link-btn .arrow,.sh-r63 [data-sh-card-link]:hover .link-btn .arrow{transform:translateX(4px)}
.sh-r63 .sh-card-hover:hover .link-btn::after,.sh-r63 [data-sh-card-link]:hover .link-btn::after{transform:scaleX(1)}
.sh-r63 .sh-card-hover:hover .btn--outline-light,.sh-r63 [data-sh-card-link]:hover .btn--outline-light{box-shadow:0 3px 10px rgba(0,0,0,.12)}
/* Build Options cards (homepage .build__card + Build Options page): the image
   stays put, the text panel rises to cover it, cropped at the card edge. */
.sh-r63 .build__card{overflow:hidden}

/* ==================================================== §Hero copy fade (p17, p19, p29, p52)
   0 → 100% opacity with a short rise; nothing dips first. */
.js .sh-r63 .sh-fadeup{opacity:0;transform:translateY(10px);transition:opacity 1s var(--ease-lux),transform 1.1s var(--ease-lux)}
.js.sh-r63-ready .sh-fadeup{opacity:1;transform:none}
.js .sh-r63 .sh-fadeup .reveal{opacity:1!important;transform:none!important;transition:none!important}
/* The generic .reveal rise loses its overshoot feel: shorter travel, no spring. */
.js .sh-r63 .reveal{transform:translateY(10px);transition:opacity .9s var(--ease-lux),transform .9s var(--ease-lux)}
.js .sh-r63 .reveal.is-visible{transform:none}
/* Circle heroes (Accessible p33, Build vs Buy p49, Pricing p50, Charity detail
   p61): the circle fades in and grows from 92% after a 1s beat. */
.js .sh-r63 .ch__circle,.js .sh-r63 .circle-hero__circle,.js .sh-r63 .sh-circle{opacity:0;transform:scale(.92);transition:opacity 1.2s var(--ease-lux) 1s,transform 1.4s var(--ease-lux) 1s}
.js.sh-r63-ready .ch__circle,.js.sh-r63-ready .circle-hero__circle,.js.sh-r63-ready .sh-circle{opacity:1;transform:none}

/* ============================================================ §Hero zoom reset (p9)
   Resting scale returns when the section leaves the viewport (class from r63.js);
   hovering no longer reverses the zoom on mouse-off. */
@media (min-width:1024px){
  .sh-r63 .sh-zoom.sh-r63-out .sh-zoom-media img{transform:scale(1.12);transition-duration:.01s}
  .sh-r63 .sh-zoom.sh-r63-hovered:not(.sh-r63-out) .sh-zoom-media img{transform:scale(1);transition-duration:14s;transition-timing-function:cubic-bezier(.22,.61,.24,1)}
  .sh-r63 .sh-zoom:not(:hover) .sh-zoom-media img{transition-duration:14s}
}

/* ============================================================= §FAQ cascade (p15)
   Rows fade + rise one after another when the list enters view. */
.js .sh-r63 .faq__list .sh-cascade{opacity:0;transform:translateY(8px);transition:opacity .55s var(--ease-lux),transform .6s var(--ease-lux);transition-delay:calc(var(--i,0) * 70ms)}
.js .sh-r63 .faq__list.is-in .sh-cascade{opacity:1;transform:none}
.js .sh-r63 .faq__list.is-in .sh-cascade.reveal{opacity:1;transform:none}

/* ============================================================= §Parallax (p38, p50, p58)
   Vertical drift on editorial images; wrapper crops. */
.sh-r63 .sh-plx{transform:translate3d(0,var(--plx,0px),0);will-change:transform;transition:none}
.sh-r63 .sh-plx-wrap{overflow:hidden}
@media (prefers-reduced-motion:reduce){.sh-r63 .sh-plx{transform:none}}

/* ============================================================= §Footer (p16–17)
   Letter-by-letter "Beautifully built"; live breadcrumbs; five socials. */
.sh-letters .sh-ltr{display:inline-block;opacity:0;transform:translateY(.35em);transition:opacity .5s var(--ease-lux),transform .7s var(--ease-lux);transition-delay:calc(var(--i,0) * 38ms)}
.footer__brand-title.is-in .sh-ltr{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.sh-letters .sh-ltr{opacity:1;transform:none;transition:none}}
.sh-r63 .footer__crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.sh-r63 .footer__crumbs li{display:inline-flex;align-items:center}
.sh-r63 .footer__crumbs a{color:var(--cream);text-decoration:none;font-weight:600;font-size:14px;letter-spacing:1.68px;text-transform:uppercase;border-bottom:1px solid transparent;transition:border-color .2s}
.sh-r63 .footer__crumbs a:hover{border-bottom-color:var(--cream)}
.sh-r63 .footer__crumbs span{font-weight:600;font-size:14px;letter-spacing:1.68px;text-transform:uppercase;color:var(--cream);opacity:.7}
.sh-r63 .footer__contact-item a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);transition:border-color .2s}
.sh-r63 .footer__contact-item a:hover{border-bottom-color:currentColor}
.sh-r63 .footer__social{gap:20px}
.sh-r63 .footer__social a svg{height:20px;width:auto}
.sh-r63 .footer__social a{display:inline-flex;align-items:center;transition:opacity .2s}
.sh-r63 .footer__social a:hover{opacity:.7}
.sh-r63 .footer__news-row{position:relative}
.sh-r63 .footer__news-row .sh-ferr{position:absolute;left:0;top:100%;margin-top:6px;color:#f1b8a6}

/* ================================================== §Fluid type on inner pages (p1)
   "Fluid font / image scaling within breakpoints (as agreed with Steve)". Inner
   pages were fixed px at the 1440 reference; between 1024 and 1919 they now
   scale linearly with the viewport (0.78× at 1024 → 1× at 1440 → 1.2× at 1919),
   images already follow their grid. The homepage keeps its own approved scale. */
@media (min-width:1024px){
  .sh-r63:not(.sh-r63-home){--fl:clamp(.78, tan(atan2(100vw, 1440px)), 1.2)}
  .sh-r63:not(.sh-r63-home) .h1,.sh-r63:not(.sh-r63-home) h1.kd__title,.sh-r63:not(.sh-r63-home) .kd__title.h1{font-size:calc(59px * var(--fl));letter-spacing:calc(-.59px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .h2{font-size:calc(48px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .h3{font-size:calc(27px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .h3-serif{font-size:calc(35px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .body-lg{font-size:calc(20px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .body{font-size:calc(16px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .body-sm{font-size:calc(14px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .label-lg{font-size:calc(14px * var(--fl));letter-spacing:calc(1.68px * var(--fl))}
  .sh-r63:not(.sh-r63-home) .kd__eyebrow,.sh-r63:not(.sh-r63-home) .eyebrow{font-size:calc(12px * var(--fl))}
}

/* ============================================================= §Misc
   Homepage map zoom toward the chosen office (p13); accordion list padding (p13). */
.sh-r63 .local__mapbox{transition:transform .9s var(--ease-fluid);transform-origin:50% 50%}
.sh-r63 .local__mapfit{overflow:hidden}
.sh-r63 .local__list{padding-bottom:0}
.sh-r63 .local__search.is-busy button{opacity:.5}
/* Login iframe */
.sh-login-frame{background:var(--cream)}

/* ============================================================ §Nav panel rows (p5–8)
   heading (About Sentinel Homes), region line, always-visible office list. */
.sh-r63 .np-heading a{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.15;color:var(--charcoal);text-decoration:none;transition:color .25s}
.sh-r63 .np-heading a:hover{color:var(--sage-dark)}
.sh-r63 .np-heading .np-arrow{width:24px;height:24px;opacity:0;transform:translateX(-8px);transition:opacity .25s,transform .25s}
.sh-r63 .np-heading a:hover .np-arrow{opacity:1;transform:none}
.sh-r63 .np-heading{margin-bottom:8px}
.sh-r63 .np-region{margin-top:-12px;font-size:14px;line-height:1.5;color:var(--charcoal)}
.sh-r63 .np-region button{font:inherit;color:var(--sage-dark);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;gap:4px}
.sh-r63 .np-region button:hover{color:var(--charcoal)}
.sh-r63 .np-region .np-chev{width:10px;height:6px}
.sh-r63 .nav__panel--contact .np-office-list{grid-template-rows:1fr;background:var(--cream)}
.sh-r63 .np-office-change{color:var(--sage-dark)}
.sh-r63 .np-office-change:hover{color:var(--charcoal)}
.sh-r63 .np-office-actions .np-pill{padding:10px 18px}
.sh-r63 .mnav__row--heading a{font-family:var(--serif);font-size:28px}
.sh-r63 .mnav__row--region{font-size:14px;opacity:.9}
.sh-r63 .mnav__row--region button{font:inherit;background:none;border:0;color:inherit;text-decoration:underline;padding:0}
.sh-r63 .book__field--select select{width:100%;border:0;border-radius:4px;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10' fill='none'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23424040' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center/14px;padding:8px 36px 8px 12px;font:400 14px/1.5 var(--sans);color:var(--charcoal);box-shadow:0 1px 2px rgba(0,0,0,.15);appearance:none}

/* ============================================================ §Contact page (p8)
   Intro, office cards (closest first), form, FAQ. */
.sh-r63 .ct{padding:calc(var(--nav-h,120px) + 64px) var(--global-padding) 96px;max-width:var(--maxw);margin:0 auto}
.sh-r63 .ct__intro{max-width:720px;margin:0 auto 56px;text-align:center}
.sh-r63 .ct__lead{margin:20px 0 0;color:var(--mid-grey)}
.sh-r63 .ct__lead a{color:var(--charcoal);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.sh-r63 .ct__copy{margin-top:12px;color:var(--mid-grey)}
.sh-r63 .ct__region{margin:20px 0 0;display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.sh-r63 .ct__change{background:none;border:0;cursor:pointer;font:inherit}
.sh-r63 .ct__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.sh-r63 .ct-card{display:flex;flex-direction:column;background:var(--white);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .45s var(--ease-fluid),box-shadow .45s}
.sh-r63 .ct-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover,var(--shadow-lg))}
.sh-r63 .ct-card.is-closest{order:-1;outline:2px solid var(--sage);outline-offset:-2px}
.sh-r63 .ct-card__media{display:block;aspect-ratio:16/10;overflow:hidden}
.sh-r63 .ct-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.sh-r63 .ct-card__body{padding:24px 28px 28px;display:flex;flex-direction:column;gap:8px;flex:1}
.sh-r63 .ct-card__tag{color:var(--sage-dark)}
.sh-r63 .ct-card__title{margin:0}
.sh-r63 .ct-card__leader,.sh-r63 .ct-card__addr{margin:0;color:var(--mid-grey)}
.sh-r63 .ct-card__contact{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.sh-r63 .ct-card__contact a{color:var(--charcoal);text-decoration:none;border-bottom:1px solid rgba(66,64,64,.25);transition:border-color .2s}
.sh-r63 .ct-card__contact a:hover{border-bottom-color:var(--charcoal)}
.sh-r63 .ct-card__actions{margin-top:auto;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (max-width:1023px){.sh-r63 .ct__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.sh-r63 .ct{padding-top:calc(var(--nav-h,88px) + 40px)}.sh-r63 .ct__grid{grid-template-columns:1fr}}

/* ============================================================ §Legal pages (p17) */
.sh-r63 .lg{background:var(--cream);padding:calc(var(--nav-h,120px) + 64px) var(--global-padding) 120px}
.sh-r63 .lg__inner{max-width:720px;margin:0 auto}
.sh-r63 .lg__updated{margin:12px 0 0;color:var(--mid-grey)}
.sh-r63 .lg__body{margin-top:40px}
.sh-r63 .lg__body h2{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.2;margin:40px 0 12px}
.sh-r63 .lg__body p{margin:0 0 16px}
.sh-r63 .lg__body a{color:var(--charcoal);border-bottom:1px solid currentColor;text-decoration:none}
.sh-r63 .lg__body ul{padding-left:20px}

/* ============================================================ §Blog (p63)
   Index: feature + 3-col cards; Post: photo hero, 720 measure, share, more. */
.sh-r63 .bl{padding:calc(var(--nav-h,120px) + 64px) var(--global-padding) 96px;max-width:var(--maxw);margin:0 auto}
.sh-r63 .bl__intro{max-width:720px;margin:0 auto 56px;text-align:center}
.sh-r63 .bl__lead{margin-top:16px;color:var(--mid-grey)}
.sh-r63 .bl__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px}
.sh-r63 .bl-card{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--white);box-shadow:var(--shadow-sm);transition:transform .45s var(--ease-fluid),box-shadow .45s}
.sh-r63 .bl-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover,var(--shadow-lg))}
.sh-r63 .bl-card__media{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--warm-sand)}
.sh-r63 .bl-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease-fluid)}
.sh-r63 .bl-card:hover .bl-card__media img{transform:scale(1.04)}
.sh-r63 .bl-card__body{padding:24px 28px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.sh-r63 .bl-card__meta{margin:0;color:var(--mid-grey)}
.sh-r63 .bl-card__title{margin:0}
.sh-r63 .bl-card__title a{color:inherit;text-decoration:none}
.sh-r63 .bl-card__excerpt{margin:0;color:var(--mid-grey)}
.sh-r63 .bl-card .link-btn{margin-top:auto;align-self:flex-start}
.sh-r63 .bl-card--feature{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;background:var(--cream)}
.sh-r63 .bl-card--feature .bl-card__media{aspect-ratio:16/10;height:100%}
.sh-r63 .bl-card--feature .bl-card__body{padding:48px}
.sh-r63 .bl__pages{margin-top:48px;display:flex;justify-content:center}
.sh-r63 .bl__pages .nav-links{display:flex;gap:6px;align-items:center}
.sh-r63 .bl__pages .page-numbers{display:inline-flex;min-width:40px;height:40px;padding:0 12px;align-items:center;justify-content:center;border-radius:20px;font:600 12px/1 var(--sans);letter-spacing:1.44px;text-transform:uppercase;color:var(--charcoal);text-decoration:none;background:var(--white);box-shadow:var(--shadow-sm)}
.sh-r63 .bl__pages .page-numbers.current{background:var(--sage);color:var(--off-white)}
.sh-r63 .bl__pages .page-numbers.dots{background:none;box-shadow:none}
.sh-r63 .bl__empty{max-width:640px;margin:0 auto;text-align:center;color:var(--mid-grey)}
.sh-r63 .bp__hero{position:relative;min-height:min(72vh,720px);display:flex;align-items:flex-end;padding:calc(var(--nav-h,120px) + 48px) var(--global-padding) 64px;color:var(--off-white);overflow:hidden;background:var(--slate-green)}
.sh-r63 .bp__hero--plain{color:var(--charcoal);background:var(--cream);min-height:0}
.sh-r63 .bp__bgwrap{position:absolute;inset:0;overflow:hidden}
.sh-r63 .bp__bg{width:100%;height:100%;object-fit:cover;display:block}
.sh-r63 .bp__wash{position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,38,38,.18) 0%,rgba(40,38,38,.7) 100%)}
.sh-r63 .bp__head{position:relative;max-width:900px;margin:0 auto;width:100%}
.sh-r63 .bp__meta{margin:0 0 16px;opacity:.85}
.sh-r63 .bp__meta a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4)}
.sh-r63 .bp__title{margin:0}
.sh-r63 .bp__sub{margin:20px 0 0;max-width:720px;opacity:.9}
.sh-r63 .bp__body{max-width:var(--maxw);margin:0 auto;padding:80px var(--global-padding) 40px;display:grid;grid-template-columns:minmax(0,720px) 320px;gap:64px;justify-content:center}
.sh-r63 .bp__content > *{margin:0 0 20px}
.sh-r63 .bp__content h2,.sh-r63 .bp__content h3{font-family:var(--serif);font-weight:400;line-height:1.2;margin-top:40px}
.sh-r63 .bp__content h2{font-size:36px}
.sh-r63 .bp__content h3{font-size:28px}
.sh-r63 .bp__content img{max-width:100%;height:auto;border-radius:16px;display:block;margin:32px 0}
.sh-r63 .bp__content a{color:var(--charcoal);text-decoration:none;border-bottom:1px solid currentColor}
.sh-r63 .bp__content blockquote{margin:32px 0;padding-left:24px;border-left:3px solid var(--sage);font-family:var(--serif);font-size:24px;line-height:1.35}
.sh-r63 .bp__side{display:flex;flex-direction:column;gap:32px;align-self:start;position:sticky;top:calc(var(--nav-h,120px) + 24px)}
.sh-r63 .bp__share{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.sh-r63 .bp__share .label{margin:0;width:100%;color:var(--mid-grey)}
.sh-r63 .bp__share a{font:500 14px/1.5 var(--sans);color:var(--charcoal);text-decoration:none;border-bottom:1px solid rgba(66,64,64,.25)}
.sh-r63 .bp__cta{background:var(--cream);border-radius:16px;padding:32px}
.sh-r63 .bp__cta .h3{margin:0 0 8px}
.sh-r63 .bp__cta .body{margin:0 0 20px;color:var(--mid-grey)}
.sh-r63 .bp__more{max-width:var(--maxw);margin:0 auto;padding:64px var(--global-padding) 96px}
.sh-r63 .bp__more .kd__head{margin-bottom:40px}
.sh-r63 .bp__all{margin:40px 0 0;text-align:center}
@media (max-width:1023px){.sh-r63 .bl__grid{grid-template-columns:repeat(2,1fr)}.sh-r63 .bl-card--feature{grid-template-columns:1fr}.sh-r63 .bp__body{grid-template-columns:1fr;gap:40px}.sh-r63 .bp__side{position:static}}
@media (max-width:767px){.sh-r63 .bl{padding-top:calc(var(--nav-h,88px) + 40px)}.sh-r63 .bl__grid{grid-template-columns:1fr}.sh-r63 .bl-card--feature .bl-card__body{padding:28px 24px}.sh-r63 .bp__hero{min-height:60vh;padding-top:calc(var(--nav-h,88px) + 32px)}}

/* About Sentinel Homes: the founders' portrait keeps faces in frame; Our Promise anchors. */
.sh-r63.page-about-sentinel-homes .sy-hero__media img{object-position:50% 12%}
.sh-r63 .sy-check[id]{scroll-margin-top:calc(var(--nav-h,120px) + 24px)}

/* ============================================================ §Homepage (p8–17)
   Ideas split: no fade on the photo top, halves lighten on hover, whole half
   clickable (front-page-body.php adds data-sh-card-link). */
.sh-r63-home .ideas__col--style .ideas__media img{-webkit-mask-image:none;mask-image:none}
.sh-r63-home .ideas__col{cursor:pointer}
.sh-r63-home .ideas__col--plans::before{transition:background-color .5s var(--ease-soft)}
.sh-r63-home .ideas__col--plans:hover::before{background:var(--white)}
.sh-r63-home .ideas__col--style::after{content:"";position:absolute;top:0;bottom:0;left:0;right:calc(-1 * max(0px,(100vw - var(--maxw)) / 2));background:var(--off-white);opacity:0;transition:opacity .5s var(--ease-soft);z-index:0;pointer-events:none}
.sh-r63-home .ideas__col--style:hover::after{opacity:.55}
.sh-r63-home .ideas__col:hover .link-btn::after{transform:scaleX(1)}
.sh-r63-home .ideas__col:hover .link-btn .arrow{transform:translateX(4px)}
/* Build Options strip: ends on the global padding; grabbable thicker bar. */
@media (min-width:1024px){
  .sh-r63-home .build.sh-hscroll .build__cards{padding-right:var(--global-padding)}
  .sh-r63-home .build__track{height:3px;cursor:grab;transition:height .2s;padding:10px 0;background:transparent;box-sizing:content-box;background-clip:content-box}
  .sh-r63-home .build__trackrow:hover .build__track{height:8px}
  .sh-r63-home .build__track.is-drag{cursor:grabbing}
  .sh-r63-home .build__track{background:#fdfbf9;background-clip:content-box}
  .sh-r63-home .build__track-fill{top:10px;height:calc(100% - 20px);transition:height .2s,top .2s}
}
/* Build option cards (homepage + Build Options page): the photo fills the card
   and never shrinks; the white panel is anchored to the bottom and grows UP over
   the photo; the reveal clips at the card's bottom edge, not at the padding. */
@media (min-width:1024px){
  .sh-r63 .build__card{position:relative}
  .sh-r63 .build__card > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;flex:none;transform:none!important}
  .sh-r63 .build__card-body{position:absolute;left:0;right:0;bottom:0;z-index:1;background:#fff}
  .sh-r63 .build__card-reveal{margin-bottom:-30.6px;padding-bottom:30.6px}
}
/* Step cards: hovering the card puts its button in the hover state, shifted left a touch. */
.sh-r63-home .step:hover .step__cta,.sh-r63-home .step:focus-within .step__cta{background:#ffffff;border-color:rgba(0,0,0,.08);border-radius:999px;padding:13px 24px;margin-bottom:-10px;box-shadow:0 4px 14px rgba(0,0,0,.10);transform:translate(-14px,-2px)}
.sh-r63-home .step:hover .step__cta .arrow{transform:translateX(4px)}
.sh-r63-home .step{cursor:pointer}
/* Blog: the feature stays on the first article; cards only crop at the window's top/bottom edge (section edge). */
.sh-r63-home .blog.sh-steps .blog-card{opacity:1!important}
.sh-r63-home .blog__slider{border-radius:0}
/* Find your local office: even padding inside the open card; no dead space under the list. */
.sh-r63-home .office__card{padding:24px}
.sh-r63-home .local__list{margin-bottom:0}
.sh-r63-home .local__panel{padding-bottom:0}

/* ============================================================ §Gallery + Awards (p17–19, p56)
   Full-width grid (+ global padding), heading centred between the nav and the
   grid, sticky filter column, heart on every tile, natural-aspect tiles. */
.sh-r63 .gal__body{max-width:none;padding-left:var(--global-padding);padding-right:var(--global-padding)}
.sh-r63 .gal__head{box-sizing:border-box;min-height:calc(120px + 38vh);justify-content:center;padding:120px 48px 24px}
@media (min-width:1024px){
  .sh-r63 .gal__filters{position:sticky;top:calc(120px + 24px);max-height:calc(100vh - 120px - 48px);overflow:auto;scrollbar-width:thin;padding-right:6px}
}
@media (max-width:1023px){
  .sh-r63 .gal__filters-toggle{position:sticky;top:calc(88px + 12px);z-index:5;background:var(--cream)}
  .sh-r63 .gal__filters.is-open{position:sticky;top:calc(88px + 64px);max-height:calc(100vh - 88px - 80px);overflow:auto;background:var(--cream);z-index:5}
}
.sh-r63 .gt--drawing .gt__save{opacity:1}
.sh-r63 .gt--natural .gt__media img{object-fit:cover}
.sh-r63 .gt--extra .gt__tag{display:none}
/* Save nudge toast (first save of a visit, signed-out) */
.sh-toast{position:fixed;left:50%;bottom:24px;z-index:210;transform:translate(-50%,16px);opacity:0;display:flex;align-items:center;gap:16px;max-width:min(560px,calc(100vw - 32px));padding:14px 16px 14px 20px;background:var(--charcoal);color:var(--off-white);border-radius:12px;box-shadow:var(--shadow-lg);transition:opacity .35s var(--ease-soft),transform .45s var(--ease-fluid)}
.sh-toast.is-in{opacity:1;transform:translate(-50%,0)}
.sh-toast__icon{width:18px;height:18px;flex:none;background:url("inner/heart-filled.svg") center/18px no-repeat;filter:brightness(0) invert(1)}
.sh-toast__text{font:400 14px/1.45 var(--sans)}
.sh-toast__btn{flex:none;padding:10px 18px}
.sh-toast__close{flex:none;background:none;border:0;color:inherit;font-size:22px;line-height:1;cursor:pointer;opacity:.7;padding:0 4px}
.sh-toast__close:hover{opacity:1}

/* ============================================================ §Plans page (p19–24) */
.sh-r63 .pl-intro{min-height:calc(120px + 34vh);align-items:center}
.sh-r63 .pl-intro__text{padding-top:calc(120px + 24px);padding-bottom:48px}
/* active view = the brighter one */
.sh-r63 .pl__view{background:var(--off-white);opacity:.85}
.sh-r63 .pl__view.is-on{background:var(--white);opacity:1;box-shadow:0 1px 4px rgba(0,0,0,.12)}
/* home size slider: value pills above the thumbs, sage fill between them */
.sh-r63 .pl__size{position:relative;padding-top:30px}
.sh-r63 .pl__size-vals{position:absolute;left:0;right:0;top:0;height:0;justify-content:flex-start}
.sh-r63 .pl__size-vals span{position:absolute;top:0;transform:translateX(-50%);background:var(--white);border-radius:6px;padding:3px 8px;box-shadow:0 1px 2px rgba(0,0,0,.12);font:600 12px/1.4 var(--sans);color:var(--charcoal);letter-spacing:0;white-space:nowrap}
.sh-r63 .pl__size-track{height:20px}
.sh-r63 .pl__size-track::before{top:9px;height:2px;background:var(--tan,#d9cfb8)}
.sh-r63 .pl__size-track .sh-size-fill{position:absolute;top:9px;height:2px;background:var(--sage);pointer-events:none}
.sh-r63 .pl__size-track input::-webkit-slider-thumb{width:20px;height:20px;border:3px solid var(--off-white);box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sh-r63 .pl__size-track input::-moz-range-thumb{width:20px;height:20px;border:3px solid var(--off-white)}
/* plan row card (Figma): no tag, no name label; m² hard right → arrow on hover; name above stats on hover; scale + shadow */
.sh-r63 .pl-row .ac-plan__tag,.sh-r63 .pl-row .pl-row__name{display:none}
.sh-r63 .pl-row{transition:transform .5s var(--ease-fluid),box-shadow .5s var(--ease-fluid)}
.sh-r63 .pl-row:hover,.sh-r63 .pl-row:focus-within{transform:scale(1.015);box-shadow:var(--shadow-card-hover,var(--shadow-lg));z-index:2}
.sh-r63 .pl-row .ac-plan__drawing{padding:32px 24px 56px}
.sh-r63 .pl-row .ac-plan__specs{bottom:24px;padding-right:24px;align-items:flex-end}
.sh-r63 .pl-row .ac-plan__spec{position:relative;padding-top:26px}
.sh-r63 .pl-row .ac-plan__spec::before{content:attr(data-name);position:absolute;left:-6px;top:-4px;padding:2px 6px;background:var(--white);border-radius:4px;font:600 12px/1.4 var(--sans);letter-spacing:1.44px;text-transform:uppercase;color:var(--charcoal);opacity:0;transform:translateY(6px);transition:opacity .3s,transform .35s var(--ease-fluid)}
.sh-r63 .pl-row:hover .ac-plan__spec::before,.sh-r63 .pl-row:focus-within .ac-plan__spec::before{opacity:1;transform:none}
.sh-r63 .pl-row .ac-plan__area{position:relative;min-width:56px;text-align:right;transition:opacity .25s}
.sh-r63 .pl-row .ac-plan__area::after{content:"";position:absolute;right:0;top:50%;width:20px;height:20px;transform:translate(6px,-50%);opacity:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' stroke='%23424040' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat;transition:opacity .3s,transform .35s var(--ease-fluid)}
.sh-r63 .pl-row:hover .ac-plan__area,.sh-r63 .pl-row:focus-within .ac-plan__area{color:transparent}
.sh-r63 .pl-row:hover .ac-plan__area::after,.sh-r63 .pl-row:focus-within .ac-plan__area::after{opacity:1;transform:translate(0,-50%)}
/* intro cards clickable + hover */
.sh-r63 .pl-info{cursor:pointer;transition:box-shadow .4s}
.sh-r63 .pl-info:hover{box-shadow:var(--shadow-lg)}
.sh-r63 .pl-info:hover .link-btn::after{transform:scaleX(1)}
.sh-r63 .pl-info:hover .link-btn .arrow{transform:translateX(4px)}
/* inline map button: the ring wraps field + button; the button never scales */
.sh-r63 .ac-map:focus-within{box-shadow:0 0 0 2px var(--amber);border-radius:999px}
.sh-r63 .ac-map:focus-within :is(input,button):focus-visible{outline:none;box-shadow:none}
.sh-r63 .ac-map .ac-map__go:hover,.sh-r63 .ac-map .ac-map__go:focus-visible{transform:none}
.sh-r63 .pl-ext .pl-ext__name{display:none}

/* ============================================================ §Plan detail (p24–28) */
.sh-r63.single-plan .page-main{padding-top:0}
.sh-r63 .pd--r63 .pd__hero{height:100vh;max-height:none;min-height:640px;background:var(--charcoal)}
.sh-r63 .pd--r63 .pd__media{position:absolute;inset:0;overflow:hidden}
.sh-r63 .pd--r63 .pd__shade{position:absolute;left:0;right:0;top:0;height:220px;z-index:1;background:linear-gradient(180deg,rgba(30,30,30,.55),rgba(30,30,30,0));pointer-events:none}
.sh-r63 .pd--r63 .pd__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;opacity:0;transition:opacity 1.2s var(--ease-soft);pointer-events:none}
.sh-r63 .pd--r63 .pd__video.is-live{opacity:1}
.sh-r63 .pd--r63 .pd__hero iframe.pd__video{width:177.78vh;height:100vh;min-width:100%;min-height:56.25vw;left:50%;top:50%;transform:translate(-50%,-50%);inset:auto}
.sh-r63 .pd--r63 .pd__name{color:var(--amber);font:italic 400 clamp(64px,7vw,101px)/1 var(--serif);margin:0;z-index:2}
.sh-r63 .pd--r63 .pd__name--travel{position:absolute;left:var(--global-padding);bottom:32px;will-change:transform}
.sh-r63 .pd--r63 .pd__name--static{position:relative;opacity:0;transition:opacity .2s}
.sh-r63 .pd--r63.is-landed .pd__name--static{opacity:1}
.sh-r63 .pd--r63.is-landed .pd__name--travel{opacity:0}
.sh-r63 .pd--r63 .pd__roofs{right:calc(var(--global-padding) + 72px);bottom:40px;gap:20px;align-items:flex-end;z-index:2}
.sh-r63 .pd--r63 .pd__roof{width:112px;height:72px;border:2px solid var(--white);border-radius:8px;background:var(--white);opacity:.92;transform:none;transition:transform .35s var(--ease-fluid),border-width .2s,opacity .2s;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.sh-r63 .pd--r63 .pd__roof img{height:100%}
.sh-r63 .pd--r63 .pd__roof:hover{opacity:1;transform:translateY(-2px)}
.sh-r63 .pd--r63 .pd__roof.is-on{border:3px solid var(--white);transform:scale(1.14);opacity:1}
.sh-r63 .pd--r63 .pd__body{position:relative;z-index:3;margin-top:-28px;border-radius:28px 28px 0 0;background:var(--off-white);padding:40px var(--global-padding) 96px}
.sh-r63 .pd--r63 .pd__top{max-width:calc(var(--maxw) - 96px);margin:0 auto 24px;display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.sh-r63 .pd--r63 .pd__actions{margin:0;padding-top:16px}
.sh-r63 .pd--r63 .pd__side{gap:0}
.sh-r63 .pd--r63 .pd__map,.sh-r63 .pd--r63 .pd__pricing{width:100%;justify-content:center;margin-top:8px}
.sh-r63 .pd--r63 .pd__map img{width:16px;height:16px}
.sh-r63 .pd--r63 .pd__viewer{background:transparent}
.sh-r63 .pd--r63 .pd__drawing{transition:transform .5s var(--ease-fluid)}
.sh-r63 .pd--r63 .pd__viewer.is-flipped .pd__drawing.is-current:not([data-pd-alt]){transform:scaleX(-1)}
.sh-r63 .pd--r63 .pd__vbtns{flex-direction:column;gap:8px}
.sh-r63 .pd--r63 .pd__flip{justify-content:center}
.sh-r63 .pd--r63 .pd__flip svg{width:14px;height:14px}
.sh-r63 .pd--r63 .pd__full{position:absolute;left:24px;bottom:24px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(66,64,64,.55);backdrop-filter:blur(6px);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm)}
.sh-r63 .pd--r63 .pd__full img{filter:brightness(0) invert(1);width:18px;height:18px}
.sh-r63 .pd--r63 .pd__dim:disabled{opacity:.45;cursor:not-allowed}
/* Try it at your place */
.sh-r63 .pd-try{position:relative;background:var(--sage);color:var(--off-white);overflow:hidden;min-height:520px;display:flex;align-items:center;justify-content:center;text-align:center;padding:96px var(--global-padding)}
.sh-r63 .pd-try__map{position:absolute;left:50%;top:50%;height:150%;width:auto;transform:translate(-50%,-50%);opacity:.55;filter:grayscale(1) contrast(1.15);mix-blend-mode:soft-light;pointer-events:none}
.sh-r63 .pd-try__inner{position:relative;max-width:560px;display:flex;flex-direction:column;align-items:center;gap:12px}
.sh-r63 .pd-try__title{margin:0;color:var(--off-white)}
.sh-r63 .pd-try__sub{margin:0 0 12px;opacity:.9}
.sh-r63 .pd-try__form{width:min(420px,100%);margin:0}
.sh-r63 .pd-try__field{display:flex;align-items:center;gap:10px;background:var(--white);border-radius:999px;padding:6px 6px 6px 16px;box-shadow:var(--shadow-sm)}
.sh-r63 .pd-try__field input{flex:1;border:0;background:none;font:400 14px/1.5 var(--sans);color:var(--charcoal);outline:none;min-width:0}
.sh-r63 .pd-try__go{width:36px;height:36px;border-radius:50%;border:0;background:var(--sage);color:var(--off-white);display:grid;place-items:center;cursor:pointer}
.sh-r63 .pd-try__go svg{width:18px;height:18px}
.sh-r63 .pd-try__field:focus-within{box-shadow:0 0 0 2px var(--amber)}
/* Video + download */
.sh-r63 .pd-vid{position:relative;min-height:70vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--charcoal)}
.sh-r63 .pd-vid__media{position:absolute;inset:0;overflow:hidden}
.sh-r63 .pd-vid__bg,.sh-r63 .pd-vid__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sh-r63 .pd-vid__wash{position:absolute;inset:0;background:rgba(40,38,38,.22)}
.sh-r63 .pd-vid__inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;padding:48px}
.sh-r63 .pd-vid__name{margin:0;font:italic 400 clamp(56px,6vw,84px)/1 var(--serif);color:var(--amber);text-shadow:0 2px 24px rgba(0,0,0,.25)}
/* Similar plans */
.sh-r63 .pd-sim{background:var(--warm-sand);padding:96px 0}
.sh-r63 .pd-sim__inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--global-padding)}
.sh-r63 .pd-sim__head{max-width:520px;display:flex;flex-direction:column;gap:8px;margin-bottom:40px}
.sh-r63 .pd-sim__title{margin:0}
.sh-r63 .pd-sim__sub{margin:0 0 8px;color:var(--mid-grey)}
.sh-r63 .pd-sim__track{gap:24px}
.sh-r63 .pd-sim__card{position:relative;flex:0 0 300px;width:300px;background:var(--white);border-radius:12px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.12);transition:transform .5s var(--ease-fluid),box-shadow .5s}
.sh-r63 .pd-sim__card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover,var(--shadow-lg))}
.sh-r63 .pd-sim__link{display:block;color:inherit;text-decoration:none}
.sh-r63 .pd-sim__photo{aspect-ratio:300/180;overflow:hidden}
.sh-r63 .pd-sim__photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s var(--ease-fluid)}
.sh-r63 .pd-sim__card:hover .pd-sim__photo img{transform:scale(1.04)}
.sh-r63 .pd-sim__draw{height:150px;display:flex;align-items:center;justify-content:center;padding:12px 20px}
.sh-r63 .pd-sim__draw img{max-width:100%;max-height:100%;object-fit:contain}
.sh-r63 .pd-sim__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:0 20px 18px}
.sh-r63 .pd-sim__name{margin:0 0 2px;font:500 16px/1.3 var(--sans);color:var(--charcoal)}
.sh-r63 .pd-sim__specs,.sh-r63 .pd-sim__area{margin:0;color:var(--mid-grey);white-space:nowrap}
.sh-r63 .pd-sim__save{right:12px;top:12px;background:var(--cream);color:var(--charcoal)}
.sh-r63 .pd-sim__save .gt__save-icon{background-image:url("inner/heart-dark.svg")}
.sh-r63 .pd-sim__save.is-saved .gt__save-icon{background-image:url("inner/heart-filled.svg")}
/* Testimonial */
.sh-r63 .pd-test{position:relative;min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--off-white);overflow:hidden;background:var(--charcoal)}
.sh-r63 .pd-test__media{position:absolute;inset:0;overflow:hidden}
.sh-r63 .pd-test__bg{width:100%;height:100%;object-fit:cover;display:block}
.sh-r63 .pd-test__wash{position:absolute;inset:0;background:rgba(30,30,30,.55)}
.sh-r63 .pd-test__inner{position:relative;max-width:720px;padding:48px;display:flex;flex-direction:column;align-items:center;gap:16px}
.sh-r63 .pd-test__quote{margin:0;color:var(--off-white)}
.sh-r63 .pd-test__who{margin:0 0 8px;opacity:.85}
.sh-r63 .pd-test__watch img{width:16px;height:16px}
.sh-r63 .pd-test__watch.is-disabled{opacity:.6;cursor:default}
@media (max-width:1023px){
  .sh-r63 .pd--r63 .pd__hero{height:72vh;min-height:480px}
  .sh-r63 .pd--r63 .pd__name{font-size:clamp(44px,12vw,72px)}
  .sh-r63 .pd--r63 .pd__roof{width:84px;height:54px}
  .sh-r63 .pd--r63 .pd__top{flex-direction:column}
  .sh-r63 .pd-sim__card{flex-basis:260px;width:260px}
}

/* Gallery / Awards / Plans heads (3.3, 18.1, 4.1): the copy sits centred between the nav and the grid. */
.sh-r63 .gal__head,.sh-r63 .aw__head{display:flex;flex-direction:column;justify-content:center}
@media (min-width:1024px){.sh-r63 .pl-intro{min-height:360px;display:flex;align-items:center;justify-content:center}.sh-r63 .pl-intro__text{padding-top:0;padding-bottom:0}}
.sh-r63 .gt__tag:empty{display:none}
/* focus ring fallback for text fields where :focus-visible is not matched */
.sh-r63 :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea):focus{outline:2px solid var(--amber);outline-offset:0}

/* ==================================================== §Inner pages (p29–63)
   Generic hooks first, then per-page geometry. */

/* Lightbox caption (Subdivide 6.5): tag on top, title under it, all lower-left. */
.sh-r63 .glb.sh-r63-glb .glb__info{display:flex;flex-direction:column;align-items:flex-start;gap:8px;left:0;right:auto;bottom:0;text-align:left}
.sh-r63 .glb.sh-r63-glb .glb__info .gt__tag{order:-1;display:inline-block}
.sh-r63 .glb.sh-r63-glb .glb__info .gt__text{align-items:flex-start;text-align:left}
.sh-r63 .glb.sh-r63-glb .glb__info .gt__sub:empty{display:none}
.sh-r63 .glb .sh-glb-video{max-width:min(1280px,100%);max-height:calc(100vh - 160px);width:min(1280px,100vw - 48px);aspect-ratio:16 / 9;background:#000;border-radius:16px}
.sh-r63 .glb .sh-glb-frame{width:min(1280px,100vw - 48px);aspect-ratio:16 / 9;max-height:calc(100vh - 160px);border:0;border-radius:16px;background:#000}

/* Horizontal scrollers (6.6, 7.2, 11.10, 24.10): the track starts on the
   container edge, runs to the browser edge, nothing is clipped — shadows get
   breathing room — and the rail is one colour everywhere (charcoal on cream,
   tan on the dark bands). */
.sh-r63 .hs__track,.sh-r63 .hs__track.sh-hs{padding-top:24px;padding-bottom:24px;margin-top:-24px;margin-bottom:-24px;scroll-snap-type:x proximity;scrollbar-width:none}
.sh-r63 .hs__track.sh-hs:hover{scrollbar-color:auto}
.sh-r63 .hs__track.sh-hs::-webkit-scrollbar,.sh-r63 .hs__track.sh-hs:hover::-webkit-scrollbar{display:none;height:0}
.sh-r63 .hs--flush .hs__track,.sh-r63 .hs .hs__track{padding-right:max(var(--global-padding),calc((100% - var(--maxw)) / 2 + var(--global-padding)))}
.sh-r63 .hs__rail{height:2px;background:rgba(66,64,64,.14)}
.sh-r63 .hs__grab,.sh-r63 .hs__grab--dark{background:var(--charcoal)}
.sh-r63 .hs__rail--sage,.sh-r63 .chh-other__rail,.sh-r63 .sd-stories .hs__rail,.sh-r63 .hl-more .hs__rail,.sh-r63 .pd-sim .hs__rail{background:rgba(247,243,234,.3)}
.sh-r63 .hs__rail--sage .hs__grab,.sh-r63 .chh-other__rail .hs__grab,.sh-r63 .hl-more .hs__grab,.sh-r63 .pd-sim .hs__grab{background:var(--tan)}
.sh-r63 .hs__grab{transition:transform .25s var(--ease-soft)}
/* 7.3 the ideas slides are not links: no hover lift / zoom */
.sh-r63 .ac-idea{cursor:default}
.sh-r63 .ac-idea:hover .ac-idea__media img{transform:none}
/* 7.4 more air between the heading and the strip (Figma 658:6525) */
@media (min-width:1024px){.sh-r63 .ac-ideas__head{padding-bottom:72px}}

/* Card headings (6.3, 14.2, 15.2): two-line wrap like the frame. */
.sh-r63 .kd-card__title{max-width:362px;margin-left:auto;margin-right:auto}
.sh-r63 .ic-card__title{max-width:12ch}

/* Editorial pages (9.1, 15.5, 20, 21.3): headings fade 0→100% with a short
   rise — nothing dips — and the photos carry a gentle vertical parallax. */
.js .sh-r63 .ed__h,.js .sh-r63 .ed__lead{opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease-lux),transform 1s var(--ease-lux)}
.js .sh-r63 .ed__h.is-in,.js .sh-r63 .ed__lead.is-in,.js .sh-r63 .sh-r63-seen .ed__h,.js .sh-r63 .sh-r63-seen .ed__lead{opacity:1;transform:none}
.sh-r63 .ed__photo,.sh-r63 .ti__photo,.sh-r63 .is__photo,.sh-r63 .sy-story__photo,.sh-r63 .sy-cols__photo,.sh-r63 .sy-check__photo,.sh-r63 .sy-photo__fig{overflow:hidden}
.sh-r63 .ed__photo img.sh-plx,.sh-r63 .ti__photo img.sh-plx,.sh-r63 .is__photo img.sh-plx,.sh-r63 .sy-story__photo img.sh-plx,.sh-r63 .sy-cols__photo img.sh-plx,.sh-r63 .sy-check__photo img.sh-plx,.sh-r63 .sy-photo__fig img.sh-plx,.sh-r63 .sy-apps__fig img.sh-plx{transform:translate3d(0,var(--plx,0px),0) scale(1.12);height:100%;object-fit:cover}

/* Story-page buttons (21.4): the button never hides on hover; the card hover
   simply puts it in its hover state (data-sh-card-link / .sh-card-hover). */
.sh-r63 .ic-card .link-btn,.sh-r63 .ic-card .btn{opacity:1!important;visibility:visible!important;transform:none!important;max-height:none!important}
.sh-r63 .sy-story .link-btn{opacity:1!important;transform:none!important}
.sh-r63 .sy-story{cursor:pointer}
.sh-r63 .sy-story:hover .link-btn::after,.sh-r63 .sy-story:focus-within .link-btn::after{transform:scaleX(1)}
.sh-r63 .sy-story:hover .link-btn .arrow{transform:translateX(4px)}
.sh-r63 .ic-card{cursor:default}
.sh-r63 .ic-card[data-sh-card-link]{cursor:pointer}
/* 22.3 applications block in the container with vertical padding */
.sh-r63 .sy-apps__inner{max-width:calc(var(--maxw) - 2 * var(--global-padding));padding-block:96px}
.sh-r63 .sy-apps__text{padding-block:0}
.sh-r63 .sy-apps__fig{margin:0}
/* 23.3 first card button alignment: every card's button sits on one baseline */
.sh-r63 .sy-cards .ic-card{display:flex;flex-direction:column}
.sh-r63 .sy-cards .ic-card .link-btn,.sh-r63 .sy-cards .ic-card .btn{margin-top:auto;align-self:flex-start}

/* Build Options page (8.1): the top two tiles split 50/50; the photo fills
   the tile; the white panel grows UP over it and the reveal clips at the tile
   edge; hover = the button's hover state; the whole tile is the link. */
@media (min-width:1024px){
  .sh-r63 .bo__row--lead{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .sh-r63 .bo__row--lead > .bo-card--large:first-child{flex:none}
  .sh-r63 .bo-card{position:relative;overflow:hidden;cursor:pointer}
  .sh-r63 .bo-card__media,.sh-r63 .bo-card--large .bo-card__media{position:absolute;inset:0;height:auto;min-height:0;flex:none}
  .sh-r63 .bo-card__media img{width:100%;height:100%;object-fit:cover;transform:none!important}
  .sh-r63 .bo-card__body{position:absolute;left:0;right:0;bottom:0;z-index:1;background:var(--white)}
  .sh-r63 .bo-card__reveal-in{overflow:hidden!important}
  .sh-r63 .bo-card:not(.bo-card--large){height:488px}
}
.sh-r63 .bo-card__tag{z-index:2}

/* Display Homes (16.x) */
.sh-r63 .dh-card{cursor:pointer}
.sh-r63 .dh-card:hover .link-btn::after,.sh-r63 .dh-card:focus-within .link-btn::after{transform:scaleX(1)}
.sh-r63 .dh-card:hover .link-btn .arrow{transform:translateX(4px)}
@media (min-width:1024px){
  .sh-r63 .dh-card{position:relative;overflow:hidden}
  .sh-r63 .dh-card__media{position:absolute;inset:0;aspect-ratio:auto}
  .sh-r63 .dh-card__media img{width:100%;height:100%;object-fit:cover;transform:none!important}
  .sh-r63 .dh-card__body{position:absolute;left:0;right:0;bottom:0;z-index:1;background:var(--white)}
  .sh-r63 .dh-card{min-height:540px}
}
/* 16.5 the coloured card's copy wraps like the frame; the map is toned down */
.sh-r63 .dd__why-text{max-width:520px}
.sh-r63 .dd__open p,.sh-r63 .dd__open-title{max-width:300px}
.sh-r63 .dd__map .bo-card__media img,.sh-r63 .chh__info .dd__map img,.sh-r63 .hld__map img,.sh-r63 .hld__map iframe{filter:saturate(.55) sepia(.18) brightness(1.02) contrast(.95)}
/* 16.6 looping, darkened background clip behind the walkthrough title */
.sh-r63 .vid{position:relative;overflow:hidden}
.sh-r63 .vid__loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none}
.sh-r63 .vid .vid__poster{z-index:0}
.sh-r63 .vid .vid__overlay{z-index:1;background:rgba(0,0,0,.42)}
.sh-r63 .vid .vid__text{z-index:2}
/* 16.7 gap under the Photo Gallery heading; natural-aspect tiles */
.sh-r63 .dd__gallery-head{margin-bottom:56px}
.sh-r63 .dd__gallery-head .gd__rule{margin-top:24px}
/* 16.8 darker Book-a-tour band */
.sh-r63 .book:not(.sf){background:var(--warm-sand)}
.sh-r63 .dd .book{background:#d9cfbf}
/* 12.7 one focus ring only on the form fields */
.sh-r63 .book__field :is(input,textarea,select):focus,.sh-r63 .book__field :is(input,textarea,select):focus-visible{outline:2px solid var(--amber);outline-offset:0;box-shadow:none;border-color:transparent}
.sh-r63 .book__field:focus-within{box-shadow:none}

/* House & Land list (10.x) */
.sh-r63 .hl__radio{cursor:pointer}
.sh-r63 .hl-intro__area{display:block;color:var(--amber);font-style:italic}
.sh-r63 .hlc{cursor:pointer}
.sh-r63 .hlc:hover .hlc__more::after,.sh-r63 .hlc:focus-within .hlc__more::after{transform:scaleX(1)}
.sh-r63 .hlc:hover .hlc__more .arrow{transform:translateX(4px)}

/* House & Land detail (11.x) */
@media (min-width:1024px){
  /* 11.2 the photo runs from under the GALLERY nav item to the right edge and is taller — the fold lands just after the address */
  .sh-r63 .hld__hero{position:relative;width:calc(100% - max(var(--global-padding), (100% - var(--maxw)) / 2) - 324px);max-width:none;height:min(640px,72vh);cursor:zoom-in}
  .sh-r63:not(.sh-r63-home) .hld__title.h1{font-size:calc(101px * var(--fl));line-height:1;letter-spacing:0}
  /* 11.5 the two-column text block is centred on the page */
  .sh-r63 .hld__cols{padding-left:0;justify-content:center;gap:64px}
}
/* 11.3 "N more photos" tile on the hero (display-home pattern) */
.sh-r63 .hld__more{position:absolute;right:24px;bottom:24px;display:flex;align-items:center;gap:12px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(247,243,234,.92);color:var(--charcoal);box-shadow:0 2px 8px rgba(0,0,0,.15);pointer-events:none}
.sh-r63 .hld__more img{width:44px;height:44px;border-radius:999px;object-fit:cover}
/* 11.6 glassy enlarge disc; the whole drawing is the trigger */
.sh-r63 .hld__plan--r63{cursor:zoom-in}
.sh-r63 .hld__zoom--glass{position:absolute;right:16px;top:16px;width:40px;height:40px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(66,64,64,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 1px 4px rgba(0,0,0,.2)}
.sh-r63 .hld__zoom--glass img{filter:brightness(0) invert(1);width:18px;height:18px}
/* 11.9 consultant cards: one fixed height, photo cover */
.sh-r63 .hld__side .person{height:132px;min-height:0}
.sh-r63 .hld__side .person__photo{height:100%}
.sh-r63 .hld__side .person__photo img{width:100%;height:100%;object-fit:cover;display:block}
.sh-r63 .hld__side .person__body{justify-content:center;overflow:hidden}

/* Pricing (15.4): the m² section sits inside the container, text on the page's left edge */
.sh-r63.page-template-pricing .is{max-width:var(--maxw);margin-inline:auto;border-radius:0}
.sh-r63.page-template-pricing .is__text{padding-left:var(--global-padding);max-width:none;flex:1 1 50%}
@media (min-width:1700px){.sh-r63.page-template-pricing .is__text{padding-left:var(--global-padding)}}

/* Already have plans (13.1): hero copy centred vertically under a clear nav */
/* Figma 655:5472: the nav sits on the page's own off-white with no band or shadow; the intro copy is centred in its band */
.sh-r63.sh-page-already-have-plans .nav,.sh-r63.sh-page-already-have-plans .nav.scrolled{background:transparent;box-shadow:none;border-bottom:0}
.sh-r63.sh-page-already-have-plans .nav::before,.sh-r63.sh-page-already-have-plans .nav::after{display:none}
.sh-r63.sh-page-already-have-plans .qp-intro{min-height:340px;align-items:center;padding-top:24px;padding-bottom:24px}
.sh-r63.sh-page-already-have-plans .qp-intro__text{padding-top:0;justify-content:center}

/* Knockdown & Rebuild / Our Process (12.3–12.5, 19.1): the travelling white
   circle. The grey dot is gone; the step circles stay as the parked shape
   behind each polaroid; the traveller is the one that rides the dotted line,
   half size between steps and full size when it lands; at the end it becomes
   the Celebration circle and the copy scales in as it grows. */
.sh-r63 .proc__dot{display:none!important}
.sh-r63 .proc__steps{position:relative}
.sh-r63 .sh-proc-traveller{position:absolute;left:0;top:0;width:var(--sz,322px);height:var(--sz,322px);margin:calc(var(--sz,322px) / -2) 0 0 calc(var(--sz,322px) / -2);border-radius:50%;background:var(--white);box-shadow:0 1px 4px rgba(0,0,0,.08);transform:translate(var(--x,0px),var(--y,0px)) scale(var(--s,.5));will-change:transform;pointer-events:none;z-index:0;transition:transform .08s linear}
.sh-r63 .proc-step__media{z-index:1}
.sh-r63 .proc-step__circle{opacity:0!important;transition:opacity .4s var(--ease-fade)}
.sh-r63 .proc-step__circle.sh-passed{opacity:1!important} /* the circle stays parked behind each step once the traveller has moved on */
.sh-r63 .proc__final-circle{opacity:0!important}
.sh-r63 .proc__final{overflow:visible}
.js .sh-r63 .proc__final-text{transform:scale(var(--fs,.6));opacity:var(--fo,0);transition:transform .35s var(--ease-lux),opacity .3s var(--ease-fade);transform-origin:50% 50%}
.js .sh-r63 .proc__final.is-in .proc__final-text{opacity:var(--fo,0)}
.sh-r63 .sh-proc-final-circle{position:absolute;border-radius:50%;background:var(--white);pointer-events:none;z-index:0;transform:scale(var(--s,.5));transition:transform .12s linear}
.sh-r63 .proc__final-text{position:relative;z-index:1}
/* 12.10 the FAQ heading stays readable — the picture shifts right */
.sh-r63 .faq__head{position:relative;z-index:2}
@media (min-width:1024px){.sh-r63:not(.sh-r63-home) .faq__bg img{object-position:80% bottom;transform:translateX(6%);width:106%}}

/* Subdivide & Build (6.x) */
.sh-r63 .sd-story__set{display:none}
.sh-r63 .sd-vid__play{cursor:pointer}
/* 6.8 scrollbars: one palette (see .hs__rail above) */

/* Charity Homes (24.x) */
.sh-r63 .chc--nolink .chc__media,.sh-r63 .chc--nolink .chc__title{cursor:default}
.sh-r63 .chc[data-sh-card-link]{cursor:pointer}
.sh-r63 .chc[data-sh-card-link]:hover .chc__more::after{transform:scaleX(1)}
.sh-r63 .chc[data-sh-card-link]:hover .chc__more .arrow{transform:translateX(4px)}
/* 24.1 / 21.2 the full-image hero is taller: the fold lands halfway through the next heading */
@media (min-width:1024px){
  .sh-r63.page-template-charity-homes .sy-hero--decor,.sh-r63.sh-page-broader-outcomes .sy-hero--decor{min-height:90vh}
}
/* 24.2 the Wanaka card: no extra padding when there's no body copy */
.sh-r63 .chc__body:has(> .chc__title:last-child){padding-bottom:24px}
.sh-r63 .chc__body .chc__text:empty{display:none}
/* 24.6 white ground under the partner logo scroller */
.sh-r63 .chh-logos{background:var(--white)}
/* 24.7 text measure on the detail */
.sh-r63 .chh__info .dd__why-text{max-width:520px}
.sh-r63 .chh-sup__head .kd__title{max-width:14ch;margin-inline:auto}

/* Our History (25): every panel fills the browser height; the copy fades up
   each time its panel scrolls in; the polaroids and prints float on a soft
   parallax; the dot nav inverts on the light panels. */
@media (min-width:1024px){
  .sh-r63.sh-r63-history .hist__panel{height:max(calc(837px * var(--hist-s)),100vh)}
  .sh-r63.sh-r63-history .hist__stage{top:50%;transform:translate(-50%,-50%) scale(var(--hist-s));transform-origin:50% 50%}
  .sh-r63.sh-r63-history .hist__bg{top:calc((837px - max(837px, 100vh / var(--hist-s))) / 2);height:max(837px, 100vh / var(--hist-s))}
  .js.sh-r63-ready .sh-r63-history .hist__text > *{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease-lux),transform 1s var(--ease-lux)}
  .js.sh-r63-ready .sh-r63-history .hist__panel.is-in .hist__text > *{opacity:1;transform:none}
  .js.sh-r63-ready .sh-r63-history .hist__panel.is-in .hist__text > :nth-child(2){transition-delay:.12s}
  .js.sh-r63-ready .sh-r63-history .hist__panel.is-in .hist__text > :nth-child(3){transition-delay:.24s}
  .sh-r63-history .hist__polaroid,.sh-r63-history .hist__shot,.sh-r63-history .hist__stock,.sh-r63-history .hist__card,.sh-r63-history .hist__note{transition:translate .12s linear;translate:0 calc(var(--hp,0) * 1px)}
  .sh-r63-history .hist__nav.sh-inv .hist__dot{background:var(--charcoal)}
  .sh-r63-history .hist__nav.sh-inv .hist__dot.is-on{background:var(--amber)}
  .sh-r63-history .hist__nav.sh-inv::before{background:rgba(66,64,64,.25)}
  .sh-r63-history .hist__nav{transition:opacity .3s}
}

/* Broader Outcomes (21.1): the hero photo is never blurred in */
.sh-r63 .sy-hero__bg{filter:none!important}

/* ================================================ §Local team pages (17) — Figma location-desktop 712:7681 */
.sh-r63 .rg2-hero{position:relative;display:flex;align-items:center;min-height:min(820px,100vh);background:var(--charcoal);color:var(--cream);overflow:hidden}
.sh-r63 .rg2-hero__photo{position:absolute;left:0;top:0;bottom:0;width:50%;overflow:hidden}
.sh-r63 .rg2-hero__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.sh-r63 .rg2-hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(66,64,64,0) 70%,var(--charcoal) 100%)}
.sh-r63 .rg2-hero__text{position:relative;z-index:1;margin-left:auto;width:50%;padding:calc(var(--nav-h,120px) + 48px) var(--global-padding) 96px 64px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.sh-r63 .rg2-hero__eyebrow{color:var(--amber);margin:0}
.sh-r63 .rg2-hero__title{margin:0;font:400 calc(59px * var(--fl,1))/1.05 var(--serif);color:var(--cream);letter-spacing:-.5px;max-width:12ch}
.sh-r63 .rg2-hero__quote{max-width:520px;color:rgba(247,243,234,.88)}
.sh-r63 .rg2-hero__quote p{margin:0 0 12px}
.sh-r63 .rg2-hero__sig{height:56px;width:auto;max-width:320px;display:block}
.sh-r63 .rg2-hero__sig--script{margin:0 0 -4px;font:400 40px/1 "Signerica Fat","Dancing Script",cursive;color:var(--amber);white-space:nowrap}
.sh-r63 .rg2-hero__who{margin:0;display:flex;flex-direction:column;gap:2px;font:400 14px/1.5 var(--sans);color:rgba(247,243,234,.8)}
.sh-r63 .rg2-hero__who strong{font-weight:600;color:var(--cream)}
.sh-r63 .rg2-hero__cta{margin-top:8px}
@media (max-width:1023px){
  .sh-r63 .rg2-hero{flex-direction:column;align-items:stretch;min-height:0}
  .sh-r63 .rg2-hero__photo{position:relative;width:100%;aspect-ratio:4 / 3}
  .sh-r63 .rg2-hero__photo::after{background:linear-gradient(180deg,rgba(66,64,64,0) 70%,var(--charcoal) 100%)}
  .sh-r63 .rg2-hero__text{width:100%;padding:32px 24px 56px}
  .sh-r63 .rg2-hero__title{font-size:40px}
}
/* Contact band: the display home card at the right (Figma card with OPEN TO VIEW) */
.sh-r63 .rg-contact__inner{align-items:stretch}
.sh-r63 .rg-contact__form{flex:1 1 auto}
.sh-r63 .rg-contact__home.dh-card{flex:0 0 312px;width:312px;position:relative;min-height:0;background:var(--white);border-radius:16px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.15);display:flex;flex-direction:column}
.sh-r63 .rg-contact__home .dh-card__media{position:relative;aspect-ratio:312 / 200;inset:auto}
.sh-r63 .rg-contact__home .dh-card__body{position:relative;padding:24px}
.sh-r63 .dh-card__tag--open{position:absolute;left:16px;top:16px;z-index:2;background:var(--amber);color:var(--charcoal);border-radius:4px;padding:5px 10px}
.sh-r63 .dh-card--popup .dh-card__tag--open{background:var(--amber)}
@media (max-width:1023px){.sh-r63 .rg-contact__inner{flex-wrap:wrap}.sh-r63 .rg-contact__home.dh-card{flex-basis:100%;width:100%}}
/* Your local team */
.sh-r63 .rg2-team{position:relative;background:var(--cream);padding:128px var(--global-padding);overflow:hidden}
.sh-r63 .rg2-team__texture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.1;pointer-events:none}
.sh-r63 .rg2-team__inner{position:relative;max-width:var(--maxw);margin:0 auto;display:flex;gap:96px;align-items:flex-start}
.sh-r63 .rg2-team__text{flex:0 1 480px;position:sticky;top:140px;display:flex;flex-direction:column;gap:20px}
.sh-r63 .rg2-team__body{color:var(--charcoal);max-height:9.2em;overflow:hidden;position:relative;transition:max-height .5s var(--ease-lux)}
.sh-r63 .rg2-team__body::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3em;background:linear-gradient(180deg,rgba(247,243,234,0),var(--cream))}
.sh-r63 .rg2-team__body.is-open{max-height:none}
.sh-r63 .rg2-team__body.is-open::after{display:none}
.sh-r63 .rg2-team__more[aria-expanded="true"] .arrow{transform:rotate(180deg)}
.sh-r63 .rg2-team__grid{flex:0 0 560px;width:560px;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.sh-r63 .rg2-person{background:var(--white);border-radius:4px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.sh-r63 .rg2-person--lead{grid-column:1 / -1}
.sh-r63 .rg2-person__photo{position:relative;aspect-ratio:1 / 1;background:var(--warm-sand);overflow:hidden}
.sh-r63 .rg2-person--lead .rg2-person__photo{aspect-ratio:560 / 400}
.sh-r63 .rg2-person__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
.sh-r63 .rg2-person__bio{position:absolute;left:16px;top:16px;opacity:0;transition:opacity .3s}
.sh-r63 .rg2-person:hover .rg2-person__bio,.sh-r63 .rg2-person:focus-within .rg2-person__bio{opacity:1}
.sh-r63 .rg2-person__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px}
.sh-r63 .rg2-person__name{margin:0;font:500 16px/1.3 var(--sans);color:var(--charcoal)}
.sh-r63 .rg2-person__role{margin:0;font:400 13px/1.5 var(--sans);color:var(--mid-grey)}
.sh-r63 .rg2-person__links{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:6px}
.sh-r63 .rg2-person__links .link-btn{font-size:11px}
@media (max-width:1023px){.sh-r63 .rg2-team{padding:64px 24px}.sh-r63 .rg2-team__inner{flex-direction:column;gap:40px}.sh-r63 .rg2-team__text{position:static;flex-basis:auto}.sh-r63 .rg2-team__grid{width:100%;flex-basis:auto}}
/* Display Homes band (slate) */
.sh-r63 .rg2-homes{background:var(--slate-green);padding:96px 0 72px;color:var(--cream)}
.sh-r63 .rg2-homes__inner{max-width:none;display:flex;flex-direction:column;gap:40px}
.sh-r63 .rg2-homes__inner > .kd__head{padding:0 max(var(--global-padding),calc((100% - var(--maxw)) / 2 + var(--global-padding)))}
.sh-r63 .rg2-homes .dh-card{flex:0 0 400px;width:400px;position:relative;min-height:0;background:var(--white);border-radius:16px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.15);display:flex;flex-direction:column;scroll-snap-align:start}
.sh-r63 .rg2-homes .dh-card__media{position:relative;inset:auto;aspect-ratio:400 / 240}
.sh-r63 .rg2-homes .dh-card__body{position:relative;padding:24px 24px 28px}
.sh-r63 .rg2-homes .hs__arrow--light img{filter:brightness(0) invert(1)}
.sh-r63 .rg2-homes .hs__track,.sh-r63 .rg2-homes .hs__bar{padding-left:max(var(--global-padding),calc((100% - var(--maxw)) / 2 + var(--global-padding)))!important}
@media (max-width:767px){.sh-r63 .rg2-homes .dh-card{flex-basis:min(340px,84vw);width:min(340px,84vw)}}
/* House & Land on the region page: cream variant */
.sh-r63 .rg2-packages{background:var(--cream)}
.sh-r63 .rg2-packages .hl-more__texture{opacity:.2;mix-blend-mode:multiply}
.sh-r63 .rg2-packages .kd__eyebrow,.sh-r63 .rg2-packages .kd__title{color:var(--charcoal)}
.sh-r63 .rg2-packages .btn--outline{border:1px solid var(--charcoal);color:var(--charcoal);background:transparent}
/* Reviews band */
.sh-r63 .rg2-reviews{position:relative;background:#EDE5D2;padding:96px var(--global-padding);overflow:hidden}
.sh-r63 .rg2-reviews__script{position:absolute;left:var(--global-padding);bottom:-.18em;margin:0;font:italic 400 clamp(72px,9vw,128px)/1 var(--serif);color:var(--amber);white-space:nowrap;pointer-events:none;opacity:.95}
.sh-r63 .rg2-reviews__inner{position:relative;max-width:var(--maxw);margin:0 auto;display:flex;gap:96px;align-items:center}
.sh-r63 .rg2-reviews__text{flex:0 0 400px;display:flex;flex-direction:column;gap:20px}
.sh-r63 .rg2-reviews__title{margin:0;color:var(--charcoal)}
.sh-r63 .rg2-reviews__body{margin:0;color:var(--charcoal)}
.sh-r63 .rg2-reviews__grid{flex:1 1 0;min-width:0;columns:2;column-gap:24px}
.sh-r63 .rg2-review{break-inside:avoid;margin:0 0 24px;background:var(--white);border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.08);padding:16px 20px 18px;display:flex;flex-direction:column;gap:8px}
.sh-r63 .rg2-review__head{display:flex;align-items:center;gap:12px}
.sh-r63 .rg2-review__avatar{flex:none;width:36px;height:36px;border-radius:50%;background:var(--slate-green);color:var(--cream);display:flex;align-items:center;justify-content:center;font:600 14px/1 var(--sans)}
.sh-r63 .rg2-review__name{margin:0;font:500 14px/1.3 var(--sans);color:var(--charcoal)}
.sh-r63 .rg2-review__via{margin:0;color:var(--mid-grey)}
.sh-r63 .rg2-review__stars{display:inline-flex;gap:2px;color:var(--amber)}
.sh-r63 .rg2-review__stars svg{width:14px;height:14px}
.sh-r63 .rg2-review__meta{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sh-r63 .rg2-review__date{color:var(--mid-grey)}
.sh-r63 .rg2-review__quote{margin:0;color:var(--charcoal);font-size:14px;line-height:1.55}
.sh-r63 .rg2-review__quote[data-sh-clamp]{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
.sh-r63 .rg2-review__quote[data-sh-clamp].is-open{display:block}
.sh-r63 .rg2-review--photo{padding:0;overflow:hidden}
.sh-r63 .rg2-review--photo .rg2-review__img{aspect-ratio:3 / 2;overflow:hidden}
.sh-r63 .rg2-review--photo .rg2-review__img img{width:100%;height:100%;object-fit:cover;display:block}
.sh-r63 .rg2-review--photo .rg2-review__meta,.sh-r63 .rg2-review--photo .rg2-review__quote,.sh-r63 .rg2-review--photo .rg2-review__name{padding:0 20px}
.sh-r63 .rg2-review--photo .rg2-review__meta{padding-top:14px}
.sh-r63 .rg2-review--photo .rg2-review__name{padding-bottom:18px}
@media (max-width:1023px){.sh-r63 .rg2-reviews{padding:64px 24px 120px}.sh-r63 .rg2-reviews__inner{flex-direction:column;gap:40px;align-items:stretch}.sh-r63 .rg2-reviews__grid{columns:1}.sh-r63 .rg2-reviews__script{font-size:56px}}
/* Some of our recent work */
.sh-r63 .rg2-work{background:var(--charcoal);padding:96px var(--global-padding)}
.sh-r63 .rg2-work__inner{max-width:var(--maxw);margin:0 auto;display:flex;flex-direction:column;gap:48px}
.sh-r63 .rg2-work__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.sh-r63 .rg2-work .rg-gtile{position:relative;margin:0;border-radius:16px;overflow:hidden;cursor:zoom-in}
.sh-r63 .rg2-work .rg-gtile .gt__media img{width:100%;height:auto;display:block}
@media (max-width:767px){.sh-r63 .rg2-work__grid{grid-template-columns:1fr}}
