

-notice is de eigenlijke Monotype-attributie en moet
   letterlijk blijven staan, ook in de gepubliceerde build: publiceer.sh strip
   normaal alle CSS-commentaar maar spaart bewust een blok dat met /*! begint
   (dezelfde conventie die minifiers als clean-css/terser gebruiken). */
/*! MyFonts Webfont Build ID 3867246 / 835973. De fonts in deze notice vallen
   onder de EULA die de website-eigenaar (Dhumas) is aangegaan. Copyright (c)
   Monotype Imaging Inc. Licentie-URL:
   https://www.myfonts.com/collections/monotype-imaging-foundry */
@font-face{
  font-family:'Mestiza';src:url('../fonts/mestiza/light.woff2') format('woff2'),url('../fonts/mestiza/light.woff') format('woff');
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Mestiza';src:url('../fonts/mestiza/regular.woff2') format('woff2'),url('../fonts/mestiza/regular.woff') format('woff');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Mestiza';src:url('../fonts/mestiza/bold.woff2') format('woff2'),url('../fonts/mestiza/bold.woff') format('woff');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Helvetica Now Text';src:url('../fonts/helvetica-now-text/regular.woff2') format('woff2'),url('../fonts/helvetica-now-text/regular.woff') format('woff');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Helvetica Now Text';src:url('../fonts/helvetica-now-text/medium.woff2') format('woff2'),url('../fonts/helvetica-now-text/medium.woff') format('woff');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Helvetica Now Text';src:url('../fonts/helvetica-now-text/bold.woff2') format('woff2'),url('../fonts/helvetica-now-text/bold.woff') format('woff');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Helvetica Now Text';src:url('../fonts/helvetica-now-text/italic.woff2') format('woff2'),url('../fonts/helvetica-now-text/italic.woff') format('woff');
  font-weight:400;font-style:italic;font-display:swap;
}

:root{
  
  color-scheme:light;
  
  --kleur-wit:#FFFFFF;
  --kleur-gebroken-wit:#DEDED4;
  
  --kleur-achtergrond:#f1f1eb;
  --kleur-lichtblauw:#B1BEDE;
  --kleur-groen:#74775A;
  --kleur-terracotta:#B0483E;
  --kleur-terracotta-donker:#8C382F;
  --kleur-zwart:#000000;

  
  --kleur-cta-terracotta:#A14335;
  --kleur-cta-terracotta-donker:#832F24;

  
  --kleur-inkt:#201C19;
  
  --kleur-inkt-2:#5A5347;
  --kleur-lijn:#E2E0D6;

  
  --pk-zeker:#AB4D45;      
  --pk-zichtbaar:#A3B6D8;  
  --pk-slim:#74775A;       
  --pk-zorgeloos:#D5D7CD;  

  
  --font-serif:'Mestiza',Georgia,serif;
  --font-sans:'Helvetica Now Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;

  
  --max:78rem;
  --goot:1.5rem;
  --kop-hoogte:76px;

  
  --sp-1:.5rem; --sp-2:.75rem; --sp-3:1rem; --sp-4:1.5rem; --sp-5:2rem;
  --sp-6:3rem; --sp-7:4.5rem; --sp-8:6rem; --sp-9:8rem;

  
  --radius:2px; 
  --schaduw-zacht:0 1px 0 var(--kleur-lijn);
  --schaduw-kaart:0 18px 40px rgba(32,28,25,.10);
  --blur-glas:saturate(160%) blur(14px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
body{
  margin:0;background:var(--kleur-achtergrond);color:var(--kleur-inkt);
  font-family:var(--font-sans);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--kleur-cta-terracotta);outline-offset:2px}
ul{margin:0;padding:0;list-style:none}


h1,h2,h3,h4{
  
  font-family:var(--font-serif);font-weight:400;margin:0;line-height:1.08;
  font-variation-settings:"opsz" 40;color:var(--kleur-inkt);
}
h1{font-size:clamp(2.4rem,5vw,4rem);letter-spacing:-.01em}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
h3{font-size:1.3rem;line-height:1.25}

h4{font-size:1.05rem;font-family:var(--font-sans);font-weight:500}
p{margin:0 0 1em;max-width:62ch;color:var(--kleur-inkt-2)}
small{font-size:.8em}


.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--goot)}
.sectie{padding-block:var(--sp-8)}
.sectie--klein{padding-block:var(--sp-6)}
.sectie--grijs{background:var(--kleur-gebroken-wit)}
@media (max-width:800px){
  .sectie{padding-block:var(--sp-6)}
}


.label{
  
  display:block;font-family:var(--font-sans);font-size:.76rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--kleur-cta-terracotta);
  margin-bottom:.9rem;
}
.label--op-donker{color:var(--kleur-gebroken-wit)}
.label--inkt{color:var(--kleur-inkt-2)}


