@media screen and (max-width: 1250px) {
  /* GENERAL START */

  h1 {
    font-size: 2.5rem;
    font-weight: 700; /* BOLD */
    line-height: 1.05;
  }

  h2 {
    line-height: 1;
    font-size: 1.75rem;
    font-weight: 600; /* SEMIBOLD */
    color: #aaaaaa;
  }

  p {
    font-size: 1rem;
    font-weight: 400; /* REGULAR */
  }

  iframe {
    max-width: 100%;
  }

  .container,
  .container-1 {
    width: 100%;
    padding: 5rem 0;
  }

  .box-img img {
    width: 100%;
  }

  /* CARROSSEL INFINITO */

  section.carrosel .carrosel-card {
    width: 32%;
  }

  section.carrosel .carrosel-card img {
    width: auto;
    height: 300px;
  }

  section.carrosel {
    padding: 1.5rem;
  }

  section.carrosel-2 {
    padding: 1.5rem;
  }

  section .carrosel-box-2 {
    padding: 0;
  }

  .container-1 img {
    width: 100%;
  }

  /* CARROSSEL ANTES E DEPOIS */

  .carrosel.galeria .carrosel-box {
    width: 100%;
    margin-bottom: 2rem;
  }

  .carrosel.galeria .carrosel-card {
    width: calc((100% - 1.5rem) / 2);
    text-align: center;
  }

  .carrosel.galeria .carrosel-card img {
    width: 100%;
    height: 300px;
  }

  .carrosel.galeria p.aviso {
    font-size: 0.875rem;
    margin-left: -1.5rem;
  }

  /* SECTION DOUTOR (INDEX) */

  section.doutor .container {
    display: flex;
    flex-direction: column;

    text-align: center;
  }

  section.doutor .btn {
    justify-self: center;
    width: 100%;
  }

  section.doutor .box-txt-3 {
    align-items: center;
  }

  section.doutor .box-txt-3 .btn {
    width: 100%;
    max-width: 500px;
  }

  .formaçao-box {
    align-self: center;
  }

  /* SECTION CONTATO */

  section.contato .container {
    display: flex;
    flex-direction: column-reverse;

    text-align: center;
  }

  /* TIMELINE  */

  section.experiencia .topico {
    text-align: left;
  }

  section.experiencia .btn {
    justify-self: start;
  }

  .timeline ul li {
    /* MAGIC STYLES */
    margin-left: calc(-41.66vw);
  }

  .timeline ul li div {
    position: relative;
    bottom: 0;
    height: 130px;
    background: var(--color-white);
    border-radius: 1.5rem;
  }

  /* LADO DAS CAIXINHAS */

  .timeline ul li:nth-child(even) div {
    left: 90px;
    text-align: left;
  }

  .timeline ul li:nth-child(odd) div {
    left: 90px;
    text-align: left;
  }

  /* ANIMAÇÃO DAS CAIXINHAS (ENTRADA) */

  .timeline ul li div {
    visibility: hidden;
    opacity: 0;
    transition: all 1s ease-in-out;
  }

  .timeline ul li:nth-child(even) div {
    transform: translate3d(1000px, 0, 0);
  }

  .timeline ul li:nth-child(odd) div {
    transform: translate3d(1000px, 0, 0);
  }

  /* FIM DA TIMELINE */

  .timeline ul li.in-view div {
    transform: none;
    visibility: visible;
    opacity: 1;
  }

  /* CARD DE CONTATO */

  .contato-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    font-size: 1.125rem;

    text-align: center;
  }

  section.contato .btn {
    align-self: center;
    width: 500px;
  }

  .contato-map iframe {
    height: 500px;
  }

  /* FIM DA INDEX */

  /* PÁGINA SOBRE A CLINICA */

  .clinica .container {
    display: flex;
    flex-direction: column;
    text-align: center;
  }

  /* PÁGINA SOBRE O DOUTOR */

  section.procedimento .container {
    display: flex;
    flex-direction: column;
    text-align: center;
  }

  section.procedimento .box-img {
    align-self: center;
  }

  /* REMOÇÃO DE ATTACHMENT */

  section.slide.slide_2 {
    background-attachment: scroll;
  }

  .hero {
    background-attachment: scroll;
  }

  .hero-doutor {
    background-attachment: scroll;
  }

  /* EFEITOS JS */

  /* EFEITOS DE TELA (JS) */

  .effect {
    transform: translateX(-300px);
  }

  .effect2 {
    transform: translateX(300px);
  }

  /* LGPD BOX */

  .cookie-container {
    border-radius: 1.5rem 1.5rem 0 0;
    padding: 1.25rem 1.5rem;
  }
}

/* TABLET VERSION (OK) */

