/* VORN Nederlands — aanvullingen op het oorspronkelijke rode/zilveren/zwart ontwerp */
html { scroll-behavior: smooth; }
:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.brand-logo { width: 62px; height: 60px; object-fit: contain; flex-shrink: 0; filter: drop-shadow(0 0 12px rgba(237,41,57,.12)); }
.brand small { max-width: 89px; }
.nav-search { color: #d0d2d6; background: #191b22; border: 1px solid #353943; padding: 11px 14px; font: 800 11px/1 var(--font-body); letter-spacing: .09em; cursor: pointer; transition: background .2s, color .2s; display: inline-flex; align-items:center;gap:7px; }
.nav-search:hover { background: #34343e; color: white; }
.nav-search:first-letter { font-size: 18px; }
.mobile-nav button { color: #eee; background: #1c1d23; border: 1px solid #45464e; padding: 13px; text-align: left; cursor: pointer; font:800 11px var(--font-body); }
.hero-logo { position: relative; display: block; width: min(100%, 570px); height: auto; aspect-ratio:1254/1195; object-fit: contain; z-index: 3; filter: drop-shadow(0 22px 45px rgba(0,0,0,.4)) drop-shadow(0 0 18px rgba(242,31,43,.12)); animation: floatVorn 5.4s ease-in-out infinite; }
@keyframes floatVorn { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }
.hero-visual { isolation:isolate; }
.hero-visual .radar { position:absolute; z-index:0; opacity:.46; }
.hero-visual .radar-inner { opacity:.1; }
.hero-visual .radar-horizontal,.hero-visual .radar-vertical { z-index:1; }
.hero-visual .visual-label { z-index:5; }
.hero-content h1 { font-size: clamp(80px,8.4vw,144px); line-height:.84; letter-spacing:-.035em; }
.hero-description { max-width: 535px; }
.hero-content { z-index: 4; }
.join-logo { position:absolute; width:min(37%,390px); height:auto; object-fit:contain; right: 26px; top: 50%; transform: translateY(-50%); opacity: .18; filter: grayscale(.15); pointer-events:none; }
.join-content { position:relative; z-index:3; }
.search-dialog { max-width: 720px; }
.site-search-results { margin-top: 18px; max-height: min(48vh,390px); overflow: auto; display:grid; gap:8px; }
.search-result { color: #f2f2f5; background:#191b21; border:1px solid #363842; text-decoration:none; padding:14px 15px; display:grid; grid-template-columns: minmax(0,1fr) auto; gap:8px; transition:background .2s,border-color .2s; }
.search-result:hover,.search-result:focus-visible { background:#282a31; border-color:#e62538; }
.search-result small { display:block; margin-top:5px; color:#adb2bd; font: 500 12px/1.6 var(--font-body); letter-spacing:0; }
.search-result strong {font:800 18px/1.2 var(--font-display);letter-spacing:.02em;}
.search-result b { color:#e92a3b; }
.search-empty {padding:23px; border:1px solid #363842; color:#b3b6bf; font-size:14px;}
.site-search-hint{margin:18px 0 0;color:#9fa3ae;font-size:12px;line-height:1.6;}
@media(max-width:1200px){ .hero-content h1{font-size:clamp(72px,9vw,115px);} .nav-search span{display:none;} }
@media(max-width:850px){ .brand-logo{width:45px;height:46px} .brand small{display:none} .hero-logo{width:100%;max-width:480px;} .hero-visual{height:400px;} .join-logo{width:48%;right:0;} .nav-search { padding:10px;} }
@media(max-width:620px){ .hero-content h1{font-size:clamp(72px,15vw,112px);} .hero-visual{right:-120px;top:25px;} .hero-logo {width:88%;} .hero-actions .btn{font-size:11px;} .nav-search{display:none;} .brand-logo{width:44px;height:45px;} .join-logo{width:70%;opacity:.09;} .toprail-right strong{display:none;} .site-search-results{max-height:40vh;} }
@media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .hero-logo{animation:none;} }