src/components/text/TextDark.astro
---
// TextDark, recovered from blurr-components.pages.dev
---
<section class="tdark-section"> <div class="tdark-inner"> <h2 class="tdark-headline">Klaar om te groeien?</h2> <p class="tdark-body">Wij werken uitsluitend met bedrijven die serieuze groeiambities hebben.</p> <a class="tdark-cta" href="#">Plan gratis gesprek</a> </div> </section>
<style>
.tdark-section{--color-accent: #6366f1;background:#0a0a0a;padding:72px 24px;font-family:system-ui,sans-serif}
.tdark-inner{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.tdark-headline{margin:0;font-size:clamp(1.8rem,5vw,2.75rem);font-weight:900;color:#fff;letter-spacing:-.03em;line-height:1.15}
.tdark-body{margin:0;font-size:1rem;line-height:1.7;color:#9ca3af;max-width:520px}
.tdark-cta{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--color-accent);color:#fff;font-size:.9rem;font-weight:700;text-decoration:none;border-radius:8px;transition:opacity .15s,transform .15s}
.tdark-cta:hover{opacity:.9;transform:translateY(-1px)}
</style>