/* AceDigital tools ([ace_tool]). De basisstijl (kaart, labels, knoppen .ace-tool-opt/-ghost/-cta,
   tabel .ace-tool-table) staat al in acedigital.css bij de incompany-tools; hier alleen wat de
   nieuwe tools extra nodig hebben. Kop, uitleg, FAQ, vervolgstap en mailformulier zijn
   Avada-elementen in de layout "Single Tool". */

/* Gedeeld */
.ace-tool select { width: 100%; max-width: 300px; }
.ace-tool-veld { display: inline-flex; align-items: center; gap: 10px; }
.ace-tool-eenheid { color: var(--awb-color6); }
.ace-tool-klein { font-size: 13px; line-height: 1.5; color: var(--awb-color6); }
.ace-tool-actions .ace-tool-ghost, .ace-tool-opt { font-family: inherit; }
.ace-tool .ace-tool-opts, .ace-tool-schakel { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.ace-tool-table tbody th { font-weight: 400; text-align: left; white-space: normal; color: var(--awb-color5); }
button.ace-tool-cta { border: 0; cursor: pointer; font-family: inherit; }
/* Ruimte in de velden. Het standaardpijltje van de browser staat altijd tegen de rand, ongeacht de
   padding; daarom een eigen pijltje met ruimte eromheen. Getalvelden zonder spinnerpijltjes. */
.ace-tool select, .ace-tool input[type="number"] { padding-left: 16px; padding-right: 16px; }
.ace-tool select {
	-webkit-appearance: none; appearance: none; padding-right: 44px; text-overflow: ellipsis;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23141414' stroke-width='1.8'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 18px center; background-size: 12px 8px;
}
.ace-tool input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.ace-tool input[type="number"]::-webkit-inner-spin-button, .ace-tool input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* "Dit vulde je eerder in" */
.ace-tool-eerder { margin: 0 0 28px; padding: 16px 20px; background: var(--awb-color3); border-left: 2px solid var(--awb-color4); }
.ace-tool-eerder p { margin: 0 0 12px; }
.ace-tool-eerder-knoppen { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ace-tool-eerder .ace-tool-klein { margin: 0; }
.ace-tool-link { padding: 0; font: inherit; color: inherit; text-decoration: underline; background: none; border: 0; cursor: pointer; }
.ace-tool-link:focus-visible { outline: 2px solid var(--awb-color4); outline-offset: 2px; }

/* Bronnen ([ace_tool_bronnen]) */
.ace-tool-bronnen { margin: 0; padding-left: 18px; }
.ace-tool-bronnen li { margin: 0 0 6px; }

/* Mailformulier (.ace-tool-na-uitkomst) en de rest van de pagina (.ace-tool-later) pas na een uitkomst.
   Alleen met JavaScript (html.ace-js); zonder JS en voor zoekmachines blijft alles zichtbaar. */
.ace-js .ace-tool-na-uitkomst:not(.is-zichtbaar), .ace-js .ace-tool-later:not(.is-zichtbaar) { display: none !important; }

/* ---------- Wat mag een lead kosten? (.ace-lk) ----------
   Groen/oranje/rood bestaan niet in het Avada-palet; alleen binnen de tool. De middelste zone
   ("terugverdiend, maar later") is groen-oranje gestreept: wel terugverdiend, alleen niet meteen. */
.ace-lk { --lk-groen: #1d7a45; --lk-groen-bg: rgba(29, 122, 69, 0.09); --lk-oranje: #d68c14; --lk-oranje-tekst: #a05a00; --lk-oranje-bg: rgba(214, 140, 20, 0.12); --lk-rood: #b42318; --lk-rood-bg: rgba(180, 35, 24, 0.08);
	--lk-streep: repeating-linear-gradient(135deg, var(--lk-groen) 0 6px, var(--lk-oranje) 6px 12px); }

/* Twee kolommen: vragen links, uitkomst rechts */
.ace-lk-kolommen { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); gap: 32px 40px; align-items: start; }
.ace-lk-invoer { display: flex; flex-direction: column; gap: 20px; }
.ace-lk-invoer .ace-tool-eyebrow { margin: 0; }
.ace-lk-rij .ace-tool-label { display: block; margin-bottom: 4px; }
.ace-lk-extra { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 14px; align-items: center; margin-top: 12px; padding: 12px 14px; background: var(--awb-color3); }
.ace-lk-extra label { margin: 0; }
.ace-lk-extra select { max-width: 160px; }
.ace-lk-extra input[type="number"] { width: 90px; }
.ace-lk-invoer select#ace-lk-model { max-width: 100%; }
.ace-lk-uitkomst { border-left: 2px solid var(--awb-color2); padding-left: 28px; }
.ace-lk-uitkomst p { margin: 0 0 12px; }
/* Avada's ".post-content p { margin: 0 }" wint van één class; daarom .ace-lk p.… */
.ace-lk p.ace-lk-hulp { margin: 0 0 8px; }
.ace-lk p.ace-lk-onderschrift { margin: 56px 0 0; padding-top: 20px; border-top: 1px solid var(--awb-custom_color_4); }

/* Blokken */
.ace-lk-blok { padding: 0 0 24px; margin: 0 0 24px; border-bottom: 1px solid var(--awb-custom_color_4); }
.ace-lk-blok > .ace-tool-scenario { margin: 0 0 8px; }
/* "Waarom": serif-accent zoals de psy-notes (typografie ct3) */
.ace-lk-uitkomst .ace-lk-waarom { font-family: var(--awb-custom_typography_3-font-family); font-style: italic; font-size: 16px; line-height: 1.5; color: var(--awb-color5); }
.ace-lk-blok a { color: var(--awb-color2); text-decoration: underline; text-decoration-color: var(--awb-color4); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* Balk met zones en "nu" */
.ace-lk-balk { margin: 30px 0 14px; }
.ace-lk-baan { position: relative; display: flex; height: 14px; }
.ace-lk-zone { display: block; height: 100%; }
.ace-lk-zone.is-groen, .ace-lk i.is-groen { background: var(--lk-groen); }
.ace-lk-zone.is-later, .ace-lk i.is-later { background: var(--lk-streep); }
.ace-lk-zone.is-rood, .ace-lk i.is-rood { background: var(--lk-rood); }
.ace-lk-zone.is-rood { flex: 1; }
.ace-lk-nu { position: absolute; top: -8px; bottom: -8px; width: 3px; margin-left: -1px; background: var(--awb-color2); }
.ace-lk-nu > span { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 4px; padding: 2px 8px; font-size: 12px; font-weight: 600; white-space: nowrap; color: var(--awb-color1); background: var(--awb-color2); }
.ace-lk-nu.is-links > span { left: -1px; transform: none; }
.ace-lk-legenda, .ace-lk-check { list-style: none; margin: 12px 0 0; padding: 0; }
.ace-lk-legenda { font-size: 13px; line-height: 1.5; color: var(--awb-color5); }
.ace-lk-legenda li { margin: 0 0 2px; }
.ace-lk-check { margin: 0 0 12px; }
.ace-lk-check li { margin: 0 0 8px; padding-left: 20px; text-indent: -20px; }
.ace-lk-legenda i, .ace-lk-check i { display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: -1px; text-indent: 0; }

/* Oordeel over de huidige prijs */
.ace-lk-oordeel { margin: 16px 0 0; padding: 14px 18px; border-left: 4px solid var(--awb-color7); background: var(--awb-color1); }
.ace-lk-oordeel p:last-child { margin: 0; }
[data-zone="groen"] .ace-lk-oordeel { border-left-color: var(--lk-groen); background: var(--lk-groen-bg); }
[data-zone="oranje"] .ace-lk-oordeel { border-image: var(--lk-streep) 1; background: var(--lk-oranje-bg); }
[data-zone="rood"] .ace-lk-oordeel { border-left-color: var(--lk-rood); background: var(--lk-rood-bg); }
[data-zone="groen"] .ace-lk-oordeel strong { color: var(--lk-groen); }
[data-zone="oranje"] .ace-lk-oordeel strong { color: var(--lk-oranje-tekst); }
[data-zone="rood"] .ace-lk-oordeel strong { color: var(--lk-rood); }

/* Zo komen we erop: de som */
.ace-lk-som { width: 100%; border-collapse: collapse; margin: 4px 0 12px; font-size: 14px; }
.ace-lk-som th, .ace-lk-som td { padding: 8px 6px; border-bottom: 1px solid var(--awb-custom_color_4); vertical-align: baseline; }
.ace-lk-som th { font-weight: 400; text-align: left; color: var(--awb-color5); }
.ace-lk-som td { text-align: right; white-space: nowrap; color: var(--awb-color6); }
.ace-lk-som td:last-child { color: var(--awb-color2); font-weight: 600; }
.ace-lk-som tr.is-som th, .ace-lk-som tr.is-som td { border-top: 2px solid var(--awb-color2); }

/* Je antwoord: tegels max per lead en break-even ROAS */
.ace-lk-tegels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 4px 0 16px; }
.ace-lk-tegel { padding: 16px 18px; background: var(--awb-color1); border: 1px solid var(--awb-custom_color_4); }
.ace-lk-uitkomst .ace-lk-tegel p { margin: 0; }
.ace-lk-tegel-label { font-size: 13px; color: var(--awb-color5); }
.ace-lk-uitkomst .ace-lk-tegel .ace-lk-tegel-waarde { margin: 4px 0 0; font-size: 30px; font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; color: var(--awb-color2); }
.ace-lk-tegel.is-hoofd .ace-lk-tegel-waarde span { background: linear-gradient(transparent 62%, var(--awb-color4) 62%); }

/* Waar zit je ruimte */
.ace-lk-knoppen { margin: 0 0 10px; padding-left: 18px; }
.ace-lk-knoppen li { margin: 0 0 8px; }

@media (max-width: 900px) {
	.ace-lk-kolommen { grid-template-columns: minmax(0, 1fr); }
	.ace-lk-uitkomst { border-left: 0; padding-left: 0; border-top: 2px solid var(--awb-color2); padding-top: 24px; }
}
@media (max-width: 480px) {
	.ace-lk-tegels { grid-template-columns: minmax(0, 1fr); }
	.ace-lk-som td:nth-child(2) { display: none; }
}

/* ---------- Hoeveel mediabudget heb je nodig? (.ace-mb) ----------
   Mitchels tool; de basis (.ace-hb-cols, .ace-tool-figs, .ace-tool-opt, .ace-rend-vlekken) staat in
   acedigital.css. Zonder JavaScript staat alles open; met JavaScript (html.ace-js) stap voor stap. */
.ace-js .ace-mb-sectie:not(.is-open), .ace-js .ace-mb-uit:not(.is-open), .ace-js .ace-mb-voet:not(.is-open), .ace-js .ace-mb-onderschrift:not(.is-open) { display: none; }
.ace-mb-sectie + .ace-mb-sectie { margin-top: 34px; padding-top: 28px; border-top: 2px solid var(--awb-color2); }
.ace-mb .ace-mb-kop { font-size: 22px; margin: 0 0 20px; }
.ace-mb .ace-mb-tussenkop { font-size: 17px; margin: 0 0 6px; }
.ace-mb .ace-mb-ruim { margin-top: 24px; }
.ace-mb-invoer { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.ace-mb-invoer .ace-tool-eyebrow { margin: 0; }
.ace-mb-rij .ace-tool-label { display: block; margin-bottom: 4px; }
.ace-mb-rij .ace-tool-opts { margin: 6px 0 0; }
.ace-mb p.ace-mb-hulp { margin: 0 0 8px; }
.ace-mb p.ace-mb-kk { margin: 8px 0 0; }
.ace-mb p.ace-mb-kk a { color: var(--awb-color2); text-decoration: underline; text-decoration-color: var(--awb-color4); text-underline-offset: 3px; }
.ace-mb-extra { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 14px; align-items: center; margin-top: 12px; padding: 12px 14px; background: var(--awb-color3); }
.ace-mb-extra label { margin: 0; }
.ace-mb-extra select { max-width: 160px; }
.ace-mb-extra input[type="number"] { width: 90px; }
.ace-mb-uit { min-width: 0; }
.ace-mb-uit p { margin: 0 0 12px; }
.ace-mb-start { margin-top: 22px; }
.ace-mb-smal { max-width: 560px; }
.ace-mb-tekst { max-width: 640px; }
.ace-mb-klein { font-size: 14px; }
.ace-mb-link { margin-top: 12px; font-size: 13px; text-decoration-color: var(--awb-color4); text-underline-offset: 3px; }
.ace-mb-blok { margin: 18px 0 0; padding: 16px 18px; background: var(--awb-color3); border-left: 2px solid var(--awb-color4); }
.ace-mb-blok .ace-tool-label { display: block; }
.ace-mb .ace-mb-blok p.ace-tool-label { margin: 0 0 6px; }
.ace-mb .ace-mb-blok ul.ace-mb-voorbeelden { margin: -6px 0 12px; padding-left: 18px; }
.ace-mb .ace-mb-blok ul.ace-mb-voorbeelden li { margin: 0 0 2px; }
.ace-mb .ace-mb-blok .ace-mb-tussen-vraag { margin: 18px 0 4px; }
.ace-mb-verder-wrap { margin-top: 22px; }
.ace-tool .ace-mb-verder { background: var(--awb-color4) !important; color: var(--awb-color2) !important; }
.ace-tool .ace-mb-verder:hover, .ace-tool .ace-mb-verder:focus-visible { background: var(--awb-color2) !important; color: var(--awb-color3) !important; }

/* Schuiven: grote waarde, gele vulling tot de knop (--pct zet de JS) */
.ace-mb-schuif { margin: 0 0 6px; }
.ace-mb-schuif-kop { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.ace-mb-schuif-kop .ace-tool-label { margin: 0; }
.ace-mb-schuif-waarde { font-size: 24px; font-weight: 600; letter-spacing: -0.02em; color: var(--awb-color2); }
.ace-mb-schuif-waarde.is-verlies { color: var(--awb-color6); }
.ace-tool .ace-mb input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; max-width: none; height: 28px; margin: 10px 0 4px; background: transparent; cursor: pointer; }
.ace-mb input[type="range"]::-webkit-slider-runnable-track { height: 8px; background: linear-gradient(to right, var(--awb-color4) 0 var(--pct, 50%), rgba(20, 20, 20, 0.12) var(--pct, 50%) 100%); }
.ace-mb input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -8px; background: var(--awb-color2); border: 3px solid var(--awb-color4); border-radius: 0; }
.ace-mb input[type="range"]::-moz-range-track { height: 8px; background: rgba(20, 20, 20, 0.12); }
.ace-mb input[type="range"]::-moz-range-progress { height: 8px; background: var(--awb-color4); }
.ace-mb input[type="range"]::-moz-range-thumb { width: 18px; height: 18px; background: var(--awb-color2); border: 3px solid var(--awb-color4); border-radius: 0; }
.ace-mb input[type="range"]:focus-visible { outline: 2px solid var(--awb-color2); outline-offset: 4px; }

/* Groeipad en grafieken */
.ace-mb-fases { list-style: none; margin: 18px 0 0; padding: 0; }
.ace-mb-fases li { margin: 0 0 14px; padding: 0 0 14px; border-bottom: 1px solid var(--awb-custom_color_4); }
.ace-mb-fase-kop { display: block; font-weight: 600; color: var(--awb-color2); }
.ace-mb-fase-kop span { font-weight: 400; color: var(--awb-color6); }
.ace-mb-fase-budget { display: block; margin: 2px 0 4px; font-size: 13px; color: var(--awb-color6); }
.ace-mb-fase-tekst { display: block; font-size: 14px; }
.ace-mb-svg { display: block; width: 100%; max-width: 480px; height: auto; margin: 16px 0 8px; font-family: inherit; }
.ace-mb-svg-breed { max-width: 560px; margin-top: 12px; }
.ace-mb-lijn { font-weight: 600; color: var(--awb-color2); }
.ace-mb-lijn.is-gunstig { color: var(--awb-color8); }
.ace-mb .ace-mb-legenda { margin-bottom: 14px; }

/* Tabellen */
.ace-mb-tabel { max-width: 640px; margin: 6px 0 10px; }
.ace-mb-tabel-breed { max-width: 760px; }
.ace-mb .ace-tool-table td.ace-mb-wrap, .ace-mb .ace-tool-table th.ace-mb-wrap { white-space: normal; }
.ace-mb .ace-tool-table td.is-gedempt { color: var(--awb-color6); }
.ace-mb-vg-label { display: block; font-size: 12px; color: var(--awb-color6); }
.ace-mb .ace-mb-vg tr.is-nu td { background: var(--awb-color3); font-weight: 600; }
.ace-mb .ace-mb-vg tr.is-nu td:first-child { box-shadow: inset 3px 0 0 var(--awb-color4); }
.ace-mb .ace-mb-permaand { margin: 14px 0 8px; }
.ace-mb .ace-mb-opt-klein { padding: 8px 14px; font-size: 13px; }
.ace-vt { font-size: 12.5px; }
.ace-vt th, .ace-vt td { padding-left: 4px; padding-right: 4px; }
.ace-vt thead th { white-space: normal; text-align: right; font-weight: 600; color: var(--awb-color2); }
.ace-vt .ace-vt-groep { text-align: center; padding-top: 6px; padding-bottom: 6px; }
.ace-vt .kort { display: none; }
@media (max-width: 600px) {
	.ace-vt { font-size: 11.5px; }
	.ace-vt th, .ace-vt td { padding-left: 3px; padding-right: 3px; }
	.ace-vt .lang { display: none; }
	.ace-vt .kort { display: inline; }
}

/* Voet: uitleg en kopiëren */
.ace-mb-voet { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--awb-custom_color_4); }
.ace-mb-uitleg { margin-top: 16px; }
.ace-mb p.ace-mb-onderschrift { margin: 40px 0 0; }

