/**
 * Consulmar — sliders mobile.
 *
 * Esta folha é carregada no fim e corrige apenas:
 * 1) galeria inicial da página Quem Somos;
 * 2) isolamento visual do slider mobile de prémios já existente.
 *
 * Não altera html, body, main, scroll vertical, timelines ou desktop.
 */

@media (max-width: 767px) {
  /* =========================================================
     1. Galeria inicial — swipe horizontal nativo
     ========================================================= */
  .vc_row.intro .intro-img-col,
  .vc_row.intro .intro-img-col > .vc_column-inner {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }

  .vc_row.intro .intro-img-col > .vc_column-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* O wrapper é o único rail. A row .intro nunca recebe scroll. */
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 15px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 30px 10px 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-padding-inline-start: 0 !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y !important;
    cursor: grab !important;
  }

  /*
   * O style.css legado aplica touch-action: pan-y a todos os descendentes.
   * Mantemos pan-y: o browser conserva o scroll vertical e o JavaScript
   * assume apenas gestos claramente horizontais dentro desta galeria.
   */
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper *,
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row {
    touch-action: pan-y !important;
  }

  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper.is-dragging {
    cursor: grabbing !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    scroll-snap-type: none !important;
  }

  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  /* Um slide completo e 30px do slide seguinte visíveis. */
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row {
    display: block !important;
    float: none !important;
    flex: 0 0 calc(100% - 30px) !important;
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    min-width: calc(100% - 30px) !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
  }

  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row > .wpb_column,
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row > .wpb_column > .vc_column-inner,
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row > .wpb_column > .vc_column-inner > .wpb_wrapper,
  .vc_row.intro .intro_img,
  .vc_row.intro .intro_img .vc_figure,
  .vc_row.intro .intro_img .vc_single_image-wrapper {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /*
   * Todas as fotografias usam exatamente a mesma caixa.
   * A proporção 447/523 corresponde às duas imagens verticais originais.
   * A fotografia horizontal é recortada dentro desta caixa, sem alterar o slide.
   */
  .vc_row.intro .intro_img .vc_single_image-wrapper {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 447 / 523 !important;
    overflow: hidden !important;
  }

  .vc_row.intro .intro_img img {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;
    pointer-events: none !important;
  }

  .vc_row.intro .qs-caption {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    margin-top: 9px !important;
  }

  /* =========================================================
     2. Prémios — manter exatamente o componente mobile atual
     ========================================================= */
  .vc_row.award_year.csm-awards24-ready #awards-tl,
  .vc_row.award_year.csm-awards24-ready .hist-timeline,
  .vc_row.award_year.csm-awards24-ready .wpb_raw_code:has(#awards-tl),
  .vc_row.award_year.csm-awards24-ready .vc_inner.vc_row-fluid[class*="year_"],
  .vc_row.award_year.csm-awards24-ready > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_inner[class*="year_"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  .vc_row.award_year.csm-awards24-ready .csm-awards24,
  .vc_row.award_year.csm-awards24-ready .csm-awards24-mobile {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .vc_row.award_year.csm-awards24-ready .csm-awards24-desktop {
    display: none !important;
  }

  .vc_row.award_year.csm-awards24-ready .csm-awards24-mobile-viewport {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    touch-action: pan-y !important;
  }

  .vc_row.award_year.csm-awards24-ready .csm-awards24-mobile-viewport > .csm-awards24-mobile-card {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none;
  }

  .vc_row.award_year.csm-awards24-ready .csm-awards24-mobile-nav {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) 48px !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 360px) {
  .vc_row.intro .intro-img-col > .vc_column-inner > .wpb_wrapper > .vc_row {
    flex-basis: calc(100% - 24px) !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    min-width: calc(100% - 24px) !important;
  }
}

/* =========================================================
   Indicadores — entrada sequencial apenas em mobile
   ========================================================= */
@media (max-width: 767px) {
  .stats-sec.csm-stats-reveal-ready .stat-anos > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-peso > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-mercados > .vc_column-inner > .wpb_wrapper {
    opacity: 0;
    transform: translate3d(0, 42px, 0) scale(0.97);
    transition:
      opacity 650ms cubic-bezier(0.22, 1, 0.36, 1),
      transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
  }

  .stats-sec.csm-stats-reveal-ready .stat-anos.csm-stat-visible > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-peso.csm-stat-visible > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-mercados.csm-stat-visible > .vc_column-inner > .wpb_wrapper {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }

  .stats-sec.csm-stats-reveal-complete .stat-anos > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-complete .stat-peso > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-complete .stat-mercados > .vc_column-inner > .wpb_wrapper {
    will-change: auto;
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .stats-sec.csm-stats-reveal-ready .stat-anos > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-peso > .vc_column-inner > .wpb_wrapper,
  .stats-sec.csm-stats-reveal-ready .stat-mercados > .vc_column-inner > .wpb_wrapper {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
