
:root{
  --brand:#0B5FA4; --brand-2:#0C2D48; --accent:#E63946;
  --dark:#0b1f34; --text:#1c2a3a; --muted:#6b7b8a;
}

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text)}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Navbar */
.navbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e6ecf3}
.navbar .top{display:flex;align-items:center;gap:24px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:20px;color:var(--dark)}










.carrusel {
  width: 80vw;     /* 80% del ancho de la pantalla */
  height: 60vh;    /* 60% de la altura de la pantalla */
  margin: 0 auto;
  overflow: hidden; 
  position: relative;
}

.carrusel__track {
  /* 5 “slides” de 100% cada uno, en columnas */
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  height: 100%;
  animation: slide 25s infinite;
}

.carrusel__item {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;        /* evita espacios en línea */
}

/* 5 imágenes × 5s = 25s. Mantiene cada imagen 5s y avanza. */
@keyframes slide {
  0%,   16%  { transform: translateX(0%); }
  20%,  36%  { transform: translateX(-100%); }
  40%,  56%  { transform: translateX(-200%); }
  60%,  76%  { transform: translateX(-300%); }
  80%, 100%  { transform: translateX(-400%); }
}

/* Accesibilidad: detener animación si el usuario prefiere menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .carrusel__track { animation: none; }
}








/* === LOGO (solo en navbar) === */
.navbar .brand img{
  max-height: 100px !important;  /* Aumentado a 100px */
  height:auto !important;
  width:auto !important;
}

/* Search / Menu */
.search{flex:1}
.search input{width:100%;padding:10px 14px;border:1px solid #d6deea;border-radius:8px}

.menu{display:flex;gap:18px;align-items:center}
.menu a{padding:10px 6px;font-weight:600;display:inline-flex;align-items:center;gap:6px;line-height:1}
.dropdown{position:relative}
.dropdown:hover .dropdown-menu{display:block}
.dropdown-menu{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid #e6ecf3;border-radius:8px;min-width:240px;box-shadow:0 12px 30px rgba(0,0,0,.08)}
.dropdown-menu a{display:block;padding:10px 14px;color:var(--text)}

/* Caret para triggers con submenu */
.dropdown > a::after{content:"▾";font-size:12px;margin-left:6px;color:var(--brand)}

/* Language submenu + banderas */
.lang-item{display:flex;align-items:center;gap:10px;padding:10px 14px;color:var(--text)}
.lang-item img{width:22px;height:auto;border-radius:2px}
.lang-item:hover{background:#f3f7fd}
.lang-dd > a.lang-link{display:inline-flex;align-items:center;gap:8px}
.lang-dd > a.lang-link img{width:20px;height:auto;border-radius:2px}

/* Botones */
.btn{display:inline-block;padding:12px 16px;border-radius:10px;font-weight:700}
.btn-primary{background:var(--brand);color:#fff}
.btn-outline{border:2px solid var(--brand);color:var(--brand)}

/* Secciones y grids */
.hero{background:#f7fbff}
.grid{display:grid;gap:28px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.h1{font-size:44px;line-height:1.1;margin:0 0 16px;font-weight:800;color:var(--brand-2)}
.p{font-size:18px;color:var(--muted);margin:0 0 22px}
.section{padding:64px 0}
.section.dark{background:var(--dark);color:#fff}
.section.alt{background:#f9fbfe}
.card{background:#fff;border:1px solid #e6ecf3;border-radius:14px;padding:20px;box-shadow:0 6px 20px rgba(20,40,80,.04)}
.icon{width:48px;height:48px;border-radius:12px;background:#e8f2fb;display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:var(--brand);margin-bottom:10px}
.stats{display:flex;gap:36px;flex-wrap:wrap}
.stat{min-width:140px}
.stat .n{font-size:44px;font-weight:900}
.stat .l{color:#cbe2ff;margin-top:-8px}
.list{list-style:none;padding:0;margin:0;display:grid;gap:20px}
.col-2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.col-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tag{display:inline-block;background:#eaf2ff;color:var(--brand);padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px;margin-bottom:8px}
.banner{position:relative;border-radius:16px;overflow:hidden}

/* === CONTROL DURO DE HERO/BANNERS === */
.hero .banner,
.section .banner,
.banner{
  max-height:420px;
  overflow:hidden;
}
.hero .banner img,
.section .banner img,
.banner img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block;
}

/* Footer */
.footer{background:#0f2238;color:#fff;padding:60px 0}
.footer h4{margin:0 0 10px}
.footer a{color:#cfe2ff}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:28px}
.footer .contact a{display:inline-block;background:#1b3b5d;color:#fff;padding:12px 16px;border-radius:12px;margin:6px 0}

/* Responsive */
@media (max-width:960px){
  .grid-2,.col-2,.col-3{grid-template-columns:1fr}
  .menu{display:none}
  .navbar .top{justify-content:space-between}
  .footer .cols{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .hero .banner, .section .banner, .banner{max-height:280px}
  .navbar .brand img{max-height:90px}
}