/* ==========================================================================
   Kessel & Vos, stylesheet
   Opbouw: tokens, basis, layout, header, hero, secties, winkel, pagina's,
   winkelwagen, animaties. Mobile first, breakpoints 760px en 1080px.
   ========================================================================== */

:root {
  --bg: #0B0B0C;
  --bg-2: #121214;
  --bg-3: #1A1A1D;
  --line: #26262A;
  --text: #F2EFE9;
  --muted: #9A968F;
  --acc: #8A7CFF;      /* violet, de ene accentkleur */
  --acc-2: #4FA3FF;    /* blauw, tweede kleur van het verloop */
  --acc-dim: #4B3FA3;
  --grad: linear-gradient(135deg, #8A7CFF 0%, #4FA3FF 100%);

  --serif: 'Outfit', 'Inter', system-ui, sans-serif; /* modern, geen serif meer */
  --r: 22px; --r-sm: 14px;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --max: 1240px;
  --gut: 20px;
  --sec: 72px;
  --hh: 76px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}
@media (min-width: 760px) { :root { --gut: 32px; --sec: 96px; --hh: 84px; } }
@media (min-width: 1080px) { :root { --gut: 40px; --sec: 120px; } }

/* ---------- Basis ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: hidden; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 300 1rem/1.7 var(--sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html.is-locked { overflow: hidden; }
img, svg { max-width: 100%; }
img { display: block; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 300; line-height: 1.08; letter-spacing: -.02em; margin: 0; }
p { margin: 0 0 1em; }
em { font-style: normal; }
h1 em, h2 em, .display em { color: var(--acc); font-weight: 500; background: var(--grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
address { font-style: normal; }
::selection { background: var(--acc); color: var(--bg); }

:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }
:focus:not(:focus-visible) { outline: none; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 100;
  padding: 12px 18px; background: var(--acc); color: var(--bg);
  text-decoration: none; transform: translateY(-200%);
}
.skip-link:focus { transform: none; }

/* ---------- Typografie ---------- */
.display {
  font-size: clamp(2.4rem, 6vw, 5.5rem);
  line-height: 1.02;
  letter-spacing: -.01em;
}
.eyebrow {
  display: block;
  font: 500 .72rem/1.4 var(--sans);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--acc);
  margin: 0 0 20px;
}
.lead { font-size: 1.08rem; color: var(--muted); max-width: 46ch; margin-top: 24px; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }

.link {
  display: inline-flex; align-items: center; gap: .6em;
  font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase;
  color: var(--text); text-decoration: none; padding: 10px 0;
  background: linear-gradient(var(--acc), var(--acc)) 0 100% / 100% 1px no-repeat;
}
.link:hover { color: var(--acc-2); }

/* ---------- Layout ---------- */
.wrap { width: 100%; max-width: calc(var(--max) + var(--gut) * 2); margin-inline: auto; padding-inline: var(--gut); }
.section { padding-block: var(--sec); }
.section--alt { background: var(--bg-2); border-block: 1px solid var(--line); }
.sec-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 24px; margin-bottom: 48px;
}
.sec-head .display { max-width: 14ch; }
.pb { padding-bottom: var(--sec); }
.page-head { padding-top: calc(var(--hh) + 48px); padding-bottom: 40px; }
.page-head .display { max-width: 16ch; }
@media (min-width: 1080px) { .page-head { padding-top: calc(var(--hh) + 96px); padding-bottom: 64px; } }

/* ---------- Knoppen ---------- */
.btn {
  --mx: 0px; --my: 0px;
  display: inline-flex; align-items: center; justify-content: center; gap: .75em;
  min-height: 52px; padding: 0 30px;
  border: 1px solid var(--acc); border-radius: 999px;
  background: transparent; color: var(--acc);
  font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase;
  text-decoration: none; cursor: pointer;
  transform: translate(var(--mx), var(--my));
}
.btn:hover, .btn:focus-visible { background: var(--grad); border-color: transparent; color: #0B0B0C; }
.btn--ghost { border-color: var(--line); color: var(--text); }
.btn--ghost:hover, .btn--ghost:focus-visible { border-color: var(--acc); }
.btn--full { width: 100%; }
.btn[disabled] { opacity: .4; cursor: not-allowed; background: transparent; color: var(--acc); }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }

.icon-btn { border-radius: 50%;
  position: relative; display: inline-grid; place-items: center;
  width: 44px; height: 44px; padding: 0; border: 0; background: none;
  color: var(--text); cursor: pointer;
}
.icon-btn:hover { color: var(--acc-2); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: var(--bg); /* dekkend, bewust geen backdrop-filter */
}
.site-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: var(--acc); opacity: 0;
}
.site-header.is-scrolled::after { opacity: .55; }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 16px; }
.site-header.is-scrolled .bar { padding-block: 8px; }

.logo { display: inline-flex; flex-direction: column; color: var(--text); text-decoration: none; line-height: 1; }
.logo__name { font-family: var(--serif); font-size: 1.45rem; font-weight: 500; letter-spacing: .01em; white-space: nowrap; }
.logo__name em { color: var(--acc); }
.logo__sub {
  font-size: .58rem; letter-spacing: .3em; text-transform: uppercase; color: var(--muted);
  margin-top: 7px; max-height: 1.2em; overflow: hidden; white-space: nowrap;
}
.site-header.is-scrolled .logo__name { font-size: 1.2rem; }
.site-header.is-scrolled .logo__sub { max-height: 0; margin-top: 0; opacity: 0; }
@media (min-width: 760px) { .logo__name { font-size: 1.65rem; } .site-header.is-scrolled .logo__name { font-size: 1.3rem; } }

