.elementor-10 .elementor-element.elementor-element-167c705{--display:flex;--overlay-opacity:0.21;}.elementor-10 .elementor-element.elementor-element-167c705:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-167c705 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#07071F;}.elementor-10 .elementor-element.elementor-element-167c705::before, .elementor-10 .elementor-element.elementor-element-167c705 > .elementor-background-video-container::before, .elementor-10 .elementor-element.elementor-element-167c705 > .e-con-inner > .elementor-background-video-container::before, .elementor-10 .elementor-element.elementor-element-167c705 > .elementor-background-slideshow::before, .elementor-10 .elementor-element.elementor-element-167c705 > .e-con-inner > .elementor-background-slideshow::before, .elementor-10 .elementor-element.elementor-element-167c705 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://capital-signal.com/cms/wp-content/uploads/2026/05/hero-home.jpg");--background-overlay:'';background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-10 .elementor-element.elementor-element-9c03bf8{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-10 .elementor-element.elementor-element-21af918{margin:39px 0px calc(var(--kit-widget-spacing, 0px) + -2px) 0px;}.elementor-10 .elementor-element.elementor-element-21af918 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-weight:600;color:#29414C;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-10 .elementor-element.elementor-element-0ec105e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -5px) 0px;font-family:"Montserrat", Sans-serif;font-weight:700;color:#605F5F;}.elementor-10 .elementor-element.elementor-element-b0371c3{--display:flex;}.elementor-widget-posts .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__title, .elementor-widget-posts .elementor-post__title a{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-posts .elementor-post__meta-data{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-post__excerpt p{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-posts .elementor-post__read-more{color:var( --e-global-color-accent );}.elementor-widget-posts a.elementor-post__read-more{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__card .elementor-post__badge{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-10 .elementor-element.elementor-element-f1d8248{--grid-row-gap:35px;--grid-column-gap:30px;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.46 * 100% );}.elementor-10 .elementor-element.elementor-element-f1d8248:after{content:"0.46";}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__thumbnail__link{width:100%;margin-bottom:calc(44px / 2);}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__meta-data span + span:before{content:"•";}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__card{border-radius:23px;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__text{margin-top:20px;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__badge{right:0;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__card .elementor-post__badge{background-color:#000000;border-radius:12px;font-size:13px;margin:20px;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__avatar{top:calc(-44px / 2);}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__avatar img{width:44px;height:44px;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__read-more{color:#096196;}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-pagination{text-align:center;}body:not(.rtl) .elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-pagination .page-numbers:not(:first-child){margin-left:calc( 10px/2 );}body:not(.rtl) .elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-pagination .page-numbers:not(:last-child){margin-right:calc( 10px/2 );}body.rtl .elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-pagination .page-numbers:not(:first-child){margin-right:calc( 10px/2 );}body.rtl .elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-pagination .page-numbers:not(:last-child){margin-left:calc( 10px/2 );}.elementor-10 .elementor-element.elementor-element-0d37f8e{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-10 .elementor-element.elementor-element-0d37f8e:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-0d37f8e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #D8D8D826 0%, #E8E6E6 100%);}.elementor-10 .elementor-element.elementor-element-eca0235{margin:39px 55px calc(var(--kit-widget-spacing, 0px) + -2px) 55px;}.elementor-10 .elementor-element.elementor-element-eca0235 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-weight:600;color:#29414C;}.elementor-10 .elementor-element.elementor-element-2897c94{margin:1px 55px calc(var(--kit-widget-spacing, 0px) + 1px) 55px;}.elementor-10 .elementor-element.elementor-element-72596e5{margin:-46px 55px calc(var(--kit-widget-spacing, 0px) + 22px) 55px;}.elementor-10 .elementor-element.elementor-element-803b00e{--display:flex;}.elementor-10 .elementor-element.elementor-element-5e33bd5{--display:flex;}.elementor-10 .elementor-element.elementor-element-5e33bd5:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-5e33bd5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#03041D;}.elementor-10 .elementor-element.elementor-element-6dfd642{border-radius:-30px -30px -30px -30px;}@media(max-width:767px){.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-10 .elementor-element.elementor-element-f1d8248:after{content:"0.5";}.elementor-10 .elementor-element.elementor-element-f1d8248 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for container, class: .elementor-element-167c705 *//* ===========================
   TIPOGRAFÍA Y VARIABLES
   =========================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --cs-bg-dark: #020617;
    --cs-bg-soft: #0f172a;
    --cs-card-bg: rgba(15,23,42,0.85);
    --cs-glass: rgba(15,23,42,0.65);
    --cs-border: rgba(148,163,184,0.4);
    --cs-accent: #38bdf8;
    --cs-primary: #111827;
    --cs-accent-soft: rgba(56,189,248,0.25);
    --cs-text-soft: #6b7280;
    --cs-radius-lg: 1.5rem;
    --cs-radius-md: 1rem;
}

