/* ============================================================================
   Contafácil — Página "Funcionalidades"
   Depende de brand-tokens.css + marketing.css.
   ============================================================================ */

.fn-hero { padding-top: clamp(2rem, 6vw, 3.5rem); padding-bottom: clamp(1.5rem, 4vw, 2.5rem); text-align: center; }
.fn-hero h1 {
    font-family: 'Gantari', sans-serif; font-weight: 800; letter-spacing: -.02em;
    font-size: clamp(2rem, 4.4vw, 3rem); line-height: 1.12; margin: 0 auto 1.1rem; max-width: 20ch; color: var(--cf-ink);
}
.fn-hero p { font-size: 1.08rem; line-height: 1.6; color: var(--cf-muted); max-width: 52ch; margin: 0 auto; }

/* ── Categoría (agrupador dentro de una sección) ─────────────────────────── */
.fn-category-label {
    font-family: 'Gantari', sans-serif; font-size: .78rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .07em; color: var(--cf-primary-700);
    margin: 0 0 .5rem;
}

/* ── Bloque destacado de robots con terminal ─────────────────────────────── */
.fn-robots { display: grid; grid-template-columns: .95fr 1.05fr; gap: 2.5rem; align-items: center; }
@media (max-width: 900px) { .fn-robots { grid-template-columns: 1fr; gap: 2rem; } }
.fn-robots h2 { font-family: 'Gantari', sans-serif; font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--cf-ink); margin: 0 0 .75rem; }
.fn-robots p { color: var(--cf-muted); font-size: 1rem; line-height: 1.6; margin: 0 0 1.25rem; }
.fn-robots-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .7rem; }
.fn-robots-list li { display: flex; gap: .6rem; font-size: .93rem; color: var(--cf-ink); }
.fn-robots-list li .mk-glyph { color: var(--cf-primary); font-weight: 800; flex: 0 0 auto; }

.fn-terminal-card {
    background: #161b22; border: 1px solid #30363d; border-radius: calc(var(--cf-radius) + 4px);
    box-shadow: var(--cf-shadow-md); overflow: hidden;
}
.fn-terminal-bar { display: flex; align-items: center; gap: .5rem; padding: .7rem 1rem; background: #161b22; border-bottom: 1px solid #21262d; }
.fn-terminal-dot { width: 9px; height: 9px; border-radius: 50%; background: #30363d; }
.fn-terminal-title { font-family: ui-monospace, Consolas, monospace; font-size: .72rem; color: #8b949e; margin-left: .4rem; }
.fn-terminal-progress { padding: 0 16px 14px; }
.fn-terminal-track { height: 5px; border-radius: 3px; background: #21262d; overflow: hidden; }
.fn-terminal-fill { height: 100%; width: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--cf-primary), #3fb950); }

/* ── Grilla de funcionalidades (además de .mk-feature-grid ya definido) ─── */
.fn-group { margin-bottom: clamp(2rem, 5vw, 3rem); }
.fn-group:last-child { margin-bottom: 0; }