/** Shopify CDN: Minification failed

Line 2066:0 Unexpected "<"

**/

/* ============================================================
   SHELL TOKENS — theme-aware (chrome around the device preview)
   ============================================================ */
:root{
  --shell-bg:#EFEAE1;
  --shell-surface:#FFFFFF;
  --shell-ink:#1A1713;
  --shell-muted:#6B6259;
  --shell-line:#D9D1C4;
  --shell-gold:#8E6B26;
  --shell-chip:#E4DCCD;
}


@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --shell-bg:#111010;
    --shell-surface:#1C1A18;
    --shell-ink:#F2EDE4;
    --shell-muted:#9C9287;
    --shell-line:#312D28;
    --shell-gold:#CBA35C;
    --shell-chip:#262320;
  }
}


:root[data-theme="dark"]{
  --shell-bg:#111010;
  --shell-surface:#1C1A18;
  --shell-ink:#F2EDE4;
  --shell-muted:#9C9287;
  --shell-line:#312D28;
  --shell-gold:#CBA35C;
  --shell-chip:#262320;
}



/* ============================================================
   SHOP TOKENS — fixed. This is a rendering of a real storefront,
   so the screen keeps one committed light palette in every theme.
   ============================================================ */
:root{
  /* Inkt en papier komen van het product zelf: het zwart van de pot en de
     neutrale studio-achtergrond waarop alle productfoto's geschoten zijn
     (#F3F3F3 gemeten). Geen crème — crème vloekt met die foto's. */
  --ink:#14120F;
  --ink-2:#3B352D;
  --ink-3:#6E6558;
  --muted:#6B6357;
  --paper:#F9F2EC;
  --paper-2:#F0E8E0;
  --bone:#F9F2EC;
  --bone-2:#F0E8E0;
  --white:#FFFFFF;

  /* Goud gemeten van de folie op het etiket (#C89820), niet de dofbruine
     variant die er eerst stond. Twee dieptes: één voor tekst op licht,
     één metallic voor op zwart. */
  --gold:#805C12;
  --gold-ink:#8A6414;
  --gold-bright:#FFD700;
  --gold-soft:#E7D3A4;
  --gold-tint:#FAF3E3;

  /* Elk product zijn eigen kleur, gemeten uit de gummie op de foto. */
  --p-blackseed:#764686;
  --p-shilajit:#6D3C43;
  --p-matcha:#5E8C22;
  --p-cranberry:#C1121F;
  --p-kids:#8257B0;

  --berry:#764686;
  --berry-soft:#F3EEF5;
  --moss:#3F6B4F;
  --moss-soft:#EAF1EC;
  --amber:#8A6414;
  --amber-soft:#FAF3E3;
  --line:#E6DDD3;
  --line-strong:#C9BFB3;
}



*{box-sizing:border-box;}


html{-webkit-text-size-adjust:100%;}


body{
  margin:0;
  background:var(--shell-bg);
  color:var(--shell-ink);
  font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  line-height:1.55;
}


img{max-width:100%;display:block;}


button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;}


:focus-visible{outline:2px solid var(--shell-gold);outline-offset:2px;border-radius:4px;}


@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}


/* Twee stemmen. De serif voert het verhaal — dat is de letter van het etiket
   zelf, hoog contrast en smal. De grotesk voert de transactie: prijzen, knoppen,
   productnamen, alles wat je moet kunnen scannen zonder te lezen. */
.shop h1,.shop h2,.shop .display{
  font-family:"Instrument Serif",Georgia,"Times New Roman",serif;
  font-weight:400;letter-spacing:-.012em;line-height:1.04;margin:0;text-wrap:balance;
}


.shop h3,.shop .display--ui{
  font-family:Archivo,sans-serif;font-weight:800;
  letter-spacing:-.035em;line-height:1.06;margin:0;text-wrap:balance;
}


.shop em.acc{font-style:italic;color:var(--gold-ink);}


:where(.shop) p{margin:0;}


.wrap{padding-left:18px;padding-right:18px;}


.sec{padding-top:44px;padding-bottom:44px;}


.sec--tight{padding-top:30px;padding-bottom:30px;}


.eyebrow{
  font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold);margin:0 0 12px;
}


.lede{font-size:15px;line-height:1.6;color:var(--ink-2);max-width:62ch;}


.muted{color:var(--muted);}


.num{font-variant-numeric:tabular-nums;}



/* announcement */
.anno{
  background:var(--ink);color:#F0E7D6;
  font-size:12px;font-weight:600;letter-spacing:.01em;
  display:flex;justify-content:center;gap:22px;padding:9px 14px;text-align:center;
}


.anno span{display:flex;align-items:center;gap:6px;white-space:nowrap;}


.anno .dot{width:3px;height:3px;border-radius:99px;background:var(--gold);flex:none;}


.anno .hide-s{display:none;}



/* header */
.hdr{
  position:sticky;top:0;z-index:30;background:var(--white);
  border-bottom:1px solid var(--line);
}


.hdr__in{display:flex;align-items:center;gap:14px;padding:12px 18px;}


/* Tikdoelen in de kop op minimaal 44px. De hoogte van de balk verandert niet:
   de extra ruimte zit in padding met een even grote negatieve marge. */
.burger{display:flex;flex-direction:column;justify-content:center;gap:4px;
  min-width:44px;min-height:44px;align-items:center;padding:12px 10px;margin:-12px -6px;}


.burger i{display:block;width:19px;height:2px;background:var(--ink);border-radius:2px;}


.logo{
  font-family:Archivo,sans-serif;font-weight:800;font-size:19px;letter-spacing:-.05em;
  margin:0 auto;color:var(--ink);display:flex;align-items:baseline;gap:1px;
}


.logo em{font-style:normal;color:var(--gold);}


.hdr__act{display:flex;gap:6px;align-items:center;}


.hdr__act>button{display:grid;place-items:center;min-width:44px;min-height:44px;margin:-12px 0;}


.icn{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.7;}


.cartdot{position:relative;}


.cartdot b{
  position:absolute;top:-5px;right:-7px;background:var(--berry);color:#fff;
  font-size:10px;font-weight:700;border-radius:99px;min-width:16px;height:16px;
  display:grid;place-items:center;padding:0 4px;
}


.navbar{display:none;}



/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border-radius:99px;font-weight:700;font-size:15px;letter-spacing:-.01em;
  padding:15px 24px;text-decoration:none;transition:transform .12s, background .15s, box-shadow .15s;
  width:100%;
}


.btn:active{transform:translateY(1px);}


.btn--gold{background:var(--gold);color:#fff;box-shadow:0 6px 18px -8px rgba(168,129,60,.9);}


.btn--gold:hover{background:#96722F;}


.btn--ink{background:var(--ink);color:#FBF7F0;}


.btn--ink:hover{background:#241F19;}


.btn--ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line-strong);}


.btn--ghost:hover{border-color:var(--ink);}


.btn--sm{padding:11px 18px;font-size:14px;width:auto;}


.btn__sub{font-weight:500;opacity:.72;font-size:13px;}



/* trust ticks */
.ticks{display:flex;flex-direction:column;gap:9px;}


.tick{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--ink-2);line-height:1.4;}


.tick svg{flex:none;width:16px;height:16px;margin-top:2px;stroke:var(--moss);fill:none;stroke-width:2.4;}



/* stars */
.stars{display:inline-flex;gap:1.5px;}


.stars svg{width:13px;height:13px;fill:var(--gold);}


.rating{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ink-2);flex-wrap:wrap;}


.rating .src{color:var(--muted);font-weight:500;}



/* ---------- HERO ---------- */
.hero{background:var(--white);border-bottom:1px solid var(--line);}


.hero__copy{padding:22px 18px 22px;}


.hero h1{font-size:41px;line-height:1.02;letter-spacing:-.015em;}


.hero h1 em{font-style:italic;color:var(--gold-ink);}


.hero__sub{margin-top:12px;font-size:14.8px;line-height:1.5;color:var(--ink-2);max-width:40ch;}


.hero__cta{margin-top:18px;display:flex;flex-direction:column;gap:10px;}


.hero__proof{
  margin-top:14px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;
  font-size:13px;color:var(--muted);
}


.hero__proof b{color:var(--ink);font-weight:700;}


.hero__img{position:relative;background:var(--bone-2);}


.hero__img img{width:100%;aspect-ratio:4/3;object-fit:cover;}


.hero__tag{
  position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.94);
  backdrop-filter:blur(6px);border-radius:12px;padding:9px 13px;
  font-size:12px;font-weight:600;color:var(--ink);box-shadow:0 4px 16px -6px rgba(0,0,0,.3);
}



/* ---------- USP STRIP ---------- */
.usp{background:var(--ink);color:#EFE6D6;padding:16px 0;}


.usp__row{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;}


.usp__row::-webkit-scrollbar{display:none;}


.usp__i{
  flex:none;padding:0 18px;font-size:12.5px;font-weight:600;line-height:1.35;
  border-right:1px solid #2E2820;white-space:nowrap;display:flex;align-items:center;gap:8px;
}


.usp__i:last-child{border-right:0;}


.usp__i svg{width:14px;height:14px;stroke:var(--gold-soft);fill:none;stroke-width:2.2;flex:none;}



/* ---------- SECTION HEAD ---------- */
.shead{margin-bottom:20px;}


.shead h2{font-size:33px;line-height:1.04;}


.shead p{margin-top:9px;font-size:14.5px;color:var(--muted);max-width:52ch;}



/* ---------- PRODUCT CARDS ---------- */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}


.pcard{
  background:var(--white);border:1px solid var(--line);border-radius:16px;
  overflow:hidden;display:flex;flex-direction:column;position:relative;
  transition:border-color .15s, box-shadow .15s;
  text-decoration:none;color:var(--ink);
}


:where(.shop) a{color:inherit;text-decoration:none;}


.pcard:hover{border-color:var(--line-strong);box-shadow:0 8px 24px -14px rgba(0,0,0,.28);}


.pcard__img{background:var(--bone-2);position:relative;}


.pcard__img img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 42%;}


.pcard__flag{
  position:absolute;top:9px;left:9px;background:var(--ink);color:var(--gold-soft);
  font-size:9.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:4px 8px;border-radius:5px;
}


.pcard__flag--kids{background:var(--berry);color:#F6E7F1;}


.pcard__b{padding:12px 12px 14px;display:flex;flex-direction:column;gap:5px;flex:1;}


.pcard__n{font-family:Archivo,sans-serif;font-weight:700;font-size:15px;letter-spacing:-.03em;line-height:1.12;}


.pcard__f{font-size:12.5px;color:var(--muted);line-height:1.35;flex:1;}


.pcard__meta{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px;}


.mchip{
  font-size:9.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  background:var(--bone-2);color:var(--ink-2);border-radius:4px;padding:3px 5px;white-space:nowrap;
}


.mchip--berry{background:var(--berry-soft);color:var(--berry);}


.mchip--moss{background:var(--moss-soft);color:var(--moss);}


.pcard__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;}


.pcard__p{font-family:Archivo,sans-serif;font-weight:700;font-size:16px;letter-spacing:-.03em;}


.pcard__go{
  font-size:12.5px;font-weight:700;color:var(--gold);display:flex;align-items:center;gap:4px;
}


.pcard--quiz{
  background:linear-gradient(160deg,var(--gold-tint),var(--bone-2));
  border-style:dashed;border-color:var(--gold-soft);
  padding:16px;justify-content:center;gap:8px;text-align:left;
}


.pcard--quiz h3{font-size:16px;}


.pcard--quiz p{font-size:12.5px;color:var(--ink-2);line-height:1.4;}



/* ---------- LADDER (bundel) ---------- */
.ladder{display:flex;flex-direction:column;gap:9px;}


.rung{
  display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:center;
  border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;
  background:var(--white);text-align:left;position:relative;width:100%;
  transition:border-color .15s, background .15s;
}


.rung:hover{border-color:var(--line-strong);}


.rung[aria-checked="true"]{border-color:var(--gold);background:var(--gold-tint);}


.rung__radio{
  width:19px;height:19px;border-radius:99px;border:2px solid var(--line-strong);
  display:grid;place-items:center;flex:none;
}


.rung[aria-checked="true"] .rung__radio{border-color:var(--gold);}


