/*
Theme Name: Horizon 65
Theme URI: https://horizon65.be
Author: Horizon 65
Description: Blokthema voor horizon65.be, opgebouwd volgens het huisstijlhandboek en het draaiboek voor de nieuwe website.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.4
Version: 0.4.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: horizon65
*/
:root{--dot:#98645B;--ring:#2D5A75}
body{-webkit-font-smoothing:antialiased}
strong{font-weight:500}
.lead{font-size:clamp(1.15rem,1.8vw,1.35rem);line-height:1.5}

/* header */
.h65-top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #DCE3E8}
.admin-bar .h65-top{top:32px}
@media (max-width:782px){.admin-bar .h65-top{top:46px}}
.h65-top-inner{min-height:76px;gap:24px}
.h65-brand{line-height:0}
.h65-brand .wp-block-image{margin:0}
.h65-brand img{height:46px;width:auto;display:block}
.h65-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0!important}
.h65-donker{display:none!important}
@media (prefers-color-scheme: dark){.h65-licht{display:none!important}.h65-donker{display:block!important}}
.h65-top .wp-block-navigation{font-weight:400;font-size:.98rem;gap:22px}
.h65-top .wp-block-navigation-item__content:hover{text-decoration:underline;text-decoration-color:#98645B;text-underline-offset:8px;text-decoration-thickness:2px}
.h65-top .wp-block-navigation__submenu-container{border:1px solid #DCE3E8!important;border-radius:8px;padding:6px 0}
@media (max-width:900px){.h65-top .h65-hd-btn{display:none}}

/* outline buttons */
.wp-block-button.is-style-outline>.wp-block-button__link{background:transparent;color:#0D2E40;border:1.5px solid #0D2E40}
.wp-block-button.is-style-outline>.wp-block-button__link:hover{background:#F5F6F8}

/* watermarks */
.h65-hero,.h65-pagehero,.h65-kern,.h65-band{position:relative;overflow:hidden}
.h65-hero::after,.h65-pagehero::after,.h65-kern::after{content:"";position:absolute;border-radius:50%;pointer-events:none;aspect-ratio:1}
.h65-hero::after{width:min(640px,90vw);right:max(-320px,-45vw);top:-200px;background:rgba(230,177,153,.28)}
.h65-pagehero::after{width:min(520px,80vw);right:-220px;bottom:-300px;background:rgba(230,177,153,.28)}
.page-child .h65-pagehero::after{right:auto;left:-260px;top:-300px;bottom:auto}
.h65-kern::after{width:520px;left:-300px;top:-260px;background:rgba(230,177,153,.12)}
.h65-hero>*,.h65-pagehero>*,.h65-kern>*{position:relative;z-index:1}

/* home */
.h65-hero{background:#F5F6F8;padding-top:clamp(56px,9vw,120px)!important;padding-bottom:clamp(56px,8vw,104px)!important}
.h65-hero>*+*{margin-top:32px!important}
.h65-logo-big{margin:0!important;line-height:0}
.h65-logo-big img{width:min(620px,100%);height:auto}
.h65-icoon{margin:0 0 6px!important;line-height:0}
.h65-icoon img{height:112px;width:auto}
.h65-foto-img img{aspect-ratio:1}
.h65-hero .lead{max-width:34ch}
.h65-band{padding-top:clamp(64px,9vw,112px)!important;padding-bottom:clamp(64px,9vw,112px)!important}
.h65-intro{color:#4A6577;max-width:62ch;margin-bottom:clamp(28px,4vw,48px)!important}
.h65-pijlers{gap:clamp(28px,4vw,56px)!important}
.h65-icoon{line-height:0}
.h65-sub{color:#98645B;font-weight:400;margin-top:4px!important}
.h65-kern{background:#2D5A75;color:#DCE6EC;padding-top:clamp(64px,9vw,112px)!important;padding-bottom:clamp(64px,9vw,112px)!important}
.h65-kern h2{color:#fff}
.h65-teamlijst{list-style:none;padding:0;columns:2;column-gap:56px}
.h65-teamlijst li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #DCE3E8;break-inside:avoid}
.h65-teamlijst strong{font-weight:400}
.h65-teamlijst span{color:#4A6577;text-align:right}
@media (max-width:700px){.h65-teamlijst{columns:1}}
.h65-prak{background:#0D2E40;color:#E8EEF2;padding-top:clamp(64px,9vw,112px)!important;padding-bottom:clamp(64px,9vw,112px)!important}
.h65-prak h2{color:#fff}.h65-prak h3{color:#E6B199;font-size:1.25rem}
.h65-prak a{color:#fff}
.h65-prak .wp-block-button__link,.h65-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link{background:#E6B199;color:#0D2E40}
.h65-prak .wp-block-button__link:hover,.h65-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:#F0C7B3}

/* inner pages */
.h65-pagehero{background:#F5F6F8;padding-top:clamp(48px,7vw,88px)!important;padding-bottom:clamp(40px,6vw,72px)!important}
.h65-pagehero h1{margin:0}
.h65-main .wp-block-post-content{padding-top:clamp(40px,6vw,72px)}
.h65-main .wp-block-post-content>h2{margin-top:2.2em}
.h65-main .wp-block-post-content>h3{margin-top:1.8em}
.h65-dots{list-style:none;padding:0}
.h65-dots li{position:relative;padding-left:22px;margin:6px 0}
.h65-dots li::before{content:"";position:absolute;left:3px;top:.6em;width:8px;height:8px;border-radius:50%;background:#98645B}
.h65-todo{background:#FBF1EC;border:1.5px dashed #E6B199;border-radius:10px;padding:14px 18px}
.h65-diensten{border-top:1px solid #DCE3E8}
.h65-diensten>.h65-dienst{margin:0!important;padding:22px 0;border-bottom:1px solid #DCE3E8}
.h65-dienst h3{font-size:1.2rem}
.h65-dienst p{color:#4A6577;margin-top:6px!important}
.h65-note{background:#2D5A75;color:#E3EBF0;border-radius:14px;padding:clamp(22px,3vw,32px)!important;margin-top:2em!important}
.h65-note h2{color:#fff;font-size:1.4rem}
.h65-tabelkop{color:#98645B;font-weight:400;margin-top:1.6em!important}
.h65-tabel table{border-collapse:collapse}
.h65-tabel td{border:0;border-bottom:1px solid #DCE3E8;padding:11px 0}
.h65-tabel td:last-child{text-align:right;font-weight:400}
.h65-kaart{background:#F5F6F8;border-radius:14px;padding:24px!important;height:100%}
.h65-kaart h3 a{text-decoration:none;color:#0D2E40}
.h65-kaart p{color:#4A6577}
.h65-profiel{border-top:1px solid #DCE3E8;padding:36px 0!important}
.h65-profiel:first-of-type{border-top:0}
.h65-beeld{margin-top:2em!important;margin-bottom:.9em!important}
.h65-beeld img,.h65-beelden img{border-radius:14px;width:100%;height:auto;display:block}
.h65-beelden{margin-top:2em!important;gap:16px!important}
.h65-beelden .h65-beeld{margin:0!important}
.h65-beelden .h65-beeld img{aspect-ratio:4/3;object-fit:cover}
.h65-kernkol{align-items:center!important;gap:clamp(28px,5vw,72px)!important}
.h65-kern .h65-beeld{margin:0!important}
.h65-foto-img{margin:0!important}
.h65-bijsch summary{cursor:pointer;color:#2D5A75}
.h65-foto-img img{width:120px;height:120px;border-radius:50%;object-fit:cover;display:block}
.h65-routes-wrap{max-width:1120px!important}
.h65-routes{gap:20px!important}
.h65-map{display:block;width:100%;aspect-ratio:4/3;border:0;border-radius:14px;background:#F5F6F8}
.h65-map-klein{aspect-ratio:16/10;max-width:320px;margin-top:12px}
.h65-adres{gap:24px!important}
.h65-adres .h65-map{max-width:420px}
html{scroll-behavior:smooth;scroll-padding-top:96px}
.h65-route{background:#F5F6F8;border-radius:14px;padding:26px!important;height:100%;display:flex;flex-direction:column}
.h65-route h2{font-size:1.4rem;margin:0}
.h65-route .wp-block-buttons{margin-top:auto!important;padding-top:8px}
.h65-foto{width:120px;height:120px;border-radius:50%;background:#F5F6F8;display:grid;place-items:center;font-size:1.8rem;color:#98645B;box-shadow:inset 0 0 0 2px #DCE3E8}
.h65-profiel h2{font-size:1.6rem;margin:0}
.h65-details{color:#0D2E40}
.h65-slagzin{padding-left:18px;border-left:3px solid #E6B199;font-size:1.08rem}
.h65-cta{background:#0D2E40;color:#D5E0E7;padding-top:clamp(48px,7vw,80px)!important;padding-bottom:clamp(48px,7vw,80px)!important;margin-top:clamp(48px,7vw,88px)!important}
.h65-cta h2{color:#fff}
.h65-cta .is-style-outline>.wp-block-button__link{color:#fff;border-color:#fff}
.h65-cta .is-style-outline>.wp-block-button__link:hover{background:rgba(255,255,255,.08)}

/* ===== achtergrond met cirkels en kaarten (v0.4) ===== */
:root{--tint:#F5F6F8;--hero:#E9EFF3;--card:#FFFFFF;--cardline:rgba(13,46,64,.07);--shadow:0 1px 2px rgba(13,46,64,.04),0 10px 30px rgba(13,46,64,.06);
  --disc:rgba(230,177,153,.30);--disc2:rgba(45,90,117,.07);--ringc:rgba(45,90,117,.22);--dotsop:.16;--accent:#98645B}
.h65-hero,.h65-pagehero{background:var(--hero)!important}
.h65-main:not(.h65-home) .wp-block-post-content,.h65-deco{position:relative;isolation:isolate;background:var(--tint)}
.h65-main:not(.h65-home) .wp-block-post-content{padding-bottom:0}
.h65-main:not(.h65-home) .wp-block-post-content::before,.h65-deco::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(circle at calc(100% - 150px) 220px,var(--disc) 0 210px,transparent 211px),
  radial-gradient(circle at calc(100% - 330px) 470px,transparent 0 148px,var(--ringc) 149px 151px,transparent 152px),
  radial-gradient(circle at 40px calc(100% - 90px),var(--disc2) 0 150px,transparent 151px);background-attachment:fixed}
.h65-main:not(.h65-home) .wp-block-post-content::after,.h65-deco::after{content:"";position:absolute;right:max(24px,calc((100% - 1120px)/2 + 10px));bottom:80px;width:230px;aspect-ratio:1;z-index:-1;pointer-events:none;opacity:var(--dotsop);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='46.98 36.29 172.82 173.95'%3E%3Cg fill='%2398645B'%3E%3Ccircle cx='140.11' cy='192.93' r='15.3'/%3E%3Ccircle cx='92.65' cy='184.4' r='13.85'/%3E%3Ccircle cx='181.92' cy='168.84' r='17.4'/%3E%3Ccircle cx='61.74' cy='147.27' r='11.67'/%3E%3Ccircle cx='61.86' cy='98.87' r='12.89'/%3E%3Ccircle cx='182.15' cy='77.9' r='17.18'/%3E%3Ccircle cx='92.95' cy='61.9' r='14.02'/%3E%3Ccircle cx='140.46' cy='53.6' r='15.32'/%3E%3C/g%3E%3Ccircle cx='197.92' cy='124.01' r='17.02' fill='none' stroke='%232D5A75' stroke-width='5.71'/%3E%3C/svg%3E") center/contain no-repeat}
.h65-main:not(.h65-home) .wp-block-post-content:has(> .h65-cta:last-child)::after{bottom:clamp(300px,30vw,380px)}
@media (max-width:900px){.h65-main:not(.h65-home) .wp-block-post-content::before,.h65-deco::before{opacity:.55;background-attachment:scroll}.h65-main:not(.h65-home) .wp-block-post-content::after,.h65-deco::after{width:140px}}
.wp-block-post-content>h2::before{content:"";display:block;width:36px;height:3px;border-radius:2px;background:var(--accent);margin-bottom:14px}
.h65-route,.h65-kaart,.h65-pijlers>.wp-block-column{background:var(--card)!important;border:1px solid var(--cardline);box-shadow:var(--shadow)}
.h65-pijlers>.wp-block-column{border-radius:18px;padding:28px!important;display:flex;flex-direction:column}
.h65-pijlers>.wp-block-column>.wp-block-buttons{margin-top:auto!important;padding-top:12px}
.h65-diensten{border-top:0!important;display:grid;gap:12px}
.h65-diensten>.h65-dienst{background:var(--card);border:1px solid var(--cardline)!important;border-radius:14px;padding:22px 24px!important;box-shadow:var(--shadow)}
.h65-profiel{background:var(--card);border:1px solid var(--cardline)!important;border-radius:18px;padding:28px!important;box-shadow:var(--shadow);margin-top:18px!important}
.h65-tabel{background:var(--card);border:1px solid var(--cardline);border-radius:14px;padding:6px 22px;box-shadow:var(--shadow)}
.h65-tabel tr:last-child td{border-bottom:0}
.h65-map{box-shadow:var(--shadow)}

/* ===== donkere modus ===== */
@media (prefers-color-scheme: dark){
  :root{--dot:#B87A70;--ring:#E6B199;--accent:#E6B199;--tint:#0F3247;--hero:#12384D;--card:#14405A;--cardline:rgba(255,255,255,.06);
    --shadow:0 1px 2px rgba(0,0,0,.2),0 10px 30px rgba(0,0,0,.18);--disc:rgba(230,177,153,.08);--disc2:rgba(230,177,153,.05);--ringc:rgba(230,177,153,.18);--dotsop:.10;color-scheme:dark}
  body{background:#0D2E40!important;color:#F5F6F8!important}
  h1,h2,h3,h4,.wp-block-post-title{color:#F5F6F8!important}
  a{color:#E6B199}
  .h65-top{background:#0D2E40;border-bottom-color:#24506A}
  .h65-top .wp-block-navigation-item__content{color:#F5F6F8}
  .h65-top .wp-block-navigation__submenu-container,.wp-block-navigation__responsive-container.is-menu-open{background:#0D2E40!important;color:#F5F6F8!important;border-color:#24506A!important}
  .wp-element-button,.wp-block-button__link{background:#E6B199;color:#0D2E40}
  .wp-block-button__link:hover{background:#F0C7B3}
  .wp-block-button.is-style-outline>.wp-block-button__link{background:transparent;color:#F5F6F8;border-color:#F5F6F8}
  .wp-block-button.is-style-outline>.wp-block-button__link:hover{background:rgba(255,255,255,.08)}
  .h65-intro,.h65-dienst p,.h65-kaart p,.h65-teamlijst span{color:#B8C6D0}
  .h65-sub,.h65-tabelkop,.h65-bijsch summary{color:#E6B199}
  .h65-teamlijst li,.h65-tabel td{border-bottom-color:#24506A}
  .h65-details,.h65-kaart h3 a{color:#F5F6F8}
  .h65-todo{background:#173F55;border-color:#B87A70}
  .h65-foto{background:#12384D;color:#E6B199;box-shadow:inset 0 0 0 2px #24506A}
  .h65-slagzin{border-left-color:#B87A70}
  .h65-map{background:#12384D}
}

/* taalkeuze en header */
.h65-talen{display:flex;justify-content:flex-end;gap:2px;font-size:.82rem;padding:5px 0;border-bottom:1px solid var(--cardline)}
.h65-talen a{padding:3px 8px;border-radius:8px;color:#4A6577;text-decoration:none;font-weight:400}
.h65-talen a[aria-current]{background:#F5F6F8;color:#0D2E40;font-weight:500}
.h65-top .wp-block-navigation{font-size:.94rem;gap:18px}
@media (max-width:1300px){.h65-top .h65-hd-btn{display:none}}
@media (max-width:1100px){
  .h65-top .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex!important}
  .h65-top .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none!important}
}
@media (prefers-color-scheme: dark){.h65-talen a{color:#B8C6D0}.h65-talen a[aria-current]{background:#12384D;color:#F5F6F8}}

/* footer */
.h65-footer{background:#0D2E40;color:#C9D6DE;border-top:1px solid rgba(255,255,255,.12);padding-top:40px!important;padding-bottom:40px!important;margin-top:0!important}
.h65-footer a{color:#fff}
.h65-footer img{height:52px;width:auto;display:block}
.h65-flogo{margin:0!important}
.h65-footer p{font-size:.9rem}
