/* ============================================
   Wazo — curso.css
   ============================================ */

.wazo-curso__hero { text-align: left; }
.wazo-curso__breadcrumb {
    display: flex;
    gap: var(--wazo-space-2);
    color: var(--wazo-color-text-muted);
    font-size: var(--wazo-font-size-sm);
    margin-bottom: var(--wazo-space-4);
}
.wazo-curso__breadcrumb a { color: inherit; }
.wazo-curso__breadcrumb a:hover { color: var(--wazo-color-text); }

.wazo-curso__title {
    font-size: clamp(2rem, 5vw, var(--wazo-fs-70));
    line-height: var(--wazo-lh-display);
    max-width: 20ch;
    overflow-wrap: break-word;
}
.wazo-curso__subtitle {
    margin-top: var(--wazo-space-4);
    color: var(--wazo-color-text-muted);
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-body);
    max-width: 60ch;
}

.wazo-curso__stats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--wazo-space-4);
    margin-top: var(--wazo-space-8);
    border-top: 1px solid var(--wazo-color-ui-border);
    padding-top: var(--wazo-space-6);
}
.wazo-curso__stat-num {
    display: block;
    font-size: clamp(1.75rem, 3vw, var(--wazo-fs-32));
    font-weight: var(--wazo-font-weight-medium);
    line-height: var(--wazo-lh-none);
}
.wazo-curso__stat-lbl {
    display: block;
    font-size: var(--wazo-font-size-xs);
    color: var(--wazo-color-text-muted);
    text-transform: uppercase;
    letter-spacing: -0.05em;
    margin-top: var(--wazo-sp-phone-xs);
}
@media (max-width: 1200px) {
    .wazo-curso__stats { grid-template-columns: repeat(2, 1fr); }
}

.wazo-curso__ctas {
    display: flex;
    gap: var(--wazo-space-3);
    flex-wrap: wrap;
    margin-top: var(--wazo-space-6);
}

/* === Precio + ficha === */
.wazo-curso__pi-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--wazo-space-8);
    align-items: start;
}
@media (max-width: 1200px) {
    .wazo-curso__pi-grid { grid-template-columns: 1fr; }
}
.wazo-curso__pi-media img { width: 100%; border-radius: var(--wazo-radius-lg); }
.wazo-curso__pi-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--wazo-radius-lg); overflow: hidden; }
.wazo-curso__pi-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.wazo-curso__pi-caption { margin-top: var(--wazo-space-3); color: var(--wazo-color-text-muted); font-size: var(--wazo-font-size-sm); }

.wazo-curso__pi-side {
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-lg);
    padding: var(--wazo-space-6);
}
.wazo-curso__pi-price {
    display: flex;
    flex-direction: column;
    gap: var(--wazo-space-1);
    padding-bottom: var(--wazo-space-5);
    border-bottom: 1px solid var(--wazo-color-ui-border);
}
.wazo-curso__pi-price-amount {
    font-size: var(--wazo-fs-32);
    line-height: var(--wazo-lh-none);
}
.wazo-curso__pi-price-desc {
    color: var(--wazo-color-text-muted);
    font-size: var(--wazo-font-size-sm);
}
.wazo-curso__pi-finan {
    margin-block: var(--wazo-space-4);
    color: var(--wazo-color-accent);
    font-size: var(--wazo-font-size-sm);
}
.wazo-curso__pi-list {
    display: flex;
    flex-direction: column;
    gap: var(--wazo-space-3);
    border-top: 1px solid var(--wazo-color-ui-border);
    padding-top: var(--wazo-space-4);
}
.wazo-curso__pi-list li {
    display: grid;
    grid-template-columns: 18px auto 1fr;
    align-items: baseline;
    gap: var(--wazo-space-2);
    font-size: var(--wazo-font-size-sm);
}
.wazo-curso__pi-list-check {
    color: var(--wazo-color-accent);
    font-weight: var(--wazo-font-weight-medium);
}
.wazo-curso__pi-list-label {
    color: var(--wazo-color-text-muted);
    text-transform: uppercase;
    font-size: var(--wazo-font-size-xs);
    letter-spacing: -0.05em;
}
.wazo-curso__pi-list-value {
    color: var(--wazo-color-text);
    text-align: right;
}

