/* ------------------------------
   Base
------------------------------ */
body {
  font-family: var(--ts3d-font-body);
  font-weight: 300; /* DM Sans Light */
  font-size: var(--ts3d-body-size);
  line-height: var(--ts3d-body-lh);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

p { margin: 0 0 var(--ts3d-para-gap) 0; }

/* basis balance in de tekst stukjes */
p {
 text-wrap: balance;
} 

/* ------------------------------
   Heading layout: wider + outdent left
------------------------------ */
.ts3d-heading {
  max-width: var(--ts3d-measure-heading);
  margin-left: calc(-1 * var(--ts3d-heading-outdent));
  padding-left: var(--ts3d-heading-outdent);
}

/* If you want headings aligned with body (no outdent) */
.ts3d-heading--flush {
  margin-left: 0;
  padding-left: 0;
}

/* ------------------------------
   Heading styles (Cormorant)
------------------------------ */
.ts3d-h1, .ts3d-h2, .ts3d-h3 {
  font-family: var(--ts3d-font-display);
  font-weight: 300;
  letter-spacing: var(--ts3d-heading-track);
}

.ts3d-h1 {
  font-size: var(--ts3d-h1-size);
  line-height: var(--ts3d-h1-lh);
  margin: 0 0 0.35em 0;
  /* padding-bottom: 75px; */
}

.ts3d-h2 {
  font-size: var(--ts3d-h2-size);
  line-height: var(--ts3d-h2-lh);
  margin: 0 0 0.55em 0;
}
.ts3d-h3 {
  font-weight: 400;
  font-size: var(--ts3d-h3-size);
  line-height: var(--ts3d-h3-lh);
  margin: 0 0 0.45em 0;
}

/* ------------------------------
   Type blocks
------------------------------ */
.ts3d-type {
  font-family: var(--ts3d-font-body);
  font-weight: 300;
}

/* Subtle emphasis (avoid heavy bold) */
.ts3d-type strong { font-weight: 400; }

/* ------------------------------
   Drop cap (Cormorant) – opt-in
   Use on wrapper (.ts3d-dropcap) or per paragraph (p.ts3d-dropcap)
------------------------------ */

/* Progressive enhancement */
@supports (initial-letter: 2) or (-webkit-initial-letter: 2) {
  .ts3d-dropcap p:first-of-type::first-letter,
  p.ts3d-dropcap::first-letter {
    font-family: var(--ts3d-font-display);
    font-weight: 300;
    letter-spacing: 0.02em;
    -webkit-initial-letter: 2;
    initial-letter: 2;
    margin-right: 0.35em;
  }
}

/* Fallback (works everywhere) 
@supports not (initial-letter: 2) and not (-webkit-initial-letter: 2) {
  .ts3d-dropcap p:first-of-type::first-letter,
  p.ts3d-dropcap::first-letter {
    font-family: var(--ts3d-font-display);
    font-weight: 300;
    letter-spacing: 0.02em;
    float: left;
    font-size: 3.2em;  
    line-height: 0.9;
    margin: 0.08em 0.18em 0 0;
  }
} */

/* Opt-out */
.ts3d-no-dropcap p::first-letter,
p.ts3d-no-dropcap::first-letter {
  float: none !important;
  font-size: inherit !important;
  margin: 0 !important;
  -webkit-initial-letter: normal !important;
  initial-letter: normal !important;
}

/* Space onder en boven de headers */
body .ts3d-h2,
body .ts3d-h3,
body .ts3d-h4  {
  margin-top: 0;
  margin-bottom: var(--rhythm-base);
}

body .ts3d-h1 {
  margin-top: 0;
  margin-bottom: var(--rhythm-loose);
}