src/components/ui/TrustBadges.astro
---
// TrustBadges, recovered from blurr-components.pages.dev
---
<section class="trb trb--light"> <div class="trb-inner"> <p class="trb-headline">Erkend en gecertificeerd</p> <div class="trb-badges"> <div class="trb-badge"> <span class="trb-badge-icon">→</span> <div class="trb-badge-text"> <span class="trb-badge-label">Google Partner</span> <span class="trb-badge-sub">Gecertificeerd 2024</span> </div> </div><div class="trb-badge"> <span class="trb-badge-icon"></span> <div class="trb-badge-text"> <span class="trb-badge-label">Meta Business Partner</span> <span class="trb-badge-sub">Gecertificeerd</span> </div> </div><div class="trb-badge"> <span class="trb-badge-icon">→</span> <div class="trb-badge-text"> <span class="trb-badge-label">ISO 27001</span> <span class="trb-badge-sub">Informatiebeheer</span> </div> </div><div class="trb-badge"> <span class="trb-badge-icon"></span> <div class="trb-badge-text"> <span class="trb-badge-label">4.9/5 reviews</span> <span class="trb-badge-sub">127 beoordelingen</span> </div> </div><div class="trb-badge"> <span class="trb-badge-icon"></span> <div class="trb-badge-text"> <span class="trb-badge-label">Made in NL</span> <span class="trb-badge-sub">Amsterdam</span> </div> </div> </div> </div> </section>
<style>
.trb{padding:3rem 2rem}
.trb--white{background:#fff;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.trb--light{background:#f8fafc;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.trb--dark{background:#111827}
.trb-inner{max-width:1100px;margin:0 auto}
.trb-headline{text-align:center;font-size:.8125rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin:0 0 1.75rem}
.trb--white .trb-headline,.trb--light .trb-headline{color:#9ca3af}
.trb--dark .trb-headline{color:#ffffff4d}
.trb-badges{display:flex;justify-content:center;align-items:center;gap:.75rem 2rem;flex-wrap:wrap}
.trb-badge{display:flex;align-items:center;gap:.625rem;padding:.75rem 1.25rem;border-radius:.5rem}
.trb--white .trb-badge,.trb--light .trb-badge{background:#fff;border:1px solid #e5e7eb}
.trb--dark .trb-badge{background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}
.trb-badge-icon{font-size:1.5rem}
.trb-badge-text{display:flex;flex-direction:column}
.trb-badge-label{font-size:.875rem;font-weight:700;line-height:1.2}
.trb--white .trb-badge-label,.trb--light .trb-badge-label{color:#0a0a0a}
.trb--dark .trb-badge-label{color:#fff}
.trb-badge-sub{font-size:.75rem}
.trb--white .trb-badge-sub,.trb--light .trb-badge-sub{color:#6b7280}
.trb--dark .trb-badge-sub{color:#fff6}
</style>