.rung[aria-checked="true"] .rung__radio::after{
  content:"";width:9px;height:9px;border-radius:99px;background:var(--gold);
}


.rung__jars{display:flex;gap:2px;margin-bottom:6px;}


.rung__jars i{
  display:block;width:9px;height:14px;border-radius:2px 2px 3px 3px;
  background:var(--ink);opacity:.85;position:relative;
}


.rung__jars i::before{
  content:"";position:absolute;top:-3px;left:1px;right:1px;height:3px;
  border-radius:2px 2px 0 0;background:var(--ink);
}


.rung[aria-checked="true"] .rung__jars i{background:var(--gold);}


.rung[aria-checked="true"] .rung__jars i::before{background:var(--gold);}


.rung__t{display:block;font-family:Archivo,sans-serif;font-weight:700;font-size:15px;letter-spacing:-.03em;}


.rung__s{display:block;font-size:11.5px;color:var(--muted);margin-top:2px;}


.rung__pr{text-align:right;}


.rung__pr b{font-family:Archivo,sans-serif;font-weight:700;font-size:16px;letter-spacing:-.03em;display:block;}


.rung__pr span{font-size:11.5px;color:var(--muted);display:block;margin-top:1px;}


.rung__save{
  position:absolute;top:-8px;right:12px;background:var(--moss);color:#fff;
  font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:3px 8px;border-radius:99px;
}


.rung__save--best{background:var(--berry);}


.ladder__note{
  margin-top:12px;font-size:12.5px;color:var(--ink-2);background:var(--moss-soft);
  border-radius:10px;padding:10px 12px;display:flex;gap:8px;align-items:flex-start;
}


.ladder__note svg{width:15px;height:15px;stroke:var(--moss);fill:none;stroke-width:2.2;flex:none;margin-top:2px;}


.ladder__note--warn{background:var(--amber-soft);}


.ladder__note--warn svg{stroke:var(--amber);}



/* ---------- COMPARE TABLE ---------- */
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--white);position:relative;}


.cmp-hint{font-size:11.5px;color:var(--muted);margin-top:7px;display:flex;gap:5px;align-items:center;}


table.cmp{border-collapse:collapse;width:100%;min-width:430px;font-size:13px;}


table.cmp th,table.cmp td{padding:11px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;}


table.cmp thead th{
  font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);background:var(--bone-2);
}


table.cmp thead th.own{color:var(--gold);background:var(--gold-tint);}


table.cmp td.own{background:var(--gold-tint);font-weight:600;}


table.cmp tbody tr:last-child td{border-bottom:0;}


table.cmp td:first-child{font-weight:600;color:var(--ink-2);}


.yes,.no{display:inline-flex;align-items:center;gap:6px;}


.yes svg{width:14px;height:14px;stroke:var(--moss);fill:none;stroke-width:2.6;}


.no svg{width:14px;height:14px;stroke:#B08A8A;fill:none;stroke-width:2.6;}



/* ---------- REVIEWS ---------- */
.rev-rail{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory;scrollbar-width:none;}


.rev-rail::-webkit-scrollbar{display:none;}


.rev{
  flex:none;width:270px;scroll-snap-align:start;background:var(--white);
  border:1px solid var(--line);border-radius:14px;padding:15px;
  display:flex;flex-direction:column;gap:9px;
}


.rev__q{font-size:14px;line-height:1.5;color:var(--ink);}


.rev__w{font-family:Archivo,sans-serif;font-weight:700;font-size:14px;letter-spacing:-.02em;}


.rev__m{font-size:12px;color:var(--muted);margin-top:auto;}


.rev__m b{color:var(--ink-2);font-weight:600;}



/* ---------- ACCORDION ---------- */
.acc{border-top:1px solid var(--line);}


.acc__i{border-bottom:1px solid var(--line);}


.acc__b{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:15px 0;text-align:left;font-weight:600;font-size:14.5px;color:var(--ink);line-height:1.35;
}


.acc__b svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:2.2;flex:none;transition:transform .2s;}


.acc__i.open .acc__b svg{transform:rotate(45deg);}


.acc__p{display:none;padding:0 0 16px;font-size:14px;line-height:1.6;color:var(--ink-2);max-width:60ch;}


.acc__i.open .acc__p{display:block;}



