/* =========================================================
   ARCO — Responsive
   Arquivo: assets/css/responsive.css
   Função: responsividade geral + padronização de imagens
   Versão: 5.0.6
   ========================================================= */


/* =========================================================
   TABLET / MOBILE GERAL
   ========================================================= */

@media (max-width: 879px) {
  .arco-header.site-header {
    height: 72px;
  }

  .arco-header .header-cta {
    display: none;
  }

  .arco-home-hero,
  .arco-page-hero {
    padding-top: 118px;
  }

  .arco-home-hero h1,
  .arco-page-hero h1 {
    font-size: clamp(44px, 13vw, 68px);
  }

  .arco-symbol-card {
    width: min(82vw, 330px);
    border-radius: 30px;
  }

  .arco-orbit-card {
    font-size: 11px;
  }

  .arco-path-card,
  .arco-service-card {
    min-height: 260px;
  }

  .arco-identity-band,
  .arco-contact-home,
  .arco-contact-page,
  .arco-journey {
    padding-left: 20px;
    padding-right: 20px;
  }

  .arco-identity-visual {
    min-height: 280px;
  }

  .arco-identity-visual__main {
    width: min(86vw, 300px);
  }

  .arco-editorial-band {
    padding-left: 20px;
    padding-right: 20px;
  }

  .arco-editorial-band figure {
    height: 420px;
  }

  .arco-offer-grid--four {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   DESKTOP GRANDE
   ========================================================= */

@media (min-width: 1180px) {
  .arco-service-card,
  .arco-path-card {
    min-height: 360px;
  }
}


/* =========================================================
   REDUZIR ANIMAÇÕES
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .arco-path-card,
  .arco-service-card,
  .arco-journey__grid a {
    transition: none !important;
  }
}


/* =========================================================
   BASE GERAL
   ========================================================= */

body.arco-page main {
  overflow-x: hidden;
  overflow-y: visible;
}


/* =========================================================
   HOME — HERO COM IMAGEM EDITORIAL, NÃO STORIES
   ========================================================= */

body.arco-page--home .arco-home-hero {
  min-height: auto !important;
  padding-top: clamp(112px, 12vh, 150px) !important;
  padding-bottom: clamp(58px, 9vh, 92px) !important;
  align-items: center !important;
  overflow: hidden !important;
  grid-template-columns: minmax(0, .95fr) minmax(420px, .9fr) !important;
  gap: clamp(42px, 5vw, 84px) !important;
}

body.arco-page--home .arco-home-hero__copy {
  max-width: 760px !important;
}

body.arco-page--home .arco-home-hero h1 {
  max-width: 760px !important;
  margin: 0 0 22px !important;
  font-size: clamp(42px, 6.2vw, 82px) !important;
  line-height: .98 !important;
  text-wrap: balance;
}

body.arco-page--home .arco-home-hero p {
  max-width: 590px !important;
  font-size: clamp(16px, 1.45vw, 20px) !important;
}

body.arco-page--home .arco-home-hero__visual {
  display: grid !important;
  width: 100% !important;
  max-width: 620px !important;
  min-height: auto !important;
  justify-self: end !important;
  margin-top: 0 !important;
}

body.arco-page--home .arco-hero-media-card {
  display: block !important;
  width: min(42vw, 620px) !important;
  min-width: 420px !important;
  max-width: 620px !important;
  border-radius: 34px !important;
  overflow: hidden !important;
}

body.arco-page--home .arco-hero-photo {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 11 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* remove elementos decorativos antigos da home */
body.arco-page--home .arco-brand-shape,
body.arco-page--home .arco-orbit-card {
  display: none !important;
}


/* =========================================================
   PÁGINAS INTERNAS — IMAGEM VERTICAL CONTROLADA
   ========================================================= */

body:not(.arco-page--home) .arco-page-hero {
  min-height: auto !important;
  padding-top: clamp(112px, 12vh, 150px) !important;
  padding-bottom: clamp(58px, 9vh, 92px) !important;
  overflow: hidden !important;
}

body:not(.arco-page--home) .arco-page-hero__visual,
body:not(.arco-page--home) .arco-page-hero__media {
  display: grid !important;
  min-height: auto !important;
  justify-self: center !important;
}

body:not(.arco-page--home) .arco-page-photo-card,
body:not(.arco-page--home) .arco-page-hero__media {
  display: block !important;
  width: min(34vw, 380px) !important;
  min-width: 280px !important;
  max-width: 390px !important;
  border-radius: 34px !important;
  overflow: hidden !important;
}

body:not(.arco-page--home) .arco-page-photo-card img,
body:not(.arco-page--home) .arco-page-hero__media img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
  object-position: center 12% !important;
}

/* ajuste fino por página para não cortar cabeça */
body.arco-page--sobre .arco-page-photo-card img,
body.arco-page--metodo .arco-page-photo-card img,
body.arco-page--pessoas .arco-page-photo-card img,
body.arco-page--empresas .arco-page-photo-card img,
body.arco-page--palestras-treinamentos .arco-page-photo-card img,
body.arco-page--contato .arco-page-photo-card img {
  object-position: center 12% !important;
}


/* =========================================================
   NOTEBOOK / MEIA TELA / ALTURA BAIXA
   Imagem continua aparecendo, mas desce para baixo do texto.
   ========================================================= */

@media (max-width: 1080px), (max-height: 700px) {
  body.arco-page--home .arco-home-hero,
  body:not(.arco-page--home) .arco-page-hero {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 34px !important;
    min-height: auto !important;
    padding-top: 100px !important;
    padding-bottom: 62px !important;
  }

  body.arco-page--home .arco-home-hero__copy,
  body:not(.arco-page--home) .arco-page-hero__copy {
    max-width: 760px !important;
  }

  body.arco-page--home .arco-home-hero h1,
  body:not(.arco-page--home) .arco-page-hero h1 {
    max-width: 760px !important;
    font-size: clamp(36px, 7.2vw, 58px) !important;
    line-height: 1 !important;
  }

  body.arco-page--home .arco-home-hero p,
  body:not(.arco-page--home) .arco-page-hero p {
    max-width: 620px !important;
    font-size: 16px !important;
  }

  body.arco-page--home .arco-home-hero__visual,
  body:not(.arco-page--home) .arco-page-hero__visual,
  body:not(.arco-page--home) .arco-page-hero__media {
    display: grid !important;
    justify-self: start !important;
    width: 100% !important;
    max-width: 520px !important;
  }

  /* Home continua horizontal/editorial */
  body.arco-page--home .arco-hero-media-card {
    display: block !important;
    width: min(88vw, 520px) !important;
    min-width: 0 !important;
    max-width: 520px !important;
    border-radius: 28px !important;
  }

  body.arco-page--home .arco-hero-photo {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 11 !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* Internas continuam verticais */
  body:not(.arco-page--home) .arco-page-photo-card,
  body:not(.arco-page--home) .arco-page-hero__media {
    display: block !important;
    width: min(82vw, 330px) !important;
    min-width: 0 !important;
    max-width: 330px !important;
    border-radius: 28px !important;
  }

  body:not(.arco-page--home) .arco-page-photo-card img,
  body:not(.arco-page--home) .arco-page-hero__media img {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
    object-fit: cover !important;
    object-position: center 12% !important;
  }

  .arco-proofline {
    margin-top: 20px !important;
  }

  .arco-proofline span {
    padding: 7px 10px !important;
    font-size: 10px !important;
  }
}


/* =========================================================
   MOBILE PEQUENO
   ========================================================= */

@media (max-width: 560px) {
  body.arco-page--home .arco-home-hero,
  body:not(.arco-page--home) .arco-page-hero {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.arco-page--home .arco-home-hero h1,
  body:not(.arco-page--home) .arco-page-hero h1 {
    font-size: clamp(34px, 11vw, 48px) !important;
  }

  body.arco-page--home .arco-home-hero .actions,
  body:not(.arco-page--home) .arco-page-hero .actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.arco-page--home .arco-home-hero .btn,
  body:not(.arco-page--home) .arco-page-hero .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  body.arco-page--home .arco-home-hero__visual,
  body:not(.arco-page--home) .arco-page-hero__visual,
  body:not(.arco-page--home) .arco-page-hero__media {
    justify-self: center !important;
    width: 100% !important;
  }

  /* Home no celular fica horizontal mais compacta */
  body.arco-page--home .arco-hero-media-card {
    width: 100% !important;
    max-width: 340px !important;
    min-width: 0 !important;
  }

  body.arco-page--home .arco-hero-photo {
    aspect-ratio: 4 / 3 !important;
    object-position: center center !important;
  }

  /* Internas no celular continuam retrato */
  body:not(.arco-page--home) .arco-page-photo-card,
  body:not(.arco-page--home) .arco-page-hero__media {
    width: min(88vw, 320px) !important;
    max-width: 320px !important;
    min-width: 0 !important;
  }

  body:not(.arco-page--home) .arco-page-photo-card img,
  body:not(.arco-page--home) .arco-page-hero__media img {
    aspect-ratio: 4 / 5 !important;
    object-position: center 12% !important;
  }
}


/* =========================================================
   AJUSTE EXTRA PARA GRIDS INTERNOS
   ========================================================= */

body:not(.arco-page--home) .arco-offer-grid,
body:not(.arco-page--home) .arco-journey__grid {
  max-width: 100%;
}

@media (max-width: 879px) {
  body:not(.arco-page--home) .arco-offer-grid,
  body:not(.arco-page--home) .arco-journey__grid {
    grid-template-columns: 1fr !important;
  }
}