::selection { background:#D4A937; color:#0A142E; }
  body { -webkit-font-smoothing: antialiased; }

  /* ——— Focus (toetsenbord) ——— */
  :focus-visible { outline: 2px solid #E2B94F; outline-offset: 3px; border-radius: 4px; }

  /* ——— Fijne grid-achtergrond (hero) ——— */
  .bg-grid {
    background-image:
      linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 54px 54px;
  }

  /* ——— Glansboog: sheen-sweep op gouden knoppen ——— */
  .sheen { position: relative; overflow: hidden; isolation: isolate; }
  .sheen::after {
    content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
    background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.55) 50%, transparent 62%);
    transform: translateX(-130%);
    transition: transform .8s cubic-bezier(.4,0,.2,1);
  }
  .sheen:hover::after, .sheen:focus-visible::after { transform: translateX(130%); }
  @keyframes sheenSweep {
    0% { transform: translateX(-130%); } 14% { transform: translateX(130%); } 100% { transform: translateX(130%); }
  }
  .sheen-auto::after { animation: sheenSweep 7s ease-in-out 2s infinite; }

  /* ——— Orbitale boog (uit het logo) ——— */
  @keyframes orbit { to { transform: rotate(360deg); } }
  .orbit { animation: orbit 110s linear infinite; transform-origin: center; }
  @keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
  .float-slow { animation: floaty 7s ease-in-out infinite; }

  /* ——— Navigatie: actieve onderlijn ——— */
  .nav-link { position: relative; transition: color .25s ease; }
  .nav-link::after {
    content:''; position:absolute; left:0; right:100%; bottom:-7px; height:2px; border-radius:2px;
    background: linear-gradient(90deg,#EDCB6F,#B68A24);
    transition: right .3s ease;
  }
  .nav-link:hover::after, .nav-link.active::after { right:0; }
  .nav-link.active { color:#EDCB6F; }

  /* ——— Scroll-reveal ——— */
  .reveal { opacity:0; transform: translateY(26px); }
  .reveal.in {
    opacity:1; transform:none;
    transition: opacity .7s ease, transform .7s ease;
    transition-delay: var(--d, 0ms);
  }

  /* ——— FAQ accordeon ——— */
  .faq-a { display:grid; grid-template-rows: 0fr; transition: grid-template-rows .45s cubic-bezier(.4,0,.2,1); }
  .faq-item.open .faq-a { grid-template-rows: 1fr; }
  .faq-a > div { overflow: hidden; }
  .faq-icon { transition: transform .35s ease; }
  .faq-item.open .faq-icon { transform: rotate(45deg); }

  /* ——— Formuliervelden ——— */
  .field {
    width:100%; border-radius: .8rem; border:1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05); color:#fff; padding:.85rem 1rem;
    transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .field::placeholder { color: rgba(201,207,218,.45); }
  .field:focus { outline:none; border-color:#E2B94F; box-shadow:0 0 0 3px rgba(212,169,55,.16); background: rgba(255,255,255,.07); }
  .field.ok  { border-color: rgba(52,211,153,.75); }
  .field.err { border-color: rgba(248,113,113,.85); }
  select.field { appearance:none; -webkit-appearance:none; padding-right:2.8rem;
    background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%23C9CFDA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>');
    background-repeat:no-repeat; background-position:right 1rem center;
  }
  select.field option { color:#0A142E; background:#F4F6FA; }
  .err-msg { display:none; }
  .err-msg.show { display:block; }

  /* ——— Bewegingsreductie ——— */
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .orbit, .float-slow, .sheen-auto::after { animation: none !important; }
    .sheen::after { display:none; }
    .reveal { opacity:1 !important; transform:none !important; transition:none !important; }
    * { transition-duration: .01ms !important; }
  }

  /* ——— Taalknoppen ——— */
  .lang-btn.active { background:linear-gradient(90deg,#EDCB6F,#B68A24); color:#0A142E; }

  /* ——— Zwevende actieknoppen (WhatsApp/Bellen) ——— */
  .fab { box-shadow: 0 12px 30px -8px rgba(0,0,0,.45); transition: transform .25s ease; }
  .fab:hover { transform: translateY(-3px); }
  @media (prefers-reduced-motion: reduce) { .fab:hover { transform:none; } }