/* Final layer: one spacing scale, a slim header, a tight hero and balanced service cards. */
:root{--s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px}
body .shell{width:min(100% - 40px,1160px)}
body section.section{padding-block:var(--s6)}
@media(max-width:850px){body section.section{padding-block:var(--s5)}}
@media(max-width:590px){body section.section{padding-block:var(--s4)}body .shell{width:calc(100% - 32px)}}

/* Header: the approved centered masthead stays (logo >=200px phone, >=300px desktop); only its padding is trimmed */
body .site-header .header-row{padding-block:8px;row-gap:4px}
@media(max-width:850px){
 body .service-benefits{display:flex;flex-wrap:wrap;gap:6px 8px;margin:12px 0}
 body .service-benefits li{padding:4px 10px;font-size:.8125rem;min-height:0}
}

/* Hero */
body .hero .hero-local{display:block;margin:0 0 6px}
body .premium-hero .brand-tagline{width:clamp(190px,50vw,250px)}
body .hero.premium-hero{padding-block:var(--s5) var(--s5);min-height:0}
body .hero .hero-layout{min-height:0;padding-block:0;gap:var(--s3) var(--s5);align-items:center}
body .hero h1{margin:0 0 var(--s2);line-height:1.1}
body .hero .hero-lead{margin:0 0 var(--s3);max-width:34em}
body .hero .hero-buttons{margin:0 0 var(--s2);gap:var(--s1) var(--s2)}
body .hero .hero-foot{margin:0 0 var(--s3);font-size:.9375rem}
body .hero .welcome-voice{margin:0}
@media(max-width:850px){
 body .hero.premium-hero{padding-block:var(--s3) var(--s4)}
 body .hero .hero-layout{display:flex;flex-direction:column;align-items:stretch}
 body .hero .hero-copy{display:flex;flex-direction:column}
 body .hero h1{order:1;font-size:2rem}
 body .hero .hero-lead{order:2;margin-bottom:var(--s2)}
 body .hero .hero-buttons{order:3;display:grid;grid-template-columns:1fr;margin-bottom:var(--s2)}
 body .hero .hero-buttons>*{width:100%;justify-content:center}
 body .hero .hero-foot{order:4}
 body .hero .welcome-voice{order:5}
}
body .neighbor-carousel{margin:0}
body .neighbor-slide figcaption{padding:12px 20px}

/* Service cards: image, short text, one clear action */
body .home-services.section{padding-block:var(--s5)}
body .home-services .home-section-heading{margin-bottom:var(--s3);gap:var(--s2)}
body .home-services .home-section-heading p{margin:8px 0 0}
body .home-service-card{display:flex;flex-direction:column;min-height:0}
body .home-service-card .home-service{display:flex;flex-direction:column;flex:1;min-height:0}
body .home-service-card .service-copy{display:block;padding:var(--s2) var(--s2) 0;flex:none}
body .home-service-card .service-copy h3{margin:0 0 6px;font-size:1.125rem}
body .home-service-card .service-copy p{margin:0;font-size:.9375rem;line-height:1.5}
body .home-service-card .service-arrow{display:none}
body .home-service-card .home-service-book{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding:var(--s2);min-height:48px;border-top:0;font-weight:650}
body .home-service-card .service-panel-image{height:140px;width:100%;object-fit:cover}
@media(max-width:700px){
 body .home-service-card{display:grid!important;grid-template-columns:112px 1fr;grid-template-rows:auto auto;column-gap:0;overflow:hidden}
 body .home-service-card .home-service{display:contents!important}
 body .home-service-card .service-panel-image{grid-row:1/3;grid-column:1;height:100%;min-height:128px;width:112px;object-fit:cover}
 body .home-service-card .service-copy{grid-column:2;padding:var(--s2) var(--s2) 4px}
 body .home-service-card .service-copy p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 body .home-service-card .home-service-book{grid-column:2;margin:0;padding:4px var(--s2) var(--s2);min-height:44px;justify-content:flex-start;gap:8px}
}
/* Sections that follow */
body .home-rates.home-price-band{padding-block:var(--s5)}
body .home-request.section,body .home-faq.section{padding-block:var(--s5)}
body .home-service-pills,body .service-pills{margin:var(--s2) 0}

/* Phone tightening pass */
@media(max-width:700px){
 body ul.service-benefits{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:6px!important;margin:10px 0!important;padding:0!important}
 body ul.service-benefits li{width:auto!important;flex:0 0 auto!important}
 body .home-service-card{min-height:0!important;align-items:stretch}
 body .home-service-card img{height:100%!important;min-height:112px;max-height:150px;object-fit:cover}
 body .home-service-card .home-service-book{margin-top:4px}
 body .home-services{gap:10px!important}
}
@media(max-width:700px){
 body .home-service-card{grid-template-rows:auto auto!important}
 body .home-service-card img{max-height:none!important;min-height:0!important;grid-row:1/3}
 body .home-service-card .home-service-book{min-height:0!important;height:auto!important;padding:0 14px 12px!important;align-self:start}
 body ul.service-benefits li{padding:3px 9px!important}
}

