﻿#sushell-hero-hosting-pro {
    background-color: #ffffff !important;
    background-image: radial-gradient(circle at 100% 0%, rgba(90, 82, 255, 0.03) 0%, transparent 40%) !important;
    padding: 100px 20px 80px 20px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: block !important;
    overflow: hidden !important;
}

#sushell-hero-hosting-pro * {
    box-sizing: border-box !important;
}

#sushell-hero-hosting-pro .sushell-hero-container {
    max-width: 1250px !important;
    margin: 0 auto !important;
}

/* --- FILA PRINCIPAL --- */
#sushell-hero-hosting-pro .hero-main-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 60px !important;
    margin-bottom: 70px !important;
}

#sushell-hero-hosting-pro .hero-img-side,
#sushell-hero-hosting-pro .hero-text-side {
    flex: 1 !important;
}

/* Imagen con levitación (AI Vibe) */
#sushell-hero-hosting-pro .hero-image-wrapper {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    position: relative !important;
}

/* Resplandor sutil detrás de la imagen */
#sushell-hero-hosting-pro .hero-image-wrapper::before {
    content: '' !important;
    position: absolute !important;
    width: 60% !important;
    height: 60% !important;
    background: radial-gradient(circle, rgba(90, 82, 255, 0.15) 0%, rgba(255,255,255,0) 70%) !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 0 !important;
}

#sushell-hero-hosting-pro .hero-main-img {
    width: 100% !important;
    max-width: 580px !important;
    height: auto !important;
    display: block !important;
    z-index: 1 !important;
    position: relative !important;
}

.float-anim {
    animation: floating-ai 6s ease-in-out infinite !important;
}

@keyframes floating-ai {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* --- TEXTOS Y ETIQUETA AI --- */
.ai-chip-wrapper {
    margin-bottom: 25px !important;
}

.hero-chip-ai {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: linear-gradient(90deg, rgba(90,82,255,0.1) 0%, rgba(14,165,233,0.1) 100%) !important;
    border: 1px solid rgba(90,82,255,0.2) !important;
    color: #5A52FF !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    padding: 6px 18px !important;
    border-radius: 50px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.ai-sparkle {
    font-size: 14px !important;
    animation: sparkle-pulse 2s infinite !important;
}

@keyframes sparkle-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.2); }
}

#sushell-hero-hosting-pro .hero-text-side h2 {
    font-size: 44px !important;
    font-weight: 800 !important;
    color: #030825 !important;
    margin: 0 0 20px 0 !important;
    line-height: 1.15 !important;
    letter-spacing: -1.5px !important;
}

/* Texto Gradiente (Estilo IA) */
.text-gradient-ai {
    background: linear-gradient(135deg, #5A52FF 0%, #0EA5E9 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    color: transparent !important; /* Fallback */
}

#sushell-hero-hosting-pro .hero-text-side p {
    font-size: 17px !important;
    color: #64748B !important;
    line-height: 1.7 !important;
    margin: 0 0 35px 0 !important;
}

/* Caja de Precio */
#sushell-hero-hosting-pro .hero-pricing-box {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background-color: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 20px !important;
    padding: 15px 25px !important;
    max-width: 550px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 10px 30px rgba(90, 82, 255, 0.05) !important;
    transition: border-color 0.3s ease !important;
}

#sushell-hero-hosting-pro .hero-pricing-box:hover {
    border-color: #5A52FF !important;
}

#sushell-hero-hosting-pro .price-info {
    display: flex !important;
    flex-direction: column !important;
}

#sushell-hero-hosting-pro .price-label {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #64748B !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

#sushell-hero-hosting-pro .price-amount {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #030825 !important;
}

#sushell-hero-hosting-pro .price-amount small {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #64748B !important;
}

#sushell-hero-hosting-pro .price-badge-action {
    background: linear-gradient(135deg, #5A52FF 0%, #4338CA 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 8px 18px !important;
    border-radius: 50px !important;
    text-align: center !important;
    box-shadow: 0 4px 15px rgba(90,82,255,0.3) !important;
}

