/* ============================================
   AWARDS PAGE — NOMINATIONS
   Numbered cards in a 3-col grid. Seven category
   cards + a CTA photo cell that spans two columns
   (fills slots 8 and 9 on desktop).
   ============================================ */

.awards-noms {
  padding: 12rem 10rem;
}

.awards-noms__inner {
  width: 100%;
  max-width: 148rem;
  margin: 0 auto;
}

.awards-noms__title {
  font-size: 6.4rem;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.05em;
  color: var(--color-white);
  margin: 0 0 3rem;
}

.awards-noms__lead {
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
  max-width: 120rem;
  margin: 0 0 5rem;
}

/* ── Grid ── */

.awards-noms__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}

/* ── Category card ── */

.nom-cell {
  display: flex;
  flex-direction: column;

  padding: 3.4rem;
  border-radius: 2rem;

  background: #0D1018;
  border: 0.1rem solid rgba(255, 255, 255, 0.08);
}

.nom-cell__num {
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.22);
  margin-bottom: 2.6rem;
}

.nom-cell__title {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-white);
  margin: 0 0 1.8rem;
}

.nom-cell__text {
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
  margin: 0;
}

/* ── CTA cell (photo + overlay) — spans two columns ── */

.nom-cta {
  grid-column: span 2;          /* fills slots 8 and 9 */

  position: relative;
  overflow: hidden;

  display: flex;
  align-items: flex-end;
  justify-content: center;

  min-height: 26rem;
  padding: 3.4rem 6rem;         /* wider side padding on the double-width cell */
  border-radius: 2rem;

  background: #0D1018 url('../../img/bridge2026/noms-cta.png') center / cover no-repeat;
}

/* Dark scrim so the text stays legible over the photo */
.nom-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(10, 14, 26, 0.15) 0%,
    rgba(10, 14, 26, 0.55) 55%,
    rgba(10, 14, 26, 0.9) 100%
  );
}

.nom-cta__text {
  position: relative;
  z-index: 2;

  max-width: 52rem;             /* keeps the line from spanning the full width */

  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: var(--color-white);
  margin: 0;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1280px) {
  .awards-noms {
    padding: 10rem 6rem;
  }

  .awards-noms__title {
    font-size: 5.4rem;
  }

  .awards-noms__grid {
    gap: 2.4rem;
  }

  .nom-cell {
    padding: 3rem;
  }

  .nom-cell__title {
    font-size: 2.2rem;
  }

  .nom-cta {
    padding: 3.4rem 4.5rem;
  }
}

/* TABLET — 2 columns, CTA back to normal width */
@media (max-width: 1024px) {
  .awards-noms__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .nom-cta {
    grid-column: span 1;
    padding: 3.4rem 3rem;
  }

  .nom-cta__text {
    max-width: 100%;
  }
}

/* MOBILE — single column */
@media (max-width: 700px) {
  .awards-noms {
    padding: 8rem 3rem;
  }

  .awards-noms__title {
    font-size: 4.2rem;
    margin-bottom: 2.4rem;
  }

  .awards-noms__lead {
    font-size: 2rem;
    margin-bottom: 4rem;
  }

  .awards-noms__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .nom-cell {
    padding: 2.8rem 2.4rem;
  }

  .nom-cell__title {
    font-size: 2.4rem;
  }

  .nom-cell__text {
    font-size: 2rem;
  }

  .nom-cta {
    grid-column: span 1;
    min-height: 24rem;
    padding: 3rem 2.4rem;
  }

  .nom-cta__text {
    font-size: 2.2rem;
    max-width: 100%;
  }
}