/* === Contexto === */
.wazo-curso__contexto-title { font-size: clamp(32px, 4.2vw, var(--wazo-fs-60)); max-width: 30ch; }
.wazo-curso__contexto-desc { color: var(--wazo-color-text-muted); margin-top: var(--wazo-space-4); max-width: 70ch; font-size: var(--wazo-fs-16); line-height: var(--wazo-lh-body); }
.wazo-curso__contexto-features {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--wazo-space-3);
    margin-top: var(--wazo-space-6);
}
.wazo-curso__contexto-features li {
    padding: var(--wazo-space-4);
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-md);
    color: var(--wazo-color-text);
}

/* === Especialización === */
.wazo-curso__especializacion h2 { font-size: clamp(32px, 4.2vw, var(--wazo-fs-60)); max-width: 30ch; }
.wazo-curso__especializacion-desc { color: var(--wazo-color-text-muted); margin-top: var(--wazo-space-4); max-width: 70ch; line-height: var(--wazo-lh-body); }
.wazo-curso__especializacion-obj {
    margin-top: var(--wazo-space-6);
    padding: var(--wazo-space-6);
    background: var(--wazo-color-surface);
    border-radius: var(--wazo-radius-lg);
}
.wazo-curso__especializacion-obj h3 { margin-bottom: var(--wazo-space-3); }

/* === Áreas + enfoque === */
.wazo-curso__areas-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--wazo-space-8);
}
@media (max-width: 1200px) { .wazo-curso__areas-grid { grid-template-columns: 1fr; } }
.wazo-curso__areas-title { font-size: var(--wazo-fs-32); margin-bottom: var(--wazo-space-4); max-width: 24ch; }
.wazo-curso__chips-wrap { display: flex; flex-wrap: wrap; gap: var(--wazo-space-2); }

/* === IAF (Incluye/Aprende/Funciona) === */
.wazo-curso__iaf-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--wazo-space-6);
}
@media (max-width: 1200px) { .wazo-curso__iaf-grid { grid-template-columns: 1fr; } }
.wazo-curso__iaf-col {
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-lg);
    padding: var(--wazo-space-6);
}
.wazo-curso__iaf-title {
    font-size: var(--wazo-fs-16);
    margin-bottom: var(--wazo-space-4);
    padding-bottom: var(--wazo-space-3);
    border-bottom: 1px solid var(--wazo-color-ui-border);
}
.wazo-curso__iaf-list { display: flex; flex-direction: column; gap: var(--wazo-space-3); }
.wazo-curso__iaf-list li { display: flex; gap: var(--wazo-space-3); color: var(--wazo-color-text-muted); font-size: var(--wazo-font-size-sm); line-height: var(--wazo-lh-body); }
.wazo-curso__iaf-check { color: var(--wazo-color-accent); flex-shrink: 0; }
.wazo-curso__iaf-num { color: var(--wazo-color-accent); font-weight: var(--wazo-font-weight-medium); flex-shrink: 0; font-variant-numeric: tabular-nums; }

/* === Programa === */
.wazo-curso__programa-title { font-size: clamp(32px, 4.2vw, var(--wazo-fs-60)); margin-bottom: var(--wazo-space-6); }
.wazo-curso__programa-list { display: flex; flex-direction: column; gap: var(--wazo-space-4); }
.wazo-curso__modulo {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: var(--wazo-space-4);
    padding: var(--wazo-space-5);
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-md);
}
.wazo-curso__modulo-num { font-size: var(--wazo-fs-32); color: var(--wazo-color-accent); font-variant-numeric: tabular-nums; }
.wazo-curso__modulo-title { font-size: var(--wazo-fs-16); margin-bottom: var(--wazo-space-2); }
.wazo-curso__modulo-desc { color: var(--wazo-color-text-muted); }