/* Botón con AI Glow */
#sushell-hero-hosting-pro .hero-action-row {
    display: flex !important;
    align-items: center !important;
    gap: 30px !important;
    flex-wrap: wrap !important;
}

.btn-hosting-ai {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: #030825 !important; /* Contraste elegante oscuro */
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 16px 35px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    /* Glow effect sutil */
    box-shadow: 0 0 20px rgba(3, 8, 37, 0.2), 0 0 0 4px rgba(90, 82, 255, 0.1) !important;
}

.btn-hosting-ai:hover {
    background-color: #5A52FF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 30px rgba(90, 82, 255, 0.4), 0 0 0 4px rgba(90, 82, 255, 0.2) !important;
}

/* Hero Desarrollo: CTAs simétricos + stats 3 cols + stack animado */
#sushell-hero-hosting-pro.sushell-hero-desarrollo .btn-hosting-ghost {
    background-color: transparent !important;
    color: #030825 !important;
    border: 1.5px solid #E2E8F0 !important;
    box-shadow: none !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .btn-hosting-ghost:hover {
    border-color: #5A52FF !important;
    color: #5A52FF !important;
    background-color: rgba(90, 82, 255, 0.04) !important;
    box-shadow: none !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-cta-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 460px !important;
    margin: 0 0 22px 0 !important;
    align-items: stretch !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-cta-row .btn-hosting-ai {
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 14px 18px !important;
    font-size: 14.5px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-inline {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 460px !important;
    height: 168px !important;
    margin-top: 4px !important;
    padding: 14px 16px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(90, 82, 255, 0.22) !important;
    background: linear-gradient(135deg, rgba(248, 250, 252, 0.98) 0%, rgba(238, 242, 255, 0.95) 100%) !important;
    box-shadow: 0 10px 28px rgba(90, 82, 255, 0.08) !important;
    overflow: hidden !important;
    opacity: 1 !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: #5A52FF !important;
    margin-bottom: 8px !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-viewport {
    height: 120px !important;
    overflow: hidden !important;
    mask-image: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%) !important;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%) !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-track {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    animation: heroStackScroll 22s linear infinite !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 18px !important;
}
#sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-track li {
    color: #030825 !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    padding: 7px 0 !important;
    border-bottom: 1px solid rgba(90, 82, 255, 0.1) !important;
}
@keyframes heroStackScroll {
    0% { transform: translateY(0); }
    100% { transform: translateY(-50%); }
}
@media (max-width: 900px) {
    #sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-cta-row,
    #sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-inline {
        max-width: 100% !important;
    }
}
@media (max-width: 520px) {
    #sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-cta-row {
        grid-template-columns: 1fr !important;
    }
    #sushell-hero-hosting-pro.sushell-hero-desarrollo .hero-stack-track {
        grid-template-columns: 1fr !important;
    }
}

.btn-hosting-ai svg {
    width: 18px !important;
    height: 18px !important;
    transition: transform 0.3s ease !important;
}

.btn-hosting-ai:hover svg {
    transform: translateX(5px) !important;
}

#sushell-hero-hosting-pro .hero-security-check {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: #1E293B !important;
}

#sushell-hero-hosting-pro .hero-security-check svg {
    width: 18px !important;
    height: 18px !important;
    color: #10B981 !important;
}

/* --- SECCIÓN INFERIOR: TARJETAS --- */
#sushell-hero-hosting-pro .hero-features-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 25px !important;
    margin-bottom: 50px !important;
}

#sushell-hero-hosting-pro .h-feature-card {
    background-color: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 20px !important;
    padding: 25px 25px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 18px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

#sushell-hero-hosting-pro .h-feature-card:hover {
    transform: translateY(-5px) !important;
    border-color: #5A52FF !important;
    box-shadow: 0 20px 40px rgba(90, 82, 255, 0.08) !important;
}

.ai-icon-bg {
    width: 50px !important;
    height: 50px !important;
    background: linear-gradient(135deg, rgba(90,82,255,0.1) 0%, rgba(14,165,233,0.1) 100%) !important;
    color: #5A52FF !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border: 1px solid rgba(90,82,255,0.05) !important;
}