html,
body {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    scroll-behavior: smooth;
}

/* Fondo por defecto (home, blog, article, asesoría, etc.) */
body {
    background-color: #f5f5f5;
    color: #111827;
}

/* Variaciones de body para páginas oscuras específicas */
body.cs-body-dark-contact {
    background: radial-gradient(circle at top, #0ea5e9 0, #020617 55%, #020617 100%);
    color: #e5e7eb;
}

body.cs-body-dark-schedule {
    background: radial-gradient(circle at top, #38bdf8 0, #020617 50%, #020617 100%);
    color: #e5e7eb;
}

/* ===========================
   ESPACIADO GLOBAL / TIPOGRAFÍA
   =========================== */

/* Secciones generales */
.section-padding {
    padding: 4.5rem 0 4rem;
}

@media (max-width: 991.98px) {
    .section-padding {
        padding: 3.5rem 0 3.2rem;
    }
}

/* Títulos y subtítulos */
.section-title {
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: 1.25rem;
}

@media (max-width: 575.98px) {
    .section-title {
        font-size: 1.7rem;
    }
}

/* Párrafos base */
p {
    line-height: 1.7;
    margin-bottom: 0.95rem;
}

/* Texto suave reutilizable */
.text-soft {
    color: #6b7280 !important;
}

/* Pilas verticales para distribuir contenido */
.cs-stack-lg > * + * {
    margin-top: 1.75rem;
}

.cs-stack-md > * + * {
    margin-top: 1.1rem;
}

.cs-stack-sm > * + * {
    margin-top: .75rem;
}

/* Contenedores de texto largos (mejor ancho de lectura) */
.cs-text-narrow {
    max-width: 780px;
}

/* ===========================
   GLASSMORPHISM / NEUMORFISMO
   =========================== */

.cs-glass {
    background: rgba(15,23,42,0.78);
    border-radius: var(--cs-radius-lg);
    border: 1px solid var(--cs-border);
    box-shadow: 0 22px 55px rgba(15,23,42,0.9);
    backdrop-filter: blur(26px);
    padding: 1.6rem 1.8rem;
}

.cs-neu {
    border-radius: var(--cs-radius-md);
    border: 1px solid rgba(148,163,184,0.6);
    background: #0b1120;
    box-shadow:
        6px 6px 14px rgba(15,23,42,0.95),
        -4px -4px 10px rgba(248,250,252,0.06);
    transition: all .2s ease-out;
}

.cs-neu:hover {
    transform: translateY(-1px);
    box-shadow:
        10px 10px 20px rgba(15,23,42,0.95),
        -6px -6px 14px rgba(248,250,252,0.08);
}

/* ===========================
   LOGOS / BANNERS FLOTANTES
   =========================== */

.cs-floating-logo {
    width: 120px;
    height: 50px;
    border-radius: 999px;
    border: 1px solid rgba(148,163,184,0.4);
    background: rgba(15,23,42,0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .78rem;
    color: #e5e7eb;
    position: relative;
    overflow: hidden;
}

.cs-floating-logo::before {
    content: "";
    position: absolute;
    inset: -40%;
    background: radial-gradient(circle at 0 0, var(--cs-accent-soft), transparent 55%);
    opacity: .5;
}

/* Imágenes / logos flotando sutilmente */
.float-slow { animation: floatY 10s ease-in-out infinite; }
.float-medium { animation: floatY 7s ease-in-out infinite; }
.float-fast { animation: floatY 5s ease-in-out infinite; }

@keyframes floatY {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-10px); }
}

/* ===========================
   ANIMACIONES DE ENTRADA
   =========================== */

.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: all .6s ease-out;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }

