:root {
    --primary: #0f2f76;
    --accent: #b1ef54;
    --dark: #050a1a;
    --light: #f4f4f4;
    --white: #ffffff;
}

body { font-family: 'Montserrat', sans-serif; margin: 0; padding: 0; background: var(--light); color: #333; overflow-x: hidden; }
.impact { font-family: 'ImpactRegular', sans-serif; text-transform: uppercase; }
.glacial { font-family: 'GlacialIndifference', sans-serif; }
.container { width: 90%; max-width: 1200px; margin: auto; }

/* HEADER */
header { background: var(--white); padding: 15px 0; border-bottom: 2px solid var(--primary); position: sticky; top: 0; z-index: 1000; }
.nav-flex { display: flex; justify-content: space-between; align-items: center; }
.nav-list { list-style: none; display: flex; gap: 20px; align-items: center; margin: 0; padding: 0; }
.nav-list a { text-decoration: none; color: #000; font-weight: bold; font-family: 'ImpactRegular'; font-size: 20px; }
.btn-nav { background: var(--accent); padding: 8px 20px; border-radius: 5px; color: var(--primary) !important; text-decoration: none; }

/* HERO */
#hero { background: var(--primary); color: var(--white); padding: 100px 0; text-align: center; }
#hero h2 { font-size: clamp(40px, 6vw, 70px); line-height: 1; margin-bottom: 20px; }
#hero span { color: var(--accent); }
.btn-hero { background: var(--accent); color: #000; padding: 15px 30px; border-radius: 10px; text-decoration: none; font-weight: bold; font-size: 20px; display: inline-block; margin-top: 30px; transition: transform 0.2s; }
.btn-hero:hover { transform: scale(1.05); }

/* SERVICIOS & GRID */
.section-title { text-align: center; font-size: 50px; margin: 60px 0 40px 0; color: var(--primary); }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; padding-bottom: 80px; }
.card { background: #c7cbcf; padding: 30px; border-radius: 12px; text-align: center; transition: 0.3s; display: flex; flex-direction: column; justify-content: space-between; }
.card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.card h3 { font-size: 28px; color: var(--primary); margin-bottom: 15px; }
.btn-card { background: var(--accent); color: #000; padding: 10px 20px; border-radius: 5px; text-decoration: none; font-weight: bold; margin-top: 20px; display: inline-block; border: none; cursor: pointer; }

/* CASOS DE ÉXITO */
.bg-dark { background: var(--dark); color: #fff; padding: 80px 0; }
.neon-text { color: var(--accent); }
.cases-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; }
.case-card { border: 1px solid #333; padding: 30px; border-radius: 12px; background: #111; text-align: center; }
.stats { font-size: 36px; color: var(--accent); font-weight: bold; margin: 15px 0; }
.btn-case { color: #ccc; text-decoration: none; font-size: 14px; font-weight: bold; border: 1px solid #555; padding: 5px 15px; border-radius: 20px; }

/* --- FAQ STYLES FIXED (ESTILO EXACTO QUE PEDISTE) --- */
.faq-section { background-color: #fff; padding: 80px 0; width: 100%; }
.faq-title-box { background-color: #428ce1; border-top: 10px solid #0f2f76; border-bottom: 10px solid #0f2f76; text-align: center; padding: 40px 0; margin-bottom: 50px; }
.faq-title-box h2 { color: #fff; font-size: 50px; margin: 0; letter-spacing: 2px; }
.faq-container { width: 90%; max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.faq-item { border: 2px solid #b1ef54; border-radius: 10px; overflow: hidden; background-color: #fff; transition: box-shadow 0.3s ease; }
.faq-question { width: 100%; background-color: #b1ef54; color: #0f2f76; font-family: 'ImpactRegular', sans-serif; font-size: 22px; text-transform: uppercase; text-align: left; padding: 20px 30px; border: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; transition: background 0.3s; }
.faq-question:hover { background-color: #a3dc4e; }
.faq-question .icon { font-size: 30px; font-weight: bold; line-height: 1; transition: transform 0.3s ease; }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; background-color: #fff; }
.answer-content { padding: 20px 30px; border-top: 1px solid #b1ef54; }
.answer-content p { font-family: 'GlacialIndifference', sans-serif; font-size: 18px; color: #333; line-height: 1.6; margin: 0; }
.faq-item.active { box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.faq-item.active .faq-question .icon { transform: rotate(45deg); }