/* Verder-knoppen: ruimte erboven (Avada's ".post-content p { margin: 0 }" wint anders) */
.ace-mb p.ace-mb-verder-wrap { margin: 28px 0 0; }

/* Stap 4: uitleg links, "elke verdubbeling" rechts */
.ace-mb-intro4 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr); gap: 24px 40px; align-items: start; margin: 0 0 22px; }
.ace-mb-intro4 .ace-mb-tekst { max-width: none; }
.ace-mb-vd { margin: 0; padding: 20px 22px; background: var(--awb-color1); border: 1px solid var(--awb-custom_color_4); }
.ace-mb-vd figcaption { margin: 0 0 14px; }
.ace-mb-vd figcaption strong { display: block; font-size: 17px; line-height: 1.35; color: var(--awb-color2); }
.ace-mb-vd ol { list-style: none; margin: 0 0 12px; padding: 0; }
.ace-mb-vd li { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 4px 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--awb-custom_color_4); }
.ace-mb-vd-label { font-size: 13px; font-weight: 600; color: var(--awb-color5); }
.ace-mb-vd-balk { display: block; height: 10px; background: var(--awb-color3); }
.ace-mb-vd-balk span { display: block; height: 100%; background: var(--awb-color4); }
.ace-mb-vd-cijfers { grid-column: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 14px; color: var(--awb-color2); }
.ace-mb-vd-zonder { color: var(--awb-color7); text-decoration: line-through; text-decoration-color: var(--awb-color8); }
.ace-mb-vd-cpl { margin-left: auto; font-size: 13px; color: var(--awb-color6); }
.ace-mb p.ace-mb-vd-noot, .ace-mb-vd .ace-tool-note { margin: 0; }
@media (max-width: 900px) {
	.ace-mb-intro4 { grid-template-columns: minmax(0, 1fr); }
}