.ai-icon-bg svg {
    width: 24px !important;
    height: 24px !important;
}

#sushell-hero-hosting-pro .h-f-text h4 {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #030825 !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
}

#sushell-hero-hosting-pro .h-f-text p {
    font-size: 14px !important;
    color: #64748B !important;
    margin: 0 !important;
    line-height: 1.6 !important;
}

/* --- BARRA DE TECNOLOGÍAS COMPATIBLES --- */
#sushell-hero-hosting-pro .hero-tech-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    padding-top: 35px !important;
    border-top: 1px solid #E2E8F0 !important;
    flex-wrap: wrap !important;
}

#sushell-hero-hosting-pro .hero-tech-bar > span {
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: #64748B !important;
}

#sushell-hero-hosting-pro .tech-tags {
    display: flex !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

#sushell-hero-hosting-pro .t-tag {
    background-color: #F8FAFC !important;
    color: #475569 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 6px 16px !important;
    border-radius: 8px !important;
    border: 1px solid #E2E8F0 !important;
    transition: all 0.3s ease !important;
}

#sushell-hero-hosting-pro .t-tag:hover {
    background-color: #ffffff !important;
    border-color: #cbd5e1 !important;
    color: #030825 !important;
}

#sushell-hero-hosting-pro .t-tag.highlight {
    background: linear-gradient(90deg, rgba(90,82,255,0.1) 0%, rgba(14,165,233,0.1) 100%) !important;
    border-color: rgba(90,82,255,0.3) !important;
    color: #5A52FF !important;
}

/* --- RESPONSIVO --- */
@media (max-width: 992px) {
    #sushell-hero-hosting-pro .hero-main-row {
        flex-direction: column !important;
        text-align: center !important;
        gap: 50px !important;
    }
    #sushell-hero-hosting-pro .hero-text-side {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    #sushell-hero-hosting-pro .hero-pricing-box {
        flex-direction: column !important;
        gap: 15px !important;
        text-align: center !important;
        width: 100% !important;
    }
    #sushell-hero-hosting-pro .hero-action-row {
        flex-direction: column !important;
        justify-content: center !important;
        width: 100% !important;
        gap: 20px !important;
    }
    .btn-hosting-ai {
        width: 100% !important;
        justify-content: center !important;
    }
    #sushell-hero-hosting-pro .hero-features-row {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 768px) {
    #sushell-hero-hosting-pro {
        padding: 80px 15px !important;
    }
    #sushell-hero-hosting-pro .hero-text-side h2 {
        font-size: 34px !important;
    }
    #sushell-hero-hosting-pro .hero-image-wrapper::before {
        display: none !important; /* Apagar en móvil para mejor rendimiento */
    }
}

/* --- AISLAMIENTO TOTAL: ESTILO OSCURO PROFUNDO DE ANCHO COMPLETO --- */
#sushell-magic-pro {
    background-color: #241154 !important; /* Color morado profundo base */
    padding: 100px 20px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    box-sizing: border-box !important;
    
    /* ANCHO COMPLETO */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    display: block !important;
    overflow: hidden !important;
}

#sushell-magic-pro * {
    box-sizing: border-box !important;
}

/* Aura luminosa de fondo (Efecto IA) */
.magic-bg-glow {
    position: absolute !important;
    top: -20% !important;
    left: -10% !important;
    width: 60% !important;
    height: 140% !important;
    background: radial-gradient(circle, rgba(14, 165, 233, 0.08) 0%, rgba(36, 17, 84, 0) 70%) !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

#sushell-magic-pro .magic-container {
    max-width: 1250px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* --- CUADRÍCULA DE 2 COLUMNAS --- */
#sushell-magic-pro .magic-grid {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 60px !important;
}

#sushell-magic-pro .magic-text-side {
    flex: 1.2 !important;
}

#sushell-magic-pro .magic-image-side {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

/* --- TEXTOS --- */
#sushell-magic-pro .magic-text-side h2 {
    font-size: 44px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 20px 0 !important;
    line-height: 1.2 !important;
    letter-spacing: -1px !important;
}

