/* =========================
   Seção Combo
   ========================= */

/* Container principal da seção Combo com fundo e imagem */

.combo {

    background: var(--fundoB); /* Cor de fundo padrão */
    height: 400px; /* Altura da seção */
    background-image: url("../assets/icons/Banner-Pipoca.png"); 
    background-position: top; /* Alinha a imagem ao topo */
    background-repeat: no-repeat; 
    background-size: cover; /* Ajusta a imagem para cobrir toda a área */
    margin-top: 100px; 
}

/* Título principal da seção Combo */

.combo__titulo {

    width: 50%; /* Define a largura do título */
    font-family: var(--fonte-titulo); 
    font-size: 4.75rem; 
    line-height: 5.7rem; /* Espaçamento entre linhas */
    font-weight: 400; /* Peso da fonte */
    color: var(--letraA); 
}

/* Parte do título que recebe destaque */ 

.combo__titulo-destaque {

    color: var(--letraA); 
    font-size: 4.75rem; 
}

/* Container interno da seção para centralizar conteúdo */

.combo__container {

    max-width: 75rem; /* Largura máxima do container */
    margin: 0 auto; /* Centraliza horizontalmente */
    display: flex; 
    flex-direction: column; /* Empilha elementos verticalmente */
    justify-content: center; /* Centraliza verticalmente o conteúdo */
    height: 100%; /* Ocupa toda a altura da seção */
}

/* =========================
   Media Queries
   ========================= */

/* Telas até 1200px (tablets e notebooks menores) */

@media screen and (max-width: 1200px) {

    .combo__container {
        padding: 0 5rem; /* Adiciona padding lateral */
    }

    .combo__titulo, .combo__titulo-destaque {
        font-size: 3rem; /* Reduz tamanho do título */
        line-height: 2.5rem; /* Ajusta altura da linha */
    }
}

/* Telas até 730px (celulares) */
@media screen and (max-width: 730px) {
    
    .combo__container {
        padding: 0 1.5rem; /* Reduz padding lateral para caber na tela */
    }
}