/* ============================================================
   lisselle — parelmoer editorial (multi-page)
   porcelain / ink / rose-gold / pearl iridescence
   ============================================================ */
:root{
  --porcelain:#FAF7F2;
  --ivory:#F3EDE4;
  --shell:#EFE7DC;
  --ink:#1C1B1A;
  --ink-60:rgba(28,27,26,.62);
  --ink-40:rgba(28,27,26,.42);
  --ink-12:rgba(28,27,26,.12);
  --rosegold:#B76E79;
  --rosegold-deep:#9C5560;
  --brand-brown:#4A3B33;
  --pearl-hi:#FBEFE8;
  --pearl-mid:#F0D4C4;
  --pearl-lo:#DDB4A0;
  --mocha:#241F1B;
  --mocha-2:#2D2722;
  --pearl-a:#EDE4F0;
  --pearl-b:#F7E7E0;
  --pearl-c:#E2EEEC;
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Jost', 'Helvetica Neue', sans-serif;
  --ease-out:cubic-bezier(.22,.61,.21,1);
  --ease-luxe:cubic-bezier(.65,.05,.18,1);
  /* text reveal */
  --reveal-descender:0.18em;
  --reveal-clip-margin:0.06em;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{overflow:hidden;height:100%;}
body{
  font-family:var(--sans);
  font-weight:300;
  background:var(--porcelain);
  color:var(--ink);
  line-height:1.65;
  height:100%;
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--rosegold);color:var(--porcelain);}
img,svg,video{display:block;max-width:100%;}
a{color:inherit;}
button{font-family:inherit;}

/* ============================================================
   APP SHELL + SWUP (nested scroll container)
   ============================================================ */
.app{
  display:grid;
  grid-template-rows:1fr;
  height:100dvh;
  overflow:hidden;
}
#swup{
  position:relative;
  overflow-y:auto;
  overflow-x:clip;
  scroll-behavior:smooth;
  background:var(--porcelain);
  z-index:calc(2 - var(--swup-parallel-container, 0));
}
#swup.is-previous-container{z-index:1;pointer-events:none;}
html.is-changing .transition-fade{
  transition:
    opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    filter 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.transition-fade.is-previous-container{opacity:0;filter:blur(5px);}
.transition-fade.is-next-container{opacity:0;filter:blur(5px);}

/* ---------- grain overlay ---------- */
.grain{
  position:fixed;inset:-50%;width:200%;height:200%;
  pointer-events:none;z-index:2000;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift 9s steps(6) infinite;
}
@keyframes grainShift{
  0%,100%{transform:translate(0,0)}
  20%{transform:translate(-2%,1.5%)}
  40%{transform:translate(1.5%,-2%)}
  60%{transform:translate(-1%,-1%)}
  80%{transform:translate(2%,1%)}
}

/* ---------- preloader ---------- */
#loader{
  position:fixed;inset:0;background:var(--porcelain);z-index:100000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;
  transition:opacity .7s var(--ease-luxe),visibility .7s;
}
#loader.done{opacity:0;visibility:hidden;}
.loader-pearl{width:54px;height:54px;border-radius:50%;position:relative;}
.loader-pearl span{position:absolute;inset:0;border-radius:50%;border:1px solid var(--rosegold);opacity:0;animation:ringGrow 1.6s var(--ease-out) infinite;}
.loader-pearl span:nth-child(2){animation-delay:.35s;}
.loader-pearl span:nth-child(3){animation-delay:.7s;}
.loader-pearl::after{content:'';position:absolute;inset:38%;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 60%,var(--pearl-lo));}
@keyframes ringGrow{0%{transform:scale(.4);opacity:0}35%{opacity:.85}100%{transform:scale(1.25);opacity:0}}
.loader-word{font-family:var(--sans);font-size:1.55rem;letter-spacing:.06em;font-weight:400;text-transform:lowercase;color:var(--brand-brown);}
.loader-tag{font-size:.68rem;letter-spacing:.45em;text-transform:uppercase;color:var(--ink-40);}

/* ============================================================
   ANNOUNCEMENT BAR
   ============================================================ */
:root{--announce-h:38px;}
.announce{
  position:fixed;top:0;left:0;right:0;z-index:99;
  background:var(--mocha);color:rgba(250,247,242,.85);
  min-height:var(--announce-h);
  font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;text-align:center;
  padding:.6rem 1rem;transition:transform .4s var(--ease-out);
}
.announce b{color:#fff;font-weight:500;}
.announce .code{border:1px dashed rgba(250,247,242,.5);padding:.12rem .55rem;border-radius:6px;letter-spacing:.22em;margin:0 .2rem;}
.announce .a-sep{margin:0 .7rem;opacity:.5;}
body.is-scrolled .announce{transform:translateY(-100%);}
@media (max-width:760px){
  :root{--announce-h:32px;}
  .announce .a-extra,.announce .a-lead{display:none;}
  .announce .a-sep{margin:0 .45rem;}
  .announce{font-size:.58rem;letter-spacing:.08em;padding:.5rem .75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .announce .code{padding:.08rem .4rem;letter-spacing:.16em;}
}

/* ============================================================
   NAVIGATION 01 (adapted to lisselle)
   ============================================================ */
.navigation-01-header {
  --font-sans: var(--sans);
  --ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
  --ease-dropdown: linear(0, 0.005, 0.02 2.1%, 0.081 4.7%, 0.467 15.7%, 0.563, 0.645, 0.717, 0.778 28.5%, 0.829 32%, 0.872 35.8%, 0.909 40.1%, 0.938 44.9%, 0.961 50.3%, 0.977 56.5%, 0.987 63.6%, 0.994 72.3%, 1);
  --duration-dropdown: 0.5s;
  --clr-light: rgba(28, 27, 26, 0.78);
  --corner-shape: superellipse(1.2);
  --box-shadow: 0px 4px 4px 0px hsla(0, 0%, 0%, 0.039), 0px 0px 1px 0px hsla(0, 0%, 0%, 0.62);

  position: fixed;
  top: var(--announce-h, 38px);
  z-index: 100;
  display: flex;
  justify-content: center;
  width: 100%;
  padding-block: 16px;
  overflow: visible;
  color: var(--porcelain);
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 400;
  transition: top .4s var(--ease-out);
}
.navigation-01-header.is-scrolled{top:0;}
.navigation-01-header *,
.navigation-01-header *::before,
.navigation-01-header *::after { box-sizing: border-box; }
.navigation-01-header a { color: inherit; text-decoration: none; }
.navigation-01-header ul, .navigation-01-header li { padding: 0; margin: 0; list-style: none; }
.navigation-01-header button { padding: 0; border: 0; color: inherit; font: inherit; background: none; cursor: pointer; }
.navigation-01-header img, .navigation-01-header svg { display: block; max-width: 100%; }

.navigation-01-header .cta {
  grid-column: 3; justify-self: end;
  display: inline-flex; align-items: center; gap: 12px;
  padding: 5px 14px; border-radius: 9999px;
  color: var(--ink); font-size: 13px; letter-spacing: .12em; text-transform: uppercase;
  background-color: var(--porcelain);
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}
@media (hover: hover) { .navigation-01-header .cta:hover { opacity: 0.85; } }
.navigation-01-header .cta:active { transform: scale(0.98); }

.navigation-01-header .header-shell {
  --header-shell-expanded-max: 1024px;
  --header-shell-scrolled-max: 720px;
  position: relative; width: 100%;
  max-width: var(--header-shell-max, var(--header-shell-expanded-max));
  transition: max-width 0.8s var(--ease-dropdown);
}
/* liquid glass: doorschijnend donker glas met lichte glasrand,
   de pagina schemert er vervaagd doorheen zodra je scrolt */
.navigation-01-header .header-bar {
  position: absolute; inset: 0; border-radius: 28px;
  corner-shape: var(--corner-shape);
  pointer-events: none; opacity: 0;
  background-color: rgba(28, 27, 26, 0.55);
  -webkit-backdrop-filter: blur(18px) saturate(1.45);
  backdrop-filter: blur(18px) saturate(1.45);
  box-shadow:
    0 6px 22px rgba(0, 0, 0, 0.22),
    0 0 1px rgba(0, 0, 0, 0.62),
    inset 1.6px 1.6px 1px -1px rgba(255, 255, 255, 0.4),
    inset -1px -1px 1px -0.5px rgba(255, 255, 255, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.08);
  transition: opacity 0.35s var(--ease-out-cubic);
}
.navigation-01-header .header-bar::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 46%);
}
.navigation-01-header.is-scrolled .header-bar { opacity: 1; }
.navigation-01-header.is-scrolled .header-shell { max-width: var(--header-shell-max-scrolled, var(--header-shell-scrolled-max)); }
.navigation-01-header .header-content {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  width: 100%; min-height: 36px; padding: 6px 12px 6px 16px; overflow: visible;
}
.navigation-01-header :where(a, button):focus-visible { outline: 2px solid var(--rosegold); outline-offset: 2px; box-shadow: none; }

.navigation-01-header .logo {
  justify-self: start; display: inline-flex; align-items: center; gap: .55rem;
  font-family: var(--sans); font-size: 1.3rem; letter-spacing: .05em; font-weight: 400;
  text-transform: lowercase;
  border-radius: 9999px;
  transition: color .3s;
}
.navigation-01-header .logo .dot{
  width:13px;height:13px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 55%,var(--pearl-lo));
  box-shadow:0 1px 3px rgba(74,59,51,.25);
}
/* Bovenaan de pagina (niet gescrold) is de pill transparant.
   Donkere/foto-start (index, product): porseleinen tekst + zachte schaduw.
   Lichte start (over, faq — body.nav-light via data-nav op #swup): inkt. */
.navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .nav-item,
.navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .logo {
  text-shadow: 0 1px 14px rgba(20, 15, 12, 0.45);
}
body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) { color: var(--ink); }
body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .logo { color: var(--brand-brown); }
body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .cta { background: var(--ink); color: var(--porcelain); }
body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .nav-item,
body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .logo { text-shadow: none; }
.navigation-01-header.is-scrolled, .navigation-01-header.is-mobile-nav-open { color: var(--porcelain); }
.navigation-01-header.is-scrolled .nav-item,
.navigation-01-header.is-scrolled .logo { text-shadow: none; }
@media (max-width: 900px){
  /* mobiel: pill altijd zichtbaar (donker glas) → tekst altijd porselein */
  .navigation-01-header,
  body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) { color: var(--porcelain); }
  body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .logo { color: var(--porcelain); }
  body.nav-light .navigation-01-header:not(.is-scrolled):not(.is-mobile-nav-open) .cta { background: var(--porcelain); color: var(--ink); }
  .navigation-01-header .nav-item, .navigation-01-header .logo { text-shadow: none; }
}