/* Rapport (mediabudget): op het scherm alleen de knop; het rapport zelf verschijnt bij printen / opslaan als PDF.
   Pagina zonder marge, zodat de gele baan over de hele linkerkant loopt; boven- en onderruimte per pagina via thead/tfoot. */
.ace-mb .ace-mb-rapport-blok { margin: 0 0 22px; padding: 18px 20px; background: var(--awb-color3); border-left: 3px solid var(--awb-color4); }
.ace-mb .ace-mb-rapport-blok p { margin: 0 0 8px; }
.ace-mb .ace-mb-rapport-blok p.ace-tool-actions { margin: 12px 0 0; }
.ace-mb-rapport { display: none; }
@media print {
	/* Huisstijl van de homepage: papier met een fijn raster, een okeren draad langs de linkerkant met een
	   halte bij elk hoofdstuk, eyebrows met // en koppen strak en zwart. */
	@page { size: A4; margin: 0; }
	html.ace-print-mb { background: var(--awb-color3) !important; }
	html.ace-print-mb body { background: transparent !important; }
	html.ace-print-mb, html.ace-print-mb body { margin: 0 !important; padding: 0 !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
	html.ace-print-mb body > *:not(.ace-mb-rapport) { display: none !important; }
	html.ace-print-mb .ace-mb-rapport { display: block; font-size: 10.5pt; line-height: 1.5; color: var(--awb-color5); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	/* Op elke pagina: papier, raster en de draad (position: fixed herhaalt per pagina) */
	.ace-mb-r-achter { position: fixed; inset: 0; z-index: -1; background-color: var(--awb-color3); background-image: linear-gradient(rgba(20, 20, 20, 0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(20, 20, 20, 0.045) 1px, transparent 1px); background-size: 12mm 12mm; background-position: -1px -1px; }
	.ace-mb-r-draad { position: absolute; left: 14mm; top: 0; bottom: 0; width: 1.5px; background: var(--awb-color8); opacity: 0.55; }
	.ace-mb-r-pagina { width: 100%; border-collapse: collapse; margin: 0; background: transparent; }
	.ace-mb-r-pagina > thead > tr > td, .ace-mb-r-pagina > tfoot > tr > td, .ace-mb-r-pagina > tbody > tr > td { padding: 0 16mm 0 24mm; border: 0; background: transparent; text-align: left; white-space: normal; }
	.ace-mb-r-boven { height: 14mm; }
	.ace-mb-r-onder { height: 14mm; display: flex; justify-content: space-between; align-items: center; font-size: 7.5pt; letter-spacing: 0.04em; color: var(--awb-color7); border-top: 1px solid rgba(20, 20, 20, 0.1); }
	.ace-mb-rapport p { margin: 0 0 8px; }
	.ace-mb-r-kop { display: flex; justify-content: space-between; align-items: center; padding-bottom: 12px; margin-bottom: 26px; border-bottom: 1px solid rgba(20, 20, 20, 0.1); }
	.ace-mb-r-kop p { margin: 0; font-size: 8.5pt; color: var(--awb-color6); }
	.ace-mb-r-logo { display: block; height: 28px; width: auto; }
	.ace-mb-rapport p.ace-mb-r-merk { font-size: 16pt; font-weight: 700; letter-spacing: -0.02em; color: var(--awb-color2); text-shadow: 2px 2px 0 var(--awb-color4); }
	.ace-mb-rapport p.ace-mb-r-eyebrow { margin: 0 0 8px; font-size: 7.5pt; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--awb-color7); }
	.ace-mb-r-eyebrow span { color: var(--awb-color8); margin-right: 4px; }
	.ace-mb-r-titel { position: relative; font-size: 30pt; font-weight: 600; line-height: 1.04; margin: 0 0 22px; letter-spacing: -0.035em; color: var(--awb-color2); }
	.ace-mb-r-titel em { font-family: Lora, Georgia, serif; font-style: italic; font-weight: 400; letter-spacing: -0.01em; }
	.ace-mb-r-punt { color: var(--awb-color8); }
	/* Hoofdstukken: nummer als eyebrow, een halte op de draad */
	.ace-mb-r-sectie { position: relative; margin: 0 0 20px; }
	.ace-mb-r-sectie h2 { position: relative; display: block; font-size: 15pt; font-weight: 600; letter-spacing: -0.025em; line-height: 1.15; margin: 0 0 12px; color: var(--awb-color2); break-after: avoid; page-break-after: avoid; break-inside: avoid; }
	.ace-mb-r-sectie h2::before { content: ""; position: absolute; left: -10mm; top: 0.45em; width: 9px; height: 9px; margin-left: -4.5px; border-radius: 50%; background: var(--awb-color3); border: 2px solid var(--awb-color8); box-sizing: border-box; }
	.ace-mb-r-nr { display: block; margin: 0 0 4px; font-size: 7.5pt; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--awb-color8); }
	.ace-mb-r-sectie + .ace-mb-r-sectie { padding-top: 16px; border-top: 1px solid rgba(20, 20, 20, 0.1); }
	.ace-mb-r-invoer { padding: 14px 16px; background: var(--awb-color1); border: 1px solid rgba(20, 20, 20, 0.1); }
	.ace-mb-r-invoer h2 { font-size: 11pt; margin-bottom: 8px; }
	.ace-mb-r-invoer h2::before { top: 0.35em; left: calc(-10mm - 17px); }
	.ace-mb-r-lijst { margin: 0; padding-left: 16px; columns: 2; column-gap: 24px; }
	.ace-mb-r-lijst li { margin: 0 0 3px; break-inside: avoid; }
	.ace-mb-r-lijst li::marker { color: var(--awb-color8); }
	.ace-mb-r-tegels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 12px; break-inside: avoid; }
	.ace-mb-r-tegel { padding: 10px 12px; border: 1px solid rgba(20, 20, 20, 0.1); background: var(--awb-color1); }
	.ace-mb-r-tegel.is-accent { border-left: 3px solid var(--awb-color4); }
	.ace-mb-r-tegel strong { display: block; font-size: 13pt; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; margin: 3px 0; color: var(--awb-color2); }
	.ace-mb-r-l { display: block; font-size: 7pt; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--awb-color7); }
	.ace-mb-r-s { display: block; font-size: 8.5pt; color: var(--awb-color6); }
	.ace-mb-r-fases { margin: 0; padding-left: 18px; }
	.ace-mb-r-fases li { margin: 0 0 5px; }
	.ace-mb-r-fases li::marker { color: var(--awb-color8); font-weight: 600; }
	.ace-mb-r-fases strong { color: var(--awb-color2); }
	.ace-mb-r-fases span { font-size: 9pt; color: var(--awb-color6); }
	.ace-mb-rapport .ace-mb-svg { max-width: 150mm; margin: 6px 0; padding: 8px 10px; background: var(--awb-color1); border: 1px solid rgba(20, 20, 20, 0.1); box-sizing: border-box; break-inside: avoid; }
	.ace-mb-rapport .ace-mb-legenda { break-before: avoid; }
	.ace-mb-rapport .ace-tool-table { font-size: 9pt; background: var(--awb-color1); }
	.ace-mb-rapport .ace-tool-tablewrap { overflow: visible; break-inside: avoid; }
	.ace-mb-rapport a { color: inherit; text-decoration: none; }
	.ace-mb-rapport strong { color: var(--awb-color2); }
	/* Afsluiter in de stijl van de donkere CTA op de homepage */
	.ace-mb-r-voet { margin: 8px 0 0; padding: 16px 18px; background: var(--awb-color2); break-inside: avoid; }
	.ace-mb-r-voet p, .ace-mb-r-voet .ace-tool-note { color: rgba(255, 255, 255, 0.82); }
	.ace-mb-rapport .ace-mb-r-voet strong { color: var(--awb-color4); }
	.ace-mb-r-voet p:last-child { margin: 0; font-family: Lora, Georgia, serif; font-style: italic; color: rgba(255, 255, 255, 0.55); }
	.ace-mb-r-heel { break-inside: avoid; }
	.ace-mb-r-bijlage { break-before: page; }
	.ace-mb-r-sectie.ace-mb-r-bijlage { padding-top: 0; border-top: 0; }
	.ace-mb-r-uitleg { margin: 0 0 10px; padding-left: 18px; font-size: 9.5pt; }
	.ace-mb-r-uitleg li { margin: 0 0 6px; }
	.ace-mb-r-uitleg li::marker { color: var(--awb-color8); }
}

