/* Algemene styles voor de landingspagina */
:root{
  --overlay-color: rgba(0,0,0,0.45);
  --card-bg: rgba(255,255,255,0.95);
  --accent: #0b62a4;
  --max-width: 540px;
}
*{box-sizing: border-box}
html,body{
  height:100%;
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:#0b1220;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
/* Achtergrondafbeelding; vervang de URL door je eigen afbeelding indien gewenst */
body{
  background-image: url('https://wwba.nl/wenen.png');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
/* Donkere overlay voor betere leesbaarheid */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background: var(--overlay-color);
  z-index:0;
}
.page{ /* container */
  min-height:100vh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem;
  position:relative;
  z-index:1; /* boven overlay */
}
.center{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.card{
  max-width:var(--max-width);
  width:100%;
  background: rgba(255,255,255,0.98);
  padding:2.0rem;
  border-radius:12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
  text-align:center;
  line-height:1.4;
  color:#07263b;
}
.card:focus{
  outline: 3px solid rgba(11,98,164,0.15);
  outline-offset:4px;
}
h1{
  margin:0 0 0.6rem 0;
  font-size:1.25rem;
  font-weight:700;
}
address{
  font-style:normal;
  margin:0;
  font-size:1rem;
}
.note{
  margin-top:1rem;
  color:#274156;
  font-size:0.95rem;
}
/* Responsive adjustments */
@media (min-width: 640px){
  h1{font-size:1.4rem}
  .card{padding:2.5rem}
}
@media (min-width: 1024px){
  .card{padding:3rem;}
  h1{font-size:1.6rem}
}