/* ===========================
   BACKGROUNDS ANIMADOS GLOBALES
   =========================== */

.cs-orbit {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background:
        radial-gradient(circle at 10% 20%, rgba(56,189,248,0.18), transparent 60%),
        radial-gradient(circle at 90% 80%, rgba(55,65,81,0.7), transparent 65%);
}

.cs-bg-orbit {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background:
        radial-gradient(circle at 20% 10%, rgba(56,189,248,0.25), transparent 60%),
        radial-gradient(circle at 80% 90%, rgba(15,23,42,0.8), transparent 60%);
}

/* ===========================
   HERO HOME + HEROS INTERNOS
   =========================== */

/* Home hero y heroes internos comparten estructura */
.hero-section,
.cs-animated-bg {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    color: #fff;
}

/* Alturas mínimas */
.hero-section {
    min-height: 75vh;
}

.cs-animated-bg {
    min-height: 55vh;
}

/* Capa de imagen (home + internos) */
.hero-section::before,
.cs-animated-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1.03);
    z-index: -2;
}

/* Fallback genérico para cualquier hero interno sin clase específica */
.cs-animated-bg::before {
    background-image: url("../img/hero-generic.jpg");
}

/* Imagen específica del home */
.hero-section::before {
    background-image: url("../img/hero-home.jpg");
}

/* ===== Imagenes específicas por sección interna =====
   (Guárdalas en /public/assets/img/)
   hero-asesoria.jpg, hero-trading.jpg, hero-mercados.jpg,
   hero-noticias.jpg, hero-recursos.jpg, hero-contacto.jpg,
   hero-agendar.jpg, hero-legal.jpg
*/

.cs-hero-asesoria.cs-animated-bg::before {
    background-image: url("../img/hero-asesoria.jpg");
}

.cs-hero-trading.cs-animated-bg::before {
    background-image: url("../img/hero-trading.jpg");
}

.cs-hero-mercados.cs-animated-bg::before {
    background-image: url("../img/hero-mercados.jpg");
}

.cs-hero-noticias.cs-animated-bg::before {
    background-image: url("../img/hero-noticias.jpg");
}

.cs-hero-recursos.cs-animated-bg::before {
    background-image: url("../img/hero-recursos.jpg");
}

.cs-hero-contacto.cs-animated-bg::before {
    background-image: url("../img/hero-contacto.jpg");
}

.cs-hero-agendar.cs-animated-bg::before {
    background-image: url("../img/hero-agendar.jpg");
}

.cs-hero-legal.cs-animated-bg::before {
    background-image: url("../img/hero-legal.jpg");
}

.cs-hero-riesgo.cs-animated-bg::before {
    background-image: url("../img/hero-riesgo.jpg");
}

.cs-hero-activos.cs-animated-bg::before {
    background-image: url("../img/hero-activos.jpg");
}

.cs-hero-fondos.cs-animated-bg::before {
    background-image: url("../img/hero-fondos.jpg");
}

/* Overlay compartido (mismo look del index) */
.hero-section::after,
.cs-animated-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: 
        radial-gradient(circle at 10% 20%, rgba(43, 42, 42, 0.534), transparent 60%),
        radial-gradient(circle at 80% 80%, rgba(6, 51, 22, 0.74), transparent 65%),
        linear-gradient(to bottom, rgba(10, 16, 29, .9), rgba(15,23,42,0.98));
    mix-blend-mode: multiply;
    opacity: .96;
    pointer-events: none;
    z-index: -1;
}

/* Contenido del hero por encima del overlay */
.hero-content {
    position: relative;
    z-index: 2;
}

/* Elementos del hero */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    border-radius: 999px;
    background: rgba(15,23,42,0.8);
    border: 1px solid rgba(148,163,184,0.5);
    font-size: 0.8rem;
}

.hero-badge span.dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #22c55e;
}