.navigation-01 {
  grid-column: 2; justify-self: center; position: relative; overflow: visible;
  padding-inline: 8px; border-radius: 9999px; corner-shape: var(--corner-shape);
}
.navigation-01 .nav-list { position: relative; z-index: 2; display: flex; align-items: center; gap: 0; padding: 3px; }
.navigation-01 .nav-flyout {
  position: absolute; top: calc(100% + 10px); right: 0; left: -4px; z-index: 10;
  visibility: hidden; pointer-events: none; transition: visibility 0ms linear 180ms;
}
.navigation-01 .nav-flyout[hidden] { display: block; }
.navigation-01 .nav-flyout::before { content: ""; position: absolute; top: -12px; left: 0; width: 100%; height: 12px; pointer-events: none; }
.navigation-01 .nav-flyout.is-open { visibility: visible; pointer-events: auto; transition: visibility 0ms; }
.navigation-01 .nav-flyout.is-open::before { pointer-events: auto; }
.navigation-01 .nav-flyout.is-open .nav-flyout__bg {
  --flyout-y: 0px; --flyout-scale: 1;
  background-color: var(--clr-light);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.navigation-01 .nav-flyout.is-open .nav-flyout__viewport { --flyout-y: 0px; --flyout-scale: 1; }
.navigation-01 .nav-flyout__bg,
.navigation-01 .nav-flyout__viewport {
  position: absolute; top: 0; left: 0; width: 0; height: 0;
  border-radius: 16px; corner-shape: var(--corner-shape);
  --flyout-y: -4px; --flyout-scale: 0.98;
  transform: translate3d(var(--flyout-x, 0px), var(--flyout-y), 0) scale(var(--flyout-scale));
  transition:
    transform var(--duration-dropdown) var(--ease-dropdown),
    width var(--duration-dropdown) var(--ease-dropdown),
    height var(--duration-dropdown) var(--ease-dropdown);
}
.navigation-01 .nav-flyout__bg {
  z-index: 0; will-change: width, height, transform;
  background-color: rgba(0, 0, 0, 0);
  -webkit-backdrop-filter: blur(0px);
  backdrop-filter: blur(0px);
  transition:
    transform var(--duration-dropdown) var(--ease-dropdown),
    width var(--duration-dropdown) var(--ease-dropdown),
    height var(--duration-dropdown) var(--ease-dropdown),
    background-color 180ms var(--ease-out-quad),
    -webkit-backdrop-filter 180ms var(--ease-out-quad),
    backdrop-filter 180ms var(--ease-out-quad);
}
.navigation-01 .nav-flyout__viewport { z-index: 1; overflow: hidden; }
.navigation-01 .nav-flyout__bg.is-instant,
.navigation-01 .nav-flyout__viewport.is-instant { transition: transform 0s, width 0s, height 0s; }
.navigation-01 .nav-flyout__panel {
  position: absolute; top: 0; left: 0; width: max-content;
  opacity: 0; pointer-events: none; transform: translate3d(0, 0, 0);
  transition: transform var(--duration-dropdown) var(--ease-dropdown), opacity 180ms var(--ease-out-quad);
}
.navigation-01 .nav-flyout__panel.is-active { opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0); }
.navigation-01 .nav-flyout__panel.is-leaving-left,
.navigation-01 .nav-flyout__panel.is-enter-left { opacity: 0; transform: translate3d(-200px, 0, 0); }
.navigation-01 .nav-flyout__panel.is-leaving-right,
.navigation-01 .nav-flyout__panel.is-enter-right { opacity: 0; transform: translate3d(200px, 0, 0); }
.navigation-01 .nav-dropdown__inner { position: relative; }
.navigation-01 .nav-dropdown__list { position: relative; z-index: 1; display: flex; flex-direction: column; }
.navigation-01 .nav-dropdown__pill {
  position: absolute; top: 0; left: 0; z-index: 0; pointer-events: none;
  border-radius: 13px; corner-shape: var(--corner-shape); opacity: 0;
  background: rgba(255, 255, 255, 0.1);
  transform: translate3d(0, 0, 0);
  transition: transform 200ms var(--ease-out-cubic), height 200ms var(--ease-out-cubic), opacity 150ms ease;
}
.navigation-01 .nav-dropdown__pill.is-instant { transition: opacity 150ms ease; }
.navigation-01 .nav-dropdown__pill.is-visible { opacity: 1; }
.navigation-01 .nav-dropdown__item {
  position: relative; z-index: 1; display: block; width: 100%;
  padding: 12px; border-radius: 13px; corner-shape: var(--corner-shape); text-align: left;
}
.navigation-01 .nav-dropdown__title { font-weight: 400; line-height: 1.2; }
.navigation-01 .nav-dropdown__description { color: hsla(0, 0%, 100%, 0.55); font-size: 13px; line-height: 1.35; }
.navigation-01 .nav-flyout__panel--mega .nav-dropdown__inner { display: flex; align-items: stretch; width: 640px; }
.navigation-01 .nav-flyout__panel--mega .nav-dropdown__sidebar { position: relative; flex: 0 0 38%; padding: 4px 0 4px 4px; }
.navigation-01 .nav-flyout__panel--mega .nav-dropdown__item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.navigation-01 .nav-dropdown__preview { position: relative; flex: 1; margin: 4px; border-radius: 13px; corner-shape: var(--corner-shape); background-color: #14110f; }
.navigation-01 .nav-dropdown__preview-panel { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity 200ms var(--ease-out-quad); }
.navigation-01 .nav-dropdown__preview-panel.is-active,
.navigation-01 .nav-dropdown__preview-panel.is-entering.is-entering-active { opacity: 1; }
.navigation-01 .nav-dropdown__preview-panel.is-active .nav-dropdown__placeholder img,
.navigation-01 .nav-dropdown__preview-panel.is-entering.is-entering-active .nav-dropdown__placeholder img { transform: scale(1); }
.navigation-01 .nav-dropdown__preview-panel.is-entering { opacity: 0; }
.navigation-01 .nav-dropdown__preview-panel.is-entering .nav-dropdown__placeholder img { transform: scale(1.1); }
.navigation-01 .nav-dropdown__placeholder { width: 100%; height: 100%; overflow: hidden; border-radius: 13px; corner-shape: var(--corner-shape); }
.navigation-01 .nav-dropdown__placeholder img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  opacity: 0.95; transform: scale(1.1); transition: transform 600ms var(--ease-out-cubic);
}
.navigation-01 .nav-flyout__panel--simple .nav-dropdown__inner { width: max-content; min-width: 220px; padding: 4px; }
.navigation-01 .nav-flyout__panel--simple .nav-dropdown__title { white-space: nowrap; }
.navigation-01 .nav-flyout__panel--featured .nav-dropdown__inner { display: flex; gap: 4px; padding: 4px; }
.navigation-01 .nav-featured__card {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  width: 200px; height: 280px; padding: 16px; overflow: hidden; isolation: isolate;
  border-radius: 13px; corner-shape: var(--corner-shape); background-color: var(--clr-light);
}
.navigation-01 .nav-featured__card::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.5) 33%, rgba(0, 0, 0, 0) 62%);
}
.navigation-01 .nav-featured__card:hover .nav-featured__image { transform: scale(1); }
.navigation-01 .nav-featured__image {
  position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center; opacity: 0.9;
  transform: scale(1.06); transition: transform 500ms var(--ease-out-cubic);
}
.navigation-01 .nav-featured__content { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 4px; }
.navigation-01 .nav-list > li > .nav-item { opacity: 1; transition: opacity 150ms ease; }
.navigation-01:has(.nav-list > li > .nav-item:is(:hover, :focus-visible, [aria-expanded="true"])) .nav-list > li > .nav-item { opacity: 0.55; }
.navigation-01:has(.nav-list > li > .nav-item:is(:hover, :focus-visible, [aria-expanded="true"])) .nav-list > li > .nav-item:is(:hover, :focus-visible, [aria-expanded="true"]) { opacity: 1; }
.navigation-01 .nav-item {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 12px; border-radius: 9999px;
  letter-spacing: .06em;
}
.navigation-01 .nav-item:hover .nav-chevron,
.navigation-01 .nav-item:active .nav-chevron,
.navigation-01 .nav-item[aria-expanded="true"] .nav-chevron { transform: rotate(180deg); }
.navigation-01 .nav-chevron { width: 9px; height: 9px; transition: transform 150ms ease-out; }
.navigation-01 .nav-hover-bg {
  position: absolute; top: 0; left: 0; z-index: 1; pointer-events: none;
  border-radius: 9999px; corner-shape: var(--corner-shape); opacity: 0;
  background: rgba(127,127,127,.16);
  transform: translate3d(0, 0, 0);
  transition: transform 200ms var(--ease-out-cubic), width 200ms var(--ease-out-cubic), opacity 150ms ease;
}
.navigation-01 .nav-hover-bg.is-instant { transition: opacity 150ms ease; }
.navigation-01 .nav-hover-bg.is-visible { opacity: 1; }
.navigation-01 .nav-accordion { display: none; }
.navigation-01-header .nav-menu-toggle {
  display: none; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 9999px; corner-shape: var(--corner-shape); color: currentColor;
}
.navigation-01-header .nav-menu-toggle__icon { position: relative; width: 16px; height: 10px; }
.navigation-01-header .nav-menu-toggle__icon span {
  position: absolute; top: 50%; left: 0; width: 100%; height: 1.5px; border-radius: 999px;
  background-color: currentColor; transform-origin: center;
  transition: transform 0.35s var(--ease-out-cubic), top 0.35s var(--ease-out-cubic);
}
.navigation-01-header .nav-menu-toggle__icon span:nth-child(1) { transform: translateY(calc(-50% - 3.25px)); }
.navigation-01-header .nav-menu-toggle__icon span:nth-child(2) { transform: translateY(calc(-50% + 3.25px)); }
.navigation-01-header.is-mobile-nav-open .nav-menu-toggle__icon span:nth-child(1) { top: 50%; transform: translateY(-50%) rotate(45deg); }
.navigation-01-header.is-mobile-nav-open .nav-menu-toggle__icon span:nth-child(2) { top: 50%; transform: translateY(-50%) rotate(-45deg); }

@media (max-width: 900px) {
  .navigation-01-header { padding-inline: 16px; }
  .navigation-01-header .header-shell,
  .navigation-01-header.is-scrolled .header-shell { max-width: none; }
  .navigation-01-header .header-bar { opacity: 1; }
  .navigation-01-header .header-content { display: flex; align-items: center; gap: 10px; padding-inline: 12px; padding-left: 16px; }
  .navigation-01-header .logo { flex: none; margin-right: auto; font-size: 1.2rem; color: var(--porcelain); }
  .navigation-01-header .cta { gap: 8px; padding: 4px 10px; font-size: 12px; }
  .navigation-01-header .nav-menu-toggle { display: inline-flex; }
  .navigation-01 {
    position: absolute; top: calc(100% + 4px); right: 0; left: 0; z-index: 50;
    display: flex; flex-direction: column; grid-column: unset; justify-self: unset;
    max-height: calc(100dvh - 110px); padding: 4px; overflow-x: hidden; overflow-y: auto;
    overscroll-behavior: contain; border-radius: 24px; corner-shape: var(--corner-shape);
    opacity: 0; visibility: hidden; pointer-events: none;
    background-color: var(--clr-light);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    box-shadow: var(--box-shadow);
    clip-path: inset(0 0 100% 0 round 24px);
    transition: clip-path 0.55s var(--ease-dropdown), opacity 0.25s var(--ease-out-quad), visibility 0s linear 0.55s;
  }
  .navigation-01 .nav-list { flex-direction: column; align-items: stretch; width: 100%; gap: 2px; padding: 0; }
  .navigation-01 .nav-list > li { display: block; opacity: 1 !important; }
  .navigation-01 .nav-list > li > .nav-item {
    display: flex; align-items: center; justify-content: space-between; width: 100%;
    padding: 16px 18px; border-radius: 24px; corner-shape: var(--corner-shape);
    font-size: 17px; opacity: 1 !important; transition: background-color 0.2s ease;
  }
  .navigation-01 .nav-list > li.is-expanded > .nav-item { background-color: rgba(255, 255, 255, 0.06); }
  .navigation-01 .nav-chevron { width: 11px; height: 11px; }
  .navigation-01 .nav-item:hover .nav-chevron,
  .navigation-01 .nav-item:active .nav-chevron { transform: none; }
  .navigation-01 .nav-item[aria-expanded="true"] .nav-chevron { transform: rotate(180deg); }
  .navigation-01 .nav-hover-bg { display: none; }
  .navigation-01 .nav-flyout,
  .navigation-01 .nav-flyout[hidden],
  .navigation-01 .nav-flyout__bg,
  .navigation-01 .nav-flyout__viewport { display: none; }
  .navigation-01 .nav-accordion { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.45s var(--ease-dropdown); }
  .navigation-01 .nav-list > li.is-expanded > .nav-accordion { grid-template-rows: 1fr; }
  .navigation-01 .nav-accordion__inner { min-height: 0; overflow: hidden; }
  .navigation-01 .nav-flyout__panel.is-accordion {
    position: static; display: block; width: 100%; padding: 2px 0 10px;
    opacity: 1; pointer-events: auto; transform: none; transition: none;
  }
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__inner { width: 100%; flex-direction: column; }
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__sidebar { flex: none; width: 100%; padding: 0; }
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__preview,
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__pill { display: none; }
  .navigation-01 .nav-flyout__panel--simple .nav-dropdown__inner,
  .navigation-01 .nav-flyout__panel--featured .nav-dropdown__inner { width: 100%; padding: 0; }
  .navigation-01 .nav-flyout__panel--simple .nav-dropdown__pill,
  .navigation-01 .nav-flyout__panel--featured .nav-dropdown__pill { display: none; }
  .navigation-01 .nav-flyout__panel--featured .nav-dropdown__inner { flex-direction: column; gap: 0; }
  .navigation-01 .nav-featured__card {
    width: 100%; height: auto; padding: 11px 17px; border-radius: 24px;
    background-color: transparent; transition: background-color 0.2s ease;
  }
  .navigation-01 .nav-featured__card::after,
  .navigation-01 .nav-featured__image { display: none; }
  .navigation-01 .nav-featured__card:hover,
  .navigation-01 .nav-featured__card:focus-visible,
  .navigation-01 .nav-dropdown__item:hover,
  .navigation-01 .nav-dropdown__item:focus-visible { background-color: rgba(255, 255, 255, 0.05); }
  .navigation-01 .nav-featured__content { gap: 4px; }
  .navigation-01 .nav-dropdown__item { padding: 11px 17px; border-radius: 24px; transition: background-color 0.2s ease; }
  .navigation-01-header.is-mobile-nav-open { z-index: 200; }
  .navigation-01-header.is-mobile-nav-open .navigation-01 {
    opacity: 1; visibility: visible; pointer-events: auto;
    clip-path: inset(0 0 0 0 round 24px);
    transition: clip-path 0.55s var(--ease-dropdown), opacity 0.2s var(--ease-out-quad), visibility 0s;
  }
}