/* ---------- QUIZ ---------- */
.quiz{background:var(--ink);color:#F3EBDC;border-radius:18px;padding:20px 18px;}


.quiz h3{font-size:22px;color:#FBF6ED;}


.quiz p{font-size:13.5px;color:#B8AC99;margin-top:8px;}


.quiz__opts{display:flex;flex-direction:column;gap:8px;margin-top:16px;}


.qopt{
  background:#241F19;border:1.5px solid #332C24;border-radius:12px;padding:13px 14px;
  text-align:left;font-size:14px;font-weight:600;color:#F3EBDC;transition:border-color .15s,background .15s;
}


.qopt:hover{border-color:var(--gold);background:#2B251D;}


.quiz__res{display:none;margin-top:16px;background:#241F19;border-radius:12px;padding:16px;}


.quiz__res.on{display:block;}


.quiz__res .eyebrow{color:var(--gold-soft);}


.quiz__res h4{font-family:Archivo,sans-serif;font-weight:700;font-size:19px;letter-spacing:-.03em;margin:0 0 6px;}


.quiz__res p{color:#C4B8A5;font-size:13.5px;margin-bottom:14px;}


.quiz__step{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);}



/* ---------- INGREDIENT CARDS ---------- */
.ing{display:flex;flex-direction:column;gap:10px;}


.ingc{
  background:var(--white);border:1px solid var(--line);border-radius:14px;padding:15px;
  display:flex;flex-direction:column;gap:7px;
}


.ingc__h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}


.ingc__n{font-family:Archivo,sans-serif;font-weight:700;font-size:15.5px;letter-spacing:-.03em;}


.ingc__d{font-size:12px;font-weight:700;color:var(--gold);white-space:nowrap;font-variant-numeric:tabular-nums;}


.ingc p{font-size:13.5px;line-height:1.5;color:var(--ink-2);}


.ingc__claim{
  font-size:12px;color:var(--moss);background:var(--moss-soft);border-radius:7px;
  padding:7px 9px;line-height:1.4;
}


.ingc__heritage{
  font-size:12px;color:var(--berry);background:var(--berry-soft);border-radius:7px;
  padding:7px 9px;line-height:1.4;
}



/* ---------- QUALITY ---------- */
.qual{display:grid;grid-template-columns:1fr 1fr;gap:10px;}


.qualc{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:14px;}


.qualc h4{font-family:Archivo,sans-serif;font-weight:700;font-size:14px;letter-spacing:-.02em;margin:0 0 5px;}


.qualc p{font-size:12.5px;line-height:1.45;color:var(--muted);}



/* ---------- FINAL CTA ---------- */
.final{background:var(--ink);color:#F4ECDD;}


.final h2{font-size:29px;color:#FCF8F1;}


.final p{margin-top:11px;font-size:14.5px;color:#B9AC99;max-width:46ch;}


.final .btn--gold{margin-top:20px;}


.final .ticks .tick{color:#C9BCA8;}


.final .ticks svg{stroke:var(--gold-soft);}



/* ---------- FOOTER ---------- */
.ftr{background:var(--bone-2);border-top:1px solid var(--line);font-size:13px;color:var(--muted);}


.ftr h5{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);margin:0 0 9px;}


.ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}


.ftr__cols{display:grid;grid-template-columns:1fr 1fr;gap:24px 18px;}


.ftr__pay{display:flex;gap:5px;flex-wrap:wrap;margin-top:12px;}


.ftr__pay b{
  font-size:9px;font-weight:700;background:var(--white);border:1px solid var(--line);
  border-radius:4px;padding:4px 6px;color:var(--ink-2);letter-spacing:.02em;
}



/* ============================================================
   PDP
   ============================================================ */
.gal{background:var(--bone-2);position:relative;}


.gal__main img{width:100%;aspect-ratio:1/1;object-fit:cover;}


.gal__thumbs{display:flex;gap:7px;padding:10px 18px 0;overflow-x:auto;scrollbar-width:none;}


.gal__thumbs::-webkit-scrollbar{display:display;height:0;}


.gal__thumbs button{
  flex:none;width:52px;height:52px;border-radius:9px;overflow:hidden;
  border:1.5px solid var(--line);background:var(--white);
}


.gal__thumbs button[aria-current="true"]{border-color:var(--gold);}


.gal__thumbs img{width:100%;height:100%;object-fit:cover;}



.buy{background:var(--white);padding:16px 18px 22px;}


.buy h1{font-family:Archivo,sans-serif;font-weight:800;letter-spacing:-.035em;font-size:29px;margin-top:9px;line-height:1.06;}


.buy__tag{margin-top:9px;font-size:14.5px;line-height:1.45;color:var(--ink-2);}


.dosepill{
  display:inline-flex;align-items:center;gap:8px;margin-top:13px;
  background:var(--ink);color:var(--gold-soft);border-radius:99px;
  font-size:12.5px;font-weight:700;padding:7px 13px;letter-spacing:-.01em;
}


.dosepill .num{color:#fff;}


.specs{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:16px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;
}


.spec{background:var(--white);padding:10px 12px;}


.spec dt{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0;}


.spec dd{margin:3px 0 0;font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.25;}


.buy__lbl{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px;}


.plan{display:flex;gap:8px;margin-bottom:14px;}


.plan button{
  flex:1;border:1.5px solid var(--line);border-radius:11px;padding:10px 8px;text-align:center;
  font-size:12.5px;font-weight:700;color:var(--ink-2);line-height:1.25;transition:.15s;
}


.plan button small{display:block;font-weight:500;font-size:11px;color:var(--muted);margin-top:2px;}


.plan button[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-tint);color:var(--ink);}


.atc{margin-top:16px;}


.atc .btn{flex-direction:column;gap:2px;padding:16px 20px;line-height:1.2;}


.atc__price{font-family:Archivo,sans-serif;font-size:16px;font-weight:800;letter-spacing:-.03em;}


.buy__trust{margin-top:14px;}


.stock{
  display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  color:var(--moss);margin-top:12px;
}


.stock i{width:7px;height:7px;border-radius:99px;background:var(--moss);flex:none;}



/* sticky ATC */
.sticky-atc{
  position:sticky;bottom:0;z-index:40;background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);border-top:1px solid var(--line);
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  display:flex;gap:11px;align-items:center;
  transform:translateY(120%);transition:transform .22s ease;
}


.sticky-atc.on{transform:translateY(0);}


.sticky-atc img{width:40px;height:40px;border-radius:8px;object-fit:cover;flex:none;background:var(--bone-2);}


.sticky-atc .sa__t{flex:1;min-width:0;}


.sticky-atc .sa__n{font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}


.sticky-atc .sa__p{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;}


.sticky-atc .btn{width:auto;padding:12px 20px;font-size:14px;flex:none;}



/* nutrition table */
.nutri{width:100%;border-collapse:collapse;font-size:13px;background:var(--white);}


.nutri th,.nutri td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;}


.nutri thead th{font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);background:var(--bone-2);}


.nutri td:nth-child(2),.nutri td:nth-child(3){font-variant-numeric:tabular-nums;text-align:right;font-weight:600;}


.nutri th:nth-child(2),.nutri th:nth-child(3){text-align:right;}


.nutri tbody tr:last-child td{border-bottom:0;}



/* steps */
.steps{display:flex;flex-direction:column;gap:12px;counter-reset:s;}


.step{display:grid;grid-template-columns:30px 1fr;gap:13px;align-items:start;}


.step__n{
  width:30px;height:30px;border-radius:99px;background:var(--gold-tint);border:1.5px solid var(--gold-soft);
  display:grid;place-items:center;font-family:Archivo,sans-serif;font-weight:800;font-size:13px;color:var(--gold);
}


.step h4{font-family:Archivo,sans-serif;font-weight:700;font-size:15px;letter-spacing:-.025em;margin:4px 0 4px;}


.step p{font-size:13.5px;line-height:1.5;color:var(--ink-2);}



/* cross-sell mix */
/* Het merkpaars #764686 blijft de productkleur, maar als paneelgrond is het
   te licht: witte tekst haalde er 4,46:1. Hier een donkerder trap ervan. */
.mix{background:#6A3E78;color:#F6E9F1;border-radius:18px;padding:20px 18px;}


.mix h3{font-size:23px;color:#FDF6FA;}


.mix p{font-size:13.5px;color:#D5BDCD;margin-top:9px;}


.mix__row{display:flex;gap:9px;margin-top:16px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;}


.mix__row::-webkit-scrollbar{display:none;}


.mix__c{
  flex:none;width:104px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.16);
  border-radius:12px;padding:8px;text-align:center;transition:.15s;
}


.mix__c[aria-pressed="true"]{border-color:var(--gold-soft);background:rgba(232,216,180,.16);}


.mix__c img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;background:#fff;}


.mix__c span{display:block;font-size:11px;font-weight:700;margin-top:6px;line-height:1.25;}


.mix__bar{
  margin-top:16px;background:rgba(0,0,0,.28);border-radius:12px;padding:12px 14px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}


.mix__bar b{font-family:Archivo,sans-serif;font-size:17px;font-weight:800;letter-spacing:-.03em;}


.mix__bar span{font-size:12px;color:#D5BDCD;display:block;}



/* annotation callouts (concept notes) */
.note{
  border-left:3px solid var(--gold);background:var(--gold-tint);
  padding:11px 13px;border-radius:0 10px 10px 0;font-size:12.5px;line-height:1.5;color:var(--ink-2);
}


.note b{color:var(--ink);}



/* ============================================================
   ABONNEMENT
   ============================================================ */
.mode{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:4px;}


.mode button{
  border:1.5px solid var(--line);border-radius:12px;padding:12px 10px;text-align:center;
  font-size:13.5px;font-weight:700;color:var(--ink-2);line-height:1.2;transition:.15s;position:relative;
}


.mode button small{display:block;font-weight:500;font-size:11.5px;color:var(--muted);margin-top:3px;}


.mode button[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-tint);color:var(--ink);}


.mode button[aria-pressed="true"] small{color:var(--gold);}


.mode .tagbest{
  position:absolute;top:-8px;left:50%;transform:translateX(-50%);
  background:var(--moss);color:#fff;font-size:9px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;padding:2.5px 7px;border-radius:99px;white-space:nowrap;
}



.subpanel{display:none;margin-top:14px;}


.subpanel.on{display:block;}


.substep{margin-bottom:14px;}


.substep__l{
  font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);margin-bottom:7px;display:flex;align-items:baseline;gap:7px;
}


.substep__l i{
  font-style:normal;width:15px;height:15px;border-radius:99px;background:var(--ink);color:var(--gold-soft);
  font-size:9.5px;font-weight:800;display:inline-grid;place-items:center;flex:none;
}


.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;}


.opts button{
  border:1.5px solid var(--line);border-radius:11px;padding:11px 6px;text-align:center;
  font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.15;transition:.15s;
}


.opts button small{display:block;font-weight:600;font-size:10.5px;color:var(--muted);margin-top:3px;}


.opts button[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-tint);}


.opts button[aria-pressed="true"] small{color:var(--gold);}


.opts button[disabled]{opacity:.34;cursor:not-allowed;}


.opts button[disabled] small{color:var(--muted);}



.supply{
  margin-top:8px;font-size:12px;line-height:1.4;border-radius:9px;padding:8px 10px;
  display:flex;gap:7px;align-items:flex-start;
}


.supply svg{width:14px;height:14px;flex:none;margin-top:1.5px;fill:none;stroke-width:2.3;}


.supply--ok{background:var(--moss-soft);color:var(--moss);}


.supply--ok svg{stroke:var(--moss);}


.supply--warn{background:var(--amber-soft);color:var(--amber);}


.supply--warn svg{stroke:var(--amber);}



.subsum{
  margin-top:14px;background:var(--ink);color:#F1E8D8;border-radius:14px;padding:15px 16px;
}


.subsum__t{
  font-family:Archivo,sans-serif;font-weight:700;font-size:15.5px;letter-spacing:-.025em;
  color:#FCF7EE;line-height:1.25;
}


.subsum__rows{margin-top:11px;display:flex;flex-direction:column;gap:6px;}


.subsum__r{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#C0B4A2;}


.subsum__r b{color:#FBF6ED;font-weight:700;font-variant-numeric:tabular-nums;}


.subsum__r.big{font-size:15px;padding-top:8px;border-top:1px solid #332C24;}


.subsum__r.big b{font-family:Archivo,sans-serif;font-size:19px;font-weight:800;letter-spacing:-.03em;}


.subsum__save{
  margin-top:10px;background:rgba(63,107,79,.28);border:1px solid rgba(139,190,160,.35);
  color:#B7DCC5;border-radius:9px;padding:8px 10px;font-size:12.5px;line-height:1.4;font-weight:600;
}


.subterms{margin-top:12px;display:flex;flex-direction:column;gap:7px;}


.subterms div{display:flex;gap:8px;font-size:12.5px;color:var(--ink-2);line-height:1.4;align-items:flex-start;}


.subterms svg{width:14px;height:14px;flex:none;margin-top:2px;stroke:var(--moss);fill:none;stroke-width:2.4;}



.strike{text-decoration:line-through;opacity:.55;font-weight:500;}



/* OG badge */
.ogbadge{
  display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:var(--gold-soft);
  border-radius:99px;padding:5px 12px;font-size:11px;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;
}


.ogbadge b{color:#fff;font-weight:800;}


.nzvt{
  display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--moss);
  color:var(--moss);border-radius:10px;padding:7px 11px;font-size:12px;font-weight:700;line-height:1.25;
}


.nzvt svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;flex:none;}



/* ============================================================
   WINKELWAGEN
   ============================================================ */
.cartpg{padding:18px 18px 30px;}


.cartpg h1{font-size:27px;margin-bottom:4px;}


.cartpg__sub{font-size:14px;color:var(--muted);margin-bottom:16px;}


.shipbar{
  background:var(--white);border:1px solid var(--line);border-radius:14px;padding:13px 14px;margin-bottom:14px;
}


.shipbar__t{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.35;}


.shipbar__t b{color:var(--moss);}


.shipbar__track{height:6px;background:var(--bone-2);border-radius:99px;margin-top:9px;overflow:hidden;}


.shipbar__fill{height:100%;background:var(--moss);border-radius:99px;transition:width .3s;}


.shipbar.done .shipbar__fill{background:var(--moss);}



.citem{
  display:grid;grid-template-columns:66px 1fr;gap:12px;background:var(--white);
  border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:9px;align-items:start;
}


.citem img{width:66px;height:66px;object-fit:cover;border-radius:10px;background:var(--bone-2);}


.citem__n{font-family:Archivo,sans-serif;font-weight:700;font-size:14.5px;letter-spacing:-.025em;line-height:1.2;}


.citem__m{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35;}


.citem__sub{
  display:inline-flex;align-items:center;gap:5px;margin-top:6px;background:var(--gold-tint);
  color:var(--gold);border:1px solid var(--gold-soft);border-radius:6px;padding:3px 7px;
  font-size:10.5px;font-weight:800;letter-spacing:.03em;
}


.citem__f{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;}


.qty{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:9px;overflow:hidden;}


.qty button{width:30px;height:30px;display:grid;place-items:center;font-size:16px;font-weight:700;color:var(--ink-2);}


.qty button:hover{background:var(--bone-2);}


.qty span{min-width:26px;text-align:center;font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums;}


.citem__p{font-family:Archivo,sans-serif;font-weight:700;font-size:15px;letter-spacing:-.03em;}


.citem__rm{font-size:12px;color:var(--muted);text-decoration:underline;margin-top:7px;display:inline-block;}



.upsell{
  background:var(--gold-tint);border:1.5px dashed var(--gold-soft);border-radius:14px;
  padding:13px 14px;margin-bottom:14px;display:flex;gap:12px;align-items:center;
}


.upsell__t{flex:1;font-size:13px;line-height:1.4;color:var(--ink-2);}


.upsell__t b{color:var(--ink);}


.upsell button{
  flex:none;background:var(--ink);color:#FBF6ED;border-radius:99px;padding:9px 15px;
  font-size:12.5px;font-weight:700;white-space:nowrap;
}



.xsell{margin:16px 0;}


.xsell__h{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:9px;}


.xrow{display:flex;gap:9px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;align-items:stretch;}


.xrow::-webkit-scrollbar{display:none;}


.xc{
  flex:none;width:118px;background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:8px;text-align:left;display:flex;flex-direction:column;
}


.xc img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;background:var(--bone-2);}


.xc__n{font-size:11.5px;font-weight:700;margin-top:6px;line-height:1.2;min-height:2.4em;}


.xc__p{font-size:12px;font-weight:700;color:var(--gold);margin-top:3px;margin-bottom:7px;font-variant-numeric:tabular-nums;}


.xc__b{
  margin-top:auto;width:100%;border:1.5px solid var(--line-strong);border-radius:8px;
  padding:6px;font-size:11.5px;font-weight:700;color:var(--ink);
}


.xc__b:hover{border-color:var(--gold);color:var(--gold);}



.totals{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:6px;}


.trow{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;color:var(--ink-2);margin-bottom:8px;}


.trow b{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:600;}


.trow.save{color:var(--moss);}


.trow.save b{color:var(--moss);}


.trow.grand{
  font-size:16px;color:var(--ink);padding-top:11px;border-top:1px solid var(--line);
  margin-top:11px;margin-bottom:0;font-weight:700;
}


.trow.grand b{font-family:Archivo,sans-serif;font-size:21px;font-weight:800;letter-spacing:-.03em;}


.tvat{font-size:11.5px;color:var(--muted);margin-top:5px;}



.promises{margin-top:16px;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:14px;}


.promises h4{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;}


.paylogos{display:flex;gap:5px;flex-wrap:wrap;margin-top:12px;justify-content:center;}


.paylogos b{
  font-size:9px;font-weight:700;background:var(--bone-2);border:1px solid var(--line);
  border-radius:4px;padding:4px 7px;color:var(--ink-2);
}



/* ============================================================
   CHECKOUT
   ============================================================ */
.cobanner{
  background:var(--ink);color:#F1E8D8;padding:13px 18px;display:flex;flex-direction:column;gap:7px;
}


.cobanner__l{font-family:Archivo,sans-serif;font-weight:800;font-size:17px;letter-spacing:-.04em;color:#fff;}


.cobanner__l em{font-style:normal;color:var(--gold);}


.cobanner__p{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;font-weight:600;}


.cobanner__p span{display:flex;gap:5px;align-items:center;}


.cobanner__p svg{width:12px;height:12px;stroke:var(--moss);fill:none;stroke-width:2.6;flex:none;}



.copg{padding:18px;}


.cosec{margin-bottom:20px;}


.cosec h3{font-size:16px;margin-bottom:10px;}


.cofield{
  border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--white);
  margin-bottom:8px;
}


.cofield label{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);display:block;}


.cofield div{font-size:14.5px;color:var(--ink);margin-top:2px;}


.cofield.two{display:grid;grid-template-columns:1fr 1fr;gap:12px;}


.cocheck{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--ink-2);line-height:1.4;margin-top:4px;}


.cocheck i{
  width:16px;height:16px;border:1.5px solid var(--line-strong);border-radius:4px;flex:none;margin-top:1px;
  display:grid;place-items:center;
}


.cocheck.on i{background:var(--gold);border-color:var(--gold);}


.cocheck.on i::after{content:"";width:8px;height:4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px);}


.coship{
  border:1.5px solid var(--moss);background:var(--moss-soft);border-radius:11px;padding:12px;
  display:flex;justify-content:space-between;gap:12px;align-items:center;
}


.coship__t{font-size:13.5px;font-weight:700;color:var(--ink);}


.coship__s{font-size:12px;color:var(--moss);margin-top:2px;}


.coship__p{font-size:13.5px;font-weight:800;color:var(--moss);}


.copay{display:flex;flex-direction:column;gap:8px;}


.copay__o{
  border:1.5px solid var(--line);border-radius:11px;padding:12px;display:flex;align-items:center;gap:10px;
  font-size:14px;font-weight:600;
}


.copay__o[aria-checked="true"]{border-color:var(--gold);background:var(--gold-tint);}


.copay__r{width:17px;height:17px;border:2px solid var(--line-strong);border-radius:99px;flex:none;display:grid;place-items:center;}


.copay__o[aria-checked="true"] .copay__r{border-color:var(--gold);}


