TextEditorial text

---
interface Props {
  intro: string;
  body: string;
  pullText?: string;
}
const { intro = "In 2020 startten wij BLURR vanuit een simpele overtuiging: te veel bedrijven betalen te veel voor te weinig resultaat.", body = "De advertentiemarkt is complex geworden. Platforms verdienen aan jouw budget, ongeacht of de campagnes werken. Wij kozen bewust de andere kant. Transparantie, resultaat en een langdurige relatie — dat is het fundament waarop BLURR is gebouwd. Elk kwartaal leggen wij rekening af aan onze klanten, niet alleen met mooie grafieken maar met eerlijke cijfers.", pullText = "Te veel bedrijven betalen te veel voor te weinig resultaat." } = Astro.props;
---

<article class="tx-ed">
  <p class="tx-ed__intro">{intro}</p>
  {pullText && <p class="tx-ed__pull">{pullText}</p>}
  <p class="tx-ed__body">{body}</p>
</article>

<style>
  :root {
    --color-accent: #6366f1;
    --color-primary: #0a0a0a;
  }
  .tx-ed { max-width: 680px; }
  .tx-ed__intro {
    margin: 0 0 1.5rem;
    font-size: 1.15rem;
    font-weight: 500;
    color: var(--color-primary);
    line-height: 1.65;
  }
  .tx-ed__pull {
    margin: 0 0 1.5rem;
    font-size: clamp(1.25rem, 3vw, 1.65rem);
    font-weight: 800;
    color: var(--color-accent);
    line-height: 1.3;
    letter-spacing: -0.015em;
    padding: 1rem 0;
    border-top: 2px solid var(--color-accent);
    border-bottom: 2px solid var(--color-accent);
  }
  .tx-ed__body {
    margin: 0;
    font-size: 1rem;
    color: #555;
    line-height: 1.75;
  }
</style>