/* =================================================================== */
/* ESTILOS RESPONSIVOS GERAIS                                         */
/* Ponto de quebra principal para notebooks e tablets grandes         */
/* =================================================================== */

@media only screen and (max-width: 1200px) {
  .logo img {
    max-height: 20vh;
    width: auto;
  }

  .carousel-caption.d-none.d-md-block {
    display: block !important;
  }

  /* Força o empilhamento da seção "Sobre" em telas menores que 1200px */
  .row.g-0.fundo-sobre-mim {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
  }

  .card {
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }

  .card img {
    border-radius: 0% !important;
    padding: 0.5rem;
  }
}

@media only screen and (max-width: 992px) {
  .carousel-caption.d-none.d-md-block h1 {
    font-size: 1.6rem;
  }

  .col-md-6 {
    width: 100% !important;
  }

  .card img {
    max-width: 100%;
  }

  .social-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
  }

  .social-link {
    max-width: 80%;
    text-align: center;
  }
}

@media only screen and (max-width: 768px) {
  .carousel-caption.d-none.d-md-block h1 {
    font-size: 1.4rem;
  }

  /* --- Cabeçalho --- */
  .logo img {
    max-height: 12vh; /* Reduz a altura do logo para um tamanho mais adequado */
  }

  header.cabecalho.rolagem img {
    max-height: 10vh; /* Garante que o logo na rolagem também seja ajustado */
  }

  /* --- Seção Sobre Mim --- */
  .card-title {
    font-size: 2.2rem !important;
  }

  .card-text {
    font-size: 1.2rem !important; /* Reduz o tamanho do texto do parágrafo */
  }

  .imagem-interprete {
    padding: 1rem; /* Reduz o espaçamento da imagem */
  }

  /* --- Seção Projetos (Vídeos) --- */
  .video-container {
    padding: 1rem 0;
    overflow-x: hidden; /* CRÍTICO: Impede a rolagem horizontal no container */
  }

  .video-wrapper {
    width: 80%; /* Deixa 10% de cada lado para as alegorias */
  }
}

/* =================================================================== */
/* Smartphones médios e grandes (até 600px)                           */
/* =================================================================== */

@media only screen and (max-width: 600px) {
  .carousel-caption.d-none.d-md-block h1 {
    font-size: 1.2rem !important;
  }

  .logo img {
    max-height: 10vh !important;
  }
}

/* =================================================================== */
/* Smartphones pequenos (até 480px)                                   */
/* =================================================================== */

@media (max-width: 480px) {
  .video-wrapper {
    width: 85%;
  }
}

/* =================================================================== */
/* Smartphones muito pequenos (até 400px)                             */
/* =================================================================== */

@media only screen and (max-width: 400px) {
  .carousel-caption.d-none.d-md-block h1 {
    font-size: 1rem !important;
  }

  .card-text {
    font-size: 1rem !important; /* Ajuste final para o texto em telas bem pequenas */
  }
}