/* vanderzijden.hr – vormen uit de huisstijl (stijlgids op het ontwerpcanvas) */
.vz-label{display:flex;align-items:center;gap:10px;font-size:14px!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--global-palette3);margin-bottom:8px}
.vz-label::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--global-palette1);flex-shrink:0}
.has-theme-palette-3-background-color .vz-label{color:var(--global-palette6)}
.vz-payoff{font-size:clamp(56px,7.5vw,112px)!important;line-height:1!important;font-weight:900;letter-spacing:-.02em;color:var(--global-palette3);margin:0}
.vz-payoff mark{background:none!important;color:var(--global-palette1)}
.vz-punt{color:var(--global-palette1)}
.vz-dots{list-style:none;padding-left:0!important}
.vz-dots li{position:relative;padding-left:24px;margin-bottom:10px}
.vz-dots li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:10px;border-radius:50%;background:var(--global-palette1)}
.vz-cirkel{aspect-ratio:1/1;border-radius:50%!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--global-palette7);color:var(--global-palette3);font-weight:700;max-width:520px;margin-left:auto;margin-right:auto}
.vz-cirkel img{border-radius:50%;aspect-ratio:1/1;object-fit:cover}
.vz-cirkel-lijn,.vz-cirkel-roze{aspect-ratio:1/1;border-radius:50%;display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:0}
.vz-cirkel-lijn{border:2px solid var(--global-palette6);max-width:300px}
.vz-cirkel-roze{background:var(--global-palette1);color:#fff;max-width:220px;margin-left:auto;margin-top:-80px}
.vz-kaart{border-radius:28px;height:100%}
.vz-kaart-rand{border:1px solid #DCDCE4;background:#fff}
.vz-placeholder{border:2px dashed var(--global-palette6);border-radius:16px;color:var(--global-palette5)}
.vz-nummer,.vz-stap{border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
.vz-nummer{width:56px;height:56px;background:var(--global-palette1);font-size:22px}
.vz-stap{width:64px;height:64px;background:var(--global-palette3);font-size:26px}
.has-theme-palette-3-background-color a:not(.wp-block-button__link),.has-theme-palette-1-background-color a:not(.wp-block-button__link){color:#fff}
.has-theme-palette-3-background-color .is-style-outline .wp-block-button__link,.has-theme-palette-1-background-color .is-style-outline .wp-block-button__link{color:#fff;border-color:#fff}
.has-theme-palette-1-background-color .vz-knop-wit .wp-block-button__link{background:#fff;color:var(--global-palette3)}
@media (max-width:781px){.vz-cirkel-roze{margin-top:-40px}}
/* Contactformulier (Jetpack) */
.vz-nowrap{white-space:nowrap}
.vz-formkaart{box-shadow:0 24px 48px -32px rgba(39,53,131,.35)}
.vz-formulier .grunion-field-label{font-size:15px;font-weight:700;color:var(--global-palette3);margin-bottom:8px}
.vz-formulier .grunion-label-required{font-size:13px;font-weight:300;color:var(--global-palette5);margin-left:6px}
.vz-formulier input.grunion-field,.vz-formulier textarea.grunion-field,.vz-formulier .contact-form__select-wrapper{border:1.5px solid var(--global-palette6)!important;border-radius:14px!important;background:#fff;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.vz-formulier input.grunion-field{height:52px;padding:0 16px!important;font-size:17px;color:#231F20}
.vz-formulier textarea.grunion-field{height:160px;min-height:120px;padding:14px 16px!important;font-size:17px;color:#231F20;resize:vertical}
.vz-formulier .contact-form__select-wrapper{height:52px;display:flex;align-items:center}
.vz-formulier .contact-form__select-element-wrapper,.vz-formulier .contact-form__select-wrapper select{width:100%;height:100%;border-radius:14px;background:transparent}
.vz-formulier .contact-form__select-wrapper select{padding:0 44px 0 16px!important;font-size:17px;color:#231F20}
.vz-formulier input.grunion-field:focus,.vz-formulier textarea.grunion-field:focus,.vz-formulier .contact-form__select-wrapper:focus-within{border-color:var(--global-palette3)!important;outline:none;box-shadow:0 0 0 4px rgba(229,0,125,.18)}
.vz-formulier .wp-block-jetpack-button .wp-block-button__link{min-height:56px;padding:0 32px;font-weight:700}
/* Footer */
.site-footer .widget_block p{margin:0}
.site-footer .wp-block-image{margin:0 0 16px}
.site-footer .vz-footer-payoff{font-size:20px;font-weight:900;color:#fff;letter-spacing:-.01em}
.site-footer .vz-footer-kop{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--global-palette6);margin:0 0 14px!important}
.site-footer .vz-footer-lijst{list-style:none;padding-left:0!important;margin:0}
.site-footer .vz-footer-lijst li{margin:0 0 10px;padding:0}
.site-footer .vz-footer-lijst li::marker{content:none}
.site-footer .vz-footer-lijst a{color:#fff;text-decoration:none}
.site-footer .vz-footer-lijst a:hover,.site-footer .vz-footer-lijst a:focus{text-decoration:underline;text-underline-offset:3px}
.site-footer .vz-footer-tekst{color:#fff;line-height:1.75}
/* Mobiel menu */
#mobile-drawer .mobile-navigation li.current-menu-item > a,#mobile-drawer .mobile-navigation li.current-menu-item > .drawer-nav-drop-wrap > a{display:flex;align-items:center;gap:12px}
#mobile-drawer .mobile-navigation li.current-menu-item > a::before,#mobile-drawer .mobile-navigation li.current-menu-item > .drawer-nav-drop-wrap > a::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--global-palette1);flex-shrink:0}
/* Knop in mobiel menu */
#mobile-drawer .mobile-header-button-wrap{margin-top:28px}
#mobile-drawer .mobile-header-button{font-size:18px;font-weight:700;padding:14px 28px;white-space:nowrap}
/* Compensation & Benefits */
.vz-ic::before{content:"";display:block;width:56px;height:56px;border-radius:50%;background-color:var(--global-palette3);background-repeat:no-repeat;background-position:center;background-size:26px 26px;margin-bottom:18px}
.vz-ic-roze::before{background-color:var(--global-palette1)}
.vz-ic-beleid::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M6 21V11M12 21V5M18 21v-7'/%3E%3C/svg%3E")}
.vz-ic-waardering::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M8 21h8M4 7h16'/%3E%3Cpath d='M4 7l-2.5 6a3 3 0 0 0 5 0z'/%3E%3Cpath d='M20 7l-2.5 6a3 3 0 0 0 5 0z'/%3E%3C/svg%3E")}
.vz-ic-voorwaarden::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.vz-ic-wet::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E")}
.vz-noot{font-size:15px!important;line-height:1.5;color:var(--global-palette5)}
.vz-bovenregel{font-size:14px!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--global-palette5);margin:0 0 12px}
.vz-dl{font-size:16px!important;line-height:1.55;color:var(--global-palette5);margin:0 0 12px}
.vz-dl strong{display:block;color:var(--global-palette3);font-weight:700}
.vz-cirkel-stip{position:relative;overflow:visible}
.vz-cirkel-stip::after{content:"";position:absolute;right:-12px;bottom:-12px;width:72px;height:72px;border-radius:50%;background:var(--global-palette1);box-shadow:0 0 0 10px #fff}
.vz-cirkel .vz-cirkel-tekst{font-size:clamp(28px,3.2vw,40px)!important;line-height:1.15;font-weight:900;letter-spacing:-.01em;padding:0 14%;margin:0}
.vz-stappen{position:relative}
.vz-stappen::before{content:"";position:absolute;left:32px;right:32px;top:31px;height:2px;background:var(--global-palette6)}
.vz-stappen .vz-stap{position:relative;z-index:1;box-shadow:0 0 0 8px #fff}
.vz-stap-roze{background:var(--global-palette1)!important}
.vz-tijdlijn{position:relative}
.vz-tijdlijn::before{content:"";position:absolute;left:0;right:0;top:47px;height:2px;background:rgba(205,210,236,.5)}
.vz-jaar{position:relative;z-index:1;width:96px;height:96px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15;background:#fff;color:var(--global-palette3);box-shadow:0 0 0 10px var(--global-palette3);font-size:13px!important;font-weight:700;margin:0 0 20px}
.vz-jaar strong{font-size:26px;font-weight:900}
.vz-jaar-roze{background:var(--global-palette1);color:#fff}
@media (min-width:782px) and (max-width:1024px){.vz-vier{flex-wrap:wrap!important}.vz-vier>.wp-block-column{flex-basis:calc(50% - 12px)!important;flex-grow:0!important}}
@media (max-width:781px){.vz-stappen::before,.vz-tijdlijn::before{display:none}}

/* Label over twee regels: stip bij de eerste regel */
.vz-label{align-items:flex-start}
.vz-label::before{margin-top:calc((1lh - 10px) / 2)}

/* Portretfoto in de hero (C&B, MKB) */
.vz-foto{max-width:460px;margin-left:auto!important;margin-right:auto!important}
.vz-foto .wp-block-image{margin:0!important}
.vz-foto img{display:block;width:100%;height:auto}
