/* Bewakingsdiensten.be — uniforme compacte typografie
   Referentie: de goedgekeurde homepage-versie op 9c79b575.bewakingsdiensten.pages.dev.
   De homepage behoudt haar bestaande hiërarchie; alle overige publieke pagina's
   gebruiken dezelfde compacte schaal, kaartstijl en navigatie. */
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;500;600;700;800&display=swap");

:root{
  --font-ui:"Roboto Condensed","Arial Narrow",Arial,sans-serif;
  --page-max:1100px;
  --content-max:820px;
}

html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body,button,input,select,textarea{font-family:var(--font-ui)!important}
body{font-size:16px;line-height:1.55}
.container{max-width:var(--page-max);margin:0 auto;padding:32px;background:#fff}

/* Navigatie overal exact gelijk */
.bd-header,.bd-nav,.bd-footer{font-family:var(--font-ui)!important}
.bd-header>a>div>div:first-child{font-size:18px!important;font-weight:800!important;line-height:1.1!important}
.bd-nav{gap:16px!important;font-size:14px!important}
.bd-nav a{font-size:14px!important;font-weight:600!important;line-height:1.15!important}

/* Compacte paginaschaal: dit was de goedgekeurde verhouding */
.page-compact,
.ux-page,
.job-page,
.training-page,
.codex-page,
.material-page,
.agenda-page{
  max-width:var(--content-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  font-size:.92rem!important;
  line-height:1.45!important;
}

.page-compact h1,.ux-page h1,.job-page h1,.training-page h1,.codex-page h1,.material-page h1,.agenda-page h1,
.ux-hero h1,.job-hero h1,.training-hero h1,.codex-hero h1{
  font-size:1.4rem!important;
  line-height:1.2!important;
  margin:0 0 .6rem!important;
  font-weight:700!important;
  letter-spacing:-.015em!important;
}

.page-compact h2,.ux-page h2,.job-page h2,.training-page h2,.codex-page h2,.material-page h2,.agenda-page h2,
.ux-card h2,.job-card h2,.training-card h2{
  font-size:1rem!important;
  line-height:1.3!important;
  margin-top:1.2rem!important;
  margin-bottom:.35rem!important;
  font-weight:700!important;
}

.page-compact h3,.ux-page h3,.job-page h3,.training-page h3,.codex-page h3,.material-page h3,.agenda-page h3,
.ux-card h3,.job-card h3,.training-card h3{
  font-size:.95rem!important;
  line-height:1.3!important;
  font-weight:700!important;
}

.page-compact p,.page-compact li,
.ux-page p,.ux-page li,
.job-page p,.job-page li,
.training-page p,.training-page li,
.codex-page p,.codex-page li,
.material-page p,.material-page li,
.agenda-page p,.agenda-page li{
  font-size:.92rem!important;
  line-height:1.5!important;
}

/* Hero's en kaarten: compact en luchtig, niet groot */
.ux-hero,.job-hero,.training-hero,.codex-hero{
  padding:18px!important;
  border-radius:14px!important;
  margin-bottom:18px!important;
}
.ux-card,.job-card,.training-card,.pillar-card,.action-card,.knowledge-card{
  font-family:var(--font-ui)!important;
  border-radius:12px!important;
}
.ux-card,.job-card,.training-card{padding:15px!important}
.ux-choice strong,.action-card strong,.knowledge-card strong,.pillar-card strong{
  font-family:var(--font-ui)!important;
  font-weight:700!important;
}
.ux-choice strong,.action-card strong,.pillar-card strong{font-size:15px!important}
.ux-choice span,.action-card span,.pillar-card span{font-size:13px!important;line-height:1.45!important}

/* Formulieren en knoppen */
.btn,button,[type="submit"]{
  font-family:var(--font-ui)!important;
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.2!important;
}
input,select,textarea{font-size:15px!important;line-height:1.35!important}
.small,.legal-note,.disclaimer,.bd-tagline,.card .meta,.ux-count,.vacancy-count,.training-count{font-size:13px!important}

/* Homepage blijft visueel exact zoals de goedgekeurde referentie */
body.home-page h1,
.sector-platform-home h1{font-size:24px!important;line-height:1.25!important}
.sector-platform-home .knowledge-card{justify-content:flex-start!important}
.sector-platform-home .knowledge-card span{flex:0 0 auto!important;margin-bottom:0!important}
.sector-platform-home .knowledge-card em{margin-top:7px!important}
.sector-platform-home .knowledge-card strong{margin-bottom:5px!important}

@media(max-width:720px){
  body.home-page h1,
  .sector-platform-home h1{font-size:21px!important;line-height:1.25!important}
  .container{padding:20px}
  .page-compact,.ux-page,.job-page,.training-page,.codex-page,.material-page,.agenda-page{font-size:.88rem!important}
  .page-compact h1,.ux-page h1,.job-page h1,.training-page h1,.codex-page h1,.material-page h1,.agenda-page h1,
  .ux-hero h1,.job-hero h1,.training-hero h1,.codex-hero h1{font-size:1.25rem!important}
  .page-compact h2,.ux-page h2,.job-page h2,.training-page h2,.codex-page h2,.material-page h2,.agenda-page h2,
  .ux-card h2,.job-card h2,.training-card h2{font-size:.98rem!important}
  .page-compact p,.page-compact li,.ux-page p,.ux-page li,.job-page p,.job-page li,.training-page p,.training-page li,.codex-page p,.codex-page li,.material-page p,.material-page li,.agenda-page p,.agenda-page li{font-size:.88rem!important}
  .ux-hero,.job-hero,.training-hero,.codex-hero{padding:15px!important}
}
