/* ════════════════════════════════════════════════════════════
   Bloque · calc-launch (CTA negro a la calculadora)
   ────────────────────────────────────────────────────────────
   MOBILE-FIRST. El grid de features usa auto-fit, ya es responsive.
   ════════════════════════════════════════════════════════════ */

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

.dtfm-calc-launch {
    background: linear-gradient(135deg, var(--black) 0%, var(--gray-900) 100%);
    color: var(--white);
    border-radius: var(--r-xl);
    padding: var(--sp-5) var(--sp-4);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.dtfm-calc-launch::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(230,13,130,0.20) 0%, transparent 60%),
        radial-gradient(ellipse at 50% 100%, rgba(153,204,0,0.14) 0%, transparent 50%);
    pointer-events: none;
}

.dtfm-calc-launch > * { position: relative; }

.dtfm-calc-launch__preview {
    background: var(--gray-800);
    border: 1px solid var(--gray-700);
    border-radius: var(--r-lg);
    padding: var(--sp-4);
    margin-bottom: var(--sp-5);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--sp-3);
    text-align: left;
}

.dtfm-calc-launch__feat {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2);
    color: var(--gray-300);
    font-size: 13px;
    min-width: 0;
}

.dtfm-calc-launch__feat strong {
    color: var(--white) !important;
    display: block;
    font-family: var(--ff-display);
    font-size: 15px;
}

.dtfm-calc-launch__feat-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lime-500);
    box-shadow: 0 0 8px var(--lime-500);
    margin-top: 5px;
    flex-shrink: 0;
}

.dtfm-calc-launch h3 {
    font-size: clamp(24px, 4vw + 8px, 42px) !important;
    color: var(--white) !important;
    margin-bottom: var(--sp-3);
    text-align: center !important;
    overflow-wrap: anywhere;
}

.dtfm-calc-launch p {
    color: var(--gray-300);
    margin-bottom: var(--sp-5);
    max-width: 520px;
    margin-inline: auto !important;
    text-align: center !important;
    font-size: 15px;
}

.dtfm-calc-launch__cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 18px 28px;
    background: var(--pink-500) !important;
    color: var(--white) !important;
    font-family: var(--ff-body) !important;
    font-weight: 700 !important;
    font-size: 17px !important;
    border-radius: var(--r-pill);
    text-decoration: none !important;
    transition: transform 0.15s, background 0.2s, box-shadow 0.2s;
    box-shadow: 0 12px 40px rgba(230,13,130,0.3);
}

.dtfm-calc-launch__cta:hover {
    background: var(--pink-700) !important;
    transform: translateY(-2px);
    box-shadow: 0 16px 48px rgba(230,13,130,0.45);
}

.dtfm-calc-launch__cta svg { display: inline-block; }
.dtfm-calc-launch__cta .arrow { color: var(--lime-500) !important; }

.dtfm-calc-launch__hint {
    display: block;
    margin-top: var(--sp-3);
    font-family: var(--ff-mono);
    font-size: 12px;
    color: var(--gray-300) !important;
}

/* ─── 600px+ tablet: padding y CTA generosos ─── */
@media (min-width: 600px) {
    .dtfm-calc-launch {
        padding: var(--sp-7);
    }
    .dtfm-calc-launch__preview {
        padding: var(--sp-5);
    }
    .dtfm-calc-launch__cta {
        padding: 22px 40px;
        font-size: 19px !important;
    }
}
