:root{
  --bg:#f4f4f4;
  --text:#1f2937;
  --muted:#4b5563;
  --border:#d1d5db;
  --card:#fff;
  --menu:#f6c400;
  --menuText:#111827;
  --hover:#2da9ff;
  --link:#0b5bd3;
  --shadow:0 10px 22px rgba(0,0,0,.12);
}
*{box-sizing:border-box;margin:0;padding:0}

body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  line-height:1.6;
  background-color:var(--bg);
  background-image:url("../img/bg-block.jpg");
  background-repeat:repeat;
  background-position:top left;
  background-size:400px 400px;
}

.container{width:min(1000px,92%);margin:0 auto}

.site-header{
  background-image:url("../img/wolken.png");
  background-repeat:repeat;
  background-position:top center;
  background-size:auto;
  border-bottom:1px solid rgba(0,0,0,.10);
}
.header-inner{padding:18px 0 10px}

.brand-center{display:flex;justify-content:center;align-items:center}
.brand-center img{display:block;width:auto;max-width:100%;height:auto;max-height:320px}

.nav-bar{width:100%;background:var(--menu);border-top:1px solid rgba(0,0,0,0.08);border-bottom:1px solid rgba(0,0,0,0.12)}
.nav-wrap{padding:10px 0;display:flex;align-items:center;justify-content:center;gap:10px}

.nav-toggle{display:none;align-items:center;gap:10px;border:1px solid rgba(0,0,0,.16);background:rgba(255,255,255,.45);padding:10px 12px;border-radius:12px;font-weight:900;color:var(--menuText);cursor:pointer}
.nav-toggle-icon{width:18px;height:12px;display:inline-block;position:relative}
.nav-toggle-icon::before,.nav-toggle-icon::after,.nav-toggle-icon i{content:"";position:absolute;left:0;right:0;height:2px;background:rgba(17,24,39,.9);border-radius:2px}
.nav-toggle-icon::before{top:0}
.nav-toggle-icon::after{bottom:0}
.nav-toggle-icon i{top:5px}

.nav-list{list-style:none;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px}
.nav-link{display:inline-block;padding:10px 14px;border-radius:12px;text-decoration:none;color:var(--menuText);font-weight:800;letter-spacing:0.2px;transition:background-color .15s ease, transform .15s ease, box-shadow .15s ease;white-space:nowrap}
.nav-link:hover{background:var(--hover);transform:translateY(-1px);box-shadow:0 4px 10px rgba(0,0,0,0.16)}
.nav-link.active{background:rgba(0,0,0,0.14)}

main{padding:22px 0}
.content-box{background:var(--card);border:1px solid rgba(0,0,0,.10);border-radius:14px;padding:18px;box-shadow:var(--shadow)}

h1{margin:0 0 10px 0;font-size:24px;line-height:1.2}
h2{margin:18px 0 8px 0;font-size:18px;line-height:1.25}
h3{margin:14px 0 6px 0;font-size:16px;line-height:1.25}

p{margin:0 0 12px 0}
a{color:var(--link)}
a:hover{text-decoration:underline}

ul,ol{margin:0 0 14px 0;padding-left:22px}
li{margin:6px 0}
li::marker{color:#111827}

img{display:block;max-width:100%;height:auto;border-radius:12px;box-shadow:0 10px 18px rgba(0,0,0,.14);margin:12px auto 16px}

.table-wrap{overflow:auto;max-width:100%;-webkit-overflow-scrolling:touch}

table{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,0.12)}
thead{background:#f2c300}
th{font-weight:800;text-align:left;padding:12px 10px}
td{padding:10px;border-bottom:1px solid #e5e7eb;vertical-align:top}
tbody tr:nth-child(even){background:#f9fafb}

.sponsor-knop{display:inline-block;background-color:#1f8f3a;color:#fff;padding:12px 18px;text-decoration:none;font-weight:800;border-radius:10px;transition:transform .12s ease, filter .12s ease}
.sponsor-knop:hover{transform:translateY(-1px);filter:brightness(0.96)}

/* Who page: grid cards */
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.card-mini{background:rgba(255,255,255,.92);border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:14px}
.card-mini h2{margin:0 0 8px 0}
.card-mini ul{margin:0;padding-left:18px}

.site-footer{margin-top:18px;background:rgba(255,255,255,.9);border-top:1px solid rgba(0,0,0,.10)}
.footer-inner{padding:14px 0;font-size:14px;color:var(--muted)}

@media (max-width:700px){
  .header-inner{padding:14px 0 6px}
  .brand-center img{max-height:220px}

  .nav-wrap{justify-content:space-between}
  .nav-toggle{display:inline-flex}

  .nav-list{display:none;width:100%;justify-content:flex-start;background:rgba(255,255,255,.35);border:1px solid rgba(0,0,0,.10);border-radius:14px;padding:10px;margin-top:10px}
  .nav-list.is-open{display:flex}
  .nav-list li{width:100%}
  .nav-link{display:block;width:100%;padding:12px 12px;border-radius:12px;font-size:14px}

  main{padding:16px 0}
  .content-box{padding:14px;border-radius:14px}
  h1{font-size:22px}
  h2{font-size:17px}

  .grid-2{grid-template-columns:1fr}
}

@media (max-width:420px){
  .nav-list{gap:8px}
  .nav-link{padding:9px 10px;font-size:13px}
}