/* Gradiente y resplandor para la palabra "magia" */
.magic-text-gradient {
    background: linear-gradient(135deg, #0EA5E9 0%, #A855F7 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    color: transparent !important;
    position: relative !important;
    display: inline-block !important;
}
.magic-text-gradient::after {
    content: 'magia.' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    z-index: -1 !important;
    background: linear-gradient(135deg, #0EA5E9 0%, #A855F7 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: blur(12px) !important;
    opacity: 0.6 !important;
}

#sushell-magic-pro .magic-text-side > p {
    font-size: 16.5px !important;
    color: #cbd5e1 !important;
    line-height: 1.7 !important;
    margin-bottom: 35px !important;
    font-weight: 400 !important;
}

/* --- LISTA DE CHECKS (Estilo Tech) --- */
#sushell-magic-pro .magic-features {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 45px 0 !important;
}

#sushell-magic-pro .magic-features li {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    font-size: 15.5px !important;
    font-weight: 500 !important;
    color: #f8fafc !important;
    margin-bottom: 18px !important;
}

.m-check-icon {
    width: 26px !important;
    height: 26px !important;
    background: rgba(14, 165, 233, 0.15) !important;
    border: 1px solid rgba(14, 165, 233, 0.3) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0EA5E9 !important;
    flex-shrink: 0 !important;
    box-shadow: 0 0 10px rgba(14, 165, 233, 0.2) !important;
}

.m-check-icon svg {
    width: 14px !important;
    height: 14px !important;
}

/* --- PÍLDORA VERDE ECOLÓGICA (Glassmorphism) --- */
#sushell-magic-pro .magic-eco-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: rgba(34, 197, 94, 0.15) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(34, 197, 94, 0.4) !important;
    color: #4ade80 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    border-radius: 50px !important;
    box-shadow: 0 8px 25px rgba(34, 197, 94, 0.15) !important;
    transition: all 0.3s ease !important;
}

#sushell-magic-pro .magic-eco-pill:hover {
    background-color: rgba(34, 197, 94, 0.25) !important;
    border-color: rgba(34, 197, 94, 0.6) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 30px rgba(34, 197, 94, 0.25) !important;
}

#sushell-magic-pro .leaf-icon {
    font-size: 16px !important;
    filter: drop-shadow(0 0 4px rgba(74, 222, 128, 0.5)) !important;
}

/* --- ILUSTRACIÓN DERECHA --- */
#sushell-magic-pro .magic-img-wrapper {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

/* Halo luminoso detrás de la imagen */
#sushell-magic-pro .magic-img-wrapper::before {
    content: '' !important;
    position: absolute !important;
    width: 70% !important;
    height: 70% !important;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.15) 0%, rgba(36, 17, 84, 0) 70%) !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 0 !important;
}

#sushell-magic-pro .magic-img {
    width: 100% !important;
    max-width: 580px !important;
    height: auto !important;
    display: block !important;
    z-index: 1 !important;
    position: relative !important;
}

/* Animación de levitación */
.float-anim {
    animation: floating-ai 6s ease-in-out infinite !important;
}

@keyframes floating-ai {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* --- RESPONSIVO --- */
@media (max-width: 992px) {
    #sushell-magic-pro .magic-grid {
        flex-direction: column !important;
        text-align: center !important;
        gap: 50px !important;
    }
    #sushell-magic-pro .magic-text-side {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    #sushell-magic-pro .magic-features {
        display: inline-block !important;
        text-align: left !important;
    }
}

@media (max-width: 768px) {
    #sushell-magic-pro {
        padding: 80px 15px !important;
    }
    #sushell-magic-pro .magic-text-side h2 {
        font-size: 34px !important;
    }
}

/* --- AISLAMIENTO TOTAL: MODO CLARO Y PROFESIONAL --- */
#sushell-wizard-pro {
    background-color: #ffffff !important;
    padding: 100px 20px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: block !important;
    overflow: hidden !important;
}

#sushell-wizard-pro * {
    box-sizing: border-box !important;
}

#sushell-wizard-pro .wizard-container {
    max-width: 1250px !important;
    margin: 0 auto !important;
}