.nav { display: none; }
.nav ul { display: flex; gap: 32px; list-style: none; margin: 0; padding: 0; }
.nav a {
  position: relative; display: block; padding: 10px 0;
  font-size: .72rem; font-weight: 400; letter-spacing: .22em; text-transform: uppercase;
  color: var(--text); text-decoration: none;
}
.nav a::after {
  content: ""; position: absolute; left: 0; right: .22em; bottom: 4px; height: 1px;
  background: var(--acc); transform: scaleX(0); transform-origin: left;
}
.nav a:hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav a[aria-current="page"] { color: var(--acc); }
.actions { display: flex; align-items: center; gap: 4px; margin-right: -10px; }
.cart-count {
  position: absolute; top: 4px; right: 1px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; background: var(--acc); color: var(--bg);
  font: 500 .62rem/18px var(--sans); text-align: center;
}
.cart-count[data-empty] { display: none; }
.burger { position: relative; display: block; width: 22px; height: 8px; }
.burger::before, .burger::after {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: currentColor;
}
.burger::before { top: 0; }
.burger::after { bottom: 0; }
.menu-btn[aria-expanded="true"] .burger::before { top: 3.5px; transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] .burger::after { bottom: 3.5px; transform: rotate(-45deg); }
@media (min-width: 760px) {
  .nav { display: block; }
  .menu-btn { display: none; }
}

/* Mobiel menu: vast paneel, buiten de header geplaatst */
.mnav {
  position: fixed; inset: 0; z-index: 45;
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  padding: calc(var(--hh) + 24px) var(--gut) 40px;
  background: var(--bg); overflow-y: auto;
  transform: translateX(100%); visibility: hidden;
}
.mnav.is-open { transform: none; visibility: visible; }
.mnav ol { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.mnav li { border-bottom: 1px solid var(--line); }
.mnav__link {
  display: flex; align-items: baseline; gap: 18px; padding: 16px 0;
  font-family: var(--serif); font-size: 2.3rem; line-height: 1.1; color: var(--text); text-decoration: none;
}
.mnav__link span { font: 500 .7rem/1 var(--sans); letter-spacing: .22em; color: var(--acc); }
.mnav__link[aria-current="page"] { color: var(--acc); }
.mnav__foot { display: grid; gap: 24px; color: var(--muted); }
@media (min-width: 760px) { .mnav { display: none; } }

/* ---------- Hero ---------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100vh; min-height: 100svh;
  display: flex; align-items: center;
  padding: calc(var(--hh) + 32px) 0 64px;
}
.hero__light {
  position: absolute; z-index: -2; left: 50%; top: 62%;
  width: min(1100px, 170vw); aspect-ratio: 1;
  translate: -50% -50%;
  background: radial-gradient(closest-side, rgba(138, 124, 255, .17), rgba(138, 124, 255, .05) 50%, transparent 72%);
  transform: translate3d(0, var(--py, 0px), 0);
  pointer-events: none;
}
.hero__cursor {
  position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0;
  background: radial-gradient(420px circle at var(--cx, 50%) var(--cy, 50%), rgba(138, 124, 255, .10), transparent 65%);
}
.hero.has-cursor .hero__cursor { opacity: 1; }
.hero__grid { display: grid; gap: 24px; align-items: center; }
.hero__title { font-size: clamp(2.8rem, 8vw, 5.5rem); }
.hero__title .line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.hero__title .line > span { display: inline-block; }
.hero .btn-row { margin-top: 36px; }
.hero__watch { justify-self: center; width: min(78vw, 360px); }
.hero__watch svg {
  display: block; width: 100%; height: auto;
  -webkit-mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
  mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
}
.hero__watch .bg { display: none; }
.hero .hand { transform-origin: 400px 480px; transform-box: view-box; }
.hero .hand-h { transform: rotate(var(--rh, 305deg)); }
.hero .hand-m { transform: rotate(var(--rm, 60deg)); }
.hero .hand-s { transform: rotate(var(--rs, 192deg)); }
.hero__scroll {
  position: absolute; left: 50%; bottom: 24px; display: none;
  width: 1px; height: 56px; background: var(--line); overflow: hidden;
}
.hero__scroll::after { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 40%; background: var(--acc); }
@media (min-width: 1080px) {
  .hero__grid { grid-template-columns: 1.05fr .95fr; gap: 48px; }
  .hero__light { left: 72%; top: 50%; }
  .hero__watch { width: min(100%, 480px); justify-self: end; }
  .hero__scroll { display: block; }
}

/* ---------- Marquee ---------- */
.marquee { display: flex; overflow: hidden; border-block: 1px solid var(--line); padding: 22px 0; user-select: none; }
.marquee__track { flex: 0 0 auto; display: flex; align-items: center; min-width: 100%; }
.marquee__track span {
  font-family: var(--serif); font-weight: 300; font-size: clamp(1.6rem, 3vw, 2.4rem);
  white-space: nowrap; padding: 0 28px; color: var(--text);
}
.marquee__track i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--grad); }