.hero-title,
.cs-hero-title {
    font-size: clamp(2.2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
}

.hero-highlight {
    color: #38bdf8;
}

.cs-hero-subtitle {
    max-width: 760px;
}

.hero-card {
    background: rgba(15,23,42,0.9);
    border-radius: 1.25rem;
    border: 1px solid rgba(148,163,184,0.4);
    backdrop-filter: blur(18px);
}


.cs-hero-noticias.cs-animated-bg::before {
    background-image: url("../img/hero-noticias.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.cs-hero-contacto.cs-animated-bg::before {
    background-image: url("../img/hero-contacto.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}





/* ===========================
   CARDS / SERVICIOS / PARALLAX
   =========================== */

.cs-service-card {
    border-radius: 1.2rem;
    border: 1px solid rgba(148,163,184,0.25);
    padding: 1.4rem 1.5rem;
    box-shadow: 0 14px 30px rgba(15,23,42,0.12);
    background: #ffffff;
    transition: transform .18s ease-out, box-shadow .18s ease-out, border-color .18s ease-out;
}

.cs-service-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(15,23,42,0.18);
    border-color: rgba(56,189,248,0.45);
}

/* Cards en grids (blog, pilares, etc.) */
.cs-card-grid .card {
    height: 100%;
    padding: 1.6rem 1.7rem;
    border-radius: 1.1rem;
    box-shadow: 0 12px 32px rgba(15,23,42,0.08);
    border: none;
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.cs-card-grid .card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(15,23,42,0.14);
}

.cs-section-row + .cs-section-row {
    margin-top: 2.5rem;
}

/* Efecto parallax ligero (usado con JS opcional) */
.cs-parallax {
    will-change: transform;
    transition: transform 0.5s ease-out;
}

/* ===========================
   HOME (index.php)
   =========================== */

.service-icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15,23,42,0.05);
}

.trusted-badge {
    border-radius: 1rem;
    border: 1px solid #e5e7eb;
    background: #ffffff;
}

.logo-pill {
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    border: 1px dashed #d4d4d8;
    font-size: 0.8rem;
}

.news-thumb {
    width: 90px;
    height: 70px;
    object-fit: cover;
    border-radius: 0.5rem;
}

.text-light-50 {
    color: rgba(255,255,255,0.7) !important;
}

/* ===========================
   CONTACTO (contact.php)
   =========================== */

.cs-contact-shell {
    padding: 3rem 0 4rem;
}

.cs-glass-card {
    background: var(--cs-glass);
    border-radius: 1.5rem;
    border: 1px solid var(--cs-border);
    box-shadow: 0 18px 45px rgba(15,23,42,0.65);
    backdrop-filter: blur(24px);
}

.cs-neu-btn {
    border-radius: 999px;
    border: 1px solid rgba(148,163,184,0.6);
    box-shadow:
        6px 6px 12px rgba(15,23,42,0.9),
        -4px -4px 10px rgba(249,250,251,0.08);
    transition: all 0.2s ease-out;
}

.cs-neu-btn:hover {
    transform: translateY(-1px);
    box-shadow:
        10px 10px 18px rgba(15,23,42,0.9),
        -6px -6px 14px rgba(249,250,251,0.12);
}

/* Formulario dentro de tarjetas glass en contacto */
.cs-glass-card .form-control,
.cs-glass-card .form-check-input {
    background-color: rgba(15,23,42,0.75);
    border: 1px solid rgba(148,163,184,0.6);
    color: #e5e7eb;
}

.cs-glass-card .form-control::placeholder {
    color: #9ca3af;
}

.cs-glass-card .form-control:focus {
    border-color: var(--cs-accent);
    box-shadow: 0 0 0 1px var(--cs-accent);
}

/* Modal glass genérico (contacto / scheduler) */
.cs-modal-glass .modal-content {
    background: rgba(15,23,42,0.9);
    backdrop-filter: blur(22px);
    border-radius: 1.4rem;
    border: 1px solid rgba(148,163,184,0.5);
    color: #e5e7eb;
    box-shadow: 0 20px 60px rgba(15,23,42,0.9);
}

.cs-modal-glass .modal-header {
    border-bottom: 1px solid rgba(148,163,184,0.4);
}

.cs-modal-glass .btn-close {
    filter: invert(1);
}

/* ===========================
   SCHEDULER (agendar-llamada.php)
   =========================== */

.cs-shell {
    padding: 3rem 0 4rem;
}

.cs-neu-slot {
    border-radius: .9rem;
    border: 1px solid rgba(148,163,184,0.4);
    background: rgba(15,23,42,0.9);
    color: #e5e7eb;
    font-size: 0.85rem;
    padding: .4rem .7rem;
    box-shadow:
        4px 4px 8px rgba(15,23,42,0.95),
        -3px -3px 7px rgba(248,250,252,0.06);
    cursor: pointer;
    transition: all .18s ease-out;
}

.cs-neu-slot:hover:not(.disabled) {
    transform: translateY(-1px);
    box-shadow:
        7px 7px 14px rgba(15,23,42,0.95),
        -5px -5px 10px rgba(248,250,252,0.08);
}

.cs-neu-slot.selected {
    border-color: var(--cs-accent);
    background: linear-gradient(135deg, #38bdf8, #0ea5e9);
    color: #020617;
}

.cs-neu-slot.disabled {
    opacity: .3;
    cursor: not-allowed;
}

.cs-help {
    font-size: .85rem;
    color: #9ca3af;
}

/* Formulario del scheduler */
.cs-shell .form-control {
    background-color: rgba(15,23,42,0.9);
    border: 1px solid rgba(148,163,184,0.6);
    color: #e5e7eb;
}

.cs-shell .form-control::placeholder {
    color: #9ca3af;
}

.cs-shell .form-control:focus {
    border-color: var(--cs-accent);
    box-shadow: 0 0 0 1px var(--cs-accent);
}

/* ===========================
   BLOG (blog.php)
   =========================== */

.cs-page-header {
    padding: 3rem 0 2rem;
}

.cs-page-header h1 {
    font-size: clamp(1.8rem, 3vw, 2.3rem);
    font-weight: 700;
}

.cs-card {
    border-radius: 1rem;
    border: none;
    box-shadow: 0 10px 30px rgba(15,23,42,0.07);
    overflow: hidden;
    background-color: #ffffff;
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.cs-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 38px rgba(15,23,42,0.12);
}

.cs-card-img {
    height: 180px;
    object-fit: cover;
}

.cs-card-title {
    font-size: 1rem;
    font-weight: 600;
}

.cs-card-meta {
    font-size: 0.8rem;
}

.cs-card-excerpt {
    font-size: 0.9rem;
    color: #6b7280;
}

/* ===========================
   ARTICLE (article.php)
   =========================== */

.cs-article-header {
    padding: 3rem 0 2rem;
}

.cs-article-header h1 {
    font-size: clamp(1.9rem, 3.4vw, 2.5rem);
    font-weight: 700;
}

.cs-article-meta {
    font-size: 0.85rem;
    color: #6b7280;
}

.cs-article-wrapper {
    background-color: #ffffff;
    border-radius: 1.25rem;
    box-shadow: 0 10px 30px rgba(15,23,42,0.08);
    padding: 2rem 2rem 2.5rem;
}

.cs-article-content {
    font-size: 1rem;
    line-height: 1.7;
    color: #111827;
}

.cs-article-content p {
    margin-bottom: 1rem;
}

.cs-article-content h2,
.cs-article-content h3,
.cs-article-content h4 {
    margin-top: 1.75rem;
    margin-bottom: 0.75rem;
}

.cs-article-content ul,
.cs-article-content ol {
    margin-bottom: 1rem;
}

.cs-article-cover {
    border-radius: 1rem;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

/* ===========================
   NAVBAR / HEADER
   =========================== */

.navbar-brand img {
    height: 40px;
    width: auto;
}

.cs-header {
    position: sticky;
    top: 0;
    z-index: 1040;
}

.cs-navbar {
    padding-top: .55rem;
    padding-bottom: .55rem;
    background: linear-gradient(90deg, rgba(15,23,42,0.92), rgba(15,23,42,0.96));
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(148,163,184,0.20);
    transition: background .25s ease, box-shadow .25s ease, padding .2s ease;
}

.cs-header-scrolled .cs-navbar {
    padding-top: .3rem;
    padding-bottom: .3rem;
    background: rgba(15,23,42,0.98);
    box-shadow: 0 10px 30px rgba(15,23,42,0.55);
}

/* Links del nav con pastilla + subrayado animado */
.navbar-dark .navbar-nav .nav-link {
    position: relative;
    font-size: .9rem;
    padding: .35rem .8rem;
    border-radius: 999px;
    color: #cbd5f5;
    transition: color .2s ease-out, background .2s ease-out, transform .1s ease-out;
}

.navbar-dark .navbar-nav .nav-link::after {
    content: "";
    position: absolute;
    left: 18%;
    right: 18%;
    bottom: .1rem;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #22c55e, #38bdf8);
    transform: scaleX(0);
    transform-origin: center;
    opacity: 0;
    transition: transform .2s ease-out, opacity .2s ease-out;
}

.navbar-dark .navbar-nav .nav-link:hover {
    background: rgba(148,163,184,0.15);
    color: #ffffff;
    transform: translateY(-1px);
}

.navbar-dark .navbar-nav .nav-link:hover::after {
    transform: scaleX(1);
    opacity: 1;
}

/* Estado activo: sólo pastilla verde, SIN línea extra */
.navbar-dark .navbar-nav .nav-link.active {
    background: #22c55e;
    color: #020617;
    font-weight: 600;
}

.navbar-dark .navbar-nav .nav-link.active::after {
    transform: scaleX(0);
    opacity: 0;
}

/* Botón CTA del nav */
.cs-nav-cta {
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(34,197,94,0.45);
    border: none;
    transition: transform .1s ease, box-shadow .1s ease, background .15s ease, color .15s ease;
}

.cs-nav-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(34,197,94,0.65);
    background: #16a34a;
    color: #020617;
}

/* Logos alternos según scroll */
.cs-logo-dark {
    display: none;
}

.cs-header-scrolled .cs-logo-light {
    display: none;
}

.cs-header-scrolled .cs-logo-dark {
    display: inline-block;
}

/* ===========================
   ÍCONOS / IMÁGENES
   =========================== */

.cs-icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(22,163,74,0.12);
    color: #16a34a;
}

.cs-img-float {
    will-change: transform;
    animation: imgFloat 12s ease-in-out infinite;
}

@keyframes imgFloat {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-10px) scale(1.02); }
}

