/* Estilo para os Botões de Chamada para Ação (Call to Action) */
.cta-button {
    /* Layout e Espaçamento */
    display: inline-flex; /* Permite que o ícone e o texto fiquem na mesma linha e se comportem como um bloco */
    align-items: center;  /* Alinha verticalmente o ícone e o texto */
    justify-content: center; /* Centraliza o conteúdo horizontalmente */
    gap: 10px; /* Cria um espaço de 10px entre o ícone e o texto */
    padding: 12px 24px; /* Espaçamento interno: 12px em cima/baixo, 24px nos lados */

    /* Aparência */
    background-color: #2D3E50; /* Um azul escuro profissional, similar ao do logo */
    color: #FFFFFF; /* Cor do texto e do ícone (graças ao 'currentColor' no SVG) */
    border: none;
    border-radius: 50px; /* Cantos bem arredondados para um visual amigável (pill-shape) */

    /* Tipografia */
    font-family: Arial, sans-serif; /* Use a fonte principal do seu site */
    font-size: 16px;
    font-weight: bold;
    text-decoration: none; /* Remove o sublinhado padrão dos links */
    text-align: center;

    /* Efeitos de Interação */
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Sombra sutil para dar profundidade */
    transition: all 0.3s ease; /* Transição suave para todas as propriedades */
}

/* Efeito ao passar o mouse por cima */
.cta-button:hover {
    background-color: #3B5064; /* Um tom de azul um pouco mais claro */
    transform: translateY(-3px); /* Efeito de "elevação" */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25); /* Sombra mais pronunciada */
}

/* Efeito ao clicar no botão */
.cta-button:active {
    transform: translateY(0); /* Retorna à posição original, simulando um "pressionar" */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Retorna à sombra original */
}

/* Classe para controlar o tamanho do ícone SVG dentro do botão */
.cta-button .cta-icon {
    width: 24px;
    height: 24px;
}
/*
 * Full Screen Loader Overlay
 * --------------------------------------------------
 */
.full-screen-loader-overlay {
    /* 1. Posicionamento */
    position: fixed; /* Fica fixo na tela, mesmo com scroll */
    top: 0;
    left: 0;
    width: 100%;     /* Ocupa toda a largura */
    height: 100%;    /* Ocupa toda a altura */

    /* 2. Empilhamento e Centralização */
    z-index: 9999; /* Um valor muito alto para garantir que fique por cima de tudo */
    display: flex; /* Usa Flexbox para centralizar o conteúdo (o spinner) */
    justify-content: center;
    align-items: center;

    /* 3. Estilo Visual */
    background-color: rgba(0, 0, 0, 0.6); /* Fundo preto semi-transparente */

    /* 4. Transição Suave (Opcional, mas elegante) */
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

/* Estilo para quando o loader está sendo escondido */
.full-screen-loader-overlay.is-hiding {
    opacity: 0;
}

/* Aumenta o tamanho do spinner para melhor visibilidade em tela cheia */
.full-screen-loader-overlay .spinner-border {
    width: 3rem;  /* 48px */
    height: 3rem; /* 48px */
    border-width: 0.3em;
}