/* ---------- Op welk kanaal kun je het beste adverteren? (.ace-kk) ----------
   Eén vraag per keer (.is-open); zonder JavaScript staan alle vragen onder elkaar. */
.ace-kk { max-width: 720px; }
.ace-kk p.ace-kk-lead { margin: 0 0 4px; font-size: 17px; line-height: 1.55; color: var(--awb-color2); }
.ace-kk p.ace-kk-begin { margin: 26px 0 0; }
.ace-kk p.ace-kk-begin .ace-tool-note { margin: 0; }
html:not(.ace-js) .ace-kk-begin, html:not(.ace-js) .ace-kk-nav { display: none; }
.ace-kk-voortgang { margin: 0 0 18px; }
.ace-kk p[data-kk-teller] { margin: 0 0 6px; }
.ace-kk-baan { height: 4px; background: var(--awb-custom_color_4); }
.ace-kk-baan span { display: block; height: 100%; width: 0; background: var(--awb-color4); transition: width 0.25s ease; }
.ace-kk-vragen { list-style: none; margin: 0; padding: 0; }
.ace-kk-vraag { margin: 0 0 28px; }
.ace-js .ace-kk-vraag:not(.is-open), .ace-js .ace-kk p.ace-kk-nr { display: none; }
.ace-kk p.ace-kk-nr { margin: 0 0 4px; }
.ace-kk p.ace-kk-titel { margin: 0 0 6px; outline: none; }
.ace-kk p.ace-kk-hulp { margin: 0 0 10px; }
.ace-kk-info { margin: 0 0 14px; font-size: 14px; }
.ace-kk-info summary { display: inline-block; cursor: pointer; color: var(--awb-color6); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--awb-color4); }
.ace-kk-info summary::-webkit-details-marker { display: none; }
.ace-kk .ace-kk-info p { margin: 8px 0 0; padding: 12px 14px; background: var(--awb-color3); color: var(--awb-color5); max-width: 62ch; }
.ace-kk-opts { display: grid; gap: 8px; }
.ace-kk-opt { display: flex; gap: 12px; align-items: flex-start; width: 100%; text-align: left; font: inherit; font-size: 15px; line-height: 1.45; color: var(--awb-color2); background: var(--awb-color1); border: 1px solid var(--awb-custom_color_4); border-radius: 0; padding: 12px 14px; margin: 0; cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.ace-kk-opt:hover { border-color: var(--awb-color2); }
.ace-kk-opt:focus-visible { outline: 2px solid var(--awb-color4); outline-offset: 2px; }
.ace-kk-dot { flex: none; width: 16px; height: 16px; margin-top: 3px; border-radius: 50%; border: 1.5px solid var(--awb-color6); }
.ace-kk-opt[aria-pressed="true"] { border-color: var(--awb-color2); background: var(--awb-color3); }
.ace-kk-opt[aria-pressed="true"] .ace-kk-dot { border: 5px solid var(--awb-color2); }
html:not(.ace-js) .ace-kk-opt { cursor: default; }
.ace-kk p.ace-kk-nav { display: flex; justify-content: space-between; gap: 12px; margin: 14px 0 0; font-size: 14px; color: var(--awb-color6); }
/* Uitkomst */
.ace-kk p.ace-kk-winnaar { font-size: 28px; line-height: 1.2; margin: 0 0 18px; outline: none; }
.ace-kk-matches { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 16px; }
.ace-kk-match { display: grid; gap: 5px; }
.ace-kk-mrij { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ace-kk-mnaam { font-weight: 600; color: var(--awb-color2); }
.ace-kk-mpct { font-weight: 700; font-size: 18px; font-variant-numeric: tabular-nums; color: var(--awb-color2); }
.ace-kk-mbalk { display: block; height: 8px; background: var(--awb-color3); }
.ace-kk-mbalk span { display: block; height: 100%; background: var(--awb-color7); }
.ace-kk-match.is-top .ace-kk-mbalk span { background: var(--awb-color4); }
.ace-kk-match.is-twijfel .ace-kk-mbalk span { background: repeating-linear-gradient(135deg, var(--awb-color7) 0 4px, transparent 4px 8px); }
.ace-kk-mwaarom { font-size: 14px; line-height: 1.5; color: var(--awb-color6); max-width: 62ch; }
.ace-kk-blok { border-top: 1px solid var(--awb-custom_color_4); padding-top: 16px; margin: 0 0 16px; }
.ace-kk .ace-kk-blok p.ace-tool-label { margin: 0 0 6px; }
.ace-kk .ace-kk-blok p { margin: 0 0 12px; }
.ace-kk-fases { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 0 0 16px; }
.ace-kk-fase { border: 1px solid var(--awb-custom_color_4); padding: 12px 14px; display: grid; gap: 2px; align-content: start; }
.ace-kk-fase strong { font-size: 14px; color: var(--awb-color2); }
.ace-kk-fase span { font-size: 14px; line-height: 1.5; color: var(--awb-color6); }
.ace-kk p.ace-kk-noot { padding: 12px 14px; background: var(--awb-color3); border-left: 3px solid var(--awb-color4); font-size: 14px; margin: 0 0 16px; }
.ace-kk p.ace-kk-knoppen { margin: 0 0 14px; }
.ace-kk .ace-kk-knoppen a.ace-tool-ghost { text-decoration: none; }
.ace-kk p.ace-kk-links { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 14px; margin: 0 0 10px; }
.ace-kk p.ace-kk-onderschrift { margin: 24px 0 0; }

/* Deellink ("Deel via link"), voor alle tools: de link staat in een vak, zodat je hem ook zelf kunt kopiëren. */
.ace-tool p.ace-tool-deelvak { margin: 10px 0 0; max-width: 560px; }
.ace-tool-deelvak label { display: grid; gap: 6px; font-size: 13px; color: var(--awb-color6); margin: 0; }
.ace-tool-deelvak input { font: inherit; font-size: 13px; padding: 8px 10px; border: 1px solid var(--awb-custom_color_4); background: var(--awb-color3); color: var(--awb-color2); width: 100%; min-width: 0; }

/* ---------- Waar lopen je campagnes vast? (.ace-qz) ----------
   Drie schermen: intro (tekst en de lus van zes plekken), de vragen (één per keer) en de uitslag.
   Zonder JavaScript: de intro en de lijst met vragen (.ace-qz-statisch). */
.ace-qz p { margin: 0; }
.ace-qz-intro { display: grid; gap: 32px; align-items: center; }
@media (min-width: 900px) { .ace-qz-intro { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 56px; } }
.ace-qz p.ace-qz-lede { margin: 10px 0 0; font-size: 19px; line-height: 1.55; color: var(--awb-color2); max-width: 56ch; }
.ace-qz p.ace-qz-begin { margin: 26px 0 0; }
.ace-qz .ace-qz-intro-tekst > .ace-tool-note { margin: 14px 0 0; max-width: 52ch; }
html:not(.ace-js) .ace-qz-begin { display: none; }
.ace-qz-intro-lus { justify-self: center; width: 100%; max-width: 400px; margin: 0; }
.ace-qz-intro-lus figcaption { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--awb-color6); text-align: center; }
.ace-qz-statisch { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--awb-custom_color_4); }
.ace-js .ace-qz-statisch { display: none; }
.ace-qz .ace-qz-statisch .ace-tool-eyebrow { margin: 14px 0 6px; }
.ace-qz-statisch-lijst { margin: 0; padding-left: 20px; font-size: 15px; color: var(--awb-color5); }
.ace-qz-statisch-lijst li { margin: 0 0 4px; }
.ace-qz-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* De lus */
svg.ace-qz-lus { display: block; width: 100%; height: auto; overflow: visible; }
.ace-qz .lp-ring { fill: none; stroke: var(--awb-custom_color_4); stroke-width: 1.5; }
.ace-qz .lp-chev { fill: none; stroke: var(--awb-color6); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ace-qz .lp-inner { font-size: 9.5px; font-weight: 600; letter-spacing: 0.12em; fill: var(--awb-color6); text-anchor: middle; }
.ace-qz .lp-center { font-weight: 600; fill: var(--awb-color2); text-anchor: middle; letter-spacing: -0.01em; }
.ace-qz .lp-sub { font-size: 10px; font-weight: 600; letter-spacing: 0.08em; fill: var(--awb-color6); text-anchor: middle; }
.ace-qz .lp-node { stroke-width: 1.5; }
.ace-qz .lp-node.neutral { fill: var(--awb-color3); stroke: var(--awb-color7); }
.ace-qz .lp-node.low { fill: var(--awb-color1); stroke: var(--awb-color7); }
.ace-qz .lp-node.mid { fill: var(--awb-custom_color_4); stroke: var(--awb-color6); }
.ace-qz .lp-node.warm { fill: color-mix(in srgb, var(--awb-color4) 45%, var(--awb-color1)); stroke: var(--awb-color8); }
.ace-qz .lp-node.hot { fill: var(--awb-color4); stroke: var(--awb-color8); }
.ace-qz .lp-knob { fill: none; stroke: var(--awb-color2); stroke-width: 1.5; stroke-dasharray: 3 3; }
.ace-qz .lp-label { font-size: 13px; font-weight: 600; fill: var(--awb-color2); text-anchor: middle; }
.ace-qz .lp-knoblbl { font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; fill: var(--awb-color5); text-anchor: middle; }
.ace-qz .lp-pulse { fill: none; stroke: var(--awb-color4); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: ace-qz-puls 1.8s ease-out 0.4s 2 both; }
@keyframes ace-qz-puls { 0% { opacity: 0.85; transform: scale(1); } 100% { opacity: 0; transform: scale(1.8); } }

/* Vragen */
.ace-qz-quiz { max-width: 760px; }
.ace-qz-balk { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--awb-color6); }
.ace-qz-voortgang { display: flex; gap: 4px; margin-top: 10px; }
.ace-qz-seg { height: 4px; background: var(--awb-custom_color_4); overflow: hidden; }
.ace-qz-seg span { display: block; width: 0; height: 100%; background: var(--awb-color4); transition: width 0.3s ease; }
.ace-qz-vraag { margin-top: 32px; }
.ace-qz-vraag.is-nieuw { animation: ace-qz-in 0.28s ease-out both; }
@keyframes ace-qz-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.ace-qz p.ace-qz-titel { margin: 8px 0 0; font-size: 26px; line-height: 1.2; max-width: 30ch; outline: none; }
.ace-qz p.ace-qz-hulp { margin: 10px 0 0; font-size: 15px; max-width: 58ch; }
.ace-qz-info { margin: 12px 0 0; font-size: 14px; }
.ace-qz-info summary { display: inline-block; cursor: pointer; color: var(--awb-color6); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--awb-color4); }
.ace-qz-info summary::-webkit-details-marker { display: none; }
.ace-qz .ace-qz-info p { margin: 8px 0 0; padding: 12px 14px; background: var(--awb-color3); color: var(--awb-color5); max-width: 58ch; }
.ace-qz-antwoorden { display: grid; gap: 8px; margin-top: 22px; }
.ace-qz-antwoord { display: flex; align-items: center; gap: 14px; width: 100%; margin: 0; padding: 13px 16px; border: 1px solid var(--awb-custom_color_4); border-radius: 0; background: var(--awb-color1); text-align: left; font: inherit; font-size: 16px; line-height: 1.4; color: var(--awb-color2); cursor: pointer; transition: border-color 0.15s, background-color 0.15s; }
.ace-qz-antwoord:hover { border-color: var(--awb-color2); }
.ace-qz-antwoord:focus-visible { outline: 2px solid var(--awb-color4); outline-offset: 2px; }
.ace-qz-letter { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--awb-custom_color_4); font-size: 12px; font-weight: 600; color: var(--awb-color5); }
.ace-qz-antwoord[aria-checked="true"] { border-color: var(--awb-color2); background: var(--awb-color3); }
.ace-qz-antwoord[aria-checked="true"] .ace-qz-letter { background: var(--awb-color2); border-color: var(--awb-color2); color: var(--awb-color4); }
.ace-qz-anders { margin-top: 14px; font-size: 14px; color: var(--awb-color6); }
.ace-qz-anders-vak { display: grid; gap: 10px; margin-top: 10px; padding: 14px; border: 1px solid var(--awb-custom_color_4); background: var(--awb-color1); }
.ace-qz-anders-vak label { font-size: 14px; color: var(--awb-color5); margin: 0; }
.ace-qz-anders-vak textarea { width: 100%; min-height: 76px; padding: 10px 12px; border: 1px solid var(--awb-custom_color_4); background: var(--awb-color3); color: var(--awb-color2); font: inherit; font-size: 15px; resize: vertical; }
.ace-qz-anders-vak .ace-tool-cta { justify-self: start; border: 0; cursor: pointer; font-family: inherit; }
.ace-qz p.ace-qz-voet { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 26px; font-size: 14px; color: var(--awb-color6); }
.ace-qz p.ace-qz-voet .ace-tool-note { margin: 0; }
.ace-qz-balk span:last-child, .ace-qz-voet .ace-tool-link { white-space: nowrap; }
@media (hover: none), (max-width: 600px) { .ace-qz-toetsen { display: none; } }