.copay__o[aria-checked="true"] .copay__r::after{content:"";width:8px;height:8px;background:var(--gold);border-radius:99px;}


.cosummary{background:var(--bone-2);border-radius:14px;padding:14px;margin-top:6px;}


.coline{display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center;margin-bottom:10px;}


.coline img{width:48px;height:48px;border-radius:8px;object-fit:cover;background:var(--white);}


.coline__n{font-size:13px;font-weight:700;line-height:1.2;}


.coline__m{font-size:11.5px;color:var(--muted);margin-top:2px;}


.coline__p{font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums;}



/* ============================================================
   MOBIEL MENU + ZOEKEN + COOKIEBANNER
   ============================================================ */
.scrim{
  position:absolute;inset:10px;border-radius:28px;background:rgba(12,10,8,.5);z-index:80;
  opacity:0;pointer-events:none;transition:opacity .22s;
}


.scrim.on{opacity:1;pointer-events:auto;}



.drawer{
  position:absolute;top:10px;left:10px;bottom:10px;width:82%;max-width:330px;z-index:90;
  background:var(--white);transform:translateX(-102%);transition:transform .26s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;overflow-y:auto;
}


.drawer.on{transform:translateX(0);}


.drawer__h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);}


.drawer__x{font-size:22px;line-height:1;color:var(--ink-2);padding:2px 6px;}


.drawer nav{padding:8px 0;}


.drawer nav a{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 18px;font-size:16px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--bone-2);
}


.drawer nav a span{font-size:12px;color:var(--gold);font-weight:700;}


.drawer__prods{padding:14px 18px;border-top:1px solid var(--line);}


.drawer__prods h5{font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;}


.drawer__p{display:flex;gap:10px;align-items:center;padding:8px 0;}


.drawer__p img{width:40px;height:40px;border-radius:8px;object-fit:cover;background:var(--bone-2);}


.drawer__p b{font-size:13.5px;font-weight:700;display:block;line-height:1.2;}


.drawer__p small{font-size:11.5px;color:var(--muted);}


.drawer__f{margin-top:auto;padding:16px 18px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);}



.searchpanel{
  position:absolute;top:10px;left:10px;right:10px;z-index:90;background:var(--white);
  border-bottom:1px solid var(--line);transform:translateY(-102%);transition:transform .24s;
  padding:14px 16px 16px;max-height:100%;overflow-y:auto;
}


.searchpanel.on{transform:translateY(0);}


.searchbar{display:flex;gap:9px;align-items:center;}


.searchbar input{
  flex:1;border:1.5px solid var(--line-strong);border-radius:11px;padding:11px 13px;
  font-size:15px;font-family:inherit;color:var(--ink);background:var(--white);
}


.searchbar input:focus{outline:none;border-color:var(--gold);}


.searchbar button{font-size:14px;font-weight:700;color:var(--muted);padding:6px;}


.searchres{margin-top:12px;display:flex;flex-direction:column;gap:8px;}


.searchres a{display:flex;gap:11px;align-items:center;padding:8px;border-radius:10px;}


.searchres a:hover{background:var(--bone-2);}


.searchres img{width:44px;height:44px;border-radius:8px;object-fit:cover;background:var(--bone-2);}


.searchres b{font-size:14px;font-weight:700;display:block;line-height:1.2;}


.searchres small{font-size:12px;color:var(--muted);}


.searchhint{font-size:12.5px;color:var(--muted);margin-top:10px;}



.cookiebar{
  position:absolute;left:10px;right:10px;bottom:10px;z-index:70;background:var(--ink);color:#EFE6D6;
  padding:15px 16px calc(15px + env(safe-area-inset-bottom));
  transform:translateY(120%);transition:transform .3s;
}


.cookiebar.on{transform:translateY(0);}