/* --- CUADRÍCULA DE 2 COLUMNAS --- */
#sushell-wizard-pro .wizard-grid {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 80px !important; /* Un poco más de aire entre columnas */
}

#sushell-wizard-pro .wizard-image-side {
    flex: 1.1 !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

#sushell-wizard-pro .wizard-text-side {
    flex: 1 !important;
}

/* --- ILUSTRACIÓN IZQUIERDA --- */
#sushell-wizard-pro .wizard-img-wrapper {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

/* Halo sutil detrás del mago/ilustración */
#sushell-wizard-pro .wizard-img-wrapper::before {
    content: '' !important;
    position: absolute !important;
    width: 70% !important;
    height: 70% !important;
    background: radial-gradient(circle, rgba(90, 82, 255, 0.1) 0%, rgba(255,255,255,0) 70%) !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 0 !important;
}

#sushell-wizard-pro .wizard-img {
    width: 100% !important;
    max-width: 580px !important;
    height: auto !important;
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Animación de Levitación */
.float-anim {
    animation: float-wizard 6s ease-in-out infinite !important;
}

@keyframes float-wizard {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* --- TEXTOS --- */
#sushell-wizard-pro .wizard-chip {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #F5F5FF !important;
    border: 1px solid #E2E2FC !important;
    color: #5A52FF !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 6px 18px !important;
    border-radius: 50px !important;
    margin-bottom: 25px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

#sushell-wizard-pro .wizard-text-side h2 {
    font-size: 42px !important;
    font-weight: 800 !important;
    color: #030825 !important;
    margin: 0 0 20px 0 !important;
    line-height: 1.15 !important;
    letter-spacing: -1px !important;
}

/* Énfasis en el texto con gradiente */
.text-gradient {
    background: linear-gradient(135deg, #5A52FF 0%, #0EA5E9 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    color: transparent !important;
}

#sushell-wizard-pro .wizard-text-side > p {
    font-size: 16.5px !important;
    color: #64748B !important;
    line-height: 1.7 !important;
    margin-bottom: 40px !important;
}

/* --- TARJETAS DE PASOS INTERACTIVAS --- */
#sushell-wizard-pro .wizard-steps-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

#sushell-wizard-pro .wizard-step-item {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    background-color: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 18px !important;
    padding: 20px 22px !important;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Barra lateral indicadora sutil */
#sushell-wizard-pro .wizard-step-item::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 4px !important;
    background: #5A52FF !important;
    transform: scaleY(0) !important;
    transition: transform 0.3s ease !important;
    transform-origin: bottom !important;
}

#sushell-wizard-pro .wizard-step-item:hover {
    transform: translateX(10px) !important;
    border-color: #5A52FF !important;
    box-shadow: 0 15px 35px rgba(90, 82, 255, 0.1) !important;
}

#sushell-wizard-pro .wizard-step-item:hover::before {
    transform: scaleY(1) !important;
}

#sushell-wizard-pro .w-icon-box {
    width: 48px !important;
    height: 48px !important;
    background-color: #F5F5FF !important;
    color: #5A52FF !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

#sushell-wizard-pro .wizard-step-item:hover .w-icon-box {
    background-color: #5A52FF !important;
    color: #ffffff !important;
    transform: scale(1.1) rotate(5deg) !important;
}

#sushell-wizard-pro .w-icon-box svg {
    width: 22px !important;
    height: 22px !important;
    transition: transform 0.3s ease !important;
}

#sushell-wizard-pro .w-step-text h4 {
    font-size: 16.5px !important;
    font-weight: 700 !important;
    color: #030825 !important;
    margin: 0 0 4px 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* Numeración destacada */
#sushell-wizard-pro .step-num {
    color: #5A52FF !important;
    opacity: 0.8 !important;
    font-weight: 800 !important;
}

#sushell-wizard-pro .w-step-text p {
    font-size: 14px !important;
    color: #64748B !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

/* --- RESPONSIVO --- */
@media (max-width: 1024px) {
    #sushell-wizard-pro .wizard-grid {
        gap: 40px !important;
    }
}