/* ============================================================
   HERO 01
   ============================================================ */
.hero-01{position:relative;overflow:hidden;height:100svh;color:#fff;}
.hero-01__media{position:absolute;inset:0;}
.hero-01__image,.hero-01__overlay{
  position:absolute;inset:0;object-fit:cover;width:100%;height:100%;
}
.hero-01__overlay{
  background:linear-gradient(100deg,rgba(20,15,12,.58) 0%,rgba(20,15,12,.30) 42%,rgba(20,15,12,.06) 68%,rgba(20,15,12,.12) 100%);
}
.hero-01__video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.4s ease;
}
.hero-01__video.is-playing{opacity:1;}
.hero-01__content{
  position:relative;padding-top:24vh;height:100%;
  display:flex;flex-direction:column;
  padding-inline:clamp(1.4rem,4.5vw,4rem);
}
.hero-01__label{
  display:inline-flex;align-items:center;gap:.9rem;margin-bottom:1.6rem;
  font-size:.68rem;letter-spacing:.45em;text-transform:uppercase;color:rgba(250,247,242,.85);
}
.hero-01__label::before{content:'';width:38px;height:1px;background:var(--rosegold);}
.hero-01__content h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2.6rem,6.4vw,5.6rem);
  line-height:1.02;max-width:14ch;letter-spacing:-0.01em;
}
.hero-01__content h1 em{font-style:italic;color:var(--pearl-b);}
.hero-01__bottom{
  margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;
  padding-block:32px;font-size:clamp(1rem,1.4vw,1.2rem);
}
.hero-01__bottom p{max-width:36ch;line-height:1.5;color:rgba(250,247,242,.92);}
.hero-01__bottom span{opacity:.55;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;}
@media (max-width:1024px){
  .hero-01__bottom{flex-direction:column;align-items:flex-start;gap:16px;}
}

/* ---------- liquid glass CTA (hero) ---------- */
.liquid-btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  margin-top:2.2rem;height:3.5rem;padding:0 2.6rem;border-radius:999px;
  font-family:var(--sans);font-size:.8rem;font-weight:400;letter-spacing:.24em;text-transform:uppercase;
  color:#fff;text-decoration:none;cursor:pointer;white-space:nowrap;
  text-shadow:0 1px 8px rgba(20,15,12,.45);
  transition:transform .3s var(--ease-out);
  opacity:0;transform:translateY(16px);
  animation:heroCta .9s var(--ease-out) 2.5s forwards;
}
@keyframes heroCta{to{opacity:1;transform:none;}}
.liquid-btn:hover{transform:scale(1.05);}
.liquid-btn:active{transform:scale(.98);}
.liquid-btn::before{
  content:'';position:absolute;inset:0;border-radius:999px;pointer-events:none;z-index:1;
  box-shadow:
    0 0 8px rgba(0,0,0,.03),
    0 2px 6px rgba(0,0,0,.08),
    inset 3px 3px .5px -3.5px rgba(255,255,255,.09),
    inset -3px -3px .5px -3.5px rgba(255,255,255,.85),
    inset 1px 1px 1px -.5px rgba(255,255,255,.6),
    inset -1px -1px 1px -.5px rgba(255,255,255,.6),
    inset 0 0 6px 6px rgba(255,255,255,.12),
    inset 0 0 2px 2px rgba(255,255,255,.06),
    0 0 12px rgba(0,0,0,.15);
}
.liquid-btn__bg{
  position:absolute;inset:0;border-radius:999px;overflow:hidden;z-index:0;
  -webkit-backdrop-filter:blur(8px) saturate(1.15);
  backdrop-filter:blur(8px) saturate(1.15);
  backdrop-filter:url(#liquid-glass);
}
.liquid-btn__label{position:relative;z-index:2;pointer-events:none;}
@media (max-width:560px){
  .liquid-btn{width:100%;font-size:.72rem;padding:0 1.4rem;}
}
@media (prefers-reduced-motion:reduce){
  .liquid-btn{opacity:1;transform:none;animation:none;}
}

/* ---------- text reveal (required) ---------- */
[data-reveal-01]{visibility:hidden;}
[data-reveal-01] > *{margin-bottom:calc(-1 * var(--reveal-descender));}
.word-mask,.char-mask{vertical-align:top;}
.line-mask,.word-mask,.char-mask{overflow:clip;overflow-clip-margin:var(--reveal-clip-margin);}
.line-mask > *,.word-mask > *,.char-mask > *{padding-bottom:var(--reveal-descender);will-change:transform;}
html.no-splittext [data-reveal-01]{visibility:visible;}

/* ============================================================
   SHARED LAYOUT
   ============================================================ */
section{position:relative;}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(1.4rem,4.5vw,4rem);}
.label{
  display:inline-flex;align-items:center;gap:.9rem;
  font-size:.68rem;letter-spacing:.45em;text-transform:uppercase;color:var(--rosegold-deep);font-weight:400;
}
.label::before{content:'';width:38px;height:1px;background:var(--rosegold);}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.01em;}
.display{font-size:clamp(2.6rem,6.2vw,5.4rem);}
h2{font-size:clamp(2.1rem,4.4vw,3.6rem);}
.lead{font-size:clamp(1.02rem,1.35vw,1.18rem);color:var(--ink-60);max-width:34em;}
em.serif{font-family:var(--serif);font-style:italic;font-size:1.12em;}
.page-head{padding:clamp(8rem,16vh,11rem) 0 clamp(3rem,6vh,4.5rem);}
.page-head h1{font-size:clamp(2.6rem,6vw,5rem);margin-top:1.4rem;}
.page-head .lead{margin-top:1.2rem;}

.reveal{opacity:0;transform:translateY(36px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out);}
.reveal.active{opacity:1;transform:none;}
.reveal-stagger>*{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);}
.reveal-stagger.active>*{opacity:1;transform:none;}
.reveal-stagger.active>*:nth-child(1){transition-delay:.05s}
.reveal-stagger.active>*:nth-child(2){transition-delay:.18s}
.reveal-stagger.active>*:nth-child(3){transition-delay:.31s}
.reveal-stagger.active>*:nth-child(4){transition-delay:.44s}
.reveal-stagger.active>*:nth-child(5){transition-delay:.57s}

.btn{
  position:relative;display:inline-flex;align-items:center;gap:.8rem;
  font-size:.78rem;letter-spacing:.26em;text-transform:uppercase;font-weight:400;text-decoration:none;
  padding:1.05rem 2.4rem;border-radius:99px;border:1px solid var(--ink);
  background:var(--ink);color:var(--porcelain);overflow:hidden;cursor:pointer;
  transition:color .4s var(--ease-out);
}
.btn::before{
  content:'';position:absolute;inset:0;border-radius:99px;
  background:linear-gradient(115deg,var(--rosegold) 0%,var(--rosegold-deep) 100%);
  transform:translateX(-101%);transition:transform .5s var(--ease-luxe);
}
.btn:hover::before{transform:translateX(0);}
.btn span{position:relative;z-index:1;}
.btn .arr{position:relative;z-index:1;transition:transform .4s var(--ease-out);}
.btn:hover .arr{transform:translateX(5px);}
.btn-ghost{background:transparent;color:var(--ink);}
.btn-ghost:hover{color:var(--porcelain);}
.btn-light{background:var(--porcelain);color:var(--ink);border-color:var(--porcelain);}
.btn-light:hover{color:var(--porcelain);}

/* ============================================================
   USP + MARQUEE
   ============================================================ */
.usp-bar{border-top:1px solid var(--ink-12);border-bottom:1px solid var(--ink-12);}
.usp-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:1280px;margin:0 auto;}
.usp{
  display:flex;align-items:center;gap:.85rem;justify-content:center;
  padding:1.5rem 1rem;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);
}
.usp+.usp{border-left:1px solid var(--ink-12);}
.usp .pdot{flex:none;width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 55%,var(--pearl-lo));
  box-shadow:0 0 0 1px rgba(183,110,121,.25);}