.cookiebar p{font-size:12.5px;line-height:1.5;color:#C3B7A4;}


.cookiebar p b{color:#FBF6ED;}


.cookiebar__b{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;}


.cookiebar__b button{
  flex:1;min-width:110px;border-radius:99px;padding:11px 14px;font-size:13px;font-weight:700;
}


.ck-acc{background:var(--gold);color:#fff;}


.ck-min{background:transparent;color:#EFE6D6;border:1.5px solid #443C31;}


.ck-set{background:transparent;color:#9C8F7C;font-size:12px;text-decoration:underline;flex:none;min-width:0;}



/* ============================================================
   SHOP / COLLECTIE
   ============================================================ */
.pagehead{padding:26px 18px 6px;}


.pagehead .eyebrow{margin-bottom:9px;}


.pagehead h1{font-size:37px;line-height:1.02;}


.pagehead p{margin-top:11px;font-size:15px;color:var(--ink-2);max-width:56ch;line-height:1.55;}


.filters{display:flex;gap:7px;overflow-x:auto;padding:16px 18px 4px;scrollbar-width:none;}


.filters::-webkit-scrollbar{display:none;}


.filters button{
  flex:none;border:1.5px solid var(--line);border-radius:99px;padding:9px 15px;
  font-size:13px;font-weight:700;color:var(--ink-2);white-space:nowrap;background:var(--white);
}


.filters button[aria-pressed="true"]{background:var(--ink);color:#F3EBDC;border-color:var(--ink);}



/* ============================================================
   REVIEWS-PAGINA
   ============================================================ */
.revhero{
  background:var(--white);border-bottom:1px solid var(--line);padding:24px 18px;
  display:flex;flex-direction:column;gap:14px;
}


.revscore{display:flex;align-items:center;gap:14px;}


.revscore__n{font-family:Archivo,sans-serif;font-weight:800;font-size:44px;letter-spacing:-.045em;line-height:1;}


.revscore__m .stars svg{width:16px;height:16px;}


.revscore__m div{font-size:13px;color:var(--muted);margin-top:5px;}


.revbars{display:flex;flex-direction:column;gap:6px;}


.revbar{display:grid;grid-template-columns:34px 1fr 34px;gap:9px;align-items:center;font-size:12px;color:var(--muted);}


.revbar__t{height:7px;background:var(--bone-2);border-radius:99px;overflow:hidden;}


.revbar__f{height:100%;background:var(--gold);border-radius:99px;}


.revbar span:last-child{text-align:right;font-variant-numeric:tabular-nums;}


.revlist{padding:18px;display:flex;flex-direction:column;gap:11px;}


.revcard{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:15px;}


.revcard__h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}


.revcard__w{font-family:Archivo,sans-serif;font-weight:700;font-size:15px;letter-spacing:-.025em;margin-bottom:6px;}


.revcard p{font-size:14px;line-height:1.55;color:var(--ink-2);}


.revcard__m{margin-top:10px;padding-top:10px;border-top:1px solid var(--bone-2);font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;align-items:center;}


.revcard__v{color:var(--moss);font-weight:700;display:flex;gap:4px;align-items:center;}


.revcard__v svg{width:12px;height:12px;stroke:var(--moss);fill:none;stroke-width:2.6;}


.revcard__p{background:var(--bone-2);border-radius:5px;padding:2px 7px;font-size:11px;font-weight:600;color:var(--ink-2);}



/* ============================================================
   MIJN ABONNEMENT
   ============================================================ */
.acct{padding:20px 18px 30px;}


.acct__card{background:var(--white);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:14px;}


.acct__top{padding:15px 16px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center;}


.acct__top img{width:54px;height:54px;border-radius:10px;object-fit:cover;background:var(--bone-2);}


.acct__st{
  font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  background:var(--moss-soft);color:var(--moss);border-radius:99px;padding:3px 9px;margin-left:auto;flex:none;
}


.acct__st--paused{background:var(--amber-soft);color:var(--amber);}


.acct__b{padding:15px 16px;}


.acct__row{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;padding:7px 0;border-bottom:1px solid var(--bone-2);}


.acct__row:last-of-type{border-bottom:0;}


.acct__row span{color:var(--muted);}


.acct__row b{font-weight:700;font-variant-numeric:tabular-nums;}


.acct__next{
  background:var(--gold-tint);border:1px solid var(--gold-soft);border-radius:11px;
  padding:12px 13px;margin:13px 0;font-size:13px;line-height:1.45;color:var(--ink-2);
}


.acct__next b{color:var(--ink);}


.acct__acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;}


.acct__acts button{
  border:1.5px solid var(--line-strong);border-radius:10px;padding:11px 8px;
  font-size:13px;font-weight:700;color:var(--ink);background:var(--white);
}


.acct__acts button:hover{border-color:var(--gold);color:var(--gold);}


.acct__acts button.wide{grid-column:1 / -1;}


.acct__acts button.stop{color:var(--muted);border-color:var(--line);font-weight:600;}


.acct__hist{margin-top:6px;}


.acct__hist h4{font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 9px;}


.acct__hrow{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:9px 0;border-bottom:1px solid var(--bone-2);color:var(--ink-2);}


.acct__hrow b{font-variant-numeric:tabular-nums;font-weight:600;}


.acct__hrow em{font-style:normal;color:var(--moss);font-size:11.5px;font-weight:700;}



/* ============================================================
   BEDANKT + 404 + LEEG
   ============================================================ */
.thanks{padding:30px 18px 34px;text-align:center;}


.thanks__tick{
  width:58px;height:58px;border-radius:99px;background:var(--moss-soft);
  display:grid;place-items:center;margin:0 auto 16px;
}


.thanks__tick svg{width:28px;height:28px;stroke:var(--moss);fill:none;stroke-width:2.6;}


.thanks h1{font-size:28px;}


.thanks > p{margin-top:11px;font-size:15px;color:var(--ink-2);max-width:46ch;margin-left:auto;margin-right:auto;line-height:1.55;}


.steps3{display:flex;flex-direction:column;gap:10px;margin-top:22px;text-align:left;}


.step3{
  background:var(--white);border:1px solid var(--line);border-radius:13px;padding:13px 14px;
  display:grid;grid-template-columns:26px 1fr;gap:12px;align-items:start;
}


.step3 i{
  width:26px;height:26px;border-radius:99px;background:var(--ink);color:var(--gold-soft);
  font-style:normal;font-size:12px;font-weight:800;display:grid;place-items:center;
}


.step3 b{display:block;font-size:14px;font-weight:700;margin-bottom:3px;}


.step3 p{font-size:13px;color:var(--muted);line-height:1.45;}


.empty{padding:44px 20px;text-align:center;}


.empty h2{font-size:22px;}


.empty p{margin-top:10px;font-size:14.5px;color:var(--muted);max-width:38ch;margin-left:auto;margin-right:auto;line-height:1.5;}



/* ============================================================
   OVER ONS
   ============================================================ */
.story{padding:0 0 10px;}


.story__q{
  font-family:Archivo,sans-serif;font-weight:700;font-size:21px;letter-spacing:-.03em;
  line-height:1.3;color:var(--ink);border-left:3px solid var(--gold);padding-left:15px;margin:22px 0;
}


.timeline{display:flex;flex-direction:column;gap:0;margin-top:20px;}


.tl{display:grid;grid-template-columns:62px 1fr;gap:14px;padding-bottom:20px;position:relative;}


.tl::before{content:"";position:absolute;left:8px;top:22px;bottom:0;width:1.5px;background:var(--line);}


.tl:last-child::before{display:none;}


.tl__y{
  font-family:Archivo,sans-serif;font-weight:800;font-size:13px;color:var(--gold);
  position:relative;padding-left:22px;font-variant-numeric:tabular-nums;
}


.tl__y::before{
  content:"";position:absolute;left:3px;top:5px;width:11px;height:11px;border-radius:99px;
  background:var(--white);border:2.5px solid var(--gold);
}


.tl h4{font-family:Archivo,sans-serif;font-weight:700;font-size:15.5px;letter-spacing:-.025em;margin:0 0 5px;}


.tl p{font-size:13.5px;line-height:1.5;color:var(--ink-2);}



/* achtdelig specrooster op de productpagina */
.specs--8{grid-template-columns:1fr 1fr;}


.specs--8 .spec dd{font-size:13px;}



/* ---------- productomschrijving ---------- */
.buy__head{
  font-family:Archivo,sans-serif;font-weight:800;font-size:19px;letter-spacing:-.03em;
  line-height:1.22;color:var(--ink);margin-top:10px;text-wrap:balance;
}


.buy__desc{margin-top:10px;font-size:14.5px;line-height:1.6;color:var(--ink-2);}



/* ---------- waarom mensen dit nemen ---------- */
.why{display:flex;flex-direction:column;gap:9px;margin-top:16px;}


.whyc{
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--moss);
  border-radius:0 12px 12px 0;padding:13px 15px;
}


.whyc__t{
  font-family:Archivo,sans-serif;font-weight:700;font-size:15.5px;letter-spacing:-.025em;
  display:flex;align-items:center;gap:8px;
}


.whyc__t svg{width:15px;height:15px;stroke:var(--moss);fill:none;stroke-width:2.6;flex:none;}


.whyc__c{font-size:13.5px;line-height:1.5;color:var(--ink-2);margin-top:6px;}


.whyc__d{
  font-size:11.5px;font-weight:700;color:var(--moss);margin-top:7px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;
}


.why__note{
  margin-top:12px;font-size:12.5px;line-height:1.5;color:var(--berry);
  background:var(--berry-tint,var(--berry-soft));border-radius:9px;padding:10px 12px;
}



/* doorgestreept los-bedrag naast het totaal */
.strike-los{
  text-decoration:line-through;color:var(--muted);font-weight:600;
  font-size:.62em;margin-right:7px;letter-spacing:-.01em;
}


/* social proof bij de kassa */
.coproof{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:14px;margin-top:12px;
}


.coproof__top{display:flex;align-items:center;gap:10px;padding-bottom:11px;border-bottom:1px solid var(--line);}


.coproof__n{font-family:Archivo,sans-serif;font-weight:800;font-size:24px;letter-spacing:-.04em;line-height:1;}


.coproof__m{font-size:12px;color:var(--muted);margin-top:3px;}


.coproof__q{font-size:13px;line-height:1.5;color:var(--ink);margin-top:11px;}


.coproof__a{font-size:11.5px;color:var(--muted);margin-top:6px;}


.coproof__a b{color:var(--ink-2);font-weight:600;}




/* ============================================================
   KOOPMODULE — schoon
   ============================================================ */
.badgerow{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px;}


.badgerow .ogbadge{margin:0;font-size:10.5px;padding:5px 11px;}


.badgerow .nzvt{margin:0;font-size:10.5px;padding:4px 10px;border-radius:99px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;}


.badgerow .nzvt svg{width:13px;height:13px;}



.buy__desc{margin-top:12px;font-size:15.5px;line-height:1.55;color:var(--ink-2);}


.buy__desc strong{color:var(--ink);}



.bullets{margin:15px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;}


.bullets li{
  list-style:none;display:flex;gap:10px;align-items:flex-start;
  font-family:Archivo,sans-serif;font-weight:700;font-size:16.5px;letter-spacing:-.022em;
  line-height:1.28;color:var(--ink);
}


.bullets li svg{width:18px;height:18px;flex:none;margin-top:1px;stroke:var(--moss);fill:none;stroke-width:2.9;}


.bullets li sup{color:var(--muted);font-weight:600;font-size:.58em;margin-left:1px;top:-.5em;position:relative;}


.bullets__f{margin-top:10px;font-size:12px;color:var(--muted);padding-left:28px;}


.fnlink{color:var(--muted);text-decoration:underline;}


.fnlink:hover{color:var(--gold);}



.specstrip{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:16px 0 0;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;
}


.specstrip > div{background:var(--white);padding:11px 12px;text-align:center;}


.specstrip dt{font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0;}


.specstrip dd{margin:4px 0 0;font-size:14px;font-weight:700;color:var(--ink);line-height:1.2;}



/* voetnoot onderaan de productpagina */
.fnote{
  padding-top:24px;padding-bottom:26px;border-top:1px solid var(--line);
  font-size:12.5px;line-height:1.55;color:var(--muted);scroll-margin-top:70px;
}


.fnote p + p{margin-top:8px;}


.fnote strong{color:var(--ink-2);}



/* doelchips in de hero */
.goalchips{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;}


.goalchips a{
  font-size:12.5px;font-weight:700;color:var(--ink-2);text-decoration:none;
  border:1.5px solid var(--line-strong);border-radius:99px;padding:7px 13px;background:var(--white);
  transition:.15s;
}


.goalchips a:hover{border-color:var(--gold);color:var(--gold);}


.hero h1{text-wrap:balance;}



<style>
/* Slot van de productpagina: de knop koopt af, de link eronder gaat terug naar de keuze. */
.final__alt{
  display:block;margin-top:14px;font-size:12.5px;font-weight:600;
  color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;
}


.final__alt:hover{color:var(--ink);}




/* Ankerprijs onder de productnaam: het getal draagt, de rest is toelichting. */
.buy__price{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;
  margin:10px 0 0;font-size:13.5px;font-weight:600;color:var(--ink-2);
}


.buy__price b{font-size:25px;font-weight:800;color:var(--ink);letter-spacing:-.01em;}


.buy__price span{color:var(--ink-3);font-weight:600;flex-basis:100%;font-size:12.5px;margin-top:-2px;}




/* Bestelteller. Het cijfer is echt (Shopify, 90 dagen), dus het mag opvallen. */
.fomo{
  display:flex;align-items:center;gap:9px;margin:16px 0 10px;padding:11px 13px;
  background:var(--gold-tint);border:1px solid var(--gold-soft);border-radius:11px;
  font-size:13px;color:var(--ink-2);line-height:1.35;
}


.fomo b{color:var(--ink);font-weight:700;}


.fomo__d{
  width:8px;height:8px;border-radius:99px;background:#3F6B4F;flex:none;
  box-shadow:0 0 0 0 rgba(63,107,79,.55);animation:fomoPuls 2.4s ease-out infinite;
}


@keyframes fomoPuls{
  0%{box-shadow:0 0 0 0 rgba(63,107,79,.5);}
  70%{box-shadow:0 0 0 7px rgba(63,107,79,0);}
  100%{box-shadow:0 0 0 0 rgba(63,107,79,0);}
}


@media (prefers-reduced-motion: reduce){ .fomo__d{animation:none;} }



.pcard__cnt{
  display:flex;align-items:center;gap:6px;margin-top:7px;
  font-size:11px;font-weight:600;color:var(--ink-3);letter-spacing:.005em;
}


.pcard__cnt i{width:5px;height:5px;border-radius:99px;background:#3F6B4F;flex:none;}




/* Kleurband: de drie gummiekleuren over de volle breedte. Puur ritme en kleur,
   geen tekst — daarom aria-hidden. */
.band{display:grid;grid-template-columns:repeat(3,1fr);background:var(--white);}


.band img{display:block;width:100%;height:112px;object-fit:cover;}



/* Waarom-blok: tekst naast beeld in plaats van een kale alinea. */
.why2{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:grid;gap:20px;padding-left:18px;padding-right:18px;}


.why2 h2{font-size:26px;}


.why2__i img{display:block;width:100%;border-radius:14px;aspect-ratio:16/9;object-fit:cover;object-position:50% 42%;}



/* Productkleur in de kaart: een haarlijn boven de foto, gevoed door de catalogus. */
.pcard__img{position:relative;}


.pcard__img::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:var(--pc,transparent);
}




/* Klantenmuur: horizontaal schuifrek op mobiel, raster op desktop.
   Bewust zonder citaat onder een gezicht — een echt gezicht met een
   verzonnen quote eronder is een nepreview. */
.ugc{display:flex;gap:8px;overflow-x:auto;padding:0 18px 4px;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;}


.ugc::-webkit-scrollbar{display:none;}


.ugc img{flex:0 0 37%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;scroll-snap-align:start;display:block;}




/* E-mailwerving. Geen donkere slab meer maar een lichte band met beeld ernaast:
   het blok hoort bij de winkel, niet als een afsluitend reclamebord. */
.nlwrap{background:var(--gold-tint);border-top:1px solid var(--gold-soft);padding:0;}


.nl{display:grid;gap:0;}


.nl__i{display:none;}


.nl__t{padding:30px 18px 32px;}


.nl__eb{color:var(--gold-ink);margin-bottom:9px;}


.nl h3{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:29px;
  letter-spacing:-.012em;line-height:1.06;color:var(--ink);margin:0;text-wrap:balance;
}


.nl__d{margin-top:11px;font-size:14.5px;line-height:1.55;color:var(--ink-2);max-width:46ch;}


.nl__f{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap;max-width:460px;}


.nl__f input{
  flex:1 1 200px;min-width:0;padding:13px 14px;border-radius:11px;
  border:1px solid var(--line-strong);background:var(--white);color:var(--ink);
  font:inherit;font-size:15px;
}


.nl__f input::placeholder{color:var(--muted);}


.nl__f input:focus-visible{outline:2px solid var(--gold-ink);outline-offset:2px;border-color:transparent;}


.nl__f .btn{flex:0 0 auto;}


.nl__ok{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:14px;font-weight:600;color:#2F5C3E;}


/* display:flex wint van de browserregel voor [hidden]; expliciet terugzetten. */
.nl__ok[hidden]{display:none;}


.nl__ok svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:2.6;}


.nl__fine{margin-top:12px;font-size:11.5px;line-height:1.5;color:var(--ink-3);max-width:44ch;}


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




/* Klantfoto's direct onder de productgallerij. De CRO-checklist wil UGC naast
   of onder de hoofdafbeelding, niet alleen in een aparte reviewsectie. */
.galugc{display:flex;gap:6px;align-items:center;margin-top:10px;overflow-x:auto;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;}


.galugc::-webkit-scrollbar{display:none;}


.galugc__l{
  flex:0 0 auto;display:flex;align-items:center;gap:5px;padding-right:4px;
  font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--ink-3);
}


.galugc__l svg{width:11px;height:11px;fill:var(--gold);stroke:none;}


.galugc img{flex:0 0 54px;width:54px;height:54px;object-fit:cover;border-radius:9px;display:block;}



/* Betaalmethoden vlak voor de koopknop. */
.paylead{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:14px 0 8px;}


.paylead span{font-size:11.5px;font-weight:600;color:var(--ink-3);margin-right:2px;}


.paylead b{
  font-size:9.5px;font-weight:700;letter-spacing:.02em;color:var(--ink-2);
  background:var(--white);border:1px solid var(--line);border-radius:6px;padding:4px 6px;
}



/* Bezorgregel met een echte dag erin. */
.stock b{color:var(--ink);font-weight:700;}




/* Voortgangsbalk kassa. */
.costeps{display:flex;gap:0;align-items:center;justify-content:center;
  background:var(--white);border-bottom:1px solid var(--line);padding:11px 12px;}


.costeps span{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;
  color:var(--muted);padding:0 10px;}


.costeps span + span{border-left:1px solid var(--line);}


.costeps i{display:grid;place-items:center;width:18px;height:18px;border-radius:99px;
  background:var(--paper-2);color:var(--muted);font-size:10.5px;font-weight:800;font-style:normal;}


.costeps span.on{color:var(--ink);}


.costeps span.on i{background:var(--ink);color:var(--white);}



/* Express-afrekenen bovenaan, vóór het formulier. */
.cosec--express{padding-bottom:4px;}


.coexp__t{font-size:12px;font-weight:600;color:var(--ink-3);margin-bottom:9px;}


.coexp{display:flex;gap:8px;}


.coexp__b{flex:1;min-width:0;padding:12px 6px;border-radius:10px;border:1px solid var(--line-strong);
  background:var(--white);font:inherit;font-size:13px;font-weight:800;letter-spacing:-.01em;
  color:var(--ink);cursor:pointer;}


.coexp__b--ideal{color:#CC0066;}


.coexp__b--apple{background:#14120F;color:#fff;border-color:#14120F;}


.coexp__b--pp{color:#1B3D8F;}


.coexp__b:hover{border-color:var(--ink);}


.codiv{display:flex;align-items:center;gap:10px;margin:16px 0 2px;color:var(--ink-3);font-size:11.5px;}


.codiv::before,.codiv::after{content:"";flex:1;height:1px;background:var(--line);}




/* Staffelanker. Het doorgestreepte bedrag is de som van losse potjes tegen
   €29,95 — een hoeveelheidskorting, geen "was"-prijs in de tijd. */
.rung__was{
  display:block;font-size:11.5px;font-weight:600;color:var(--muted);
  text-decoration:line-through;text-decoration-thickness:1px;line-height:1.1;margin-bottom:1px;
}


.buy__was{
  font-size:17px;font-weight:600;color:var(--muted);
  text-decoration:line-through;text-decoration-thickness:1.5px;margin-right:2px;
}


.atc__price s, .sa__p s{
  opacity:.62;text-decoration:line-through;text-decoration-thickness:1px;
  font-weight:600;margin-right:3px;
}




/* Klantvideo's als horizontaal schuifrek: meerdere echte klanten naast elkaar.
   De eerste speelt vanzelf, de rest start als je erop tikt. */
.vidsec{background:var(--white);border-top:1px solid var(--line);}


.vidrail{
  display:flex;gap:12px;overflow-x:auto;padding:0 18px 6px;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
}


.vidrail::-webkit-scrollbar{display:none;}


.vidcard{flex:0 0 68%;margin:0;scroll-snap-align:start;}


.vidwrap{position:relative;border-radius:16px;overflow:hidden;background:var(--paper-2);}


.vid{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;}


.vid__b{
  position:absolute;right:9px;bottom:9px;width:34px;height:34px;border-radius:99px;
  border:0;background:rgba(20,18,15,.62);color:#fff;font-size:12px;line-height:1;
  cursor:pointer;backdrop-filter:blur(6px);
}


.vid__b:hover{background:rgba(20,18,15,.82);}


.vidcard figcaption{margin-top:9px;font-size:12.5px;line-height:1.45;color:var(--ink-3);}


.vidsec .cmp-hint{margin-top:10px;}




/* Twee bijkoopopties naast elkaar bij drie potjes. */
.upsell--twee{display:block;}


.up2{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;}


.upsell .up2__o{
  position:relative;text-align:left;padding:11px 11px 10px;border-radius:11px;
  border:1px solid var(--line-strong);background:var(--white);cursor:pointer;font:inherit;
}


.upsell .up2__o b{display:block;font-family:Archivo,sans-serif;font-weight:800;font-size:13.5px;
  letter-spacing:-.02em;color:var(--ink);}


.upsell .up2__o span{display:block;margin-top:3px;font-size:11.5px;font-weight:600;color:var(--ink-3);line-height:1.3;}


.upsell .up2__o:hover{border-color:var(--ink);}


.upsell .up2__o--best{border-color:var(--gold);background:var(--gold-tint);padding-top:19px;}


.upsell .up2__o--best i{
  position:absolute;top:-8px;left:10px;font-style:normal;font-size:9.5px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--gold-ink);
  padding:3px 7px;border-radius:99px;
}


.upsell .up2__o--best span{color:var(--gold-ink);}




/* "Voor wie dit is": drie herkenningszinnen, groter gezet dan gewone bullets
   omdat dit het moment is waarop iemand zichzelf herkent. */
.wie{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}


.wie li{display:flex;gap:10px;align-items:flex-start;}


.wie li svg{width:17px;height:17px;flex:none;margin-top:3px;stroke:var(--gold-ink);fill:none;stroke-width:2.6;stroke-linecap:round;}


.wie li span{font-size:15px;line-height:1.5;color:var(--ink);font-weight:600;}




/* Besteltikker: rustig, klein, onder de bestelteller. Geen knipperende banner. */
.ordtick{
  display:flex;align-items:center;gap:8px;margin:-4px 0 12px;padding:9px 12px;
  border:1px solid var(--line);border-radius:10px;background:var(--white);
  font-size:12.5px;color:var(--ink-3);line-height:1.35;
}


.ordtick b{color:var(--ink-2);font-weight:700;}


.ordtick i{
  width:6px;height:6px;border-radius:99px;background:#3F6B4F;flex:none;
}


.ordtick--in{animation:ordIn .45s ease-out;}


@keyframes ordIn{ from{opacity:0;transform:translateY(4px);} to{opacity:1;transform:none;} }


@media (prefers-reduced-motion: reduce){ .ordtick--in{animation:none;} }




/* Retourvoorwaarden: rustig gezet, maar wel leesbaar — het is de plek waar de
   belofte uit de balken wordt waargemaakt. */
.voorw{padding-top:26px;padding-bottom:26px;background:var(--paper-2);border-top:1px solid var(--line);}


.voorw h3{font-family:Archivo,sans-serif;font-weight:800;font-size:14px;letter-spacing:-.02em;
  color:var(--ink);margin:0 0 12px;}


.voorw ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}


.voorw li{position:relative;padding-left:15px;font-size:12.5px;line-height:1.55;color:var(--ink-2);max-width:66ch;}


.voorw li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;
  border-radius:99px;background:var(--line-strong);}


.voorw strong{color:var(--ink);font-weight:700;}




/* Bezorgregel als drie brokjes in plaats van een volzin. */
.lever{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:12px 0 4px;font-size:12px;}


.lever span{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:8px;
  font-weight:600;letter-spacing:-.005em;white-space:nowrap;}


.lever__v{background:var(--moss-soft);color:#2F5C3E;}


.lever__v i{width:6px;height:6px;border-radius:99px;background:#3F6B4F;}


.lever__c{background:var(--gold-tint);color:var(--gold-ink);font-variant-numeric:tabular-nums;}


.lever__d{background:var(--paper-2);color:var(--ink-2);}


.lever__d b{color:var(--ink);font-weight:700;}




/* Verzendtarieven en ambassadeurspagina. */
.secsub{font-family:Archivo,sans-serif;font-weight:800;font-size:17px;letter-spacing:-.03em;color:var(--ink);}


.tarief td:first-child{white-space:nowrap;}


.tarief td.own{color:#2F5C3E;font-weight:700;}


.voorwlijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}


.voorwlijst li{position:relative;padding-left:16px;font-size:13.5px;line-height:1.6;color:var(--ink-2);max-width:70ch;}


.voorwlijst li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:99px;background:var(--gold);}


.voorwlijst b{color:var(--ink);font-weight:700;}


.fine{font-size:12px;line-height:1.6;color:var(--ink-3);max-width:68ch;}



.amb{display:grid;gap:12px;}


.ambc{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:18px;}


.ambc i{display:block;font-style:normal;font-family:Archivo,sans-serif;font-weight:800;
  font-size:30px;letter-spacing:-.04em;color:var(--gold-ink);line-height:1;}


.ambc b{display:block;margin-top:9px;font-family:Archivo,sans-serif;font-weight:800;font-size:14.5px;
  letter-spacing:-.02em;color:var(--ink);}


.ambc p{margin-top:6px;font-size:13px;line-height:1.55;color:var(--ink-2);}



.ambform{margin-top:26px;background:var(--gold-tint);border:1px solid var(--gold-soft);
  border-radius:16px;padding:20px;max-width:460px;}


.ambform h3{font-family:Archivo,sans-serif;font-weight:800;font-size:16px;letter-spacing:-.02em;margin:0 0 12px;}


.ambform form{display:flex;flex-direction:column;gap:9px;}


.ambform input{padding:12px 13px;border-radius:10px;border:1px solid var(--line-strong);
  background:var(--white);font:inherit;font-size:15px;color:var(--ink);}


.ambform input::placeholder{color:var(--muted);}


.ambform input:focus-visible{outline:2px solid var(--gold-ink);outline-offset:2px;border-color:transparent;}




/* Bijkoopregel gebruikt dezelfde .upsell-strook als de winkelwagen. */


/* Verhaalblok op de productpagina: donker, redactioneel, één kolom leesbreedte.
   Het onderbreekt de winkel bewust — hier wordt verteld, niet gespecificeerd. */
.verhaal{background:var(--ink);color:#EDE7DC;padding:38px 0 40px;}


.verhaal__in{max-width:640px;}


.verhaal .eyebrow{color:var(--gold-bright);margin-bottom:12px;}


.verhaal h2{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;
  font-size:29px;line-height:1.08;letter-spacing:-.012em;color:#FBF7F0;
  margin:0 0 18px;text-wrap:balance;
}


.verhaal p{font-size:15.5px;line-height:1.68;color:#BDB3A4;margin:0 0 14px;}


.verhaal__slot{
  margin-top:20px !important;padding-top:16px;border-top:1px solid #322C25;
  color:#EDE7DC !important;font-weight:600;
}




/* Extra veld in het ambassadeursformulier. */
.ambform textarea{
  padding:12px 13px;border-radius:10px;border:1px solid var(--line-strong);
  background:var(--white);font:inherit;font-size:15px;color:var(--ink);resize:vertical;
}


.ambform textarea::placeholder{color:var(--muted);}


.ambform textarea:focus-visible{outline:2px solid var(--gold-ink);outline-offset:2px;border-color:transparent;}




/* Bedrijfsgegevens: een e-mailadres past niet in drie smalle kolommen op mobiel,
   dus daar stapelen ze. */
.specstrip--breed{grid-template-columns:1fr;}


.specstrip--breed > div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;text-align:left;}


.specstrip--breed dd{overflow-wrap:anywhere;}




/* ---------- kennisbank ---------- */
.bloglist{display:grid;gap:14px;}


.blogcard{
  display:block;border:1px solid var(--line);border-radius:16px;background:var(--white);
  padding:18px 18px 16px;text-align:left;width:100%;
}


.blogcard:hover{border-color:var(--line-strong);}


.blogcard__k{
  display:block;font-family:Archivo,sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-ink);
}


.blogcard__t{
  display:block;font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:22px;line-height:1.18;
  color:var(--ink);margin:7px 0 8px;text-wrap:balance;
}


.blogcard__p{font-size:14px;line-height:1.55;color:var(--ink-3);}


.blogcard__m{display:block;font-size:12px;color:var(--muted);}



.art{max-width:66ch;margin:0 auto;padding:22px 18px 40px;}


.art__kruim{font-size:12px;color:var(--muted);margin-bottom:14px;}


.art__kruim a{color:var(--gold-ink);font-weight:600;}


.art h1{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:31px;line-height:1.12;
  letter-spacing:-.01em;color:var(--ink);text-wrap:balance;margin-bottom:10px;
}


.art__meta{font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:20px;}


.art__tldr{
  background:var(--paper-2);border:1px solid var(--line);border-radius:14px;
  padding:16px 18px;margin-bottom:24px;
}


/* Op het lichte vlak van het samenvattingsblok haalt --gold-ink net geen 4,5.
   Daarom hier de donkere variant: 5,01 tegen #F0E8E0. */
.art__tldr b{
  display:block;font-family:Archivo,sans-serif;font-size:10.5px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:9px;
}


.art__tldr ul{margin:0;padding-left:18px;display:grid;gap:6px;}


.art__tldr li{font-size:14px;line-height:1.5;color:var(--ink-2);}


.art h2{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:25px;line-height:1.2;
  color:var(--ink);margin:30px 0 10px;text-wrap:balance;
}


.art h3{
  font-family:Archivo,sans-serif;font-weight:800;font-size:15.5px;letter-spacing:-.01em;
  color:var(--ink);margin:22px 0 6px;
}


.art p{font-size:15.5px;line-height:1.68;color:var(--ink-2);margin-bottom:13px;}


.art ul,.art ol{margin:0 0 15px;padding-left:20px;display:grid;gap:7px;}


.art li{font-size:15.5px;line-height:1.6;color:var(--ink-2);}


.art strong{color:var(--ink);font-weight:700;}


.art a{color:var(--gold-ink);font-weight:600;text-decoration:underline;text-underline-offset:2px;}


.art .cal{
  background:var(--paper);border-left:3px solid var(--gold);border-radius:0 12px 12px 0;
  padding:14px 16px;margin:18px 0 20px;
}


.art .cal p{margin:0;font-size:14.5px;}


.art .cmp{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:6px;}


.art .cmp th,.art .cmp td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top;}


.art .cmp th{font-family:Archivo,sans-serif;font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}


.art .cmp-hint{font-size:11.5px;color:var(--muted);margin-bottom:18px;}


.artvolgend{border-top:1px solid var(--line);margin-top:34px;padding-top:22px;}


.artvolgend h4{font-family:Archivo,sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:12px;}


.artprod{
  display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:16px;
  padding:12px;background:var(--white);margin-bottom:20px;width:100%;text-align:left;
}


.artprod img{width:66px;height:66px;border-radius:11px;object-fit:cover;background:var(--bone-2);flex:none;}


.artprod b{display:block;font-family:Archivo,sans-serif;font-size:15px;color:var(--ink);}


.artprod span{font-size:13px;color:var(--ink-3);}


.artprod em{font-style:normal;color:var(--gold-ink);font-weight:700;font-size:13px;}


.art__slot{font-size:12.5px;color:var(--muted);border-top:1px solid var(--line);margin-top:26px;padding-top:16px;line-height:1.55;}



/* Voetnoot bij het herkenningsblok: de claim staat hier voluit, niet achter de regel. */
.wievoet{
  font-size:13px;line-height:1.55;color:var(--ink-3);margin-top:11px;
  padding-left:2px;
}



/* ---------- kennisbank: kaarten met beeld, zoals een echte bloglijst ---------- */
.blogcard{
  display:flex;gap:0;flex-direction:column;overflow:hidden;padding:0;
}


.blogcard__i{display:block;background:var(--bone-2);}


.blogcard__i img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;}


.blogcard__b{display:block;padding:15px 16px 16px;}


.blogcard__m{margin:0 0 8px;}


.blogcard__t{font-size:20px;margin:5px 0 0;}


.blogcard__p{display:block;margin-bottom:11px;}


.blogcard__go{
  font-family:Archivo,sans-serif;font-size:12.5px;font-weight:800;color:var(--gold-ink);
}


.blogkop{
  background:var(--ink);color:var(--paper);border-radius:18px;overflow:hidden;
  padding:26px 20px 24px;margin-bottom:18px;
}


.blogkop p.eyebrow{color:var(--gold-bright);}


.blogkop h1{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:29px;line-height:1.14;
  color:var(--paper);margin:8px 0 10px;text-wrap:balance;
}


.blogkop p.lede{color:#D9D2C8;font-size:15px;line-height:1.6;margin:0;}


.art__kop{margin:0 0 22px;}


.art__kop img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;display:block;}



/* ---------- aanmeldvenster ---------- */
.popwrap{position:absolute;inset:0;z-index:200;display:grid;place-items:center;padding:20px;}


.popwrap[hidden]{display:none;}


.popbg{position:absolute;inset:0;background:rgba(20,18,15,.55);backdrop-filter:blur(2px);}


.pop{
  position:relative;width:100%;max-width:330px;background:var(--white);
  border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(20,18,15,.32);
  animation:popIn .28s cubic-bezier(.2,.8,.3,1) both;
}


@keyframes popIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}


