/* ============================================================
   Earth Works brand refinement v10
   Client reference: black utility header + clean white navigation,
   vibrant green accents, white-forward page backgrounds, one readable
   typography system, and consistent non-home hero banners.
   ============================================================ */
:root{
  --green:#4b9b22!important;
  --green-2:#64b438!important;
  --green-dark:#2f7717!important;
  --green-soft:#eaf5e5!important;
  --client-green:#4b9b22!important;
  --client-green-bright:#70bd3d!important;
  --client-black:#050604!important;
  --cream:#f6f8f5!important;
  --cream-2:#ffffff!important;
  --paper:#ffffff!important;
  --client-cream:#ffffff!important;
  --client-paper:#ffffff!important;
  --client-line:#dfe5db!important;
  --line:rgba(18,35,12,.13)!important;
  --muted:#626961!important;
}
html,body{background:#fff!important;color:#111!important}
body{padding-top:0!important}
body,button,input,select,textarea,
.client-contact,.client-search-button,.client-help-link,
.product-card,.shop-card,.review-card-static,.contact-location,
.faq-static,.form-panel,.contact-info-panel{
  font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important;
  letter-spacing:0!important;
}
p,li,small,label,input,select,textarea{font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important;letter-spacing:0!important}

/* Elegant, readable heading system throughout the site */
h1,h2,h3,h4,.display,.editorial-title,
.visual-hero h1,.collection-toolbar h2,.section-title h2,
.product-static__summary h1,.product-detail-copy h2,.product-choice h2,
.product-faqs h2,.product-comparison h2,.about-grid__copy h2,.owner-copy h2,
.shop-card h3,.product-quote h3,.use-tile h3,.detail-item b,
.product-info-title,.product-card-price,.product-card-button,
.client-section-heading h2,.client-why-copy h2,.client-delivery-copy h2,
.client-feature-card h3,.client-resource-copy b,.client-location-grid h3,
.client-footer h4,.client-footer__wordmark span{
  font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;
  letter-spacing:0!important;
  text-transform:none!important;
  font-kerning:normal!important;
}
h1,.visual-hero h1,.product-static__summary h1{font-weight:760!important;line-height:1.02!important}
h2,.section-title h2,.collection-toolbar h2,.product-detail-copy h2,
.product-choice h2,.product-faqs h2,.product-comparison h2{font-weight:730!important;line-height:1.08!important}
h3,.shop-card h3{font-weight:700!important;line-height:1.18!important}
.eyebrow{font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important;font-style:normal!important;letter-spacing:.08em!important;text-transform:uppercase!important;font-weight:700!important;color:var(--green-dark)!important}

/* Preserve branded handwritten service promise only */
.client-slogan strong,.client-slogan span,.client-review-heading span,.client-above-fold-cta span{
  font-family:"Segoe Print","Bradley Hand",cursive!important;
  letter-spacing:0!important;
}

/* Header: client reference direction */
.client-header{
  position:sticky!important;top:0!important;z-index:9999!important;width:100%!important;
  background:#050604!important;box-shadow:0 8px 24px rgba(0,0,0,.24)!important;
}
.client-header__black{background:#050604!important}
.client-header__grid{min-height:106px!important;grid-template-columns:245px 330px minmax(0,1fr)!important;gap:26px!important}
.client-brand__plate{width:225px!important;height:78px!important;background:transparent!important;padding:0!important;border-radius:0!important}
.client-brand__plate img{object-fit:contain!important}
.client-slogan strong{font-size:20px!important;color:#fff!important}
.client-slogan div{gap:24px!important;margin-top:6px!important}
.client-slogan span{font-size:17px!important;color:#fff!important;border-bottom:2px solid var(--green)!important}
.client-contact-row{grid-template-columns:170px 170px minmax(220px,1fr) 150px!important;gap:12px!important}
.client-contact{border-left:1px solid rgba(255,255,255,.14)!important;padding:0 12px!important;color:#fff!important}
.client-contact:first-child{border-left:0!important}
.client-contact--location{display:flex!important;flex-direction:column!important;gap:2px!important;align-items:flex-start!important}
.client-contact--location b{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-size:17px!important;font-weight:760!important;line-height:1!important;color:#fff!important}
.client-contact--location small{display:block!important;font-size:9px!important;text-transform:uppercase!important;letter-spacing:.07em!important;color:#c5c9c0!important}
.client-contact--email{display:flex!important;flex-direction:column!important;gap:2px!important;align-items:flex-start!important}
.client-contact--email small{display:block!important;font-size:8px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:#8fd05f!important}
.client-contact--email b{font-size:11px!important;color:#fff!important}
.client-quote-button{min-height:48px!important;padding:0 20px!important;background:linear-gradient(180deg,#62b832,#46961f)!important;color:#fff!important;border-radius:5px!important;font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-weight:800!important;font-size:14px!important;letter-spacing:.025em!important;text-transform:uppercase!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.24)!important}
.client-search-row{grid-template-columns:minmax(0,1fr) 150px!important;gap:12px!important;margin-top:9px!important;padding-left:0!important}
.client-search-button{height:42px!important;background:#1b1d1a!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;border-radius:5px!important;padding:0 12px!important;box-shadow:none!important}
.client-search-button__label{gap:12px!important}
.client-search-button__label small{color:#72c043!important;font-size:8px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important}
.client-search-button__label b{color:#f3f4f1!important;font-size:11px!important;font-weight:500!important}
.client-search-button__icon{background:transparent!important;width:28px!important;height:28px!important}
.client-search-button__icon svg{stroke:#70bd3d!important}
.client-help-link{height:42px!important;border:1px solid rgba(255,255,255,.25)!important;border-radius:5px!important;padding:0 11px!important}
.client-help-link small{color:#aeb3a9!important}
.client-help-link b{color:#fff!important}

/* White navigation in place of the pale/tan bar */
.client-nav{background:#fff!important;background-image:none!important;color:#111!important;border-top:0!important;border-bottom:1px solid #e4e8e1!important;box-shadow:0 2px 10px rgba(0,0,0,.04)!important}
.client-nav__inner{height:58px!important;gap:66px!important;justify-content:center!important}
.client-nav a,.client-nav-dropdown__trigger{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-size:13px!important;font-weight:730!important;text-transform:uppercase!important;letter-spacing:.035em!important;color:#131613!important;padding:18px 4px!important}
.client-nav a:hover,.client-nav a.active,.client-nav-dropdown__trigger:hover{color:var(--green-dark)!important}
.client-nav a.active{border-bottom:3px solid var(--green)!important}
.client-nav-dropdown__trigger{height:58px!important}
.client-nav-dropdown__menu{top:56px!important;background:#fff!important;border:1px solid #e0e5dd!important}
.client-nav-dropdown__menu a{background:#f8faf7!important;border-color:#e7ece4!important;color:#171a16!important;text-transform:none!important}
.client-nav-dropdown__menu a:hover{background:#fff!important;color:var(--green-dark)!important}
.client-nav-dropdown__menu b{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;text-transform:none!important;letter-spacing:0!important}

/* Homepage above-the-fold proportions modeled on the client reference */
.client-home-hero{height:clamp(345px,24vw,460px)!important;background:#fff!important;overflow:hidden!important}
.client-home-hero img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 49%!important;max-height:none!important}
.client-featured-strip{background:#fff!important;padding:14px 0 14px!important;border-bottom:0!important}
.client-featured-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important}
.client-feature-card{min-height:170px!important;border-radius:7px!important;border:1px solid #e2e6df!important;box-shadow:0 8px 18px rgba(0,0,0,.10)!important}
.client-feature-card__copy{min-height:170px!important;padding:18px 18px 16px!important}
.client-feature-card h3{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-size:25px!important;font-weight:760!important;text-transform:uppercase!important;letter-spacing:0!important;line-height:1.02!important;margin:0 0 8px!important}
.client-feature-card p{font-size:12px!important;line-height:1.35!important;max-width:250px!important;color:#f3f4ef!important}
.client-feature-card__button,.client-feature-card__copy>span{background:linear-gradient(180deg,#63b931,#45961f)!important;color:#fff!important;font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-weight:800!important;letter-spacing:.035em!important;text-transform:uppercase!important;min-height:38px!important;padding:0 16px!important;border-radius:5px!important}
.client-above-fold-cta{min-height:76px!important;margin:14px calc(50% - 50vw) 0!important;padding-left:max(28px,calc((100vw - var(--page))/2 + 28px))!important;padding-right:max(28px,calc((100vw - var(--page))/2 + 28px))!important;border-radius:0!important;background:#050604!important;color:#fff!important;border:0!important;box-shadow:none!important}
.client-above-fold-cta>div{flex:1!important;justify-content:center!important;gap:14px!important}
.client-above-fold-cta span{font-size:24px!important;color:#f6f6f3!important}
.client-above-fold-cta strong{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;font-size:25px!important;font-weight:760!important;text-transform:none!important;color:#65b738!important}
.client-above-fold-cta>a{background:transparent!important;border:1px solid #65b738!important;color:#fff!important;border-radius:5px!important;font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;text-transform:none!important;font-weight:700!important}

/* White-forward site palette */
.section--paper,.client-locations-section,.collection-shop,.product-hero,.product-static,.reviews-grid-section{background:#fff!important}
.section--cream,.client-project-section,.client-delivery-section,.client-resource-strip,.collection-intro,.product-choice,.product-faqs,.shop-all-section{background:#f6f8f5!important}
.client-resource-strip{background-image:none!important}
.client-footer{background:#050604!important}
.button--primary,.product-card-button,.site-cta .button--primary{background:linear-gradient(180deg,#63b931,#45961f)!important;color:#fff!important}
.button--primary:hover,.product-card-button:hover{background:#397f18!important}

/* Inner hero banners: same height across all non-home pages; no mascot in hero */
.visual-hero,.visual-hero--compact{height:430px!important;min-height:430px!important;background-position:center!important;background-size:cover!important}
.visual-hero__grid,.visual-hero--compact .visual-hero__grid{height:430px!important;min-height:430px!important;grid-template-columns:1fr!important;align-items:center!important}
.visual-hero__copy{max-width:820px!important;padding:46px 0!important}
.visual-hero__overlay{background:linear-gradient(90deg,rgba(5,7,5,.88) 0%,rgba(5,7,5,.74) 42%,rgba(5,7,5,.30) 75%,rgba(5,7,5,.18) 100%)!important}
.visual-hero h1{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;text-transform:none!important;letter-spacing:0!important;font-size:clamp(48px,5vw,78px)!important;font-weight:760!important;line-height:1.02!important;max-width:900px!important}
.visual-hero p{font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important;font-size:17px!important;line-height:1.55!important;max-width:720px!important;margin-top:16px!important}
.visual-hero__mascot{display:none!important}

/* Keep product pages readable and consistent */
.product-static__summary h1{font-size:clamp(42px,4.7vw,66px)!important;text-transform:none!important}
.product-detail-copy h2,.product-choice h2,.product-faqs h2,.product-comparison h2,.section-title h2,.collection-toolbar h2{font-size:clamp(34px,3.5vw,54px)!important;text-transform:none!important}
.shop-card h3{font-size:21px!important;text-transform:none!important}
.product-card-price,.product-card-button,.button{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important}
.review-card-static p{font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif!important}

/* CTA styling stays branded without returning to pale beige */
.site-cta{background:#fff!important}
.site-cta__panel{background:linear-gradient(115deg,#081007,#10370b)!important}
.site-cta__panel h2{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif!important;text-transform:none!important}

@media(max-width:1500px){
  .client-header__grid{grid-template-columns:215px 280px minmax(0,1fr)!important;gap:18px!important}
  .client-brand__plate{width:205px!important;height:70px!important}
  .client-contact-row{grid-template-columns:150px 150px minmax(180px,1fr) 132px!important;gap:8px!important}
  .client-search-row{grid-template-columns:minmax(0,1fr) 132px!important;gap:8px!important}
  .client-nav__inner{gap:44px!important}
}
@media(max-width:1100px){
  .client-header__grid{grid-template-columns:190px 235px minmax(0,1fr)!important;gap:14px!important}
  .client-brand__plate{width:180px!important}
  .client-contact-row{grid-template-columns:132px 132px minmax(160px,1fr) 118px!important;gap:5px!important}
  .client-search-row{grid-template-columns:minmax(0,1fr) 118px!important;gap:5px!important}
  .client-contact--location b{font-size:14px!important}.client-contact--location small{font-size:7px!important}
  .client-nav__inner{gap:28px!important}
  .client-feature-card h3{font-size:21px!important}
}
@media(max-width:900px){
  .client-header__grid{min-height:76px!important;grid-template-columns:44px 1fr auto!important}.client-brand__plate{width:175px!important;height:62px!important}
  .client-slogan,.client-utility{display:none!important}
  .client-nav{position:fixed!important;left:0!important;right:0!important;top:76px!important;bottom:64px!important;background:#fff!important}
  .client-nav__inner{height:auto!important;display:block!important;padding:18px!important}
  .client-nav a,.client-nav-dropdown__trigger{color:#111!important;padding:14px 4px!important}
  .client-home-hero{height:300px!important}
  .client-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .client-above-fold-cta{align-items:flex-start!important;flex-direction:column!important;padding-top:16px!important;padding-bottom:16px!important}
  .client-above-fold-cta>div{display:block!important}.client-above-fold-cta span,.client-above-fold-cta strong{display:block!important}.client-above-fold-cta strong{margin-top:4px!important}
  .visual-hero,.visual-hero--compact,.visual-hero__grid,.visual-hero--compact .visual-hero__grid{height:380px!important;min-height:380px!important}
  .visual-hero__copy{max-width:88%!important}
}
@media(max-width:620px){
  .client-home-hero{height:215px!important}
  .client-featured-grid{grid-template-columns:1fr!important}
  .client-feature-card,.client-feature-card__copy{min-height:150px!important}
  .client-above-fold-cta span{font-size:20px!important}.client-above-fold-cta strong{font-size:21px!important}
  .visual-hero,.visual-hero--compact,.visual-hero__grid,.visual-hero--compact .visual-hero__grid{height:340px!important;min-height:340px!important}
  .visual-hero__copy{max-width:100%!important;padding:34px 0!important}
  .visual-hero h1{font-size:44px!important}.visual-hero p{font-size:15px!important}
}