/*
 * =============================================================
 * E-FISCAL SALES SITE — Componente: Hero Section (Estático / Intro)
 * Componentes: assets/css/components/hero.css
 * Referencia: .clinerules › css-structure-enforcement
 * =============================================================
 */

.hero {
    padding: 160px 2rem 100px;
    text-align: center;
    background:
        radial-gradient(ellipse at 70% 0%, rgba(79, 70, 229, .12) 0%, transparent 60%),
        radial-gradient(ellipse at 20% 80%, rgba(37, 99, 235, .10) 0%, transparent 60%),
        var(--color-bg);
}

.hero__badge {
    display: inline-block;
    background: rgba(37, 99, 235, .08);
    color: var(--color-primary-dark);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: .4rem 1.2rem;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(37, 99, 235, .20);
    margin-bottom: 1.5rem;
}

.hero__title {
    margin-bottom: var(--space-md);
}

.hero__title span {
    background: linear-gradient(135deg, var(--color-primary), var(--color-indigo));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero__subtitle {
    font-size: 1.2rem;
    color: var(--color-text-muted);
    max-width: 680px;
    margin: 0 auto var(--space-lg);
}

/* CTA group centrado en hero */
.hero .btn-group {
    justify-content: center;
}

/* Barra de estadisticas bajo el hero */
.hero__stats {
    display: flex;
    justify-content: center;
    gap: 4rem;
    flex-wrap: wrap;
    margin-top: var(--space-xl);
    padding-top: var(--space-lg);
    border-top: 1px solid var(--color-border);
}

.hero__stat-num {
    font-size: 2.2rem;
    font-weight: 900;
    color: var(--color-text-heading);
    letter-spacing: -1px;
}

.hero__stat-label {
    font-size: .82rem;
    color: var(--color-text-muted);
    margin-top: .2rem;
}

/* Responsive - ajustes de pagina */
@media (max-width: 768px) {
    .hero__stats { gap: 2rem; }
    .hero { padding: 130px 1.25rem 80px; }
}