:root {
  --beto: #2a3b39;
  --ziba: #f6faf8;
  --kezu: #ffffff;
  --sahu: #2f9e8f;
  --vame: #23786c;
  --fedi: #5f9fc4;
  --ziti: #e39d76;
  --vobe: #6a7a77;
  --defa: #e3ede9;
  --vodo: "DM Serif Display", Georgia, serif;
  --sovu: "DM Sans", system-ui, sans-serif;
  --besi: 1120px;
  --mimo: 18px;
  --beti: 0 10px 30px rgba(42, 59, 57, .07);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--sovu); color: var(--beto); background: var(--ziba); line-height: 1.68; font-size: 17px; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.hebera { max-width: var(--besi); margin: 0 auto; padding: 0 clamp(1rem, 4vw, 1.8rem); }
.gizo { background: var(--kezu); border-bottom: 1px solid var(--defa); font-size: .82rem; color: var(--vobe); }
.gizo .hebera { display: flex; justify-content: space-between; align-items: center; height: 40px; }
.gizo .bukage { display: flex; align-items: center; gap: .4rem; }
.gizo .bukage b { color: var(--vame); }
.gizo .muba a { color: var(--vobe); margin-left: 1.2rem; }
.gizo .muba a:hover { color: var(--sahu); }
.vide { background: var(--kezu); }
.vide .hebera { display: flex; align-items: center; justify-content: space-between; padding: 1.3rem 0; gap: 1rem; }
.pahe { font-family: var(--vodo); font-size: clamp(1.6rem, 3.6vw, 2.1rem); color: var(--vame); display: flex; align-items: center; gap: .55rem; }
.pahe .mugu { width: 30px; height: 30px; flex: none; background: var(--sahu); border-radius: 50% 50% 50% 0; transform: rotate(45deg); position: relative; }
.pahe .mugu::before, .pahe .mugu::after { content: ""; position: absolute; width: 30px; height: 30px; background: var(--sahu); border-radius: 50%; }
.pahe .mugu::before { top: -15px; left: 0; } .pahe .mugu::after { top: 0; right: -15px; }
.pahe span { color: var(--fedi); }
.vide .cta { background: var(--sahu); color: #fff; font-weight: 700; font-size: .9rem; padding: .6rem 1.2rem; border-radius: 999px; }
.vide .cta:hover { background: var(--vame); }
.bovu { background: var(--ziba); border-top: 1px solid var(--defa); border-bottom: 1px solid var(--defa); position: sticky; top: 0; z-index: 40; }
.bovu .hebera { display: flex; align-items: center; gap: .3rem; }
.bovu a { font-weight: 500; font-size: .9rem; color: var(--beto); padding: .85rem 1rem; border-radius: 999px; }
.bovu a:hover { color: var(--vame); }
.bovu a.kigo { color: var(--vame); font-weight: 700; }
.bovu .zapebu { display: none; margin-left: auto; background: none; border: 0; font-size: 1.4rem; cursor: pointer; color: var(--vame); }
.padozi { padding: clamp(1.8rem, 4vw, 3rem) 0; }
.gokobe { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.6rem, 3.5vw, 3rem); align-items: center; }
.padozi .some .mifaho { font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--sahu); }
.padozi .some h1 { font-family: var(--vodo); font-size: clamp(1.9rem, 4.4vw, 2.9rem); line-height: 1.15; margin: .5rem 0 .6rem; font-weight: 400; }
.padozi .some p { color: #435350; font-size: 1.08rem; }
.padozi .some .gonu { display: inline-block; margin-top: 1.2rem; color: var(--vame); font-weight: 700; }
.padozi .ganoma { border-radius: var(--mimo); overflow: hidden; box-shadow: var(--beti); }
.padozi .ganoma img { aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.viru { padding: clamp(1.8rem, 4vw, 3rem) 0; }
.viru.zahufe { background: linear-gradient(180deg, #eef6f3, var(--ziba)); }
.molure { text-align: center; max-width: 620px; margin: 0 auto 1.8rem; }
.molure .mifaho { font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--sahu); }
.molure h2 { font-family: var(--vodo); font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 400; margin-top: .2rem; }
.molure p { color: var(--vobe); margin-top: .3rem; }
.novo { display: grid; gap: clamp(1.2rem, 2.5vw, 1.8rem); }
.puta { grid-template-columns: repeat(3, 1fr); }
.gesi { grid-template-columns: repeat(2, 1fr); }
.beze { background: var(--kezu); border-radius: var(--mimo); overflow: hidden; box-shadow: var(--beti); display: flex; flex-direction: column; transition: transform .2s; }
.beze:hover { transform: translateY(-4px); }
.beze .ganoma img { aspect-ratio: 3/2; object-fit: cover; }
.beze .fepobe { padding: 1.2rem 1.3rem 1.4rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.thema { align-self: flex-start; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--vame); background: #e6f3ef; padding: .25rem .7rem; border-radius: 999px; }
.thema.blauw { color: #3d7ba1; background: #e6f0f6; }
.thema.warm { color: #c47a4e; background: #f9ece3; }
.beze h3 { font-family: var(--vodo); font-size: 1.25rem; font-weight: 400; line-height: 1.3; }
.beze p { font-size: .92rem; color: var(--vobe); }
.beze .hini { margin-top: auto; padding-top: .6rem; font-size: .8rem; color: var(--vobe); }
.vehe { background: var(--kezu); border-radius: var(--mimo); box-shadow: var(--beti); overflow: hidden; display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; }
.vehe .ganoma img { aspect-ratio: 4/3; object-fit: cover; height: 100%; width: 100%; }
.vehe .fepobe { padding: clamp(1.5rem, 3.5vw, 2.6rem); }
.vehe h2 { font-family: var(--vodo); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 400; line-height: 1.2; margin: .4rem 0 .5rem; }
.vehe p { color: var(--vobe); }
.lehina { padding: clamp(1.8rem, 4vw, 2.6rem) 0; }
.lehina .bezu { background: #eef6f3; border-radius: var(--mimo); padding: clamp(1.4rem, 3vw, 2.2rem); }
.lehina .zobo { text-align: center; margin-bottom: 1.3rem; }
.lehina .zobo h2 { font-family: var(--vodo); font-size: 1.5rem; font-weight: 400; }
.lehina .zobo p { color: var(--vobe); font-size: .92rem; }
.dazumi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.dazumi a { background: var(--kezu); border-radius: 14px; padding: 1.1rem 1.2rem; box-shadow: var(--beti); display: flex; align-items: center; gap: .9rem; transition: transform .2s; }
.dazumi a:hover { transform: translateY(-2px); }
.dazumi .cirkel { width: 44px; height: 44px; border-radius: 50%; background: var(--sahu); color: #fff; font-family: var(--vodo); font-size: 1.2rem; display: flex; align-items: center; justify-content: center; flex: none; }
.dazumi .cirkel.b { background: var(--fedi); }
.dazumi .cirkel.w { background: var(--ziti); }
.dazumi b { display: block; font-weight: 700; }
.dazumi small { color: var(--vobe); font-size: .8rem; }
.regefo { max-width: 720px; margin: 0 auto; padding: clamp(1.8rem, 4vw, 2.8rem) 0; }
.rozu { font-size: .82rem; color: var(--vobe); margin-bottom: 1rem; }
.rozu a:hover { color: var(--sahu); }
.regefo h1 { font-family: var(--vodo); font-size: clamp(1.9rem, 4.4vw, 2.8rem); line-height: 1.18; font-weight: 400; margin: .4rem 0 .6rem; }
.regefo .info { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; font-size: .84rem; color: var(--vobe); margin-bottom: 1.4rem; }
.regefo .zosudu { border-radius: var(--mimo); overflow: hidden; box-shadow: var(--beti); margin-bottom: 1.6rem; }
.regefo .zosudu img { aspect-ratio: 16/9; object-fit: cover; width: 100%; }
.regefo p, .regefo ul, .regefo ol { font-size: 1.08rem; margin-bottom: 1.15rem; }
.regefo ul, .regefo ol { padding-left: 1.3rem; }
.regefo li { margin-bottom: .5rem; }
.regefo h2 { font-family: var(--vodo); font-size: 1.55rem; font-weight: 400; margin: 2rem 0 .7rem; color: var(--vame); }
.regefo a { color: var(--vame); font-weight: 700; border-bottom: 1px solid #a9d6cc; }
.regefo a:hover { border-color: var(--sahu); }
.regefo .vamu { background: #e6f3ef; border-radius: var(--mimo); padding: 1.2rem 1.4rem; margin: 1.6rem 0; display: flex; gap: .9rem; }
.regefo .vamu .limimi { width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--sahu); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.regefo .vamu b { font-family: var(--vodo); font-weight: 400; }
.gusutu { font-size: .84rem; color: var(--vobe); border-top: 1px solid var(--defa); margin-top: 1.6rem; padding-top: 1rem; font-style: italic; }
.rota { background: linear-gradient(180deg, #eef6f3, var(--ziba)); padding: clamp(2.2rem, 5vw, 3.4rem) 0; text-align: center; }
.rota .mifaho { font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--sahu); }
.rota h1 { font-family: var(--vodo); font-size: clamp(2rem, 5vw, 3rem); font-weight: 400; margin: .3rem 0 .4rem; }
.rota p { color: var(--vobe); max-width: 580px; margin: 0 auto; }
.lemu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
.zuhari { background: var(--kezu); border-radius: var(--mimo); box-shadow: var(--beti); padding: 1.5rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.zuhari .gesuto { width: 58px; height: 58px; border-radius: 50%; background: #e6f3ef; color: var(--vame); font-family: var(--vodo); font-size: 1.5rem; display: flex; align-items: center; justify-content: center; }
.zuhari h3 { font-family: var(--vodo); font-size: 1.25rem; font-weight: 400; }
.zuhari .cat { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--fedi); font-weight: 700; }
.zuhari p { font-size: .9rem; color: var(--vobe); flex: 1; }
.zuhari .deki { color: var(--vame); font-weight: 700; font-size: .85rem; }
.pera { max-width: 700px; margin: 0 auto; }
.pera p { margin-bottom: 1.1rem; }
.pera h2 { font-family: var(--vodo); font-size: 1.55rem; font-weight: 400; margin: 1.8rem 0 .6rem; color: var(--vame); }
.pera a { color: var(--vame); font-weight: 700; }
.dilo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.7rem 0; }
.dilo div { background: var(--kezu); border-radius: 14px; box-shadow: var(--beti); padding: 1.4rem; text-align: center; }
.dilo .n { font-family: var(--vodo); font-size: 2rem; color: var(--sahu); }
.dilo .bukage { font-size: .82rem; color: var(--vobe); }
.nieuwsbrief { background: var(--sahu); border-radius: var(--mimo); padding: clamp(1.8rem, 4vw, 2.8rem); color: #fff; text-align: center; box-shadow: var(--beti); }
.nieuwsbrief h2 { font-family: var(--vodo); font-size: 1.7rem; font-weight: 400; }
.nieuwsbrief p { opacity: .92; margin: .3rem 0 1.2rem; }
.nieuwsbrief form { display: flex; gap: .5rem; max-width: 440px; margin: 0 auto; }
.nieuwsbrief input { flex: 1; padding: .8rem 1.1rem; border: 0; border-radius: 999px; font: inherit; }
.knop { border: 0; border-radius: 999px; padding: .8rem 1.4rem; font-weight: 700; cursor: pointer; background: #fff; color: var(--vame); font-family: var(--sovu); }
.knop:hover { background: #eef6f3; }
.bume { background: #223734; color: #b4c8c3; margin-top: 0; }
.suvu { border-bottom: 1px solid rgba(255,255,255,.1); }
.suvu .hebera { display: flex; align-items: center; gap: 1rem; padding: 1rem 0; flex-wrap: wrap; }
.suvu .t { font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: #86a099; }
.suvu a { font-size: .85rem; color: #c4d6d1; }
.suvu a:hover { color: #fff; }
.viteku { padding: clamp(2rem, 4vw, 2.8rem) 0 1.4rem; }
.rovini { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 1.5rem; }
.rovini .pahe { color: #fff; font-size: 1.4rem; }
.rovini .over { font-size: .9rem; color: #9bb3ad; margin-top: .5rem; max-width: 32ch; }
.rovini h4 { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: #86a099; margin-bottom: .7rem; }
.rovini ul { list-style: none; }
.rovini li { margin-bottom: .45rem; }
.rovini a { font-size: .9rem; color: #b4c8c3; }
.rovini a:hover { color: #fff; }
.pafake { border-top: 1px solid rgba(255,255,255,.1); margin-top: 1.5rem; padding-top: 1.2rem; display: flex; justify-content: space-between; font-size: .8rem; color: #86a099; flex-wrap: wrap; gap: .5rem; }
.op { opacity: 0; transform: translateY(14px); animation: op .6s ease forwards; }
.op.b { animation-delay: .08s; } .op.c { animation-delay: .16s; } .op.d { animation-delay: .24s; }
@keyframes op { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .op { animation: none; opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .gokobe, .vehe { grid-template-columns: 1fr; }
  .vehe .ganoma img { aspect-ratio: 16/9; }
  .puta { grid-template-columns: repeat(2, 1fr); }
  .dazumi { grid-template-columns: 1fr; }
  .rovini { grid-template-columns: 1fr 1fr; }
  .bovu .pusiku { display: none; width: 100%; flex-direction: column; }
  .bovu .pusiku.open { display: flex; }
  .bovu .zapebu { display: block; }
  .vide .cta { display: none; }
}
@media (max-width: 620px) {
  body { font-size: 16px; }
  .puta, .gesi, .novo, .lemu, .dilo, .rovini { grid-template-columns: 1fr; }
  .nieuwsbrief form { flex-direction: column; }
}
.bovu a { font-size: 1rem; }
a { transition: color .18s ease; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid var(--sahu); outline-offset: 2px; border-radius: 3px; }
@media (max-width: 900px) {
  .bovu a { padding-top: .8rem; padding-bottom: .8rem; }
}
.livu { max-width: var(--besi); margin: 0 auto; padding: clamp(1.8rem, 4vw, 2.8rem) clamp(1rem, 4vw, 1.8rem); display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(1.8rem, 3.5vw, 3rem); align-items: start; }
.kefe { min-width: 0; }
.kefe .regefo { max-width: none; margin: 0; padding: 0; }
.hilu { display: flex; flex-direction: column; gap: 1.5rem; position: sticky; top: 72px; }
.gozi { background: var(--kezu); border-radius: var(--mimo); box-shadow: var(--beti); padding: 1.3rem 1.4rem; }
.gozi .vefo { font-family: var(--vodo); font-weight: 400; font-size: 1.2rem; color: var(--vame); margin-bottom: .9rem; padding-bottom: .55rem; border-bottom: 1px solid var(--defa); }
.search-form { display: flex; border: 1px solid var(--defa); border-radius: 999px; overflow: hidden; background: var(--ziba); }
.search-form input { flex: 1; min-width: 0; border: 0; background: transparent; padding: .7rem .95rem; font: inherit; font-size: .92rem; color: var(--beto); outline: none; }
.search-form button { border: 0; background: var(--sahu); color: #fff; padding: 0 1.1rem; font-size: 1.05rem; line-height: 1; cursor: pointer; }
.search-form button:hover { background: var(--vame); }
.pamihe p { font-size: .93rem; color: var(--vobe); }
.bamo ul { list-style: none; }
.bamo li + li { border-top: 1px solid var(--defa); }
.bamo a { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .55rem 0; font-size: .95rem; color: var(--beto); }
.bamo a:hover { color: var(--vame); }
.bamo .zevo { flex: none; font-size: .74rem; font-weight: 700; color: var(--vame); background: #e6f3ef; border-radius: 999px; padding: .1rem .6rem; }
.haduka a { display: grid; grid-template-columns: auto 1fr; gap: .85rem; align-items: center; padding: .7rem 0; border-top: 1px solid var(--defa); }
.haduka a:first-of-type { border-top: 0; padding-top: 0; }
.haduka .fudata { width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--sahu); color: #fff; font-family: var(--vodo); font-size: 1.05rem; display: flex; align-items: center; justify-content: center; }
.haduka h4 { font-family: var(--sovu); font-size: .95rem; font-weight: 500; line-height: 1.3; }
.haduka a:hover h4 { color: var(--vame); }
.fuho a { display: block; background: #eef6f3; border-radius: 12px; padding: .75rem .9rem; margin-top: .6rem; transition: transform .2s; }
.fuho a:first-of-type { margin-top: 0; }
.fuho a:hover { transform: translateY(-2px); }
.fuho .nuda { display: block; font-weight: 700; font-size: .95rem; color: var(--vame); }
.fuho .seni { display: block; font-size: .82rem; color: var(--vobe); margin-top: .15rem; }
.vetoso { background: var(--sahu); color: #fff; }
.vetoso .vefo { color: #fff; border-color: rgba(255, 255, 255, .28); }
.vetoso p { font-size: .9rem; opacity: .92; margin-bottom: .9rem; }
.vetoso input { width: 100%; border: 0; border-radius: 999px; padding: .7rem 1rem; font: inherit; font-size: .9rem; margin-bottom: .55rem; outline: none; background: #fff; color: var(--beto); }
.vetoso button { width: 100%; border: 0; border-radius: 999px; background: #fff; color: var(--vame); padding: .7rem; font-family: var(--sovu); font-weight: 700; font-size: .9rem; cursor: pointer; }
.vetoso button:hover { background: #eef6f3; }
.tiga .zuru { display: flex; flex-wrap: wrap; gap: .5rem; }
.tiga .zuru a { font-size: .82rem; padding: .3rem .8rem; border: 1px solid var(--defa); border-radius: 999px; color: var(--vobe); transition: .2s; }
.tiga .zuru a:hover { background: var(--sahu); color: #fff; border-color: var(--sahu); }
@media (max-width: 960px) {
  .livu { grid-template-columns: 1fr; }
  .hilu { position: static; flex-direction: row; flex-wrap: wrap; }
  .hilu .gozi { flex: 1 1 260px; }
}
@media (max-width: 620px) {
  .hilu { flex-direction: column; }
}