.marquee{
  padding:1.6rem 0;border-bottom:1px solid var(--ink-12);overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 80px,#000 calc(100% - 80px),transparent);
  mask-image:linear-gradient(to right,transparent,#000 80px,#000 calc(100% - 80px),transparent);
}
.marquee-track{display:flex;gap:3.2rem;width:max-content;animation:mq 46s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes mq{to{transform:translateX(-50%);}}
.marquee-track span{
  font-family:var(--serif);font-style:italic;font-size:1.25rem;white-space:nowrap;color:var(--ink-60);
  display:flex;align-items:center;gap:3.2rem;
}
.marquee-track span::after{content:'';width:8px;height:8px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,#dccfd7);box-shadow:0 0 0 1px rgba(183,110,121,.35);}

/* ============================================================
   RITUEEL
   ============================================================ */
#ritueel{padding:clamp(6rem,12vh,9rem) 0;}
.ritueel-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:4.5rem;}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.4vw,2rem);counter-reset:stap;}
.step{
  position:relative;margin:0;border-radius:24px;
  background:#fff;border:1px solid var(--ink-12);
  transition:transform .45s var(--ease-out),box-shadow .45s,border-color .45s;
}
.step:hover{transform:translateY(-8px);border-color:rgba(183,110,121,.45);box-shadow:0 36px 70px -38px rgba(28,27,26,.35);}
.step-img{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:23px 23px 0 0;}
.step-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease-out);}
.step:hover .step-img img{transform:scale(1.05);}
.step-num{
  position:absolute;left:1.3rem;top:-1.7rem;z-index:2;
  width:3.4rem;height:3.4rem;border-radius:50%;
  background:linear-gradient(135deg,var(--rosegold) 0%,var(--rosegold-deep) 100%);
  border:2px solid #fff;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-style:italic;font-size:1.45rem;color:#FFF9F4;
  box-shadow:0 14px 28px -12px rgba(156,85,96,.75);
}
.step figcaption{position:relative;padding:2.4rem 1.6rem 1.7rem;}
.step h3{font-size:1.5rem;margin-bottom:.55rem;display:flex;align-items:baseline;gap:.6rem;}
.step p{color:var(--ink-60);font-size:.95rem;}
.step .step-arrow{
  position:absolute;top:38%;right:calc(-1rem - clamp(1.2rem,2.4vw,2rem)/2);z-index:3;transform:translateY(-50%);
  font-family:var(--serif);font-size:1.3rem;color:var(--rosegold-deep);
  width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid rgba(183,110,121,.35);border-radius:50%;
  box-shadow:0 8px 18px -8px rgba(28,27,26,.3);
}
.step:last-child .step-arrow{display:none;}
@media (max-width:1020px){
  .steps{grid-template-columns:1fr;max-width:520px;margin-inline:auto;gap:3rem;}
  .step .step-arrow{
    top:auto;right:auto;bottom:-2.5rem;left:50%;transform:translateX(-50%) rotate(90deg);
  }
  .step-img{aspect-ratio:16/9;}
}
.ritueel-note{
  margin-top:4.5rem;font-family:var(--serif);font-style:italic;
  font-size:clamp(1.3rem,2.2vw,1.8rem);text-align:center;color:var(--ink);max-width:30em;
  margin-left:auto;margin-right:auto;line-height:1.5;
}
.ritueel-note .hl{color:var(--rosegold-deep);}

/* ---------- koopblok (direct na de hero) ---------- */
#koop-sectie{padding:clamp(3rem,6vh,4.5rem) 0 clamp(2rem,4vh,3rem);}
.shop-card{
  display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(1.5rem,3vw,3rem);
  align-items:center;margin:0;
  background:#fff;border:1px solid rgba(183,110,121,.35);border-radius:26px;
  padding:clamp(1.4rem,2.6vw,2.4rem);
  box-shadow:0 40px 90px -50px rgba(183,110,121,.45);
  position:relative;overflow:hidden;
}
.shop-card::before{
  content:'';position:absolute;top:-80px;right:-80px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,rgba(183,110,121,.14),transparent 70%);
}
.shop-img{margin:0;border-radius:18px;overflow:hidden;aspect-ratio:4/5;}
.shop-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s var(--ease-out);}
.shop-card:hover .shop-img img{transform:scale(1.04);}
.sale-flag{
  position:absolute;top:1.2rem;right:1.2rem;z-index:2;
  background:var(--rosegold-deep);color:var(--porcelain);
  font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;
  padding:.5rem 1rem;border-radius:99px;
  box-shadow:0 10px 24px -10px rgba(156,85,96,.6);
  animation:saleFlag 2.6s ease-in-out infinite alternate;
}
@keyframes saleFlag{from{transform:scale(1)}to{transform:scale(1.06)}}
.shop-sale{
  font-size:.82rem;color:var(--ink-60);margin:-0.6rem 0 1.4rem;line-height:1.9;
}
.shop-sale b{color:var(--ink);font-weight:500;}
.shop-sale s{opacity:.5;margin:0 .2rem;}
.shop-sale .pct{
  background:rgba(183,110,121,.14);color:var(--rosegold-deep);
  font-size:.7rem;letter-spacing:.12em;padding:.15rem .5rem;border-radius:6px;font-weight:500;
}
.shop-stars{color:#D9A441;font-size:1.05rem;letter-spacing:.2em;margin-bottom:.6rem;}
.shop-stars a{font-family:var(--sans);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-40);margin-left:.6rem;text-decoration:none;}
.shop-stars a:hover{color:var(--rosegold-deep);}
.shop-info h3{font-size:clamp(1.5rem,2.4vw,2rem);margin-bottom:.4rem;}
.shop-meta{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-40);margin-bottom:1.2rem;}
.shop-price{display:flex;align-items:baseline;gap:.9rem;margin-bottom:1.4rem;}
.shop-price b{font-family:var(--serif);font-weight:400;font-size:2.1rem;}
.shop-price small{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-40);}
.shop-btn{margin-bottom:1.1rem;}
.shop-trust{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-60);}
.shop-trust b{color:var(--rosegold-deep);}
@media (max-width:760px){
  .shop-card{grid-template-columns:1fr;}
  .shop-img{aspect-ratio:1/1;}
  .shop-btn{width:100%;justify-content:center;}
}

/* ---------- ervaringen (testpanel met foto's) ---------- */
.exp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;}
.exp-score{font-family:var(--serif);font-size:1.2rem;color:var(--ink);}
.exp-score .exp-stars{display:inline;margin-right:.5rem;}
.exp-stars{color:#D9A441;letter-spacing:.18em;}
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.4vw,2rem);margin-top:3.2rem;}
.exp-card{margin:0;border:1px solid var(--ink-12);border-radius:24px;overflow:hidden;background:#fff;
  transition:transform .45s var(--ease-out),box-shadow .45s;}
.exp-card:hover{transform:translateY(-8px);box-shadow:0 36px 70px -38px rgba(28,27,26,.35);}
.exp-img{aspect-ratio:4/5;overflow:hidden;}
.exp-img img{width:100%;height:100%;object-fit:cover;display:block;}
.exp-body{padding:1.5rem 1.6rem 1.7rem;}
.exp-body .exp-stars{display:block;margin-bottom:.7rem;font-size:.95rem;}
.exp-body p{font-family:var(--serif);font-style:italic;font-size:1.08rem;line-height:1.55;margin-bottom:1rem;color:var(--ink);}
.exp-body cite{font-style:normal;font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-40);}
@media (max-width:1020px){.exp-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}}

/* ---------- dranken-kiezer ---------- */
.dranken{margin-top:5.5rem;}
.dranken .label{margin-bottom:2.2rem;}
.dranken-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);align-items:center;}
.drank-visual{position:relative;aspect-ratio:4/3;border-radius:22px;overflow:hidden;background:var(--ivory);}
.drank-visual img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s ease;}
.drank-visual .d-tag{
  position:absolute;left:1.2rem;bottom:1.1rem;z-index:2;
  font-size:.64rem;letter-spacing:.34em;text-transform:uppercase;color:#fff;
  background:rgba(28,27,26,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  padding:.5rem .95rem;border-radius:99px;transition:opacity .35s ease;
}
.drank-pills{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 1.8rem;}
.pill{
  font-family:var(--sans);font-weight:400;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.68rem 1.4rem;border-radius:99px;border:1px solid var(--ink-12);
  background:transparent;color:var(--ink-60);cursor:pointer;
  transition:border-color .3s,color .3s,background .3s,transform .3s var(--ease-out);
}
.pill:hover{border-color:var(--rosegold);color:var(--ink);transform:translateY(-2px);}
.pill[aria-pressed="true"]{background:var(--ink);color:var(--porcelain);border-color:var(--ink);}
.drank-note{
  font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,1.7vw,1.42rem);
  color:var(--ink);max-width:26em;min-height:3.2em;line-height:1.55;
  transition:opacity .28s ease;
}
.drank-note .hl{color:var(--rosegold-deep);}

/* ---------- editorial duo ---------- */
.duo{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.2rem,2.4vw,2rem);margin:4.5rem 0 0;align-items:end;}
.duo figure{position:relative;border-radius:22px;overflow:hidden;margin:0;}
.duo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease-out);}
.duo figure:hover img{transform:scale(1.04);}
.duo .d1{aspect-ratio:3/4;}
.duo .d2{aspect-ratio:16/10;}
.duo figcaption{
  position:absolute;left:1.2rem;bottom:1.1rem;z-index:2;
  font-size:.64rem;letter-spacing:.34em;text-transform:uppercase;color:#fff;
  background:rgba(28,27,26,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  padding:.5rem .95rem;border-radius:99px;
}

/* ---------- film band ---------- */
#film{position:relative;height:min(86vh,760px);overflow:hidden;}
#film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
#film .film-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(28,27,26,.55),rgba(28,27,26,.05) 45%,rgba(28,27,26,.12));}
#film .film-overlay{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:0 clamp(1.4rem,4.5vw,4rem) clamp(2.4rem,5vh,3.6rem);
  color:var(--porcelain);display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
}
#film .film-overlay .label{color:var(--porcelain);}
#film .film-overlay .label::before{background:var(--porcelain);}
#film h2{font-size:clamp(1.9rem,4vw,3.2rem);margin-top:1rem;}
#film h2 em{font-style:italic;color:var(--pearl-b);}
#film .film-note{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(250,247,242,.75);}

/* ============================================================
   LAAG VOOR LAAG — scroll-telling
   ============================================================ */