/* Reliability section and hero lead: tighter on phones */
@media(max-width:700px){
 body .premium-hero .hero-lead{font-size:1.0625rem!important;line-height:1.55!important}
 body .home-reliability{padding-block:32px!important}
 body .home-reliability h2{font-size:1.5rem!important;max-width:none}
 body .home-reliability-lead{font-size:1rem!important;line-height:1.55!important}
 body .reliability-grid{gap:10px!important;margin:16px 0 18px!important}
 body .reliability-grid article{padding:14px 16px!important}
 body .reliability-grid h3{font-size:1rem!important;margin-bottom:4px!important}
 body .reliability-grid p{font-size:.9375rem!important;line-height:1.5!important}
}

/* Request buttons keep one consistent width (pinned by the public layout check) */
body .hero-buttons .button,body .hero-buttons .service-request-button{width:min(288px,calc(100vw - 100px))!important;align-self:flex-start}
body ul.service-benefits li{max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere;min-width:0}
body .home-services .shell{min-width:0}
body ul.service-benefits li{font-size:.875rem!important;line-height:1.35}

/* ===== Regal layer: serif headlines, gold hairlines, quiet cards. Free system fonts only. ===== */
:root{--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--gold-ink:#6b5214;--gold-line:#c9a24b;--ivory:#fbf9f3;--hair:#e4dccb}
body h1,body h2,body .page-hero h1,body .home-section-heading h2{font-family:var(--serif);font-weight:600;letter-spacing:-.012em;line-height:1.14;color:var(--navy)}
body h1{font-size:clamp(2.1rem,3.6vw,3.15rem)}
body h2{font-size:clamp(1.6rem,2.5vw,2.15rem)}
body h3{letter-spacing:-.003em}
/* quiet gold eyebrow with a short hairline */
body .overline{display:flex;align-items:center;gap:10px;font-size:.875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin:0 0 10px}
body .overline::before{content:"";width:28px;height:1px;background:var(--gold-line);flex:none}
/* hero lead reads as editorial copy */
body .premium-hero .hero-lead{font-size:1.125rem;line-height:1.6;color:#34505c}
/* benefit tags: a refined inline row instead of pills */
body ul.service-benefits{gap:0!important;margin:14px 0 18px!important;padding:0!important;list-style:none}
body ul.service-benefits li{background:none!important;border:0!important;border-radius:0!important;padding:2px 14px 2px 0!important;margin:0 14px 0 0;color:#3b5546;font-size:.875rem!important;font-weight:600;letter-spacing:.01em;position:relative}
body ul.service-benefits li:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:var(--gold-line)}
/* cards: warm hairline, soft depth, calm hover */
body .home-service-card,body .reliability-grid article{background:#fffdf8!important;border:1px solid var(--hair)!important;border-radius:10px!important;box-shadow:0 1px 2px rgba(16,40,60,.04),0 8px 24px -14px rgba(16,40,60,.16)!important}
body .home-service-card{transition:box-shadow .2s ease,transform .2s ease}
body .home-service-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(16,40,60,.05),0 16px 32px -16px rgba(16,40,60,.24)!important}
body .reliability-grid h3{font-family:var(--serif);font-weight:600;font-size:1.0625rem;color:var(--navy)}
/* buttons: confident, slightly tracked */
body .service-request-button,body .button{letter-spacing:.01em;font-weight:700;border-radius:8px}
/* section rhythm: ivory and cream alternate, thin gold rule between bands */
body .home-reliability,body .home-faq{background:var(--ivory)}
body .home-rates{border-block:1px solid var(--hair)}
/* FAQ rows */
body .home-faq details{border-bottom:1px solid var(--hair)}
body .home-faq summary{font-family:var(--serif);font-size:1.0625rem;font-weight:600;color:var(--navy)}
@media(prefers-reduced-motion:reduce){body .home-service-card{transition:none}body .home-service-card:hover{transform:none}}
@media(max-width:700px){
 body ul.service-benefits{display:grid!important;grid-template-columns:1fr 1fr;gap:6px 12px!important}
 body ul.service-benefits li{margin:0;padding:0!important}
 body ul.service-benefits li::after{display:none!important}
 body .home-service-card img{align-self:stretch;height:auto!important;min-height:100%;width:100%;object-fit:cover}
}
body .button.welcome-play{font-size:1rem!important;line-height:1.3}
@media(max-width:700px){
 body .home-service-card img.service-panel-image{height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:cover!important;align-self:stretch!important;border-radius:9px 0 0 9px}
}
body .home-service-card .home-service-book{background:transparent!important}

/* Recent work gallery: real owner photos */
body .home-work{padding-block:clamp(36px,5vw,64px);background:var(--ivory)}
body .home-work-lead{max-width:620px;margin:0 0 22px;color:#34505c}
body .work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
body .work-grid figure{margin:0;border:1px solid var(--hair);border-radius:10px;overflow:hidden;background:#fffdf8;box-shadow:0 1px 2px rgba(16,40,60,.04),0 8px 24px -14px rgba(16,40,60,.16)}
body .work-grid img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
body .work-grid figcaption{padding:10px 14px 12px;font-size:.9375rem;font-weight:600;color:var(--navy);line-height:1.35}
@media(max-width:1000px){body .work-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){body .work-grid{gap:10px}body .work-grid figcaption{padding:8px 10px 10px;font-size:.875rem}}

/* Real job photo: keep the shirt logo in frame when cards crop to narrower shapes. */
img[src*="ynsg-accessibility-home-safety"]{object-position:50% 50%}