/*
 * Erkenning / nominatie — gecentreerde lichte accent-band (teampagina).
 * Reuse: .sec-head__eyebrow (eyebrow) en .prose (tekst).
 */

.award {
  padding:    0 var(--section-padding-x) var(--space-24);
  background: var(--color-bg-section);
}

.award__inner {
  max-width:     920px;
  margin:        0 auto;
  padding:       var(--space-16) var(--space-10);
  background:    var(--color-bg-accent-soft);
  border:        1px solid var(--color-border-soft);
  border-radius: 24px;
  text-align:    center;
}

/* Icoon in accent-cirkel — op eigen regel, gecentreerd */
.award__icon {
  display:         flex;
  align-items:     center;
  justify-content: center;
  width:           64px;
  height:          64px;
  margin:          0 auto var(--space-5);
  border-radius:   var(--radius-full);
  background:      var(--color-accent);
  color:           #ffffff;
}

.award__icon svg {
  width:  30px;
  height: 30px;
}

/* Meta-regel: badge + eyebrow gecentreerd naast elkaar */
.award__meta {
  display:         flex;
  flex-wrap:       wrap;
  align-items:     center;
  justify-content: center;
  gap:             10px;
  margin-bottom:   var(--space-5);
}

/* Badge (bv. jaartal) — subtiel omlijnd */
.award__badge {
  padding:         6px 14px;
  background:      var(--color-bg-white);
  color:           var(--color-accent);
  border:          1px solid var(--color-accent-pale);
  border-radius:   var(--radius-full);
  font-family:     var(--font-heading);
  font-size:       12px;
  font-weight:     var(--font-bold);
  letter-spacing:  1px;
}

/* Marge van de eyebrow resetten zodat badge en eyebrow verticaal gecentreerd
 * op één lijn staan. Twee klassen (0,0,2,0) wint van .sec-head__eyebrow
 * (0,0,1,0), dat door de alfabetische enqueue-volgorde later laadt. */
.award__meta .award__eyebrow {
  margin: 0;
}

.award__title {
  max-width:      680px;
  margin:         0 auto var(--space-5);
  font-size:      32px;
  font-weight:    var(--font-extrabold);
  line-height:    1.15;
  letter-spacing: -0.6px;
  color:          var(--color-text-heading);
}

.award__text {
  max-width:   720px;
  margin:      0 auto;
  font-size:   var(--text-base);
  line-height: var(--leading-relaxed);
  color:       var(--color-text-meta);
}

@media (max-width: 600px) {
  .award__inner {
    padding:       var(--space-10) var(--space-6);
    border-radius: 18px;
  }
  .award__title {
    font-size: 26px;
  }
}