:root{
    --primary-700:#274a95;
    --primary-600:#2c62b2;
    --primary-500:#4b7cd3;
    --ink:#0b1220;
    --soft:#f6f8fc;
    --dark:#0c1220;
}
body{font-family:"Montserrat",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;color:var(--ink);}

.navbar{backdrop-filter:saturate(180%) blur(8px); background:rgba(255,255,255,.9)!important;}
.navbar .nav-link{font-weight:600;}

.btn-primary{background:var(--primary-600);border-color:var(--primary-600);}
.btn-primary:hover{background:var(--primary-700);border-color:var(--primary-700);}

/* HERO */
.hero{
    position:relative;
    background: radial-gradient(1200px 600px at 80% -10%, var(--primary-500) 0%, var(--primary-600) 35%, var(--primary-700) 70%, #0c1a3a 100%);
    color:#fff; padding: 96px 0 80px; overflow:hidden;
}
.hero:after{
    content:""; position:absolute; inset:0;
    background:url('images/logotipo.png') no-repeat right -60px bottom -40px/560px auto;
    opacity:.06; pointer-events:none;
}
.hero h1{font-weight:800; letter-spacing:.2px;}
.hero p.lead{opacity:.95; max-width: 900px;}

/* SECTION HEADERS */
.section-title{font-weight:800; letter-spacing:.3px; color:var(--ink);}
.eyebrow{display:inline-block; font-size:.85rem; letter-spacing:.14em; text-transform:uppercase; color:var(--primary-600); font-weight:700; margin-bottom:.5rem;}

/* CARDS */
.feature-card{
    height:100%; border:1px solid #e9eef7; background:#fff;
    box-shadow:0 4px 18px rgba(16,24,40,.06);
    transition: transform .25s ease, box-shadow .25s ease;
    border-radius:1rem;
}
.feature-card:hover{ transform: translateY(-4px); box-shadow:0 10px 28px rgba(16,24,40,.12); }

/* PRODUCTS (dark section) */
#productos{ background:linear-gradient(180deg, #0a0f1c 0%, #111a2f 100%); color:#e9eef7; }
.product-card{
    border:none; background:#121a2c; color:#dfe8ff;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
    transition:transform .25s ease, box-shadow .25s ease;
    border-radius:1rem; overflow:hidden;
}
.product-card:hover{ transform: translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,.5); }
.product-media{
    position:relative; overflow:hidden; aspect-ratio: 16/10; background:#0d1526;
}
.product-media img{ width:100%; height:100%; object-fit:cover; display:block; opacity:.95; }
.product-badge{
    position:absolute; top:12px; left:12px; background:rgba(76, 114, 216,.9);
    padding:.35rem .6rem; font-size:.8rem; border-radius:.5rem; font-weight:700;
}
.product-body{ padding:1.1rem 1.2rem 1.2rem; }
.product-title{ font-weight:700; margin-bottom:.25rem; }
.product-desc{ opacity:.9; margin:0; }

/* SERVICES */
.service-card{
    border:1px solid #e8eef8; background:#fff; border-radius:1rem;
    padding:1.2rem 1.3rem; height:100%;
    box-shadow:0 6px 22px rgba(16,24,40,.08);
    transition:transform .25s ease, box-shadow .25s ease;
}
.service-card:hover{ transform:translateY(-4px); box-shadow:0 12px 30px rgba(16,24,40,.12); }
.service-icon{
    width:52px; height:52px; border-radius:12px;
    display:grid; place-items:center; font-size:1.5rem; color:#fff;
    background:linear-gradient(135deg, var(--primary-600), var(--primary-700));
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.2), 0 10px 22px rgba(44,98,178,.3);
}

/* TESTIMONIALS */
.quote{
    border:0; background:#fff; border-radius:1rem;
    box-shadow:0 6px 22px rgba(16,24,40,.08);
    padding:1.25rem 1.25rem 1.25rem 1.25rem;
    position:relative;
}
.quote .bi-quote{
    position:absolute; top:-12px; left:-12px; font-size:2.5rem; color:var(--primary-600); opacity:.15;
}

/* FAQ */
.accordion-button:focus{ box-shadow:none; }
.accordion-button:not(.collapsed){ color:var(--primary-700); background:#eef4ff; }

/* FOOTER */
footer{ background:#0c1a3a; color:#c9d2f3; }
footer a{ color:#fff; text-decoration:none; }
footer a:hover{ text-decoration:underline; }

.bg-soft{ background:var(--soft); }
.shadow-soft{ box-shadow:0 6px 26px rgba(16,24,40,.08); }
.rounded-2xl{ border-radius:1rem; }
html{ scroll-behavior:smooth; }


@media screen and (max-width:1400px){

}

@media screen and (max-width:1200px){

}

@media screen and (max-width:992px){

}

@media screen and (max-width:768px){

}

@media screen and (max-width:576px){
    
}