/* Uitslag */
.ace-qz-uitslag { display: grid; gap: 40px; }
.ace-qz p.ace-qz-uittitel { margin: 8px 0 0; font-size: 34px; line-height: 1.1; max-width: 22ch; outline: none; }
.ace-qz p.ace-qz-vergelijk { margin: 14px 0 0; font-size: 18px; line-height: 1.55; color: var(--awb-color5); max-width: 56ch; }
.ace-qz-vergelijk strong { color: var(--awb-color2); font-weight: 600; }
.ace-qz-raster { display: grid; gap: 32px; align-items: start; }
@media (min-width: 860px) { .ace-qz-raster { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; } }
.ace-qz-uitlus { margin: 0; width: 100%; max-width: 440px; }
.ace-qz-legenda { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 12px 0 0; padding: 0; list-style: none; font-size: 13px; color: var(--awb-color5); }
.ace-qz-legenda li { display: inline-flex; align-items: center; gap: 7px; margin: 0; }
.ace-qz-legenda svg { flex: none; overflow: visible; }
.ace-qz .ace-qz-sec p.ace-tool-label { margin: 0 0 8px; }
.ace-qz-ev { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ace-qz-ev li { display: grid; gap: 4px; margin: 0; padding: 12px 14px; background: var(--awb-color3); border-left: 3px solid var(--awb-color4); }
.ace-qz-ev-v { font-size: 11.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--awb-color6); }
.ace-qz-ev-a { font-size: 15px; color: var(--awb-color2); }
.ace-qz-andersnoot { display: grid; gap: 10px; margin-top: 18px; padding: 14px; border: 1px dashed var(--awb-custom_color_4); }
.ace-qz-andersnoot p { font-size: 14px; color: var(--awb-color5); }
.ace-qz-andersnoot .ace-qz-ev li { background: var(--awb-color1); border-left-color: var(--awb-custom_color_4); }
.ace-qz-uitleg { display: grid; gap: 24px 36px; padding-top: 28px; border-top: 1px solid var(--awb-custom_color_4); }
@media (min-width: 900px) { .ace-qz-uitleg { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ace-qz .ace-qz-uitleg .ace-qz-sec p:not(.ace-tool-label) { font-size: 15px; line-height: 1.6; color: var(--awb-color5); }
.ace-qz .ace-qz-uitleg .is-stap { padding: 14px 16px; background: var(--awb-color3); border-left: 3px solid var(--awb-color4); }
.ace-qz .ace-qz-uitleg .is-stap p:not(.ace-tool-label) { color: var(--awb-color2); }
.ace-qz-week { max-width: 720px; }
.ace-qz .ace-qz-week p.ace-tool-label { margin: 0 0 8px; }
.ace-qz-checks { display: grid; gap: 8px; }
.ace-qz-checks label { display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 12px 14px; border: 1px solid var(--awb-custom_color_4); background: var(--awb-color1); font-size: 15px; color: var(--awb-color2); cursor: pointer; }
.ace-qz-checks input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--awb-color2); cursor: pointer; }
.ace-qz-checks input:checked + span { color: var(--awb-color6); text-decoration: line-through; }
.ace-qz p.ace-qz-daarna { margin-top: 12px; font-size: 15px; color: var(--awb-color5); }
.ace-qz-daarna strong { color: var(--awb-color2); font-weight: 600; }
.ace-qz-alles { padding-top: 22px; border-top: 1px solid var(--awb-custom_color_4); }
.ace-qz-alles summary { cursor: pointer; font-size: 17px; font-weight: 600; color: var(--awb-color2); }
.ace-qz-alles dl { display: grid; margin: 14px 0 0; max-width: 900px; }
.ace-qz-rij { display: grid; gap: 2px 24px; padding: 10px 0; border-bottom: 1px solid var(--awb-custom_color_4); }
@media (min-width: 720px) { .ace-qz-rij { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } }
.ace-qz-rij dt { font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--awb-color6); }
.ace-qz-rij dd { margin: 0; font-size: 15px; color: var(--awb-color2); }
.ace-qz-rij dd.is-eigen { font-style: italic; }
.ace-qz-rapport { padding: 22px 24px; background: var(--awb-color2); color: var(--awb-color1); }
.ace-qz .ace-qz-rapport p { color: rgba(255, 255, 255, 0.78); }
.ace-qz .ace-qz-rapport p.ace-tool-label { margin: 0 0 6px; font-size: 18px; color: var(--awb-color1); }
.ace-qz-krijg { display: grid; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.ace-qz-krijg li { position: relative; margin: 0; padding-left: 24px; font-size: 15px; line-height: 1.45; color: var(--awb-color1); }
.ace-qz-krijg li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 10px; height: 6px; border-left: 2px solid var(--awb-color4); border-bottom: 2px solid var(--awb-color4); transform: rotate(-45deg); }
.ace-qz .ace-qz-rapport p.ace-tool-actions { margin: 18px 0 0; }
.ace-qz .ace-qz-rapport .ace-tool-cta { background: var(--awb-color4); color: var(--awb-color2) !important; border: 0; cursor: pointer; font-family: inherit; }
.ace-qz .ace-qz-rapport .ace-tool-cta:hover { background: var(--awb-color1); }
.ace-qz p.ace-qz-acties { margin: 0; }
.ace-qz-uitslag > .ace-tool-deelvak { margin-top: -28px; }
.ace-qz p.ace-qz-opnieuw { font-size: 14px; color: var(--awb-color6); }
@media (max-width: 600px) {
	.ace-qz p.ace-qz-titel { font-size: 22px; }
	.ace-qz p.ace-qz-uittitel { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) { .ace-qz-vraag.is-nieuw, .ace-qz .lp-pulse { animation: none; } .ace-qz-seg span { transition: none; } }

/* Knoppen met een icoon (data-icoon, zie kern.js): rekenen, kopiëren, link, mail. */
.ace-tool [data-icoon], .ace-tool .ace-kk-icoonlink { display: inline-flex; align-items: center; gap: 8px; }
.ace-knop-icoon { flex: none; width: 16px; height: 16px; }
.ace-tool .ace-tool-ghost[data-icoon] .ace-knop-icoon { color: var(--awb-color8); transition: color 0.15s; }
.ace-tool .ace-tool-ghost[data-icoon]:hover .ace-knop-icoon { color: var(--awb-color2); }
.ace-kk p.ace-kk-links { align-items: center; }
.ace-kk .ace-kk-links a.ace-kk-icoonlink { color: var(--awb-color2); }
.ace-kk .ace-kk-icoonlink .ace-knop-icoon { color: var(--awb-color8); }

/* De gele draad naar het mailformulier (kern.js, naarMail), zoals de draad op de homepage. */
.ace-draad { position: absolute; left: 0; top: 0; z-index: 50; pointer-events: none; overflow: visible; transition: opacity 0.8s ease; }
.ace-draad.is-weg { opacity: 0; }
.ace-draad-lijn { fill: none; stroke: var(--awb-color8); stroke-width: 2; stroke-linecap: round; }
.ace-draad-kop { fill: var(--awb-color4); filter: drop-shadow(0 0 7px rgba(247, 198, 0, 0.95)); transition: opacity 0.3s ease; }
.ace-draad-eind { fill: var(--awb-color2); stroke: var(--awb-color8); stroke-width: 2; transition: fill 0.4s ease; }
.ace-draad-eind.is-aan { fill: var(--awb-color4); }
/* Aangekomen: de mailkaart licht geel op. */
.ace-tool-na-uitkomst .is-aangewezen { outline: 2px solid var(--awb-color4); outline-offset: -1px; animation: ace-mail-gloed 1.1s ease-out 2; }
@keyframes ace-mail-gloed { 0% { box-shadow: 0 0 0 0 rgba(247, 198, 0, 0.6); } 100% { box-shadow: 0 0 0 16px rgba(247, 198, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .ace-tool-na-uitkomst .is-aangewezen { animation: none; } }

/* ---------- Funnelplanner: aanvullingen voor de site (de app zelf: css/tools/funnelplanner.css) ---------- */
.ace-fp .ace-fp-funnels { margin: 28px 0 0; padding: 18px 20px; background: var(--awb-color1); border: 1px solid var(--awb-custom_color_4); }
.ace-fp .ace-fp-funnels summary { cursor: pointer; font-size: 16px; font-weight: 600; color: var(--awb-color2); }
.ace-fp .ace-fp-funnels p.ace-fp-funnels-groep { margin: 16px 0 8px; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--awb-color7); }
.ace-fp .ace-fp-funnels dl { margin: 0; display: grid; gap: 10px; }
.ace-fp .ace-fp-funnels dt { font-weight: 600; color: var(--awb-color2); }
.ace-fp .ace-fp-funnels dd { margin: 2px 0 0; font-size: 14px; line-height: 1.55; color: var(--awb-color5); }
.ace-fp .ace-fp-funnels dd em { color: var(--awb-color6); }
.ace-fp p.ace-fp-voet { margin: 14px 0 0; }
/* Avada geeft formuliervelden en koppen een eigen hoogte en kleur; in de planner geldt Mitchels opmaak. */
.ace-fp input[type="text"], .ace-fp input[type="number"], .ace-fp input[type="email"], .ace-fp select { height: auto; min-height: 0; line-height: 1.4; font-size: 14px; box-shadow: none; }
.ace-fp .cta h2 { color: var(--awb-color1); }
.ace-fp .cta a.btn, .ace-fp a.btn { text-decoration: none !important; }
.ace-fp h2, .ace-fp h3, .ace-fp h4, .ace-fp h5 { text-transform: none; }
/* Avada geeft .row negatieve zijmarges en een clearfix (Bootstrap); in de planner is .row een veld. */
.ace-fp .row { margin-left: 0; margin-right: 0; }
.ace-fp .row::before, .ace-fp .row::after { content: none; display: none; }
/* Geen kaart om de planner: de app heeft een eigen kader. */
.ace-tool.ace-tool--funnelplanner { background: none; border: 0; box-shadow: none; padding: 0; }
/* Alleen het werkblad schermbreed (tot 1680px), met 24px marge aan de randen; de rest blijft in de sitebreedte. */
@media (min-width: 781px) {
	.ace-fp .app { margin-left: min(0px, max(calc(50% - 50vw + 24px), calc(50% - 840px))); margin-right: min(0px, max(calc(50% - 50vw + 24px), calc(50% - 840px))); }
}
.ace-fp .mobile-note .ace-fp-naarpc { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--awb-color2); text-decoration: underline; text-decoration-color: var(--awb-color8); text-underline-offset: 3px; cursor: pointer; }
.ace-fp .mobile-note .ace-fp-naarpc .ace-knop-icoon { color: var(--awb-color8); }
.ace-fp .ace-fp-naarpc-uitleg { display: block; margin-top: 2px; color: var(--awb-color6); }
.ace-fp p.ace-fp-deelvak { margin: 0; padding: 10px 14px; background: var(--awb-color1); border: 1px solid var(--awb-custom_color_4); border-bottom: 0; max-width: none; }
.ace-fp .ace-fp-deelknop .ace-knop-icoon { color: var(--awb-color8); }
@media (max-width: 780px) { .ace-fp .toolbar .ace-fp-deelknop { display: none; } }
/* Kruisje rechts in het deelvak (kern.js) */
.ace-tool-deelvak { position: relative; }
.ace-tool-deelvak label { padding-right: 34px; }
.ace-deelvak-sluit { position: absolute; top: 4px; right: 0; display: grid; place-items: center; width: 28px; height: 28px; margin: 0; padding: 0; border: 0; background: none; color: var(--awb-color6); cursor: pointer; }
.ace-deelvak-sluit:hover { color: var(--awb-color2); }
.ace-deelvak-sluit:focus-visible { outline: 2px solid var(--awb-color4); outline-offset: 2px; }
.ace-fp p.ace-fp-deelvak .ace-deelvak-sluit { top: 8px; right: 10px; }
/* Keuzeknoppen in een veld (zoals "Je verkoopt aan"): gelijk verdeeld over de breedte van het veld. */
.ace-fp .row > .seg { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.ace-fp .row > .seg button { text-align: center; white-space: nowrap; }
.ace-fp .row > .seg button + button { border-left: 1px solid var(--awb-custom_color_4); }
/* Terug en opnieuw in de werkbalk van de funnelplanner (en de knop in de melding). */
.ace-fp .ace-fp-terug { display: inline-flex; gap: 4px; }
.ace-fp .ace-fp-terug .btn { display: inline-flex; align-items: center; justify-content: center; padding: 5px 6px; }
/* Iets smallere funnelkeuze, zodat de werkbalk vanaf 1600px op één regel blijft. */
@media (min-width: 781px) { .ace-fp #funnelSelect { max-width: 240px; } }
.ace-fp .ace-fp-terug svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ace-fp .ace-fp-terug .btn:disabled { opacity: .35; cursor: default; }
.ace-fp .ace-fp-terug .btn[hidden] { display: none; }
.ace-fp .toast .fp-toast-terug { margin-left: 12px; padding: 0; border: 0; background: none; color: var(--gold); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
/* Mobiel: de scenarioknoppen onder het label, over de volle breedte (anders viel "Sterk" buiten beeld). */
@media (max-width: 780px) {
	.ace-fp .toolbar .field-inline:has(#scenSeg) { flex: 1 1 100%; flex-wrap: wrap; gap: 6px; }
	.ace-fp #scenSeg { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
	.ace-fp #scenSeg button { text-align: center; }
}
