/* Kingsmere uniform hero system v4 — single geometry on all site and PPC product banners */
:root{--km-u-green:#70BF45;--km-u-orange:#F28C28;--km-u-ink:#173024;--km-u-height:650px}
.hero.km-u-hero,.page-hero.km-u-hero,.km-awning-hero.km-u-hero,.lp-hero{position:relative!important;height:var(--km-u-height)!important;min-height:var(--km-u-height)!important;max-height:var(--km-u-height)!important;background:#fff!important;overflow:hidden!important;isolation:isolate}
/* Preserve natural colours: no black wash or darkening. Bright right-hand product photography. */
.hero.km-u-hero .hero-bg,.page-hero.km-u-hero .page-hero-bg,.km-awning-hero.km-u-hero .km-awning-hero-bg{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background-size:cover!important;background-position:63% center!important;background-repeat:no-repeat!important;filter:none!important;opacity:1!important}
.km-u-hero.km-u-custom-photo .page-hero-bg,.km-u-hero.km-u-custom-photo .km-awning-hero-bg{background-position:center center!important}
.hero.km-u-hero .hero-ov,.page-hero.km-u-hero .page-hero-ov,.km-awning-hero.km-u-hero .km-awning-hero-ov{display:block!important;position:absolute!important;inset:0!important;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.985) 23%,rgba(255,255,255,.88) 36%,rgba(255,255,255,.45) 52%,rgba(255,255,255,0) 70%)!important;opacity:1!important}
.km-u-hero.km-u-custom-photo .page-hero-ov,.km-u-hero.km-u-custom-photo .km-awning-hero-ov{background:transparent!important}
.km-u-hero .hero-content,.km-u-hero .page-hero-content,.km-u-hero .km-awning-hero-content{position:relative!important;z-index:3!important;display:block!important;color:var(--km-u-ink)!important;width:100%!important;max-width:1240px!important;padding:0 26px!important;margin:0 auto!important;height:100%!important}
.km-u-hero .km-u-layout{position:relative;display:block;width:100%;height:100%}
.km-u-hero .km-u-breadcrumb{position:absolute;top:15px;left:0;font-size:11px!important;line-height:1.5;color:#45584a!important;margin:0!important;z-index:3}
.km-u-hero .km-u-breadcrumb a,.km-u-hero .km-u-breadcrumb span{color:#45584a!important}
.km-u-google{display:inline-flex!important;align-items:center!important;gap:12px!important;background:#fff!important;padding:11px 16px!important;border-radius:12px!important;box-shadow:0 4px 19px rgba(28,45,26,.10)!important;border:1px solid #e5e9e3!important;color:#1b2a23!important;text-decoration:none!important;font:500 14px/1.15 Arial,sans-serif!important;white-space:nowrap}
.km-u-hero .km-u-google{position:absolute!important;top:52px!important;left:0!important;margin:0!important;z-index:5}
.km-u-google-g{font:bold 34px/1 Arial,sans-serif;letter-spacing:-2px;color:#4285f4;background:conic-gradient(from -30deg,#4285F4 0 95deg,#34A853 95deg 165deg,#FBBC05 165deg 221deg,#EA4335 221deg 290deg,#4285F4 290deg);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;padding-right:3px}
.km-u-google-rating>span{display:flex;align-items:center;gap:9px}.km-u-google-rating strong{font-size:20px;color:#183024}.km-u-stars{color:#eea40e;font-size:18px;letter-spacing:0}.km-u-count{color:#4a524c;font-size:13px}.km-u-google-rating small{display:block;margin-top:5px;color:#647068;font-size:12px}
.km-u-hero .km-u-information{position:absolute!important;left:0!important;top:151px!important;width:min(570px,52vw)!important;color:var(--km-u-ink)!important;max-height:308px;overflow:visible}
.km-u-hero .km-u-eyebrow{color:#55734a!important;font:700 12px/1.35 Montserrat,Arial,sans-serif!important;letter-spacing:.03em!important;text-transform:none!important;margin:0 0 9px!important}
.km-u-hero .km-u-heading{color:#123d28!important;font:800 clamp(33px,3.2vw,55px)/1.10 Montserrat,Arial,sans-serif!important;letter-spacing:-.036em!important;text-shadow:none!important;margin:0 0 14px!important;max-width:100%!important;overflow-wrap:normal}
.km-u-hero .km-u-supplement{font:700 15px/1.35 Montserrat,Arial,sans-serif!important;color:#34523d!important;margin:0 0 8px!important}
.km-u-hero .km-u-description{color:#283b31!important;font:400 15px/1.55 'Open Sans',Arial,sans-serif!important;text-shadow:none!important;margin:0!important;max-width:565px!important}
.km-u-hero .km-u-actions{position:absolute;left:0;bottom:104px;display:flex;gap:14px;align-items:center;z-index:5}
.km-u-btn{box-sizing:border-box;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:236px!important;min-height:53px!important;padding:12px 18px!important;font:800 14px/1.2 Montserrat,Arial,sans-serif!important;text-align:center!important;border-radius:8px!important;text-decoration:none!important;transition:background-color .18s ease,color .18s ease,transform .18s ease!important}
.km-u-btn:hover{transform:translateY(-1px)}.km-u-primary{background:var(--km-u-green)!important;border:2px solid var(--km-u-green)!important;color:#142d18!important}.km-u-primary:hover{background:var(--km-u-orange)!important;border-color:var(--km-u-orange)!important;color:#202720!important}.km-u-secondary{background:#fff!important;border:2px solid var(--km-u-orange)!important;color:#173d28!important}.km-u-secondary:hover{background:#fff3e7!important;color:#173d28!important}
.km-u-benefits{display:flex;align-items:center;gap:14px;color:#183927!important;font:700 13px/1.25 'Open Sans',Arial,sans-serif!important}
.km-u-hero .km-u-benefits{position:absolute;left:0;bottom:25px;white-space:nowrap}
.km-u-benefits>span{display:inline-flex;align-items:center;gap:9px;padding-right:14px;border-right:1px solid #ccd8c7}
.km-u-benefits>span:last-child{padding-right:0;border:0}
.km-u-benefit-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;border-radius:50%;background:#edf7e9;color:#2a7040!important;font-size:21px;font-weight:800}
.km-u-hero .km-hero-stamps{position:absolute!important;right:max(3%,calc((100vw - 1200px)/2))!important;top:50px!important;left:auto!important;z-index:4!important;pointer-events:none}.km-u-hero .km-hero-sale{position:static!important;transform:none!important}.km-u-hero .km-hero-sale img{width:115px!important;height:115px!important}
/* Keep special contact/consultation imagery under the standardised overlaid banner. */
.km-u-hero.consult-hero .consult-collage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:0!important;opacity:1!important;filter:none!important}
/* Landing pages share the exact 650px height, review logo y=52px, h1 y~151px and CTA y=~493px. */
.lp-hero{background:#fff!important;color:var(--km-u-ink)!important}
.lp-hero .lp-hero-bg{z-index:-2!important;object-fit:cover!important;object-position:68% center!important;filter:none!important;opacity:1!important}
.lp-hero::before{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 21%,rgba(255,255,255,.81) 37%,rgba(255,255,255,.28) 55%,rgba(255,255,255,0) 73%)!important;z-index:-1!important}
.lp-hero:has(.lp-hero-bg[src*="bright-uniform"])::before{background:transparent!important}
.lp-hero .hero-grid{height:100%!important;min-height:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) 335px!important;gap:40px!important;align-items:center!important;padding-top:0!important;padding-bottom:0!important;position:relative!important}
.lp-hero .hero-copy{height:100%!important;max-width:none!important;position:relative!important;color:var(--km-u-ink)!important}
.lp-hero .hero-copy>.km-u-google{position:absolute!important;top:52px!important;left:0!important}
.lp-hero .hero-copy>.hero-tag{position:absolute!important;top:146px!important;left:0!important;font:700 12px/1.35 Montserrat,Arial,sans-serif!important;letter-spacing:0!important;color:#507341!important;text-transform:none!important;border:0!important;margin:0!important;padding:0!important}
.lp-hero .hero-copy>h1{position:absolute!important;top:175px!important;left:0!important;color:#123d28!important;font:800 clamp(32px,3vw,50px)/1.08 Montserrat,Arial,sans-serif!important;max-width:620px!important;margin:0!important;letter-spacing:-.038em!important}
.lp-hero .hero-copy>h1 span{display:block;color:#24452e!important;font:700 clamp(18px,2vw,29px)/1.25 Montserrat,Arial,sans-serif!important;letter-spacing:-.025em!important;margin-top:7px}
.lp-hero .hero-copy>p{position:absolute!important;top:325px!important;left:0!important;max-width:530px!important;margin:0!important;color:#263d31!important;font-size:15px!important;line-height:1.55!important}
.lp-hero .hero-copy>.hero-actions{position:absolute!important;left:0!important;bottom:104px!important;display:flex!important;gap:14px!important}
.lp-hero .hero-actions .lp-btn{min-width:236px!important;min-height:53px!important;border-radius:8px!important;font-size:14px!important}
.lp-hero .hero-actions .lp-primary{background:var(--km-u-green)!important;color:#142d18!important}.lp-hero .hero-actions .lp-primary:hover{background:var(--km-u-orange)!important;color:#202720!important}
.lp-hero .hero-actions .lp-secondary{border:2px solid var(--km-u-orange)!important;background:#fff!important;color:#173d28!important}.lp-hero .hero-actions .lp-secondary:hover{background:#fff3e7!important}
.lp-hero .hero-copy>.km-u-benefits{position:absolute!important;bottom:25px!important;left:0!important;white-space:nowrap;gap:11px!important;font-size:12px!important}
.lp-hero .hero-copy>.km-u-benefits>span{gap:6px;padding-right:10px}.lp-hero .km-u-benefit-icon{width:30px;height:30px;font-size:18px}
.lp-hero .hero-copy>.km-u-extra-notes{display:none!important}
.lp-hero .lp-quote{align-self:center!important;box-shadow:0 12px 36px rgba(30,40,25,.13)!important}
.lp-hero .offer-burst{top:48px!important;left:auto!important;right:calc(max(2%,(100vw - 1190px)/2) + 345px)!important;z-index:2!important}
/* Reduce very long text at the smallest desktop breakpoint without moving its anchors */
@media(min-width:801px) and (max-width:1280px){.km-u-hero .km-u-information{width:min(550px,49vw)!important}.km-u-hero .km-u-heading{font-size:clamp(32px,3.5vw,48px)!important}.km-u-btn{min-width:218px!important}.lp-hero .hero-actions .lp-btn{min-width:205px!important}.km-u-benefits{font-size:11px!important}.km-u-benefit-icon{width:29px;height:29px}}
@media(max-width:800px){
  .hero.km-u-hero,.page-hero.km-u-hero,.km-awning-hero.km-u-hero{height:710px!important;min-height:710px!important;max-height:710px!important}
  .km-u-hero .hero-bg,.km-u-hero .page-hero-bg,.km-u-hero .km-awning-hero-bg{display:block!important;background-position:center top!important;opacity:1!important}
  .km-u-hero .hero-ov,.km-u-hero .page-hero-ov,.km-u-hero .km-awning-hero-ov{display:block!important;background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,.96) 45%,rgba(255,255,255,.68) 68%,rgba(255,255,255,.15) 100%)!important}
  .km-u-hero.km-u-custom-photo .page-hero-ov,.km-u-hero.km-u-custom-photo .km-awning-hero-ov{background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,.96) 58%,rgba(255,255,255,.35) 100%)!important}
  .km-u-hero .hero-content,.km-u-hero .page-hero-content,.km-u-hero .km-awning-hero-content{padding:0 20px!important}
  .km-u-hero .km-u-breadcrumb{top:12px!important}
  .km-u-hero .km-u-google{top:45px!important}
  .km-u-hero .km-u-information{top:143px!important;width:100%!important;max-height:340px!important}
  .km-u-hero .km-u-heading{font-size:clamp(29px,6.1vw,43px)!important;max-width:610px!important}
  .km-u-hero .km-u-description{font-size:13px!important;line-height:1.55!important}
  .km-u-hero .km-u-actions{bottom:113px!important;gap:10px}
  .km-u-btn{min-width:0!important;max-width:250px!important;min-height:50px!important;padding:9px 12px!important;font-size:12px!important}
  .km-u-hero .km-u-benefits{bottom:24px!important;white-space:normal!important;gap:7px!important;flex-wrap:wrap!important}
  .km-u-benefits>span{border-right:0!important;padding-right:6px!important;font-size:11px!important}
  .km-u-benefit-icon{width:28px;height:28px;font-size:18px}
  .km-u-hero .km-hero-stamps{top:16px!important;right:15px!important}.km-u-hero .km-hero-sale img{width:65px!important;height:65px!important}
  .lp-hero{height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important}
  .lp-hero .hero-grid{height:auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;gap:24px!important;padding:0 22px 35px!important;align-items:stretch!important}
  .lp-hero .hero-copy{height:670px!important;flex:none!important;width:100%!important}
  .lp-hero .hero-copy>.km-u-google{top:45px!important}
  .lp-hero .hero-copy>.hero-tag{top:142px!important}
  .lp-hero .hero-copy>h1{top:170px!important;font-size:clamp(28px,5.5vw,40px)!important}
  .lp-hero .hero-copy>p{top:310px!important;font-size:14px!important}
  .lp-hero .hero-copy>.hero-actions{bottom:112px!important}
  .lp-hero .hero-copy>.km-u-benefits{bottom:25px!important;white-space:normal!important;flex-wrap:wrap!important}
  .lp-hero .hero-actions .lp-btn{min-width:0!important;min-height:49px!important;font-size:12px!important}
  .lp-hero .offer-burst{top:18px!important;right:20px!important}
  .lp-hero::before{background:linear-gradient(0deg,#fff 25%,rgba(255,255,255,.94) 65%,rgba(255,255,255,.48) 100%)!important}
}
@media(max-width:480px){
  .km-u-hero .km-u-heading{font-size:30px!important;line-height:1.13!important}
  .km-u-hero .km-u-information{top:145px!important}
  .km-u-hero .km-u-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
  .km-u-btn{width:100%!important;min-width:0!important;font-size:11px!important}
  .km-u-hero .km-u-benefits{gap:4px!important}.km-u-benefits>span{font-size:10px!important}
  .km-u-google{padding:9px 10px!important;gap:8px!important}.km-u-google-g{font-size:28px}.km-u-google-rating strong{font-size:17px}.km-u-stars{font-size:13px}.km-u-count{font-size:11px}.km-u-google-rating small{font-size:10px}
  .lp-hero .hero-grid{padding:0 16px 26px!important}.lp-hero .hero-copy{height:670px!important}.lp-hero .hero-copy>h1{font-size:29px!important}.lp-hero .hero-copy>p{top:310px!important}.lp-hero .hero-copy>.hero-actions{width:100%;gap:8px!important}.lp-hero .hero-actions .lp-btn{flex:1;min-width:0!important;padding:11px 8px!important;font-size:11px!important}
  .lp-hero .hero-copy>.km-u-benefits{gap:5px!important;font-size:10px!important}
}

/* final QA corrections, matching desktop CTA geometry and full-image mobile framing */
.km-u-hero .km-u-heading{text-transform:none!important}
.km-u-benefit-icon svg{width:22px;height:22px;display:block;stroke:#31713b}
.lp-hero .hero-grid{max-width:1240px!important;padding-left:26px!important;padding-right:26px!important}
.lp-hero .hero-actions .lp-btn{box-sizing:border-box!important;height:53px!important;min-height:53px!important;max-height:53px!important;flex:none!important;white-space:nowrap!important;display:inline-flex!important;align-items:center!important;gap:9px!important;line-height:1.1!important}
.lp-hero .hero-actions svg{width:18px!important;height:18px!important;flex:none!important;display:inline-block!important;vertical-align:middle!important}
.lp-hero .hero-copy>.hero-actions{height:53px!important;max-height:53px!important;align-items:center!important}
.lp-hero .hero-actions .lp-secondary{gap:8px!important}
.lp-hero .hero-copy>.km-u-benefits{font-size:11px!important}
@media(max-width:800px){
 .hero.km-u-hero,.page-hero.km-u-hero,.km-awning-hero.km-u-hero{height:810px!important;min-height:810px!important;max-height:810px!important;background:white!important}
 .km-u-hero .hero-bg,.km-u-hero .page-hero-bg,.km-u-hero .km-awning-hero-bg{height:324px!important;inset:0 0 auto!important;background-position:center 50%!important;background-size:cover!important}
 .km-u-hero.km-u-custom-photo .page-hero-bg{background-image:url('/assets/hero-veranda-mobile.webp')!important;background-size:cover!important;background-position:center center!important}
 .km-u-hero.km-u-custom-photo .km-awning-hero-bg{background-image:url('/assets/hero-awning-mobile.webp')!important;background-size:cover!important;background-position:center center!important}
 .km-u-hero .hero-ov,.km-u-hero .page-hero-ov,.km-u-hero .km-awning-hero-ov,.km-u-hero.km-u-custom-photo .page-hero-ov,.km-u-hero.km-u-custom-photo .km-awning-hero-ov{background:linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,.10) 180px,rgba(255,255,255,.87) 316px,#fff 355px,#fff 100%)!important}
 .km-u-hero .km-u-google{top:44px!important}
 .km-u-hero .km-u-information{top:358px!important;width:100%!important;max-height:none!important}
 .km-u-hero .km-u-actions{bottom:108px!important}
 .km-u-hero .km-u-benefits{bottom:21px!important}
 .km-u-hero .km-u-breadcrumb{top:9px!important;background:#fff9;border-radius:4px;padding:1px 4px}
 .km-u-hero .km-hero-stamps{top:25px!important}
 .lp-hero .hero-grid{padding-left:20px!important;padding-right:20px!important}
 .lp-hero .lp-hero-bg{height:325px!important;object-fit:cover!important;object-position:center center!important}
 .lp-hero .lp-hero-bg[src*="bright-uniform"]{object-position:78% center!important}
 .lp-hero::before,.lp-hero:has(.lp-hero-bg[src*="bright-uniform"])::before{background:linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,.09) 160px,rgba(255,255,255,.88) 310px,#fff 353px,#fff 100%)!important}
 .lp-hero .hero-copy{height:810px!important}
 .lp-hero .hero-copy>.hero-tag{top:357px!important}
 .lp-hero .hero-copy>h1{top:383px!important}
 .lp-hero .hero-copy>p{top:510px!important}
 .lp-hero .hero-copy>.hero-actions{bottom:108px!important;height:53px!important;max-height:53px!important}
 .lp-hero .hero-copy>.km-u-benefits{bottom:21px!important}
 .lp-hero .hero-actions .lp-btn{height:53px!important;max-height:53px!important;min-height:53px!important;font-size:11px!important;white-space:normal!important}
 .lp-hero .offer-burst{top:25px!important}
}
@media(max-width:480px){
 .km-u-hero .km-u-heading{font-size:29px!important}
 .km-u-hero .km-u-eyebrow{font-size:11px!important}
 .km-u-hero .km-u-description{font-size:12.5px!important}
 .lp-hero .hero-grid{padding-left:16px!important;padding-right:16px!important}
 .lp-hero .hero-copy>.hero-actions{width:100%!important}
 .lp-hero .hero-copy>.hero-actions .lp-btn{min-width:0!important;flex:1 1 50%!important;padding:8px 6px!important;font-size:10.5px!important}
}
@media(max-width:800px){
 .hero.km-u-hero .hero-bg,.page-hero.km-u-hero .page-hero-bg,.km-awning-hero.km-u-hero .km-awning-hero-bg{height:324px!important;min-height:0!important;bottom:auto!important;background-size:cover!important;background-position:center 57%!important}
}
@media(min-width:801px){
 .lp-hero .hero-copy>.km-u-benefits{font-size:13px!important;gap:14px!important}
 .lp-hero .hero-copy>.km-u-benefits>span{gap:9px!important;padding-right:14px!important}
 .lp-hero .hero-copy>.km-u-benefits .km-u-benefit-icon{width:36px!important;height:36px!important}
}
