/* home-lift.css (handyman, 5 Nov 2026): home sections below the kit hero, each with its own layout:
   navy promise band, photo-led job list, blue numbers strip, white photo-quote band, zig-zag audience rows,
   quote rows beside the score, full-bleed photo, rule-top process line, two-column FAQ. */
:root{--hl-navy:#13243A;--hl-blue:#1F5EA8}

/* 1. promise: a clean navy band UNDER the hero, no overlap */
.offerbar.hx-promise{margin:0;max-width:none;padding:0;background:var(--hl-navy);position:relative;z-index:1}
.hx-promise__card{max-width:1240px;margin:0 auto;padding:0 clamp(16px,4vw,40px);background:transparent;border-radius:0;box-shadow:none}
.hx-promise__i{padding:30px 28px;border-left:1px solid rgba(255,255,255,.16)}
.hx-promise__i:first-child{border-left:0;padding-left:0}
.hx-promise__i svg{color:#F0B429}
.hx-promise__i h3{color:#fff}
.hx-promise__i p{color:#d3dbe5}
@media (max-width:980px){
  .hx-promise__card{grid-template-columns:1fr 1fr}
  .hx-promise__i:nth-child(odd){border-left:0;padding-left:0}
  .hx-promise__i:nth-child(n+3){border-top:1px solid rgba(255,255,255,.16)}
}
@media (max-width:560px){
  .offerbar.hx-promise{margin-top:0}
  .hx-promise__card{grid-template-columns:1fr}
  .hx-promise__i{border-left:0;padding:20px 0;border-top:1px solid rgba(255,255,255,.16)}
  .hx-promise__i:first-child{border-top:0}
}

/* 2. jobs: a photo-led list, two columns of picture + words (no card wall) */
.hl-svcsec{background:var(--bg)}
.hl-svcsec .hx-grid{grid-template-columns:1fr 1fr;gap:0 clamp(28px,4vw,56px)}
.hl-svcsec .hx-card{display:grid;grid-template-columns:minmax(150px,38%) 1fr;gap:0 22px;background:transparent;box-shadow:none;border-radius:0;border-top:1px solid var(--line2);padding:22px 0;align-items:stretch}
.hl-svcsec .hx-card:hover{transform:none;box-shadow:none}
.hl-svcsec .hx-card__ph{aspect-ratio:auto;min-height:150px;border-radius:var(--r-sm);height:100%}
.hl-svcsec .hx-card__ph img{position:absolute;inset:0;width:100%;height:100%}
.hl-svcsec .hx-card__b{padding:0}
.hl-svcsec .hx-card__b h3{font-size:21px}
@media (max-width:760px){
  .hl-svcsec .hx-grid{grid-template-columns:1fr}
  .hl-svcsec .hx-card{grid-template-columns:116px 1fr;gap:0 16px;padding:18px 0}
  .hl-svcsec .hx-card__ph{min-height:116px}
  .hl-svcsec .hx-card__tag{display:none}
  .hl-svcsec .hx-card__b h3{font-size:19px}
}

/* 3. numbers strip */
.hl-nums{background:var(--hl-blue);color:#fff}
.hl-nums dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.hl-nums dl>div{padding:32px 24px 32px 28px;border-left:1px solid rgba(255,255,255,.3)}
.hl-nums dl>div:first-child{border-left:0;padding-left:0}
.hl-nums dt{font:800 clamp(44px,5.2vw,74px)/1 var(--fd);letter-spacing:-.04em;margin:0}
.hl-nums dd{margin:10px 0 0;font:600 16px/1.4 var(--fd);max-width:22ch;color:#fff}
@media (max-width:760px){
  .hl-nums dl{grid-template-columns:1fr 1fr}
  .hl-nums dl>div{padding:22px 12px 22px 0;border-left:0}
  .hl-nums dl>div:nth-child(even){padding-left:20px;border-left:1px solid rgba(255,255,255,.3)}
  .hl-nums dl>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.3)}
}

/* 4. photo quotes: white band, picture carries it */
.pqs{--pq-bg:#fff}

/* 5. the fridge list: tinted ground */
.hl-listsec{background:var(--bg2)}

/* 6. who calls: zig-zag rows, big picture one side, words the other */
.hl-whosec{background:#fff}
.hl-whosec .hm-who{display:flex;flex-direction:column;gap:clamp(28px,4vw,48px)}
.hl-whosec .hm-who__c{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;background:transparent;box-shadow:none;border-radius:0;overflow:visible}
.hl-whosec .hm-who__c:hover{transform:none;box-shadow:none}
.hl-whosec .hm-who__c img{border-radius:var(--r);aspect-ratio:16/10;box-shadow:var(--sh)}
.hl-whosec .hm-who__c>div{padding:0;gap:12px}
.hl-whosec .hm-who__c:nth-child(even) img{order:2}
.hl-whosec .hm-who__c h3{font:750 clamp(26px,3vw,38px)/1.1 var(--fd);letter-spacing:-.02em}
.hl-whosec .hm-who__c p{font-size:clamp(16.5px,1.4vw,19px);line-height:1.6;max-width:44ch}
@media (max-width:820px){
  .hl-whosec .hm-who__c{grid-template-columns:1fr;gap:16px}
  .hl-whosec .hm-who__c:nth-child(even) img{order:0}
}

/* 7. reviews: the score on the left, three plain quotes on the right */
.hl-rvsec{background:var(--bg)}
.hl-rvsec>.hx-w{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:clamp(32px,5vw,80px);align-items:start}
.hl-rvsec .hx-head{grid-column:1;grid-row:1/span 2;display:block;margin:0;position:sticky;top:110px}
.hl-rvsec .hx-score{margin-top:28px;align-items:flex-start;flex-direction:column;gap:10px}
.hl-rvsec .hx-score__n{font-size:clamp(72px,8vw,112px)}
.hl-rvsec .hx-rv{grid-column:2;grid-template-columns:1fr;gap:0}
.hl-rvsec .hx-rv article{background:transparent;box-shadow:none;border-radius:0;border-top:1px solid var(--line2);padding:26px 0}
.hl-rvsec .hx-rv article:first-child{border-top:2px solid var(--hl-blue)}
.hl-rvsec .hx-rv blockquote{font:560 clamp(19px,1.7vw,23px)/1.5 var(--fd);letter-spacing:-.01em}
.hl-rvsec .hx-more{grid-column:2;text-align:left;margin-top:18px}
@media (max-width:900px){
  .hl-rvsec>.hx-w{display:block}
  .hl-rvsec .hx-head{position:static;margin-bottom:24px}
}

/* 8. how it works: a ruled line, numerals, no cards */
.hl-howsec{background:#fff}
.hl-howsec .hx-steps{gap:0 clamp(20px,3vw,40px)}
.hl-howsec .hx-steps>li{background:transparent;box-shadow:none;border-radius:0;border-top:3px solid var(--hl-blue);padding:20px 0 0}
.hl-howsec .hx-steps>li::before{width:auto;height:auto;background:none;border-radius:0;color:var(--hl-blue);font:800 clamp(44px,4.6vw,64px)/1 var(--fd);letter-spacing:-.04em;margin:0 0 12px;display:block}
.hl-howsec .hx-steps h3{font-size:20px}
@media (max-width:900px){.hl-howsec .hx-steps{grid-template-columns:1fr 1fr;gap:32px 24px}}
@media (max-width:520px){.hl-howsec .hx-steps{grid-template-columns:1fr}}

/* 9. area: cream ground; faq: white, question column left */
.hl-areasec{background:var(--bg)}
.hl-faqsec{background:var(--bg2)}
.hl-faqsec>.hx-w{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(32px,5vw,72px);align-items:start}
.hl-faqsec .hx-head{grid-column:1;grid-row:1/span 2;text-align:left;margin:0;position:sticky;top:110px}
.hl-faqsec .hx-head--c .hx-eyebrow{justify-content:flex-start}
.hl-faqsec .hx-faq{grid-column:2;max-width:none;margin:0}
.hl-faqsec .hx-more{grid-column:2;margin-top:20px;text-align:left}
@media (max-width:900px){
  .hl-faqsec>.hx-w{display:block}
  .hl-faqsec .hx-head{position:static;margin-bottom:28px}
}
.hh-hero h1,.hh-hero h1 em{text-transform:none}
.hl-howsec .hx-steps>li::before{text-align:left}

/* inner-page hero band (5 Nov 2026): lighter scrim so the photograph reads (gate luma), breadcrumb links get a 44px target */
.hh-hero--page{--hh-sf:.6;--hh-sfm:.55}
.hh-crumbs a{display:inline-flex;align-items:center;min-height:44px;padding-inline:2px}

/* inner-page hero (6 Nov 2026): text-side scrim only, picture side stays clear (contrast on the type, luma on the picture); breadcrumb sits on a small glass chip */
.hh-hero--page .hh-hero__scrim{background:
  linear-gradient(0deg,rgba(var(--hh-scrim),.5) 0,rgba(var(--hh-scrim),.26) 160px,rgba(var(--hh-scrim),0) 340px),
  linear-gradient(90deg,rgba(var(--hh-scrim),.74) 0,rgba(var(--hh-scrim),.68) 38%,rgba(var(--hh-scrim),.42) 54%,rgba(var(--hh-scrim),.1) 66%,rgba(var(--hh-scrim),0) 72%)}
.hh-hero--page .hh-crumbs{display:inline-flex;flex-wrap:wrap;align-items:center;padding:0 12px;border-radius:999px;background:rgba(var(--hh-scrim),.66);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
@media (max-width:899.98px){
  .hh-hero--page .hh-hero__scrim{background:linear-gradient(0deg,rgba(var(--hh-scrim),.8) 0,rgba(var(--hh-scrim),.7) 30%,rgba(var(--hh-scrim),.32) 42%,rgba(var(--hh-scrim),0) 52%)}
}
/* header pill (6 Nov 2026): a little more body so the Menu label holds 4.5:1 over bright inner-page photos */
html:root{--hh-pill-a:.82}