/**
 * Smiley Cursos Grid — Estilos base
 * Compatible con Blocksy + cualquier tema WordPress
 * Las variables CSS se heredan del tema si existen
 */

:root {
    --smiley-cg-primario:  var(--marca-primario, #2d6a4f);
    --smiley-cg-acento:    var(--marca-acento, #f4a261);
    --smiley-cg-radio:     12px;
    --smiley-cg-sombra:    0 4px 20px rgba(0,0,0,.09);
    --smiley-cg-gap:       1.5rem;
}

/* ── Grid ── */
.smiley-cursos-grid,
.paula-cursos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--smiley-cg-gap);
    padding: 0;
    margin: 0;
}

/* ── Card ── */
.paula-curso-card {
    position: relative;
    background: #fff;
    border-radius: var(--smiley-cg-radio);
    box-shadow: var(--smiley-cg-sombra);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease;
}
.paula-curso-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 32px rgba(0,0,0,.14);
}

/* ── Badge ── */
.paula-curso-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--smiley-cg-acento);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    z-index: 2;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* ── Imagen ── */
.paula-curso-card-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

/* ── Body ── */
.paula-curso-card-body {
    padding: 1.2rem 1.2rem 1rem;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: .6rem;
}

.paula-curso-card-titulo {
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    color: #1a1a1a;
}

.paula-curso-card-desc {
    font-size: .88rem;
    color: #555;
    line-height: 1.5;
    margin: 0;
}

/* ── Lista incluye ── */
.paula-curso-card-includes {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .25rem;
}
.paula-curso-card-includes li {
    font-size: .82rem;
    color: #444;
}

/* ── Footer precio + botón ── */
.paula-curso-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: .8rem;
    border-top: 1px solid #f0f0f0;
    gap: .5rem;
}

