/* =========== Página Landing IA — Gold Theme ============ */

.lia-page { background: #0a0a12; min-height: 100vh; }

/* Hero */
.lia-hero {
    position: relative;
    padding: 6rem 0 4rem;
    text-align: center;
    overflow: hidden;
}

.lia-hero::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background:
        radial-gradient(ellipse at 30% 20%, rgba(255,215,0,0.1) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 80%, rgba(212,175,55,0.06) 0%, transparent 50%);
    pointer-events: none;
}

.lia-hero::after {
    content: '';
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
    background-image:
        radial-gradient(2px 2px at 15% 10%, rgba(255,215,0,0.08), transparent),
        radial-gradient(1px 1px at 45% 30%, rgba(255,215,0,0.1), transparent),
        radial-gradient(2px 2px at 75% 15%, rgba(212,175,55,0.08), transparent),
        radial-gradient(1px 1px at 25% 70%, rgba(255,255,255,0.06), transparent),
        radial-gradient(2px 2px at 85% 60%, rgba(255,165,0,0.08), transparent),
        radial-gradient(1px 1px at 55% 85%, rgba(255,255,255,0.06), transparent);
    pointer-events: none;
    animation: liaFloat 25s linear infinite;
}

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

.lia-hero-content { position: relative; z-index: 2; }

.lia-new-badge {
    display: inline-flex; align-items: center; gap: 0.5rem;
    padding: 0.4rem 1rem;
    background: linear-gradient(135deg, rgba(255,215,0,0.2), rgba(212,175,55,0.15));
    border: 1px solid rgba(255,215,0,0.4);
    border-radius: 50px;
    color: #FFD700;
    font-size: 0.8rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1.5px;
    margin-bottom: 1.5rem;
    animation: liaPulse 2.5s ease-in-out infinite;
}

@keyframes liaPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,215,0,0.25); }
    50% { box-shadow: 0 0 20px 5px rgba(255,215,0,0.1); }
}

.lia-hero-title {
    font-size: 3.5rem; font-weight: 800; color: #fff;
    line-height: 1.15; margin-bottom: 1.2rem;
    max-width: 800px; margin-left: auto; margin-right: auto;
}

.lia-gradient {
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #d4af37 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.lia-hero-desc {
    font-size: 1.25rem; color: rgba(255,255,255,0.6);
    max-width: 600px; margin: 0 auto 2.5rem; line-height: 1.7;
}

.lia-hero-cta {
    display: inline-flex; align-items: center; gap: 0.6rem;
    padding: 1rem 2.5rem;
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    color: #000;
    font-size: 1.1rem; font-weight: 700;
    border: none; border-radius: 50px; text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 20px rgba(255,215,0,0.35);
    text-transform: uppercase; letter-spacing: 0.5px;
}

.lia-hero-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(255,215,0,0.5);
    color: #000;
    background: linear-gradient(135deg, #ffe44d 0%, #FFD700 100%);
}