/* ---------- Collectiekaarten ---------- */
.coll-grid { display: grid; gap: 16px; }
@media (min-width: 760px) { .coll-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } }
@media (min-width: 1080px) { .coll-grid { grid-template-columns: repeat(4, 1fr); } }
.coll-card {
  position: relative; display: block; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; background: var(--bg-2);
  color: var(--text); text-decoration: none;
}
.coll-card:hover { border-color: var(--acc-dim); }
.coll-card__media { aspect-ratio: 4 / 3; overflow: hidden; }
.coll-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.coll-card__media.is-detail img { object-position: 50% 50%; transform: scale(1.7); transform-origin: 50% 48%; }
.coll-card__body {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 24px;
  display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 14px;
  background: linear-gradient(to top, rgba(11, 11, 12, .95) 30%, rgba(11, 11, 12, 0));
}
.coll-card__n { font-size: .72rem; letter-spacing: .22em; color: var(--acc); }
.coll-card h3 { font-size: 2rem; font-weight: 500; }
.coll-card p { margin: 0; font-size: .8rem; color: var(--muted); white-space: nowrap; }
@media (min-width: 760px) { .coll-card__media { aspect-ratio: 4 / 5; } }
@media (min-width: 1080px) {
  .coll-card__body { grid-template-columns: auto 1fr; }
  .coll-card p { grid-column: 1 / -1; }
}

/* ---------- Productkaarten ---------- */
.grid-products { display: grid; gap: 40px 16px; grid-template-columns: 1fr; }
@media (min-width: 430px) { .grid-products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 760px) { .grid-products.grid-3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1080px) {
  .grid-products { grid-template-columns: repeat(3, 1fr); gap: 56px 24px; }
  .grid-products.grid-4 { grid-template-columns: repeat(4, 1fr); }
}
.card__link { display: block; color: inherit; text-decoration: none; }
.card__media {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--r);
  background: var(--bg-2); border: 1px solid var(--line);
}
.card__media img { width: 100%; height: 100%; object-fit: cover; }
.card__badge {
  position: absolute; z-index: 1; top: 14px; left: 14px; padding: 6px 9px;
  font: 500 .62rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase;
  color: var(--acc); border: 1px solid var(--acc-dim); border-radius: 999px; background: rgba(11, 11, 12, .7);
}
.card__body { padding-top: 18px; }
.card__meta { margin: 0 0 6px; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.card__name { position: relative; display: inline-block; font-size: 1.55rem; font-weight: 500; line-height: 1.15; }
.card__name::after {
  content: ""; position: absolute; left: 0; bottom: -3px; width: 100%; height: 1px;
  background: var(--acc); transform: scaleX(0); transform-origin: left;
}
.card__price { display: flex; align-items: center; gap: 10px; margin: 10px 0 0; color: var(--muted); }
.card__arrow { color: var(--acc); opacity: 0; }
.card__link:hover .card__name::after, .card__link:focus-visible .card__name::after { transform: scaleX(1); }
.card__link:hover .card__price, .card__link:focus-visible .card__price { color: var(--text); }
.card__link:hover .card__arrow, .card__link:focus-visible .card__arrow { opacity: 1; }
.empty { grid-column: 1 / -1; color: var(--muted); padding: 40px 0; }

/* ---------- Atelier-feiten ---------- */
.split { display: grid; gap: 56px; }
@media (min-width: 1080px) { .split { grid-template-columns: 1fr 1fr; gap: 96px; align-items: start; } }
.facts { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.facts li { display: grid; grid-template-columns: 44px 1fr; gap: 20px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.facts svg { width: 32px; height: 32px; color: var(--acc); }
.facts h3 { font-size: 1.75rem; font-weight: 500; margin-bottom: 8px; }
.facts p { margin: 0; color: var(--muted); }

/* ---------- Winkel / openingstijden ---------- */
.visit { display: grid; gap: 48px; padding: 40px 24px; border-radius: var(--r); border: 1px solid var(--line); background: var(--bg-2); }
.visit address { margin-top: 28px; line-height: 1.8; }
@media (min-width: 760px) { .visit { padding: 56px 48px; } }
@media (min-width: 1080px) { .visit { grid-template-columns: 1.2fr 1fr; gap: 96px; padding: 80px; } }
.hours { margin: 0; border-top: 1px solid var(--line); }
.hours div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.hours dt, .hours dd { margin: 0; }
.hours dd { color: var(--muted); text-align: right; }
.hours--sm div { padding: 8px 0; font-size: .88rem; }

/* ---------- Footer ---------- */
.site-footer { border-top: 1px solid var(--line); padding: 72px 0 32px; }
.footer__grid { display: grid; gap: 44px 24px; grid-template-columns: 1fr 1fr; }
.footer__brand, .footer__visit { grid-column: 1 / -1; }
.footer__line { color: var(--muted); max-width: 32ch; margin-top: 20px; }
.footer__h { font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--acc); margin: 0 0 20px; }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.site-footer a { color: var(--muted); text-decoration: none; }
.site-footer a:hover { color: var(--acc-2); }
.site-footer address { color: var(--muted); margin-bottom: 16px; }
.footer__base {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px;
  margin-top: 64px; padding-top: 24px; border-top: 1px solid var(--line);
  font-size: .8rem; color: var(--muted);
}
.footer__base p { margin: 0; }
@media (min-width: 1080px) {
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.3fr; }
  .footer__brand, .footer__visit { grid-column: auto; }
}

/* ---------- Collectiepagina ---------- */
.toolbar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px;
  padding: 20px 0; margin-bottom: 40px; border-block: 1px solid var(--line);
}
.toolbar__right { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; }
.count { margin: 0; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
@media (min-width: 1080px) { .toolbar__right { width: auto; } }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 40px; padding: 0 16px; border: 1px solid var(--line); border-radius: 999px;
  background: transparent; color: var(--text); cursor: pointer;
  font: 400 .7rem/1 var(--sans); letter-spacing: .18em; text-transform: uppercase;
}
.chip:hover { border-color: var(--acc-dim); }
.chip[aria-pressed="true"] { border-color: var(--acc); color: var(--acc); }
.chip .sw { width: 14px; height: 14px; border-radius: 50%; background: var(--c, var(--bg-3)); box-shadow: inset 0 0 0 1px rgba(242, 239, 233, .22); }
.select select {
  -webkit-appearance: none; appearance: none;
  min-height: 40px; padding: 0 40px 0 16px; border: 1px solid var(--line); border-radius: 999px;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23C9A34E'/%3E%3C/svg%3E") no-repeat right 14px center;
  color: var(--text); font-size: .85rem; cursor: pointer;
}
.select select option { background: var(--bg-2); color: var(--text); }

