/* ===== SOLUCIÓN DEFINITIVA — ANTES/CON HOPE V2 alineado y compacto ===== */

/* 1) Devuelve la tarjeta CON HOPE al flujo del grid
   (anula la regla V1 .svc-flow-after { position:absolute } de flow-section-pro.css) */
.svc-flow-comparison--v2 .svc-flow-after {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    z-index: auto !important;
}

/* 2) Contenedor más acotado y compacto.
   La clave es min-height:0 — elimina la altura forzada de 520px */
.svc-flow-comparison--v2 {
    max-width: 760px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    gap: 18px !important;
    padding: 22px !important;
    align-items: stretch !important;   /* mantiene ambos cards a la misma altura */
    min-height: 0 !important;
}

/* 3) Cards más pequeños y en columna */
.svc-flow-comparison--v2 .svc-flow-before,
.svc-flow-comparison--v2 .svc-flow-after {
    padding: 20px 22px !important;
    border-radius: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
    height: auto !important;
}

/* 4) El badge deja de ser absolute -> el card se ajusta a su contenido */
.svc-flow-comparison--v2 .svc-flow-result-visual {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    margin-top: 14px !important;
    width: auto !important;
}

/* 5) Tipografía compacta */
.svc-flow-comparison--v2 .svc-flow-before-icon,
.svc-flow-comparison--v2 .svc-flow-after-icon {
    font-size: 26px !important;
    margin-bottom: 6px !important;
}

.svc-flow-comparison--v2 .svc-flow-before-label,
.svc-flow-comparison--v2 .svc-flow-after-label {
    font-size: 11px !important;
    margin-bottom: 8px !important;
}

.svc-flow-comparison--v2 .svc-flow-before-content,
.svc-flow-comparison--v2 .svc-flow-after-content {
    font-size: 13.5px !important;
    line-height: 1.5 !important;
}

/* 6) Badge profesional - SIN gradiente chichero */
.svc-flow-result-visual {
    background: var(--color-accent) !important;
    background-image: none !important;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.25) !important;
}

/* 7) REDUCIR espacio - MUY COMPACTO */
section {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Hero ocupa TODA la pantalla al abrir */
.hero-section {
    min-height: 95vh !important;
    padding-top: 50px !important;
    padding-bottom: 30px !important;
    display: flex !important;
    align-items: center !important;
}

/* Pilares HOPE MUY compactos - todos en una pantalla */
.hope-method {
    padding-top: 14px !important;
    padding-bottom: 24px !important;
}

.stagger-item {
    margin-bottom: 16px !important;
    gap: 24px !important;
}

.hope-method .section-main-title {
    margin-bottom: 8px !important;
    font-size: 2rem !important;
}

.hope-method .section-subtitle {
    margin-bottom: 20px !important;
    font-size: 1rem !important;
}

/* Iconos pilares más pequeños - altura reducida */
.stagger-letter {
    font-size: 56px !important;
}

.stagger-letter-bg {
    font-size: 140px !important;
}

/* Contenido de cada pilar más compacto */
.stagger-content h3 {
    font-size: 1.5rem !important;
    margin-bottom: 6px !important;
}

.stagger-content h4 {
    font-size: 1rem !important;
    margin-bottom: 4px !important;
}

.stagger-content p {
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
}

/* Forzar compacto en otras secciones */
.proof-section,
.feature-blocks,
.svc,
.svc-compare-v2,
.svc-flow,
.industries-section,
.contact-section {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
}

/* Los 2 puntos con FLECHAS ROJAS - reducir AÚN MÁS */
.industries-section {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

.proof-section {
    padding-top: 24px !important;
    padding-bottom: 32px !important;
}

/* Container interno sin margin adicional */
.container {
    margin-top: 0 !important;
}

/* Sección de flujo/transformación más compacta */
.svc-flow {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}