/* ===========================
   CONTENIDO LEGAL / EDUCATIVO
   =========================== */

.cs-legal-panel {
    border-radius: 1.5rem;
    padding: 1.6rem 1.8rem;
    border: 1px solid rgba(148,163,184,0.35);
    background: radial-gradient(circle at top left,
                rgba(34,197,94,0.09),
                rgba(15,23,42,0.95));
    color: #e5e7eb;
    font-size: .9rem;
}

.cs-legal-panel h3 {
    font-size: .95rem;
    margin-bottom: .75rem;
}

.cs-legal-panel ul {
    padding-left: 1.1rem;
    margin-bottom: .75rem;
}

.cs-legal-panel li {
    margin-bottom: .25rem;
}

.cs-legal-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .6rem;
    border-radius: 999px;
    background: #0b1120;
    color: #e5e7eb;
    font-size: .75rem;
}

.cs-legal-chip i {
    font-size: .85rem;
}

/* Simulador de CFDs */
.cs-sim-card {
    border-radius: 1.25rem;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(15,23,42,0.06);
}

.cs-sim-result {
    font-size: 1.25rem;
    font-weight: 600;
}

.cs-sim-result.positive {
    color: #22c55e;
}

.cs-sim-result.negative {
    color: #ef4444;
}

.cs-sim-note {
    font-size: .8rem;
    color: #6b7280;
}

