/* ROUND 74 (client feedback document, 29 Sep 2026). Loaded after home.css, inner.css and r63.css on every page.
   Sections: 1 homepage desktop · 2 shared (nav, region modal, lead modal, footer) · 3 homepage mobile + mobile menu ·
   4 Plans · 5 Awards · 6 Subdivide & Build · 7 Accessible Living · 8 Knockdown & Rebuild · 9 misc pages. */

/* ============================================================ 1. homepage desktop */
@media (min-width:1024px){
  /* Chat icon: 14px above RECOGNITION as in Figma (was 40px). Size, style, behaviour unchanged. */
  .hero__livechat{bottom:114px}
  /* Build options progress row: the track + arrows span the full container width (48px margins both sides). */
  .build__nav{margin-right:0}
  .build__trackrow{max-width:none;margin-left:48px;margin-right:48px}
  /* Our Story: the round 74 fixed 800px height, 60/40 split, 1.3x waist crop and moved copy were all reverted
     (AJ, 29 Sep) so the section sizes itself exactly as on staging (home.css: at least 800px, taller when the
     photo needs it, so the whole portrait shows). */
}
/* Find your local office cards: faces stay in frame (people are photographed in the upper part of the picture). */
.office__card img{object-position:50% 6%}
/* Phone icon matches the Figma glyph size; the email icon is unchanged. */
.office__contact .btn:nth-child(2) svg{width:18px;height:18px}
/* Build option card titles are set on two lines in the CMS (Custom<br> Design & Build): the break shows on the
   homepage cards only; the Build Options page cards read the title on one line as before. */
.build__card-title br{display:block}
.bo-card__title br{display:none}

/* Right-side menu (Contact and the other mega panels): no visible scrollbar; the panel still scrolls by wheel and touch. */
.nav__panel{scrollbar-width:none;-ms-overflow-style:none}
.nav__panel::-webkit-scrollbar{width:0;height:0;display:none}

/* ============================================================ 2. shared */
/* Top navigation never wraps a menu item; below 1200 the bar tightens instead, below 1024 it is the burger. */
.nav__links li,.nav__links a{white-space:nowrap}
@media (min-width:1024px) and (max-width:1200px){
  .nav__links{gap:14px}
  .nav__actions{gap:10px}
}
@media (min-width:1024px) and (max-width:1120px){
  .nav__links a{font-size:11.5px;letter-spacing:1.15px}
  .nav__inner{padding-left:24px;padding-right:24px}
  .nav__contact{padding-left:18px;padding-right:18px}
}

/* Region popup: secondary text right-aligned (both lines when it wraps); MEET THE TEAM link on every row. */
.sh-region__row{display:flex;align-items:stretch;gap:8px}
.sh-region__row .sh-region__opt{flex:1 1 auto;min-width:0}
.sh-region__meta{margin-left:auto;text-align:right;flex:0 1 auto;max-width:42%}
.sh-r74 .sh-region__card{width:min(620px,100%)}
.sh-region__team{flex:none;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border-radius:8px;background:transparent;border:1px solid rgba(99,116,104,.45);color:var(--sage);font:600 10px/1.2 var(--sans);letter-spacing:1.3px;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:background .2s,color .2s,transform .2s}
.sh-region__team .arrow{width:14px;height:14px}
.sh-region__team:hover,.sh-region__team:focus-visible{background:var(--sage);color:var(--white);transform:translateX(2px)}
@media (max-width:640px){
  .sh-region__row{flex-wrap:wrap}
  .sh-region__team{width:100%;justify-content:center;padding:10px 14px}
}

/* Lead modal (Site check, Get in touch, guide downloads): the form styles the inner pages get from inner.css,
   available on every page including the homepage, and the form fills the card. */
