/* ============================================================
   CTAs de sidebar (articulo/curso) — estatuto: placas con borde
   tinta y sombra sólida. Mismos selectores que usa sidebar-cta.php
   ============================================================ */

.sidebar-cta {
    background: var(--blanco);
    border: var(--border-ink);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-solid-pale);
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

.sidebar-cta--curso-diy {
    box-shadow: var(--shadow-solid-sol);
}

.sidebar-cta--curso-b2b {
    background: var(--ink);
    box-shadow: var(--shadow-solid-verde);
}

.sidebar-cta--curso-b2b .sidebar-cta__title { color: var(--paper); }

.sidebar-cta--curso-b2b .sidebar-cta__text { color: var(--paper-70); }

.sidebar-cta--calculadora {
    background: var(--verde-pale);
}

.sidebar-cta--newsletter {
    background: var(--sol-pale);
}

.sidebar-cta__title {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    font-weight: var(--fw-bold);
    color: var(--ink);
    margin: 0 0 var(--space-2);
}

.sidebar-cta__text {
    font-size: var(--text-sm);
    color: var(--ink-soft);
    margin-bottom: var(--space-4);
    line-height: 1.6;
}

.sidebar-cta__button {
    display: inline-block;
    padding: var(--space-3) var(--space-5);
    background: var(--ink);
    color: var(--paper);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    border-radius: var(--radius-pill);
    text-decoration: none;
    transition: background var(--transition-fast);
}

.sidebar-cta__button:hover {
    background: var(--sol-deep);
    color: var(--paper);
    text-decoration: none;
}

.sidebar-cta--curso-b2b .sidebar-cta__button {
    background: var(--sol);
    color: var(--ink);
}

.sidebar-cta--curso-b2b .sidebar-cta__button:hover {
    background: var(--sol-deep);
    color: var(--paper);
}

@media (max-width: 900px) {
    .sidebar-cta__button {
        display: block;
        width: 100%;
        text-align: center;
        padding: var(--space-3) var(--space-4);
    }
}