/* =====================================================================
   Reigerhof Klassiek – de bekende vormgeving, zonder Elementor
   Breekpunten: 1024 (tablet) · 767 (mobiel) – gelijk aan de oude site
   ===================================================================== */

@font-face {
  font-family: "Roboto";
  src: url("../fonts/roboto-var.woff") format("woff");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --rk-navy: #002e86;
  --rk-blue: #0443a1;
  --rk-mid: #6177c6;
  --rk-orange: #ff9302;
  --rk-text: #333;
  --rk-grey: #f5f5f5;
  --rk-line: #dfe3ea;
  --rk-max: 1140px;
  --rk-gutter: 20px;
  /* plugin-variabelen in de klassieke stijl */
  --rh-navy: #002e86;
  --rh-blue: #0443a1;
  --rh-orange: #ff9302;
  --rh-ink: #222;
  --rh-muted: #666;
  --rh-line: #dfe3ea;
  --rh-radius: 4px;
  --rh-radius-sm: 3px;
  --rh-font: "Roboto", Arial, Helvetica, sans-serif;
  --rh-font-head: "Roboto", Arial, Helvetica, sans-serif;
  --rh-wide: 1140px;
  --rh-gutter: 20px;
  --rh-header-h: 0px;
  --rh-shadow: none;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 400 16px/1.6 var(--rh-font); color: var(--rk-text); background: #fff; }
body.rk-nav-open { overflow: hidden; }
img { max-width: 100%; height: auto; }
a { color: var(--rk-blue); }
a:hover { color: var(--rk-navy); }
:focus-visible { outline: 3px solid var(--rk-orange); outline-offset: 2px; }
h1, h2, h3, h4 { font-family: var(--rh-font); color: var(--rk-navy); line-height: 1.2; margin: 0 0 .6em; font-weight: 700; }
p { margin: 0 0 1em; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.rk-skip { position: absolute; left: 10px; top: -60px; background: var(--rk-navy); color: #fff; padding: 10px 16px; z-index: 1000; }
.rk-skip:focus { top: 10px; color: #fff; }
.rk-wrap { max-width: calc(var(--rk-max) + 2 * var(--rk-gutter)); margin-inline: auto; padding-inline: var(--rk-gutter); }
.rk-center { text-align: center; }

/* ---------- header ---------- */
.rk-topstrip { height: 20px; background: var(--rk-navy); }
.rk-hero {
  position: relative; height: clamp(230px, 43vw, 620px);
  background-size: cover; background-position: center bottom; background-repeat: no-repeat; background-color: #fff;
}
.rk-bar {
  max-width: var(--rk-max); margin: 0 auto; display: grid; grid-template-columns: 1fr 215px 1fr; align-items: start; gap: 30px; padding: 0 var(--rk-gutter);
}
.rk-logo { display: block; margin-top: -1px; }
.rk-logo__img { display: block; width: 100%; height: auto; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .12)); }
.rk-menu { list-style: none; margin: 0; padding: 18px 0 0; display: flex; flex-wrap: wrap; gap: 4px 6px; }
.rk-nav--left .rk-menu { justify-content: flex-end; }
.rk-menu a {
  display: block; padding: 6px 14px; color: #fff; font-weight: 700; font-size: 16px; text-decoration: none;
  text-shadow: 0 1px 6px rgba(0, 30, 90, .55); border-radius: 3px; transition: background .15s, color .15s;
}
.rk-menu a:hover { background: rgba(255, 255, 255, .85); color: var(--rk-navy); text-shadow: none; }
.rk-menu .is-active a { color: var(--rk-navy); text-shadow: none; background: rgba(255, 255, 255, .85); }
.rk-burger { display: none; }
.rk-mobilenav[hidden] { display: none; }

@media (max-width: 900px) {
  .rk-topstrip { height: 12px; }
  .rk-hero { height: clamp(200px, 56vw, 400px); background-position: 50% 100%; }
  .rk-bar { grid-template-columns: 1fr; justify-items: center; }
  .rk-nav { display: none; }
  .rk-logo { width: clamp(110px, 30vw, 170px); }
  .rk-burger {
    display: grid; place-items: center; position: absolute; right: 14px; top: 12px; width: 50px; height: 50px; border: 0; border-radius: 50%;
    background: var(--rk-navy); color: #fff; cursor: pointer; box-shadow: 0 4px 14px rgba(0, 0, 0, .25); z-index: 5;
  }
  .rk-burger__lines, .rk-burger__lines::before, .rk-burger__lines::after { display: block; width: 22px; height: 2px; background: currentColor; position: relative; transition: transform .2s, background .2s; }
  .rk-burger__lines::before, .rk-burger__lines::after { content: ""; position: absolute; left: 0; }
  .rk-burger__lines::before { top: -7px; } .rk-burger__lines::after { top: 7px; }
  .rk-burger[aria-expanded="true"] { background: var(--rk-orange); color: var(--rk-navy); }
  .rk-burger[aria-expanded="true"] .rk-burger__lines { background: transparent; }
  .rk-burger[aria-expanded="true"] .rk-burger__lines::before { transform: translateY(7px) rotate(45deg); }
  .rk-burger[aria-expanded="true"] .rk-burger__lines::after { transform: translateY(-7px) rotate(-45deg); }
  .rk-mobilenav { position: fixed; inset: 0; z-index: 4; background: var(--rk-navy); padding: 84px 24px 30px; overflow-y: auto; }
  .rk-mobilenav__menu { list-style: none; margin: 0; padding: 0; }
  .rk-mobilenav__menu a { display: block; padding: 14px 4px; color: #fff; text-decoration: none; font-size: 22px; font-weight: 700; border-bottom: 1px solid rgba(255, 255, 255, .15); }
  .rk-mobilenav__menu .is-active a { color: var(--rk-orange); }
  .rk-mobilenav__extra { color: #fff; margin: 18px 4px 0; }
  .rk-mobilenav__extra a { color: #fff; }
}

/* ---------- inhoud ---------- */
.rk-main { padding-bottom: 50px; }
.rk-main--home { padding-top: 10px; }
.rk-titel { text-align: center; font-size: clamp(26px, 4vw, 34px); color: var(--rk-navy); margin: 36px var(--rk-gutter) 22px; }
.rk-content { max-width: calc(var(--rk-max) + 2 * var(--rk-gutter)); margin: 0 auto; padding: 0 var(--rk-gutter); }
.rk-content > .rk-titel { margin-left: 0; margin-right: 0; }
.rk-ondertitel { text-align: center; font-size: 20px; color: #222; margin-bottom: 26px; }
.rk-kop { text-align: center; color: #0c0899; font-size: clamp(22px, 3vw, 28px); margin: 10px 0 24px; }
.rk-kop-licht { font-weight: 400; color: #111; font-size: 26px; margin: 10px 0 14px; }
h3.rk-kop-licht { font-size: 20px; }
.rk-divider { max-width: var(--rk-max); margin: 0 auto 30px; border: 0; border-top: 2px solid var(--rk-line); }
.wp-block-columns.rk-cols { gap: 40px; margin-bottom: 30px; }
.wp-block-columns.rk-cols--midden { align-items: center; }
@media (max-width: 767px) {
  .wp-block-columns { flex-wrap: wrap !important; gap: 24px !important; }
  .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }
}
.rk-content .wp-block-image img { display: block; }

/* ---------- infobalk (oranje lijn · 2 blauwe vlakken · blauwe lijn) ---------- */
.rk-infobalk { max-width: var(--rk-max); margin: 30px auto; }
.rk-content > .rk-infobalk { margin-left: auto; margin-right: auto; }
.rk-infobalk::before { content: ""; display: block; height: 12px; background: var(--rk-orange); margin-bottom: 20px; }
.rk-infobalk::after { content: ""; display: block; height: 12px; background: var(--rk-blue); margin-top: 20px; }
.rk-infobalk__row { display: grid; grid-template-columns: 1fr 120px 1.05fr; gap: 0; align-items: stretch; }
.rk-infobalk__box, .rk-infobalk__row > p {
  margin: 0 !important; background: var(--rk-blue); color: #fff; font-weight: 700; font-size: 20px; line-height: 1.2;
  display: flex; align-items: center; justify-content: center; text-align: center; min-height: 78px; padding: 12px 20px;
}
.rk-infobalk__box a { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: .5em; }
.rk-infobalk__box a:hover { text-decoration: underline; }
.rk-infobalk__icon { margin: 0 !important; display: grid; place-items: center; }
.rk-infobalk__icon img { width: 60px; height: 60px; object-fit: contain; }
.rk-infobalk__adres { margin-top: 20px; }
.rk-infobalk__adres a { display: flex; justify-content: center; align-items: center; gap: .5em; background: var(--rk-blue); color: #fff; font-weight: 700; font-size: 18px; padding: 16px 20px; text-decoration: none; }
@media (max-width: 767px) {
  .rk-infobalk__row { grid-template-columns: 1fr; }
  .rk-infobalk__icon { padding: 14px 0; }
  .rk-infobalk__box, .rk-infobalk__row > p { font-size: 18px; min-height: 58px; }
}

/* ---------- tabs ---------- */
.rk-tabs { max-width: var(--rk-max); margin: 0 auto; }
.rk-tabs__nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }
.rk-tabs__btn {
  border: 0; background: var(--rk-navy); color: rgba(255, 255, 255, .72); font: 400 17px/1 var(--rh-font); padding: 18px 35px; cursor: pointer; border-radius: 0; transition: background .15s, color .15s;
}
.rk-tabs__btn:hover { background: var(--rk-blue); color: #fff; }
.rk-tabs__btn[aria-selected="true"] { color: #fff; font-weight: 500; box-shadow: inset 0 -4px 0 var(--rk-orange); }
.rk-tabs.is-ready .rk-tab[hidden] { display: none; }
.rk-tabs.is-ready .rk-tab__titel { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }
.rk-tab__titel { text-align: center; }
@media (max-width: 767px) {
  .rk-tabs__nav { flex-direction: column; gap: 8px; }
  .rk-tabs__btn { width: 100%; padding: 16px; }
}

/* ---------- honingraat (zoals de oude site: rijen van 5 en 4) ---------- */
.rk .rh-winkels--honingraat .rh-filter { justify-content: center; }
.rk .rh-honeycomb {
  --s: 178px; --g: 22px;
  display: grid; width: auto; max-width: calc(5 * var(--s) + 4 * var(--g)); margin: 0 auto; padding: 0 0 calc(var(--s) * .29);
  grid-template-columns: repeat(10, calc((var(--s) + var(--g)) / 2)); justify-content: center;
}
.rk .rh-hex { grid-column: span 2; width: var(--s); margin: 0 0 calc(var(--s) * -0.29 + 8px); transform: none !important; }
.rk .rh-hex:nth-child(9n + 6) { grid-column: 2 / span 2; }
.rk .rh-hex a { aspect-ratio: 1 / 1.1547; clip-path: var(--rh-hex-v); background: #f6f6f6; padding: 0; }
.rk .rh-hex__inner { clip-path: var(--rh-hex-v); background: #f6f6f6; }
.rk .rh-hex .rh-logo { width: 78%; height: 62%; object-fit: contain; mix-blend-mode: multiply; }
.rk .rh-hex a:hover, .rk .rh-hex a:focus-visible { background: var(--rk-orange); transform: scale(1.04); }
.rk .rh-hex__name { clip-path: var(--rh-hex-v); padding: 0 16%; font: 700 15px/1.2 var(--rh-font); }
@media (max-width: 1024px) {
  .rk .rh-honeycomb { --s: 160px; --g: 16px; max-width: calc(4 * var(--s) + 3 * var(--g)); grid-template-columns: repeat(8, calc((var(--s) + var(--g)) / 2)); }
  .rk .rh-hex:nth-child(9n + 6) { grid-column: span 2; }
  .rk .rh-hex:nth-child(7n + 5) { grid-column: 2 / span 2; }
}
@media (max-width: 767px) {
  /* mobiel: rijen van 3 en 2 */
  .rk .rh-honeycomb { --g: 8px; --s: min(29vw, 150px); max-width: calc(3 * var(--s) + 2 * var(--g)); grid-template-columns: repeat(6, calc((var(--s) + var(--g)) / 2)); }
  .rk .rh-hex:nth-child(9n + 6), .rk .rh-hex:nth-child(7n + 5) { grid-column: span 2; }
  .rk .rh-hex:nth-child(5n + 4) { grid-column: 2 / span 2; }
  .rk .rh-hex__name { font-size: 12px; padding: 0 12%; }
}
.rk .rh-winkels.is-filtering .rh-honeycomb { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: none; padding-bottom: 0; }
.rk .rh-winkels.is-filtering .rh-hex { margin: 0; }

/* ---------- plattegrond ---------- */
.rk .rh-map__stage { border-radius: 0; box-shadow: none; }
.rk .rh-map__group a { border-radius: 0; }
.rk .rh-map__group .nr { border-radius: 0; }
.rk .rh-map__group-title { font-family: var(--rh-font); }
.rk .rh-map__toolbar .rh-search { max-width: 360px; }
.rk .rh-search { border-radius: 3px; }
.rk .rh-map__zoom { border-radius: 3px; }

/* ---------- winkelkaartje (toiletten) ---------- */
.rk .rh-mini { border: 0; box-shadow: none; padding: 0; margin: 0 0 26px; }
.rk .rh-mini__logo { width: 150px; height: 80px; border: 0; border-radius: 0; display: block; overflow: visible; }
.rk .rh-mini__logo .rh-logo { width: 100%; height: 100%; object-fit: contain; object-position: left center; padding: 0; }
.rk .rh-mini__head { flex-wrap: wrap; }
.rk .rh-mini__name { color: var(--rk-navy); font-size: 18px; }
.rk .rh-week--compact { max-width: 420px; }
.rk .rh-week th, .rk .rh-week td { border-bottom: 1px solid #eee; font-weight: 400; }
.rk .rh-week tr.is-today th, .rk .rh-week tr.is-today td { background: #eef3fb; color: var(--rk-navy); font-weight: 700; }

/* ---------- openingstijden per winkel ---------- */
.rk .rh-hours__top { justify-content: center; }
.rk .rh-days { max-width: 760px; }
.rk .rh-day { border-radius: 0; border: 0; background: #e9eef7; color: var(--rk-navy); }
.rk .rh-day.is-active { background: var(--rk-navy); color: #fff; }
.rk .rh-hours__centrum { border-radius: 0; background: #fff4e3; border-left: 6px solid var(--rk-orange); }
.rk .rh-hours__list { display: block; columns: 2 420px; column-gap: 40px; }
.rk .rh-hours__list li { break-inside: avoid; padding: 10px 12px; border-bottom: 0; }
.rk .rh-hours__list li:nth-child(odd) { background: #f3f5fa; }
.rk .rh-hours__name { color: var(--rk-navy); font-weight: 500; }

/* ---------- formulieren & knoppen ---------- */
.rk .rh-btn, .rk-knop { border-radius: 0; background: var(--rk-navy); color: #fff; font-weight: 500; padding: 14px 26px; border: 0; text-decoration: none; display: inline-flex; gap: .5em; align-items: center; }
.rk .rh-btn:hover, .rk-knop:hover { background: var(--rk-blue); color: #fff; transform: none; }
.rk .rh-btn--accent { background: var(--rk-orange); color: #111; }
.rk .rh-form input, .rk .rh-form textarea { border-radius: 0; border: 1px solid #ccc; }
.rk .rh-form label { color: #222; font-weight: 500; }
.rk .rh-chip { border-radius: 0; }
.rk .rh-chip.is-active { background: var(--rk-navy); }

/* ---------- winkelpagina ---------- */
.rk-shop__intro { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; margin-bottom: 20px; }
.rk-shop__intro:not(:has(.rk-shop__right)) { grid-template-columns: 1fr; max-width: 820px; }
.rk-shop__logo { max-width: 420px; margin: 0 0 24px; }
.rk-shop__logo .rh-logo { width: 100%; height: auto; max-height: 260px; object-fit: contain; object-position: left center; }
.rk-shop__logo .rh-logo--placeholder { height: 160px; font-size: 3rem; }
.rk-shop__text { color: #333; }
.rk-shop__photo { width: 100%; height: auto; display: block; }
.rk-socials { display: flex; justify-content: center; gap: 14px; margin: 26px 0 34px; }
.rk-socials a { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--rk-blue); color: #fff; }
.rk-socials a:hover { background: var(--rk-orange); color: var(--rk-navy); }
.rk-socials .rh-icon { width: 26px; height: 26px; }
.rk-shop__band { background: var(--rk-mid); padding: 40px 0; }
.rk-shop__band-inner { display: grid; grid-template-columns: minmax(280px, 400px) 1fr; gap: 30px; align-items: start; }
.rk-shop__band-inner:not(:has(.rk-shop__map)) { grid-template-columns: minmax(280px, 520px); justify-content: center; }
.rk-shop__card { background: #fff; padding: 26px 28px; }
.rk-shop__card h2 { font-size: 24px; margin-bottom: 6px; }
.rk-shop__card .rh-status { margin-bottom: 12px; }
.rk-tijden { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.rk-tijden td { padding: 9px 6px; border-bottom: 1px solid #eee; vertical-align: top; }
.rk-tijden td:last-child { text-align: right; }
.rk-tijden small { display: block; font-size: 12px; color: #777; }
.rk-tijden tr.is-today td { background: #eef3fb; font-weight: 700; color: var(--rk-navy); }
.rk-shop__map { background: #fff; padding: 10px; }
.rk-shop__map .rh-map__legend { margin-top: 6px; }
.rk-shop__fotos { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin-top: 30px; }
.rk-shop__fotos img { width: 100%; height: 400px; object-fit: cover; display: block; }
.rk-back { margin-top: 30px; }
.rk .rh-offer { border-radius: 0; margin-top: 24px; }
@media (max-width: 900px) {
  .rk-shop__intro, .rk-shop__band-inner { grid-template-columns: 1fr; }
  .rk-shop__fotos img { height: 260px; }
}

/* ---------- nieuws ---------- */
.rk-posts { display: grid; gap: 28px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.rk-post { background: #fff; border: 1px solid #e5e5e5; }
.rk-post__img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.rk-post__body { padding: 16px 18px 6px; }
.rk-post__body h2 { font-size: 20px; margin-bottom: 4px; }
.rk-post__body h2 a { color: var(--rk-navy); text-decoration: none; }
.rk-post__date { color: #888; font-size: 14px; }
.rk-single-img img { width: 100%; height: auto; }
.rk-pagination .nav-links { display: flex; gap: 8px; justify-content: center; margin-top: 30px; }
.rk-pagination .page-numbers { padding: 8px 14px; background: #eef2f9; text-decoration: none; }
.rk-pagination .current { background: var(--rk-navy); color: #fff; }

/* ---------- interieurfoto + footer ---------- */
.rk-fotoband { height: clamp(180px, 33vw, 480px); background-size: cover; background-position: center 60%; }
.rk-footer { background: var(--rk-navy); color: #fff; font-size: 14px; }
.rk-footer__inner {
  max-width: calc(var(--rk-max) + 2 * var(--rk-gutter)); margin: 0 auto; padding: 34px var(--rk-gutter) 30px;
  display: grid; grid-template-columns: 150px 1.15fr 1fr 1fr 1.2fr; gap: 30px;
}
.rk-footer h2 { color: #fff; font-size: 17px; margin: 0 0 10px; }
.rk-footer__logo-img { width: 130px; height: auto; display: block; }
.rk-footer a { color: #fff; text-decoration: none; }
.rk-footer a:hover { text-decoration: underline; }
.rk-footer__list { list-style: none; margin: 0; padding: 0; }
.rk-footer__list li, .rk-footer .rh-centrum-tijden th, .rk-footer .rh-centrum-tijden td { padding: 13px 14px; }
.rk-footer__list li:nth-child(odd) { background: rgba(255, 255, 255, .06); }
.rk-footer__social a { display: inline-flex; align-items: center; gap: 6px; }
.rk-footer__social .rh-icon { width: 15px; height: 15px; }
.rk-footer .rh-centrum-tijden { max-width: 260px; }
.rk-footer .rh-centrum-tijden th { font-weight: 400; color: #fff; }
.rk-footer .rh-centrum-tijden td { text-align: left; }
.rk-footer .rh-centrum-tijden tr:nth-child(odd) { background: rgba(255, 255, 255, .06); }
.rk-footer .rh-centrum-tijden tr.is-today th, .rk-footer .rh-centrum-tijden tr.is-today td { color: var(--rk-orange); font-weight: 700; }
.rk-footer__copy { margin: 0; text-align: center; padding: 14px var(--rk-gutter) 18px; border-top: 1px solid rgba(255, 255, 255, .12); color: #c9d4f0; font-size: 13px; }
@media (max-width: 1024px) { .rk-footer__inner { grid-template-columns: 1fr 1fr 1fr; } .rk-footer__logo { grid-column: 1 / -1; } }
@media (max-width: 600px) {
  .rk-footer__inner { grid-template-columns: 1fr; gap: 26px; }
  .rk-footer__logo { justify-self: center; }
  .rk-footer .rh-centrum-tijden { max-width: none; }
}

/* ---------- vertrokken winkel / 404 (plugin-template) ---------- */
.rk .rh-gone h1 { font-family: var(--rh-font); text-align: center; }

/* Facebook-berichten (Nieuws & Events) in klassieke stijl */
.rk .rh-fb__post, .rk .rh-fb__consent { border-radius: 0; box-shadow: none; border-color: #dfe3ea; }
.rk .rh-fb__date { color: var(--rk-blue); }
.rk .rh-fb__more, .rk .rh-fb__title, .rk .rh-fb__event { color: var(--rk-navy); }
.rk .rh-fb__title { font-family: var(--rh-font); font-weight: 700; }
.rk .rh-btn--fb { background: #1877f2; }
.rk .rh-btn--fb:hover { background: #0e5fc7; }
.rk .rh-fb__badge { border-radius: 0; }
.rk-fb-kop { margin-top: 56px; text-align: center; }