@media screen and (max-width: 900px) {
  /* INDEX */

  section.carrosel .carrosel-card {
    width: 48%; /* O SEGREDO TA AQUI PARA MEXER NO CARROSEL */
  }

  section.carrosel .carrosel-card img {
    width: auto;
    height: 300px;
  }

  section.carrosel {
    padding: 1.5rem;
  }

  section.carrosel-2 {
    padding: 1.5rem;
  }

  section .carrosel-box-2 {
    padding: 0;
  }

  /* SESSÃO DO CTA */

  .botao .btn {
    width: calc(100vw - 3rem);
  }

  /* CAPA DA HERO (PÁGINA INICIAL) */

  .hero {
    background-position: top right -350px;
  }

  /* CAPA DA HERO (DOUTOR) */

  .hero-doutor {
    background-position: top right -350px;
    overflow: hidden;
    overflow-x: hidden;
  }

  /* PÁGINA DO BLOG */

  section.postagens .container {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    text-align: center;
  }

  section.postagens .container button.btn {
    align-self: center;
    width: 31rem;
  }

  /* DEPOIMENTOS */

  .depoimentos .box-txt {
    max-width: calc(100vw - 3rem);
  }

  .depoimentos .container-1 {
    max-width: calc(100vw - 3rem);
  }

  .depoimentos .slider-wrapper {
    max-width: calc(100vw - 3rem);
  }

  .depoimentos .slider-nav {
    max-width: calc(100vw - 3rem);
  }
}

/* MOBILE VERSION */

