/*
Theme Name: Herman Meier Card
Theme URI: https://hermanmeier.nl
Author: Generated by ChatGPT
Description: Eén-pagina visitekaartje thema in de huisstijl van Bouwservice Herman Meier.
Version: 1.0.0
License: GNU GPL v2 or later
Text Domain: hermanmeier-card
*/

:root{
  --brand: #1e3a8a; /* donkerblauw */
  --accent: #2563eb; /* helder blauw */
  --bg: #ffffff;
  --fg: #111827;
  --muted: #374151;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family: Arial, Helvetica, sans-serif;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.6;
}

a{color: var(--brand); text-decoration: none;}
a:hover{text-decoration: underline;}

.container{
  max-width: 900px;
  margin: 0 auto;
  padding: 32px 20px;
}

.card{
  background: #ffffff;
  border: 2px solid var(--brand);
  border-radius: 12px;
  padding: 28px;
}

.header{
  display: flex;
  gap: 20px;
  align-items: center;
}

.logo img{max-width:100px;height:auto;}

.title{
  font-size: 32px;
  margin: 0;
  line-height: 1.2;
  color: var(--brand);
  font-weight: bold;
}
.subtitle{margin: 6px 0 0 0; color: var(--muted); font-style: italic;}

.hr{height:2px;background:var(--brand); margin: 22px 0;}

.grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.info{
  padding:10px 12px; border:1px solid var(--brand); border-radius: 8px;
}

.badge{
  font-size:12px; text-transform:uppercase; letter-spacing:.08em;
  color:white; background:var(--brand);
  padding:4px 8px; border-radius:4px; display:inline-block; margin-bottom:4px;
}

.cta{
  display:flex; gap:12px; flex-wrap:wrap; margin-top: 8px;
}
.button{
  display:inline-block; padding:10px 16px; border-radius:8px;
  background: var(--brand); color:white; font-weight:bold;
}
.button.secondary{
  background: var(--accent);
}
.footer{
  text-align:center; color:var(--muted); font-size:14px; margin-top:26px;
}
.address{
  white-space: pre-wrap;
}