/* Avuna Contracten: alles zit onder .avc zodat je Elementor-thema niet wordt beinvloed. */
.avc {
	--avc-ink: #1C1B2E;
	--avc-muted: #5E5C72;
	--avc-line: #E3E1EE;
	--avc-soft: #F4F3FC;
	--avc-accent: #635BFF;
	--avc-accent-dark: #4B43E0;
	--avc-error: #B42318;
	--avc-ok: #1F7A4D;
	--avc-ease: cubic-bezier(.22, 1, .36, 1);
	color: var(--avc-ink);
	max-width: 720px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.6;
	text-align: left;
}
.avc *, .avc *::before, .avc *::after { box-sizing: border-box; }
.avc [hidden] { display: none !important; }

/* Kop */
.avc .avc-head { margin-bottom: 28px; }
.avc .avc-head h2 { font-size: clamp(26px, 4.5vw, 34px); line-height: 1.15; margin: 0 0 6px; color: var(--avc-ink); letter-spacing: -.01em; }
.avc .avc-head p { margin: 0; color: var(--avc-muted); }

/* Voortgang */
.avc .avc-progress { position: relative; margin-bottom: 8px; display: none; }
.avc.avc-ready .avc-progress { display: block; }
.avc .avc-steps { list-style: none; margin: 0; padding: 0; display: flex; justify-content: space-between; position: relative; z-index: 1; }
.avc .avc-steps li { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; margin: 0; padding: 0; }
.avc .avc-steps li::before { display: none; }
.avc .avc-dot {
	width: 34px; height: 34px; border-radius: 50%;
	display: grid; place-items: center;
	background: #fff; border: 2px solid var(--avc-line);
	font-size: 14px; font-weight: 700; color: var(--avc-muted);
	transition: background .35s var(--avc-ease), border-color .35s var(--avc-ease), color .35s, transform .35s var(--avc-ease);
}
.avc .avc-step-name { font-size: 13px; color: var(--avc-muted); transition: color .3s; }
.avc .avc-steps li.is-current .avc-dot { border-color: var(--avc-accent); color: var(--avc-accent); transform: scale(1.12); box-shadow: 0 0 0 5px rgba(99, 91, 255, .14); }
.avc .avc-steps li.is-current .avc-step-name { color: var(--avc-ink); font-weight: 600; }
.avc .avc-steps li.is-done .avc-dot { background: var(--avc-accent); border-color: var(--avc-accent); color: transparent; position: relative; }
.avc .avc-steps li.is-done .avc-dot::after {
	content: ""; position: absolute; width: 10px; height: 6px;
	border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff;
	transform: translateY(-1px) rotate(-45deg);
	animation: avc-pop .35s var(--avc-ease);
}
.avc .avc-bar { position: absolute; top: 16px; left: 10%; right: 10%; height: 2px; background: var(--avc-line); }
.avc .avc-bar span { display: block; height: 100%; width: 0; background: var(--avc-accent); transition: width .6s var(--avc-ease); }
.avc .avc-steplabel { font-size: 14px; color: var(--avc-muted); margin: 0 0 20px; min-height: 1px; }

/* Stappen */
.avc .avc-form { position: relative; }
.avc .avc-step { margin-bottom: 28px; }
.avc .avc-form.avc-js .avc-step { margin-bottom: 0; min-height: 280px; }
.avc .avc-step.from-next { animation: avc-in-next .5s var(--avc-ease); }
.avc .avc-step.from-prev { animation: avc-in-prev .5s var(--avc-ease); }
.avc .avc-step-title { font-size: 22px; line-height: 1.25; margin: 0 0 4px; color: var(--avc-ink); outline: none; }
.avc .avc-step-intro { color: var(--avc-muted); margin: 0 0 20px; }

