/* Mastrent base — document, typografie, focus. Kleuren alleen via tokens (tokens.css). */

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  background-color:var(--mr-bg);
  color:var(--mr-text);
  font-family:var(--mr-font-body);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:clip;
}
/* Achtergrondverloop als vaste, eigen laag: background-attachment:fixed liet de browser bij elk scrollbeeld de hele
   pagina opnieuw schilderen (stroef scrollen, klant 2026-10-30). */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;will-change:transform;
  background-image:radial-gradient(1200px 800px at 75% 18%, var(--mr-bg-2), transparent 70%), linear-gradient(180deg, var(--mr-bg) 0%, var(--mr-bg-2) 100%)}
/* Alleen na een bewuste wissel animeren; bij laden geen overgang (geen flits). */
@media (prefers-reduced-motion: no-preference){
  body{transition:background-color .5s var(--mr-ease), color .5s var(--mr-ease)}
}

:where(h1,h2,h3,h4,h5,h6){font-family:var(--mr-font-display);color:var(--mr-text);text-wrap:balance}
:where(p,li){text-wrap:pretty}

::selection{background:var(--mr-geel);color:var(--mr-on-geel)}
:focus-visible{outline:2px solid var(--mr-focus);outline-offset:3px}

.mr-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Navy-achtergronden (CTA-band e.d.) blijven navy in beide thema's; de palette-kleur "navy" is het accent. */
:root .has-navy-background-color{background-color:var(--mr-navy)!important}
:root .has-navy-background-color{color:var(--mr-op-navy)}
:root .has-navy-background-color :where(h1,h2,h3,h4,p,li,a:not(.wp-element-button)){color:inherit}
:root .has-navy-dark-background-color{color:var(--mr-op-navy)}
:root .has-wit-background-color{background-color:var(--mr-surface)!important}

img{max-width:100%;height:auto}