/* ===========================================================
   WAAKI FOODS — shared design system
   Used by index, shop, process, story, wholesale
   =========================================================== */
:root{
  --white:#FFFFFF;
  --cream:#FBF7EE;
  --cream-2:#F4EEDF;
  --mint:#EDF4E9;
  --sage:#DCE8D4;
  --green:#2E7D4E;
  --green-deep:#1F5C39;
  --green-bright:#5BA873;
  --ink:#1E2A20;
  --ink-soft:#566256;
  --saffron:#F0A92B;
  --pineapple:#E7B72A;
  --apple:#C24536;
  --khaki:#8C8056;
  --khaki-deep:#6E633F;
  --line:rgba(30,42,32,.12);
  --line-soft:rgba(255,255,255,.22);

  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --body:'DM Sans',system-ui,-apple-system,Segoe UI,sans-serif;

  --wrap:1240px;
  --gut:clamp(1.2rem,4vw,3.5rem);
  --sec:clamp(4rem,8vw,7rem);
  --r:18px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--body);background:var(--cream);color:var(--ink);
  font-size:clamp(1rem,.96rem + .2vw,1.08rem);line-height:1.6;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4{font-family:var(--display);font-weight:500;line-height:1.05;letter-spacing:-.01em;margin:0}
p{margin:0}
a{color:inherit}

.skip{position:absolute;left:-999px;top:0;z-index:300;background:var(--green);color:#fff;
  padding:.7rem 1.1rem;border-radius:0 0 12px 0;text-decoration:none;font-weight:600;font-size:.85rem}
.skip:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:3px solid var(--green-bright);outline-offset:3px;border-radius:4px}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.section{padding-block:var(--sec)}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--green);margin:0}
.lead{color:var(--ink-soft);font-size:clamp(1.05rem,1rem + .35vw,1.2rem)}
.center{text-align:center}
.center .lead{margin-inline:auto}
.s-cream{background:var(--cream)}
.s-mint{background:var(--mint)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--body);font-weight:700;
  font-size:.92rem;letter-spacing:.02em;text-decoration:none;cursor:pointer;border-radius:999px;
  padding:.95rem 1.7rem;border:2px solid var(--green);background:var(--green);color:#fff;
  transition:transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease}
