Bloc contact complet

<style>
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600&display=swap');

.bn-contact-block {
  display: grid;
  grid-template-columns: 1fr 1.3fr 0.9fr;
  gap: 2rem;
  align-items: center;

  padding: 3rem;
  font-family: 'Inter', sans-serif;
  background: #0B0F10;
}

.bn-contact-block__intro h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.9rem;
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: #E6E4DD;
  margin: 0 0 0.75rem;
}

.bn-contact-block__intro p {
  color: #979793;
  margin: 0;
}

.bn-contact-block__info {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.bn-contact-block__row {
  display: flex;
  gap: 0.9rem;
}

.bn-contact-block__icon {
  flex-shrink: 0;
  font-size: 1.1rem;
}

.bn-contact-block__row strong {
  display: block;
  color: #E6E4DD;
  font-size: 0.85rem;
  margin-bottom: 0.2rem;
}

.bn-contact-block__row span {
  color: #979793;
  font-size: 0.8rem;
  line-height: 1.5;
}

.bn-contact-block__map {
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  border: 1px solid rgba(230, 228, 221, 0.1);
  background:
    radial-gradient(circle at 20% 30%, rgba(230, 228, 221, 0.06), transparent 60%),
    #1D2324;

  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}

@media (max-width: 800px) {
  .bn-contact-block { grid-template-columns: 1fr; }
}

</style>

<section class="bn-contact-block">

  <div class="bn-contact-block__intro">
    <h2>Construisons quelque<br />chose de sens.</h2>
    <p>Nous serions ravis d'avoir de vos nouvelles.</p>
  </div>

  <div class="bn-contact-block__info">
    <div class="bn-contact-block__row">
      <span class="bn-contact-block__icon">📍</span>
      <div>
        <strong>Adresse</strong>
        <span>123 Creative Lane, Brooklyn, NY 11201</span>
      </div>
    </div>
    <div class="bn-contact-block__row">
      <span class="bn-contact-block__icon">📞</span>
      <div>
        <strong>Téléphone</strong>
        <span>+1 (347) 555-0187 · Lun-Ven, 9h-18h</span>
      </div>
    </div>
    <div class="bn-contact-block__row">
      <span class="bn-contact-block__icon">✉️</span>
      <div>
        <strong>Email</strong>
        <span>hello@exemple.com · Réponse sous 24h</span>
      </div>
    </div>
  </div>

  <div class="bn-contact-block__map">
    <span>📍</span>
  </div>

</section>