/* CHAP Motion v2.1 · stijlen voor de bewegende onderdelen (beeldmerk, D.O.M.-paneel, USP-CTA's). Huisstijl: navy #04405B · teal #82A5A9 · mint #BCDAD4 · roze #D5ADBA · rose #F1CEDA */

/* ---------- Beeldmerk (chap_boom) ---------- */
.chap-mark{width:100%;max-width:560px;margin:0 auto}
.chap-mark svg{width:100%;height:auto;overflow:visible;display:block}
.chap-boom--schaduw svg{filter:drop-shadow(0 0 40px rgba(130,165,169,.18))}
.chap-boom--hero.sway svg{transform-origin:50% 100%;animation:chapSway 11s ease-in-out infinite}
@keyframes chapSway{0%,100%{transform:rotate(-.7deg)}50%{transform:rotate(.7deg)}}
.chap-boom--mono{opacity:.9}
@media (prefers-reduced-motion:reduce){.chap-boom--hero.sway svg{animation:none}}

/* ---------- D.O.M.-paneel (chap_dom_paneel) ---------- */
.chap-domx{border-radius:24px;overflow:hidden}
.chap-domx--schaduw{box-shadow:0 30px 60px rgba(4,64,91,.18)}
.chap-domx svg{display:block;width:100%;height:auto}
.chap-domx .leaf{opacity:0;transform:scale(.4);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.chap-domx svg.grown .leaf{opacity:1;transform:scale(1)}
.chap-domx svg.instant .leaf{transition:none}
.chap-domx .dp-fade{opacity:0;transition:opacity .9s cubic-bezier(.22,1,.36,1)}
.chap-domx svg.grown .dp-fade{opacity:1}
.chap-domx .dp-group{cursor:default;outline:none}
.chap-domx .dp-group circle{transition:fill .4s,stroke-opacity .4s}
.chap-domx .dp-group:hover circle,.chap-domx .dp-group:focus circle{fill:rgba(255,255,255,.12);stroke-opacity:1}
.chap-domx svg[data-hi] .leaf{opacity:.22;transition-delay:0s!important;transition-duration:.4s}
.chap-domx svg[data-hi="D"] .leaf-D,.chap-domx svg[data-hi="O"] .leaf-O,.chap-domx svg[data-hi="M"] .leaf-M{opacity:1;transform:scale(1.08)}

/* ---------- USP call-to-actions (chap_usp_cta) ---------- */
.chap-ucta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--chap-ucta-min,220px),1fr));gap:16px}
.chap-ucta{position:relative;overflow:hidden;border-radius:18px;padding:28px 26px 24px;display:flex;flex-direction:column;gap:12px;color:#fff;min-height:var(--chap-ucta-h,340px);isolation:isolate;text-decoration:none;font-family:inherit;transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s}
.chap-ucta:hover,.chap-ucta:focus-visible{transform:translateY(-6px);box-shadow:0 30px 60px rgba(4,64,91,.28);color:#fff}
.chap-ucta .n{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;opacity:.8}
.chap-ucta h3{font-family:'PT Serif',Georgia,serif;font-size:26px;line-height:1.1;margin:0;color:#fff;hyphens:auto}
.chap-ucta h3 em{font-style:normal;color:#D5ADBA}
.chap-ucta p{font-size:14.5px;line-height:1.45;opacity:.9;margin:0;color:#fff}
.chap-ucta .go{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;background:#fff;color:#04405B;border-radius:10px;padding:11px 14px;align-self:flex-start;box-shadow:0 10px 24px rgba(1,41,60,.18)}
.chap-ucta .mark{position:absolute;right:-60px;bottom:-80px;width:250px;height:250px;opacity:.16;z-index:-1}
.chap-ucta::after{content:"";position:absolute;right:-60px;bottom:-60px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.26),transparent 62%);z-index:-1}
.chap-ucta.navy{background:linear-gradient(135deg,#0B577A,#04405B 60%,#01293C)}
.chap-ucta.rose{background:linear-gradient(135deg,#C99AAB,#AE677C 70%,#8E4F63)}
.chap-ucta.mint{background:linear-gradient(135deg,#8FB7B9,#47887F 70%,#2F6B66)}
/* banner */
.chap-ucta.ban{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;align-items:center;min-height:0;padding:36px 44px;gap:36px}
.chap-ucta.ban .t{display:flex;flex-direction:column;gap:10px}
.chap-ucta.ban h3{font-size:30px}
.chap-ucta.ban p{font-size:16px}
.chap-ucta.ban .go{margin:0}
.chap-ucta.ban .mark{width:320px;height:320px;bottom:-140px;right:22%}
@media (max-width:900px){.chap-ucta.ban{grid-template-columns:1fr;padding:28px}.chap-ucta.ban .mark{right:-60px}}
@media (prefers-reduced-motion:reduce){.chap-ucta{transition:none}}
