/* Huisstijl 5p, volgens het stijlboek (versie 1.0) */
:root{
  --nacht:#1E3270;
  --nacht-donker:#0D1E4A;
  --leisteen:#4A5F7C;
  --creme:#F7F5EF;
  --steengrijs:#9096A8;
  --lichtgrijs:#E8E7E2;
  --wit:#FFFFFF;
  --goud:#B09040;
  --zwart:#1A1A2E;

  --serif:"Playfair Display", Georgia, serif;
  --sans:"Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --maat-1:.72rem;
  --maat-2:.88rem;
  --maat-3:1rem;
  --maat-4:1.2rem;
  --maat-5:1.6rem;
  --maat-6:2.2rem;
  --maat-7:clamp(2.4rem,5.2vw,3.9rem);

  --ruimte:1.5rem;
  --breedte:72rem;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  background:var(--creme);
  color:var(--zwart);
  font-family:var(--sans);
  font-weight:300;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
@media (max-width:40rem){ body{font-size:16px;} }

h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.15;text-wrap:balance;margin:0;}
p{margin:0 0 1rem;}
a{color:inherit;text-decoration:none;}
a:focus-visible{outline:2px solid var(--goud);outline-offset:3px;}
img{max-width:100%;display:block;}

.wrap{max-width:var(--breedte);margin:0 auto;padding:0 2.5rem;}
@media (max-width:40rem){ .wrap{padding:0 1.25rem;} }

.label{
  font-family:var(--sans);font-size:var(--maat-1);letter-spacing:.18em;
  text-transform:uppercase;font-weight:600;color:var(--steengrijs);
}

.btn{
  font-family:var(--sans);font-size:.9rem;font-weight:500;letter-spacing:.02em;
  padding:.8rem 1.5rem;background:var(--wit);color:var(--nacht);display:inline-block;
}
.btn:hover{background:var(--lichtgrijs);}
.btn--ghost{background:transparent;color:var(--wit);border:1px solid rgba(255,255,255,.4);}
.btn--ghost:hover{background:rgba(255,255,255,.08);}
.btn--goud{background:var(--goud);color:var(--nacht-donker);}
.btn--goud:hover{background:#C2A155;}
.btn--donker{background:var(--nacht);color:var(--wit);}
.btn--donker:hover{background:var(--nacht-donker);}

/* De vijfhoek: altijd gedraaid, 4 tot 10 procent, deels afgesneden */
.pent-bg{position:absolute;pointer-events:none;}
.pent-bg svg{display:block;width:100%;height:100%;}

.prose{max-width:38rem;}
.prose h2{font-size:var(--maat-5);color:var(--nacht);margin:2.5rem 0 .75rem;}
.prose h3{font-size:var(--maat-4);color:var(--nacht);margin:2rem 0 .5rem;}
.prose p{color:var(--zwart);}
.prose .lead{font-size:1.15rem;font-weight:200;color:var(--leisteen);}