:root{
  color-scheme:light;
  --blue:#2a58a5; --sky:#a3d4f0; --lime:#7ac143; --forest:#206533; --deep:#1e5e30;
  --sage:#d8dbc9; --grey:#f0f0f0; --ink:#222;
  --red:#d7232a; --green:#0b8e45; --fblue:#4274bd; --purple:#5f3e9a;
  box-sizing:border-box;
}
*,*::before,*::after{box-sizing:inherit;margin:0;padding:0}
/* 1rem = 10px of the 906px reference design, scaled to the viewport */
html{font-size:calc(min(100vw,2000px) / 90.6);overflow-x:hidden}
body{max-width:2000px;margin:0 auto;font-family:'Ubuntu','Trebuchet MS',Arial,sans-serif;background:#fff;color:var(--ink);overflow-x:clip;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
section,footer{position:relative}
.up{text-transform:uppercase}

/* HERO */
.hero{height:58.6rem;background:#2d4a12;color:#fff;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
nav{position:absolute;z-index:3;left:3.8rem;right:3.7rem;top:calc(2.2rem + env(safe-area-inset-top,0px));height:4.5rem;background:#fff;border-radius:99rem;display:flex;align-items:center;justify-content:space-between;padding:0 1.2rem 0 2.1rem;color:var(--ink)}
.logo{display:flex;align-items:center;gap:.5rem;font-size:1.75rem;color:#3d3d3d;line-height:1}
.logo img{height:3.1rem;width:auto}
.burger{display:none}
.menu{display:flex;align-items:center;gap:1.3rem;font-size:1.1rem}
.btn-contact{background:var(--blue);color:#fff;padding:.85rem 1.2rem;border-radius:99rem;font-size:1.1rem}
.hero h1{position:absolute;z-index:2;left:4.3rem;top:10.4rem;font-weight:400;font-size:4rem;line-height:4.8rem;letter-spacing:-.01em}
.hero-b{position:absolute;z-index:2;left:49.7rem;right:4.5rem;top:39.5rem}
.hero-b h2{font-weight:400;font-size:2.2rem;line-height:2.8rem}
.hero-b p,.hero-b .pill{margin-left:12.3rem}
.hero-b p{margin-top:1.2rem;width:24.5rem;font-size:1rem;line-height:1.4rem;font-weight:300;text-transform:uppercase}
.pill{display:inline-block;margin-top:1.4rem;border:1px solid #fff;border-radius:99rem;padding:.8rem 1.1rem;font-size:1.05rem;line-height:1}

/* OFFERINGS */
.off{height:68.2rem;display:grid;grid-template-columns:1fr 1fr;background:var(--sage)}
.off::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1.2rem;background:var(--sky);z-index:1}
.off-l{position:relative}
.off-r img{width:100%;height:100%;object-fit:cover}
.off .rule{position:absolute;z-index:2;left:4.3rem;right:0;top:3.4rem;height:.2rem;background:var(--deep)}
.sec-h{position:absolute;left:4.3rem;top:5rem;font-size:1.6rem;font-weight:500;line-height:2rem}
.off .sec-h{color:var(--deep)}
.item{position:absolute;width:19rem}
.item svg{display:block;height:5.4rem;width:5.5rem;stroke:#6dbb4a;stroke-width:1.6;fill:none}
.item h3{margin-top:1rem;font-weight:400;font-size:1.9rem;line-height:2.1rem;color:var(--forest)}
.item p{margin-top:.5rem;font-size:.95rem;line-height:1.4rem;text-transform:uppercase;width:17.6rem}
.i1{left:4.3rem;top:10.2rem}.i2{left:23.2rem;top:22.2rem}.i3{left:4.3rem;top:32.6rem}.i4{left:23.2rem;top:44.1rem}

/* PRODUCTS */
.prod{height:58.5rem;background:var(--grey)}
.prod::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1.2rem;background:var(--blue)}
.prod .rule{position:absolute;left:4.3rem;right:0;top:3.5rem;height:.2rem;background:var(--lime)}
.prod .sec-h{color:var(--lime)}
.chips{position:absolute;left:4.3rem;top:8rem;display:flex;gap:.5rem}
.chip{height:2.4rem;display:flex;align-items:center;padding:0 .8rem;border:1px solid var(--lime);border-radius:.4rem;font-size:1rem;color:var(--lime)}
.chip.on{background:var(--lime);color:#fff}
.cols{position:absolute;left:4.3rem;right:4.2rem;top:34.6rem;display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.col{position:relative;height:20rem;border-top:.6rem solid var(--c);color:var(--c)}
.col h3{margin-top:1.3rem;font-weight:400;font-size:1.9rem;line-height:2.1rem}
.col p{position:absolute;top:9rem;left:0;right:1rem;font-size:.95rem;line-height:1.4rem;text-transform:uppercase;color:var(--ink)}
.col a{position:absolute;top:16rem;left:0;height:2.8rem;display:flex;align-items:center;padding:0 1.1rem;border-radius:99rem;background:var(--c);color:#fff;font-size:1rem}

/* CTA */
.cta{height:29.4rem;display:grid;grid-template-columns:46.5rem 1fr;background:var(--blue)}
.cta .l{background:var(--sky);border-left:1.2rem solid var(--lime);border-right:1.2rem solid var(--lime);padding:2.2rem 0 0 3.1rem;position:relative}
.cta .r{position:relative;padding:2.2rem 0 0 3.3rem;color:#fff}
.cta h2{font-weight:400;font-size:2.4rem;line-height:2.8rem}
.cta .l h2{color:var(--blue)}
.cta .r p{margin-top:1.3rem;width:21rem;font-size:.95rem;line-height:1.4rem;text-transform:uppercase;color:var(--lime)}
.cta-btns{position:absolute;left:3.2rem;top:24.9rem;display:flex;gap:.7rem;top:24.9rem}
.cta-btns a{height:2.8rem;display:flex;align-items:center;padding:0 1rem;border-radius:99rem;font-size:1rem;border:1px solid transparent}
.cta-btns .b1{background:var(--lime);color:#fff}.cta-btns .b2{background:var(--sky);color:var(--blue)}.cta-btns .b3{border-color:#fff;color:#fff}

/* FOOTER */
footer{height:42.9rem;background:var(--forest);color:#fff}
.fc{position:absolute;top:4.1rem;font-size:1.5rem;line-height:1.9rem}
.fc h4{font-weight:400;margin-bottom:.4rem}
.fc a{display:block;color:var(--lime)}
.fc.w a{color:#fff}
.fc.w{top:4.2rem}
.c1{left:4.3rem}.c2{left:25rem}.c3{left:45.7rem}.c4{left:66.4rem}
.flogo{position:absolute;left:4.3rem;top:33.4rem;width:24.9rem;height:6.9rem;background:#fff;border-radius:1.2rem;display:flex;align-items:center;justify-content:center}
.flogo img{width:21.6rem;height:auto}
.fi{position:absolute;top:33.9rem;font-size:.95rem;line-height:1.5rem;color:var(--lime)}
.fi a{display:block}
.copy{position:absolute;left:66.4rem;top:38.9rem;font-size:.95rem;color:var(--lime)}

/* MOBILE (<=820px, down to 320px) */
@media (max-width:820px){
  html{font-size:clamp(10px,3.4vw,13px)}
  .hero{height:auto;min-height:60rem;padding:9.5rem 2rem 3rem;display:flex;flex-direction:column;justify-content:space-between;gap:3rem}
  nav{left:1.2rem;right:1.2rem;height:5rem;padding:0 .8rem 0 1.4rem}
  .logo img{width:clamp(130px,46vw,210px);height:auto}
  .burger{display:flex;flex-direction:column;justify-content:center;gap:.5rem;width:4rem;height:4rem;flex:none;border:0;background:none;cursor:pointer}
  .burger span{display:block;height:2px;background:var(--ink);border-radius:2px;margin:0 .6rem;transition:transform .2s,opacity .2s}
  nav.open .burger span:nth-child(1){transform:translateY(.7rem) rotate(45deg)}
  nav.open .burger span:nth-child(2){opacity:0}
  nav.open .burger span:nth-child(3){transform:translateY(-.7rem) rotate(-45deg)}
  .menu{position:absolute;top:calc(100% + .8rem);left:0;right:0;background:#fff;border-radius:2.4rem;flex-direction:column;align-items:flex-start;gap:1.6rem;padding:2rem 2.4rem;font-size:1.5rem;display:none;box-shadow:0 .6rem 2rem rgba(0,0,0,.18)}
  nav.open .menu{display:flex}
  .btn-contact{font-size:1.4rem;padding:1rem 1.8rem}
  .hero h1,.hero-b{position:static}
  .hero h1{font-size:2.7rem;line-height:3.3rem}
  .hero-b h2{font-size:2rem;line-height:2.6rem}
  .hero-b p,.hero-b .pill{margin-left:0}
  .hero-b p{width:auto;font-size:1.1rem;line-height:1.6rem}
  .pill{font-size:1.2rem;padding:1rem 1.4rem}

  .off{height:auto;grid-template-columns:1fr}
  .off-l{display:flex;flex-direction:column;gap:3rem;padding:8rem 2rem 3.5rem 3rem}
  .off .rule{left:3rem}
  .off-r .rule{display:none}
  .sec-h{position:static;font-size:1.8rem;line-height:2.2rem}
  .item{position:static;width:auto}
  .item p{width:auto;font-size:1.1rem;line-height:1.6rem}
  .item h3{font-size:2rem;line-height:2.3rem}
  .off-r{height:auto;aspect-ratio:4/3}

  .prod{height:auto;padding:8rem 2rem 4rem 3rem}
  .prod .rule{left:3rem}
  .chips,.cols{position:static}
  .prod .sec-h{margin-bottom:1.6rem}
  .chips{margin-bottom:3rem}
  .chip{font-size:1.2rem;height:2.8rem}
  .cols{grid-template-columns:minmax(0,1fr);gap:3rem}
  .col{height:auto;padding-bottom:1rem}
  .col h3{font-size:2.1rem;line-height:2.4rem}
  .col p{position:static;display:block;margin-top:2.6rem;font-size:1.1rem;line-height:1.6rem}
  .col a{position:static;margin-top:2rem;width:max-content;font-size:1.2rem;height:3.2rem}

  .cta{height:auto;grid-template-columns:minmax(0,1fr)}
  .cta .l{min-height:16rem;border-right:0;padding:2.4rem 2rem 3rem}
  .cta .r{padding:2.4rem 2rem 3rem;border-left:1.2rem solid var(--lime)}
  .cta h2{font-size:2.4rem}
  .cta .r p{width:auto;font-size:1.1rem;line-height:1.6rem}
  .cta-btns{position:static;flex-wrap:wrap;margin-top:3rem}
  .cta-btns a{font-size:1.2rem;height:3.2rem}

  footer{height:auto;padding:5rem 2rem 3.5rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 2rem}
  footer>*{min-width:0}
  .fc,.flogo,.fi,.copy{position:static}
  .fc{font-size:1.4rem;line-height:1.9rem}
  .fc.w{top:auto}
  .flogo{grid-column:1/-1;width:100%;max-width:30rem;height:auto;padding:1.4rem 1.6rem;border-radius:1.2rem}
  .flogo img{width:min(100%,24rem)}
  .fi{grid-column:1/-1;font-size:1.2rem;line-height:1.8rem}
  .copy{grid-column:1/-1;font-size:1.2rem}
}

/* Tablet tweaks, focus + reduced motion */
@media (min-width:821px) and (max-width:1000px){.menu{gap:1rem}}
a:focus-visible,button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
html{scroll-behavior:smooth}



/* ABOUT PAGE */
.ah{height:38.2rem;background:#7dba59;color:var(--forest);overflow:hidden}
.ah .shapes{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;font-size:1rem}
.shapes img{position:absolute;display:block;max-width:none}
/* positions in em: 1em = 10px of the 906px design */
.s-a{left:48.5em;top:-31.5em;width:51.2em;height:133.6em}
.s-b{left:52.7em;top:-41.7em;width:80.4em;height:129.3em}
.s-c{left:66.8em;top:-15.1em;width:45.6em;height:80.3em}
.ah h1{position:absolute;z-index:2;left:3.8rem;top:11.9rem;font-weight:400;font-size:4rem;line-height:4.9rem;letter-spacing:-.01em}
.ah p{position:absolute;z-index:2;left:3.8rem;top:23.2rem;width:23rem;font-size:1rem;line-height:1.4rem;text-transform:uppercase}
.dbtn{position:absolute;z-index:2;left:3.8rem;top:30.5rem;height:2.65rem;display:flex;align-items:center;padding:0 1.1rem;background:var(--deep);color:#fff;border-radius:99rem;font-size:1.05rem}

.ap{height:58.6rem;background:#222;color:#fff;overflow:hidden}
.ap>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ap::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(30,28,18,.92) 0,rgba(30,28,18,.55) 18%,rgba(30,28,18,0) 48%),linear-gradient(0deg,rgba(30,28,18,.55),rgba(30,28,18,0) 40%)}
.ap-t{position:absolute;z-index:2;left:4.3rem;top:39rem;width:46rem}
.ap-t small{display:block;font-size:1rem;line-height:1.2rem;text-transform:uppercase}
.ap-t h2{margin-top:1.5rem;font-weight:400;font-size:2.4rem;line-height:2.8rem}
.ap-t p{margin:1.3rem 0 0 13.6rem;width:34.5rem;font-size:1.2rem;line-height:1.7rem;font-weight:300}

.sp{height:46.9rem;display:grid;grid-template-columns:1fr 1fr;background:var(--sky);color:#fff}
.sp .rule{position:absolute;z-index:2;left:4.3rem;right:0;top:3.3rem;height:.2rem;background:var(--lime)}
.sp-l{position:relative;border-left:1.2rem solid var(--lime);overflow:hidden;background:var(--lime)}
.sp-l img{width:100%;height:100%;object-fit:cover}
.sp-l b{position:absolute;z-index:3;left:2.5rem;top:4.9rem;font-weight:300;font-size:2.4rem;line-height:2.4rem}
.sp-r{padding:4.8rem 4rem 0 3.2rem}
.sp-r h2{font-weight:400;font-size:2.4rem;line-height:2.8rem}
.sp-r p{margin-top:1.3rem;width:34.5rem;max-width:100%;font-size:1.2rem;line-height:1.7rem;font-weight:300}
.gap{background:var(--grey)}

@media (max-width:820px){
  .ah{height:auto;padding:11rem 2rem 20rem}
  .ah .shapes{inset:auto 0 0 auto;width:90.6em;height:38.2em;font-size:.5rem}
  .ah h1,.ah p,.dbtn{position:static}
  .ah h1{font-size:2.9rem;line-height:3.6rem}
  .ah p{width:auto;margin-top:2rem;font-size:1.1rem;line-height:1.6rem}
  .dbtn{display:inline-flex;margin-top:2.4rem;height:3.4rem;font-size:1.2rem}
  .ap{height:auto;min-height:48rem;display:flex;flex-direction:column;justify-content:flex-end;padding:8rem 2rem 3rem}
  .ap::after{background:linear-gradient(0deg,rgba(30,28,18,.9),rgba(30,28,18,.55) 55%,rgba(30,28,18,.15))}
  .ap-t{position:relative;left:auto;top:auto;width:auto}
  .ap-t h2{font-size:2.2rem;line-height:2.7rem}
  .ap-t p{margin-left:0;width:auto;font-size:1.2rem;line-height:1.8rem}
  .sp{height:auto;grid-template-columns:minmax(0,1fr)}
  .sp .rule{display:none}
  .sp-l{aspect-ratio:4/3}
  .sp-r{padding:3rem 2rem 4rem}
  .sp-r h2{font-size:2.2rem;line-height:2.7rem}
  .sp-r p{width:auto;font-size:1.2rem;line-height:1.8rem}
}


/* PRODUCT PAGE */
:root{--pb:#3f73b9;--line:#d2d2d2;--hg1:#3d6fb5;--hg2:#8fabd6;--pbl:#5b8bc9;--tcbg:#e5ebf7;--dnum:#a3d4f0;--cbg:#2a58a5}
.ph{height:38.3rem;background:linear-gradient(180deg,var(--hg1) 0,var(--hg2) 5.2rem,var(--grey) 11.8rem),var(--grey);overflow:hidden}
.ph .bar{position:absolute;left:5.4rem;top:11.8rem;width:60.3rem;height:1.15rem;background:var(--pb)}
.ph h1{position:absolute;left:5.4rem;top:14.4rem;font-weight:400;font-size:4.5rem;line-height:5rem;color:#000}
.ph sup{font-size:.55em;vertical-align:top;position:relative;top:.1em;margin-left:.05em}
.ph .tag{position:absolute;left:5.4rem;width:60.3rem;text-align:right;top:14rem;font-weight:700;font-size:1.5rem;line-height:2rem;color:var(--pb)}
.ph .sub{position:absolute;left:5.4rem;top:20.1rem;font-family:'Saira Extra Condensed','Ubuntu Condensed','Arial Narrow',sans-serif;font-weight:500;font-size:2.8rem;line-height:3rem;color:var(--pb)}
.ph .req{position:absolute;left:5.4rem;top:31.3rem;height:2.7rem;display:flex;align-items:center;padding:0 1.3rem;background:var(--pb);color:#fff;border-radius:99rem;font-size:1.15rem}
.ph .pack{position:absolute;right:24.9rem;top:31.5rem;display:flex;align-items:center;gap:.9rem;font-size:1.2rem}
.ph .pack b{font-weight:400;height:2.3rem;display:flex;align-items:center;padding:0 1.05rem;border:1px solid var(--pbl);border-radius:.9rem;color:var(--pb);font-size:1.15rem}
.ph .pack span{margin-right:.2rem}
.ph .pouch{position:absolute;left:70.6rem;top:11.9rem;width:14.7rem;height:auto}

.pb{position:relative;display:grid;grid-template-columns:21.2rem minmax(0,1fr);background:var(--grey);border-left:1.2rem solid var(--strip);padding-right:2.7rem}
.pb.a{--strip:var(--lime)}.pb.b{--strip:var(--blue)}
.side{padding:2.8rem 0 0 3.1rem}
.side-in{position:sticky;top:2.4rem}
.side h4{font-weight:500;font-size:1.6rem;line-height:2rem;color:var(--pb)}
.side h4 sup{font-size:.55em;vertical-align:top;position:relative;top:.05em}
.side ul{list-style:none;margin-top:1rem}
.side a{position:relative;display:block;padding-left:1.1rem;font-size:1.25rem;line-height:2.4rem;color:#777}
.side a.on{color:var(--pb);font-weight:500}
.side a.on::before{content:"";position:absolute;left:0;top:50%;width:.6rem;height:.6rem;margin-top:-.3rem;border-radius:50%;background:var(--pb)}
.pm{background:#fff;padding:2.6rem 2.6rem 7.7rem 2.7rem;min-width:0}
.pb.b .pm{padding-top:4.5rem;padding-bottom:6.3rem}
.pm h2{font-weight:400;color:var(--pb)}
.pm sup{font-size:.55em;vertical-align:top;position:relative;top:.1em}
.lead{font-size:2.25rem;line-height:3.15rem}
.intro{margin-top:1.9rem;width:40.5rem;max-width:100%;font-size:1.05rem;line-height:1.65rem}
.feat{display:grid;grid-template-columns:repeat(3,20.3rem);margin-top:3.7rem}
.feat img{display:block;height:4.8rem;width:auto}
.feat small{display:block;margin-top:.8rem;font-size:.95rem;line-height:1.4rem;text-transform:uppercase;color:var(--pb)}
.feat p{margin-top:.4rem;font-size:1.8rem;line-height:2.2rem;color:#7a7a7a}
.hr{border:0;height:.25rem;background:var(--line);margin:3.5rem 0 0}
.pb.b .hr{margin-top:4.1rem}
.sec{scroll-margin-top:2rem}
.sec h2{margin-top:2.8rem;font-size:2.4rem;line-height:2.8rem}
#directions h2{margin-top:0}
.sub2{margin-top:1.1rem;width:36rem;max-width:100%;font-size:1.1rem;line-height:1.73rem}
.tc{margin-top:2.3rem;background:var(--tcbg);border-radius:1rem;padding:0 1.56rem 1.5rem}
.tc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;height:5.2rem;border-bottom:1px solid var(--pb);font-weight:700;font-size:1.9rem;color:var(--pb)}
.tc summary::-webkit-details-marker{display:none}
.tc summary::after{content:"";width:1.7rem;height:1.7rem;background:linear-gradient(var(--pb),var(--pb)) center/100% .2rem no-repeat,linear-gradient(var(--pb),var(--pb)) center/.2rem 100% no-repeat}
.tc[open] summary::after{background:linear-gradient(var(--pb),var(--pb)) center/100% .2rem no-repeat}
.tc:not([open]) summary{border-bottom-color:transparent}
.tc:not([open]){padding-bottom:0}
.tc small{display:block;font-size:.95rem;line-height:1.4rem;text-transform:uppercase;color:#777}
.tc p{font-size:1.6rem;line-height:1.9rem;color:var(--pb)}
.cond{font-family:'Saira Extra Condensed','Ubuntu Condensed','Arial Narrow',sans-serif;font-weight:500;font-size:1.9rem;line-height:2.2rem;color:var(--pb)}
.r1{display:grid;grid-template-columns:19.2rem 1fr;align-items:center;padding-top:.7rem}
.r2,.r3{display:grid;grid-template-columns:repeat(3,19.2rem)}
.r2{margin-top:2.7rem}.r3{margin-top:2.35rem}
.r2>div,.r3>div{display:flex;flex-direction:column;justify-content:flex-end}
.r2 small,.r3 small{margin-top:.45rem}
.note{margin:2.7rem 0 0 20.6rem;width:36.7rem;max-width:100%;font-size:.85rem;line-height:1.44rem;color:#222}

.pat{display:block;width:100%;height:auto}
.dirs{margin-top:1.3rem}
.dir{display:grid;grid-template-columns:4.5rem 16.1rem 1fr;align-items:start;padding:1.2rem 0 2rem;border-bottom:1px solid var(--line)}
.dir:last-child{border-bottom:0}
.dir b{font-weight:300;font-size:2rem;line-height:2.1rem;color:var(--dnum)}
.dir h3{font-weight:400;font-size:1.6rem;line-height:2.1rem;color:var(--pb)}
.dir p{padding-top:.3rem;font-size:.95rem;line-height:1.35rem;color:#222}
.caut{display:flex;align-items:center;gap:2.3rem;height:8rem;margin-top:2.3rem;padding:0 2.6rem 0 2.8rem;background:var(--cbg);border-radius:.9rem;color:#fff}
.caut svg{flex:none;width:2.4rem;height:2.4rem}
.caut p{font-size:1.1rem;line-height:1.7rem}
.sh{margin-top:3.5rem}
.sr{display:grid;grid-template-columns:15.9rem minmax(0,1fr);padding:1rem 0 2.2rem;border-bottom:1px solid var(--line)}
.sr:last-child{border-bottom:0}
.sr h5{font-weight:400;font-size:.9rem;line-height:1.4rem;text-transform:uppercase;color:var(--pb)}
.sr p,.sr li{font-size:.95rem;line-height:1.4rem;color:#222}
.sr ul{list-style:none}
.sr li{position:relative;padding-left:.9rem}
.sr li::before{content:"•";position:absolute;left:0}

.cta .l .dl-row{display:flex;gap:1rem;margin-top:1.6rem}
.cta .l .dl-row+.dl-row{margin-top:1.2rem}
.dlb{display:inline-flex;align-items:center;height:2.3rem;padding:0 1.2rem;background:var(--blue);color:#fff;border-radius:99rem;font-size:1rem}
.dlb.g{background:var(--lime)}
.dl-ico{position:absolute;right:5rem;bottom:2.5rem;width:5.8rem;height:5.8rem}

@media (max-width:820px){
  .ph{height:auto;padding:11rem 2rem 3.5rem;display:grid;grid-template-columns:minmax(0,1fr) 11rem;grid-template-areas:"bar bar" "t pouch" "tag pouch" "sub pouch" "req req" "pack pack";column-gap:1.6rem;row-gap:1rem;align-items:start}
  .ph .bar,.ph h1,.ph .tag,.ph .sub,.ph .req,.ph .pack,.ph .pouch{position:static}
  .ph .bar{grid-area:bar;width:100%;height:1rem;margin-bottom:1rem}
  .ph h1{grid-area:t;font-size:3.8rem;line-height:4.2rem}
  .ph .tag{grid-area:tag;width:auto;text-align:left;font-size:1.5rem}
  .ph .sub{grid-area:sub;font-size:2.4rem;line-height:2.7rem}
  .ph .pouch{grid-area:pouch;width:100%}
  .ph .req{grid-area:req;justify-self:start;margin-top:1.4rem;height:3.4rem;font-size:1.3rem}
  .ph .pack{grid-area:pack;flex-wrap:wrap;font-size:1.3rem}
  .ph .pack b{height:3rem;font-size:1.25rem}
  .pb{display:block;padding-right:0}
  .side{padding:0;position:sticky;top:0;z-index:5;background:var(--grey)}
  .side-in{position:static;display:flex;align-items:center;gap:1.6rem;padding:1.2rem 1.6rem;overflow-x:auto}
  .side h4{display:none}
  .side ul{display:flex;gap:1.6rem;margin:0}
  .side a{white-space:nowrap;font-size:1.25rem;padding-left:1.2rem}
  .pm,.pb.b .pm{padding:3rem 2rem 4.5rem}
  .lead{font-size:2.1rem;line-height:2.8rem}
  .lead br.d{display:none}
  .intro{width:auto;font-size:1.2rem;line-height:1.8rem}
  .feat{grid-template-columns:minmax(0,1fr);gap:2.6rem;margin-top:3rem}
  .feat img{height:5rem}
  .feat small{font-size:1.1rem}
  .feat p{font-size:2rem;line-height:2.4rem}
  .sec h2{font-size:2.4rem}
  .sub2{width:auto;font-size:1.2rem;line-height:1.8rem}
  .tc{padding:0 1.6rem 1.8rem}
  .tc summary{height:5.2rem;font-size:2rem}
  .tc small{font-size:1rem;line-height:1.5rem}
  .tc p{font-size:1.8rem;line-height:2.2rem}
  .cond{font-size:2.1rem}
  .r1,.r2,.r3{grid-template-columns:minmax(0,1fr);row-gap:1.8rem}
  .r1{padding-top:1.8rem}.r2,.r3{margin-top:1.8rem}
  .note{margin-left:0;width:auto;font-size:.95rem;line-height:1.5rem}
  .pat{height:16rem;object-fit:cover}
  .dir{grid-template-columns:4.2rem minmax(0,1fr);row-gap:.8rem}
  .dir h3{font-size:1.8rem;line-height:2.3rem}
  .dir p{grid-column:2;font-size:1.05rem;line-height:1.55rem}
  .caut{height:auto;padding:2rem;gap:1.6rem}
  .caut p{font-size:1.2rem;line-height:1.8rem}
  .sr{grid-template-columns:minmax(0,1fr);row-gap:.8rem}
  .sr h5{font-size:1.05rem}
  .sr p,.sr li{font-size:1.15rem;line-height:1.7rem}
  .dlb{height:3.2rem;font-size:1.2rem}
  .cta .l .dl-row{flex-wrap:wrap}
  .dl-ico{position:static;display:block;margin:2.4rem 0 0 auto;width:5.8rem;height:5.8rem}
}


/* HERBICIDE THEME */
.herb{--pb:#088944;--hg1:#118d4b;--hg2:#8cc3a5;--pbl:#088944;--tcbg:#e1f1e9;--dnum:#088944;--cbg:#088944}
.ph .pill{position:absolute;left:5.4rem;top:29.2rem;width:32.8rem;height:4.8rem;display:flex;align-items:center;padding-left:3.2rem;background:var(--pb);border-radius:99rem;color:#fff}
.ph .pill>div{flex:0 0 9rem}
.ph .pill small{display:block;font-size:1rem;line-height:1.3rem;font-weight:300;text-transform:uppercase}
.ph .pill b{display:block;font-size:1.4rem;line-height:1.7rem;font-weight:500}
.tc+.tc{margin-top:1.35rem}
.herb .tc:not([open]) summary{border-bottom-color:transparent}
.herb .sr{border-top:1px solid var(--line);border-bottom:0;padding:1.2rem 0 3.2rem}
.herb .sr:last-child{padding-bottom:0}
.pb.b.split{border-left:0;padding-left:1.2rem}
.pb.b.split::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1.2rem;background:linear-gradient(var(--blue) var(--split,40.6%),var(--lime) var(--split,40.6%))}
.herb .caut svg{width:2.6rem;height:2.6rem}
@media (min-width:821px){
  .herb .ph .pouch{left:71.3rem;top:12.2rem;width:13.9rem}
}
@media (max-width:820px){
  .ph .pill{grid-area:req;position:static;width:100%;height:auto;padding:1.4rem 2rem;gap:1rem 2.4rem;flex-wrap:wrap;border-radius:2.6rem;margin-top:1.4rem}
  .ph .pill>div{flex:0 0 auto}
  .ph .pill small{font-size:1.05rem}
  .ph .pill b{font-size:1.6rem;line-height:2rem}
  .herb .sr{padding:1.4rem 0 2.4rem}
}


/* PGR THEME */
.pgr{--pb:#62469c;--hg1:#684ca0;--hg2:#b3a6d0;--pbl:#62469c;--tcbg:#ece9f2;--dnum:#b9a5df;--cbg:#5a3f93;--split:44.4%}
@media (min-width:821px){
  .pgr .ph .pack{width:25.8rem;flex-wrap:wrap;justify-content:flex-end;gap:.6rem;top:28.7rem}
  .pgr .ph .pack span{width:auto}
  .pgr .ph .pouch{left:70.3rem;top:11.8rem;width:12.6rem}
}


/* INSECTICIDE THEME */
.ins{--pb:#d7232a;--hg1:#d7232a;--hg2:#ecaeb0;--pbl:#d7232a;--tcbg:#f8e6e7;--dnum:#eaa4a7;--cbg:#d7232a;--split:40.6%}
.ph-box{display:flex;align-items:center;justify-content:center;border:2px dashed var(--pb);border-radius:.8rem;background:rgba(215,35,42,.06);color:var(--pb);font-size:1.2rem;text-align:center}
.pat-ph{background:linear-gradient(120deg,#6e1216 0,#d7232a 55%,#f0a4a7 100%)}
@media (min-width:821px){
  .ins .ph .pouch{left:70.6rem;top:11.9rem;width:14.7rem;height:auto}
  .pat-ph{height:32.8rem}
}
@media (max-width:820px){
  .ph-box{height:16rem}
}