@media (prefers-reduced-motion: reduce){ .pop{animation:none;} }


.pop__i img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:var(--bone-2);}


.pop__t{padding:17px 19px 19px;}


.pop__t h3{
  font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:24px;line-height:1.16;
  color:var(--ink);margin:7px 0 9px;text-wrap:balance;
}


.pop__d{font-size:14px;line-height:1.55;color:var(--ink-3);margin-bottom:14px;}


.pop__f{display:grid;gap:9px;}


.pop__f input{
  width:100%;border:1px solid var(--line-strong);border-radius:11px;padding:12px 13px;
  font-size:15px;font-family:inherit;color:var(--ink);background:var(--white);
}


.pop__f input:focus-visible{outline:2px solid var(--gold);outline-offset:1px;}


.pop__ok{display:flex;gap:7px;align-items:flex-start;font-size:13.5px;color:var(--moss,#3F6212);margin-top:11px;}


.pop__ok[hidden]{display:none;}


.pop__ok svg{width:16px;height:16px;flex:none;margin-top:2px;stroke:currentColor;fill:none;stroke-width:2.4;}


.pop__nee{
  display:block;width:100%;margin-top:11px;font-size:13px;color:var(--muted);
  text-decoration:underline;text-underline-offset:2px;padding:6px 0;
}


.pop__fine{font-size:11.5px;line-height:1.5;color:var(--muted);margin-top:10px;}


.pop__x{
  position:absolute;top:10px;right:10px;z-index:2;width:34px;height:34px;border-radius:99px;
  background:rgba(255,255,255,.92);display:grid;place-items:center;
}


.pop__x svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:2.2;}



/* ---------- rendersnelheid ----------
   Secties buiten beeld worden pas opgemaakt en getekend als ze in zicht komen.
   Met contain-intrinsic-size houdt de scrollbalk zijn juiste lengte. */
.shop section, .shop .verhaal, .shop .ftr, .shop .nlwrap{
  content-visibility:auto;
  contain-intrinsic-size:auto 520px;
}


/* Niet toepassen op de kop, de eerste sectie en alles wat sticky is:
   daar levert het niets op en kan het juist een sprong geven. */
.shop .hdr, .shop .anno, .shop .pagehead, .shop .hero, .shop .stickybar,
.shop section:first-of-type{
  content-visibility:visible;
}



/* Verplichte disclaimer boven de inleiding van een informatiepagina. */
.art__disc{
  font-size:13.5px;line-height:1.55;color:var(--ink-2);background:var(--paper-2);
  border-radius:12px;padding:12px 14px;margin:0 0 18px;
}



/* De kennisbank heeft bewust een eigen, rustiger jasje: geen menu, geen
   winkelwagen, geen productlinks. Zo staat de informatie los van de winkel. */
.kbhdr{position:sticky;top:0;z-index:30;background:var(--white);border-bottom:1px solid var(--line);}


.kbhdr__in{display:flex;align-items:baseline;gap:10px;padding:14px 18px;}


.kbhdr__t{
  font-family:Archivo,sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);
}


