CtaCards CTA

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

<section class="ctacc"> <div class="ctacc-inner"> <div class="ctacc-top"> <h2 class="ctacc-headline">Eén bureau voor al je online marketing</h2> <p class="ctacc-sub">Van strategie tot uitvoering: wij regelen het. Jij focust op je business.</p> <div class="ctacc-btns"> <a href="#" class="ctacc-btn-primary">Gratis kennismaken</a> <a href="#" class="ctacc-btn-secondary">Bekijk diensten</a> </div> </div> <div class="ctacc-cards"> <div class="ctacc-card"> <span class="ctacc-card-icon">→</span> <h3 class="ctacc-card-title">Google Ads</h3> <p class="ctacc-card-desc">Campagnes die converteren op het moment dat klanten zoeken.</p> </div><div class="ctacc-card"> <span class="ctacc-card-icon"></span> <h3 class="ctacc-card-title">Meta Ads</h3> <p class="ctacc-card-desc">Bereik de juiste doelgroep op Facebook en Instagram.</p> </div><div class="ctacc-card"> <span class="ctacc-card-icon"></span> <h3 class="ctacc-card-title">SEO</h3> <p class="ctacc-card-desc">Scoor organisch op de zoekwoorden die ertoe doen.</p> </div><div class="ctacc-card"> <span class="ctacc-card-icon">→</span> <h3 class="ctacc-card-title">Analytics</h3> <p class="ctacc-card-desc">Inzicht in elke euro die je uitgeeft.</p> </div> </div> </div> </section>

<style>
.ctacc{background:#f8fafc;padding:5rem 2rem;border-top:1px solid #e5e7eb}
.ctacc-inner{max-width:1100px;margin:0 auto}
.ctacc-top{text-align:center;margin-bottom:3.5rem}
.ctacc-headline{font-size:clamp(1.875rem,4vw,3rem);font-weight:900;color:#0a0a0a;letter-spacing:-.04em;line-height:1.15;margin:0 0 1rem}
.ctacc-sub{font-size:1.125rem;color:#6b7280;line-height:1.65;margin:0 0 2.5rem;max-width:600px;margin-left:auto;margin-right:auto}
.ctacc-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.ctacc-btn-primary{padding:.875rem 2.25rem;background:var(--color-accent,#6366f1);color:#fff;font-weight:700;font-size:.9375rem;border-radius:.5rem;text-decoration:none;transition:opacity .2s}
.ctacc-btn-primary:hover{opacity:.88}
.ctacc-btn-secondary{padding:.875rem 2.25rem;border:1.5px solid #d1d5db;color:#374151;font-weight:600;font-size:.9375rem;border-radius:.5rem;text-decoration:none;transition:border-color .2s}
.ctacc-btn-secondary:hover{border-color:#9ca3af}
.ctacc-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem}
.ctacc-card{background:#fff;border:1px solid #e5e7eb;border-radius:.875rem;padding:2rem}
.ctacc-card-icon{font-size:1.75rem;display:block;margin-bottom:1rem}
.ctacc-card-title{font-size:1rem;font-weight:700;color:#0a0a0a;margin:0 0 .5rem}
.ctacc-card-desc{font-size:.875rem;color:#6b7280;line-height:1.6;margin:0}
</style>