/* pilatesstudio-footer 1.0.0 · vanilla port van 21st.dev @kedhareswer/beam-wordmark-footer. De scoped stylesheet
   van de bron (.bwf) staat hier onder de moduleroot; de rgba(var(--bwf-acc), a)-kleuren zijn color-mix met de
   --m-*-tokens (achtergrond --m-ink, tekst en lichtbaan --m-bg, woordmerk van --m-muted naar --m-ink). */
.msm-pilatesstudio-footer {
  --bwf-bg: var(--m-ink, #28312e);
  --bwf-ink: var(--m-bg, #ece9e1);
  --bwf-muted: color-mix(in srgb, var(--m-bg, #ece9e1) 68%, transparent);
  --bwf-acc: var(--m-bg, #ece9e1);
  --bwf-lit: var(--m-bg, #ece9e1);
  --bwf-bright: var(--m-surface, #fbfaf6);
  --bwf-wt: var(--m-muted, #69716d);
  --bwf-wf: var(--m-ink, #28312e);
  --bwf-ang: 118deg;
  --bwf-b: 58%;
  --bwf-px: 50%;
  --bwf-py: 50%;
  --bwf-g: 0;
  --bwf-top: 0px;
  --bwf-bot: 100%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  container-type: inline-size;
  background: var(--bwf-bg);
  color: var(--bwf-ink);
  font-family: var(--m-font-body, 'Albert Sans', ui-sans-serif, system-ui, sans-serif);
  -webkit-font-smoothing: antialiased;
  touch-action: pan-y;
}
.msm-pilatesstudio-footer *,
.msm-pilatesstudio-footer *::before,
.msm-pilatesstudio-footer *::after { box-sizing: border-box; }
.msm-pilatesstudio-footer :where(a) { color: inherit; text-decoration: none; }
.msm-pilatesstudio-footer :where(ul) { list-style: none; margin: 0; padding: 0; }
.msm-pilatesstudio-footer :where(p) { margin: 0; }
.msm-pilatesstudio-footer svg { max-width: none; display: block; }
.msm-pilatesstudio-footer .bwf-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* Bovenrand: een haarlijn in de accentkleur, helderder waar de baan hem kruist. */
.msm-pilatesstudio-footer .bwf-rule {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 3;
  height: 1px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--bwf-acc) 15%, transparent), color-mix(in srgb, var(--bwf-acc) 55%, transparent) var(--bwf-b), color-mix(in srgb, var(--bwf-acc) 15%, transparent));
}
/* Achtergrond: wash, verticale banen, de baan, een zachtere tweede baan, de aanwijzergloed en korrel. */
.msm-pilatesstudio-footer .bwf-sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.msm-pilatesstudio-footer .bwf-wash {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 90% at 8% 0%, color-mix(in srgb, var(--bwf-acc) 20%, transparent), transparent 55%),
    radial-gradient(90% 70% at 92% 8%, color-mix(in srgb, var(--bwf-acc) 14%, transparent), transparent 60%),
    linear-gradient(180deg, color-mix(in srgb, var(--bwf-acc) 6%, transparent), transparent 70%);
}
.msm-pilatesstudio-footer .bwf-bands {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, color-mix(in srgb, var(--bwf-acc) 5%, transparent) 0 1.6cqw, transparent 1.6cqw 4.2cqw);
  -webkit-mask-image: linear-gradient(100deg, #000 0%, transparent 55%);
  mask-image: linear-gradient(100deg, #000 0%, transparent 55%);
  opacity: 0.9;
}
.msm-pilatesstudio-footer .bwf-beam {
  position: absolute;
  inset: 0;
  filter: blur(calc(1px + 1.6cqw));
  background:
    linear-gradient(var(--bwf-ang), transparent calc(var(--bwf-b) - 11%), color-mix(in srgb, var(--bwf-acc) 10%, transparent) calc(var(--bwf-b) - 5%), color-mix(in srgb, var(--bwf-acc) 34%, transparent) var(--bwf-b), color-mix(in srgb, var(--bwf-acc) 8%, transparent) calc(var(--bwf-b) + 4%), transparent calc(var(--bwf-b) + 9%)),
    linear-gradient(var(--bwf-ang), transparent calc(var(--bwf-b) - 34%), color-mix(in srgb, var(--bwf-acc) 10%, transparent) calc(var(--bwf-b) - 27%), transparent calc(var(--bwf-b) - 20%));
}
.msm-pilatesstudio-footer .bwf-glow {
  position: absolute;
  inset: 0;
  opacity: var(--bwf-g);
  background: radial-gradient(circle 26cqw at var(--bwf-px) var(--bwf-py), color-mix(in srgb, var(--bwf-acc) 16%, transparent), transparent 70%);
}
.msm-pilatesstudio-footer .bwf-grain {
  position: absolute;
  inset: 0;
  opacity: 0.14;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
/* Raster van drie kolommen (1,62fr, 0,86fr, 0,86fr). */
.msm-pilatesstudio-footer .bwf-inner {
  position: relative;
  z-index: 2;
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(48px, 8.5cqw, 104px) clamp(20px, 6cqw, 88px) 0;
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(0, 0.86fr) minmax(0, 0.86fr);
  column-gap: clamp(24px, 4cqw, 48px);
  row-gap: 44px;
}
.msm-pilatesstudio-footer .bwf-label {
  position: relative;
  display: block;
  padding-bottom: 13px;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--bwf-acc);
}
.msm-pilatesstudio-footer .bwf-label::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--bwf-acc) 55%, transparent), color-mix(in srgb, var(--bwf-acc) 28%, transparent));
  transform-origin: 0 50%;
  transform: scaleX(var(--bwf-line, 1));
  transition: transform 1.1s cubic-bezier(0.2, 0.7, 0.1, 1) var(--bwf-d, 0ms);
}
.msm-pilatesstudio-footer[data-in='false'] .bwf-label::after { --bwf-line: 0; }
.msm-pilatesstudio-footer .bwf-col { min-width: 0; }
.msm-pilatesstudio-footer .bwf-col:nth-child(1) { max-width: 420px; }
.msm-pilatesstudio-footer .bwf-fade {
  transition: opacity 0.9s ease var(--bwf-d, 0ms), translate 0.9s cubic-bezier(0.2, 0.7, 0.1, 1) var(--bwf-d, 0ms);
}
.msm-pilatesstudio-footer[data-in='false'] .bwf-fade { opacity: 0; translate: 0 14px; }
/* Drie vierkante glazen knoppen met een verlichte bovenrand, naar eigen secties. */
.msm-pilatesstudio-footer .bwf-socials { display: flex; gap: 16px; margin-top: 13px; }
.msm-pilatesstudio-footer .bwf-soc {
  position: relative;
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 5px;
  color: color-mix(in srgb, var(--bwf-ink) 62%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--bwf-ink) 9%, transparent), color-mix(in srgb, var(--bwf-ink) 2.5%, transparent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bwf-ink) 16%, transparent), inset 0 1px 0 color-mix(in srgb, var(--bwf-ink) 14%, transparent), 0 6px 14px -8px rgba(0, 0, 0, 0.8);
  transition: color 0.25s, box-shadow 0.35s, translate 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), background 0.35s;
}
.msm-pilatesstudio-footer .bwf-soc svg { width: 17px; height: 17px; }
.msm-pilatesstudio-footer .bwf-soc:hover,
.msm-pilatesstudio-footer .bwf-soc:focus-visible {
  color: var(--bwf-ink);
  translate: 0 -2px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--bwf-acc) 32%, transparent), color-mix(in srgb, var(--bwf-acc) 8%, transparent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bwf-acc) 75%, transparent), inset 0 1px 0 color-mix(in srgb, var(--bwf-ink) 30%, transparent), 0 10px 26px -8px color-mix(in srgb, var(--bwf-acc) 75%, transparent);
}
.msm-pilatesstudio-footer .bwf-soc:focus-visible { outline: none; }
.msm-pilatesstudio-footer .bwf-tip {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: calc(100% + 9px);
  translate: -50% -4px;
  padding: 6px 8px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--bwf-acc) 95%, transparent);
  color: var(--bwf-bg);
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s, translate 0.25s;
}
.msm-pilatesstudio-footer .bwf-tip::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 100%;
  margin-left: -4px;
  border: 4px solid transparent;
  border-bottom-color: color-mix(in srgb, var(--bwf-acc) 95%, transparent);
}
.msm-pilatesstudio-footer .bwf-soc:hover .bwf-tip,
.msm-pilatesstudio-footer .bwf-soc:focus-visible .bwf-tip { opacity: 1; translate: -50% 0; }
.msm-pilatesstudio-footer .bwf-credits { margin-top: 21px; font-size: 14px; line-height: 1.5; color: var(--bwf-muted); }
.msm-pilatesstudio-footer .bwf-credits p + p { margin-top: 2px; }
.msm-pilatesstudio-footer .bwf-credits b { font-weight: 400; color: var(--bwf-ink); }
/* Linkkolommen: links schuiven 12 px op met een streepje van 6 px en een pijl. */
.msm-pilatesstudio-footer .bwf-links { margin-top: 13px; display: flex; flex-direction: column; gap: 0; }
.msm-pilatesstudio-footer .bwf-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 14.5px;
  line-height: 21px;
  color: color-mix(in srgb, var(--bwf-ink) 78%, transparent);
  transition: color 0.25s;
}
.msm-pilatesstudio-footer .bwf-link-t { display: inline-block; transition: translate 0.35s cubic-bezier(0.2, 0.8, 0.2, 1); }
.msm-pilatesstudio-footer .bwf-link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 6px;
  height: 1px;
  background: var(--bwf-acc);
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.msm-pilatesstudio-footer .bwf-link svg {
  width: 12px;
  height: 12px;
  opacity: 0;
  translate: -6px 0;
  color: var(--bwf-acc);
  transition: opacity 0.25s, translate 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.msm-pilatesstudio-footer .bwf-link:hover,
.msm-pilatesstudio-footer .bwf-link:focus-visible { color: var(--bwf-bright); outline: none; }
.msm-pilatesstudio-footer .bwf-link:hover::before,
.msm-pilatesstudio-footer .bwf-link:focus-visible::before { transform: scaleX(1); }
.msm-pilatesstudio-footer .bwf-link:hover .bwf-link-t,
.msm-pilatesstudio-footer .bwf-link:focus-visible .bwf-link-t { translate: 12px 0; }
.msm-pilatesstudio-footer .bwf-link:hover svg,
.msm-pilatesstudio-footer .bwf-link:focus-visible svg { opacity: 1; translate: 10px 0; }
.msm-pilatesstudio-footer .bwf-link:focus-visible .bwf-link-t {
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: color-mix(in srgb, var(--bwf-acc) 80%, transparent);
}
/* Het woordmerk: elke letter tekent de achtergrond op sectiemaat, terug geschoven met zijn eigen positie, zodat
   baan en gloed precies op de achtergrond aansluiten. */
.msm-pilatesstudio-footer .bwf-word {
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-top: clamp(28px, 7cqw, 96px);
  height: calc(0.94 * 22cqw);
}
.msm-pilatesstudio-footer .bwf-word-box { max-width: 1120px; margin: 0 auto; padding: 0 clamp(20px, 6cqw, 88px); }
.msm-pilatesstudio-footer .bwf-word-in {
  display: inline-flex;
  white-space: nowrap;
  font-family: var(--m-font-display, 'Marcellus', ui-serif, Georgia, serif);
  font-size: 22cqw;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
  user-select: none;
  -webkit-user-select: none;
}
.msm-pilatesstudio-footer .bwf-lw {
  display: inline-block;
  translate: 0 0;
  transition: translate 1.25s cubic-bezier(0.16, 0.84, 0.2, 1) var(--bwf-d, 0ms);
}
.msm-pilatesstudio-footer[data-in='false'] .bwf-lw { translate: 0 85%; }
.msm-pilatesstudio-footer .bwf-l {
  display: inline-block;
  cursor: pointer;
  color: var(--bwf-wt);
  transform-origin: 50% 100%;
  transition: transform 0.5s cubic-bezier(0.2, 0.9, 0.25, 1.2), filter 0.4s;
}
.msm-pilatesstudio-footer.is-lit .bwf-l {
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  background-repeat: no-repeat;
  background-size: var(--bwf-rw) var(--bwf-rh);
  background-position: calc(var(--bwf-x) * -1) calc(var(--bwf-y) * -1);
  background-image:
    radial-gradient(circle 22cqw at var(--bwf-px) var(--bwf-py), color-mix(in srgb, var(--bwf-lit) calc(var(--bwf-g) * 85%), transparent), transparent 70%),
    linear-gradient(var(--bwf-ang), transparent calc(var(--bwf-b) - 9%), color-mix(in srgb, var(--bwf-lit) 55%, transparent) calc(var(--bwf-b) - 1.5%), color-mix(in srgb, var(--bwf-lit) 70%, transparent) var(--bwf-b), color-mix(in srgb, var(--bwf-lit) 20%, transparent) calc(var(--bwf-b) + 3.5%), transparent calc(var(--bwf-b) + 8%)),
    linear-gradient(180deg, var(--bwf-wt) var(--bwf-top), var(--bwf-wf) var(--bwf-bot));
}
.msm-pilatesstudio-footer .bwf-l:hover { transform: translateY(-0.045em); filter: brightness(1.35) saturate(1.1); }
.msm-pilatesstudio-footer .bwf-l.is-hop { animation: bwf-hop 0.75s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes bwf-hop {
  0% { transform: translateY(0) scale(1, 1); }
  18% { transform: translateY(0.02em) scale(1.06, 0.9); }
  45% { transform: translateY(-0.14em) scale(0.97, 1.05); }
  70% { transform: translateY(0.01em) scale(1.02, 0.97); }
  100% { transform: translateY(-0.045em) scale(1, 1); }
}
/* De voet zakt weg in het donker. */
.msm-pilatesstudio-footer .bwf-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  height: 34%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--bwf-bg) 55%, transparent) 55%, var(--bwf-bg));
}
@container (max-width: 760px) {
  .msm-pilatesstudio-footer .bwf-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 40px; }
  .msm-pilatesstudio-footer .bwf-col:nth-child(1) { grid-column: 1 / -1; max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .msm-pilatesstudio-footer .bwf-lw,
  .msm-pilatesstudio-footer .bwf-fade,
  .msm-pilatesstudio-footer .bwf-label::after,
  .msm-pilatesstudio-footer .bwf-l,
  .msm-pilatesstudio-footer .bwf-soc,
  .msm-pilatesstudio-footer .bwf-link-t,
  .msm-pilatesstudio-footer .bwf-link svg { transition: none !important; animation: none !important; }
  .msm-pilatesstudio-footer[data-in='false'] .bwf-lw,
  .msm-pilatesstudio-footer[data-in='false'] .bwf-fade { translate: none; opacity: 1; }
  .msm-pilatesstudio-footer[data-in='false'] .bwf-label::after { --bwf-line: 1; }
}
