
*{box-sizing:border-box}body{margin:0;font:16px/1.6 Inter,Arial,sans-serif;background:#fbfcfa;color:#14231c}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.c{width:min(1140px,calc(100% - 36px));margin:auto}header{position:sticky;top:0;z-index:10;background:#fbfcfaf2;border-bottom:1px solid #dce5df}.nav{height:74px;display:flex;align-items:center;justify-content:space-between}.brand{font-weight:900;font-size:20px}.brand i{font-style:normal;background:#176b45;color:#fff;border-radius:9px;padding:8px 11px;margin-right:8px}.links{display:flex;gap:25px}.btn{display:inline-block;background:#176b45;color:#fff;padding:12px 18px;border-radius:11px;font-weight:800;border:1px solid #176b45}.btn.alt{background:#fff;color:#176b45}.hero,.section{padding:78px 0}.heroGrid,.two{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}.ey{color:#176b45;text-transform:uppercase;letter-spacing:.14em;font-weight:900;font-size:12px}h1{font-size:clamp(3rem,7vw,5.7rem);line-height:.95;letter-spacing:-.06em;margin:.2em 0}h2{font-size:clamp(2rem,4vw,3.1rem);line-height:1.08}.lead{font-size:1.2rem;color:#64736b}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.card,.feature{background:#fff;border:1px solid #dce5df;border-radius:20px;box-shadow:0 18px 50px #14231c12;padding:20px}.shot img{border-radius:13px}.altbg{background:#f1f6f2;border-block:1px solid #dce5df}.pill{display:inline-block;background:#dff2e6;color:#176b45;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:900}.checks{list-style:none;padding:0}.checks li{margin:10px 0}.checks li:before{content:'✓';color:#176b45;font-weight:900;margin-right:10px}.grid4,.grid3{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.grid3{grid-template-columns:repeat(3,1fr)}.muted{color:#64736b}.page{padding:65px 0 25px}.prose{max-width:820px}.prose h2{font-size:28px;margin-top:40px}.faq details{background:#fff;border:1px solid #dce5df;border-radius:13px;padding:17px;margin:10px 0}.faq summary{font-weight:800}.notice{background:#f1f6f2;border-left:4px solid #176b45;padding:15px;border-radius:8px}footer{background:#fff;border-top:1px solid #dce5df;padding:45px 0}.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.foot a{display:block;color:#64736b;margin:6px 0}.copy{border-top:1px solid #dce5df;margin-top:30px;padding-top:20px;color:#64736b;font-size:14px}@media(max-width:850px){.heroGrid,.two,.grid4,.grid3,.foot{grid-template-columns:1fr}.links{display:none}.hero{padding:55px 0}h1{font-size:3.2rem}}

/* V1.3 Branding */
.brand-logo{height:42px;width:auto;display:block}
@media(max-width:600px){.brand-logo{height:34px}}

/* V1.4 Conversion & Trust */
.trustbar{border-block:1px solid #dce5df;background:#fff}.trustgrid,.benefits,.included{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.trustitem{text-align:center;padding:16px;font-weight:750;color:#405149}.productHero{padding:60px 0}.productHeroGrid{display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:start}.gallery{background:#fff;border:1px solid #dce5df;border-radius:22px;padding:18px;box-shadow:0 18px 50px #14231c12}.gallery img{border-radius:14px}.buyPanel{background:#fff;border:1px solid #dce5df;border-radius:22px;padding:28px;box-shadow:0 18px 50px #14231c12;position:sticky;top:100px}.buyPanel h1{font-size:clamp(2.5rem,5vw,4.1rem);line-height:.98}.buyPanel .btn{width:100%;text-align:center}.micro{list-style:none;padding:0;color:#53635b}.micro li{margin:8px 0}.micro li:before{content:"✓";color:#176b45;font-weight:900;margin-right:8px}.benefits{grid-template-columns:repeat(3,1fr)}.included{grid-template-columns:repeat(3,1fr)}.box{background:#fff;border:1px solid #dce5df;border-radius:17px;padding:23px}.fit{display:grid;grid-template-columns:1fr 1fr;gap:22px}.fit .box:first-child{border-top:4px solid #176b45}.fit .box:last-child{border-top:4px solid #9aa8a0}.pfaq{max-width:900px}.pfaq details{background:#fff;border:1px solid #dce5df;border-radius:13px;padding:17px 20px;margin:10px 0}.pfaq summary{font-weight:800;cursor:pointer}.bottomcta{background:#0d4f35;color:#fff;border-radius:24px;padding:40px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:25px}.bottomcta h2{color:#fff;margin:0}.bottomcta .btn{background:#fff;color:#0d4f35}.mobileBuy{display:none;position:fixed;left:12px;right:12px;bottom:12px;z-index:60;background:#fff;padding:10px;border-radius:14px;box-shadow:0 10px 35px #14231c33}.mobileBuy .btn{width:100%;text-align:center}@media(max-width:900px){.productHeroGrid,.benefits,.included,.fit,.bottomcta,.trustgrid{grid-template-columns:1fr}.buyPanel{position:static}.mobileBuy{display:block}body{padding-bottom:80px}}

/* V1.4.2 — definitive compact header fix */
header{
  height:74px !important;
  min-height:74px !important;
  max-height:74px !important;
  overflow:hidden !important;
}
header .nav{
  height:74px !important;
  min-height:74px !important;
  max-height:74px !important;
  display:flex !important;
  align-items:center !important;
  gap:24px !important;
}
header .brand{
  display:flex !important;
  align-items:center !important;
  width:220px !important;
  max-width:220px !important;
  height:44px !important;
  overflow:hidden !important;
  flex:0 0 220px !important;
}
header .brand img.brand-logo,
header a.brand img,
header .brand img{
  display:block !important;
  width:210px !important;
  max-width:210px !important;
  height:42px !important;
  max-height:42px !important;
  object-fit:contain !important;
  object-position:left center !important;
}
header .links{
  margin-left:auto !important;
  display:flex;
  align-items:center;
  gap:25px;
}
header .nav > .btn{
  flex:0 0 auto;
  white-space:nowrap;
}
@media(max-width:900px){
  header .brand{
    width:175px !important;
    max-width:175px !important;
    flex-basis:175px !important;
  }
  header .brand img.brand-logo,
  header a.brand img,
  header .brand img{
    width:170px !important;
    max-width:170px !important;
    height:36px !important;
    max-height:36px !important;
  }
}

/* V1.4.3 — Responsive navigation + hero proportion fix */

/* Desktop hero: reduce visual dominance and keep first screen useful */
.hero{
  padding:56px 0 52px !important;
}
.hero h1{
  font-size:clamp(3rem,5.2vw,4.7rem) !important;
  line-height:.98 !important;
  letter-spacing:-.055em !important;
  max-width:720px;
}
.hero .lead{
  font-size:1.08rem !important;
  max-width:650px;
}
.heroGrid{
  gap:48px !important;
  align-items:center !important;
}
.heroGrid > .card,
.hero-card{
  max-width:500px;
  justify-self:end;
}

/* Tablet/mobile header: the desktop links MUST disappear */
@media(max-width:900px){
  header{
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    overflow:hidden !important;
  }
  header .nav{
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    padding:0 !important;
  }
  header .brand{
    width:175px !important;
    max-width:175px !important;
    height:40px !important;
    flex:0 0 175px !important;
  }
  header .brand img.brand-logo,
  header a.brand img,
  header .brand img{
    width:170px !important;
    max-width:170px !important;
    height:36px !important;
    max-height:36px !important;
  }

  /* Hide desktop navigation and desktop Browse Products CTA.
     This removes the horizontal overflow visible in the phone screenshots. */
  header .links,
  header .navlinks,
  header .nav > .btn{
    display:none !important;
  }

  .hero{
    padding:42px 0 38px !important;
  }
  .heroGrid{
    grid-template-columns:1fr !important;
    gap:34px !important;
  }
  .hero h1{
    font-size:clamp(2.75rem,12vw,4rem) !important;
    line-height:.98 !important;
    max-width:100% !important;
  }
  .hero .lead{
    font-size:1.05rem !important;
    line-height:1.65 !important;
  }
  .heroGrid > .card,
  .hero-card{
    width:100% !important;
    max-width:520px !important;
    justify-self:center !important;
  }
  .hero .actions{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
  .hero .actions .btn{
    width:100% !important;
    text-align:center !important;
  }
}

/* Small phones */
@media(max-width:600px){
  .hero{
    padding:34px 0 32px !important;
  }
  .hero h1{
    font-size:clamp(2.55rem,12.5vw,3.45rem) !important;
    line-height:1 !important;
  }
  .hero .ey,
  .eyebrow{
    font-size:.72rem !important;
    letter-spacing:.13em !important;
  }
  .hero .lead{
    font-size:1rem !important;
  }
  .heroGrid > .card,
  .hero-card{
    padding:12px !important;
    border-radius:18px !important;
  }
}

/* V1.4.4 — Accessible mobile navigation */
.mobileMenuBtn{
  display:none;
  width:44px;
  height:44px;
  border:1px solid #dce5df;
  border-radius:11px;
  background:#fff;
  color:#14231c;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex:0 0 auto;
}
.mobileMenuBtn span,
.mobileMenuBtn span::before,
.mobileMenuBtn span::after{
  display:block;
  width:20px;
  height:2px;
  background:#176b45;
  border-radius:2px;
  position:relative;
  transition:.18s ease;
}
.mobileMenuBtn span::before,
.mobileMenuBtn span::after{
  content:"";
  position:absolute;
  left:0;
}
.mobileMenuBtn span::before{top:-6px}
.mobileMenuBtn span::after{top:6px}
.mobileMenuBtn[aria-expanded="true"] span{background:transparent}
.mobileMenuBtn[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.mobileMenuBtn[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
.mobileNav{
  display:none;
}
@media(max-width:900px){
  header{overflow:visible !important}
  header .nav{
    position:relative;
    justify-content:space-between !important;
  }
  .mobileMenuBtn{display:flex}
  .mobileNav{
    display:none;
    position:absolute;
    top:68px;
    left:0;
    right:0;
    background:#fff;
    border-top:1px solid #dce5df;
    border-bottom:1px solid #dce5df;
    box-shadow:0 18px 35px rgba(20,35,28,.12);
    padding:14px 18px 18px;
    z-index:100;
  }
  .mobileNav.open{display:block}
  .mobileNav a{
    display:block;
    padding:13px 8px;
    font-weight:750;
    border-bottom:1px solid #edf1ee;
  }
  .mobileNav a:last-of-type{border-bottom:0}
  .mobileNav .mobileBrowse{
    margin-top:12px;
    padding:13px 16px;
    text-align:center;
    background:#176b45;
    color:#fff;
    border-radius:11px;
    border:0;
  }
}