#parel{
  background:var(--ivory);border-top:1px solid var(--ink-12);border-bottom:1px solid var(--ink-12);
  height:420svh; /* scroll-runway: de pin blijft staan terwijl je hier doorheen scrolt */
}
.laag-pin{
  position:sticky;top:0;height:100svh;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);align-items:center;
  max-width:1280px;margin:0 auto;
  padding:0 clamp(1.4rem,4.5vw,4rem);
}
.laag-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.2rem;}
.laag-pearl{position:relative;width:min(40vmin,360px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;}
.laag-core{
  position:absolute;width:22%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,#eee2e6 55%,#c9b8c4);
  box-shadow:0 14px 30px -12px rgba(28,27,26,.35);
  transition:transform .8s var(--ease-luxe);
  z-index:5;
}
.nacre{
  position:absolute;border-radius:50%;
  opacity:0;transform:scale(.55);
  transition:opacity .9s var(--ease-luxe),transform .9s var(--ease-luxe);
}
.nacre.n1{width:44%;aspect-ratio:1;background:radial-gradient(circle at 35% 30%,rgba(247,225,214,.98),rgba(245,222,211,.5) 72%);box-shadow:inset 0 0 0 2px rgba(183,110,121,.5),0 8px 22px -10px rgba(183,110,121,.4);z-index:4;}
.nacre.n2{width:64%;aspect-ratio:1;background:radial-gradient(circle at 35% 30%,rgba(233,220,240,.95),rgba(229,214,238,.42) 74%);box-shadow:inset 0 0 0 2px rgba(157,134,168,.48),0 10px 26px -12px rgba(157,134,168,.4);z-index:3;}
.nacre.n3{width:83%;aspect-ratio:1;background:radial-gradient(circle at 35% 30%,rgba(216,236,232,.92),rgba(208,232,226,.38) 76%);box-shadow:inset 0 0 0 2px rgba(120,160,152,.45),0 12px 30px -14px rgba(120,160,152,.38);z-index:2;}
.nacre.n4{width:100%;aspect-ratio:1;background:radial-gradient(circle at 33% 28%,rgba(255,255,255,.98),rgba(246,236,233,.62) 45%,rgba(214,196,208,.5) 82%);box-shadow:inset 0 0 0 2px rgba(183,110,121,.5),0 44px 80px -32px rgba(28,27,26,.4);z-index:1;}
.laag-pearl[data-layers="1"] .n1,
.laag-pearl[data-layers="2"] .n1,.laag-pearl[data-layers="2"] .n2,
.laag-pearl[data-layers="3"] .n1,.laag-pearl[data-layers="3"] .n2,.laag-pearl[data-layers="3"] .n3,
.laag-pearl[data-layers="4"] .n1,.laag-pearl[data-layers="4"] .n2,.laag-pearl[data-layers="4"] .n3,.laag-pearl[data-layers="4"] .n4{
  opacity:1;transform:scale(1);
}
/* finale (laag 4): de parel groeit, vult de ringen, gloeit en sterren verschijnen */
.laag-core::after{
  content:'';position:absolute;inset:8% 14% 52% 16%;border-radius:50%;
  background:radial-gradient(ellipse at 40% 35%,rgba(255,255,255,.95),rgba(255,255,255,0) 72%);
  filter:blur(1px);
}
.laag-glow{
  position:absolute;inset:-20%;border-radius:50%;z-index:0;opacity:0;pointer-events:none;
  background:radial-gradient(circle,rgba(255,246,238,.95) 16%,rgba(242,212,196,.5) 44%,rgba(242,212,196,0) 72%);
  filter:blur(8px);
  transition:opacity 1.1s var(--ease-luxe);
}
.laag-pearl[data-layers="4"] .laag-glow{opacity:1;animation:glowPulse 3.2s ease-in-out infinite alternate;}
@keyframes glowPulse{from{transform:scale(.94);opacity:.8}to{transform:scale(1.08);opacity:1}}
.laag-pearl[data-layers="4"] .nacre{opacity:0;transform:scale(1.1);}
.laag-pearl[data-layers="4"] .laag-core{
  transform:scale(4.55);
  box-shadow:0 10px 26px -8px rgba(183,110,121,.5);
}
.laag-sparks{position:absolute;inset:-16%;z-index:7;pointer-events:none;}
.laag-sparks span{
  position:absolute;font-size:1.15rem;line-height:1;color:#EBCBA4;
  text-shadow:0 0 12px rgba(235,203,164,.95),0 0 26px rgba(235,203,164,.5);
  opacity:0;transform:scale(.2);
}
.laag-sparks span:nth-child(1){top:6%;left:18%;}
.laag-sparks span:nth-child(2){top:0%;left:62%;font-size:.85rem;}
.laag-sparks span:nth-child(3){top:26%;left:92%;}
.laag-sparks span:nth-child(4){top:62%;left:97%;font-size:.8rem;}
.laag-sparks span:nth-child(5){top:90%;left:74%;}
.laag-sparks span:nth-child(6){top:96%;left:30%;font-size:.85rem;}
.laag-sparks span:nth-child(7){top:68%;left:1%;}
.laag-sparks span:nth-child(8){top:24%;left:-3%;font-size:.8rem;}
.laag-pearl[data-layers="4"] .laag-sparks span{
  animation:sparkIn .55s var(--ease-out) forwards, twinkle 1.7s ease-in-out infinite alternate;
}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(1){animation-delay:.15s,.7s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(2){animation-delay:.3s,1s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(3){animation-delay:.45s,.85s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(4){animation-delay:.2s,1.2s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(5){animation-delay:.55s,.6s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(6){animation-delay:.35s,1.4s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(7){animation-delay:.6s,.95s;}
.laag-pearl[data-layers="4"] .laag-sparks span:nth-child(8){animation-delay:.25s,1.1s;}
@keyframes sparkIn{to{opacity:1;transform:scale(1) rotate(18deg);}}
@keyframes twinkle{from{opacity:.35;transform:scale(.7) rotate(8deg)}to{opacity:1;transform:scale(1.2) rotate(26deg)}}

.laag-counter{font-size:.68rem;letter-spacing:.45em;text-transform:uppercase;color:var(--ink-40);}
.laag-counter b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.4rem;color:var(--rosegold-deep);letter-spacing:0;margin-right:.4rem;}
.laag-texts{position:relative;min-height:18rem;display:flex;align-items:center;}
.beat{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  max-width:26em;
  opacity:0;transform:translateY(22px);pointer-events:none;
  transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);
}
.beat.focus{opacity:1;transform:none;pointer-events:auto;}
.beat.passed{opacity:0;transform:translateY(-22px);}
.beat .label{margin-bottom:1.2rem;}
.beat h3{font-size:clamp(1.7rem,2.8vw,2.5rem);margin-bottom:1rem;}
.beat p{color:var(--ink-60);}
.laag-hint{
  position:absolute;bottom:1.6rem;left:0;right:0;text-align:center;
  font-size:.62rem;letter-spacing:.4em;text-transform:uppercase;color:var(--ink-40);
}
@media (prefers-reduced-motion:reduce){
  #parel{height:auto;}
  .laag-pin{position:relative;height:auto;grid-template-columns:1fr;padding-block:4rem;}
  .laag-texts{min-height:0;display:block;}
  .beat{position:static;opacity:1;transform:none;margin-bottom:2.5rem;}
  .laag-hint{display:none;}
}

/* ============================================================
   WAAROM
   ============================================================ */
#waarom{padding:clamp(6rem,12vh,9rem) 0;}
.waarom-head{max-width:46em;margin-bottom:4rem;}
.waarom-head h2{margin:1.4rem 0 1.2rem;}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.4vw,2rem);}
.pillar{
  border:1px solid var(--ink-12);border-radius:22px;background:#fff;
  padding:2.6rem 2.2rem 2.4rem;position:relative;overflow:hidden;
  transition:transform .45s var(--ease-out),box-shadow .45s,border-color .45s;
}
.pillar::before{
  content:'';position:absolute;top:-60px;right:-60px;width:160px;height:160px;border-radius:50%;
  background:radial-gradient(circle,rgba(183,110,121,.12),transparent 70%);
  transition:transform .5s var(--ease-out);
}
.pillar:hover{transform:translateY(-8px);border-color:rgba(183,110,121,.45);box-shadow:0 30px 60px -30px rgba(28,27,26,.25);}
.pillar:hover::before{transform:scale(1.5);}
.pillar .p-num{font-family:var(--serif);font-style:italic;font-size:1rem;color:var(--rosegold-deep);display:block;margin-bottom:1.6rem;}
.pillar h3{font-size:1.5rem;margin-bottom:.85rem;}
.pillar p{font-size:.95rem;color:var(--ink-60);}
.claim-foot{margin-top:2.6rem;font-size:.8rem;color:var(--ink-60);max-width:46em;}

/* ============================================================
   GLOW — cursor trail section
   ============================================================ */
.cursor-trail-section{
  position:relative;isolation:isolate;height:100dvh;overflow:hidden;
  color:var(--ink);background:var(--shell);touch-action:pan-y pinch-zoom;
  display:flex;align-items:center;justify-content:center;text-align:center;
  border-top:1px solid var(--ink-12);
}
.cursor-trail-section *,
.cursor-trail-section *::before,
.cursor-trail-section *::after{box-sizing:border-box;}
.cursor-trail-section [data-cursor-trail-images]{display:none;}
.glow-content{position:relative;z-index:0;max-width:46em;padding:0 1.5rem;pointer-events:none;}
.glow-content .label{justify-content:center;}
.glow-content h2{font-size:clamp(2.4rem,5.6vw,4.6rem);margin:1.6rem 0 1.4rem;}
.glow-content h2 em{font-style:italic;color:var(--rosegold-deep);}
.glow-content p{color:var(--ink-60);max-width:34em;margin:0 auto;}
.glow-hint{margin-top:2.6rem;font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--ink-40);}
.glow-hint .hint-coarse{display:none;}
@media (pointer:coarse){
  .glow-hint .hint-fine{display:none;}
  .glow-hint .hint-coarse{display:inline;}
}
.glow-foot{position:absolute;bottom:1.6rem;left:0;right:0;text-align:center;font-size:.7rem;color:var(--ink-60);padding:0 1.5rem;}
.cursor-trail__item{
  position:absolute;top:0;left:0;
  width:var(--cursor-trail-width,248px);height:auto;
  aspect-ratio:var(--cursor-trail-aspect-ratio,1198 / 1544);
  overflow:hidden;pointer-events:none;visibility:hidden;
  contain:layout paint style;will-change:transform;backface-visibility:hidden;
}
.cursor-trail__media{
  width:100%;height:100%;overflow:hidden;border-radius:8px;
  contain:paint;will-change:transform;backface-visibility:hidden;
}
.cursor-trail__media img{
  display:block;width:100%;height:100%;object-fit:cover;
  user-select:none;backface-visibility:hidden;
}
@media (max-width:760px){
  .cursor-trail__item{width:var(--cursor-trail-mobile-width,178px);}
  .cursor-trail__media{border-radius:7px;}
}

/* ============================================================
   PRODUCT
   ============================================================ */
#product{background:var(--mocha);color:var(--porcelain);border-radius:38px 38px 0 0;}
#product .wrap{padding-top:clamp(8rem,15vh,10rem);padding-bottom:clamp(5.5rem,10vh,8rem);}
.product-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2.4rem,5vw,5.5rem);align-items:start;}
.product-visual{position:sticky;top:9vh;}
.tub-stage{
  position:relative;border-radius:28px;background:linear-gradient(160deg,var(--mocha-2),#1d1916 80%);
  border:1px solid rgba(250,247,242,.08);
  display:flex;align-items:center;justify-content:center;
  padding:clamp(2.5rem,5vw,4rem) 2rem;overflow:hidden;
}
.media-stage{padding:0!important;}
.media-stage .product-media{
  width:100%;height:auto;display:block;border-radius:28px;
  aspect-ratio:4/5;object-fit:cover;background:#1d1916;
}
.tub-caption{margin-top:1.6rem;text-align:center;font-size:.66rem;letter-spacing:.35em;text-transform:uppercase;color:rgba(250,247,242,.62);}
/* variant switcher */
#bundels{scroll-margin-top:120px;}
.variants{display:flex;gap:.8rem;margin:0 0 2rem;}
.variant{
  flex:1;display:flex;flex-direction:column;gap:.2rem;align-items:flex-start;
  border:1px solid rgba(250,247,242,.16);border-radius:16px;padding:1rem 1.2rem;
  background:transparent;color:rgba(250,247,242,.75);cursor:pointer;text-align:left;
  transition:border-color .3s,background .3s,transform .3s var(--ease-out);
}
.variant:hover{border-color:var(--rosegold);transform:translateY(-2px);}
.variant[aria-pressed="true"]{border-color:var(--rosegold);background:rgba(183,110,121,.12);color:var(--porcelain);}
.variant .v-name{font-family:var(--serif);font-size:1.15rem;}
.variant .v-meta{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(250,247,242,.5);}
.variant .v-badge{
  font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rosegold);
}
.variant[aria-pressed="true"] .v-badge,
.variant .v-badge:not(:empty){font-weight:500;}
.variant .v-save{
  background:rgba(183,110,121,.18);color:var(--rosegold);
  padding:.18rem .55rem;border-radius:6px;display:inline-block;margin-top:.2rem;
}