/* How it works */
.lia-how {
    padding: 5rem 0;
    background: linear-gradient(180deg, #0a0a12 0%, #0f0f1a 100%);
}

.lia-section-title {
    font-size: 2.4rem; font-weight: 800; color: #fff;
    text-align: center; margin-bottom: 0.6rem;
}

.lia-section-sub {
    text-align: center; color: rgba(255,255,255,0.5);
    font-size: 1.1rem; margin-bottom: 3.5rem;
}

.lia-steps {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 2rem; max-width: 900px; margin: 0 auto;
}

.lia-step {
    text-align: center; padding: 2.5rem 1.5rem;
    background: rgba(15,15,25,0.6);
    border: 1px solid rgba(255,215,0,0.1);
    border-radius: 20px;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.lia-step:hover {
    border-color: rgba(255,215,0,0.3);
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(255,215,0,0.06);
}

.lia-step-num {
    width: 50px; height: 50px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.3rem; font-weight: 800;
    margin: 0 auto 1.2rem;
    background: linear-gradient(135deg, #FFD700, #d4af37);
    color: #000;
}

.lia-step-icon { font-size: 2.5rem; margin-bottom: 1rem; display: block; }
.lia-step h3 { color: #fff; font-size: 1.15rem; font-weight: 700; margin-bottom: 0.5rem; }
.lia-step p { color: rgba(255,255,255,0.5); font-size: 0.9rem; line-height: 1.5; margin: 0; }

/* Features */
.lia-features { padding: 5rem 0; background: #0a0a12; }

.lia-features-grid {
    display: grid; grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem; max-width: 1000px; margin: 0 auto;
}

.lia-feat {
    padding: 2rem;
    background: rgba(15,15,25,0.5);
    border: 1px solid rgba(255,215,0,0.08);
    border-radius: 18px;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.lia-feat:hover {
    border-color: rgba(255,215,0,0.3);
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(255,215,0,0.06);
}

.lia-feat-icon {
    width: 50px; height: 50px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.3rem; margin-bottom: 1rem;
    background: linear-gradient(135deg, rgba(255,215,0,0.12), rgba(212,175,55,0.12));
    color: #FFD700;
}

.lia-feat-icon.purple { color: #FFD700; }
.lia-feat-icon.cyan { color: #FFA500; }
.lia-feat-icon.gold { color: #d4af37; }
.lia-feat-icon.green { color: #FFD700; }
.lia-feat-icon.pink { color: #FFA500; }
.lia-feat-icon.blue { color: #d4af37; }

.lia-feat h3 { color: #fff; font-size: 1.1rem; font-weight: 700; margin-bottom: 0.4rem; }
.lia-feat p { color: rgba(255,255,255,0.5); font-size: 0.9rem; line-height: 1.6; margin: 0; }

/* Themes Showcase */
.lia-themes { padding: 5rem 0; background: linear-gradient(180deg, #0f0f1a 0%, #0a0a12 100%); }

.lia-themes-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 2rem; max-width: 900px; margin: 0 auto;
}

.lia-theme-card {
    border-radius: 18px; overflow: hidden;
    border: 1px solid rgba(255,255,255,0.08);
    transition: all 0.4s ease;
}

.lia-theme-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 40px rgba(255,215,0,0.1);
    border-color: rgba(255,215,0,0.25);
}

.lia-theme-preview {
    height: 200px; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 1.5rem; position: relative;
}

.lia-theme-preview.dark { background: linear-gradient(135deg, #0f0f2e, #1a1a3e); }
.lia-theme-preview.neon { background: linear-gradient(135deg, #0a0a1a, #1a0a2e); }
.lia-theme-preview.light { background: linear-gradient(135deg, #f0f0ff, #e8e8f8); }

.lia-theme-preview .t-mock-bar { width: 70%; height: 8px; border-radius: 4px; margin-bottom: 0.5rem; }
.lia-theme-preview .t-mock-sub { width: 45%; height: 5px; border-radius: 3px; margin-bottom: 1.2rem; }
.lia-theme-preview .t-mock-btn { width: 30%; height: 16px; border-radius: 8px; }

.lia-theme-preview.dark .t-mock-bar { background: rgba(255,215,0,0.4); }
.lia-theme-preview.dark .t-mock-sub { background: rgba(255,255,255,0.15); }
.lia-theme-preview.dark .t-mock-btn { background: linear-gradient(90deg, #FFD700, #d4af37); }

.lia-theme-preview.neon .t-mock-bar { background: rgba(0,255,150,0.4); }
.lia-theme-preview.neon .t-mock-sub { background: rgba(255,255,255,0.1); }
.lia-theme-preview.neon .t-mock-btn { background: linear-gradient(90deg, #00ff98, #00cc7a); }

.lia-theme-preview.light .t-mock-bar { background: rgba(59,130,246,0.4); }
.lia-theme-preview.light .t-mock-sub { background: rgba(0,0,0,0.1); }
.lia-theme-preview.light .t-mock-btn { background: linear-gradient(90deg, #3b82f6, #6366f1); }

.lia-theme-preview .t-emoji { position: absolute; bottom: 10px; right: 12px; font-size: 1.3rem; }

.lia-theme-info {
    padding: 1rem 1.2rem;
    background: rgba(10,10,20,0.9);
    border-top: 1px solid rgba(255,255,255,0.06);
}

.lia-theme-info h4 { color: #fff; font-size: 0.95rem; font-weight: 700; margin: 0 0 0.2rem; }
.lia-theme-info span { color: rgba(255,255,255,0.4); font-size: 0.8rem; }

/* Value Props */
.lia-value { padding: 5rem 0; background: #0a0a12; }

.lia-value-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 2rem; max-width: 1000px; margin: 0 auto;
}

.lia-value-card {
    text-align: center; padding: 2.5rem 1.5rem;
    background: rgba(15,15,25,0.5);
    border: 1px solid rgba(255,215,0,0.08);
    border-radius: 18px;
    transition: all 0.3s ease;
}

.lia-value-card:hover {
    border-color: rgba(255,215,0,0.25);
    transform: translateY(-4px);
}

.lia-value-icon { font-size: 2.5rem; margin-bottom: 1rem; display: block; }
.lia-value-card h3 { color: #fff; font-size: 1.1rem; font-weight: 700; margin-bottom: 0.5rem; }
.lia-value-card p { color: rgba(255,255,255,0.5); font-size: 0.9rem; line-height: 1.6; margin: 0; }

/* FAQ */
.lia-faq { padding: 5rem 0; background: linear-gradient(180deg, #0a0a12, #0f0f1a); }
.lia-faq-list { max-width: 750px; margin: 0 auto; }

.lia-faq-item {
    margin-bottom: 0.8rem;
    border: 1px solid rgba(255,215,0,0.08);
    border-radius: 14px; overflow: hidden;
    background: rgba(15,15,25,0.5);
    transition: border-color 0.3s;
}

.lia-faq-item.activo { border-color: rgba(255,215,0,0.3); }

.lia-faq-q {
    display: flex; justify-content: space-between; align-items: center;
    padding: 1.2rem 1.5rem; cursor: pointer;
    transition: background 0.3s;
}

.lia-faq-q:hover { background: rgba(255,215,0,0.03); }
.lia-faq-q h4 { color: #fff; font-size: 1rem; font-weight: 600; margin: 0; }
.lia-faq-q i { color: #FFD700; transition: transform 0.3s; font-size: 0.85rem; }
.lia-faq-item.activo .lia-faq-q i { transform: rotate(180deg); }

.lia-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.35s ease; }
.lia-faq-a p { padding: 0 1.5rem 1.2rem; color: rgba(255,255,255,0.55); font-size: 0.9rem; line-height: 1.7; margin: 0; }

/* Final CTA */
.lia-final-cta {
    padding: 5rem 0; text-align: center;
    background: #0a0a12; position: relative;
}

.lia-final-cta::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(ellipse at 50% 50%, rgba(255,215,0,0.06) 0%, transparent 60%);
    pointer-events: none;
}

.lia-final-cta .container { position: relative; z-index: 2; }

.lia-final-title { font-size: 2.5rem; font-weight: 800; color: #fff; margin-bottom: 1rem; }

.lia-final-desc {
    color: rgba(255,255,255,0.55); font-size: 1.1rem;
    max-width: 550px; margin: 0 auto 2rem; line-height: 1.6;
}

.lia-final-btn {
    display: inline-flex; align-items: center; gap: 0.6rem;
    padding: 1.1rem 3rem;
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    color: #000;
    font-size: 1.2rem; font-weight: 700;
    border: none; border-radius: 50px; text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 25px rgba(255,215,0,0.4);
    text-transform: uppercase; letter-spacing: 0.5px;
}

.lia-final-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 35px rgba(255,215,0,0.55);
    color: #000;
}

.lia-final-note { color: rgba(255,255,255,0.35); font-size: 0.85rem; margin-top: 1rem; }

/* Responsive */
@media (max-width: 991.98px) {
    .lia-hero-title { font-size: 2.5rem; }
    .lia-themes-grid { gap: 1rem; }
}

@media (max-width: 767.98px) {
    .lia-hero { padding: 4rem 0 3rem; }
    .lia-hero-title { font-size: 2rem; }
    .lia-hero-desc { font-size: 1.05rem; }
    .lia-section-title { font-size: 1.8rem; }
    .lia-steps { grid-template-columns: 1fr; max-width: 350px; }
    .lia-features-grid { grid-template-columns: 1fr; }
    .lia-themes-grid { grid-template-columns: 1fr; max-width: 300px; margin: 0 auto; }
    .lia-value-grid { grid-template-columns: 1fr; max-width: 350px; margin: 0 auto; }
    .lia-hero-cta, .lia-final-btn { width: 100%; justify-content: center; }
    .lia-theme-preview { height: 150px; }
}