/* ---------- Productpagina ---------- */
.crumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.crumbs a { color: var(--muted); text-decoration: none; }
.crumbs a:hover { color: var(--acc-2); }
.crumbs [aria-current] { color: var(--text); }
.pdp-top { padding-top: calc(var(--hh) + 28px); }
.pdp { display: grid; gap: 40px; }
@media (min-width: 1080px) {
  .pdp-top { padding-top: calc(var(--hh) + 48px); }
  .pdp { grid-template-columns: 1.1fr .9fr; gap: 80px; align-items: start; }
}
.gallery__main { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--r); background: var(--bg); border: 1px solid var(--line); }
.gallery__main svg, .gallery__main img { display: block; width: 100%; height: 100%; }
.gallery__thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
.thumb { display: block; padding: 0; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--bg); cursor: pointer; }
.thumb svg { display: block; width: 100%; height: 100%; pointer-events: none; }
.thumb[aria-pressed="true"] { border-color: var(--acc); }
.gallery .w { transform-origin: 400px 480px; transform-box: view-box; transform: scale(var(--scale, 1)); }
.pdp__name { margin: 4px 0 14px; font-size: clamp(2.4rem, 6vw, 4.4rem); }
.pdp__price { font-family: var(--serif); font-size: 1.9rem; color: var(--acc); margin: 0 0 18px; }
.pdp__text { color: var(--muted); max-width: 44ch; }
.opt { border: 0; padding: 0; margin: 30px 0 0; min-width: 0; }
.opt legend { padding: 0; margin-bottom: 12px; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.opt legend strong { margin-left: .6em; font-weight: 400; letter-spacing: .08em; text-transform: none; color: var(--text); font-size: .9rem; }
.pdp__buy { margin-top: 36px; }
.pdp__note { margin-top: 14px; font-size: .82rem; color: var(--muted); }
.specs { width: 100%; margin-top: 48px; border-collapse: collapse; }
.specs caption { text-align: left; font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--acc); padding-bottom: 16px; }
.specs th, .specs td { padding: 14px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-weight: 300; }
.specs tr:first-child th, .specs tr:first-child td { border-top: 1px solid var(--line); }
.specs th { width: 36%; padding-right: 16px; color: var(--muted); font-size: .88rem; }

/* ---------- Atelierpagina ---------- */
.story { display: grid; gap: 32px; align-items: center; }
.story + .story { margin-top: var(--sec); }
.story__media { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--r); border: 1px solid var(--line); background: var(--bg-2); }
.story__media img { width: 100%; height: 100%; object-fit: cover; }
.story__media.is-detail img { transform: scale(1.6); transform-origin: 50% 48%; }
.story__text h2 { font-size: clamp(2rem, 4.2vw, 3.4rem); margin-bottom: 20px; }
.story__text p { color: var(--muted); max-width: 46ch; }
@media (min-width: 760px) {
  .story { grid-template-columns: 1fr 1fr; gap: 56px; }
  .story:nth-child(even) .story__media { order: 2; }
}
@media (min-width: 1080px) { .story { gap: 112px; } }