.product-info .label{color:var(--rosegold);}
.product-info .label::before{background:var(--rosegold);}
.product-info h1,.product-info h2{margin:1.3rem 0 .6rem;font-size:clamp(1.9rem,3.4vw,2.8rem);}
.product-info .p-sub{color:rgba(250,247,242,.65);margin-bottom:1.8rem;font-size:1.02rem;max-width:32em;}
.price-row{display:flex;align-items:baseline;gap:1.1rem;margin-bottom:2rem;flex-wrap:wrap;}
.price{font-family:var(--serif);font-size:2.5rem;}
.price-note{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(250,247,242,.66);}
.dose-note{font-size:.9rem;color:rgba(250,247,242,.6);margin-bottom:2.2rem;}
.product-cta{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-bottom:3rem;}
.spec-table{width:100%;border-collapse:collapse;margin:.8rem 0 .4rem;}
.spec-table th,.spec-table td{
  text-align:left;padding:.78rem .2rem;font-size:.92rem;font-weight:300;
  border-bottom:1px solid rgba(250,247,242,.12);
}
.spec-table th{color:rgba(250,247,242,.55);font-weight:400;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;}
.spec-table td:last-child{text-align:right;color:rgba(250,247,242,.85);}
.spec-foot{font-size:.74rem;color:rgba(250,247,242,.58);}
.acc{border-top:1px solid rgba(250,247,242,.14);margin-top:2.4rem;}
.acc details{border-bottom:1px solid rgba(250,247,242,.14);}
.acc summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  padding:1.2rem .2rem;font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(250,247,242,.85);
  transition:color .3s;
}
.acc summary:hover{color:var(--rosegold);}
.acc summary::-webkit-details-marker{display:none;}
.acc summary .ind{font-family:var(--serif);font-size:1.4rem;line-height:1;transition:transform .35s var(--ease-out);}
.acc details[open] summary .ind{transform:rotate(45deg);}
.acc .acc-body{padding:0 .2rem 1.5rem;color:rgba(250,247,242,.6);font-size:.95rem;max-width:40em;}
.acc .acc-body ul{list-style:none;display:flex;flex-direction:column;gap:.55rem;}
.acc .acc-body li{padding-left:1.4rem;position:relative;}
.acc .acc-body li::before{content:'';position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,#cdbfc8);}

/* ---------- product stats + benefits (éclat-stijl, claims-safe) ---------- */
.p-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(250,247,242,.12);border:1px solid rgba(250,247,242,.12);border-radius:18px;overflow:hidden;margin:0 0 1.8rem;}
.p-stat{background:var(--mocha);padding:1.1rem 1rem;text-align:center;}
.p-stat b{display:block;font-family:var(--serif);font-weight:400;font-size:1.6rem;color:var(--porcelain);line-height:1.1;}
.p-stat span{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(250,247,242,.6);}
.p-checks{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin:0 0 2rem;padding:0;}
.p-checks li{padding-left:1.7rem;position:relative;font-size:.95rem;color:rgba(250,247,242,.8);}
.p-checks li::before{content:'✓';position:absolute;left:0;color:var(--rosegold);}
.gift-block{
  display:flex;gap:1rem;align-items:center;margin:0 0 2.4rem;
  border:1px dashed rgba(183,110,121,.55);border-radius:16px;padding:1rem 1.3rem;
  background:rgba(183,110,121,.08);
}
.gift-block .g-pearl{flex:none;width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 55%,var(--pearl-lo));
  box-shadow:0 2px 8px rgba(0,0,0,.3);}
.gift-block p{font-size:.9rem;color:rgba(250,247,242,.85);margin:0;}
.gift-block p b{color:var(--rosegold);font-weight:500;}
.gift-block small{display:block;font-size:.7rem;color:rgba(250,247,242,.5);margin-top:.15rem;}
.claims-list{list-style:none;display:flex;flex-direction:column;gap:.8rem;}
.claims-list li{padding-left:1.7rem;position:relative;}
.claims-list li::before{content:'✓';position:absolute;left:0;color:var(--rosegold);}
@media (max-width:560px){.p-stats{grid-template-columns:1fr;}}

/* ---------- product thumbs ---------- */
.thumbs{display:flex;gap:.7rem;margin-top:1.1rem;justify-content:center;}
.thumb{
  width:64px;height:64px;border-radius:12px;overflow:hidden;flex:none;
  border:1px solid rgba(250,247,242,.18);padding:0;background:none;cursor:pointer;opacity:.6;
  transition:opacity .3s,border-color .3s,transform .3s var(--ease-out);
}
.thumb:hover{opacity:.9;transform:translateY(-2px);}
.thumb[aria-pressed="true"]{border-color:var(--rosegold);opacity:1;}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;}

/* ---------- bundels ---------- */
.variant .v-price{font-family:var(--serif);font-size:1.05rem;color:var(--porcelain);}
.variant .v-price s{opacity:.45;font-size:.82em;margin-left:.35rem;font-family:var(--sans);}
.variant .v-save{color:var(--rosegold);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;}

/* ---------- trust strip ---------- */
.trust-strip{display:flex;gap:1.4rem;flex-wrap:wrap;margin:-1.4rem 0 2.6rem;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(250,247,242,.55);}
.trust-strip span::before{content:'✓';color:var(--rosegold);margin-right:.45rem;}

/* ---------- vergelijk ---------- */
.compare-wrap{max-width:46em;margin-top:4rem;}
.compare-wrap h2{font-size:clamp(1.6rem,2.6vw,2.2rem);margin:1.2rem 0 1.4rem;}
.compare-table th:nth-child(2){color:var(--rosegold);}
.compare-table td:nth-child(2){color:var(--porcelain);}
.compare-table td:last-child{color:rgba(250,247,242,.45);}
.compare-table td{text-align:left!important;}

/* ---------- testpanel quotes ---------- */
#panel{padding:clamp(6rem,12vh,9rem) 0;background:var(--porcelain);border-top:1px solid var(--ink-12);}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.4vw,2rem);margin-top:3.4rem;}
.quote-card{border:1px solid var(--ink-12);border-radius:22px;background:#fff;padding:2.2rem 2rem;position:relative;}
.quote-card::before{content:'“';font-family:var(--serif);font-size:3rem;color:var(--rosegold);line-height:1;display:block;margin-bottom:.4rem;}
.quote-card p{font-family:var(--serif);font-style:italic;font-size:1.15rem;line-height:1.55;margin-bottom:1.3rem;color:var(--ink);}
.quote-card cite{font-style:normal;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-40);}
.quotes-note{margin-top:2rem;font-size:.76rem;color:var(--ink-60);}

/* ---------- lanceringslijst ---------- */
#lijst{padding:clamp(5rem,9vh,7rem) 0;background:var(--ivory);border-top:1px solid var(--ink-12);}
.lijst-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,4vw,4rem);align-items:center;}
.lijst-copy h2{margin:1.3rem 0 1rem;}
.lijst-copy p{color:var(--ink-60);max-width:30em;}
.lijst-form{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem;}
.lijst-form input[type="email"]{
  flex:1;min-width:220px;padding:1rem 1.4rem;border-radius:99px;border:1px solid var(--ink-12);
  background:#fff;font:inherit;font-weight:300;color:var(--ink);
}
.lijst-form input[type="email"]:focus{outline:2px solid var(--rosegold);outline-offset:2px;}
.lijst-note{font-size:.76rem;color:var(--ink-60);}
.lijst-ok{display:none;font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--rosegold-deep);padding:.6rem 0;}
.lijst-done .lijst-form{display:none;}
.lijst-done .lijst-ok{display:block;}

/* ---------- ugc ---------- */
#ugc{padding:clamp(6rem,12vh,9rem) 0;background:var(--porcelain);border-top:1px solid var(--ink-12);}
.ugc-head{text-align:center;max-width:40em;margin:0 auto;}
.ugc-head h2{margin:1.4rem 0 1rem;}
.ugc-row{display:flex;gap:clamp(1.2rem,3vw,2.4rem);justify-content:center;align-items:stretch;flex-wrap:wrap;margin-top:3.2rem;}
.ugc-phone{
  position:relative;width:min(72vw,250px);aspect-ratio:9/16;border-radius:30px;overflow:hidden;
  border:1px solid var(--ink-12);box-shadow:0 40px 80px -40px rgba(28,27,26,.45);background:var(--mocha);
}
.ugc-phone video{width:100%;height:100%;object-fit:cover;display:block;}
.ugc-mute{
  position:absolute;bottom:.9rem;right:.9rem;z-index:2;width:40px;height:40px;border-radius:50%;
  background:rgba(28,27,26,.55);color:#fff;border:none;cursor:pointer;font-size:1rem;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
}
.ugc-note{text-align:center;margin-top:2rem;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-60);}
@media (max-width:1020px){
  .quotes{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
  .lijst-grid{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .lijst-form .btn{width:100%;justify-content:center;}
  .lijst-form input[type="email"]{min-width:0;width:100%;}
}

/* ============================================================
   EERLIJK
   ============================================================ */
#eerlijk{background:var(--mocha);color:var(--porcelain);padding:clamp(6rem,11vh,9rem) 0;border-radius:38px 38px 0 0;}
#eerlijk .wrap>.label{color:var(--rosegold);}
#eerlijk .wrap>.label::before{background:var(--rosegold);}
#eerlijk h2{margin:1.4rem 0 1.1rem;}
#eerlijk .lead{color:rgba(250,247,242,.6);}
.eerlijk-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,3vw,2.6rem);margin-top:3.6rem;}
.e-col{border:1px solid rgba(250,247,242,.13);border-radius:24px;padding:2.6rem 2.4rem;}
.e-col.wel{background:linear-gradient(165deg,rgba(183,110,121,.14),rgba(183,110,121,.03));border-color:rgba(183,110,121,.4);}
.e-col h3{font-size:1.6rem;margin-bottom:1.8rem;display:flex;align-items:center;gap:.8rem;}
.e-col h3 .mark{font-family:var(--serif);font-style:italic;color:var(--rosegold);font-size:1.2rem;}
.e-col ul{list-style:none;display:flex;flex-direction:column;gap:1.15rem;}
.e-col li{padding-left:1.7rem;position:relative;font-size:.97rem;color:rgba(250,247,242,.78);}
.e-col.wel li::before{content:'';position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff,#d8aab1);box-shadow:0 0 0 1px rgba(183,110,121,.5);}
.e-col.niet li{color:rgba(250,247,242,.64);}
.e-col.niet li::before{content:'—';position:absolute;left:0;top:0;color:rgba(250,247,242,.35);}
.eerlijk-quote{
  margin-top:4rem;text-align:center;font-family:var(--serif);font-style:italic;
  font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.5;max-width:30em;margin-left:auto;margin-right:auto;
  color:rgba(250,247,242,.9);
}
.eerlijk-quote .q-src{display:block;margin-top:1.4rem;font-family:var(--sans);font-style:normal;font-size:.68rem;letter-spacing:.4em;text-transform:uppercase;color:rgba(250,247,242,.55);}
.e-foot{margin-top:2.8rem;text-align:center;font-size:.78rem;color:rgba(250,247,242,.58);max-width:48em;margin-left:auto;margin-right:auto;}

/* ============================================================
   FAQ
   ============================================================ */
#faq{padding:clamp(3rem,6vh,5rem) 0 clamp(6rem,12vh,9rem);background:var(--porcelain);}
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2.5rem,5vw,5rem);}
.faq-intro{position:sticky;top:14vh;align-self:start;}
.faq-intro h2{margin:1.4rem 0 1.2rem;}
.faq-list details{border-bottom:1px solid var(--ink-12);}
.faq-list details:first-child{border-top:1px solid var(--ink-12);}
.faq-list summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;
  padding:1.55rem .2rem;font-family:var(--serif);font-size:clamp(1.15rem,1.7vw,1.45rem);
  transition:color .3s,padding-left .3s var(--ease-out);
}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary:hover{color:var(--rosegold-deep);padding-left:.6rem;}
.faq-list summary .ind{
  flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--ink-12);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:1.3rem;transition:transform .35s var(--ease-out),background .3s,color .3s,border-color .3s;
}
.faq-list details[open] summary .ind{transform:rotate(45deg);background:var(--ink);color:var(--porcelain);border-color:var(--ink);}
.faq-list .faq-body{padding:0 3.2rem 1.7rem .2rem;color:var(--ink-60);font-size:.97rem;max-width:42em;}

/* ============================================================
   OVER
   ============================================================ */
