/* ============================================================
   Typography — La Belle Beauté
   Serif display (Cormorant Garamond) + rustige sans (Jost).
   Donker is de basis: body krijgt cream tekst op ink achtergrond;
   lichte secties draaien dit lokaal om via .section--cream/--sand.
   ============================================================ */

/* ----------------------------------------
 * BASIS
 * ---------------------------------------- */

body {
  font-family:     var(--ff-sans);
  font-weight:     300;
  font-size:       1rem;
  line-height:     1.7;
  letter-spacing:  .01em;
  color:           var(--cream);
  background:      var(--ink);
  -webkit-font-smoothing: antialiased;
}

/* ----------------------------------------
 * KOPPEN
 * ---------------------------------------- */

h1, h2, h3, h4, h5, h6,
.display {
  font-family:  var(--ff-display);
  font-weight:  500;
  line-height:  1.08;
}

.h-xl { font-size: var(--fs-xl); }
.h-lg { font-size: var(--fs-lg); }
.h-md { font-size: var(--fs-md); }

/* ----------------------------------------
 * BODYTEKST & ACCENTEN
 * ---------------------------------------- */

.lead {
  font-size:    var(--fs-lead);
  font-weight:  300;
}

.muted {
  color: var(--taupe-soft);
}

em, .it {
  font-style:  italic;
  color:       var(--gold-soft);   /* op donker; .section--cream/--sand → koper */
}

p {
  margin-bottom: 1em;
}

p:last-child {
  margin-bottom: 0;
}

/* ----------------------------------------
 * LINKS (basis — componenten overschrijven waar nodig)
 * ---------------------------------------- */

a {
  color:            inherit;
  text-decoration:  none;
  transition:       color var(--dur) var(--ease);
}