/* --- Стили для главной страницы Qronika --- */
.hero { 
    text-align: center; 
    margin-bottom: 3rem; 
    padding: 3rem 0; 
}
.hero h1 { 
    font-size: 2.5rem; 
    margin-bottom: 1rem; 
    color: var(--text-color); 
}
.hero h1 span {
    color: var(--accent-color);
}
.hero p { 
    font-size: 1.1rem; 
    color: var(--subtle-text-color); 
    max-width: 600px; 
    margin: 0 auto; 
}

.chronicle-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
    gap: 2rem; 
}
.chronicle-card {
    background-color: var(--card-bg-color);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 2rem;
    transition: transform var(--transition-speed), box-shadow var(--transition-speed), border-color var(--transition-speed);
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
}
.chronicle-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border-color: var(--accent-color);
    opacity: 1; /* Перебиваем дефолтный a:hover из твоего шаблона */
}
[data-theme="dark"] .chronicle-card:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.card-icon { 
    font-size: 2.5rem; 
    margin-bottom: 1rem; 
}
.card-title { 
    font-size: 1.3rem; 
    margin-bottom: 0.5rem; 
    color: var(--text-color); 
    font-weight: 700;
}
.card-desc { 
    color: var(--subtle-text-color); 
    font-size: 0.95rem; 
    margin-bottom: 1.5rem; 
    flex-grow: 1; 
}
.card-link-text { 
    font-weight: 600; 
    color: var(--accent-color); 
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

  
    .hero { 
        text-align: center; 
        margin-bottom: 3rem; 
        padding: 4rem 0 2rem; 
    }
    .hero h1 { 
        font-size: 3rem; 
        margin-bottom: 1.5rem; 
        color: var(--text-color); 
        line-height: 1.2;
    }
    .hero h1 span { color: var(--accent-color); }
    .hero-lead { 
        font-size: 1.25rem; 
        color: var(--subtle-text-color); 
        max-width: 700px; 
        margin: 0 auto 2rem auto; 
    }
    
    /* Блок статистики */
    .stats-overview {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 1.5rem;
        margin-bottom: 4rem;
    }
    .stat-box {
        background-color: var(--card-bg-color);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        padding: 1.5rem;
        text-align: center;
        transition: transform var(--transition-speed);
    }
    .stat-box:hover { transform: translateY(-5px); border-color: var(--accent-color); }
    .stat-number {
        font-size: 2.5rem;
        font-weight: 800;
        color: var(--text-color);
        margin-bottom: 0.5rem;
        font-family: monospace;
    }
    .stat-label {
        font-size: 0.95rem;
        color: var(--subtle-text-color);
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    /* Блок Эпох */
    .epochs-section {
        background-color: var(--card-bg-color);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        padding: 3rem 2rem;
        margin-bottom: 4rem;
    }
    .section-title {
        font-size: 2rem;
        margin-bottom: 2rem;
        text-align: center;
    }
    .epoch-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 2rem;
    }
    .epoch-item { border-left: 3px solid var(--accent-color); padding-left: 1.5rem; }
    .epoch-years { font-weight: 800; color: var(--accent-color); font-size: 1.2rem; margin-bottom: 0.5rem; display: block;}
    .epoch-title { font-size: 1.3rem; font-weight: 700; margin-bottom: 0.5rem; color: var(--text-color); }
    .epoch-desc { font-size: 0.95rem; color: var(--subtle-text-color); }

    /* Сетка статей */
    .chronicle-grid { 
        display: grid; 
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
        gap: 2rem; 
        margin-bottom: 4rem;
    }
    .chronicle-card {
        background-color: var(--card-bg-color);
        border: 1px solid var(--border-color);
        border-radius: 12px;
        padding: 2rem;
        transition: transform var(--transition-speed), box-shadow var(--transition-speed), border-color var(--transition-speed);
        display: flex;
        flex-direction: column;
        color: inherit;
    }
    .chronicle-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,0.05);
        border-color: var(--accent-color);
        opacity: 1;
    }
    [data-theme="dark"] .chronicle-card:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.4); }
    .card-icon { font-size: 2.5rem; margin-bottom: 1rem; }
    .card-title { font-size: 1.4rem; margin-bottom: 0.5rem; color: var(--text-color); font-weight: 700; }
    .card-desc { color: var(--subtle-text-color); font-size: 1rem; margin-bottom: 1.5rem; flex-grow: 1; }
    .card-link-text { font-weight: 600; color: var(--accent-color); display: flex; align-items: center; gap: 0.5rem; }