.btn:hover{background:var(--green-deep);border-color:var(--green-deep);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--green)}
.btn--ghost:hover{background:var(--green);color:#fff;border-color:var(--green)}
.btn--cream{background:var(--cream);border-color:var(--cream);color:var(--green-deep)}
.btn--cream:hover{background:#fff;border-color:#fff;color:var(--green-deep)}
.btn .arr{transition:transform .25s ease}
.btn:hover .arr{transform:translateX(3px)}
.textlink{font-weight:700;font-size:.9rem;text-decoration:none;color:var(--green);
  display:inline-flex;align-items:center;gap:.5rem;border-bottom:2px solid var(--green-bright);padding-bottom:2px;
  transition:gap .25s ease}
.textlink:hover{gap:.85rem}

/* announcement */
.announce{background:var(--green);color:#fff;display:flex;justify-content:center;gap:2.2rem;
  flex-wrap:wrap;padding:.6rem 1rem;font-size:.78rem;font-weight:500;letter-spacing:.02em;text-align:center}
.announce b{font-weight:700}
.announce .dot{opacity:.5}

/* nav */
.nav{position:sticky;top:0;z-index:200;background:var(--cream);transition:box-shadow .35s ease,background .35s ease}
.nav.is-stuck{box-shadow:0 2px 20px rgba(30,42,32,.08);background:rgba(251,247,238,.92);backdrop-filter:blur(8px)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  max-width:var(--wrap);margin-inline:auto;padding:.9rem var(--gut)}
.brand{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--ink)}
.brand__mark{width:34px;height:34px;flex:none}
.brand__name{font-family:var(--display);font-size:1.6rem;font-weight:600;letter-spacing:.005em;line-height:1}
.nav__menu{display:flex;align-items:center;gap:1.9rem;list-style:none;margin:0;padding:0}
.nav__menu>li{position:relative}
.nav__menu a,.nav__menu .shopbtn{font-family:var(--body);font-weight:500;font-size:.95rem;
  text-decoration:none;color:var(--ink);background:none;border:none;cursor:pointer;padding:.4rem 0;
  display:inline-flex;align-items:center;gap:.35rem}
.nav__menu a:hover,.nav__menu .shopbtn:hover{color:var(--green)}
.nav__menu a[aria-current="page"]{color:var(--green);border-bottom:2px solid var(--green)}
.shopbtn svg{width:14px;height:14px;transition:transform .25s ease}
.nav__menu>li.is-open .shopbtn svg{transform:rotate(180deg)}
.dropdown{position:absolute;top:calc(100% + 12px);left:0;min-width:210px;background:#fff;
  border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 36px rgba(30,42,32,.12);
  padding:.5rem;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s}
.nav__menu>li:hover .dropdown,.nav__menu>li.is-open .dropdown{opacity:1;visibility:visible;transform:none}
.dropdown a{display:block;padding:.65rem .8rem;border-radius:9px;font-weight:500}
.dropdown a:hover{background:var(--mint)}
.nav__actions{display:flex;align-items:center;gap:.7rem}
.iconbtn{background:none;border:none;cursor:pointer;color:var(--ink);padding:.45rem;border-radius:10px;
  display:inline-flex;transition:background .2s ease}
.iconbtn:hover{background:var(--sage)}
.iconbtn svg{width:22px;height:22px}
.cart{position:relative}
.cart__count{position:absolute;top:-2px;right:-2px;background:var(--saffron);color:var(--ink);
  font-size:.62rem;font-weight:700;min-width:1.05rem;height:1.05rem;border-radius:999px;
  display:flex;align-items:center;justify-content:center;padding:0 .25rem;border:2px solid var(--cream)}
.nav__toggle{display:none}

/* hero (home) */
.hero{position:relative;background:var(--mint);overflow:hidden;isolation:isolate}
.hero__scene{position:absolute;inset:0;z-index:-1}
.hero__scene svg{width:100%;height:100%;object-fit:cover}
.hero__inner{display:flex;align-items:center;min-height:clamp(440px,72vh,640px);padding-block:clamp(2.5rem,6vw,4rem)}
.hero__card{max-width:560px;background:rgba(251,247,238,.86);backdrop-filter:blur(2px);
  border-radius:26px;padding:clamp(1.8rem,4vw,3rem)}
.hero h1{font-size:clamp(2.7rem,7vw,4.8rem);letter-spacing:-.02em;margin:.9rem 0}
.hero h1 em{font-style:italic;color:var(--green)}
.hero__lead{max-width:42ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;margin-top:1.8rem}
.hero__trust{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:.5rem .9rem;font-size:.8rem;font-weight:600;color:var(--ink-soft)}
.hero__trust span{display:inline-flex;align-items:center;gap:.4rem}
.hero__trust svg{width:15px;height:15px;color:var(--green)}

/* page hero (inner pages) */
.pagehero{background:var(--mint);text-align:center;position:relative;overflow:hidden}
.pagehero__inner{padding-block:clamp(2.8rem,6vw,4.8rem);position:relative;z-index:1}
.pagehero h1{font-size:clamp(2.4rem,6vw,4.2rem);margin:.6rem 0}
.pagehero h1 em{font-style:italic;color:var(--green)}
.pagehero p{max-width:52ch;margin:.3rem auto 0;color:var(--ink-soft);font-size:1.12rem}

/* statement */
.statement{background:var(--cream)}
.statement__inner{max-width:860px;margin-inline:auto;text-align:center;padding-block:clamp(3rem,6vw,5rem)}
.statement h2{font-size:clamp(2rem,4.5vw,3.2rem)}
.statement p{margin-top:1.1rem;color:var(--ink-soft);font-size:1.12rem;max-width:60ch;margin-inline:auto}

/* products */
.shop{background:var(--cream)}
.shop__head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.4rem}
.shop__head h2{font-size:clamp(2rem,4.5vw,3rem)}
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.5rem)}
.products.cols-3{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border-radius:var(--r);border:1px solid var(--line);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 22px 40px rgba(30,42,32,.1)}
.card__media{position:relative;aspect-ratio:1;display:block;overflow:hidden}
.card__media .layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  transition:opacity .45s ease,transform .45s ease}
.card__media .layer svg{width:62%}
.card__media .front{opacity:1}
.card__media .back{opacity:0;transform:scale(1.04)}
.card:hover .front,.card:focus-within .front{opacity:0}
.card:hover .back,.card:focus-within .back{opacity:1;transform:none}
.card__tag{position:absolute;top:.8rem;left:.8rem;z-index:2;background:var(--green);color:#fff;
  font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.32rem .6rem;border-radius:999px}