.timeline { list-style: none; margin: 0; padding: 0; display: grid; }
.timeline li { position: relative; padding: 0 0 44px 36px; border-left: 1px solid var(--line); }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: ""; position: absolute; left: -5px; top: 4px; width: 9px; height: 9px; border-radius: 50%;
  background: var(--bg); border: 1px solid var(--acc); border-radius: 50%;
}
.timeline li::after {
  content: ""; position: absolute; left: -1px; top: 0; width: 1px; height: 100%;
  background: var(--acc); transform: scaleY(0); transform-origin: top; opacity: .6;
}
.timeline li.visible::after { transform: none; }
.timeline .step { display: block; font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--acc); }
.timeline h3 { font-size: 1.9rem; font-weight: 500; margin: 12px 0 10px; }
.timeline p { color: var(--muted); margin: 0; }
@media (min-width: 1080px) {
  .timeline { grid-template-columns: repeat(4, 1fr); gap: 32px; }
  .timeline li { padding: 36px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .timeline li::before { left: 0; top: -5px; }
  .timeline li::after { left: 0; top: -1px; width: 100%; height: 1px; transform: scaleX(0); transform-origin: left; }
  .timeline li.visible::after { transform: none; }
}
.cta-band { text-align: center; }
.cta-band .display { margin-inline: auto; max-width: 14ch; }
.cta-band .lead { margin-inline: auto; }
.cta-band .btn-row { justify-content: center; }

/* ---------- Contact ---------- */
.contact { display: grid; gap: 56px; padding-bottom: var(--sec); }
@media (min-width: 1080px) { .contact { grid-template-columns: 1fr 1.1fr; gap: 112px; } }
.info-block + .info-block { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--line); }
.info-block h2 { font-size: 1.9rem; font-weight: 500; margin-bottom: 16px; }
.info-block p, .info-block address { color: var(--muted); }
.info-block a { color: var(--text); text-decoration-color: var(--acc-dim); text-underline-offset: 4px; }
.info-block a.btn { color: var(--acc); }
.info-block a.btn:hover { color: var(--bg); }
.form-wrap { border-radius: var(--r); border: 1px solid var(--line); background: var(--bg-2); padding: 32px 20px; }
@media (min-width: 760px) { .form-wrap { padding: 56px; } }
.form { display: grid; gap: 28px; }
.form-wrap h2 { font-size: 2rem; font-weight: 500; }
.form .btn { justify-self: start; }
.form .small { margin: 0; color: var(--muted); }
.field label { display: block; margin-bottom: 8px; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.field input, .field textarea {
  width: 100%; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bg);
  background: transparent; color: var(--text); font-size: 1.05rem; font-weight: 300;
}
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field textarea:focus { border-color: var(--acc); outline: none; }
.form-done { padding: 8px 0; }
.form-done h2 { font-size: 2.2rem; margin-bottom: 16px; }
.form-done p { color: var(--muted); }

/* ---------- 404 ---------- */
.nf { min-height: 100vh; min-height: 100svh; display: grid; place-items: center; text-align: center; padding: calc(var(--hh) + 40px) 0 80px; }
.nf__code { display: block; font-family: var(--serif); font-size: clamp(6rem, 24vw, 14rem); line-height: .9; color: var(--acc); }
.nf .lead { margin-inline: auto; }
.nf .display { max-width: 14ch; margin: 12px auto 0; }
.nf .btn-row { justify-content: center; }

