@media only screen and (min-width: 992px) {
  section.home.hero.mobile {
    display: none;
  }
  .sidenav {
    display: flex !important;
    flex-direction: row !important; /* 🔥 Garante que o menu não mude para coluna */
  }
  .no-arrows .sf-with-ul::after {
    display: none !important;
  }
  #mobnav-btn,
  #logo.logo-azul { 
    display: none; }
  .normal_drop_down a:hover > ul,
  #logo.logo-branco {
    display: block; 
  }
  ul.sf-menu { 
    flex-flow: row wrap;
    justify-content: center;
  }
  .faq .img-side::before {
    transform: translateX(4%);
  }
  /* ul.sf-menu > li:last-of-type a {
    text-shadow: none;
    padding: 12px 28px;
    font-size: 15px;
    margin-left: 12px;
    background: linear-gradient(90deg, #2E5A81 0%, #50B2D7 100%);
    border-radius: 50px;
    box-shadow: var(--box-shadow);
    transform: all .3s ease-in-out;
  } */
}

@media (max-width:1199px){
  section.medicos ul{
    --overlap: 20%;
    transform: translateY(calc(-1 * var(--overlap)));
  }
}

@media only screen and (max-width: 991px) {
  section.home.mobile {
    display: block;
  }
  section.home.desktop {
    display: none;
  }
  section.home.hero {
    height: 100%;
  }
  section.home.hero ul .text-overlay {
    text-align: center;
    min-width: unset;
    width: 90%;
    padding: 28px 15px 15px;
    top: unset;
    bottom: 20%;
  }
  section.home.hero ul .text-overlay h2 {
    font-size: 28px;
    background: none;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;     
    color: #EFEFEF;
  }
  header .navigation {
    background: #fff;
    padding: 10px 0 5px;
  }
  header .navigation .logo #logo.logo-azul {
    display: block;
  }
  header #logo img {
    width: 150px;
    margin: 22px 0 5px;
    transform: translateX(10%);
  }
  header .navigation .logo #logo.logo-branco {
    display: none !important;
  }
  .sidenav {
    z-index: 999;
    background: var(--v2);
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 0;
    max-width: 100%;
    overflow-y: auto; /* Permite scroll se necessário */
    transition: width 0.3s ease-in-out; /* Suaviza a abertura */
  }
  ul.sf-menu {
    margin: 80px auto;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-height: 90vh; /* Limita a altura do menu lateral */
    overflow-y: auto; /* Permite rolar dentro do menu */
  }
  ul.sf-menu li {
    width: 100%;
  }
  ul.sf-menu li a {
    display: block;
    padding: 12px 20px;
    font-size: 1.1em;
  }
  ul.sf-menu a { 
    width: 100%;
    text-transform: uppercase; 
  }
  ul.sf-menu > li a:hover {
    background: var(--v1);
    color: #fff;
  }
  header .navigation #logo {
    display: flex;
    flex-flow: row wrap;
    justify-content: center; 
  }  
  #mobnav-btn { 
    position: fixed;
    top: 4%;
    right: 8%;
    z-index: 1000;
    transition: top 0.3s ease-in-out;
  }
    /* Para animação suave no submenu */
  .sf-menu li ul {
    display: none !important; /* Inicialmente, o submenu está oculto */
    transition: all 0.3s ease; /* Adiciona animação suave */
    border-radius: 0;
  }
}

