
    body {
      font-family: 'Inter', sans-serif;
      scroll-behavior: smooth;
      background-color: #f0f9ff;
    }

    html {
      -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
    }

    img {
      max-width: 100%;
      height: auto;
    }

    iframe {
      max-width: 100%;
    }

    .hero-bg {
      background: linear-gradient(to right, #0288d1, #26c6da);
    }

    #menu-nav {
      position: sticky;



    }

    /* CSS para centralização perfeita da seção serviços */
    #servicos {
      display: block;
      /* Remove o flex que estava causando problema */
    }

    /* Garantir que o grid seja centralizado */
    #servicos .max-w-6xl {
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    /* Grid responsivo centralizado */
    #servicos .grid {
      justify-content: center;
      place-items: center;
    }

    /* Garantir que todos os cards tenham o mesmo tamanho */
    #servicos .bg-white {
      min-height: 280px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    /* Para o último card (Laserterapia) que é maior */
    #servicos .bg-white:last-child {
      min-height: auto;
      grid-column: 1 / -1;
      /* Ocupa toda a largura disponível */
    }

    nav {
      height: auto;
      min-height: 60px;
      /* Altura mínima reduzida */
    }

    /* Ajustar scroll-margin das seções para compensar navbar menor */
    section {
      scroll-margin-top: 50px;
      /* Reduzido de 100px para 70px */
    }

    /* Media queries para melhor responsividade */
    @media (max-width: 768px) {
      #servicos .grid {
        grid-template-columns: 1fr;
        max-width: 400px;
        margin: 0 auto;
      }

      section {
        scroll-margin-top: 100px;
      }

      #vantagens,
      #diferenciais {
        padding-top: 200px;
      }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
      #servicos .grid {
        grid-template-columns: repeat(2, 1fr);
        max-width: 800px;
        margin: 0 auto;
      }
    }

    @media (min-width: 1025px) {
      #servicos .grid {
        grid-template-columns: repeat(3, 1fr);
        max-width: 1200px;
        margin: 0 auto;
      }
    }