/* Reset universal styles - aplica estilos globais a todos os elementos */
*{
    font-family: Arial, Helvetica, sans-serif; 
    /* Define a família de fontes, com Arial como prioridade e fallbacks para compatibilidade */
    font-size: 16px;
    /* Define o tamanho padrão da fonte em 16 pixels */
}
/* Body background - define o fundo da página */
body{
    background-color: rgb(66, 4, 124); 
    /* Cor de fundo lilás clara para o corpo da página */
    display: flex; 
    /* Usa flexbox para layout */
    justify-content: center; 
    /* Centraliza horizontalmente */
    align-items: center; 
    /* Centraliza verticalmente */
    min-height: 100vh; 
    /* Altura mínima da viewport para ocupar toda a tela */
}
/* Main container styles - estilos para o elemento principal */
 main{
    background-color: white;           
    /* Fundo branco para o container principal */
    width: 500px;                        
    /* Largura fixa de 500 pixels */
    padding: 10px; 
    /* Espaçamento interno de 10 pixels em todos os lados */
    box-shadow: 3px 3px 5px rgb(140, 123, 123); 
    /* Sombra sutil com deslocamento horizontal/vertical de 3px, blur de 5px e cor cinza */
 }

 iframe{
    width: 100%; 
    /* Faz o iframe ocupar 100% da largura do container */
    max-width: 560px; 
    /* Limita a largura máxima ao tamanho original */
    aspect-ratio: 16 / 9; 
    /* Mantém a proporção 16:9 do vídeo */
    display: block; 
    /* Bloco para evitar espaços extras */
    margin: 20px auto; 
    /* Margem vertical para separar do conteúdo e centraliza horizontalmente */
 }

 p{
    font-family: Georgia, serif;
    /* Muda a fonte para Georgia com fallback para serif */
    font-size: 14px;
    /* Reduz o tamanho da fonte */
    text-align: justify;
    /* Alinha o texto justificado */
    line-height: 1.6;
    /* Aumenta o espaçamento entre linhas para melhor legibilidade */
 }

 img.lado{
    float: right; 
    /* Faz a imagem flutuar à direita, permitindo que o texto envolva ao redor dela */
    margin: 0 0 20px 30px;
    /* Margem: superior, direita, inferior, esquerda - cria espaço generoso ao redor */
 }
 