/* ====================================================
   ARQUIVO: hist-sambo.css 
   FOCO: DCU (Design Centrado no Usuário) e Legibilidade
   ==================================================== */

/* --- 1. TIPOGRAFIA BASE E HERO SECTION --- */
.conteudo-texto p {
    color: #4a4a4a !important; /* Cinza escuro amigável aos olhos */
    font-size: 1.1rem; /* Tamanho profissional para leitura (aprox. 17px) */
    line-height: 1.8; /* Respiro entre as linhas */
    margin-bottom: 20px;
    text-align: justify;
}

.historia-hero-section { width: 100%; margin-bottom: 50px; }
.historia-hero-container {
    display: flex; flex-wrap: wrap; background-color: #002776;
    border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}
.historia-hero-container .left-box { flex: 1; padding: 50px; color: #fff; min-width: 300px; }
.historia-hero-container .left-box h1 { color: #ffdf00; font-weight: 700; margin-bottom: 20px; font-size: 2.5rem; }

/* Blindagem do texto de introdução para não ficar pequeno */
.hero-texto { font-size: 1.15rem !important; line-height: 1.7; color: #ffffff !important; opacity: 0.95; }
.hero-texto strong { color: #ffdf00; }

.historia-hero-container .right-box {
    flex: 1; min-width: 300px; min-height: 350px;
    background: url('../img/cover_hist_sambo.jpg') no-repeat center center / cover;
}

/* --- 2. CARDS E INTERAÇÕES (VERSÕES DO SAMBO) --- */
.section-subtitle { font-size: 1.2rem; color: #565657; font-weight: 500; }
.card-hover { transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer; }
.card-hover:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.1) !important; }

/* --- 3. LINHA DO TEMPO (TIMELINE) --- */
.container_tl { max-width: 1100px; margin: 0 auto; padding: 20px 15px; font-family: 'Montserrat', sans-serif; }
.container_tl > h2 { color: #002776; font-weight: 700; font-size: 2.2rem; }
.row_tl { display: grid; grid-template-columns: 1fr 4px 1fr; grid-column-gap: 40px; margin-bottom: 0; }
.date_tl { grid-area: theDate; align-self: center; }
.line_tl { position: relative; background-color: #D9E4F2; grid-area: theLine; }
.content_tl {
    padding: 30px; background-color: #F9F9F9; border-radius: 12px; grid-area: theContent;
    margin-bottom: 40px; box-shadow: 0 4px 10px rgba(0,0,0,0.03); border: 1px solid #eaeaea;
}
.line_tl span {
    position: absolute; width: 24px; height: 24px; background-color: #fff;
    border: 4px solid #002776; border-radius: 50%; top: 0; left: 50%; transform: translateX(-50%); transition: all 0.3s;
}
.row_tl:nth-child(odd) { grid-template-areas: 'theDate theLine theContent'; }
.row_tl:nth-child(even) { grid-template-areas: 'theContent theLine theDate'; }
.row_tl:nth-child(odd) .date_tl { text-align: right; }
.date_tl span {
    display: inline-block; padding: 8px 24px; font-weight: 700; background: #002776;
    border-radius: 30px; color: #fff; position: relative; top: -10px; box-shadow: 0 4px 10px rgba(0,39,118,0.2);
}
.row_tl:hover .line_tl span { background-color: #009c3b; border-color: #009c3b; transform: translateX(-50%) scale(1.3); }
.content_tl h3 { font-weight: 700; font-size: 1.3rem; color: #002776; margin-bottom: 10px; }
.content_tl p { color: #565657; line-height: 1.7; margin: 0; font-size: 1.05rem; }
.row_tl.last_tl .line_tl { background-color: transparent; }

/* --- 4. ATLETAS FAMOSOS (ACESSibilidade Ouro) --- */
.atleta-card {
    border-radius: 12px !important;
    overflow: hidden;
}

.atleta-nome { font-size: 1.8rem; font-weight: 700; margin-bottom: 15px; }
.atleta-desc { font-size: 1.1rem !important; line-height: 1.8 !important; margin-bottom: 0; }

/* Variação 1: Fundo Claro (Texto escuro para contraste) */
.atleta-light-bg { background-color: #ffffff; border: 2px solid #e7eaf3; }
.atleta-light-bg .atleta-nome { color: #002776; }
.atleta-light-bg .atleta-desc { color: #4a4a4a !important; }

/* Variação 2: Fundo Escuro (Texto branco para contraste) */
.atleta-dark-bg { background-color: #002776; }
.atleta-dark-bg .atleta-nome { color: #ffdf00; }
.atleta-dark-bg .atleta-desc { color: #ffffff !important; opacity: 0.95; }

/* Variação 3: Fundo Verde CBSA */
.atleta-green-bg { background-color: #009c3b; }
.atleta-green-bg .atleta-nome { color: #ffdf00; }
.atleta-green-bg .atleta-desc { color: #ffffff !important; opacity: 0.95; }

/* --- 5. RESPONSIVIDADE MOBILE --- */
@media(max-width: 768px) {
    .row_tl { grid-template-columns: 4px 1fr; grid-column-gap: 20px; }
    .row_tl:nth-child(odd), .row_tl:nth-child(even) { grid-template-areas: 'theLine theDate' 'theLine theContent'; }
    .row_tl:nth-child(odd) .date_tl { text-align: left; }
    .date_tl span { top: 10px; }
    .content_tl { margin-top: 20px; }
    .historia-hero-container .right-box { min-height: 200px; }
    .conteudo-texto p { text-align: left; }
}