:root{
  --brand-blue:#1E3FA8;
  --brand-red:#C73452;
  --brand-yellow:#F6D93B;
  --text:#0A1C4A;
  --bg:#ffffff;
}
*{box-sizing:border-box}
html{font-size:16px}
@media (max-width:480px){ html{font-size:15px} }
@media (min-width:1280px){ html{font-size:18px} }

body{
  margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text); background:var(--bg);
  line-height:1.55;
}
a{color:var(--brand-blue);}
.header{
  max-width:1100px; margin:0 auto; padding:24px 20px; display:flex; align-items:center; justify-content:space-between;
}
.brand{display:flex; align-items:center; gap:16px;}
.brand img{height:72px; width:auto;}
.badge{font-weight:700; color:var(--brand-blue); border:2px solid var(--brand-blue); padding:6px 10px; border-radius:8px;}
main{max-width:1100px; margin:0 auto; padding:24px 20px;}
.hero{display:grid; grid-template-columns:1.2fr 1fr; gap:24px; align-items:center;}
@media (max-width:900px){ .hero{grid-template-columns:1fr; text-align:center;} .cta-row{justify-content:center;} }
h1{font-size:2.2rem; margin:0 0 8px}
.lead{font-size:1.2rem; color:#0b2a68; margin:0 0 18px}
.kacheln{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px}
.kachel{background:#f5f7ff; border:1px solid #e0e6ff; border-radius:10px; padding:14px}
.kachel h3{margin:0 0 6px; font-size:1rem}
.cta-row{display:flex; gap:12px; margin-top:18px; flex-wrap:wrap}
.btn{background:var(--brand-blue); color:#fff; border:none; padding:12px 16px; border-radius:10px; font-weight:700; cursor:pointer}
.btn.alt{background:#fff; color:var(--brand-blue); border:2px solid var(--brand-blue)}
.small{font-size:0.95rem; color:#2d3f70}
.footer{max-width:1100px; margin:24px auto 40px; padding:0 20px; color:#445}
.footer a{color:#2d3f70}
/* Accessibility helpers */
.skip{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip:focus{left:8px; top:8px; width:auto; height:auto; padding:8px 10px; background:#fff; border:2px solid var(--brand-blue)}
:focus{outline:3px solid #a7c0ff; outline-offset:2px}
@media (prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important} }