@media (max-width: 992px) {
    #sushell-wizard-pro .wizard-grid {
        flex-direction: column !important;
        text-align: center !important;
        gap: 50px !important;
    }
    #sushell-wizard-pro .wizard-text-side {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    #sushell-wizard-pro .wizard-steps-container {
        width: 100% !important;
        max-width: 600px !important;
    }
    #sushell-wizard-pro .wizard-step-item {
        text-align: left !important;
    }
    #sushell-wizard-pro .wizard-step-item:hover {
        transform: translateY(-5px) translateX(0) !important; /* Movimiento hacia arriba en móviles, no a un lado */
    }
}

@media (max-width: 768px) {
    #sushell-wizard-pro {
        padding: 60px 15px !important;
    }
    #sushell-wizard-pro .wizard-text-side h2 {
        font-size: 34px !important;
    }
}

/* --- AISLAMIENTO TOTAL: MODO OSCURO PROFUNDO --- */
#sushell-speed-pro {
    background-color: #241154 !important; /* Morado corporativo profundo */
    padding: 100px 20px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    box-sizing: border-box !important;
    
    /* ANCHO COMPLETO */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    display: block !important;
    overflow: hidden !important;
}

#sushell-speed-pro * {
    box-sizing: border-box !important;
}

/* Aura luminosa de fondo (Efecto IA) */
.speed-bg-glow {
    position: absolute !important;
    bottom: -10% !important;
    right: -10% !important;
    width: 50% !important;
    height: 120% !important;
    background: radial-gradient(circle, rgba(90, 82, 255, 0.12) 0%, rgba(36, 17, 84, 0) 70%) !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

#sushell-speed-pro .speed-container {
    max-width: 1250px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* --- CUADRÍCULA DE 2 COLUMNAS --- */
#sushell-speed-pro .speed-grid {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 70px !important;
}

#sushell-speed-pro .speed-image-side {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

#sushell-speed-pro .speed-content-side {
    flex: 1.25 !important;
}

/* --- ILUSTRACIÓN IZQUIERDA --- */
#sushell-speed-pro .speed-img-wrapper {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
}

#sushell-speed-pro .speed-img {
    width: 100% !important;
    max-width: 520px !important;
    height: auto !important;
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Animación de levitación */
.float-anim {
    animation: floating-ai 6s ease-in-out infinite !important;
}

@keyframes floating-ai {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* --- TÍTULO --- */
#sushell-speed-pro .speed-content-side h2 {
    font-size: 40px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 35px 0 !important;
    line-height: 1.2 !important;
    letter-spacing: -1px !important;
}

/* --- CUADRÍCULA DE 4 TARJETAS (2x2) --- */
#sushell-speed-pro .speed-features-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 22px !important;
}

#sushell-speed-pro .speed-card {
    background: rgba(255, 255, 255, 0.03) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 20px !important;
    padding: 30px 25px !important;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

#sushell-speed-pro .speed-card:hover {
    transform: translateY(-6px) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(14, 165, 233, 0.4) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
}

/* Iconos de las tarjetas */
.speed-icon-box {
    width: 44px !important;
    height: 44px !important;
    background: rgba(14, 165, 233, 0.15) !important;
    border: 1px solid rgba(14, 165, 233, 0.3) !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0EA5E9 !important;
    box-shadow: 0 0 15px rgba(14, 165, 233, 0.15) !important;
}

.speed-icon-box svg {
    width: 22px !important;
    height: 22px !important;
}

#sushell-speed-pro .speed-card p {
    font-size: 14.5px !important;
    color: #cbd5e1 !important;
    line-height: 1.65 !important;
    margin: 0 !important;
    font-weight: 400 !important;
}

/* --- RESPONSIVO --- */
@media (max-width: 1024px) {
    #sushell-speed-pro .speed-grid {
        flex-direction: column !important;
        text-align: center !important;
        gap: 50px !important;
    }
    #sushell-speed-pro .speed-content-side {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    #sushell-speed-pro .speed-features-grid {
        text-align: left !important;
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    #sushell-speed-pro {
        padding: 60px 15px !important;
    }
    #sushell-speed-pro .speed-content-side h2 {
        font-size: 32px !important;
    }
    #sushell-speed-pro .speed-features-grid {
        grid-template-columns: 1fr !important;
    }
}