.kbftr{border-top:1px solid var(--line);padding:20px 18px 30px;background:var(--paper-2);}


.kbftr p{font-size:12.5px;line-height:1.6;color:var(--ink-3);margin:0 0 10px;}


.kbftr__m{color:var(--muted);}


.kbftr a{color:var(--gold);font-weight:600;}



/* Koppen die om structuurredenen een niveau omhoog gingen, houden hun uiterlijk. */
/* Geen kleur forceren: deze koppen staan soms op een donker vlak en moeten
   de kleur van hun omgeving overnemen. */
h2.h3, h3.h3{font-family:Archivo,sans-serif;font-weight:800;font-size:17px;letter-spacing:-.01em;color:inherit;}


h2.h4, h3.h4{font-family:Archivo,sans-serif;font-weight:800;font-size:14.5px;letter-spacing:-.01em;color:inherit;}

@media (min-width:1024px){



/* ============================================================
   SHOP — base (mobile-first). Desktop overrides live in 
   ============================================================ */
.shop{
  background:var(--bone);color:var(--ink);
  font-family:"Instrument Sans",sans-serif;
  position:relative;
}


.cmp-hint{display:none;}



/* ============================================================
   DESKTOP OVERRIDES (class-driven, not viewport-driven)
   ============================================================ */
.wrap{padding-left:56px;padding-right:56px;max-width:1240px;margin:0 auto;}


.sec{padding-top:76px;padding-bottom:76px;}


.anno .hide-s{display:flex;}


.burger{display:none;}


.hdr__in{padding:16px 56px;max-width:1240px;margin:0 auto;gap:36px;}


.logo{margin:0;font-size:22px;order:-1;}


.navbar{display:flex;gap:26px;font-size:14px;font-weight:600;margin-right:auto;}


.navbar a{color:var(--ink-2);text-decoration:none;}


.navbar a:hover{color:var(--gold);}


.hero{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;}


.hero__copy{padding:64px 44px 64px 56px;max-width:none;}


.hero h1{font-size:68px;}


.hero__sub{font-size:17.5px;max-width:44ch;}


.hero__cta{flex-direction:row;gap:12px;}


.hero__cta .btn{width:auto;}


.hero__img img{aspect-ratio:auto;height:600px;}


.usp__row{max-width:1240px;margin:0 auto;justify-content:center;padding:0 56px;}


.usp__i{font-size:13.5px;padding:0 26px;}


.shead h2{font-size:54px;}


.shead p{font-size:16.5px;}


.shead{margin-bottom:34px;}


.grid{grid-template-columns:repeat(3,1fr);gap:18px;}


.pcard__n{font-size:18px;}


.pcard__f{font-size:13.5px;}


.pcard__b{padding:16px;}


.pcard__p{font-size:18px;}


.two{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;}


.ing{display:grid;grid-template-columns:1fr 1fr;gap:14px;}


.qual{grid-template-columns:repeat(4,1fr);gap:14px;}


.lede{font-size:17px;}


.final h2{font-size:46px;}


.quiz{padding:34px 30px;}


.quiz h3{font-size:30px;}


.ftr__cols{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;}


.rev{width:320px;}


.btn{font-size:16px;}


.mix{padding:34px 30px;}


.mix h3{font-size:30px;}


.mix__c{width:130px;}


/* PDP desktop */
.pdp-top{display:grid;grid-template-columns:1.06fr .94fr;gap:44px;padding:34px 56px 0;max-width:1240px;margin:0 auto;align-items:start;}


.pdp-top .gal{border-radius:16px;overflow:hidden;position:sticky;top:88px;}


.buy{padding:0;background:transparent;}


.buy h1{font-size:38px;}


.specs{grid-template-columns:repeat(4,1fr);}


.sticky-atc{display:none;}


.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}


.gal__thumbs{padding:10px 0 0;}



/* desktop */
.cartpg{max-width:1000px;margin:0 auto;padding:44px 56px 70px;display:grid;grid-template-columns:1.5fr 1fr;gap:44px;align-items:start;}


.cartpg > h1, .cartpg > .cartpg__sub{grid-column:1 / -1;}


.cart-left{grid-column:1;}


.cart-right{grid-column:2;position:sticky;top:88px;}


.copg{max-width:1000px;margin:0 auto;padding:40px 56px 70px;display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:start;}


.co-left{grid-column:1;}


.co-right{grid-column:2;position:sticky;top:24px;}


.cobanner{padding:16px 56px;flex-direction:row;align-items:center;justify-content:space-between;}


.subsum{padding:18px 20px;}


.opts button{font-size:14.5px;padding:13px 8px;}


.xc{width:150px;}



/* desktop */
.pagehead{max-width:1240px;margin:0 auto;padding:52px 56px 8px;}


.pagehead h1{font-size:60px;}


.filters{max-width:1240px;margin:0 auto;padding:22px 56px 4px;}


.revhero{padding:40px 56px;flex-direction:row;gap:56px;align-items:center;max-width:1240px;margin:0 auto;}


.revhero .revbars{flex:1;max-width:380px;}


.revlist{max-width:1240px;margin:0 auto;padding:26px 56px 56px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}


.acct{max-width:840px;margin:0 auto;padding:44px 56px 70px;}


.thanks{max-width:640px;margin:0 auto;padding:56px 56px 70px;}


.story{max-width:760px;margin:0 auto;}


.drawer{display:none;}


.scrim{display:none;}


.specs--8{grid-template-columns:repeat(4,1fr);}


.why{display:grid;grid-template-columns:1fr 1fr;gap:12px;}


.why__note{grid-column:1 / -1;}


.buy__head{font-size:22px;}


.fnote{max-width:1240px;margin:0 auto;}


.bullets li{font-size:18px;}


.buy__desc{font-size:17px;}


.band img{height:220px;}


.why2{grid-template-columns:1.05fr .95fr;align-items:center;gap:44px;}


.why2 h2{font-size:40px;}


.why2__i img{aspect-ratio:1/1;}


.ugc{display:grid;grid-template-columns:repeat(6,1fr);overflow:visible;gap:10px;}


.ugc img{flex:none;width:100%;}



/* Op desktop staat het beeld ernaast en loopt het tot de rand door. */
/* Hier stond max-height:360px. Dat kapt het blok af maar verbergt de tekst niet:
   bij een bredere kolom breekt de tekst anders af, loopt hij eronderuit en komt
   hij boven op de voettekst te staan. min-height houdt de gewenste hoogte aan
   en laat het blok meegroeien wanneer de tekst meer ruimte nodig heeft. */
.nl{grid-template-columns:.8fr 1.2fr;align-items:stretch;min-height:360px;}


/* De foto mag het blok niet hoger duwen dan nodig: bij een breed scherm wordt de
   beeldkolom breder en daarmee de foto hoger. Begrenzen op de foto, niet op de
   tekst — anders loopt de tekst er weer onderuit. */
.nl__i{display:block;overflow:hidden;max-height:440px;}


.nl__i img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;display:block;}


.nl__t{padding:44px 48px;align-self:center;}


.nl h3{font-size:38px;}


.galugc img{flex-basis:62px;width:62px;height:62px;}


.vidcard{flex-basis:250px;}


