ContentCta Sections

---
// ContentCta, recovered from blurr-components.pages.dev
---

<div class="cca-wrap cca-wrap--accent"> <span class="cca-eyebrow">Klaar om te groeien?</span> <h2 class="cca-heading">Start vandaag nog met marketing die werkt</h2> <p class="cca-text">Plan een gratis strategiegesprek van 30 minuten.</p> <div class="cca-actions"> <a class="cca-btn cca-btn--primary" href="/contact">Plan een gesprek</a> <a class="cca-btn cca-btn--secondary" href="/cases">Bekijk onze cases</a> </div> </div>

<style>
.cca-wrap{padding:3.5rem;border-radius:16px;text-align:center;margin:2rem 0}
.cca-wrap--default{background:#f5f5f5;color:var(--color-primary, #0a0a0a)}
.cca-wrap--dark{background:var(--color-primary, #0a0a0a);color:#fff}
.cca-wrap--accent{background:var(--color-accent, #6366f1);color:#fff}
.cca-eyebrow{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;opacity:.75;margin-bottom:.75rem}
.cca-heading{font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;margin:0 0 1rem;line-height:1.2}
.cca-text{font-size:1rem;line-height:1.7;opacity:.85;max-width:560px;margin:0 auto 2rem}
.cca-actions{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}
.cca-btn{display:inline-block;padding:.85rem 2rem;border-radius:8px;font-size:.95rem;font-weight:600;text-decoration:none;transition:opacity .2s,transform .2s}
.cca-btn:hover{opacity:.88;transform:translateY(-1px)}
.cca-wrap--accent .cca-btn--primary,.cca-wrap--dark .cca-btn--primary{background:#fff;color:var(--color-primary, #0a0a0a)}
.cca-wrap--default .cca-btn--primary{background:var(--color-accent, #6366f1);color:#fff}
.cca-btn--secondary{background:transparent;border:2px solid currentColor;color:inherit;opacity:.85}
</style>