.countdown-timer {
   margin: 2rem auto;
}

.countdown-timer__fallback {
   margin: 0;
   color: #1f1f1f;
   font-size: 1rem;
   line-height: 1.6;
}

.countdown-timer__display {
   width: 100%;
}

.countdown-timer__cards {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 1rem;
   margin: 0;
   padding: 0;
   list-style: none;
}

.countdown-timer__card {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   min-height: 11.25rem;
   padding: 1.75rem 1rem 1.5rem;
   border-radius: 1.25rem;
   background: #003682;
   color: #ffffff !important;
   text-align: center;
}

.countdown-timer__value {
   display: block;
   min-height: 1em;
   font-size: clamp(3rem, 7vw, 4rem);
   font-weight: 700;
   line-height: 1;
   font-variant-numeric: tabular-nums lining-nums;
}

.countdown-timer__label {
   display: block;
   margin-top: 0.75rem;
   font-size: 1rem;
   font-weight: 600;
   line-height: 1.2;
   letter-spacing: 0.28em;
   text-transform: uppercase;
}

.countdown-timer__completion {
   margin: 1rem 0 0;
   color: #003682;
   font-size: 1.125rem;
   font-weight: 700;
   text-align: center;
}

.countdown-timer--enhanced .countdown-timer__fallback {
   display: none;
}

.countdown-timer__completion[hidden] {
   display: none;
}

@media (max-width: 991.98px) {
   .countdown-timer__cards {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }
}

@media (max-width: 575.98px) {
   .countdown-timer__cards {
      grid-template-columns: 1fr;
   }

   .countdown-timer__card {
      min-height: 9.5rem;
      padding: 1.5rem 1rem 1.25rem;
   }

   .countdown-timer__label {
      font-size: 0.9375rem;
      letter-spacing: 0.22em;
   }
}

@media (prefers-reduced-motion: reduce) {
   .countdown-timer__card,
   .countdown-timer__value,
   .countdown-timer__completion {
      transition: none;
   }
}