/* bijles-footer 1.0.0 · block-port van ReactBitsPro Blocks/footer-6 (vier kolommen met grote links en een
   donkere onderbalk). Geen scriptanimatie in de bron: alleen kleurovergangen bij hover. Kleuren via --m-*-tokens. */
.msm-bijles-footer {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: var(--m-surface, #ffffff);
  color: var(--m-ink, #14213d);
  font-family: var(--m-font-body, 'Public Sans', ui-sans-serif, system-ui, sans-serif);
}
.msm-bijles-footer,
.msm-bijles-footer *,
.msm-bijles-footer *::before,
.msm-bijles-footer *::after { box-sizing: border-box; }
.msm-bijles-footer a { color: inherit; text-decoration: none; }
.msm-bijles-footer a:focus-visible { outline: 2px solid var(--m-primary, #2445a8); outline-offset: 3px; border-radius: 2px; }

/* Bovenrij: py-20, px-4 sm:px-6 lg:px-8; grid 1, sm 2, lg 4 kolommen; gap-12 en lg gap-8 */
.msm-bijles-footer .bf-top { width: 100%; padding: 80px 16px; }
.msm-bijles-footer .bf-grid {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 48px;
}
.msm-bijles-footer .bf-col { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.msm-bijles-footer .bf-head {
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: var(--m-muted, #566079);
}
.msm-bijles-footer .bf-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.msm-bijles-footer .bf-big {
  margin: 0;
  font-family: var(--m-font-display, 'Sora', ui-sans-serif, system-ui, sans-serif);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  letter-spacing: -0.025em;
  color: var(--m-ink, #14213d);
  overflow-wrap: break-word;
  transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.msm-bijles-footer a.bf-big:hover { color: var(--m-muted, #566079); }
.msm-bijles-footer .bf-note { margin: -16px 0 0; font-size: 14px; line-height: 20px; color: var(--m-muted, #566079); }
.msm-bijles-footer .bf-hours { margin: 0; display: flex; flex-direction: column; gap: 12px; }
.msm-bijles-footer .bf-hours dt { font-size: 14px; line-height: 20px; color: var(--m-muted, #566079); }
.msm-bijles-footer .bf-hours dd { margin: 0; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--m-ink, #14213d); }

/* Onderbalk: py-10, px-4 sm:px-6 lg:px-8, donker; flex-col en vanaf md flex-row justify-between, gap-6 */
.msm-bijles-footer .bf-bar { width: 100%; padding: 40px 16px; background: var(--m-ink, #14213d); color: var(--m-surface, #ffffff); }
.msm-bijles-footer .bf-bar-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.msm-bijles-footer .bf-mark {
  margin: 0;
  font-family: var(--m-font-display, 'Sora', ui-sans-serif, system-ui, sans-serif);
  font-size: 28px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.03em;
  user-select: none;
}
.msm-bijles-footer .bf-meta { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.msm-bijles-footer .bf-copy { margin: 0; font-size: 14px; line-height: 20px; font-weight: 500; letter-spacing: -0.025em; text-align: center; }
.msm-bijles-footer .bf-legal { display: flex; align-items: center; gap: 24px; font-size: 14px; line-height: 20px; font-weight: 500; }
.msm-bijles-footer .bf-legal a { transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1); }
.msm-bijles-footer .bf-legal a:hover { color: color-mix(in srgb, var(--m-surface, #ffffff) 62%, var(--m-ink, #14213d)); }
.msm-bijles-footer .bf-bar a:focus-visible { outline-color: var(--m-accent2, #ffd34d); }
.msm-bijles-footer .bf-demo {
  max-width: 1400px;
  margin: 24px auto 0;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  color: color-mix(in srgb, var(--m-surface, #ffffff) 72%, var(--m-ink, #14213d));
  scroll-margin-bottom: 24px;
}

@media (min-width: 640px) {
  .msm-bijles-footer .bf-top,
  .msm-bijles-footer .bf-bar { padding-left: 24px; padding-right: 24px; }
  .msm-bijles-footer .bf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .msm-bijles-footer .bf-bar-inner,
  .msm-bijles-footer .bf-meta { flex-direction: row; }
  .msm-bijles-footer .bf-meta { gap: 48px; }
  .msm-bijles-footer .bf-demo { text-align: left; }
}
@media (min-width: 1024px) {
  .msm-bijles-footer .bf-top,
  .msm-bijles-footer .bf-bar { padding-left: 32px; padding-right: 32px; }
  .msm-bijles-footer .bf-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .msm-bijles-footer .bf-big,
  .msm-bijles-footer .bf-legal a { transition: none; }
}