.paula-curso-precio {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--smiley-cg-primario);
}
.paula-curso-precio .woocommerce-Price-amount {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.paula-curso-precio-antes {
    font-size: .82rem;
    color: #999;
    text-decoration: line-through;
    margin-left: .3rem;
}

.paula-curso-comprar {
    display: inline-block;
    background: var(--smiley-cg-primario);
    color: #fff !important;
    text-decoration: none !important;
    font-size: .82rem;
    font-weight: 700;
    padding: .45rem .9rem;
    border-radius: 6px;
    transition: background .2s ease, transform .15s ease;
    white-space: nowrap;
}
.paula-curso-comprar:hover {
    background: var(--smiley-cg-acento);
    transform: scale(1.03);
}

/* ── Empty state ── */
.smiley-cg-empty {
    text-align: center;
    color: #888;
    padding: 2rem;
    grid-column: 1 / -1;
}

/* ── Responsive ── */
@media (max-width: 600px) {
    .smiley-cursos-grid,
    .paula-cursos-grid {
        grid-template-columns: 1fr;
    }
    .paula-curso-card-img {
        height: 180px;
    }
}

/* ============================================================
   PÁGINA DE VENTAS — DESCRIPCIÓN DE PRODUCTO
   Clase raíz: .reto-ventas
   Se carga automáticamente en single product pages.
   Reutilizable para cualquier curso — el HTML cambia,
   el CSS es siempre el mismo.
   ============================================================ */

.reto-ventas {
    --rv-verde:        var(--marca-primario,  #2d6a4f);
    --rv-verde-oscuro: var(--marca-oscuro,    #1b4332);
    --rv-verde-claro:  #d8f3dc;
    --rv-naranja:      var(--marca-acento,    #f4a261);
    --rv-naranja-dark: #e76f51;
    --rv-crema:        #fdf8f0;
    --rv-texto:        #1a1a1a;
    --rv-texto-suave:  #555;
    --rv-radio:        14px;
}

/* ── Secciones ── */
.reto-seccion { padding: 2.5rem 0; }

.reto-seccion-oscura {
    background: var(--rv-verde-oscuro);
    padding: 3rem 1.5rem;
    border-radius: var(--rv-radio);
    margin: 2rem 0;
}

.reto-seccion-crema {
    background: var(--rv-crema);
    padding: 2.5rem 1.5rem;
    border-radius: var(--rv-radio);
    margin: 2rem 0;
}

/* ── Labels y títulos ── */
.reto-label {
    display: inline-block;
    font-family: 'Poppins', sans-serif;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--rv-verde);
    margin-bottom: .5rem;
}
.reto-seccion-oscura .reto-label { color: var(--rv-naranja); }

.reto-h2 {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: clamp(1.3rem, 3vw, 1.85rem);
    color: var(--rv-verde-oscuro);
    line-height: 1.2;
    margin-bottom: 1.2rem;
}
.reto-seccion-oscura .reto-h2 { color: #fff; }

/* ── Historia ── */
.reto-historia p {
    font-size: 1rem;
    color: var(--rv-texto-suave);
    line-height: 1.8;
    margin-bottom: 1.1rem;
}
.reto-historia p strong { color: var(--rv-texto); font-weight: 500; }

.reto-cita {
    border-left: 4px solid var(--rv-naranja);
    padding: 1rem 1.4rem;
    margin: 1.8rem 0;
    background: #fff;
    border-radius: 0 var(--rv-radio) var(--rv-radio) 0;
}
.reto-cita p {
    font-family: 'Lora', Georgia, serif !important;
    font-style: italic !important;
    font-size: 1.05rem !important;
    color: var(--rv-verde-oscuro) !important;
    margin: 0 !important;
    line-height: 1.65 !important;
}

/* ── Incluye grid ── */
.reto-incluye-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem;
    margin-top: 1.4rem;
}
.reto-incluye-item {
    background: var(--rv-crema);
    border-radius: var(--rv-radio);
    padding: 1.1rem;
    display: flex;
    gap: .75rem;
    align-items: flex-start;
}
.reto-incluye-icono { font-size: 1.35rem; flex-shrink: 0; }
.reto-incluye-item h3 {
    font-family: 'Poppins', sans-serif;
    font-size: .88rem;
    font-weight: 700;
    color: var(--rv-verde-oscuro);
    margin: 0 0 .2rem !important;
    padding: 0 !important;
    border: none !important;
}
.reto-incluye-item p {
    font-size: .82rem;
    color: var(--rv-texto-suave);
    line-height: 1.5;
    margin: 0 !important;
}

/* ── Para quién es ── */
.reto-pq-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: .75rem;
    margin-top: 1.4rem;
}
.reto-pq-item {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    padding: .85rem 1rem;
    background: rgba(255,255,255,.08);
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
}
.reto-pq-check {
    width: 20px; height: 20px;
    background: var(--rv-naranja);
    border-radius: 50%;
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: .7rem;
    color: #fff;
    font-weight: 700;
    margin-top: .1rem;
}
.reto-pq-item p {
    font-size: .87rem;
    color: rgba(255,255,255,.85);
    line-height: 1.5;
    margin: 0 !important;
}

/* ── Testimonios ── */
.reto-testi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1rem;
    margin-top: 1.4rem;
}
.reto-testi-card {
    background: #fff;
    border-radius: var(--rv-radio);
    padding: 1.2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,.08);
    display: flex;
    flex-direction: column;
    gap: .65rem;
    border: 1.5px solid #f0f0f0;
}
.reto-estrellas { color: #f59e0b; font-size: .88rem; }
.reto-testi-texto {
    font-family: 'Lora', Georgia, serif;
    font-style: italic;
    font-size: .9rem;
    color: var(--rv-texto-suave);
    line-height: 1.65;
    flex: 1;
    margin: 0 !important;
}
.reto-testi-autor {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-top: .55rem;
    border-top: 1px solid #f0f0f0;
}
.reto-testi-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--rv-verde-claro);
    display: flex; align-items: center; justify-content: center;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: .78rem;
    color: var(--rv-verde);
    flex-shrink: 0;
}
.reto-testi-nombre {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: .84rem;
    color: var(--rv-texto);
    margin: 0 !important;
}
.reto-testi-badge {
    font-size: .68rem;
    color: var(--rv-verde);
    margin: 0 !important;
}

/* ── Garantía ── */
.reto-garantia {
    background: var(--rv-verde-claro);
    border-radius: 18px;
    padding: 2.2rem 1.5rem;
    text-align: center;
    margin: 2rem 0;
}
.reto-garantia-icono { font-size: 2.6rem; margin-bottom: .75rem; }
.reto-garantia h2 {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 800 !important;
    font-size: 1.25rem !important;
    color: var(--rv-verde-oscuro) !important;
    margin-bottom: .65rem !important;
    border: none !important;
    padding: 0 !important;
}
.reto-garantia p {
    font-size: .92rem !important;
    color: #2d6a4f !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}

/* ── Responsive ── */
@media (max-width: 600px) {
    .reto-incluye-grid,
    .reto-pq-grid,
    .reto-testi-grid { grid-template-columns: 1fr; }
    .reto-seccion-oscura,
    .reto-seccion-crema { padding: 2rem 1.1rem; }
}