/* Static-site additions on top of the original Astroid/SP Page Builder styles */

/* ---------- Glass navbar once the page is scrolled ---------- */
.astroid-header-section.fixed-top {
  transition: background-color .3s ease, box-shadow .3s ease, border-color .3s ease,
              -webkit-backdrop-filter .3s ease, backdrop-filter .3s ease;
}
html.is-scrolled .astroid-header-section.fixed-top {
  background-color: rgba(255, 255, 255, .72) !important;
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  backdrop-filter: blur(16px) saturate(180%);
  border-bottom-color: rgba(255, 255, 255, .55) !important;
  box-shadow: 0 6px 24px rgba(44, 46, 54, .08) !important;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html.is-scrolled .astroid-header-section.fixed-top { background-color: rgba(255, 255, 255, .95) !important; }
}

/* ---------- A bit more room under the navbar on pages without a hero image ---------- */
body.no-hero .astroid-component-section { padding-top: 40px !important; }

/* ---------- Footer: copyright + Webjongens credit ---------- */
/* the copyright row used to sit on white behind the fixed "Snel aan de slag?" bar:
   continue the dark footer and keep the row clear of that bar */
.sp-page-builder .page-content .sppb-section.copy,
.sppb-section.copy { background-color: #3c3141; padding: 8px 16px calc(var(--bottom-bar, 0px) + 8px) !important; }
.sppb-section.copy .site-footer__credits, .sppb-section.copy .credit { line-height: 1.5; }
.site-footer__credits {
  display: flex; flex-direction: column; align-items: center; gap: .25rem;
  text-align: center;
}
.site-footer__credits p { margin: 0; }

.credit { --credit-heart: #86738f;
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem; white-space: nowrap; }
.sppb-section.copy .site-footer__credits .credit__link {
  display: inline-flex; align-items: center; gap: .35rem;
  color: #fff; text-decoration: none; letter-spacing: .02em; }
.credit__link strong { font-weight: 700; }
.sppb-section.copy .credit__link span { text-decoration: none; }
.sppb-section.copy .credit__link:hover span { text-decoration: underline; text-underline-offset: .2em; }
.credit__link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 4px; }
.credit__heart { width: 1.1rem; height: 1.1rem; fill: var(--credit-heart);
  transition: transform 200ms cubic-bezier(.16, 1, .3, 1); }
.credit__link:hover .credit__heart { transform: scale(1.2); }
.sppb-section.copy .credit__typed { display: inline-flex; align-items: center; gap: .4rem; min-width: 5em;
  color: rgba(255, 255, 255, .72); }
.credit__cursor { display: inline-block; width: 2px; height: 1.1em; margin-left: 1px;
  background: currentColor; animation: credit-blink 1s step-end infinite; }
@keyframes credit-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .credit__cursor { animation: none; }
  .credit__heart, .astroid-header-section.fixed-top { transition: none; }
}

/* ---------- "Daag ons uit" contact icons: hover lift ---------- */
.iconsfooter .sppb-addon-single-image-container a {
  display: inline-block; border-radius: 50%;
  transition: transform .25s cubic-bezier(.16, 1, .3, 1), box-shadow .25s ease, filter .25s ease;
}
.iconsfooter .sppb-addon-single-image-container a:hover,
.iconsfooter .sppb-addon-single-image-container a:focus-visible {
  transform: translateY(-4px) scale(1.08);
  box-shadow: 0 10px 22px rgba(31, 20, 36, .35);
  filter: brightness(1.06);
}
.iconsfooter .sppb-addon-single-image-container a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .iconsfooter .sppb-addon-single-image-container a { transition: none; }
  .iconsfooter .sppb-addon-single-image-container a:hover { transform: none; }
}

/* ---------- Footer address row: centred on mobile only ---------- */
@media (max-width: 767px) {
  .adres .sppb-addon-text-block ul,
  .adres ul { display: block; width: 100%; }
  .adres ul li { float: none; display: block; text-align: center; padding: 0 16px; }
}

/* ---------- Contact details block (replaces the old forms) ---------- */
.contactgegevens a { transition: color .2s ease; }
.contactgegevens a:hover,
.contactgegevens a:focus-visible { color: #86738f !important; }