/* --- AISLAMIENTO TOTAL: MODO CLARO Y PROFESIONAL --- */
#sushell-testimonials-pro {
    background-color: #ffffff !important;
    padding: 100px 20px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: block !important;
}

#sushell-testimonials-pro * {
    box-sizing: border-box !important;
}

#sushell-testimonials-pro .testi-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* Encabezado */
#sushell-testimonials-pro .testi-header {
    text-align: center !important;
    margin-bottom: 60px !important;
}

#sushell-testimonials-pro .testi-chip {
    display: inline-block !important;
    background-color: #F5F5FF !important;
    border: 1px solid #E2E2FC !important;
    color: #5A52FF !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 6px 18px !important;
    border-radius: 50px !important;
    margin-bottom: 20px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

#sushell-testimonials-pro .testi-header h2 {
    font-size: 42px !important;
    font-weight: 800 !important;
    color: #030825 !important;
    margin: 0 0 15px 0 !important;
    letter-spacing: -1px !important;
}

#sushell-testimonials-pro .testi-header p {
    font-size: 17px !important;
    color: #64748B !important;
    max-width: 600px !important;
    margin: 0 auto !important;
    line-height: 1.6 !important;
}

/* --- CUADRÍCULA DE TESTIMONIOS (2 COLUMNAS) --- */
#sushell-testimonials-pro .testi-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 35px !important;
    align-items: stretch !important;
}

/* Tarjetas */
#sushell-testimonials-pro .testi-card {
    background-color: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 24px !important;
    padding: 40px 35px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.02) !important;
}

#sushell-testimonials-pro .testi-card:hover {
    transform: translateY(-6px) !important;
    border-color: #5A52FF !important;
    box-shadow: 0 20px 45px rgba(90, 82, 255, 0.1) !important;
    background: #fafaf9 !important;
}

/* Fila superior de la tarjeta (Estrellas + Comilla) */
#sushell-testimonials-pro .testi-card-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
}

/* Estrellas */
#sushell-testimonials-pro .testi-stars {
    display: flex !important;
    gap: 4px !important;
}

#sushell-testimonials-pro .testi-stars svg {
    width: 18px !important;
    height: 18px !important;
    fill: #F59E0B !important;
}

#sushell-testimonials-pro .star-half {
    fill: #CBD5E1 !important;
}

/* Comilla decorativa de fondo */
.quote-icon {
    font-size: 54px !important;
    font-weight: 800 !important;
    color: #E2E8F0 !important;
    line-height: 0 !important;
    opacity: 0.5 !important;
    font-family: Georgia, serif !important;
}

/* Texto del Testimonio */
#sushell-testimonials-pro .testi-text {
    font-size: 16px !important;
    color: #475569 !important;
    line-height: 1.75 !important;
    margin: 0 0 30px 0 !important;
    flex: 1 !important;
}

/* Fila del Autor con Avatar */
#sushell-testimonials-pro .testi-author-row {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    border-top: 1px solid #F1F5F9 !important;
    padding-top: 20px !important;
}

.author-avatar {
    width: 48px !important;
    height: 48px !important;
    background: linear-gradient(135deg, #5A52FF 0%, #0EA5E9 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    box-shadow: 0 4px 12px rgba(90, 82, 255, 0.25) !important;
}

#sushell-testimonials-pro .testi-author h4 {
    font-size: 16.5px !important;
    font-weight: 700 !important;
    color: #030825 !important;
    margin: 0 0 2px 0 !important;
}

#sushell-testimonials-pro .testi-author span {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #64748B !important;
}

/* --- RESPONSIVO --- */
@media (max-width: 768px) {
    #sushell-testimonials-pro {
        padding: 60px 15px !important;
    }
    #sushell-testimonials-pro .testi-header h2 {
        font-size: 32px !important;
    }
    #sushell-testimonials-pro .testi-grid {
        grid-template-columns: 1fr !important;
    }
}
