/*-----------------------------------------------------------------------------------

    JW Design Page CSS: home
    -------------------------------------------------------------------------------
    Home / front-page futura.
    Este arquivo é editável diretamente e será carregado somente nesta página/template.
    Não usa SCSS e não depende de build.

-----------------------------------------------------------------------------------*/

@import url("../global.css");
@import url("../sections/home-hero.css");
@import url("../sections/portfolio.css");
@import url("../sections/about.css");
@import url("../sections/services.css");
@import url("../sections/clients.css");
@import url("../sections/awards.css");
@import url("../sections/blog.css");
@import url("../base/responsive.css");
@import url("../components/header-overrides.css");
@import url("../components/buttons.css");
@import url("../base/jw-responsive.css");

/* Ajustes específicos desta página/template devem entrar abaixo deste ponto.
   Mantenha regras globais fora daqui sempre que possível. */

/* Fase 12.7 - Métricas/Home: cards com imagem e texto na mesma altura
-----------------------------------------------------------------*/
.jw-home-metrics-grid__col {
  display: flex;
}

.jw-home-metric-card {
  width: 100%;
  min-height: 190px;
}

.jw-home-metric-card--image {
  overflow: hidden;
  padding: 28px 20px;
}

.jw-home-metric-card__image {
  display: block;
  height: auto;
  max-height: 130px;
  max-width: 100%;
  object-fit: contain;
  width: auto;
}

/* Fase 21.2 - Home mobile: centralização vertical dos cards/tags do Header
-----------------------------------------------------------------*/
@media screen and (max-width: 767.98px) {
  .hero-style4 .tags {
    align-items: center;
  }

  .hero-style4 .tags a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    line-height: 1.15;
    text-align: center;
  }
}

@media screen and (max-width: 575.98px) {
  .hero-style4 .tags a {
    min-height: 38px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}


/* Fase 21.3 - Correção real dos cards abaixo do Header da Home no mobile
-----------------------------------------------------------------*/
.jw-section--projects-strip.hr-sec .hr-container {
  align-items: center;
}

@media screen and (max-width: 991.98px) {
  .hero-style4 .jw-hero-image-trail {
    display: none !important;
  }

  .hero-style4 .tags,
  .hero-style4 .jw-home-hero__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }

  .hero-style4 .tags a,
  .hero-style4 .jw-home-hero__tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    margin: 0 !important;
    line-height: 1.15;
    text-align: center;
    vertical-align: middle;
  }

  .jw-section--projects-strip.hr-sec .hr-container {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .jw-section--projects-strip.hr-sec .item-panel {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .jw-section--projects-strip.hr-sec .item-panel .fit-img {
    margin-top: auto;
    margin-bottom: auto;
  }
}

@media screen and (max-width: 767.98px) {
  .jw-section--projects-strip.hr-sec .hr-container {
    min-height: auto;
  }

  .jw-section--projects-strip.hr-sec .item-panel {
    min-height: auto;
  }

  .jw-section--projects-strip.hr-sec .item-panel .fit-img {
    display: flex;
    align-items: center;
  }

  .jw-section--projects-strip.hr-sec .item-panel .fit-img > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

/* Home/Métricas: cards do tipo imagem devem ficar sem padding interno. */
.jw-home-metric-card--image.p-0 {
  padding: 0 !important;
}
