/* Archief-overrides voor nikocaignie.be
   -------------------------------------
   De site gebruikt 39 keer 'din-condensed-web', geleverd via Adobe
   Typekit onder het account van Squarespace. Die licentie verhuist niet
   mee. We declareren dezelfde familienaam met Barlow Condensed, zodat
   de bestaande CSS ongewijzigd kan blijven werken.
   Barlow Condensed: SIL Open Font License, zelf gehost.            */

@font-face {
  font-family: "din-condensed-web";
  src: url("/assets/fonts/barlow-condensed-500-latin.woff2") format("woff2");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "din-condensed-web";
  src: url("/assets/fonts/barlow-condensed-700-latin.woff2") format("woff2");
  font-weight: 600 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "din-condensed-web";
  src: url("/assets/fonts/barlow-condensed-400-italic-latin.woff2") format("woff2");
  font-weight: 400 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "din-condensed-web";
  src: url("/assets/fonts/barlow-condensed-700-italic-latin.woff2") format("woff2");
  font-weight: 600 900;
  font-style: italic;
  font-display: swap;
}

/* Barlow loopt iets smaller dan DIN Condensed; een fractie extra
   letterafstand houdt koppen op vergelijkbare breedte. */
h1, h2, h3, .BlogList-item-title, .Header-nav-item {
  letter-spacing: 0.01em;
}

/* Het contactformulier is vervangen door een mailto-link. */
.archief-mailto {
  display: inline-block;
  padding: 0.9em 1.6em;
  border: 1px solid currentColor;
  text-decoration: none;
  font-family: "din-condensed-web", "Helvetica Neue", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* Video's die vroeger GIF's waren -----------------------------------
   Ze dragen width/height uit data-image-dimensions, zodat de browser
   de verhouding kent voordat de video geladen is. Deze regel laat ze
   meeschalen zoals een Squarespace-beeld dat deed. */
video[poster] {
  max-width: 100%;
  height: auto;
  display: block;
}
/* In galerijblokken vullen ze hun kader, net als de beelden daar. */
.sqs-block-gallery video[poster],
.gallery-block video[poster],
.sqs-gallery video[poster] {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Beelden zonder Squarespace-JavaScript ------------------------------
   Squarespace liet een script elk beeld opmeten en het kader een
   hoogte geven. Een archief mag daar niet van afhangen: als dat script
   ooit stukloopt, staat de hele site scheef. Deze regels geven
   dezelfde opmaak op puur CSS. */

img[data-image-dimensions] {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Blogoverzicht: het kader kreeg zijn hoogte van JS via padding-bottom. */
.BlogList-item-image,
.BlogList-item-image-link {
  display: block;
  position: relative;
  height: auto;
  padding-bottom: 0;
}
.BlogList-item-image img,
.BlogList-item-image-link img {
  position: static;
  width: 100%;
  height: auto;
}

/* Galerij- en beeldblokken op de gewone pagina's. */
.sqs-block-image img,
.image-block img,
.sqs-gallery img {
  max-width: 100%;
  height: auto;
}