/* ---------- Winkelwagen ---------- */
.overlay { position: fixed; inset: 0; z-index: 65; background: rgba(0, 0, 0, .62); opacity: 0; visibility: hidden; }
.overlay.is-open { opacity: 1; visibility: visible; }
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 70;
  width: min(440px, 100%); display: flex; flex-direction: column;
  background: var(--bg-2); border-left: 1px solid var(--line); border-radius: var(--r) 0 0 var(--r);
  transform: translateX(100%); visibility: hidden;
}
.drawer.is-open { transform: none; visibility: visible; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 18px 24px; border-bottom: 1px solid var(--line); }
.drawer__head h2 { font-size: 1.8rem; font-weight: 500; }
.drawer__body { flex: 1; overflow-y: auto; padding: 0 24px; }
.cart-list { list-style: none; margin: 0; padding: 0; }
.cart-item { display: grid; grid-template-columns: 68px 1fr auto; gap: 16px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.cart-item img { width: 68px; height: 85px; object-fit: cover; border: 1px solid var(--line); }
.cart-item__name { font-family: var(--serif); font-size: 1.3rem; line-height: 1.1; margin: 0 0 4px; }
.cart-item__meta { margin: 0; font-size: .8rem; color: var(--muted); }
.cart-item__price { margin: 0; text-align: right; white-space: nowrap; }
.qty { display: inline-flex; align-items: center; margin-top: 12px; border: 1px solid var(--line); }
.qty button { width: 34px; height: 34px; padding: 0; border: 0; background: none; color: var(--text); cursor: pointer; font-size: 1rem; }
.qty button:hover { color: var(--acc-2); }
.qty output { min-width: 26px; text-align: center; font-size: .9rem; }
.cart-item__remove { display: block; margin: 10px 0 0 auto; padding: 0; border: 0; background: none; color: var(--muted); font-size: .75rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.cart-item__remove:hover { color: var(--acc-2); }
.cart-empty { padding: 40px 0; color: var(--muted); }
.cart-empty a { color: var(--acc); }
.drawer__foot { padding: 22px 24px 26px; border-top: 1px solid var(--line); }
.cart-total { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; font-family: var(--serif); font-size: 1.6rem; }
.drawer__foot .small { color: var(--muted); margin-bottom: 18px; }
.cart-msg { margin: 14px 0 0; min-height: 1.5em; color: var(--acc); font-size: .9rem; }

/* ==========================================================================
   Animaties, alleen met JS en zonder voorkeur voor minder beweging
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  html.js { scroll-behavior: smooth; }

  /* Header */
  .js .bar, .js .logo__name, .js .logo__sub { transition: padding .4s var(--ease), font-size .4s var(--ease), max-height .4s var(--ease), margin .4s var(--ease), opacity .3s; }
  .js .site-header::after { transition: opacity .4s; }
  .js .nav a::after { transition: transform .45s var(--ease); }
  .js .burger::before, .js .burger::after { transition: transform .35s var(--ease), top .35s var(--ease), bottom .35s var(--ease); }

  /* Knoppen */
  .js .btn { transition: background-color .35s var(--ease), color .35s var(--ease), border-color .35s, transform .35s var(--ease); }
  .js .chip { transition: border-color .3s, color .3s; }

  /* Mobiel menu */
  .js .mnav { transition: transform .55s var(--ease), visibility 0s linear .55s; }
  .js .mnav.is-open { transition: transform .55s var(--ease), visibility 0s; }
  .js .mnav li { opacity: 0; transform: translateY(14px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
  .js .mnav.is-open li { opacity: 1; transform: none; transition-delay: calc(.18s + var(--i, 0) * 60ms); }

  /* Scroll reveal */
  .js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: calc(var(--i, 0) * 90ms); }
  .js .reveal.visible { opacity: 1; transform: none; }
  .js .timeline li::after { transition: transform 1.2s var(--ease) .3s; }

  /* Hero */
  .js .hero__title .line > span { transform: translateY(110%); animation: kv-line 1.1s var(--ease) forwards; animation-delay: calc(.15s + var(--i, 0) * .14s); }
  .js .hero .fade-up { opacity: 0; animation: kv-fade 1s var(--ease) forwards; animation-delay: calc(.55s + var(--i, 0) * .12s); }
  .js .hero__float { animation: kv-float 6s ease-in-out infinite; }
  .js .hero svg.is-live .hand-s { animation: kv-sweep 60s linear infinite; }
  .js .hero__cursor { transition: opacity .6s; }
  .js .hero__scroll::after { animation: kv-scroll 2.4s var(--ease) infinite; }

  /* Marquee */
  .js .marquee__track { animation: kv-marquee 48s linear infinite; }
  .js .marquee:hover .marquee__track { animation-play-state: paused; }

  /* Kaarten */
  .js .card__media img, .js .coll-card__media img { transition: transform 1.2s var(--ease); }
  .js .card__link:hover .card__media img, .js .coll-card:hover .coll-card__media img { transform: scale(1.04); }
  .js .coll-card:hover .coll-card__media.is-detail img { transform: scale(1.77); }
  .js .card__name::after { transition: transform .6s var(--ease); }
  .js .card__price { transition: color .4s, transform .5s var(--ease); }
  .js .card__arrow { transition: opacity .4s, transform .5s var(--ease); transform: translateX(-6px); }
  .js .card__link:hover .card__arrow { transform: none; }
  .js .coll-card { transition: border-color .4s; }
  @media (hover: hover) {
    .js .card__price { transform: translateX(-4px); }
    .js .card__link:hover .card__price, .js .card__link:focus-visible .card__price { transform: none; }
  }

  /* Filterraster */
  .js [data-grid] { transition: opacity .3s var(--ease), transform .3s var(--ease); }
  .js [data-grid].is-changing { opacity: 0; transform: scale(.98); }

  /* Productgalerij */
  .js .gallery__main svg { transition: opacity .3s var(--ease); }
  .js .gallery__main.is-swapping svg { opacity: 0; }
  .js .gallery .w { transition: transform .6s var(--ease); }
  .js .gallery .band { transition: fill .5s var(--ease); }
  .js .thumb { transition: border-color .3s; }

  /* Winkelwagen */
  .js .overlay { transition: opacity .45s var(--ease), visibility 0s linear .45s; }
  .js .overlay.is-open { transition: opacity .45s var(--ease), visibility 0s; }
  .js .drawer { transition: transform .55s var(--ease), visibility 0s linear .55s; }
  .js .drawer.is-open { transition: transform .55s var(--ease), visibility 0s; }
  .js .cart-count.bump { animation: kv-bump .5s var(--ease); }
}

@keyframes kv-line { to { transform: none; } }
@keyframes kv-fade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes kv-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes kv-sweep { from { transform: rotate(var(--rs, 0deg)); } to { transform: rotate(calc(var(--rs, 0deg) + 360deg)); } }
@keyframes kv-marquee { to { transform: translateX(-100%); } }
@keyframes kv-scroll { 0% { transform: translateY(-100%); } 100% { transform: translateY(250%); } }
@keyframes kv-bump { 50% { transform: scale(1.35); } }

/* ---------- Licht cosmische achtergrond (paars-blauw) ---------- */
body { position: relative; }
body::before, body::after { content: ""; position: fixed; inset: -10%; z-index: -2; pointer-events: none; }
body::before {
  background:
    radial-gradient(55% 45% at 15% 10%, rgba(138, 124, 255, .16), transparent 70%),
    radial-gradient(50% 40% at 85% 25%, rgba(79, 163, 255, .12), transparent 70%),
    radial-gradient(65% 50% at 55% 100%, rgba(120, 80, 220, .14), transparent 70%),
    radial-gradient(35% 30% at 40% 60%, rgba(79, 163, 255, .06), transparent 70%),
    var(--bg);
}
body::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%221600%22%20height=%221000%22%20viewBox=%220%200%201600%201000%22%3E%3Ccircle%20cx=%22926%22%20cy=%22886%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22925%22%20cy=%22520%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22378%22%20cy=%22823%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221289%22%20cy=%22628%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22914%22%20cy=%22310%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221103%22%20cy=%22829%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22927%22%20cy=%22669%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221276%22%20cy=%2215%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22121%22%20cy=%2236%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221228%22%20cy=%2230%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22902%22%20cy=%22605%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221311%22%20cy=%22301%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221356%22%20cy=%2287%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22833%22%20cy=%22564%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22645%22%20cy=%22776%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%2260%22%20cy=%2271%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22820%22%20cy=%22110%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22136%22%20cy=%22981%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22437%22%20cy=%22214%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22768%22%20cy=%22725%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22149%22%20cy=%22579%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22689%22%20cy=%2289%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%2231%22%20cy=%22987%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22275%22%20cy=%22252%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22122%22%20cy=%22476%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221396%22%20cy=%22572%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221042%22%20cy=%22195%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221318%22%20cy=%22392%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22861%22%20cy=%22217%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221213%22%20cy=%22311%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22383%22%20cy=%22403%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%2286%22%20cy=%22149%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22528%22%20cy=%229%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22606%22%20cy=%22395%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22184%22%20cy=%22213%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%2231%22%20cy=%22615%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221274%22%20cy=%22464%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221176%22%20cy=%22138%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221284%22%20cy=%22157%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221250%22%20cy=%22255%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221514%22%20cy=%22644%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221406%22%20cy=%22972%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221236%22%20cy=%2280%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22212%22%20cy=%22111%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22488%22%20cy=%22757%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22861%22%20cy=%22843%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22600%22%20cy=%22532%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22258%22%20cy=%22233%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22573%22%20cy=%22217%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22141%22%20cy=%22275%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22510%22%20cy=%2261%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22577%22%20cy=%22377%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22188%22%20cy=%22370%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22677%22%20cy=%22672%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221208%22%20cy=%2235%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22732%22%20cy=%22717%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%2243%22%20cy=%22612%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22137%22%20cy=%22748%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22279%22%20cy=%2274%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221118%22%20cy=%22376%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22699%22%20cy=%22360%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22159%22%20cy=%22892%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221023%22%20cy=%22586%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22776%22%20cy=%22596%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22164%22%20cy=%2292%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22852%22%20cy=%22745%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221505%22%20cy=%22710%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22902%22%20cy=%22473%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221062%22%20cy=%22768%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22635%22%20cy=%22615%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%2245%22%20cy=%22235%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221597%22%20cy=%22629%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%2223%22%20cy=%22376%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221388%22%20cy=%22626%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221543%22%20cy=%22927%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221020%22%20cy=%22913%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22828%22%20cy=%22681%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221298%22%20cy=%22441%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22787%22%20cy=%22224%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22429%22%20cy=%22139%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22718%22%20cy=%22857%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22566%22%20cy=%22841%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22922%22%20cy=%22482%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22847%22%20cy=%22391%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221376%22%20cy=%22322%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22656%22%20cy=%2276%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221244%22%20cy=%2242%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22632%22%20cy=%22664%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221312%22%20cy=%22139%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22388%22%20cy=%2225%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221595%22%20cy=%22144%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22914%22%20cy=%22111%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22159%22%20cy=%22700%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22973%22%20cy=%22262%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221546%22%20cy=%22483%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22366%22%20cy=%22231%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221105%22%20cy=%22714%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22805%22%20cy=%22869%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22840%22%20cy=%22954%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22922%22%20cy=%22464%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22771%22%20cy=%22563%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22949%22%20cy=%22334%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221478%22%20cy=%22886%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22496%22%20cy=%22921%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22634%22%20cy=%22549%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221471%22%20cy=%22876%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221033%22%20cy=%2284%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22700%22%20cy=%22563%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22998%22%20cy=%22941%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22131%22%20cy=%22439%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221091%22%20cy=%22343%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22304%22%20cy=%22528%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221008%22%20cy=%22592%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22899%22%20cy=%22539%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221492%22%20cy=%22575%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22638%22%20cy=%22687%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22623%22%20cy=%22871%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221173%22%20cy=%22509%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221097%22%20cy=%22117%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221239%22%20cy=%22386%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221056%22%20cy=%22939%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221005%22%20cy=%2295%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221103%22%20cy=%22469%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22551%22%20cy=%22252%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22260%22%20cy=%22347%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221075%22%20cy=%22324%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22859%22%20cy=%22632%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22265%22%20cy=%22718%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22397%22%20cy=%22159%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221407%22%20cy=%22290%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22500%22%20cy=%22634%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221023%22%20cy=%22748%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221045%22%20cy=%22638%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221436%22%20cy=%22543%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22769%22%20cy=%22648%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221102%22%20cy=%22209%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221084%22%20cy=%22221%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22476%22%20cy=%22936%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22646%22%20cy=%22617%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22446%22%20cy=%22796%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22274%22%20cy=%22910%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221488%22%20cy=%2290%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22198%22%20cy=%22445%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22410%22%20cy=%22412%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22411%22%20cy=%22583%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22236%22%20cy=%22721%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221029%22%20cy=%22702%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22987%22%20cy=%22108%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221560%22%20cy=%22564%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22300%22%20cy=%22194%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22417%22%20cy=%22176%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221378%22%20cy=%2297%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22275%22%20cy=%22974%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221566%22%20cy=%2299%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22956%22%20cy=%22436%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22880%22%20cy=%22215%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%2227%22%20cy=%22649%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22371%22%20cy=%22417%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221514%22%20cy=%22379%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221238%22%20cy=%22169%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22662%22%20cy=%22914%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221166%22%20cy=%22613%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221561%22%20cy=%22264%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221524%22%20cy=%22760%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22272%22%20cy=%22918%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221571%22%20cy=%22442%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22423%22%20cy=%22739%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22699%22%20cy=%22308%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%2221%22%20cy=%22909%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22475%22%20cy=%22279%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22442%22%20cy=%22675%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221091%22%20cy=%2278%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221315%22%20cy=%22218%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221177%22%20cy=%2223%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221513%22%20cy=%22242%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22822%22%20cy=%22516%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221327%22%20cy=%22384%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22529%22%20cy=%22256%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221126%22%20cy=%22553%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221066%22%20cy=%22581%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221320%22%20cy=%2278%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22791%22%20cy=%22952%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22966%22%20cy=%22993%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221109%22%20cy=%22625%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22879%22%20cy=%22967%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22582%22%20cy=%22539%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22748%22%20cy=%22543%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221341%22%20cy=%22276%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221359%22%20cy=%22733%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%2228%22%20cy=%22791%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221296%22%20cy=%22160%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22108%22%20cy=%22919%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22102%22%20cy=%22595%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22458%22%20cy=%22439%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221547%22%20cy=%22249%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221480%22%20cy=%22931%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22502%22%20cy=%22618%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221278%22%20cy=%22427%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%22417%22%20cy=%22881%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221081%22%20cy=%22158%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22906%22%20cy=%22143%22%20r=%221.7%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%221230%22%20cy=%22268%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.95%22/%3E%3Ccircle%20cx=%22745%22%20cy=%22796%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22594%22%20cy=%22751%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22985%22%20cy=%22116%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%221039%22%20cy=%22639%22%20r=%221.3%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22556%22%20cy=%22624%22%20r=%222.2%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%221296%22%20cy=%22285%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.6%22/%3E%3Ccircle%20cx=%22509%22%20cy=%22514%22%20r=%221%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.45%22/%3E%3Ccircle%20cx=%221286%22%20cy=%2262%22%20r=%220.8%22%20fill=%22%23F1EEFF%22%20fill-opacity=%220.8%22/%3E%3Ccircle%20cx=%22531%22%20cy=%22435%22%20r=%221.6%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22209%22%20cy=%22227%22%20r=%222.8%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22148%22%20cy=%22773%22%20r=%221.6%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221127%22%20cy=%22240%22%20r=%222.8%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22991%22%20cy=%22490%22%20r=%222.2%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22692%22%20cy=%22351%22%20r=%222.2%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22152%22%20cy=%22821%22%20r=%221.6%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221277%22%20cy=%22858%22%20r=%221.6%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22869%22%20cy=%22765%22%20r=%222.2%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22308%22%20cy=%22377%22%20r=%221.6%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22595%22%20cy=%22561%22%20r=%222.8%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22875%22%20cy=%22669%22%20r=%222.2%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22946%22%20cy=%22896%22%20r=%222.2%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221113%22%20cy=%2285%22%20r=%222.2%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221403%22%20cy=%22474%22%20r=%222.2%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22155%22%20cy=%22317%22%20r=%221.6%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221423%22%20cy=%22311%22%20r=%222.2%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22579%22%20cy=%22902%22%20r=%221.6%22%20fill=%22%23B7ADFF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22732%22%20cy=%22673%22%20r=%222.8%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22750%22%20cy=%22928%22%20r=%221.6%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%221452%22%20cy=%22451%22%20r=%222.8%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3Ccircle%20cx=%22897%22%20cy=%22542%22%20r=%222.2%22%20fill=%22%234FA3FF%22%20fill-opacity=%220.7%22/%3E%3C/svg%3E");
  background-size: 1600px 1000px; background-repeat: repeat;
  opacity: .85; mix-blend-mode: screen;
}
.section--alt, .card__media, .coll-card, .visit, .form-wrap, .gallery__main, .story__media { background-color: rgba(18, 18, 22, .78); }
.site-header { background-color: rgba(11, 11, 14, .92); }
.mnav { background-color: rgba(11, 11, 14, .98); }
.drawer { background-color: rgba(18, 18, 22, .98); }
@media (prefers-reduced-motion: no-preference) {
  .js body::after { animation: kv-twinkle 9s ease-in-out infinite alternate; }
  @keyframes kv-twinkle { from { opacity: .6; } to { opacity: 1; } }
}
/* verloop als dunne lijn onder secties en op focus */
:focus-visible { outline: 2px solid var(--acc-2); outline-offset: 3px; }