/**
 * MysteryBril — 02 · Basis
 * ---------------------------------------------------------------------------
 * Achtergrond, typografie en herbruikbare elementen voor de hele site.
 * Overgenomen uit de oude "Extra CSS" in de Customizer en opgeschoond.
 *
 * Opgeruimd t.o.v. de oude situatie:
 *   - Het blok "MIDDENSTUK (wit)" is verwijderd. Dat forceerde
 *     `background:#fff` en `color:#000` op body/#main/.site-main, terwijl een
 *     regel verderop de body juist zwart maakte. Die tegenstrijdigheid was de
 *     oorzaak van de rommelige layout.
 *   - Selectors van andere thema's (#masthead, #colophon, .main-navigation,
 *     .site-header, .site-footer) zijn weggehaald; Blocksy gebruikt die niet.
 * ---------------------------------------------------------------------------
 */

/* --- Achtergrond & standaardtekst --- */
body {
  background: var(--mb-black);
  color: var(--mb-white);
  font-family: var(--mb-font-body);
}

#main,
.site-main,
.content-area {
  background-color: transparent;
}

/* --- Koppen --- */
h1,
h2,
h3,
.site-title,
.woocommerce-loop-product__title,
.product_title {
  font-family: var(--mb-font-display);
  text-transform: uppercase;
  letter-spacing: 0.01em;
}

/* --- Links binnen de content --- */
.entry-content a:hover,
.site-main a:hover {
  color: var(--mb-orange-bright);
}

.entry-content strong,
.entry-content b {
  color: var(--mb-orange);
}

/* --- Herbruikbare badge (mystery-tag stijl uit het design) --- */
.mb-badge {
  display: inline-block;
  padding: 3px 7px;
  font-family: var(--mb-font-body);
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--mb-orange-dim);
  color: var(--mb-orange-bright);
}

/* --- Logo-afbeeldingen in galerijblokken (Over ons / Marquee) --- */
.wp-block-gallery.has-nested-images figure.wp-block-image img.wp-image-13,
.wp-block-gallery.has-nested-images figure.wp-block-image img.wp-image-14 {
  max-width: 180px;
}