/* ============================================================
   BrijCode — About Highlight responsive
   ============================================================ */

@media (max-width: 1199.98px) {
  .about-highlight__title {
    font-size: clamp(1.85rem, 4.2vw, 3rem);
  }
}

@media (max-width: 991.98px) {
  .about-highlight {
    height: auto;
    min-height: 0;
    max-height: none;
    display: flex;
    flex-direction: column;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  .about-highlight__inner {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    order: 1;
    padding: 20px 14px 0;
  }

  .about-highlight__title {
    font-size: clamp(1.55rem, 4.4vw, 2.1rem);
    margin-bottom: 6px;
  }

  .about-highlight__description {
    font-size: 0.86rem;
    line-height: 1.48;
  }

  .about-highlight__floating-elements {
    position: relative;
    inset: auto;
    z-index: 2;
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px 14px 20px;
    transform: none;
    pointer-events: auto;
  }

  .about-highlight__card {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: auto;
    max-width: min(100%, 340px);
    animation: none !important;
    white-space: nowrap;
    justify-content: flex-start;
  }

  .about-highlight__card-copy {
    white-space: nowrap;
  }

  .about-highlight__card-label,
  .about-highlight__card-value {
    white-space: nowrap;
  }

  .about-highlight__card--consumer,
  .about-highlight__card--campaign,
  .about-highlight__card--routes,
  .about-highlight__card--verify,
  .about-highlight__card--outlets,
  .about-highlight__card--automation {
    display: none;
  }

  .about-highlight__globe-stage {
    display: none;
  }
}

@media (max-width: 767.98px) {
  .about-highlight__inner {
    padding: 16px 12px 0;
  }

  .about-highlight__title {
    font-size: clamp(1.35rem, 5.6vw, 1.75rem);
  }

  .about-highlight__description {
    font-size: 0.82rem;
    line-height: 1.45;
  }

  .about-highlight__floating-elements {
    gap: 7px;
    padding: 10px 12px 16px;
  }

  .about-highlight__card {
    max-width: min(100%, 300px);
    padding: 7px 12px 7px 7px;
  }

  .about-highlight__card-value {
    font-size: 0.68rem;
  }

  .about-highlight__card-icon {
    width: 22px;
    height: 22px;
  }

  .about-highlight__card-icon svg {
    width: 11px;
    height: 11px;
  }
}

@media (max-width: 480px) {
  .about-highlight__inner {
    padding: 14px 10px 0;
  }

  .about-highlight__title {
    font-size: 1.28rem;
  }

  .about-highlight__description {
    font-size: 0.78rem;
  }

  .about-highlight__floating-elements {
    padding: 8px 10px 14px;
    gap: 6px;
  }

  .about-highlight__card {
    max-width: min(100%, 280px);
  }
}

@media (min-width: 992px) and (max-height: 820px) {
  .about-highlight {
    --ahh-stage-scale: 0.9;
  }

  .about-highlight__inner {
    padding-top: clamp(18px, 3vh, 28px);
  }

  .about-highlight__description {
    font-size: 0.86rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-highlight__card--data,
  .about-highlight__card--business {
    animation: none;
  }
}