.knop{
  display:inline-flex;align-items:center;gap:.5em;
  
  font:700 .8rem/1 var(--font-sans);letter-spacing:.05em;
  padding:1em 1.6em;background:var(--kleur-cta-terracotta);color:var(--kleur-wit);
  border:1px solid var(--kleur-cta-terracotta);cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.knop:hover{background:var(--kleur-cta-terracotta-donker);border-color:var(--kleur-cta-terracotta-donker)}
.knop--licht{background:transparent;color:var(--kleur-inkt);border-color:var(--kleur-inkt)}

.knop--licht:hover{background:var(--kleur-inkt);color:var(--kleur-wit);border-color:var(--kleur-inkt)}
.knop--op-donker{background:transparent;color:var(--kleur-wit);border-color:var(--kleur-wit)}
.knop--op-donker:hover{background:var(--kleur-wit);color:var(--kleur-inkt);border-color:var(--kleur-wit)}
.knop--klein{padding:.75em 1.2em;font-size:.74rem}
.knop--scroll{background:transparent;color:inherit;border-color:currentColor}

.knop--scroll:hover{background:var(--kleur-wit);color:var(--kleur-inkt);border-color:var(--kleur-wit)}

.link{font-weight:500;text-decoration:underline;text-underline-offset:.2em;color:var(--kleur-cta-terracotta)}
.link:hover{color:var(--kleur-cta-terracotta-donker)}


.cta-balk{padding:var(--sp-8) 0;color:var(--kleur-wit)}
.cta-balk .wrap{display:grid;gap:var(--sp-4)}
.cta-balk h2{color:inherit}
.cta-balk p{color:inherit;opacity:.92}
.cta-balk--terracotta{background:var(--kleur-cta-terracotta)}
.cta-balk--groen{background:var(--kleur-groen)}
.cta-balk--gebroken-wit{background:var(--kleur-gebroken-wit);color:var(--kleur-inkt)}
.cta-balk--gebroken-wit .label{color:var(--kleur-cta-terracotta)}
@media (min-width:800px){
  .cta-balk .wrap{grid-template-columns:1fr 1fr;align-items:center}
}

.cta-balk--centrum .wrap{grid-template-columns:1fr!important;max-width:40rem;text-align:center}
.cta-balk--centrum .label{display:block}
.cta-balk--centrum h2{font-size:clamp(1.6rem,2.8vw,2.1rem)}
.cta-balk--centrum p{margin:.9rem auto 1.7rem;max-width:42ch}
.cta-balk--centrum .knop{margin-top:.6rem;margin-inline:auto}
.cta-balk-acties{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
.cta-balk-acties .knop{margin-top:0}


.pakket-zeker{background:var(--pk-zeker);color:var(--kleur-wit)}
.pakket-zichtbaar{background:var(--pk-zichtbaar);color:var(--kleur-inkt)}
.pakket-slim{background:var(--pk-slim);color:var(--kleur-wit)}
.pakket-zorgeloos{background:var(--pk-zorgeloos);color:var(--kleur-inkt)}

.pakket-tekst-zeker{color:var(--pk-zeker)}
.pakket-tekst-zichtbaar{color:var(--pk-zichtbaar)}
.pakket-tekst-slim{color:var(--pk-slim)}
.pakket-tekst-zorgeloos{color:var(--pk-zorgeloos)}


.kaart{background:var(--kleur-wit);border:1px solid var(--kleur-lijn);padding:var(--sp-5)}


.pakketten-kaarten{margin-top:var(--sp-6);display:grid;grid-template-columns:1fr;gap:1.25rem}
.kaart-pakket{
  display:flex;flex-direction:column;gap:.85rem;padding:2rem 1.7rem;
  transition:transform .22s ease,box-shadow .22s ease;
}
.kaart-pakket:hover{transform:translateY(-4px);box-shadow:var(--schaduw-kaart)}
.kaart-pakket .naam{
  
  font-family:var(--font-serif);font-weight:400;font-size:2rem;line-height:1;
  font-variation-settings:"opsz" 72;color:inherit;
}

.kaart-pakket .prijs{font:700 1.05rem/1 var(--font-sans);display:flex;align-items:baseline;gap:.5em}
.kaart-pakket .prijs small{font:500 .74rem/1 var(--font-sans);opacity:.75;text-transform:none}
.kaart-pakket p{font-size:.92rem;margin:0;max-width:none;color:inherit;opacity:.92}
.kaart-pakket .knop{margin-top:auto;align-self:flex-start}
.kaart-pakket--kort{min-height:11.5rem;justify-content:flex-end}
.kaart-pakket--kort .naam{font-size:1.55rem;font-variation-settings:"opsz" 60}
@media (min-width:640px){
  .pakketten-kaarten{grid-template-columns:1fr 1fr}
}
@media (min-width:1080px){
  .pakketten-kaarten{grid-template-columns:repeat(4,1fr)}
}


.kop{
  position:sticky;top:0;z-index:60;
  background:var(--kleur-achtergrond);color:var(--kleur-inkt);
  box-shadow:var(--schaduw-zacht);
}

.kop-in{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);
  min-height:var(--kop-hoogte);padding-inline:var(--goot)}

.logo{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;color:inherit}
.logo svg{width:30px;height:30px;fill:var(--kleur-zwart)}

.logo span{font-family:var(--font-serif);font-weight:400;font-size:1.3rem;letter-spacing:.01em}


.nav ul{display:flex;align-items:center;gap:2.1rem}
.nav>ul>li>a{
  display:inline-block;font-size:.82rem;font-weight:500;letter-spacing:.02em;
  padding:.4em 0;border-bottom:2px solid transparent;
}
.nav>ul>li>a:hover,.nav a[aria-current="page"]{border-color:var(--kleur-cta-terracotta)}
.nav .sub-wrap{position:relative}
.nav .sub-wrap>a::after{
  content:"";display:inline-block;width:.35em;height:.35em;margin-left:.5em;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-.2em);
}
.nav .sub{
  display:none;position:absolute;top:100%;left:-1rem;min-width:14rem;
  background:var(--kleur-achtergrond);border:1px solid var(--kleur-lijn);
  box-shadow:var(--schaduw-kaart);padding:.5rem 0;z-index:2;
}
.nav .sub a{display:block;padding:.6em 1rem;font-size:.85rem}
.nav .sub a:hover{background:var(--kleur-gebroken-wit)}
.nav .sub-wrap:hover .sub,.nav .sub-wrap:focus-within .sub{display:block}