.card__tag.alt{background:var(--saffron);color:var(--ink)}
.card__body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;flex:1}
.card__body h3{font-size:1.5rem;margin-bottom:.2rem}
.card__body h3 a{text-decoration:none}
.card__sub{font-size:.86rem;color:var(--ink-soft);margin-bottom:1rem;flex:1}
.card__row{display:flex;align-items:center;justify-content:space-between;gap:.8rem}
.card__price{font-weight:700;font-size:1.05rem}
.card__price small{font-weight:500;color:var(--ink-soft);font-size:.78rem}
.card__add{font-family:var(--body);font-weight:700;font-size:.82rem;background:var(--ink);color:#fff;
  border:none;border-radius:999px;padding:.6rem 1.05rem;cursor:pointer;transition:background .25s ease}
.card__add:hover{background:var(--green)}
.shop__all{text-align:center;margin-top:2.6rem}

/* filter chips */
.filters{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-bottom:2.6rem}
.chip{font-family:var(--body);font-weight:600;font-size:.86rem;background:#fff;border:1.5px solid var(--line);
  border-radius:999px;padding:.55rem 1.15rem;cursor:pointer;color:var(--ink);transition:background .2s ease,border-color .2s ease,color .2s ease}
.chip:hover{border-color:var(--green)}
.chip[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}

/* pure ingredients band */
.pure{background:var(--green);color:#fff;text-align:center}
.pure__inner{padding-block:clamp(3rem,6vw,4.5rem)}
.pure h2{font-size:clamp(2rem,4.5vw,3rem);color:#fff}
.pure p{margin-top:.9rem;font-size:1.1rem;color:rgba(255,255,255,.9)}
.pure__badges{display:flex;justify-content:center;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.badge{border:1.5px solid var(--line-soft);border-radius:999px;padding:.5rem 1.1rem;font-size:.82rem;font-weight:600;letter-spacing:.04em}

/* value icons */
.values{background:var(--cream)}
.values__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.6rem,3vw,2.6rem)}
.vcol{text-align:center}
.vcol__icon{width:96px;height:96px;margin:0 auto 1.2rem;background:var(--mint);border-radius:50%;display:flex;align-items:center;justify-content:center}
.vcol__icon svg{width:48px;height:48px;color:var(--green)}
.vcol h3{font-size:1.05rem;font-family:var(--body);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.vcol p{margin-top:.6rem;color:var(--ink-soft);font-size:.92rem;max-width:24ch;margin-inline:auto}
.vcol .tag{display:block;margin-top:.7rem;font-family:var(--display);font-style:italic;font-size:1.15rem;color:var(--green)}

/* generic prose / split */
.prose{max-width:66ch;margin-inline:auto}
.prose p{margin-top:1.1rem;color:var(--ink-soft);font-size:1.08rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.split h2{font-size:clamp(2rem,4.5vw,3rem)}
.split h2 em{font-style:italic;color:var(--green)}
.split .lead{margin-top:1.2rem;max-width:44ch}
.split .map{width:100%;background:var(--sage);border-radius:var(--r);border:1px solid var(--green-bright)}

/* process steps */
.psteps{display:grid;gap:1.1rem;max-width:820px;margin-inline:auto}
.pstep{display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:start;background:#fff;
  border:1px solid var(--line);border-radius:var(--r);padding:1.5rem 1.6rem}
.pstep__no{width:52px;height:52px;border-radius:50%;background:var(--mint);color:var(--green);
  font-family:var(--display);font-size:1.5rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
.pstep h3{font-size:1.4rem}
.pstep p{margin-top:.4rem;color:var(--ink-soft);font-size:.98rem}

/* compare */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.5rem);max-width:920px;margin-inline:auto}
.compare__col{border-radius:var(--r);padding:1.9rem;border:1px solid var(--line)}
.compare__col.no{background:#fff}
.compare__col.yes{background:var(--mint);border-color:var(--sage)}
.compare__col h3{font-family:var(--body);font-weight:700;font-size:1.02rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:1.1rem}
.compare ul{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
.compare li{display:flex;gap:.7rem;align-items:flex-start;font-size:.98rem}
.compare li svg{width:20px;height:20px;flex:none;margin-top:2px}
.compare .no li svg{color:var(--apple)}
.compare .yes li svg{color:var(--green)}

/* reports / standards */
.reports{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:980px;margin-inline:auto}
.report{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.7rem;text-align:center}
.report svg{width:42px;height:42px;color:var(--green);margin:0 auto 1rem}
.report h3{font-size:1.25rem;margin-bottom:.4rem}
.report p{font-size:.88rem;color:var(--ink-soft);margin-bottom:1.2rem}

/* feature grid */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.5vw,2rem)}
.feat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.9rem}
.feat__icon{width:54px;height:54px;border-radius:14px;background:var(--mint);display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem}
.feat__icon svg{width:28px;height:28px;color:var(--green)}
.feat h3{font-size:1.3rem;margin-bottom:.4rem}
.feat p{color:var(--ink-soft);font-size:.94rem}

/* form */
.form{max-width:740px;margin-inline:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.6rem,3vw,2.6rem)}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field.full{grid-column:1/-1}
.field label{font-weight:600;font-size:.85rem}
.field input,.field select,.field textarea{font-family:var(--body);font-size:.98rem;border:1.5px solid var(--line);
  border-radius:11px;padding:.8rem 1rem;background:var(--cream);color:var(--ink);width:100%}