/* ===========================
   FORM LAYOUTS / GRID
   =========================== */

.cs-form-grid .form-control,
.cs-form-grid .form-select {
    padding: .7rem .85rem;
}

.cs-form-grid .form-label {
    margin-bottom: .35rem;
    font-weight: 500;
}

.cs-form-grid .row + .row {
    margin-top: 1rem;
}

/* ===========================
   FOOTER
   =========================== */

.footer-main {
    background: #020617;
    color: #e5e7eb;
    padding: 3rem 0 2rem;
    margin-top: 0;
    font-size: .9rem;
}

.footer-top {
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(148,163,184,0.24);
}

.footer-brand-logo {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: .75rem;
}

.footer-brand-logo img {
    height: 40px;
}

.footer-brand-title {
    font-weight: 600;
    letter-spacing: .02em;
}

.footer-brand-text {
    font-size: .85rem;
    color: #9ca3af;
    margin-bottom: .75rem;
}

.footer-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .7rem;
    border-radius: 999px;
    border: 1px solid rgba(148,163,184,0.4);
    font-size: .75rem;
    color: #e5e7eb;
    margin: 0 .4rem .4rem 0;
}

.footer-chip i {
    font-size: .85rem;
}

.footer-links-title {
    font-weight: 600;
    margin-bottom: .75rem;
    font-size: .95rem;
}

