  /* ============================================================
   RESPONSIVE BIENVENIDA
   ============================================================ */
   /* ============================================================
   RESPONSIVE MÓVIL (≤768px)
   ============================================================ */
@media (max-width: 768px) {
  .loader-logo {
    top: 16px;
    left: 16px;
    height: 20px;
  }

  .percentage-wrapper {
    bottom: 16px;
    right: 16px;
  }

  .odometer {
    height: 13px;
  }

  .digit-col {
    width: 8px;
    height: 13px;
  }

  .digit-strip div {
    height: 13px;
    line-height: 13px;
    font-size: 11px;
  }

  .percent-sign {
    font-size: 11px;
  }

  .progress-track {
    width: 4px;
  }

  h1 {
    font-size: 50px;
    text-align: center;
  }

  .dot-pattern {
    background-size: 18px 18px;
  }
}

/* ============================================================
   TABLET VERTICAL — 769–1024px, portrait
   ============================================================ */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: portrait) {
  .loader-logo {
    top: 24px;
    left: 24px;
    height: 22px;
  }

  .percentage-wrapper {
    bottom: 24px;
    right: 24px;
  }

  .odometer {
    height: 15px;
  }

  .digit-col {
    width: 9px;
    height: 15px;
  }

  .digit-strip div {
    height: 15px;
    line-height: 15px;
    font-size: 13px;
  }

  .percent-sign {
    font-size: 13px;
  }

  .progress-track {
    width: 5px;
  }

  h1 {
    max-width: 80vw;
    font-size: 100px;
    text-align: center;
  }

  .dot-pattern {
    background-size: 22px 22px;
  }
}