.sh-lead__form.book__form{flex:none;width:100%;min-width:0;background:transparent;border-radius:0;padding:0;display:flex;flex-direction:column;gap:16px;position:relative}
.sh-lead__form .book__frow{display:flex;gap:16px;width:100%}
.sh-lead__form .book__field{flex:1 1 0;min-width:0;display:block}
.sh-lead__form .book__field input,.sh-lead__form .book__field textarea,.sh-lead__form .book__field select{width:100%;border:0;border-radius:4px;background:var(--white);padding:12px 14px;font:400 15px/1.5 var(--sans);color:var(--charcoal);box-shadow:0 1px 2px rgba(0,0,0,.15);outline:none;resize:vertical;appearance:none;-webkit-appearance:none}
.sh-lead__form .book__field textarea{min-height:101px;display:block}
.sh-lead__form .book__field input::placeholder,.sh-lead__form .book__field textarea::placeholder{color:var(--mid-grey)}
.sh-lead__form .book__field input:focus-visible,.sh-lead__form .book__field textarea:focus-visible,.sh-lead__form .book__field select:focus-visible{box-shadow:0 1px 2px rgba(0,0,0,.15),0 0 0 2px var(--amber)}
.sh-lead__form .book__field--icon{position:relative;display:flex;align-items:center;gap:4px;background:var(--white);border-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.15);padding:0 0 0 12px}
.sh-lead__form .book__field--icon img{flex:none;width:24px;height:24px;display:block}
.sh-lead__form .book__field--icon input{box-shadow:none;padding-left:8px;background:transparent}
.sh-lead__form .book__field--icon:focus-within{box-shadow:0 1px 2px rgba(0,0,0,.15),0 0 0 2px var(--amber)}
.sh-lead__form .book__field--select{position:relative}
.sh-lead__form .book__field--select::after{content:"";position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--charcoal);border-bottom:1.5px solid var(--charcoal);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.sh-lead__form .book__consent{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;font:400 14px/1.5 var(--sans);color:var(--charcoal)}
.sh-lead__form .book__consent input{position:absolute;opacity:0;width:0;height:0}
.sh-lead__form .book__check{flex:0 0 20px;width:20px;height:20px;border-radius:5px;background:var(--white) url("inner/check-off.svg") center/20px no-repeat;box-shadow:0 1px 2px rgba(0,0,0,.15)}
.sh-lead__form .book__consent input:checked~.book__check{background-image:url("inner/check-on-small.svg")}
.sh-lead__form .book__consent input:focus-visible~.book__check{outline:2px solid var(--amber);outline-offset:2px}
.sh-lead__form .book__submit{width:100%;justify-content:center}
.sh-lead__form .book__note{margin:0;text-align:center;font:500 13px/1.5 var(--sans);color:var(--mid-grey)}
.sh-lead__form .book__note a{color:inherit}
.sh-lead__form .sh-ferr{margin:-8px 0 0;font:500 12px/1.4 var(--sans);color:#b5462b}
@media (max-width:600px){.sh-lead__form .book__frow{flex-direction:column}}

/* Footer contact row: GET IN TOUCH at Figma size; EMAIL starts on the Plans column; CALL US follows.
   Email and phone links: no underline at rest, underline on hover (the existing hover style). */
@media (min-width:1024px){
  .footer__contact{display:grid;grid-template-columns:calc((100% - 128px) / 5) auto auto;gap:0 32px;justify-content:start;align-items:center}
  .footer__contact-item:nth-of-type(2){margin-left:16px}
  .footer__contact .btn{justify-self:start;min-width:210px;min-height:42px;padding:0 30px;justify-content:center;font-size:12px;letter-spacing:1.6px}
}
.sh-r63.sh-r74 .footer__contact-item a{border-bottom-color:transparent;text-decoration:none}
.sh-r63.sh-r74 .footer__contact-item a:hover,.sh-r63.sh-r74 .footer__contact-item a:focus-visible{border-bottom-color:currentColor}
/* Newsletter: the validation message sits in the flow under the field instead of over whatever comes next. */
.sh-r63 .footer__news-row{flex-wrap:wrap}
.sh-r63 .footer__news-row .sh-ferr{position:static;flex:0 0 100%;margin:8px 0 0}

/* ============================================================ 3. homepage mobile + mobile menu */
@media (max-width:1023px){
  /* No horizontal overflow: the off-canvas menu screens can no longer widen the page. */
  html,body{overflow-x:clip}
  .mnav{overflow:hidden}
  /* Mobile menu root: Contact and Login rows removed (Figma Mobile Nav). */
  .mnav__screen[data-screen="root"] > .mnav__list > .mnav__row--sub{display:none}
  /* Build Options screen: RESOURCES tag colour, separator colour, Major Subdivisions row removed, more room under BACK. */
  .mnav__screen[data-screen="build-options"] .mnav__tag span{background:#637468;color:var(--white)}
  .mnav__screen[data-screen="build-options"] .mnav__divider{background:rgba(99,116,104,.3)}
  .mnav__screen[data-screen="build-options"] li:has(> a[href*="major-subdivisions"]){display:none}
  .mnav__screen .mnav__tag--crumb{margin-top:36px}
  /* About Us screen: no page heading, no region line. */
  .mnav__screen[data-screen="about-us"] .mnav__row--heading,.mnav__screen[data-screen="about-us"] .mnav__row--region{display:none}
}
@media (max-width:768px){
  /* Hero: the top of the photo stays visible (Figma Home • Mobile). Height and width unchanged. */
  .hero__bg img,.hero__video{object-position:center top}
  /* Footer: room between the newsletter and the social icons; smaller legal line and links on one row. */
  .footer__midrow{gap:32px}
  .footer__social{margin-top:8px}
  .footer__bottom p{font-size:12px}
  .footer__bottom .links{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px}
  .footer__bottom .links .left{gap:12px}
  .footer__bottom .links a{font-size:12px;white-space:nowrap}
}

/* ============================================================ 4. Plans */
/* Left filter column: no scrollbars. The sticky column no longer scrolls inside itself; when it is taller than
   the window r74.js drops the stickiness so every filter and RESET FILTERS stay reachable. */
@media (min-width:1024px){
  .sh-r67.sh-r74 .pl__filters{max-height:none;overflow:visible;scrollbar-width:none}
  .sh-r74 .pl__filters.is-tall{position:static}
}
.sh-r74 .pl__filters::-webkit-scrollbar{display:none}
/* Home size slider: plain green dots, no white ring (Figma). */
.sh-r74 .pl__size-track input::-webkit-slider-thumb{border:0;box-shadow:none}
.sh-r74 .pl__size-track input::-moz-range-thumb{border:0;box-shadow:none}
/* Separator under MORE FILTERS (2px warm sand, 12px gap): it was in the markup but clipped by the column's inner scroll. */
.sh-r74 .pl__rule{display:block}
/* Plan name headings: room for the descenders of g and y (the hero name and the section heading). */
.sh-r63.sh-r74 .pd--r63 .pd__name{line-height:1.12;padding-bottom:.06em}
.sh-r63.sh-r74 .pd--r63 .pd__name--travel{bottom:44px}
/* The name slides down out of the hero onto the section heading instead of being clipped at the hero's edge. */
.sh-r63.sh-r74 .pd--r63 .pd__hero{overflow:visible}
.sh-r63.sh-r74 .pd--r63 .pd__name--travel{z-index:4}
/* Mobile and tablet plan cards: photo, drawing and specs stacked at full height (the list-view card's absolute
   link was collapsing the card to its specs row); tighter spacing between cards. */
@media (max-width:1023px){
  .sh-r74 .pl-row .ac-plan__link{position:static;flex-direction:column;flex:none}
  .sh-r74 .pl-row{min-height:0;height:auto}
  .sh-r74 .pl-row .ac-plan__photo{aspect-ratio:16 / 10;flex:none;width:100%}
  .sh-r74 .pl-row .ac-plan__photo img{object-position:50% 40%}
  .sh-r74 .pl-row .ac-plan__drawing{padding:20px 16px 8px;min-height:0}
  .sh-r74 .pl-row .ac-plan__drawing img{max-width:100%;max-height:220px}
  .sh-r74 .pl-row .ac-plan__specs{position:static;order:3;padding:12px 20px 20px}
  .sh-r74 .pl__list,.sh-r74 .pl__grid{gap:16px}
}

/* ============================================================ 5. Award Winning Homes */
/* Title block: vertically centred in a shorter band (the r63 band was 120px + 38vh with a 120px top pad). */
.sh-r63.sh-r74 .gal--featured .gal__head{min-height:0;padding:72px 48px 40px;justify-content:center}
@media (max-width:768px){.sh-r63.sh-r74 .gal--featured .gal__head{padding:48px 24px 32px}}
/* Award tiles show the whole photograph: the tile takes the photo's own proportion (set server-side from the
   file, see inc/round74.php) so nothing is cropped and the masonry stays intact. */
.sh-r74 .gal--featured .gt--photo .gt__media img{object-fit:cover}
/* Lightbox close: a fixed 44px round button at the top right of the screen, clear of the image at every size. */
.sh-r74 .glb__close{position:fixed;top:24px;right:24px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);color:var(--off-white);display:grid;place-items:center;transition:background .2s,transform .2s;z-index:3}
.sh-r74 .glb__close:hover{background:rgba(255,255,255,.28);transform:scale(1.06)}
.sh-r74 .glb__close svg{width:20px;height:20px}
/* Show more: the site's standard outline button (same as CONTACT / SEE ALL PHOTOS), centred under the grid. */
.sh-r74 .gal__showmore{margin:40px auto 8px;min-width:0;padding:0 28px;height:46px;border-radius:999px;border:1px solid var(--charcoal);background:transparent;color:var(--charcoal);font:600 12px/1 var(--sans);letter-spacing:1.6px;text-transform:uppercase;text-align:center;cursor:pointer;transition:background .25s,color .25s,box-shadow .25s}
.sh-r74 .gal__showmore:hover,.sh-r74 .gal__showmore:focus-visible{background:var(--charcoal);color:var(--cream);box-shadow:0 3px 10px rgba(0,0,0,.12)}

/* ============================================================ 6. Subdivide & Build */
/* Proven Results cards: the text starts at the top of the card as in Figma 1216:38209 (it was pushed to the
   bottom, leaving the empty band above the eyebrow). */
.sh-r74 .sd-story__body{justify-content:flex-start;padding:40px 32px 32px}
@media (min-width:1024px){.sh-r74 .sd-story__media{min-height:380px}}
/* Load More Stories: the button's display rule was beating [hidden], so it stayed on screen after the last story. */
.sh-r74 .sd-stories__more[hidden]{display:none!important}
/* BROWSE ALL PLANS: the same width and side padding as the section's other pill buttons (236px). */
.sh-r74 .sd-plans__head .btn{min-width:236px;padding-left:28px;padding-right:28px;flex:none}
@media (max-width:1023px){.sh-r74 .sd-plans__head .btn{min-width:0}}

/* ============================================================ 7. Accessible Living */
@media (min-width:1024px){
  /* Hero circle (Figma 658:6330): 64px inset, 24px gaps, the heading at 48 / 1.17 and the copy at 16 / 1.5,
     both using the full 422px text width (the r66 11ch / 30ch caps made them narrow). */
  .sh-r66.sh-r74.sh-page-accessible-living .ac-hero__circle{padding:0 64px;gap:24px}
  .sh-r66.sh-r74.sh-page-accessible-living .ac-hero__circle .kd__head{gap:4px}
  .sh-r66.sh-r74.sh-page-accessible-living .ac-hero__circle .kd__title{font-size:48px;line-height:1.17;max-width:none;width:100%}
  .sh-r66.sh-r74.sh-page-accessible-living .ac-hero__circle p:not(.kd__eyebrow){font-size:16px;line-height:1.5;max-width:none;width:100%}
  /* Design ideas: more air between the heading and the cards. */
  .sh-r66.sh-r74.sh-page-accessible-living .ac-ideas__head{padding-bottom:48px}
}
@media (max-width:1023px){.sh-r74.sh-page-accessible-living .ac-ideas__head{padding-bottom:32px}}
/* Slider bar: shown only when there is more to see than fits; the arrows then step one card. */
.sh-r74 .ac-ideas .hs.is-nooverflow .hs__bar{visibility:hidden}
.sh-r74 .hs__arrow[disabled]{opacity:.35;cursor:default}

/* ============================================================ 8. Knockdown & Rebuild */
@media (min-width:1024px){
  /* BEFORE label lines up with the left edge of the old-house photo inside the polaroid. */
  .sh-r74 .kd__cap--before{margin-left:7.85%}
  /* Step pictures: the visible picture plus its shadow centred in the white circle (offsets measured
     from each PNG's visible area; the circle, image size and proportions are unchanged). */
  .sh-r74 .proc-step:has(img[src*="knockdown/step-1"]) .proc-step__img{left:3.81%;top:-6.74%}
  .sh-r74 .proc-step:has(img[src*="knockdown/step-2"]) .proc-step__img{left:-.75%;top:-7.1%}
  .sh-r74 .proc-step:has(img[src*="knockdown/step-3"]) .proc-step__img{left:-4.82%;top:-2.59%}
  .sh-r74 .proc-step:has(img[src*="knockdown/step-4"]) .proc-step__img{left:-2.76%;top:-7.37%}
}

/* ============================================================ 9. Contact, Our Promise, Partner with Sentinel */
/* Contact: the closest team's card still leads the grid but without the green outline. */
.sh-r63.sh-r74 .ct-card.is-closest{outline:none}
/* Our Promise: the guarantee card title sits on two lines (no 12ch cap on this page's cards). */
.sh-r63.sh-r74.sh-page-our-promise .sy-cards .ic-card__title{max-width:none}
/* Partner with Sentinel: on one column the steps follow their numbers (one, two, three). */
@media (max-width:1023px){
  .sh-r74 .sy-stories__inner{display:flex;flex-direction:column;gap:48px}
  .sh-r74 .sy-stories__col{display:contents}
  .sh-r74 .sy-stories__head{order:0}
  .sh-r74 .sy-story{order:var(--sy-step,1)}
}
/* Contact cards: team photos framed from the top so heads are never cut. */
.sh-r63.sh-r74 .ct-card__media img{object-position:50% 22%}
/* Partner with Sentinel (desktop): step two starts below step one's photo so the steps read in order. */
@media (min-width:1024px){.sh-r74.sh-page-partner-with-sentinel .sy-stories__col--l .sy-story:first-of-type{margin-top:200px}}