/*
 * Ajustes responsivos mobile (≤767.98px).
 * Espelha assets/scss — aplicado enquanto o build SCSS não roda localmente.
 */

html,
body {
  overflow-x: clip;
  max-width: 100%;
}

#exposicao-genoma {
  overflow-x: clip;
}

#bg-dna {
  left: 0;
  top: 0;
  max-width: 100%;
  pointer-events: none;
}

@media (max-width: 767.98px) {
  #exposicao-genoma .menu-lateral {
    right: 8px;
  }

  #exposicao-genoma .menu-lateral .menu-icons {
    overflow: hidden;
    max-width: 66px;
  }

  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta {
    overflow: visible;
  }

  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta h5 {
    position: relative;
    z-index: 2;
    margin-bottom: 0.75rem;
  }

  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta picture.ano-image,
  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta .ano-image,
  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta img.ano-image {
    position: static;
    display: block;
    opacity: 0.85;
    max-width: min(46%, 140px);
    height: auto;
    margin: 0 0 0.75rem auto;
  }

  #exposicao-genoma .modulo.modulo-01 .estimulo-resposta p {
    clear: both;
    padding-top: 0;
    margin-bottom: 1.75rem;
  }

  #exposicao-genoma .modulo.modulo-03 .quotation-ext {
    overflow-x: clip;
  }
  #exposicao-genoma .modulo.modulo-03 .quotation-ext .quotation {
    margin-top: 0;
    padding-top: calc(min(72vw, 280px) * 612 / 484 + 1.5rem);
  }

  #exposicao-genoma .modulo.modulo-03 .quotation-ext .quotation .legenda {
    position: static;
    max-width: 100%;
    margin-bottom: 1.25rem;
    padding: 0;
  }

  #exposicao-genoma .modulo.modulo-03 .quotation-ext .quotation::after {
    width: min(72vw, 280px);
    height: auto;
    aspect-ratio: 484 / 612;
    top: 0;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }

  #exposicao-genoma .modulo.modulo-04 .livro {
    margin-bottom: 2rem;
  }

  #exposicao-genoma .modulo.modulo-04 .livro .btn-link-image {
    padding-left: 0;
  }

  #exposicao-genoma .modulo.modulo-04 .quotation {
    margin-top: 0;
    padding-top: 1rem;
  }

  #exposicao-genoma .modulo.modulo-04 .quotation .legenda {
    position: static;
    padding: 0 0 1.25rem;
    top: auto;
    right: auto;
    max-width: 100%;
  }

  #exposicao-genoma .modulo.modulo-04 .articles .btn-link-image {
    position: static;
    display: flex;
    width: 100%;
    max-width: 100%;
    margin-top: 1.5rem;
  }

  #exposicao-genoma .modulo.modulo-06 {
    padding: 80px 0 120px;
  }

  #exposicao-genoma .modulo.modulo-06 .content {
    padding: 40px 20px 0;
  }

  #exposicao-genoma .modulo.modulo-06 .content .title h3 {
    font-size: 28px;
    line-height: 1.3;
  }

  #exposicao-genoma .lista-materias .materia picture.nome-jornal,
  #exposicao-genoma .lista-materias .materia .nome-jornal {
    position: static;
    display: block;
    margin-bottom: 0.5rem;
  }

  .flip-box {
    width: min(100%, 300px);
    margin-left: auto;
    margin-right: auto;
  }

  .btn-link-image {
    max-width: 100%;
    gap: 0.625rem;
    align-items: center;
  }

  .btn-link-image .icon,
  .btn-link-image .link-icon,
  .btn-link-image picture.link-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    margin-right: 0;
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .btn-link-image .icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .btn-link-image img.link-icon,
  .btn-link-image picture.link-icon img {
    width: 48px;
    height: 48px;
    min-width: 48px;
    max-width: 48px;
    object-fit: contain;
    flex-shrink: 0;
  }

  .btn-link-image span {
    flex: 1;
    min-width: 0;
    font-size: 15px;
    line-height: 1.35;
    letter-spacing: 0.02em;
  }

  #exposicao-genoma .topo .content .explore-exposicao .row-buttons .btn-link-image .icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
  }

  #exposicao-genoma .topo .content .explore-exposicao .row-buttons .btn-link-image span {
    font-size: 15px;
    line-height: 1.35;
  }

  .btn-link-image.btn-borda {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0;
    padding: 0.875rem 1rem;
    right: auto;
    bottom: auto;
    margin: 1.5rem auto 0;
    box-sizing: border-box;
  }

  .btn-link-image.btn-borda span {
    text-transform: none;
  }

  #exposicao-genoma .topo h1 {
    font-size: 32px;
    line-height: 1.2;
    margin-bottom: 3rem;
  }

  #exposicao-genoma .topo h1 span {
    font-size: 26px;
  }

  #exposicao-genoma .topo .content {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  #exposicao-genoma .topo .content .introducao {
    margin-bottom: 3rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  #exposicao-genoma .topo .content .introducao p {
    font-size: 16px;
    line-height: 1.55;
  }

  #exposicao-genoma .topo .content .explore-exposicao {
    padding-top: 2.5rem;
  }

  #exposicao-genoma .topo .content .explore-exposicao h3 {
    font-size: 22px;
    line-height: 1.3;
    margin-bottom: 1.5rem;
    padding-left: 1rem;
  }

  #exposicao-genoma .topo .content .explore-exposicao ul {
    margin-bottom: 2.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  #exposicao-genoma .topo .content .explore-exposicao ul li {
    font-size: 16px;
    line-height: 1.35;
    margin-bottom: 0.625rem;
  }

  #exposicao-genoma .topo .content .explore-exposicao ul li .square {
    width: 14px;
    height: 14px;
    margin-right: 0.5rem;
  }

  #exposicao-genoma #menu-box {
    width: calc(100% - 5rem);
    top: auto;
  }

  #exposicao-genoma #menu-box .titulo-menu h5 {
    font-size: 15px;
  }

  #exposicao-genoma #menu-box ul {
    padding: 0.875rem 1rem;
  }

  #exposicao-genoma #menu-box ul li a {
    font-size: 15px;
    line-height: 1.35;
  }

  #exposicao-genoma .row-timeline,
  #exposicao-genoma .row.row-timeline {
    margin-top: 1.5rem;
  }

  #exposicao-genoma .row-timeline .timeline .footer-timeline {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 0.75rem;
  }

  #exposicao-genoma .row-timeline .timeline .footer-timeline > span {
    font-size: 15px;
    line-height: 1.35;
    margin-bottom: 0;
    text-align: center;
    max-width: 100%;
  }

  #exposicao-genoma .row-timeline .timeline .footer-timeline .controlers-timeline {
    position: relative;
    width: min(100%, 240px);
    height: auto;
    min-height: 48px;
    margin: 0 auto;
    padding: 0;
  }

  #exposicao-genoma .row-timeline .timeline .footer-timeline .controlers-timeline svg {
    width: 48px;
    height: 48px;
  }

  #exposicao-genoma .row-timeline .timeline .footer-timeline .controlers-timeline picture,
  #exposicao-genoma .row-timeline .timeline .footer-timeline .controlers-timeline img {
    max-width: 40px;
    max-height: 40px;
    width: auto;
    height: auto;
    object-fit: contain;
  }

  #exposicao-genoma .row-timeline .timeline .container-timeline {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  #exposicao-genoma .topo .content > .row-timeline {
    max-width: 100%;
    overflow: hidden;
  }

  #exposicao-genoma .topo .content > .row-timeline > .row > .timeline {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  #exposicao-genoma .row-timeline .timeline .container-timeline .parent {
    display: block;
    width: auto;
    max-width: none;
  }

  #exposicao-genoma .row-timeline .timeline .container-timeline .contentBlock {
    width: auto;
    max-width: none;
    float: left;
    display: block;
  }

  #exposicao-genoma .row-timeline .timeline .container-timeline .contentBlock picture {
    display: block;
    width: auto;
    max-width: none;
  }

  #exposicao-genoma .row-timeline .timeline .container-timeline .contentBlock picture img,
  #exposicao-genoma .row-timeline .timeline .container-timeline .contentBlock > img {
    display: block;
    height: 280px;
    width: auto !important;
    max-width: none !important;
    max-height: 280px;
    min-width: max-content;
    object-fit: contain;
  }

  #exposicao-genoma .video,
  #exposicao-genoma a.video {
    transform: none !important;
    opacity: 1 !important;
  }

  #exposicao-genoma .video-left,
  #exposicao-genoma .video-right,
  #exposicao-genoma .img-left,
  #exposicao-genoma .img-right {
    margin-top: 0 !important;
  }

  #exposicao-genoma video.thumb-video {
    width: 100%;
    height: auto;
    object-fit: cover;
    vertical-align: top;
  }

  #exposicao-genoma .box-img,
  #exposicao-genoma .box-quotation,
  #exposicao-genoma .proximo-capitulo,
  #exposicao-genoma .iniciar-exposicao,
  #exposicao-genoma .interrogacao-roxo,
  #exposicao-genoma .podcast,
  #exposicao-genoma .card-entrevista,
  #exposicao-genoma .card-biblioteca,
  #exposicao-genoma .explore-exposicao li,
  #exposicao-genoma .lista-materias .materia,
  #exposicao-genoma .arvore-dos-enigmas img,
  #exposicao-genoma .img-bacteria,
  #exposicao-genoma .modulo .text img,
  #exposicao-genoma .a-noticia-se-espalha-imagens img.-absolute,
  #exposicao-genoma .btn-link-image {
    transform: none !important;
    opacity: 1 !important;
  }

  #exposicao-genoma .home-topo canvas {
    transform: none !important;
  }

  #exposicao-genoma .modulo.modulo-04 .avancando-no-caminho .gif-genoma {
    overflow: hidden;
    border-radius: 50%;
    aspect-ratio: 1;
    width: min(100%, 280px);
    max-width: 280px;
    margin: 1.5rem auto 0;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
    -webkit-mask-image: -webkit-radial-gradient(white, black);
  }

  #exposicao-genoma .modulo.modulo-04 .avancando-no-caminho .gif-genoma video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    box-shadow: none;
  }

  #exposicao-genoma .modulo.modulo-01 .extrato-ext .btn-link-image.btn-borda {
    position: relative;
    width: calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    right: auto;
    left: auto;
    margin: 1.25rem auto 0;
    justify-content: center;
  }

  #exposicao-genoma .container-fluid.artigos .btn-link-image,
  #exposicao-genoma .artigos .btn-link-image,
  #exposicao-genoma .modulo .articles .btn-link-image,
  #exposicao-genoma .modulo .livro .btn-link-image {
    position: static;
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 1rem 0;
  }

  #exposicao-genoma .container-fluid.artigos .btn-link-image span,
  #exposicao-genoma .artigos .btn-link-image span,
  #exposicao-genoma .modulo .articles .btn-link-image span,
  #exposicao-genoma .modulo .livro .btn-link-image span {
    font-size: 13px;
    line-height: 1.3;
    text-transform: none;
  }

  #exposicao-genoma .container-fluid.artigos .col-md-6.offset-md-4,
  #exposicao-genoma .container-fluid.artigos .col-md-6 {
    flex: 0 0 100%;
    max-width: 100%;
    margin-left: 0;
  }

  #exposicao-genoma .modulo {
    padding-bottom: 4rem;
  }

  #exposicao-genoma .modulo.modulo-01 .a-rede {
    padding-top: 2rem;
    margin-bottom: 2.5rem;
  }

  #exposicao-genoma .modulo.modulo-01 .extrato-ext,
  #exposicao-genoma .modulo.modulo-01 .mapa-ext,
  #exposicao-genoma .modulo.modulo-02 .avaliacoes,
  #exposicao-genoma .modulo.modulo-03 .jogando-grande-liga,
  #exposicao-genoma .modulo.modulo-03 .articles,
  #exposicao-genoma .modulo.modulo-03 .a-noticia-se-espalha-imagens,
  #exposicao-genoma .modulo.modulo-03 .pesquisa,
  #exposicao-genoma .modulo.modulo-03 .row-timeline,
  #exposicao-genoma .modulo.modulo-03 .artigos,
  #exposicao-genoma .modulo.modulo-04 .avancando-no-caminho,
  #exposicao-genoma .modulo.modulo-04 .empreendimento,
  #exposicao-genoma .modulo.modulo-04 .mendelics,
  #exposicao-genoma .modulo.modulo-04 .articles,
  #exposicao-genoma .modulo.modulo-04 .pesquisa-para-o-mercado {
    padding-bottom: 3rem;
  }

  #exposicao-genoma .modulo.modulo-03 .arvore-dos-enigmas {
    padding-bottom: 4rem;
  }

  #exposicao-genoma .modulo .header-title h3 {
    font-size: 26px;
    line-height: 1.25;
    padding: 1rem 2rem 1rem 1rem;
    margin-bottom: 2.5rem;
  }

  #exposicao-genoma .modulo .content {
    padding-top: 1.5rem;
  }

  #exposicao-genoma .modulo.modulo-01 .mapa-ext .mapa-box .box-content {
    padding: 1.25rem;
    margin-bottom: 1.5rem;
  }

  #exposicao-genoma .modulo.modulo-03 .quotation-ext {
    padding: 2.5rem 0;
  }

  #exposicao-genoma .modulo .content h4 {
    font-size: 22px;
    line-height: 1.35;
    padding-left: 0;
    margin-bottom: 1.5rem;
  }

  #exposicao-genoma .modulo .content h5 {
    font-size: 18px;
    line-height: 1.4;
  }

  /* Citações — seletores com mesma especificidade do style.min.css */
  #exposicao-genoma .modulo .content .quotation .box-quotation,
  #exposicao-genoma .modulo .content .quotation-ext .quotation .box-quotation {
    padding: 1.25rem 0.75rem 0.875rem 2rem;
    border-radius: 16px;
  }

  #exposicao-genoma .modulo .content .quotation .box-quotation p,
  #exposicao-genoma .modulo .content .quotation-ext .quotation .box-quotation p {
    font-size: 15px;
    line-height: 1.55;
    letter-spacing: 0.02em;
  }

  #exposicao-genoma .modulo .content .quotation .box-quotation p::before,
  #exposicao-genoma .modulo .content .quotation-ext .quotation .box-quotation p::before {
    width: 32px;
    height: 28px;
    top: 12px;
    left: 16px;
  }

  #exposicao-genoma .modulo .content .quotation .legenda,
  #exposicao-genoma .modulo .content .quotation-ext .quotation .legenda,
  #exposicao-genoma .modulo.modulo-04 .quotation .legenda {
    font-size: 13px;
    line-height: 1.45;
    padding: 0 0 0.75rem;
  }

  /* Legendas de fotos (Orbitron abaixo das imagens) */
  #exposicao-genoma .modulo.modulo-02 .acompanhamento-e-avaliacao-ext .acompanhamento-e-avaliacao-imagens .box-img p,
  #exposicao-genoma .modulo .box-img p {
    font-size: 12px;
    line-height: 1.45;
    letter-spacing: 0.02em;
    max-width: 100%;
    margin-top: 0.75rem;
  }

  #exposicao-genoma .modulo.modulo-03 .legenda-fotos p,
  #exposicao-genoma .modulo.modulo-04 .avancando-no-caminho-img-ext .legenda-fotos p,
  #exposicao-genoma .modulo.modulo-04 .livro p.legenda-caderno {
    font-size: 12px;
    line-height: 1.45;
    letter-spacing: 0.02em;
  }

  #exposicao-genoma .modulo.modulo-03 .legenda-fotos,
  #exposicao-genoma .modulo.modulo-04 .avancando-no-caminho-img-ext .legenda-fotos {
    margin-top: -2rem;
    margin-bottom: 2rem;
  }

  #exposicao-genoma .modulo.modulo-05 .genome .box-content {
    padding: 1rem;
  }

  #exposicao-genoma .modulo.modulo-05 .genome .box-content p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 1rem;
  }

  #exposicao-genoma .modulo.modulo-05 .genome .logo-link {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }

  #exposicao-genoma .modulo.modulo-05 .genome .box-content .btn-link-image {
    width: 100%;
  }

  #exposicao-genoma .modulo.modulo-05 .genome .box-content .btn-link-image span {
    font-size: 15px;
    line-height: 1.35;
    text-transform: none;
  }
}

@media (max-width: 767.98px) and (prefers-reduced-motion: reduce) {
  #exposicao-genoma .modulo.modulo-03 .a-noticia-se-espalha-imagens picture:nth-of-type(1) img.-absolute {
    transform: translateY(0);
  }

  #exposicao-genoma .modulo.modulo-03 .a-noticia-se-espalha-imagens picture:nth-of-type(2) img.-absolute {
    transform: translateY(12px);
  }

  #exposicao-genoma .modulo.modulo-03 .a-noticia-se-espalha-imagens picture:nth-of-type(3) img.-absolute {
    transform: translateY(24px);
  }
}
