/* ==========================================================================
   1. VARIÁVEIS E RESET GERAL
   ========================================================================== */
:root {
    --laranja: #FF6600;
    --azul-escuro: #002D4B;
    --cinza-texto: #4A5568;
    --cinza-claro: #f4f4f4;
    --branco: #ffffff;
    --preto: #000000;
    --verde-whats: #25D366;
    --verde-limao: #99FF00;
}

* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
}

body { 
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
    background-color: #ffffff; /* O padrão deve ser branco */
    color: #333;
    line-height: 1.6;
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; }

/* ==========================================================================
   2. COMPONENTES REUTILIZÁVEIS (Usa em todas as páginas)
   ========================================================================== */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.btn-whatsapp-geral {
    background-color: var(--verde-limao);
    color: #000;
    padding: 12px 25px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 800;
    display: inline-block;
    transition: 0.3s;
}

.btn-whatsapp-geral:hover {
    transform: scale(1.05);
}

/* ==========================================================================
   5. SOBRE NÓS
   ========================================================================== */
.container-sobre { max-width: 1100px; margin: 0 auto; position: relative; z-index: 2; padding: 0 20px; }
.secao-quem-somos { background: #000; padding: 100px 0; position: relative; overflow: hidden; }
.fundo-quem-somos { 
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
    background-size: cover; background-position: center; opacity: 0.6;
    mask-image: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 80%);
    -webkit-mask-image: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 80%);
}
.secao-quem-somos h1 { color: #fff; font-size: 3.5rem; font-weight: 800; margin-bottom: 40px; text-align: center; }
.texto-quem-somos p { color: #fff; font-size: 1.15rem; line-height: 1.8; margin-bottom: 25px; text-align: center; }

.secao-parceria { background: #000; padding: 60px 0; position: relative; }
.fundo-parceria { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; opacity: 0.3; filter: grayscale(1); }
.box-laranja { background: #FF6600; padding: 45px; border-radius: 20px; box-shadow: 0 15px 35px rgba(0,0,0,0.4); }
.box-laranja p { color: #fff; font-size: 1.4rem; font-weight: 700; text-align: center; line-height: 1.5; margin: 0; }

.secao-exercicios { background: #000; padding: 100px 0; position: relative; }
.fundo-exercicios { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; opacity: 0.4; filter: grayscale(1); }
.grid-exercicios { display: flex; align-items: center; gap: 50px; }
.col-titulo-exercicios h2 { color: #FF6600; font-size: 2.8rem; font-weight: 900; line-height: 1.1; text-align: right; }
.col-texto-exercicios p { color: #fff; font-size: 1.35rem; line-height: 1.6; }

.secao-politica { background: #000; padding: 100px 0; color: #fff; }
.grid-politica { display: flex; gap: 60px; align-items: flex-start; }
.info-politica { flex: 1.2; }
.info-politica h2 { font-size: 3.5rem; font-weight: 800; line-height: 1.1; margin-bottom: 30px; }
.intro-politica { font-size: 1.25rem; line-height: 1.6; margin-bottom: 40px; color: #ccc; }

.lista-compromissos { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 25px; }
.lista-compromissos li { display: flex; align-items: flex-start; gap: 15px; font-size: 1.2rem; font-weight: 700; }
.check-icon { width: 26px; height: 26px; background: #99FF00; border-radius: 50%; flex-shrink: 0; position: relative; }
.check-icon::after { content: '✓'; position: absolute; left: 6px; top: 1px; color: #000; font-size: 18px; }
.lista-compromissos small { display: block; font-size: 1rem; font-weight: 400; color: #aaa; margin-top: 5px; }

.fotos-politica { flex: 0.8; display: flex; flex-direction: column; gap: 20px; }
.fotos-politica img { width: 100%; border-radius: 35px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }

@media (max-width: 768px) {
    .grid-exercicios, .grid-politica { flex-direction: column; text-align: center; }
    .col-titulo-exercicios h2 { text-align: center; font-size: 2.2rem; }
    .info-politica h2 { font-size: 2.8rem; }
    .secao-quem-somos h1 { font-size: 2.5rem; }
}