.field textarea{resize:vertical;min-height:120px}
.form__submit{margin-top:1.5rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.ackmsg{font-weight:600;font-size:.88rem;color:var(--green);min-height:1rem}

/* reviews */
.reviews{background:var(--mint)}
.reviews__head{text-align:center;margin-bottom:2.6rem}
.reviews__head h2{font-size:clamp(2rem,4.5vw,3rem)}
.reviews__head .stars{color:var(--saffron);font-size:1.3rem;letter-spacing:.15em;margin-top:.6rem}
.reviews__head p{color:var(--ink-soft);margin-top:.4rem;font-size:.9rem}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.rcard{background:#fff;border-radius:var(--r);border:1px solid var(--line);padding:1.6rem}
.rcard .stars{color:var(--saffron);letter-spacing:.12em;font-size:1rem}
.rcard h4{font-family:var(--body);font-weight:700;font-size:1rem;margin:.8rem 0 .5rem}
.rcard p{color:var(--ink-soft);font-size:.92rem;line-height:1.55}
.rcard .who{margin-top:1.1rem;font-size:.82rem;font-weight:600;color:var(--ink)}
.rcard .who span{color:var(--ink-soft);font-weight:400}

/* cta band */
.ctaband{background:var(--green);color:#fff;text-align:center;border-radius:var(--r);padding:clamp(2.4rem,5vw,3.8rem)}
.ctaband h2{color:#fff;font-size:clamp(1.9rem,4vw,2.9rem)}
.ctaband p{color:rgba(255,255,255,.88);margin-top:.8rem;max-width:48ch;margin-inline:auto}
.ctaband .btn{margin-top:1.6rem}
.ctaband .btn--cream{color:var(--green-deep)}

/* newsletter */
.news{background:var(--green-deep);color:#fff;position:relative;overflow:hidden}
.news__inner{padding-block:clamp(3.2rem,6vw,5rem);text-align:center;position:relative;z-index:1;max-width:640px;margin-inline:auto}
.news h2{font-size:clamp(2rem,4.5vw,3rem);color:#fff}
.news p{margin-top:.9rem;color:rgba(255,255,255,.85);font-size:1.05rem}
.news__form{margin-top:1.8rem;display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}
.news__form input{flex:1;min-width:220px;background:rgba(255,255,255,.1);border:1.5px solid var(--line-soft);
  color:#fff;border-radius:999px;padding:.95rem 1.3rem;font-family:var(--body);font-size:.98rem}
.news__form input::placeholder{color:rgba(255,255,255,.55)}
.news__form .ackmsg{color:var(--saffron)}
.news .ackrow{margin-top:1rem;min-height:1rem}
.news__leaf{position:absolute;color:var(--green-bright);opacity:.16;z-index:0}
.news__leaf.l1{top:-30px;left:-20px;width:200px;transform:rotate(20deg)}
.news__leaf.l2{bottom:-40px;right:-10px;width:240px;transform:rotate(-160deg)}

/* credentials strip */
.creds{background:var(--cream-2);border-top:1px solid var(--line)}
.creds__inner{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2.4rem;padding-block:clamp(1.6rem,3vw,2.2rem)}
.cred{display:flex;align-items:center;gap:.7rem;font-size:.84rem}
.cred svg{width:24px;height:24px;color:var(--green);flex:none}
.cred b{display:block;font-weight:700;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.cred span{font-weight:600}

/* footer */
.footer{background:var(--ink);color:rgba(255,255,255,.72)}
.footer__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.5fr;gap:clamp(1.8rem,4vw,3rem);padding-block:clamp(3.2rem,6vw,4.5rem) clamp(2.4rem,4vw,3rem)}
.footer__brand .brand__name{color:#fff}
.footer__tag{margin:1.1rem 0;font-family:var(--display);font-size:1.45rem;color:#fff;max-width:20ch;line-height:1.15}
.foot-social{display:flex;gap:.7rem;margin-top:1.2rem}
.foot-social a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .25s ease,border-color .25s ease}
.foot-social a:hover{background:var(--green);border-color:var(--green)}
.foot-social svg{width:18px;height:18px}
.footer__col h4{font-family:var(--body);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green-bright);margin:0 0 1.1rem}
.footer__col ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.footer__col a{color:rgba(255,255,255,.72);text-decoration:none;font-size:.94rem;transition:color .2s ease}
.footer__col a:hover{color:#fff}
.footer__col address{font-style:normal;font-size:.94rem;line-height:1.7}
.footer__col address a{display:inline}
.footer__col address b{display:block;font-weight:700;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;margin-top:.9rem;margin-bottom:.15rem;color:var(--green-bright)}
.footer__bottom{border-top:1px solid rgba(255,255,255,.12);padding-block:1.5rem 2.2rem;display:flex;flex-wrap:wrap;gap:.5rem 1.3rem;align-items:center;font-size:.78rem;color:rgba(255,255,255,.55)}
.footer__bottom a{color:rgba(255,255,255,.55);text-decoration:none}
.footer__bottom a:hover{color:#fff}
.footer__bottom .sep{opacity:.4}
.pay{display:flex;gap:.4rem;margin-left:auto;flex-wrap:wrap}
.pay span{font-size:.6rem;font-weight:700;letter-spacing:.06em;background:rgba(255,255,255,.1);border-radius:5px;padding:.25rem .45rem;color:rgba(255,255,255,.7)}

.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* responsive */
@media (max-width:980px){
  .products,.products.cols-3{grid-template-columns:repeat(2,1fr)}
  .values__grid{grid-template-columns:repeat(2,1fr)}
  .rgrid{grid-template-columns:1fr}
  .footer__top{grid-template-columns:1fr 1fr}
}
@media (max-width:880px){
  .split,.compare,.reports,.feats{grid-template-columns:1fr}
  .form__grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .nav__menu{display:none}
  .nav__menu.is-mobile{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 16px 30px rgba(30,42,32,.1);padding:.5rem var(--gut)}
  .nav__menu.is-mobile>li{border-top:1px solid var(--line)}
  .nav__menu.is-mobile>li:first-child{border-top:0}
  .nav__menu.is-mobile a,.nav__menu.is-mobile .shopbtn{padding:1rem 0;width:100%}
  .nav__menu.is-mobile .dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 .6rem .8rem;min-width:0}
  .nav__toggle{display:inline-flex}
  .nav{position:relative}
}
@media (max-width:560px){
  .products,.products.cols-3{grid-template-columns:1fr}
  .values__grid{grid-template-columns:1fr}
  .announce{gap:0}.announce .a2,.announce .dot{display:none}
}