/* =====================================================================
   SoftMind landing — estilos propios (overrides, modales, scroll)
   El sistema de diseño vive en softmind.css
   ===================================================================== */

html { scroll-behavior: smooth; }

:focus-visible {
    outline: 2px solid var(--sm-brand, #1947E5);
    outline-offset: 2px;
    border-radius: 4px;
}

body { margin: 0; }

/* =====================================================================
   Fix: color de botones tipo <a>
   softmind.css define `.sm a { color: inherit }` con especificidad 0,1,1
   que vence a `.sm-btn--primary { color: #fff }` con especificidad 0,1,0.
   Resultado: texto invisible (mismo color que el fondo).
   Subimos la especificidad aquí para ganar el override.
   ===================================================================== */

.sm a.sm-btn--primary,
.sm button.sm-btn--primary { color: #fff; }

.sm a.sm-btn--secondary,
.sm button.sm-btn--secondary { color: var(--sm-ink); }

.sm a.sm-btn--ghost,
.sm button.sm-btn--ghost { color: var(--sm-ink); }

.sm a.sm-btn--on-dark,
.sm button.sm-btn--on-dark { color: var(--sm-ink); }

.sm a.sm-btn--on-dark-outline,
.sm button.sm-btn--on-dark-outline { color: #fff; }

/* =====================================================================
   Fix: header sin saltos de línea
   El nav, las CTAs y la etiqueta eyebrow del logo deben quedar en
   una sola línea. Si la ventana es muy angosta, el burger se hace cargo.
   ===================================================================== */

.sm-header .sm-nav a,
.sm-header .sm-btn,
.sm-header .sm-label,
.sm-header .sm-logo__wordmark { white-space: nowrap; }

/* Ajuste: dejamos que el nav se compacte un poco antes de colapsar */
@media (max-width: 1100px) {
    .sm-header .sm-nav { gap: var(--sm-s-5); }
    .sm-header .sm-nav a { font-size: var(--sm-fs-body-m); }
}

/* =====================================================================
   Modal genérico
   ===================================================================== */

.modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(14, 17, 22, 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 100;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.modal.active {
    display: flex;
    animation: smFadeIn 0.2s ease-out;
}

@keyframes smFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}