.footer-links-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links-list li + li {
    margin-top: .35rem;
}

.footer-links-list a {
    color: #e5e7eb;
    text-decoration: none;
    opacity: .85;
    transition: opacity .2s ease, transform .15s ease, color .15s ease;
}

.footer-links-list a:hover {
    opacity: 1;
    transform: translateX(2px);
    color: #22c55e;
}

.footer-contact small {
    color: #9ca3af;
}

.footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding-top: 1.2rem;
    font-size: .8rem;
    color: #9ca3af;
}

.footer-bottom a {
    color: #9ca3af;
    text-decoration: none;
}

.footer-bottom a:hover {
    color: #22c55e;
}

.footer-social {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.footer-social a {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(148,163,184,0.5);
    color: #e5e7eb;
    text-decoration: none;
    transition: all .2s ease;
    font-size: 1rem;
}

.footer-social a:hover {
    transform: translateY(-2px);
    border-color: #22c55e;
    color: #22c55e;
    box-shadow: 0 0 0 1px rgba(34,197,94,0.25);
}

/* Evita hueco raro antes del footer */
main > section:last-of-type {
    margin-bottom: 0;
}

/* ===========================
   BOTÓN FLOTANTE VOLVER ARRIBA
   =========================== */

.cs-back-to-top {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 30% 0%, #22c55e, #15803d);
    color: #020617;
    border: none;
    box-shadow: 0 12px 30px rgba(22,163,74,0.8);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease, box-shadow .15s ease, background .15s ease;
    z-index: 1080;
}

.cs-back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* ===========================
   COOKIE BANNER & MODAL
   =========================== */

.cs-cookie-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1090;
    display: none;
    pointer-events: none;
}

.cs-cookie-banner-inner {
    max-width: 960px;
    margin: 0 auto 1rem;
    background: rgba(15, 23, 42, 0.96);
    color: #e5e7eb;
    border-radius: 1.25rem;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.6);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    pointer-events: auto;
}

@media (max-width: 768px) {
    .cs-cookie-banner-inner {
        margin: 0.5rem;
        flex-direction: column;
        align-items: stretch;
    }
}

.cs-cookie-banner-title {
    font-weight: 600;
    margin-bottom: .25rem;
}

.cs-cookie-banner-text {
    font-size: .85rem;
    color: #cbd5f5;
}

.cs-cookie-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-left: auto;
}

.cs-cookie-btn {
    border-radius: 999px;
    padding: .4rem .9rem;
    font-size: .8rem;
    border: 1px solid rgba(148, 163, 184, 0.7);
    background: transparent;
    color: #e5e7eb;
    cursor: pointer;
    transition: all .15s ease;
}

.cs-cookie-btn-primary {
    background: #22c55e;
    border-color: #22c55e;
    color: #020617;
    font-weight: 600;
}

.cs-cookie-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.4);
}

/* MODAL DE COOKIES */

.cs-cookie-modal {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: none;
    align-items: center;
    justify-content: center;
}

.cs-cookie-modal.is-visible {
    display: flex;
}

.cs-cookie-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.68);
    backdrop-filter: blur(4px);
}

.cs-cookie-modal-dialog {
    position: relative;
    z-index: 1;
    max-width: 620px;
    width: 100%;
    margin: 0 1rem;
    background: #020617;
    color: #e5e7eb;
    border-radius: 1.5rem;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.8);
    padding: 1.5rem 1.75rem;
}

.cs-cookie-modal-title {
    font-size: 1.1rem;
    font-weight: 600;
}

.cs-cookie-modal-close {
    position: absolute;
    right: 1rem;
    top: 1rem;
    border: none;
    background: transparent;
    color: #9ca3af;
    font-size: 1.3rem;
    cursor: pointer;
}