@media only screen and (max-width: 991px) {
  .btn {
    font-size: 16px;
  }
  section.escolhas {
    padding: 80px var(--lateral-gutter) 100px;
  }
  section.escolhas .boxes {
    margin-top: 40px;
  }
  section.escolhas .boxes ul {
    margin: 15px auto 50px;
  }
  section.escolhas h2 {
    font-size: 1.8em !important;
  }
  section.escolhas h3 {
    font-size: 1.5em !important;
  }
  section.parte3 ul {
    margin: 40px 15px;
  }
  section.parte3 ul li {
    font-size: 1.1em;
    line-height: 1.3em;
    padding: 14px 24px;
  }
  section.divideo {
    padding: 60px var(--lateral-gutter) 80px;
  }
  section.medicos ul {
    --overlap: 0%;
    transform: none;
    gap: 20px;
    justify-content: center;
  }
  section.profissionais {
    padding: 40px var(--lateral-gutter) 20px;
  }  
  section.medicos {
    padding-top: 40px;
    padding-bottom: 80px;
  }
  section.medicos ul li img {
    width: 60%;
    display: block;
  }
  section.medicos ul li span {
    position: static;
    transform: none;
    display: block;
    margin-top: 10px;
    text-shadow: none;
  }
  section.medicos ul li div {
    margin: 0 auto;
  }
  section.faq .container-wide {
    flex-direction: column;
  }
  section.faq .grid-8 {
    padding: 40px 20px;
  }
  .faq .img-side {
    min-height: 240px;
  }  
  section.modulos {
    padding-bottom: 45px;
  }
  section.modulos h1 {
    text-align: center;
  }
  section.modulos .pos-panel h3 {
    text-align: center;
  }
  section.modulos .pos-panel .botao {
    padding-top: 40px;
    align-items: center;
  }
  .panel-photo.desktop {
    display: none;
  }
  section.faq .grid-8,
  section.medicos ul li {
    width: 100%;
  }
  footer {
    padding: 60px var(--lateral-gutter) 40px;
  }
  footer .nav-footer {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    text-align: center; 
  }
  footer .nav-footer .grid-1-3 {
    margin-bottom: 40px;
  }
  footer .nav-footer #logo {
    margin: 0 auto;
    padding-left: 30px;
  }
  footer .nav-footer .redes-sociais,
  footer .nav-footer .links {
    justify-content: center;
  }
}

@media only screen and (max-width: 768px) {
  section.home.hero ul .text-overlay {
    width: 70%;
  }
  section.parte2 {
    padding: 80px var(--lateral-gutter) 60px;
  }
  section.parte1 {
    padding: 60px var(--lateral-gutter) 20px;
  }
  section.parte1 .text-side {
    padding-top: 10px;
    padding-left: 0;
  }
   section.intro {
    padding: 60px var(--lateral-gutter) 0px;
  }
  section.modulos .pos-panel h3 span {
    font-size: 1.1em;
  }
  .panel-photo {
    width: min(52vw, 260px);
    right: -6%;
    top: -2%;
    opacity: .4;
  }  
  .painel-modulos.fx { 
    flex-direction: column;
  }
  .menu-col{
    flex-basis: auto;
  }
  .conteudo-col{
    flex-basis: auto;
  }
  section.faq .grid-8 {
    width: 100%;
  }
  section.faq .grid-8:first-of-type {
    padding: 60px var(--lateral-gutter);
  }
  section.divideo .video-container {
  padding-top: 50px;
  }
  section.medicos ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    width: 90%;
    transform: translateY(0);
    margin: 10px auto;
  }  
  section.medicos ul li span {
    position: relative;
    bottom: 50px;
    left: initial;
    transform: translateX(0);
  }
  section.medicos ul li {
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 600px) {
  h1 { font-size: 1.8em !important; }
  h2 { font-size: 1.6em !important; }
  h3, h4 { font-size: 1.4em !important; 
  }
  .btn {
    padding: 14px 28px;
  }
  .botao {
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
  section.parte1 ul li img {
    width: 20px;
  }
  section.parte3 {
    padding-top: 60px;
  }  
  section.parte2 ul {
    width: 90%;
  }
  section.home.hero ul .text-overlay {
    width: 85%;
  }
  footer p.responsavel {
    width: 70%;
    text-align: center;
    margin: 10px auto 5px;
  }
  section.erro .erro-texto {
    padding: 14vw var(--lateral-gutter) 10vw;
  }
}