/* Pakketkaart: het moment dat blijft hangen */
.avc .avc-plan {
	border-radius: 16px;
	padding: 26px 28px;
	background: linear-gradient(160deg, #1C1B2E 0%, #2A2560 100%);
	color: #fff;
	overflow: hidden;
	position: relative;
}
.avc .avc-plan::after {
	content: ""; position: absolute; width: 260px; height: 260px; right: -90px; top: -110px;
	border-radius: 50%; background: radial-gradient(circle, rgba(99, 91, 255, .55), transparent 70%);
	pointer-events: none;
}
.avc .avc-plan-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; position: relative; z-index: 1; }
.avc .avc-plan-name { font-size: 20px; font-weight: 700; }
.avc .avc-plan-domain { font-size: 14px; color: #C9C5FF; }
.avc .avc-plan-prices { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 22px 0; position: relative; z-index: 1; }
.avc .avc-price { display: block; font-size: clamp(32px, 7vw, 44px); font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.avc .avc-plan-prices small { display: block; margin-top: 6px; font-size: 13px; color: #B8B4D8; }
.avc .avc-plan-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 22px; position: relative; z-index: 1; }
.avc .avc-plan-col > small { display: block; margin-top: 6px; font-size: 13px; color: #B8B4D8; }
.avc .avc-plan-sub { margin: 20px 0 10px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 13px; font-weight: 700; color: #C9C5FF; }
.avc .avc-plan-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; position: relative; z-index: 1; }
.avc ul.avc-items { margin: 4px 0 12px; padding-left: 22px; }
.avc .avc-plan-list li {
	margin: 0; padding: 0 0 0 26px; position: relative; font-size: 15px;
	opacity: 0; animation: avc-rise .5s var(--avc-ease) forwards; animation-delay: calc(.35s + var(--i) * .07s);
}
.avc .avc-plan-list li::before {
	content: ""; position: absolute; left: 2px; top: 6px; width: 11px; height: 6px;
	border-left: 2px solid #8C85FF; border-bottom: 2px solid #8C85FF; transform: rotate(-45deg);
}
.avc .avc-plan-list li.avc-no { color: #8F8BAE; }
.avc .avc-plan-list li.avc-no::before { width: 10px; height: 0; border-left: 0; top: 11px; transform: none; border-bottom-color: #6F6A93; }

/* Velden */
.avc .avc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.avc .avc-wide { grid-column: 1 / -1; }
.avc .avc-incasso { margin-top: 18px; }
.avc .avc-incasso.avc-reveal { animation: avc-rise .45s var(--avc-ease); }
.avc .avc-field label, .avc .avc-label { display: block; font-size: 14px; font-weight: 600; margin: 0 0 5px; color: var(--avc-ink); }
.avc .avc-field input {
	width: 100%; font: inherit; font-size: 16px; color: var(--avc-ink);
	background: #fff; border: 1.5px solid #D5D2E6; border-radius: 10px;
	padding: 12px 14px; margin: 0; box-shadow: none; min-height: 48px;
	transition: border-color .2s, box-shadow .2s;
}
.avc .avc-field input::placeholder { color: #A7A4BC; }
.avc .avc-field input:focus { outline: none; border-color: var(--avc-accent); box-shadow: 0 0 0 4px rgba(99, 91, 255, .16); }
.avc .avc-invalid input:not([type="radio"]):not([type="checkbox"]), .avc .avc-invalid .avc-pad { border-color: var(--avc-error); }
.avc .avc-hint { font-size: 13px; color: var(--avc-muted); margin: 5px 0 0; }
.avc .avc-error { font-size: 13px; color: var(--avc-error); margin: 5px 0 0; font-weight: 600; animation: avc-rise .3s var(--avc-ease); }
.avc .avc-shake { animation: avc-shake .4s; }

/* Keuzes */
.avc .avc-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.avc .avc-choice {
	position: relative; display: block; margin: 0; cursor: pointer;
	border: 1.5px solid #D5D2E6; border-radius: 14px; padding: 18px 18px 18px 50px; background: #fff;
	transition: border-color .25s, background .25s, transform .25s var(--avc-ease);
}
.avc .avc-choice:hover { transform: translateY(-2px); }
.avc .avc-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.avc .avc-choice::before {
	content: ""; position: absolute; left: 18px; top: 21px; width: 20px; height: 20px; border-radius: 50%;
	border: 2px solid #C4C0DA; background: #fff; transition: border .25s var(--avc-ease);
}
.avc .avc-choice:has(input:checked) { border-color: var(--avc-accent); background: var(--avc-soft); }
.avc .avc-choice:has(input:checked)::before { border: 6px solid var(--avc-accent); }
.avc .avc-choice:has(input:focus-visible) { outline: 3px solid var(--avc-accent); outline-offset: 2px; }
.avc .avc-choice strong { display: block; font-size: 16px; margin-bottom: 2px; }
.avc .avc-choice small { display: block; color: var(--avc-muted); font-size: 13px; line-height: 1.45; }
.avc .avc-invalid .avc-choice { border-color: #E9B4AE; }

.avc .avc-price-text { font-size: clamp(28px, 6vw, 38px); }
.avc .avc-note { background: var(--avc-soft); border-radius: 10px; padding: 12px 14px; margin: 12px 0; }

/* Betaaltijdlijn */
.avc .avc-timeline { list-style: none; margin: 0 0 24px; padding: 0; position: relative; }
.avc .avc-timeline::before { content: ""; position: absolute; left: 11px; top: 14px; bottom: 14px; width: 2px; background: var(--avc-line); }
.avc .avc-timeline li { position: relative; display: flex; gap: 16px; padding: 0 0 18px; margin: 0; opacity: 0; animation: avc-rise .5s var(--avc-ease) forwards; animation-delay: calc(.15s + var(--i) * .12s); }
.avc .avc-timeline li:last-child { padding-bottom: 0; }
.avc .avc-tl-dot { flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 2px solid var(--avc-accent); position: relative; z-index: 1; margin-top: 2px; }
.avc .avc-timeline li:first-child .avc-tl-dot { background: var(--avc-accent); box-shadow: 0 0 0 5px rgba(99, 91, 255, .14); }
.avc .avc-timeline p { margin: 0; }
.avc .avc-tl-when { font-size: 13px; font-weight: 700; color: var(--avc-accent-dark); }
.avc .avc-tl-what { font-size: 17px; }
.avc .avc-tl-note { font-size: 13px; color: var(--avc-muted); }
.avc .avc-next-step { margin: 24px auto 0; max-width: 460px; text-align: left; background: #fff; border: 1px solid var(--avc-line); border-radius: 14px; padding: 18px 20px; animation: avc-rise .6s var(--avc-ease) .8s both; }
.avc .avc-next-title { font-weight: 700; margin: 0 0 4px; color: var(--avc-ink); }
.avc .avc-next-step p { margin: 0 0 8px; }
.avc .avc-pay-btn { display: block; text-align: center; background: var(--avc-accent); color: #fff !important; text-decoration: none; font-weight: 700; border-radius: 10px; padding: 14px 18px; transition: background .2s, transform .2s var(--avc-ease); }
.avc .avc-pay-btn:hover { background: var(--avc-accent-dark); transform: translateY(-1px); }
.avc .avc-step .avc-label { margin-top: 4px; }

/* Voorwaarden */
.avc .avc-doc { position: relative; border: 1px solid var(--avc-line); border-radius: 14px; background: #fff; margin-bottom: 24px; overflow: hidden; }
.avc .avc-doc-scroll { max-height: 340px; overflow-y: auto; padding: 22px 26px; font-size: 15px; }
.avc .avc-doc-scroll:focus-visible { outline: 3px solid var(--avc-accent); outline-offset: -3px; }
.avc .avc-doc-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: linear-gradient(transparent, #fff); pointer-events: none; transition: opacity .3s; }
.avc .avc-doc.is-read .avc-doc-fade { opacity: 0; }
.avc .avc-doc h3 { font-size: 16px; margin: 22px 0 6px; color: var(--avc-ink); }
.avc .avc-doc ol { margin: 0 0 8px; padding-left: 22px; }
.avc .avc-doc li { margin-bottom: 4px; }
.avc .avc-doc p { margin: 0 0 8px; }
.avc .avc-parties p { color: var(--avc-muted); }
.avc table.avc-summary { width: 100%; border-collapse: collapse; margin: 12px 0 8px; border: 0; }
.avc table.avc-summary th, .avc table.avc-summary td { padding: 8px 0; border: 0; border-bottom: 1px solid var(--avc-line); text-align: left; background: none; vertical-align: top; }
.avc table.avc-summary th { font-weight: 400; color: var(--avc-muted); width: 50%; }
.avc table.avc-summary td { font-weight: 600; }

/* Handtekening */
.avc .avc-pad { position: relative; height: 200px; border: 1.5px solid #D5D2E6; border-radius: 14px; background: #fff; overflow: hidden; transition: border-color .25s, box-shadow .25s; }
.avc .avc-pad:hover { border-color: #B9B4E8; }
.avc .avc-pad.avc-has-ink { border-color: var(--avc-accent); box-shadow: 0 0 0 4px rgba(99, 91, 255, .1); }
.avc .avc-pad::after { content: ""; position: absolute; left: 28px; right: 28px; bottom: 54px; border-bottom: 1.5px dashed #C4C0DA; pointer-events: none; }
.avc .avc-pad::before { content: "×"; position: absolute; left: 28px; bottom: 58px; font-size: 22px; line-height: 1; color: #A9A5C4; pointer-events: none; }
.avc .avc-pad canvas { position: relative; z-index: 1; display: block; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.avc .avc-pad-hint { position: absolute; left: 28px; bottom: 20px; font-size: 14px; color: var(--avc-muted); pointer-events: none; transition: opacity .25s; }
.avc .avc-pad.avc-has-ink .avc-pad-hint { opacity: 0; }
.avc .avc-clear {
	position: absolute; z-index: 2; right: 12px; top: 10px;
	background: #fff; border: 1px solid var(--avc-line); border-radius: 999px; padding: 4px 12px;
	font: inherit; font-size: 13px; color: var(--avc-muted); cursor: pointer; box-shadow: none; min-height: 0;
	opacity: 0; transform: translateY(-4px); transition: opacity .25s, transform .25s var(--avc-ease);
}
.avc .avc-pad.avc-has-ink .avc-clear { opacity: 1; transform: none; }
.avc .avc-clear:hover { color: var(--avc-ink); border-color: #C4C0DA; }

/* Akkoord */
.avc [data-signature] + .avc-group { margin-top: 20px; }
.avc .avc-check { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; font-size: 15px; margin: 0; }
.avc .avc-field label.avc-check { display: flex; font-size: 15px; font-weight: 400; margin: 0; }
.avc .avc-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.avc .avc-check-box {
	display: inline-block; flex-shrink: 0; width: 24px; height: 24px; border-radius: 7px; border: 2px solid #C4C0DA; background: #fff;
	position: relative; transition: background .25s var(--avc-ease), border-color .25s;
}
.avc .avc-check-box::after {
	content: ""; position: absolute; left: 6px; top: 3px; width: 7px; height: 12px;
	border-right: 2.5px solid #fff; border-bottom: 2.5px solid #fff; transform: rotate(45deg) scale(0);
	transition: transform .3s var(--avc-ease);
}
.avc .avc-check input:checked + .avc-check-box { background: var(--avc-accent); border-color: var(--avc-accent); }
.avc .avc-check input:checked + .avc-check-box::after { transform: rotate(45deg) scale(1); }
.avc .avc-check input:focus-visible + .avc-check-box { outline: 3px solid var(--avc-accent); outline-offset: 2px; }
.avc .avc-invalid .avc-check-box { border-color: var(--avc-error); }

/* Knoppen */
.avc .avc-nav { display: flex; gap: 12px; margin-top: 28px; align-items: center; }
.avc .avc-nav button { font: inherit; font-weight: 700; font-size: 16px; border-radius: 12px; padding: 15px 22px; cursor: pointer; min-height: 52px; text-transform: none; letter-spacing: 0; line-height: 1.2; }
.avc .avc-back { background: #fff; color: var(--avc-ink); border: 1.5px solid #D5D2E6; }
.avc .avc-back:hover { border-color: #B9B4E8; }
.avc .avc-next, .avc .avc-submit { margin-left: auto; flex: 1; max-width: 340px; background: var(--avc-accent); color: #fff; border: 0; transition: background .2s, transform .2s var(--avc-ease), box-shadow .2s; }
.avc .avc-next:hover, .avc .avc-submit:hover { background: var(--avc-accent-dark); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(99, 91, 255, .28); }
.avc .avc-next:active, .avc .avc-submit:active { transform: translateY(0); }
.avc .avc-submit:disabled { opacity: .75; cursor: wait; transform: none; box-shadow: none; }
.avc .avc-submit.is-busy { background-image: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent); background-size: 200% 100%; animation: avc-shimmer 1.2s linear infinite; }
.avc .avc-nav button:focus-visible { outline: 3px solid var(--avc-accent); outline-offset: 3px; }
.avc .avc-form:not(.avc-js) .avc-back, .avc .avc-form:not(.avc-js) .avc-next { display: none; }

/* Meldingen */
.avc .avc-alert { border-left: 4px solid var(--avc-error); background: #FEF3F2; padding: 12px 16px; border-radius: 8px; margin-bottom: 20px; }
.avc .avc-alert p { margin: 0; color: var(--avc-error); font-weight: 600; }
.avc .avc-message { border: 1px solid var(--avc-line); border-radius: 16px; padding: 28px; background: #fff; }
.avc .avc-message h2 { margin: 0 0 8px; font-size: 26px; }
.avc .avc-message p { margin: 0; }
.avc .avc-message-ok { border-color: #B7DEC8; background: #F1FAF5; }
.avc .avc-message-ok h2 { color: var(--avc-ok); }
.avc .avc-message-error { border-color: #F4C7C3; background: #FEF3F2; }
.avc .avc-message-done { text-align: center; padding: 44px 28px; }
.avc .avc-message-done h2, .avc .avc-message-done p { animation: avc-rise .6s var(--avc-ease) .5s both; }
.avc .avc-done-icon { width: 76px; height: 76px; margin: 0 auto 16px; display: block; }
.avc .avc-done-icon circle { fill: none; stroke: var(--avc-ok); stroke-width: 2.5; stroke-dasharray: 151; stroke-dashoffset: 151; animation: avc-draw .6s var(--avc-ease) forwards; }
.avc .avc-done-icon path { fill: none; stroke: var(--avc-ok); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: avc-draw .4s var(--avc-ease) .45s forwards; }

.avc .avc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Animaties */
@keyframes avc-in-next { from { opacity: 0; transform: translateX(32px); } to { opacity: 1; transform: none; } }
@keyframes avc-in-prev { from { opacity: 0; transform: translateX(-32px); } to { opacity: 1; transform: none; } }
@keyframes avc-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes avc-pop { from { opacity: 0; transform: translateY(-1px) rotate(-45deg) scale(.3); } to { opacity: 1; transform: translateY(-1px) rotate(-45deg) scale(1); } }
@keyframes avc-shake { 0%, 100% { transform: none; } 20% { transform: translateX(-7px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(2px); } }
@keyframes avc-draw { to { stroke-dashoffset: 0; } }
@keyframes avc-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* Mobiel */
@media (max-width: 600px) {
	.avc .avc-grid, .avc .avc-choices, .avc .avc-plan-cols { grid-template-columns: 1fr; }
	.avc .avc-step-name { display: none; }
	.avc .avc-dot { width: 30px; height: 30px; font-size: 13px; }
	.avc .avc-bar { top: 14px; }
	.avc .avc-plan { padding: 22px; }
	.avc .avc-doc-scroll { padding: 18px; max-height: 300px; }
	.avc .avc-nav button { padding: 14px 18px; }
	.avc .avc-next, .avc .avc-submit { max-width: none; }
}

/* Minder beweging als de gebruiker dat heeft ingesteld */
@media (prefers-reduced-motion: reduce) {
	.avc *, .avc *::before, .avc *::after { animation-duration: .01ms !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
	.avc .avc-plan-list li, .avc .avc-timeline li { opacity: 1; }
}