.cs-cookie-option {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    padding: .8rem 0;
    border-bottom: 1px solid rgba(51, 65, 85, 0.7);
}

.cs-cookie-option:last-of-type {
    border-bottom: none;
}

.cs-cookie-option-title {
    font-size: .95rem;
    font-weight: 500;
    margin-bottom: .1rem;
}

.cs-cookie-option-desc {
    font-size: .8rem;
    color: #9ca3af;
}

.cs-cookie-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: 1rem;
}

/* ===========================
   BREADCRUMBS EN HÉROES OSCUROS
   =========================== */

/* Contenedor sin fondo extra */
.hero-section .breadcrumb,
.cs-animated-bg .breadcrumb {
    background: transparent;
    margin-bottom: 0.5rem;
}

/* Ítems y separadores "/" en claro */
.hero-section .breadcrumb-item,
.hero-section .breadcrumb-item + .breadcrumb-item::before,
.cs-animated-bg .breadcrumb-item,
.cs-animated-bg .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(45, 224, 90, 0.973) !important;  /* casi blanco */
}

/* Enlaces dentro del breadcrumb (ej. "Inicio") */
.hero-section .breadcrumb-item a,
.cs-animated-bg .breadcrumb-item a {
    color: rgba(248, 250, 252, 0.9) !important;
    text-decoration: none;
}

/* Hover del enlace */
.hero-section .breadcrumb-item a:hover,
.cs-animated-bg .breadcrumb-item a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

/* Item activo (página actual) aún más marcado */
.hero-section .breadcrumb-item.active,
.cs-animated-bg .breadcrumb-item.active {
    color:  rgba(45, 224, 90, 0.973)!important;
    font-weight: 500;
}

/* =========================================
   AJUSTES A PÁGINA DE ASESORÍA
   Cards en blanco como el resto del sitio
   ========================================= */

/* Card de resultado del simulador de CFDs */
.cs-sim-card {
    background: #ffffff !important;
    color: #111827;
    border-radius: 1.25rem;
    border: 1px solid #e5e7eb;
    box-shadow: 0 14px 32px rgba(15,23,42,0.10);
}

/* Texto dentro del simulador */
.cs-sim-card p,
.cs-sim-card li,
.cs-sim-card small {
    color: #4b5563;
}

/* Resultado positivo / negativo se mantiene en colores vivos */
.cs-sim-result.positive {
    color: #22c55e;
}
.cs-sim-result.negative {
    color: #ef4444;
}

/* Panels legales / “Lo que hacemos / Lo que NO hacemos / Aviso importante” */
.cs-legal-panel {
    background: #ffffff !important;   /* blanco liso */
    color: #111827;
    border-radius: 1.5rem;
    border: 1px solid #e5e7eb;
    box-shadow: 0 14px 32px rgba(15,23,42,0.08);
    font-size: .9rem;
}

/* Texto interno de los panels legales */
.cs-legal-panel h3 {
    color: #111827;
}

.cs-legal-panel p,
.cs-legal-panel li {
    color: #4b5563;
}

/* Chips negros se mantienen para contraste */
.cs-legal-chip {
    background: #0b1120;
    color: #e5e7eb;
}
/* ===========================
   HÉROES INTERNOS RESTANTES
   (usan el mismo overlay oscuro global de .cs-animated-bg)
   =========================== */

/* Gestión de riesgo */
.cs-hero-riesgo.cs-animated-bg::before {
    background-image: url("../img/hero-riesgo.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}

/* Gestión de activos */
.cs-hero-activos.cs-animated-bg::before {
    background-image: url("../img/hero-activos.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}

/* Fondos de inversión empresariales */
.cs-hero-fondos.cs-animated-bg::before {
    background-image: url("../img/hero-fondos.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}

/* Recursos (guías, plantillas, glosario, etc.) */
.cs-hero-recursos.cs-animated-bg::before {
    background-image: url("../img/hero-recursos.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}

/* Páginas legales (privacidad, términos, cookies, aviso legal…) */
.cs-hero-legal.cs-animated-bg::before {
    background-image: url("../img/hero-legal.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}

/* Agendar llamada (scheduler) */
.cs-hero-schedule.cs-animated-bg::before {
    background-image: url("../img/hero-schedule.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(1.05) contrast(1.05);
}/* End custom CSS */