/* =========================================
   EDITORIAL: GAMMA BRASIL 2025 (ATHLETE FIRST)
   ========================================= */

:root {
    --sp-cyan: #00E5FF;
    --gamma-gold: #FFD700;
    --gamma-silver: #C0C0C0;
    --gamma-bronze: #CD7F32;
    --brazil-green: #009c3b;
}

body { background: #050505; color: white; font-family: 'regular', sans-serif; }

/* 1. HERO EMOTIVO */
.gamma-hero {
    position: relative; height: 80vh; width: 100%;
    display: flex; align-items: flex-end; /* Texto abajo */
    padding-bottom: 80px;
    background: #000;
}
.gamma-bg {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; opacity: 0.6; 
    mask-image: linear-gradient(to bottom, black 50%, transparent 100%); /* Difuminado abajo */
}
.gamma-hero-content { 
    position: relative; z-index: 2; padding: 0 5%; max-width: 1200px; margin: 0 auto; width: 100%;
}
.gh-tag {
    background: linear-gradient(90deg, #FFD100, #0033A0, #EF3340); /* Tricolor */
    color: white; padding: 5px 15px; text-transform: uppercase; 
    font-family: 'bold'; font-size: 0.8rem; letter-spacing: 2px;
    display: inline-block; margin-bottom: 20px;
}
.gh-title {
    font-size: clamp(3.5rem, 6vw, 6rem); line-height: 0.9; text-transform: uppercase;
    font-family: 'medium'; margin-bottom: 20px;
}

/* 2. LA CRÓNICA (TEXTO EDITORIAL) */
.chronicle-sec { padding: 80px 0; max-width: 800px; margin: 0 auto; }
.chronicle-text {
    font-size: 1.2rem; line-height: 1.8; color: #ccc; margin-bottom: 30px;
    font-family: 'light'; border-left: 2px solid var(--sp-cyan); padding-left: 30px;
}
.stat-row {
    display: flex; gap: 40px; margin-top: 50px; border-top: 1px solid #333; padding-top: 30px;
}
.stat-item strong { font-size: 3rem; color: white; display: block; line-height: 1; }
.stat-item span { text-transform: uppercase; color: #666; font-size: 0.8rem; letter-spacing: 1px; }

/* 3. LOS PROTAGONISTAS (GRID DE ATLETAS) */
.heroes-sec { padding: 50px 0 100px 0; background: #080808; }
.heroes-title {
    text-align: center; font-size: 2.5rem; text-transform: uppercase; 
    margin-bottom: 60px; letter-spacing: 2px;
}

.heroes-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px; padding: 0 5%; max-width: 1300px; margin: 0 auto;
}

.hero-card {
    position: relative; height: 500px; overflow: hidden;
    background: #000; border: 1px solid #222; transition: 0.3s;
}
.hero-card:hover { transform: translateY(-10px); border-color: var(--sp-cyan); }

.hc-img {
    width: 100%; height: 100%; object-fit: cover;
    filter: grayscale(100%); transition: 0.5s;
}
.hero-card:hover .hc-img { filter: grayscale(0%); transform: scale(1.05); }

.hc-overlay {
    position: absolute; bottom: 0; left: 0; width: 100%;
    background: linear-gradient(to top, #000 0%, transparent 100%);
    padding: 30px;
}
.hc-medal {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 5px 15px; border-radius: 20px; 
    font-size: 0.8rem; text-transform: uppercase; font-family: 'medium';
    margin-bottom: 10px; color: black;
}
/* Colores de Medallas */
.medal-silver { background: var(--gamma-silver); box-shadow: 0 0 15px rgba(192,192,192,0.4); }
.medal-bronze { background: var(--gamma-bronze); box-shadow: 0 0 15px rgba(205,127,50,0.4); }
.medal-gold { background: var(--gamma-gold); box-shadow: 0 0 15px rgba(255,215,0,0.4); }

.hc-name { font-size: 2rem; margin: 0; text-transform: uppercase; line-height: 1; }
.hc-cat { color: var(--sp-cyan); font-size: 0.9rem; margin-top: 5px; text-transform: uppercase; }

/* 4. EL LEGADO DE SKETCH (AL FINAL) */
.brand-tribute {
    padding: 80px 0; border-top: 1px solid #222; background: #000; text-align: center;
}
.bt-content { max-width: 700px; margin: 0 auto; }
.bt-logo-row {
    display: flex; justify-content: center; align-items: center; gap: 30px; 
    margin-bottom: 30px; opacity: 0.5;
}