.wie li span{font-size:16px;}


.amb{grid-template-columns:repeat(3,1fr);}


.verhaal{padding:64px 0 66px;}


.verhaal h2{font-size:42px;}


.verhaal p{font-size:16.5px;}


.specstrip--breed{grid-template-columns:repeat(3,1fr);}


.specstrip--breed > div{display:block;text-align:center;}


.bloglist{grid-template-columns:repeat(2,1fr);gap:18px;}


.art{padding-top:34px;}


.art h1{font-size:38px;}


.bloglist{grid-template-columns:repeat(3,1fr);}


.pop{max-width:400px;}
}

/* ==== aanmeldvenster ==== */
.egpop{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:18px;}
.egpop[hidden]{display:none;}
.egpop__bg{position:absolute;inset:0;background:rgba(20,18,15,.62);backdrop-filter:blur(3px);}
.egpop__box{position:relative;width:min(520px,100%);background:var(--white);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.45);animation:egpopIn .34s cubic-bezier(.2,.8,.3,1);}
@keyframes egpopIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.egpop__box{animation:none}}
.egpop__i{background:var(--bone-2);}
.egpop__i img{width:100%;height:132px;object-fit:cover;}
.egpop__t{padding:20px 22px 22px;}
.egpop__t h2{font-size:26px;line-height:1.1;letter-spacing:-.015em;margin:6px 0 0;}
.egpop__d{margin-top:10px;font-size:14.5px;line-height:1.5;color:var(--ink-2);}
.egpop__f{margin-top:14px;display:flex;flex-direction:column;gap:9px;}
.egpop__f input{width:100%;padding:14px 14px;border:1px solid var(--line-strong);border-radius:11px;font:inherit;background:var(--white);color:var(--ink);}
.egpop__f input:focus-visible{outline:2px solid var(--gold);outline-offset:1px;}
.egpop__ok{display:flex;gap:9px;align-items:flex-start;margin-top:14px;font-size:14px;color:var(--moss);}
.egpop__ok svg{width:18px;height:18px;flex:none;margin-top:2px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;}
.egpop__ok b{background:var(--gold-tint);color:var(--gold-ink);padding:1px 7px;border-radius:6px;letter-spacing:.04em;}
.egpop__nee{display:block;width:100%;margin-top:12px;font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:2px;}
.egpop__fine{margin-top:10px;font-size:11.5px;line-height:1.45;color:var(--muted);}
.egpop__x{position:absolute;top:8px;right:8px;z-index:2;width:40px;height:40px;display:grid;place-items:center;
  background:rgba(255,255,255,.9);border-radius:99px;}
.egpop__x svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2.2;stroke-linecap:round;}
@media (min-width:640px){
  .egpop__box{display:grid;grid-template-columns:200px 1fr;}
  .egpop__i img{height:100%;min-height:320px;}
}

/* ==== mobiel menu ==== */
.eg-mobmenu{background:var(--white);border-bottom:1px solid var(--line);padding:8px 18px 14px;display:grid;gap:2px;}
.eg-mobmenu[hidden]{display:none;}
.eg-mobmenu a{display:block;padding:12px 2px;font-weight:600;font-size:15px;border-bottom:1px solid var(--line);}
.eg-mobmenu a:last-child{border-bottom:0;}
@media (min-width:1024px){.eg-mobmenu{display:none!important;}}

/* ==== sticky koopbalk: alleen tonen als hij is aangezet ==== */
.sticky-atc{opacity:0;pointer-events:none;transform:translateY(100%);transition:.24s;}
.sticky-atc.on{opacity:1;pointer-events:auto;transform:none;}
@media (min-width:1024px){.sticky-atc{display:none;}}

/* De width/height-attributen op <img> zijn presentatiehints: ze houden de
   layout stabiel tijdens het laden, maar mogen de vormgeving niet overrulen.
   Zonder deze regel wint de hint van aspect-ratio en worden de foto's te hoog. */
/* Alleen de beelden die een width/height-attribuut dragen. De kleurband en de
   klantfoto's hebben een vaste hoogte uit het ontwerp; die moet blijven staan. */
.pcard__img img,.hero__img img,.gal__main img{height:auto;}
.nl__i img{height:100%;}
@media (min-width:1024px){.hero__img img{height:600px;}}

/* Skip-link: op onze pagina's laden we de basis-CSS van het thema niet meer,
   dus die moet hier zelf verstopt worden tot hij focus krijgt. */
.visually-hidden-focusable:not(:focus):not(:focus-within){
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.visually-hidden-focusable:focus{
  position:fixed;top:10px;left:10px;z-index:9999;background:var(--ink);color:var(--white);
  padding:10px 16px;border-radius:8px;font-weight:600;
}

/* ==== abonnementspaneel: inleidende regel ==== */
.subpanel__l{margin:0 0 12px;font-size:14px;line-height:1.5;color:var(--ink-2);}

/* ==== De Klaviyo-popup (verrassingspakket t.w.v. €185) is vervangen door ons
   eigen aanmeldvenster met €5 korting. Twee vensters over elkaar heen is voor
   niemand goed. Zolang het formulier in Klaviyo nog bestaat, houden we hem hier
   tegen — verwijderen doe je in Klaviyo zelf. ==== */
.klaviyo-form,
div[class^="kl-private-reset"],
div[class*=" kl-private-reset"]{display:none!important;}

/* ==== winkelwagenpagina: lijst en aantalknoppen ==== */
.cart-lijst{display:grid;gap:10px;}
.citem__n{display:block;color:inherit;text-decoration:none;}
.citem__n:hover{color:var(--gold-ink);}
.qty button{width:30px;height:30px;display:grid;place-items:center;font-size:16px;line-height:1;}
.cartpg h1{font-size:30px;letter-spacing:-.02em;}
.cartpg__sub{margin-top:6px;color:var(--muted);font-size:14px;}
.totals form{margin:0;}
@media (min-width:1024px){.cartpg h1{font-size:38px;}}

/* Een los <svg> zonder maat rekt uit tot de volle breedte van zijn ouder — dat
   gaf een reusachtige zwarte driehoek boven de verzendbalk. Alle vinkjes die
   niet in een .tick zitten, krijgen hier hun maat. */
.shipbar__t svg,.supply svg,.subsum__t svg,.cartpg__sub svg{
  width:15px;height:15px;flex:none;vertical-align:-2px;
  stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
}
.shipbar__t{display:flex;align-items:center;gap:7px;}

/* ==== waar het abonnement (nog) niet kan ====
   Het vak stond eerst gewoon leeg. Een klant die op zoek is naar een abonnement
   ziet dan niets en weet niet of het niet bestaat of dat de pagina stuk is. */
.geenabo{
  margin:4px 0 2px;padding:13px 15px;border-radius:12px;
  background:var(--bone-2);border:1px solid var(--line);
}
.geenabo__k{
  margin:0 0 5px;font-family:Archivo,sans-serif;font-weight:700;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
}
.geenabo p{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2);}

/* ==== het Klaviyo-venster "Pop up - FLIZZ" (verrassingspakket t.w.v. €185) ====
   Wordt vervangen door ons eigen €5-venster. Twee vensters over elkaar is voor
   niemand goed. Definitief weghalen doe je in Klaviyo zelf; dit houdt hem hier
   tegen zolang hij daar nog live staat. */
.klaviyo-form-RgEYAJ,
div[class*="klaviyo-form"],
div[class^="kl-private-reset"],
div[class*=" kl-private-reset"]{display:none!important;}

/* Het hidden-attribuut zet display:none via de browserstijl, maar elke eigen
   regel met display:flex of :block wint daarvan. Zo stonden het aanmeldformulier
   en de gelukt-melding tegelijk in beeld. Dit zet het recht voor het hele thema. */
[hidden]{display:none!important;}

/* ==== formulieren op inhoudspagina's (contact, zoeken) ==== */
.egform{display:grid;gap:14px;margin-top:22px;}
.egform__rij{display:grid;gap:6px;}
.egform label{font-family:Archivo,sans-serif;font-weight:700;font-size:12.5px;letter-spacing:.02em;color:var(--ink-2);}
.egform input,.egform textarea{
  width:100%;padding:13px 14px;border:1px solid var(--line-strong);border-radius:11px;
  font:inherit;background:var(--white);color:var(--ink);
}
.egform textarea{resize:vertical;min-height:120px;}
.egform input:focus-visible,.egform textarea:focus-visible{outline:2px solid var(--gold);outline-offset:1px;}
.egform .btn{justify-self:start;}
.egform__ok{display:flex;gap:9px;align-items:flex-start;color:var(--moss);font-size:14.5px;
  background:var(--moss-soft);border-radius:11px;padding:12px 14px;}
.egform__ok svg{width:18px;height:18px;flex:none;margin-top:2px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;}
.egform__fout{color:var(--amber);background:var(--amber-soft);border-radius:11px;padding:12px 14px;font-size:14px;}
.egform__fijn{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0;}
.egform--zoek{grid-template-columns:1fr auto;align-items:center;gap:9px;margin-top:16px;}
@media (max-width:520px){.egform--zoek{grid-template-columns:1fr;}}

/* ==== artikel: datumregel ==== */
.artmeta{font-size:12.5px;color:var(--muted);margin:-6px 0 18px;}
.artprod{text-decoration:none;}

/* De quizkaart en het quizresultaat gebruiken h2/h3 met een hulpklasse, zodat de
   koppenvolgorde op de pagina klopt. De oorspronkelijke regels keken alleen naar
   het element, niet naar de klasse. */
.pcard--quiz .h3{font-size:16px;}
.quiz .h3{font-size:22px;color:#FBF6ED;}
.quiz__res .h4{font-family:Archivo,sans-serif;font-weight:700;font-size:19px;letter-spacing:-.03em;margin:0 0 6px;}
@media (min-width:1024px){.quiz .h3{font-size:30px;}}

/* ==== chatknop boven de koopbalk ====
   De chatwidget van Shopify staat vast rechtsonder met z-index 2147483000; daar
   komt niets bovenuit. In plaats van eronder duiken schuiven we hem omhoog
   zodra de sticky koopbalk verschijnt, zodat de bestelknop vrij blijft. */
shopify-chat{transition:transform .22s ease;}
html.eg-koopbalk shopify-chat{transform:translateY(-76px);}
@media (min-width:1024px){html.eg-koopbalk shopify-chat{transform:none;}}
@media (prefers-reduced-motion:reduce){shopify-chat{transition:none;}}

/* ==== links ====
   In het concept zat dit achter :where(.shop), een omhulsel dat de secties in
   dit thema niet hebben. Daardoor viel elke link terug op de browserstandaard
   en stond de halve kennisbank onderstreept. De artikeltekst houdt bewust wél
   onderstreping: daar helpt het de lezer. */
a{color:inherit;text-decoration:none;}
.art a,.rte a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px;}
.blogcard,.blogcard *{text-decoration:none;}

/* ==== beeld bovenaan een kennisbankartikel ==== */
.artbeeld{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:14px;margin:0 0 18px;background:var(--bone-2);}

/* ==== doorlink van artikel naar product ====
   Bewust zonder werking of belofte: alleen naam, inhoud en prijs. Zodra hier
   een gezondheidsuitspraak bij komt, wordt het artikel reclame mét claim. */
.artvan{margin-top:30px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--bone);}
.artvan__k{margin:0 0 10px;font-family:Archivo,sans-serif;font-size:10.5px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);}
.artvan .artprod{display:flex;align-items:center;gap:12px;text-decoration:none;}
.artvan .artprod b{display:block;font-family:Archivo,sans-serif;font-size:15px;color:var(--ink);}
.artvan__m{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;}
.artvan__go{margin-left:auto;font-family:Archivo,sans-serif;font-size:12.5px;font-weight:800;color:var(--gold-ink);white-space:nowrap;}
.artvan__fijn{margin:11px 0 0;font-size:12px;line-height:1.5;color:var(--ink-3);}

/* ==== paginering van de kennisbank ==== */
.kbpag{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:28px;
  font-size:13.5px;color:var(--muted);flex-wrap:wrap;}
.kbpag a{font-family:Archivo,sans-serif;font-weight:700;color:var(--gold-ink);
  border:1px solid var(--line);border-radius:99px;padding:9px 16px;}
.kbpag a:hover{border-color:var(--line-strong);}