/*==================================================
  SECTIONS — SISTEMA DE DISEÑO UNIFICADO
  QPERTINO Premium v2
==================================================*/

/*=====================================
SECCIÓN BASE — Corregido: fondo oscuro en lugar de var(--white)
=====================================*/

.section{
    padding:110px 0;
    /* Corregido: fondo oscuro base */
    background:var(--bg-section, #121318);
    position:relative;
}

.section.bg-light{
    background:var(--bg-section);
}

.section.bg-dark{
    background:var(--bg-dark);
}

.section.bg-dark h2,
.section.bg-dark h3{
    color:var(--heading);
}

.section.bg-dark p{
    color:var(--text-light);
}

/*=====================================
ENCABEZADO — Corregido: Forzado de centrado en párrafos internos
=====================================*/

.section-header{
    max-width:820px;
    margin:0 auto 75px;
    text-align:center;
}

.section-header.text-left{
    margin-left:0;
    text-align:left;
}

.section-header .section-tag,
span.section-tag{

    display:inline-block;

    color:var(--gold);

    font-size:.82rem;

    font-weight:700;

    letter-spacing:5px;

    text-transform:uppercase;

    margin-bottom:20px;
}

h2.section-title{

    font-family:"Cormorant Garamond",serif;

    font-size:clamp(2.4rem,3.8vw,3.3rem);

    color:var(--heading);

    line-height:1.15;

    margin-bottom:24px;
}

.section-header p.section-description{

    font-size:1.08rem;

    line-height:1.95;

    color:var(--text-light);

    margin:0 auto;

    max-width:720px;
}

.section-header.text-left p.section-description{

    margin-left:0;
}

/* Regla inyectada para heredar la simetría si hay párrafos nativos sueltos en el encabezado */
.section-header p {
    text-align: center;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 24px;
    color: var(--text-light);
    line-height: 1.95;
}

.section-header.text-left p {
    text-align: left;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.section-header p:last-of-type {
    margin-bottom: 0;
}

/*=====================================
GRIDS
=====================================*/

.cards-grid,
.benefits-grid,
.section .stats-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

    gap:34px;
}

/*=====================================
CARDS — Corregido: fondo oscuro en lugar de degradado blanco
=====================================*/

.benefit,
.section .stat-card{

    /* Corregido: fondo oscuro con sutil degradado */
    background:linear-gradient(
        180deg,
        var(--surface-light, #1A1C23),
        var(--surface, #121318)
    );

    border:1px solid rgba(200,168,107,.12);

    border-radius:18px;

    padding:46px 40px;

    transition:.35s ease;

    overflow:hidden;

    position:relative;
}

.benefit::before,
.section .stat-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:2px;

    background:linear-gradient(
        90deg,
        transparent,
        var(--gold),
        transparent
    );

    opacity:0;

    transition:.35s;
}

.benefit:hover,
.section .stat-card:hover{

    transform:translateY(-8px);

    border-color:rgba(212,175,55,.35);

    box-shadow:0 25px 60px rgba(0,0,0,.35);
}

.benefit:hover::before,
.section .stat-card:hover::before{

    opacity:1;
}

/*=====================================
ICONOS
=====================================*/

.benefit i,
.section .stat-card i{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:60px;

    height:60px;

    border-radius:16px;

    background:rgba(212,175,55,.10);

    color:var(--gold);

    font-size:1.4rem;

    margin-bottom:24px;
}

/*=====================================
TÍTULOS
=====================================*/

.benefit h3,
.section .stat-card h3{

    font-family:"Cormorant Garamond",serif;

    font-size:1.7rem;

    color:var(--heading);

    margin-bottom:16px;
}

/*=====================================
TEXTOS
=====================================*/

.benefit p,
.section .stat-card p{

    color:var(--text-light);

    font-size:1rem;

    line-height:1.9;

    margin:0;
}

/*=====================================
LISTAS
=====================================*/

.service-list{

    list-style:none;

    padding:0;

    margin:0;

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

    gap:18px 42px;
}

.service-list li{

    position:relative;

    padding:14px 0 14px 36px;

    /* Corregido: borde sutil oscuro */
    border-bottom:1px solid rgba(255,255,255,0.07);

    color:var(--text-light);

    line-height:1.8;
}

.service-list li::before{

    content:"\f00c";

    font-family:"Font Awesome 6 Free";

    font-weight:900;

    position:absolute;

    left:0;

    top:15px;

    color:var(--gold);

    font-size:.85rem;
}

/*=====================================
RESPONSIVE
=====================================*/

@media(max-width:992px){

.section{

    padding:90px 0;

}

}

@media(max-width:768px){

.section{

    padding:70px 0;

}

.section-header{

    margin-bottom:55px;

}

.benefit,
.section .stat-card{

    padding:36px 28px;

}

}

/* Contenedor utilitario extra de seguridad en caso de secciones editoriales limpias */
.editorial-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

.editorial-container p {
    text-align: center;
    font-size: 1.08rem;
    line-height: 2;
    color: var(--text-light);
    margin-bottom: 30px;
}

.editorial-container p:last-child {
    margin-bottom: 0;
}