/* === Certificación === */
.wazo-curso__cert-inner {
    padding: var(--wazo-space-8);
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-lg);
}
.wazo-curso__cert-title { font-size: clamp(32px, 4.2vw, var(--wazo-fs-60)); margin-bottom: var(--wazo-space-3); }
.wazo-curso__cert-desc { color: var(--wazo-color-text-muted); max-width: 70ch; margin-bottom: var(--wazo-space-6); }
.wazo-curso__cert-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--wazo-space-5);
}
.wazo-curso__cert-row dt {
    font-size: var(--wazo-font-size-xs);
    text-transform: uppercase;
    letter-spacing: -0.05em;
    color: var(--wazo-color-text-muted);
}
.wazo-curso__cert-row dd { margin-top: var(--wazo-sp-phone-xs); font-weight: var(--wazo-font-weight-medium); }

/* === Financiación === */
.wazo-curso__finan-card {
    padding: var(--wazo-sp-section-block);
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-lg);
}
.wazo-curso__finan-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
    max-width: 720px;
}
.wazo-curso__finan-eyebrow {
    font-size: var(--wazo-fs-14);
    font-weight: var(--wazo-font-weight-regular);
    color: var(--wazo-color-text-soft);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-tight);
    margin: 0;
}
.wazo-curso__finan-title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: clamp(32px, 4.2vw, var(--wazo-fs-60));
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
    max-width: 20ch;
}
.wazo-curso__finan-desc {
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-body);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text-soft);
    margin: 0;
    max-width: 56ch;
}

/* Fila CTA + partner badge */
.wazo-curso__finan-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wazo-sp-phone-md);
    margin-top: var(--wazo-sp-phone-xs);
}
.wazo-curso__finan-cta {
    flex: 0 0 auto;
}

/* Badge del partner · pill blanco con logo Klarna verde para asegurar
   contraste sobre el fondo oscuro de la web. */
.wazo-curso__finan-partner {
    display: inline-flex;
    align-items: center;
    gap: var(--wazo-sp-phone-xs);
}
.wazo-curso__finan-partner-prefix {
    font-size: var(--wazo-fs-14);
    color: var(--wazo-color-text-sub);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-none);
}
.wazo-curso__finan-partner-logo {
    display: block;
    width: auto;
    height: 22px;
    max-width: 100%;
    padding: var(--wazo-sp-phone-xs) var(--wazo-sp-phone-sm);
    background: #fff;
    border-radius: var(--wazo-radius-full);
    box-sizing: content-box;
}

/* Disclaimer legal pequeño */
.wazo-curso__finan-disclaimer {
    font-size: var(--wazo-fs-12);
    line-height: var(--wazo-lh-body);
    color: var(--wazo-color-text-sub);
    margin: var(--wazo-sp-phone-sm) 0 0;
    max-width: 70ch;
}

/* Responsive · ≤639px · stack CTA + partner en columnas */
@media (max-width: 639px) {
    .wazo-curso__finan-card {
        padding: var(--wazo-sp-phone-lg) var(--wazo-sp-phone-md);
        border-radius: var(--wazo-radius-md);
    }
    .wazo-curso__finan-actions {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--wazo-sp-phone-sm);
    }
    .wazo-curso__finan-cta { width: 100%; text-align: center; justify-content: center; }
    .wazo-curso__finan-disclaimer { font-size: var(--wazo-fs-12); }
}

/* === Simulador relacionado === */
.wazo-curso__sim-rel-card {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: var(--wazo-space-6);
    align-items: center;
    padding: var(--wazo-space-6);
    background: var(--wazo-color-surface);
    border: 1px solid var(--wazo-color-ui-border);
    border-radius: var(--wazo-radius-lg);
    transition: background var(--wazo-transition-fast);
}
.wazo-curso__sim-rel-card:hover { background: var(--wazo-color-surface-2); }
.wazo-curso__sim-rel-img { width: 100%; height: 200px; object-fit: cover; border-radius: var(--wazo-radius-md); }
.wazo-curso__sim-rel-title { font-size: clamp(32px, 4.2vw, var(--wazo-fs-60)); margin-block: var(--wazo-space-2); }
.wazo-curso__sim-rel-body { display: flex; flex-direction: column; gap: var(--wazo-space-2); align-items: flex-start; }
.wazo-curso__sim-rel-body p { color: var(--wazo-color-text-muted); }
@media (max-width: 1200px) {
    .wazo-curso__sim-rel-card { grid-template-columns: 1fr; }
}