#over{background:var(--ivory);padding:clamp(3rem,6vh,5rem) 0 clamp(6rem,12vh,9rem);overflow:hidden;}
.over-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2.5rem,5vw,5rem);align-items:center;}
.over-copy h2{margin:1.4rem 0 1.6rem;}
.over-copy p{color:var(--ink-60);margin-bottom:1.2rem;max-width:36em;}
.over-copy .name-origin{
  margin-top:2.2rem;padding:1.8rem 2rem;border-left:2px solid var(--rosegold);
  background:rgba(255,255,255,.55);border-radius:0 18px 18px 0;
  font-family:var(--serif);font-size:1.18rem;font-style:italic;color:var(--ink);max-width:32em;
}
.over-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:380px;}
.over-ring{position:absolute;border-radius:50%;border:1px solid rgba(183,110,121,.3);}
.over-ring.r3{width:96%;aspect-ratio:1;border-style:dashed;border-color:rgba(183,110,121,.2);animation:spin 90s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.over-photo{width:88%;border-radius:26px;overflow:hidden;margin:0;box-shadow:0 50px 90px -45px rgba(28,27,26,.45);}
.over-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.over-quote{
  position:absolute;bottom:6%;right:0;background:var(--porcelain);border:1px solid var(--ink-12);
  border-radius:16px;padding:1.1rem 1.5rem;font-family:var(--serif);font-style:italic;font-size:1.05rem;
  box-shadow:0 24px 50px -24px rgba(28,27,26,.25);
}

/* ============================================================
   CAMPAGNE (spot)
   ============================================================ */
#spot{padding:clamp(6rem,12vh,9rem) 0;background:var(--ivory);border-top:1px solid var(--ink-12);}
.spot-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2.5rem,5vw,5rem);align-items:center;}
.spot-copy h2{margin:1.4rem 0 1.4rem;}
.spot-copy p{color:var(--ink-60);max-width:32em;margin-bottom:1.1rem;}
.spot-note{font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-60);}
.spot-phone{
  position:relative;width:min(76vw,330px);margin:0 auto;aspect-ratio:9/16;
  border-radius:38px;overflow:hidden;border:1px solid var(--ink-12);
  box-shadow:0 60px 110px -50px rgba(28,27,26,.5);background:var(--mocha);
}
.spot-phone video{width:100%;height:100%;object-fit:cover;display:block;}

/* ============================================================
   VERZENDING
   ============================================================ */
section#verzending{padding:clamp(5rem,9vh,7rem) 0;border-top:1px solid var(--ink-12);background:var(--porcelain);}
.ship-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,2.6rem);margin-top:3.4rem;}
.ship{padding:0 .2rem;}
.ship .s-icon{
  width:50px;height:50px;border-radius:50%;border:1px solid var(--ink-12);margin-bottom:1.4rem;
  display:flex;align-items:center;justify-content:center;color:var(--rosegold-deep);
}
.ship h3{font-size:1.35rem;margin-bottom:.6rem;}
.ship p{font-size:.93rem;color:var(--ink-60);}

/* ============================================================
   SLOT CTA + FOOTER
   ============================================================ */
#slot{
  background:var(--mocha);color:var(--porcelain);
  border-radius:38px 38px 0 0;text-align:center;
  padding:clamp(6rem,13vh,10rem) 1.5rem clamp(4rem,8vh,6rem);
  position:relative;overflow:hidden;
}
.slot-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;filter:brightness(.42) saturate(.9);}
.slot-shade{position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(36,31,27,.1),rgba(36,31,27,.82) 78%);}
#slot>.label,#slot>h2,#slot>.btn{position:relative;z-index:2;}
#slot .label{color:var(--rosegold);justify-content:center;}
#slot .label::before{background:var(--rosegold);}
#slot h2{font-size:clamp(2.4rem,5.4vw,4.6rem);margin:1.6rem 0 2.6rem;position:relative;}
#slot h2 em{font-style:italic;color:var(--rosegold);}
footer{background:#191512;color:rgba(250,247,242,.6);font-size:.86rem;}
.foot-main{
  max-width:1280px;margin:0 auto;padding:4rem clamp(1.4rem,4.5vw,4rem) 2.6rem;
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:3rem;
}
.foot-brand .foot-logo{font-family:var(--sans);font-weight:400;font-size:1.6rem;letter-spacing:.05em;text-transform:lowercase;color:var(--porcelain);display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;margin-bottom:1rem;}
.foot-brand .foot-logo .dot{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 55%,var(--pearl-lo));box-shadow:0 1px 3px rgba(0,0,0,.3);}
.foot-brand p{max-width:26em;font-size:.86rem;line-height:1.7;}
.foot-col h3{font-size:.68rem;letter-spacing:.4em;text-transform:uppercase;color:rgba(250,247,242,.4);margin-bottom:1.3rem;font-weight:400;font-family:var(--sans);}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.7rem;}
.foot-col a{text-decoration:none;transition:color .3s;}
.foot-col a:hover{color:var(--rosegold);}
.foot-legal{
  border-top:1px solid rgba(250,247,242,.1);
  max-width:1280px;margin:0 auto;padding:2rem clamp(1.4rem,4.5vw,4rem) 2.6rem;
  font-size:.74rem;color:rgba(250,247,242,.52);line-height:1.8;
}
.foot-legal ul{list-style:none;display:flex;flex-direction:column;gap:.3rem;margin:.8rem 0 1.2rem;}
.foot-legal .copy{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.4rem;color:rgba(250,247,242,.58);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1100px){
  .product-grid{grid-template-columns:1fr;}
  .product-visual{position:relative;top:0;}
}
@media (max-width:1020px){
  .usp-grid{grid-template-columns:1fr 1fr;}
  .usp:nth-child(3){border-left:none;}
  .usp{border-top:1px solid var(--ink-12);}
  .usp:nth-child(1),.usp:nth-child(2){border-top:none;}
  .laag-pin{
    grid-template-columns:1fr;
    grid-template-rows:minmax(0,auto) minmax(0,1fr);
    gap:1.2rem;align-items:start;
    padding-top:clamp(5rem,12vh,7rem);
  }
  .laag-stage{gap:1.2rem;}
  .laag-pearl{width:min(52vw,240px);}
  .laag-texts{min-height:14rem;align-items:flex-start;}
  .beat{justify-content:flex-start;text-align:center;max-width:none;align-items:center;}
  .beat p{max-width:30em;}
  .pillars{grid-template-columns:1fr;}
  .eerlijk-grid{grid-template-columns:1fr;}
  .faq-grid{grid-template-columns:1fr;}
  .faq-intro{position:relative;top:0;}
  .over-grid{grid-template-columns:1fr;}
  .dranken-grid{grid-template-columns:1fr;}
  .spot-grid{grid-template-columns:1fr;}
  .ship-grid{grid-template-columns:1fr;}
  .foot-main{grid-template-columns:1fr;gap:2.4rem;}
}
@media (max-width:560px){
  /* compact 2x2, gecentreerd — randen komen uit het 1020px-blok */
  .usp{justify-content:center;text-align:center;padding:.85rem .55rem;font-size:.6rem;letter-spacing:.08em;gap:.5rem;}
  .usp .pdot{width:7px;height:7px;}
  .product-cta .btn{width:100%;justify-content:center;}
  .variants{flex-direction:column;}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
  #swup{scroll-behavior:auto;}
  .reveal,.reveal-stagger>*{opacity:1;transform:none;}
  .beat{opacity:1;}
  .nacre{opacity:1;transform:scale(1);}
  [data-reveal-01]{visibility:visible;}
}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--rosegold);outline-offset:3px;border-radius:4px;}

/* ============================================================
   PAREL-PARALLAX — vallende parels achter witruimte
   (--diepte 0..1: dichtbij = groter/scherper/sneller vallend)
   ============================================================ */
.heeft-parels{position:relative;}
.heeft-parels > .wrap{position:relative;z-index:1;}
.pearl-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.pearl-f{
  position:absolute;display:block;
  width:calc(26px + var(--diepte,.5) * 92px);
  opacity:calc(.22 + var(--diepte,.5) * .55);
  filter:blur(calc((1 - var(--diepte,.5)) * 5px))
         drop-shadow(0 18px 22px rgba(74,59,51,.16));
  will-change:transform;
}
.pearl-f img{width:100%;height:auto;display:block;}
@media (prefers-reduced-motion: reduce){
  .pearl-f{opacity:.14;filter:none;}
}
@media (max-width:760px){
  .pearl-f{width:calc(16px + var(--diepte,.5) * 58px);}
  .pearl-f[data-mobiel-weg]{display:none;}
}

/* ============================================================
   KORTINGSPOPUP — lanceringscode (één keer per bezoeker)
   ============================================================ */
.korting-pop{position:fixed;inset:0;z-index:240;display:grid;place-items:center;padding:1.2rem;}
.korting-pop[hidden]{display:none;}
.korting-pop__backdrop{
  position:absolute;inset:0;background:rgba(20,16,13,.5);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  opacity:0;transition:opacity .45s var(--ease-out);
}
.korting-pop__kaart{
  position:relative;width:min(420px,94vw);max-height:calc(100svh - 2.4rem);overflow:auto;
  background:var(--porcelain);border-radius:28px;border:1px solid rgba(255,255,255,.65);
  box-shadow:0 40px 90px -30px rgba(20,16,13,.55), inset 0 1px 0 rgba(255,255,255,.8);
  opacity:0;transform:translateY(22px) scale(.96);
  transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);
}
.korting-pop.is-open .korting-pop__backdrop{opacity:1;}
.korting-pop.is-open .korting-pop__kaart{opacity:1;transform:none;}
.korting-pop__sluit{
  position:absolute;top:.9rem;right:.9rem;z-index:2;width:2.3rem;height:2.3rem;border-radius:50%;
  display:grid;place-items:center;font-size:1.3rem;line-height:1;color:var(--porcelain);
  background:rgba(28,27,26,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  cursor:pointer;transition:background .3s;
}
.korting-pop__sluit:hover{background:rgba(28,27,26,.72);}
.korting-pop__beeld{margin:0;aspect-ratio:5/4;overflow:hidden;}
.korting-pop__beeld img{width:100%;height:100%;object-fit:cover;display:block;}
.korting-pop__body{padding:1.7rem 1.7rem 1.6rem;text-align:center;}
.korting-pop__body h2{font-size:clamp(1.7rem,5vw,2.1rem);margin:.7rem 0 .55rem;}
.korting-pop__body > p{color:var(--ink-60);font-size:.95rem;line-height:1.6;}
.korting-pop__code{
  margin:1.15rem auto .95rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;
  padding:.75rem 1.7rem;border-radius:14px;cursor:pointer;
  border:1.5px dashed rgba(183,110,121,.65);background:#fff;
  transition:border-color .3s, box-shadow .3s, transform .3s;
}
.korting-pop__code:hover{border-color:var(--rosegold-deep);box-shadow:0 12px 28px -14px rgba(156,85,96,.5);transform:translateY(-1px);}
.korting-pop__code .code{font-family:var(--sans);font-size:1.3rem;letter-spacing:.3em;color:var(--rosegold-deep);text-transform:uppercase;}
.korting-pop__code .kopieer{font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-60);}
.korting-pop__code.is-gekopieerd{border-style:solid;border-color:var(--rosegold-deep);}
.korting-pop__cta{width:100%;justify-content:center;}
.korting-pop__voet{margin-top:.95rem;font-size:.72rem;letter-spacing:.04em;color:var(--ink-60);}
@media (max-width:480px){
  .korting-pop__beeld{aspect-ratio:16/9;}
  .korting-pop__body{padding:1.4rem 1.2rem 1.3rem;}
}

/* ============================================================
   VOOR/NA — vergelijk-slider (testpanel-illustraties)
   ============================================================ */