.sub-indent{padding-left:1.5rem}
.sub-sep{border-top:1px solid var(--kleur-lijn);margin-top:.4rem;padding-top:.4rem}

.kop-acties{display:flex;align-items:center;gap:.75rem}
.menu-knop{
  display:none;background:none;border:1px solid var(--kleur-inkt);color:inherit;
  
  font:700 .72rem/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;
  padding:.7em 1em;cursor:pointer;
}
@media (max-width:960px){
  .kop-acties .knop{display:none}
  .menu-knop{display:inline-block}
  .nav{
    display:none;position:fixed;left:0;right:0;top:var(--kop-hoogte);
    height:calc(100dvh - var(--kop-hoogte));background:var(--kleur-achtergrond);
    padding:var(--sp-4) var(--goot) var(--sp-6);overflow:auto;z-index:59;
  }
  .nav.open{display:block}
  .nav ul{flex-direction:column;align-items:stretch;gap:0}
  .nav>ul>li>a{display:block;padding:1em 0;border-bottom:1px solid var(--kleur-lijn)}
  .nav .sub{position:static;display:block;border:0;box-shadow:none;padding:0 0 .5rem 1rem}
  .nav .sub-wrap>a::after{display:none}
}


.voet{background:var(--kleur-gebroken-wit);color:var(--kleur-inkt);border-top:1px solid var(--kleur-lijn)}
.voet-in{padding-block:var(--sp-8) var(--sp-5)}
.voet-in{display:grid;gap:var(--sp-6);grid-template-columns:1.4fr repeat(3,1fr)}
.voet-merk p{max-width:32ch;margin-top:1rem;color:var(--kleur-inkt-2)}

.voet-sociaal{display:flex;gap:.85rem;margin-top:1.1rem}
.voet-sociaal a{
  display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;
  border:1px solid var(--kleur-lijn);color:var(--kleur-inkt-2);
  transition:color .18s ease,border-color .18s ease;
}
.voet-sociaal a:hover,.voet-sociaal a:focus-visible{color:var(--kleur-cta-terracotta);border-color:var(--kleur-cta-terracotta)}
.voet-sociaal svg{width:16px;height:16px}

.voet-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--kleur-inkt-2);margin-bottom:1rem}
.voet-kol ul li{margin-bottom:.55rem;font-size:.9rem}
.voet-kol ul li a:hover{color:var(--kleur-cta-terracotta)}
.voet-juridisch{grid-column:1/-1;border-top:1px solid var(--kleur-lijn);padding-top:var(--sp-5);margin-top:var(--sp-3)}
.voet-juridisch p{max-width:none;font-size:.78rem;line-height:1.7;color:var(--kleur-inkt-2)}
.voet-juridisch a{text-decoration:underline;color:var(--kleur-inkt-2)}
.voet-juridisch a:hover{color:var(--kleur-cta-terracotta)}
.voet-onder{grid-column:1/-1;padding-top:var(--sp-3);font-size:.78rem;color:var(--kleur-inkt-2)}
@media (max-width:800px){
  .voet-in{grid-template-columns:1fr 1fr;gap:var(--sp-5)}
  .voet-merk{grid-column:1/-1}
}
@media (max-width:520px){
  .voet-in{grid-template-columns:1fr}
}


[data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
[data-reveal].zichtbaar{opacity:1;transform:none}


.voet-onder{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 2rem}
.voet-links{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem}
.voet-links a{text-decoration:underline;text-underline-offset:.2em;color:var(--kleur-inkt-2)}
.voet-links a:hover{color:var(--kleur-cta-terracotta)}
