/*
Theme Name: Modderkolk
Theme URI: https://woutermodderkolk.nl
Author: Wouter Modderkolk
Description: Persoonlijk blokthema voor woutermodderkolk.nl. Editoriale opmaak in bordgroen en krijt, met de lemniscaat als beeldmerk. Gebouwd op de site editor: alle teksten en sjablonen zijn aanpasbaar via Weergave > Editor.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: modderkolk
*/

/* ---------- Lemniscaat-beeldmerk ---------- */
.mk-brand-mark svg { display: block; width: 44px; height: 22px; }

.mk-hero { position: relative; overflow: hidden; }
.mk-hero-lem {
  position: absolute; right: -6%; top: 50%; transform: translateY(-50%);
  width: min(56vw, 620px); opacity: .16; pointer-events: none;
}
@media (max-width: 781px) { .mk-hero-lem { display: none; } }

/* ---------- Koppen en accenten ---------- */
.mk-hero h1 em, .mk-hero h1 i { font-style: italic; color: #E4C878; }

.mk-eyebrow {
  font-size: .8rem !important; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: #CBBE93;
}
.mk-eyebrow-donker { color: #96690F; }

/* ---------- Knoppen ---------- */
.wp-block-button__link { border-radius: 2px; letter-spacing: .02em; }
.mk-knop-lijn .wp-block-button__link {
  background: transparent; border: 1px solid rgba(251,250,245,.45); color: #FBFAF5;
}
.mk-knop-lijn .wp-block-button__link:hover { border-color: #FBFAF5; background: rgba(251,250,245,.07); }

/* ---------- Artikellijst (query loop) ---------- */
.mk-artikellijst .wp-block-post { border-top: 1px solid #DAD4C2; padding: 1.8rem 0; margin: 0 !important; }
.mk-artikellijst .wp-block-post:last-child { border-bottom: 1px solid #DAD4C2; }
.mk-artikellijst .wp-block-post-title { font-weight: 600; line-height: 1.25; }
.mk-artikellijst .wp-block-post-title a { text-decoration: none; }
.mk-artikellijst .wp-block-post-title a:hover {
  color: #24443B; text-decoration: underline;
  text-decoration-color: #B9872F; text-decoration-thickness: 2px; text-underline-offset: 4px;
}
.mk-artikellijst .wp-block-post-date {
  font-family: var(--wp--preset--font-family--schibsted);
  font-size: .82rem; color: #5C574A; letter-spacing: .06em; text-transform: uppercase;
}
.mk-artikellijst .wp-block-post-excerpt { color: #5C574A; max-width: 62ch; }

/* ---------- Themalijst lezingen ---------- */
.mk-themalijst { list-style: none; padding-left: 0; }
.mk-themalijst li {
  padding: .85rem 0; border-bottom: 1px solid rgba(251,250,245,.15);
  display: flex; gap: .8rem; align-items: baseline;
}
.mk-themalijst li::before {
  content: ""; width: 9px; height: 9px; flex: 0 0 auto;
  border-radius: 50%; border: 1.5px solid #B9872F; transform: translateY(-1px);
}

/* ---------- Promotiestrip ---------- */
.mk-strip { border-bottom: 1px solid #DAD4C2; }
.mk-strip a { color: #96690F; text-underline-offset: 3px; }

/* ---------- Navigatie ---------- */
.wp-block-navigation a:hover { text-decoration: underline; text-decoration-color: #B9872F; text-decoration-thickness: 2px; text-underline-offset: 5px; }

/* ---------- Leesbaarheid artikelen ---------- */
.wp-block-post-content a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.wp-block-post-content { font-size: 1.125rem; }

/* ---------- Toegankelijkheid ---------- */
a:focus-visible, button:focus-visible, .wp-block-button__link:focus-visible {
  outline: 2px solid #B9872F; outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