#voorna{padding:clamp(4.5rem,9vh,7.5rem) 0;}
.voorna-head{max-width:620px;margin-bottom:3.2rem;}
.voorna-disclaimer{margin-top:.7rem;font-size:.78rem;line-height:1.6;color:var(--ink-60);letter-spacing:.02em;}
.voorna-rijen{display:grid;gap:clamp(1.6rem,3vw,2.6rem);}
.voorna-rij{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  background:#fff;border:1px solid var(--ink-12);border-radius:26px;overflow:hidden;
}
.vergelijk{position:relative;aspect-ratio:4/5;user-select:none;-webkit-user-select:none;}
.vergelijk img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.vergelijk__na{position:absolute;inset:0;clip-path:inset(0 0 0 var(--pos,50%));}
.vergelijk__lijn{
  position:absolute;top:0;bottom:0;left:var(--pos,50%);width:2px;margin-left:-1px;
  background:rgba(255,255,255,.85);box-shadow:0 0 16px rgba(0,0,0,.3);pointer-events:none;
}
.vergelijk__knop{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:2.9rem;height:2.9rem;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--pearl-hi),var(--pearl-mid) 60%,var(--pearl-lo));
  display:grid;place-items:center;color:var(--brand-brown);font-size:.95rem;letter-spacing:.05em;
  box-shadow:0 8px 24px rgba(20,16,13,.35), inset 0 1px 0 rgba(255,255,255,.7);
}
.vergelijk__range{
  position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;
  cursor:ew-resize;-webkit-appearance:none;appearance:none;touch-action:pan-y;
}
.vergelijk.heeft-focus{outline:2px solid var(--rosegold);outline-offset:-2px;}
.vergelijk__tag{
  position:absolute;bottom:.9rem;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.38rem .75rem;border-radius:999px;background:rgba(28,27,26,.82);color:var(--porcelain);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;
}
.vergelijk__tag--voor{left:.9rem;}
.vergelijk__tag--na{right:.9rem;}
.vergelijk__illu{
  position:absolute;top:.9rem;left:.9rem;right:.9rem;width:max-content;max-width:calc(100% - 1.8rem);
  font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.34rem .7rem;border-radius:999px;background:rgba(250,247,242,.92);color:var(--ink);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;
}
.voorna-tekst{padding:clamp(1.6rem,3vw,2.6rem);display:flex;flex-direction:column;gap:1rem;justify-content:center;}
.voorna-tekst blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.65;color:var(--ink);}
.voorna-naam{font-size:.8rem;letter-spacing:.08em;color:var(--ink-60);}
.voorna-chips{display:flex;flex-wrap:wrap;gap:.5rem;}
.voorna-chips span{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.42rem .85rem;border-radius:999px;background:var(--porcelain);border:1px solid var(--ink-12);color:var(--ink);}
.voorna-product{display:flex;align-items:center;gap:.8rem;margin-top:.4rem;font-size:.85rem;color:var(--ink);transition:color .3s;text-decoration:none;}
.voorna-product img{width:46px;height:46px;border-radius:10px;object-fit:cover;border:1px solid var(--ink-12);}
.voorna-product:hover{color:var(--rosegold-deep);}
@media (max-width:860px){
  .voorna-rij{grid-template-columns:1fr;}
  .vergelijk{aspect-ratio:1/1.05;}
}


/* Compacte productpresentatie — Lisselle, Éclat/Glow25-inspiratie. */
.announce-offer{color:inherit;background:none;border:0;padding:0;font:inherit;font-weight:400;letter-spacing:.08em;cursor:pointer;}
.announce-offer:hover{text-decoration:underline;}
.product-info .p-sub{margin-bottom:1.2rem;max-width:38em;}
.product-info .p-checks{margin-bottom:.4rem;gap:.45rem;}
.benefit-note{font-size:.86rem;color:rgba(250,247,242,.65);margin:0 0 1.4rem;}
#bundels{scroll-margin-top:120px;}
.variants{display:flex;flex-direction:column;gap:.65rem;margin-bottom:1.3rem;}
.variant{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.3rem 1rem;padding:1rem 1.2rem;}
.variant .v-name{font-size:1.2rem;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;}
.variant .v-price{font-size:1.35rem;text-align:right;}
.variant .v-meta{font-size:.86rem;text-transform:none;letter-spacing:0;}
.variant .v-save{font-size:.8rem;letter-spacing:0;text-transform:none;margin:0;text-align:right;justify-self:end;}
.variant .v-badge{font-size:.74rem;letter-spacing:0;text-transform:none;}
.product-cta{margin-bottom:1.5rem;}
.product-cta .btn{width:100%;justify-content:space-between;}
.product-info .acc{margin-top:1.8rem;}
.acc summary{font-size:.96rem;letter-spacing:0;text-transform:none;padding:1.05rem .2rem;}
.shop-meta{font-size:.95rem;letter-spacing:0;text-transform:none;}
.shop-sale{font-size:1rem;line-height:1.6;}
.shop-price small{font-size:.9rem;letter-spacing:0;text-transform:none;}
.footer-details summary{cursor:pointer;font-size:.9rem;color:rgba(250,247,242,.7);padding:.4rem 0;}
.footer-details[open] summary{margin-bottom:1rem;}
@media(max-width:760px){
  .product-visual .media-stage .product-media{max-height:350px;object-fit:contain;background:transparent;}
  .product-visual .thumbs{margin-top:1rem;}
  .variant{padding:.9rem 1rem;}
  .variant .v-name{font-size:1.15rem;gap:.5rem;}
  .product-info h1{font-size:2.1rem;}
}

/* Aparte SALE-kaart naast de productbeelden en onder het mobiele menu. */
.navigation-01 .nav-flyout__panel--mega .nav-dropdown__inner{width:760px;}
.navigation-01 .nav-flyout__panel--mega .nav-dropdown__sidebar{flex:0 0 31%;}
.navigation-01 .nav-sale-card{
  position:relative;display:block;flex:0 0 248px;min-height:264px;
  margin:4px;overflow:hidden;border-radius:13px;background:var(--shell);
  color:#fff;text-decoration:none;isolation:isolate;
}
.navigation-01 .nav-sale-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.navigation-01 .nav-sale-card::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(28,27,26,.2),transparent 45%,rgba(28,27,26,.7));}
.nav-sale-card__title{position:absolute;z-index:1;top:14px;left:18px;font-family:var(--serif);font-size:3.6rem;font-weight:400;line-height:1;letter-spacing:-.03em;}
.nav-sale-card__link{position:absolute;z-index:1;right:18px;bottom:16px;left:18px;display:flex;justify-content:space-between;align-items:center;font-size:1rem;font-weight:400;}
.navigation-01 .nav-sale-card:focus-visible{outline:2px solid var(--porcelain);outline-offset:2px;}
.navigation-01 .nav-sale-card--mobile{display:none;}
@media(max-width:900px){
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__inner{width:100%;}
  .navigation-01 .nav-flyout__panel--mega .nav-dropdown__sidebar{flex:none;}
  .navigation-01 .nav-sale-card--desktop{display:none;}
  .navigation-01 .nav-sale-card--mobile{display:block;flex:none;min-height:190px;margin:8px;}
  .navigation-01 .nav-sale-card--mobile img{object-position:50% 58%;}
}

/* Leesbaarheid: heldere tekst en cijfers, herkenbare merkkoppen. */
:root{
  --sans:'Inter',Arial,sans-serif;
  --ink-60:rgba(28,27,26,.78);
  --ink-40:rgba(28,27,26,.68);
}
body{font-weight:400;}
h1,h2,h3{font-weight:500;}
.logo,.loader-word,.foot-brand .foot-logo{font-family:'Jost',Arial,sans-serif;}
.product-info h1,.product-info h2,.shop-info h3,.shop-price b,.price,.variant .v-name,.variant .v-price,.faq-list summary{
  font-family:var(--sans);font-weight:500;letter-spacing:-.025em;
}
.product-info h1{font-size:clamp(1.85rem,3vw,2.5rem);line-height:1.2;}
.product-info .p-sub,.p-checks li{font-size:1rem;color:rgba(250,247,242,.9);}
.benefit-note,.variant .v-meta,.spec-foot{color:rgba(250,247,242,.8);font-size:.9rem;}
.variant .v-name{font-size:1.05rem;color:var(--porcelain);}
.variant .v-price{font-size:1.25rem;font-weight:600;font-variant-numeric:tabular-nums;}
.variant .v-save,.variant .v-badge{color:#f0bec6;font-family:var(--sans);font-size:.8rem;font-weight:500;}
.variant .v-badge{letter-spacing:0;}
.acc summary{font-size:1rem;font-weight:500;color:var(--porcelain);}
.acc .acc-body{font-size:1rem;color:rgba(250,247,242,.87);line-height:1.75;}
.spec-table th,.spec-table td{font-weight:400;}
.spec-table th{color:rgba(250,247,242,.8);font-size:.82rem;letter-spacing:.04em;}
.spec-table td{font-size:.95rem;}
.faq-list summary{font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.5;}
.faq-list .faq-body,.ship p{font-size:1rem;}
.btn,.liquid-btn__label{font-weight:500;letter-spacing:.12em;}
.lijst-form input[type="email"]{font-weight:400;}
.navigation-01 .nav-dropdown__description{color:rgba(255,255,255,.8);font-size:14px;}
.navigation-01 .nav-dropdown__title,.nav-sale-card__link{font-weight:500;}
#eerlijk .lead,.e-col li,.e-col.niet li{color:rgba(250,247,242,.86);}
footer{color:rgba(250,247,242,.8);}
.foot-col h3{color:rgba(250,247,242,.75);font-size:.75rem;letter-spacing:.15em;}
.foot-legal,.foot-legal .copy,.footer-details summary{color:rgba(250,247,242,.75);}
@media(max-width:760px){
  .product-info h1{font-size:1.85rem;}
  .variant{column-gap:.7rem;}
  .variant .v-name{gap:.35rem;font-size:1rem;}
  .variant .v-badge{font-size:.75rem;}
}

/* Sale: de losse totaalprijs zichtbaar naast het bundelvoorstel. */
.sale-badge{display:inline-flex;align-items:center;width:max-content;padding:.3rem .55rem;border-radius:5px;background:#efbbc4;color:#371f25;font-family:var(--sans);font-size:.7rem;font-weight:700;letter-spacing:.06em;line-height:1;}
.bundle--sale .sale-badge,.shop-sale--offer .sale-badge{animation:salePulse 2.8s ease-in-out infinite;transform-origin:center;}
@keyframes salePulse{0%,65%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(239,187,196,0);}30%{transform:scale(1.1);box-shadow:0 0 0 5px rgba(239,187,196,.13);}}
.bundle--sale{border-color:rgba(239,187,196,.45);}
.bundle--sale[aria-pressed="true"]{border-color:#efbbc4;box-shadow:inset 0 0 0 1px rgba(239,187,196,.22);}
.bundle--sale .v-price{display:flex;flex-direction:column;gap:.2rem;align-items:flex-end;line-height:1.3;}
.variant .v-compare{font-size:.82rem;font-weight:400;letter-spacing:0;color:rgba(250,247,242,.78);}
.variant .v-price s{opacity:1;font:inherit;margin-left:.15rem;text-decoration-thickness:1.5px;text-decoration-color:#f0bec6;}
.variant .v-save{color:#f4c6ce;font-weight:600;}
.shop-sale--offer{display:flex;flex-direction:column;align-items:flex-start;gap:.6rem;background:#f1e5df;border:1px solid #dac1ba;border-radius:12px;padding:1rem 1.2rem;margin:0 0 1.5rem;}
.shop-sale__heading,.shop-sale__prices{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;}
.shop-sale__heading{font-weight:500;}
.shop-sale__prices{align-items:baseline;gap:1rem;}
.shop-sale__compare{font-size:.9rem;color:#65544b;}
.shop-sale--offer s{opacity:1;margin:0;text-decoration-thickness:1.5px;text-decoration-color:#8b4655;}
.shop-sale--offer b{font-family:var(--sans);font-size:1.6rem;font-weight:600;letter-spacing:-.025em;line-height:1.2;}
.shop-sale__saving{font-size:.9rem;font-weight:600;color:#713a46;}
.korting-pop__body s,.korting-pop s{text-decoration-thickness:1.5px;}
@media(prefers-reduced-motion:reduce){.bundle--sale .sale-badge,.shop-sale--offer .sale-badge{animation:none;}}
