/*
Theme Name: Hoeksch Nieuws — Foxiz Child
Description: Nieuwsindeling voor Hoeksch Nieuws op de oorspronkelijke Foxiz-basis.
Author: Hoeksche Media
Template: foxiz
Version: 1.0.1
Requires PHP: 7.4
Text Domain: hoeksch-foxiz-child
*/

:root { --g-color: #078b94; --g-color-90: #078b94e6; --hn-green: #62ae32; }
.hn-home-intro { padding-top: 24px; padding-bottom: 20px; }
.hn-kicker { color: var(--g-color); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.hn-home-title { font-size: clamp(26px, 3vw, 40px); line-height: 1.15; margin: 8px 0 18px; }
.hn-topic-nav { display: flex; flex-wrap: wrap; gap: 8px; }
.hn-topic-nav a { border: 1px solid var(--flex-gray-15, #dbe4e4); border-radius: 4px; padding: 8px 12px; font-size: 14px; font-weight: 700; }
.hn-topic-nav a:hover, .hn-topic-nav a:focus-visible { background: var(--g-color); border-color: var(--g-color); color: #fff; }
.hn-home-news, .hn-category-section { --feat-ratio: 56.25; }
.hn-home-news .p-feat { border-radius: 5px; overflow: hidden; }
.hn-home-news .p-url:hover { color: var(--g-color); }
.hn-home-news .entry-summary { max-width: 65ch; }
.hn-home-widgets { margin: 22px auto; }
.hn-home-widgets:empty { display: none; }
.hn-home-widgets img { max-width: 100%; height: auto; }
.hn-category-section { padding-top: 30px; padding-bottom: 24px; border-top: 3px solid var(--hn-green); }
.hn-category-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 20px; }
.hn-category-heading h2 { font-size: clamp(22px, 2.2vw, 30px); }
.hn-category-heading > a { font-size: 14px; font-weight: 700; color: var(--g-color); white-space: nowrap; }
@media (min-width: 768px) {
  .hn-home-first .blog-content > .block-grid-1 > .block-inner > .p-wrap:first-child { flex-basis: 100%; width: 100%; }
  .hn-home-first .blog-content > .block-grid-1 > .block-inner > .p-wrap:first-child .entry-title { font-size: clamp(26px, 2.5vw, 36px); }
}
@media (max-width: 767px) {
  .hn-home-intro { padding-top: 18px; padding-bottom: 14px; }
  .hn-home-title { font-size: 26px; }
  .hn-topic-nav { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px; }
  .hn-topic-nav a { flex-shrink: 0; }
  .hn-home-news .entry-summary, .hn-category-section .entry-summary { display: none; }
  .hn-category-section { padding-top: 22px; }
}