/* Header: aankondigingsbalk, logo en hoofdnavigatie. Kleuren uit de --ws-* tokens (design-system.css, logo-palet). */
.wpstart-site-header{position:relative;z-index:10;overflow:visible;background:var(--ws-bg-2);border-bottom:0;box-shadow:none;backdrop-filter:none}
.wpstart-site-header:after{height:2px;bottom:0;background:linear-gradient(90deg,var(--ws-logo-navy),var(--ws-logo-blue) 50%,var(--ws-logo-cyan))}

/* Aankondigingsbalk: rustig doorlopende ticker (oorspronkelijke beweging), 15px, pauzeert bij hover/focus */
.wph-topbar{background:var(--ws-bg-0);border-bottom:1px solid var(--ws-brand-line);padding:0}
.wph-topbar__in{display:flex;align-items:center;justify-content:space-between;gap:8px 24px;width:min(var(--wp-container,1360px),calc(100% - 2*var(--wp-gutter,24px)));min-height:44px;margin:0 auto}
.wph-ticker{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.wph-ticker__track{display:flex;width:max-content;animation:wphTicker 55s linear infinite;will-change:transform}
.wph-ticker:hover .wph-ticker__track,.wph-ticker:focus-within .wph-ticker__track{animation-play-state:paused}
.wph-ticker__list{display:flex;flex:none;align-items:center;min-width:100%;margin:0;padding:0;list-style:none}
@keyframes wphTicker{to{transform:translateX(-50%)}}
.wph-tk{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 26px 0 0;color:#e5edfa;font-size:.9375rem;font-weight:600;line-height:1.3;white-space:nowrap}
.wph-tk:after{content:"";width:1px;height:16px;margin-left:26px;background:rgba(255,255,255,.25)}
.wph-tk--hot{color:#ff8a96}
.wph-tk a{display:inline-flex;align-items:center;min-height:44px;color:inherit;font-weight:700;text-decoration:none;border-radius:6px}
.wph-tk--hot a{text-transform:uppercase;letter-spacing:.04em}
.wph-tk a:hover,.wph-topbar__contact a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.wph-topbar__contact{flex:none}
.wph-topbar__contact a{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ws-logo-cyan);font-size:.9375rem;font-weight:700;line-height:1.3;text-decoration:none;border-radius:6px;white-space:nowrap}
.wph-wa{display:block;flex:none;width:20px;height:20px}
.wph-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wph-topbar a:focus-visible,.wpstart-site-header .wpstart-menu a:focus-visible,.wpstart-site-header .wpstart-brand:focus-visible,.wpstart-site-header .wpstart-menu-toggle:focus-visible{outline:3px solid var(--ws-logo-cyan);outline-offset:3px}

/* Logo: vaste breedte, hoogte volgt de beeldverhouding (420x153), nooit uitgerekt */
.wpstart-site-header .wpstart-nav{position:relative;width:min(var(--wp-container,1360px),calc(100% - 2*var(--wp-gutter,24px)));min-height:104px;gap:32px}
.wpstart-site-header .wpstart-brand{width:240px;max-width:none;flex:0 0 240px;padding:8px 0;border-radius:8px}
.wpstart-site-header .wpstart-brand img{width:100%;height:auto;display:block;object-fit:contain}

/* Desktopnavigatie */
.wpstart-site-header .wpstart-menu{display:flex;align-items:center;gap:28px;margin-left:auto}
.wpstart-site-header .wpstart-nav .wpstart-menu>a:not(.wpstart-button):not(.wph-emergency){position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 2px;color:#eaf1ff;font-size:1rem;font-weight:600;line-height:1.3;text-decoration:none;white-space:nowrap;border-radius:6px;transition:color .18s ease}
.wpstart-site-header .wpstart-nav .wpstart-menu>a:not(.wpstart-button):not(.wph-emergency):hover{color:var(--ws-logo-cyan)}
.wpstart-site-header .wpstart-nav .wpstart-menu>a[aria-current="page"]:not(.wpstart-button){color:#fff}
.wpstart-site-header .wpstart-nav .wpstart-menu>a[aria-current="page"]:not(.wpstart-button):after{content:"";position:absolute;left:0;right:0;bottom:2px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--ws-logo-blue),var(--ws-logo-cyan));box-shadow:none}
/* knoppen: gelijke hoogte en afronding. Spoedhulp = urgent (rood, omlijnd), contact = primaire CTA (logoblauw) */
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wph-emergency,.wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;font-size:.9375rem;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;animation:none;transition:background .18s ease,box-shadow .18s ease,border-color .18s ease}
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wph-emergency{background:rgba(255,51,68,.12);border:1.5px solid rgba(255,51,68,.65);color:#ff8a96!important}
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wph-emergency:hover{background:rgba(255,51,68,.24);border-color:#ff5566;box-shadow:none;transform:none}
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button{border:0;background:var(--ws-cta);color:#fff!important;box-shadow:0 6px 18px rgba(0,68,212,.35);filter:none;transform:none}
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button:hover{box-shadow:0 0 0 2px var(--ws-logo-cyan),0 6px 18px rgba(0,68,212,.35);filter:none;transform:none}
.wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button[aria-current="page"]{box-shadow:0 0 0 2px var(--ws-logo-cyan)}
.wpstart-site-header .wpstart-menu-toggle{display:none}

/* Laptop en kleiner: logo iets kleiner, topbar toont minder items */
@media(max-width:1280px){
  .wpstart-site-header .wpstart-nav{min-height:88px;gap:16px}
  .wpstart-site-header .wpstart-brand{width:200px;flex-basis:200px}
  .wpstart-site-header .wpstart-menu-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;margin-left:auto;padding:0 18px;border:1px solid var(--ws-brand-line);border-radius:12px;background:var(--ws-card);color:#fff;font-size:1rem;font-weight:700;cursor:pointer}
  .wpstart-site-header .wpstart-menu-toggle[aria-expanded="true"]{border-color:var(--ws-logo-cyan)}
  .wpstart-site-header .wpstart-menu{display:none;margin:0}
  .wpstart-site-header .wpstart-menu.is-open{display:flex;flex-direction:column;align-items:stretch;gap:4px;position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;padding:12px;background:var(--ws-card);border:1px solid var(--ws-brand-line);border-radius:16px;box-shadow:0 24px 48px rgba(0,0,0,.5)}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a:not(.wpstart-button):not(.wph-emergency){min-height:48px;padding:0 16px;font-size:1.0625rem;border-radius:10px}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a:not(.wpstart-button):not(.wph-emergency):hover{background:rgba(8,208,248,.1)}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a[aria-current="page"]:not(.wpstart-button){background:rgba(8,120,248,.22)}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a[aria-current="page"]:not(.wpstart-button):after{display:none}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a.wph-emergency,.wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button{width:100%;min-height:52px;margin-top:8px;font-size:1rem}
  .wpstart-site-header .wpstart-nav .wpstart-menu>a.wpstart-button{margin-top:4px}
}
@media(max-width:640px){
  .wph-topbar__in{justify-content:space-between;gap:8px 12px}
  .wph-tk{font-size:.875rem}.wph-tk a,.wph-topbar__contact a{font-size:.875rem}
  .wph-wa-pre{display:none}
  .wpstart-site-header .wpstart-nav{min-height:80px;width:calc(100% - 2*var(--wp-gutter,16px))}
  .wpstart-site-header .wpstart-brand{width:168px;flex-basis:168px}
}
@media(prefers-reduced-motion:reduce){.wph-ticker{-webkit-mask-image:none;mask-image:none}.wph-ticker__track{animation:none;flex-wrap:wrap;width:auto}.wph-ticker__list{flex-wrap:wrap}.wph-ticker__dup{display:none}}
