/* ============================================================
   Rondom Internet - BERICHTEN (blog / kennisbank) huisstijl
   Stijlt losse artikelen, de berichtenlijst, meta-info en reacties
   in de huisstijl en overschrijft Divi's standaard-blauw.
   Plaats als assets/ri-berichten.css (zie functions.php) OF plak
   in Divi > Theme Options > Custom CSS.
   ============================================================ */

:root{
  --ri-ink:#0D1B2A;
  --ri-ink-soft:#52606D;
  --ri-red:#E63946;
  --ri-teal:#1F9E8F;
  --ri-amber:#E9A23B;
  --ri-hairline:#DCE2E8;
  --ri-surface:#FFFFFF;
  --ri-display:"Bricolage Grotesque",system-ui,sans-serif;
  --ri-body:"Inter",system-ui,sans-serif;
  --ri-mono:"IBM Plex Mono",ui-monospace,monospace;
}

/* ---- Berichttitel ---- */
.single-post .entry-title,
.et_pb_post .entry-title,
h1.entry-title,
.et_pb_title_container .entry-title{
  font-family:var(--ri-display);
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--ri-ink);
  line-height:1.1;
}
.et_pb_post .entry-title a{color:var(--ri-ink)}
.et_pb_post .entry-title a:hover{color:var(--ri-red)}

/* ---- Meta-info (datum, auteur, categorie) ---- */
.et_pb_post .post-meta,
.single .et_pb_post .post-meta,
.post-meta,
.et_pb_blog_grid .post-meta{
  font-family:var(--ri-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ri-ink-soft);
}
.post-meta a{color:var(--ri-ink-soft)}
.post-meta a:hover{color:var(--ri-red)}

/* ---- Berichtenlijst: kaarten ---- */
.archive .et_pb_post,
.blog .et_pb_post,
.search-results .et_pb_post,
.et_pb_blog_grid .et_pb_post{
  background:var(--ri-surface);
  border:1px solid var(--ri-hairline);
  border-radius:16px;
  padding:1.5rem;
  transition:transform .2s ease, box-shadow .2s ease;
}
.archive .et_pb_post:hover,
.blog .et_pb_post:hover,
.et_pb_blog_grid .et_pb_post:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 40px rgba(13,27,42,.12);
}
.et_pb_post .entry-featured-image-url img,
.et_pb_post .et_pb_image_container img,
.et_pb_post a img{border-radius:10px;margin-bottom:.4rem}

/* ---- Artikelinhoud: typografie ---- */
.single-post .entry-content,
.et_pb_post_content{
  color:var(--ri-ink);
  font-family:var(--ri-body);
  font-size:1.04rem;
  line-height:1.7;
}
.single-post .entry-content p,
.et_pb_post_content p{margin-bottom:1.1rem}

.single-post .entry-content a,
.et_pb_post_content a{
  color:var(--ri-ink);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-color:var(--ri-hairline);
}
.single-post .entry-content a:hover,
.et_pb_post_content a:hover{color:var(--ri-red);text-decoration-color:var(--ri-red)}

.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4,
.et_pb_post_content h2,
.et_pb_post_content h3,
.et_pb_post_content h4{
  font-family:var(--ri-display);
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--ri-ink);
  margin:1.8rem 0 .6rem;
  line-height:1.15;
}
.single-post .entry-content ul,
.single-post .entry-content ol,
.et_pb_post_content ul,
.et_pb_post_content ol{padding-left:1.3rem;margin-bottom:1.1rem}
.single-post .entry-content li,
.et_pb_post_content li{margin-bottom:.4rem}

.single-post .entry-content img,
.et_pb_post_content img{border-radius:12px}

/* Citaten */
.single-post .entry-content blockquote,
.et_pb_post_content blockquote{
  border-left:4px solid var(--ri-red);
  background:#F1F4F7;
  border-radius:0 12px 12px 0;
  padding:1rem 1.3rem;
  margin:1.4rem 0;
  font-style:normal;
  color:var(--ri-ink);
}

/* ---- "Lees verder" ---- */
.et_pb_post .more-link,
.entry-content .more-link{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--ri-body);
  font-weight:600;
  color:var(--ri-red);
}
.et_pb_post .more-link:hover{color:var(--ri-red)}

/* ---- Paginering ---- */
.wp-pagenavi a,
.wp-pagenavi span.current,
.pagination .page-numbers,
nav.navigation .nav-links a{
  border-radius:8px;
  color:var(--ri-ink);
  border:1px solid var(--ri-hairline);
  padding:.4em .8em;
}
.wp-pagenavi span.current,
.pagination .page-numbers.current{
  background:var(--ri-ink) !important;
  color:#fff !important;
  border-color:var(--ri-ink);
}
.pagination a:hover,nav.navigation .nav-links a:hover{border-color:var(--ri-ink)}

/* Oudere/nieuwere berichten links onder een artikel */
.single .nav-links a{color:var(--ri-ink)}
.single .nav-links a:hover{color:var(--ri-red)}

/* ---- Reacties ---- */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
  border:1px solid var(--ri-hairline);
  border-radius:12px;
  padding:.7em .9em;
  font-family:var(--ri-body);
  width:100%;
}
.comment-form input:focus,
.comment-form textarea:focus{outline:2px solid var(--ri-ink);outline-offset:1px;border-color:transparent}
.comment-form #submit,
.comment-reply-link{
  background:var(--ri-ink) !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  padding:.7em 1.4em;
  font-weight:600;
  font-family:var(--ri-body);
}
.comment-form #submit:hover,
.comment-reply-link:hover{background:#1B2A3D !important}
.comment-author .fn,.comment .comment-meta{font-family:var(--ri-body)}

/* ---- Categorie-/tag-links algemeen blauw weghalen ---- */
.single-post a:not(.button):not(.more-link):hover{color:var(--ri-red)}