@media screen and (max-width: 500px) {
  /* CLIENT */

  /* GERAIS */

  html {
    max-width: 100vw;
    overflow-x: hidden;
  }

  h1 {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.5rem;
  }

  .container {
    margin: 0 1rem;
    padding: 3rem 0;

    display: flex;
    flex-direction: column;
    gap: 1rem;

    /* width: calc(100vw - 32px); */
  }

  .container-1 {
    gap: 1rem;
    margin: 0 1rem;
    padding: 3rem 0;
  }

  .botao .btn {
    width: auto;
    min-width: 100%;
  }

  .btn {
    padding: 0.5rem 0;
  }

  .btn h2 {
    font-size: 1.25rem;
  }

  /* BOTÃO DE WPP */

  .whatsapp-btn {
    bottom: 16px;
    right: 16px;
  }

  /* MENU */

  header .container {
    height: 70px;
  }

  header .menu {
    display: none;
  }

  header .menu_mobile {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
  }

  header .menu_mobile i {
    font-size: 2.5rem;
  }

  /* CARROSSEL INFINITO */

  .carrosel .box-txt-row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  section.carrosel .carrosel-card {
    width: 48%; /* O SEGREDO TA AQUI PARA MEXER NO CARROSEL */
  }

  section.carrosel .carrosel-card img {
    width: auto;
    height: 300px;
  }

  section.carrosel {
    padding: 0 0 3rem 1.5rem;
  }

  section.carrosel .carrosel-card {
    width: 300px;
  }

  section.carrosel .carrosel-box {
    margin-bottom: 0;
  }

  section.carrosel-2 {
    padding: 1.5rem 0 1.5rem 1.5rem;
  }

  section .carrosel-box-2 {
    padding: 0;
  }

  /* CARROSSEL ANTES E DEPOIS */

  .carrosel.galeria .carrosel-box {
    width: 100%;
  }

  .carrosel.galeria .carrosel-card {
    width: 80%;
  }

  .carrosel.galeria .carrosel-card img {
    width: 100%;
    height: 300px;
  }

  /* TIMELINE MOBILE */

  .timeline ul li::after {
    width: 3rem;
    height: 3rem;
    font-size: 1.5rem;
  }

  .timeline ul li div {
    width: 250px;
    height: auto;
    padding: 0.5rem 0;
  }

  /* LADO DAS CAIXINHAS */

  .timeline ul li:nth-child(even) div {
    left: 50px;
    text-align: left;
  }

  .timeline ul li:nth-child(odd) div {
    left: 50px;
    text-align: left;
  }

  /* TAMANHO DAS FONTES (TIMELINE) */

  time {
    font-size: 1.125rem;
  }

  /* EFEITOS DE TELA (JS) */

  .effect {
    transform: translateX(-100px);
  }

  .effect2 {
    transform: translateX(100px);
  }

  /* RODAPÉ */

  .rodape .container {
    display: flex;
    flex-direction: column;
    padding: 3rem 0 0 0;
  }

  .rodape-row-1 {
    flex-direction: column;
    gap: 1rem;

    text-align: center;
  }

  .rodape-row-2 ul {
    flex-direction: column;
    gap: 1rem;
  }

  .rodape-row-3 {
    margin-bottom: 2rem;
    font-size: 1.5rem;
  }

  .rodape img {
    max-width: 5rem;
    max-height: 5rem;
  }

  .rodape-copyright {
    padding: 1rem 0;
  }

  /* PÁGINA INICIAL (INDEX) */

  .hero {
    justify-content: start;
    align-items: end;
    background-image: url(/images/instutucional/BannerMobile_Bener.png);
    background-attachment: scroll;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }

  .hero-logo {
    gap: 0.5rem;
  }

  .hero-logo img {
    margin-bottom: 0.5rem;
    width: 60px;
    height: 60px;
  }

  .hero-logo .topico {
    gap: 0;
  }

  .hero-logo p {
    font-size: 0.875rem;
  }

  section.hero .container {
    min-width: 75%;
    max-width: 75%;

    margin-bottom: 5rem;
  }

  .box-txt-2-2 {
    display: none;
  }

  /* SECTION EXPERIENCIA */

  .experiencia .container-1 .btn {
    max-width: calc(100vw - 2rem);
  }

  .experiencia .container-1 {
    width: 100%;
    justify-content: center;
    align-items: center;
  }

  .experiencia .container-1 {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100vw;
    box-sizing: border-box;

    padding: 3rem 1rem;
  }

  .experiencia .topico {
    width: 100%;
    justify-self: start;
    margin-bottom: 1.5rem;
  }

  section.experiencia .btn {
    margin-top: 1.5rem;
  }
  /* SECTION CONTATO */

  .contato-card {
    display: flex;
    gap: 1rem;
    align-items: center;
    font-size: 1.125rem;
  }

  .contato-map iframe {
    border-radius: 1.5rem;
    height: calc(100vw - 2rem);
    width: calc(100vw - 2rem);
  }

  .contato {
    max-width: 100%;
  }

  .contato .box-txt.effect {
    max-width: 100%;
    padding: 0 1rem;
  }

  .contato .box-txt.effect .btn {
    max-width: 100%;
  }

  .contato .container {
    max-width: 100%;
  }

  /* PÁGINA DA CLINICA */

  .hero-clinica .container {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .clinica-home .container-1 {
    gap: 1rem;
  }

  .play-button {
    padding: 0 0.25rem;
    border: solid 2px var(--color-white);
  }

  .play-button i {
    font-size: 1rem;
  }

  /* PÁGINA DO SOBRE O DOUTOR */

  .hero-doutor {
    background-color: #1d2437;
    background-image: none;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 5rem;
  }

  /* BOTÃO DE FORMAÇÃO */

  .formacao {
    align-self: center;
  }

  .formaçao-box {
    justify-self: center;
    gap: 0.5rem;
    align-self: center;

    text-align: center;
  }

  .formacao ul {
    margin-left: 0;
  }

  .formaçao-box i {
    font-size: 1.5rem;
  }

  /* PÁGINA DO BLOG */

  /* HERO CARROSSEL */

  #slides .slide .container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 98dvh;
    padding: 7.375rem 0;
  }

  #slides .slide .container h1 {
    margin-top: -0.5rem;
  }

  section.slide.slide_2 {
    background-attachment: scroll;
  }

  #controls-overlay {
    display: none;
  }

  section.slide a.media-side {
    display: flex;
    gap: 0.5rem;
    align-self: flex-end;
  }

  section.slide a.media-side i {
    font-size: 1rem;
  }

  #bullets {
    display: flex;
  }

  /* PÁGINA DE CADA POSTAGEM */

  section.postagens .container button.btn {
    align-self: center;
    width: 100%;
  }

  .tematica .container {
    margin-top: 3rem;
  }

  .postagens .container {
    gap: 1rem;
  }

  .postagens .box-img {
    padding-bottom: 0;
  }

  .postagens .box-txt {
    padding: 0 0 1.5rem 0;
  }

  .postagens img {
    width: 100%;
    min-height: calc(100vw - 2rem);
  }

  /* CARROSSEL DE ANTES E DEPOIS (CARROSEL-2) */

  section.carrosel-2 {
    padding: 0 1rem;
  }

  .slide-group {
    padding: 0;
  }

  .carrosel-2 .carrosel-card-2 {
    gap: 1rem;
  }

  a.carrosel-card-2 p {
    margin: 0;
  }

  /* DEPOIMENTOS */

  .depoimentos .box-txt {
    max-width: calc(100vw - 2rem);
  }

  .depoimentos .slider-wrapper {
    max-width: calc(100vw - 2rem);
  }

  .depoimentos .slider-nav {
    max-width: calc(100vw - 2rem);
  }

  .depoimentos .container-1 {
    max-width: calc(100vw - 2rem);
    gap: 1rem;
  }

  .depoimentos .topico {
    gap: 0;
  }

  .depoimentos .box-txt {
    gap: 1rem;
    padding: 1rem 0;
  }

  .depoimentos span {
    font-size: 1.5rem;
  }

  .depoimentos h2 {
    font-size: 1.125rem;
  }

  /* FAQ */

  section.faq h1 {
    text-align: start;
  }

  section.faq h2 {
    text-align: start;
    font-size: 1.5rem;
  }

  section.faq .faq-ask-title {
    gap: 1rem;
  }

  section.faq .faq-ask-title h2,
  .faq-ask-title i {
    font-size: 1rem;
  }

  section.faq .faq-ask-reposta {
    margin-left: 2rem;
  }

  .box-txt {
    max-width: 100vw;
  }

  /* CARROSSEL DE GALERIA */

  .carrosel.galeria p.aviso {
    margin-bottom: 0;
  }
}