/* Mobile-first. Usa imágenes NUMERADAS que ya subiste. */
:root{
  /* MAPEA AQUÍ tus íconos/logos (ajusta solo el número si cambia) */
  --logo: url("./images/logos%20e%20iconos/1.png");
  --ico-whatsapp: url("./images/logos%20e%20iconos/2.png");
  --ico-data: url("./images/logos%20e%20iconos/3.png");
  --ico-auto: url("./images/logos%20e%20iconos/4.png");
  --ico-ai: url("./images/logos%20e%20iconos/5.png");
  /* Fondos enumerados */
  --bg-hero: url("./images/fondos/1.png");
  --bg-partida: url("./images/fondos/2.png");
  --bg-data: url("./images/fondos/3.png");
  --bg-auto: url("./images/fondos/4.png");
  --bg-ai: url("./images/fondos/5.png");
  /* Colores */
  --bg:#0B1221; --panel:#0F172A; --fg:#EAF0FF; --muted:#A0AEC0; --border:#1F2A44;
  --brand:#29E3A0; --data:#0EA5E9; --auto:#F59E0B; --ai:#8B5CF6;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55}
img{max-width:100%;display:block}a{text-decoration:none;color:inherit}
.container{width:min(1160px,100% - 32px);margin-inline:auto}.row{display:flex;gap:10px;flex-wrap:wrap}
/* Botones */
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;font-weight:800;border:1px solid transparent;transition:transform .18s ease,filter .2s ease}
.btn-cta{background:var(--brand);color:#072116;box-shadow:0 10px 26px rgba(41,227,160,.24)}
.btn-ghost{background:transparent;border-color:#314269;color:#E6ECFF}
.btn-cta::before{content:"";width:18px;height:18px;background:var(--ico-whatsapp) center/contain no-repeat;display:inline-block}
.btn-cta:hover{transform:translateY(-1px);filter:brightness(1.05)}
/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,18,33,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav .inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand__logo{width:130px;height:28px;background:var(--logo) center/contain no-repeat}
.burger{display:inline-flex;gap:6px;align-items:center;color:#fff;background:none;border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:6px 10px}
.menu{display:none;gap:14px;align-items:center;color:#fff}
.menu a{color:#D8DEEA;padding:8px 10px;border-radius:8px}.menu a:hover{background:rgba(255,255,255,.08)}
@media(min-width:900px){.burger{display:none}.menu{display:flex}}
.menu .dropdown{position:relative}.menu .submenu{display:none;position:absolute;top:100%;left:0;background:#0F172A;border:1px solid var(--border);border-radius:12px;padding:8px;min-width:220px;box-shadow:0 16px 40px rgba(0,0,0,.35)}
.menu .dropdown:hover .submenu{display:block}
/* Sticky CTA mobile */
.sticky-cta{position:fixed;inset:auto 0 0 0;background:rgba(11,18,33,.95);backdrop-filter:blur(8px);z-index:45;border-top:1px solid rgba(255,255,255,.06);padding:10px}
.sticky-cta .inner{display:flex;gap:10px}@media(min-width:900px){.sticky-cta{display:none}}
/* ==== HERO general ==== */
.hero {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  color: #fff;
  padding: 0;
}

/* Fondo fotográfico de la izquierda (./images/fondos/1.png) */
.hero-bg {
  position: absolute;
  inset: 0;
  background: url("./images/fondos/1.png") center right / cover no-repeat;
  z-index: -2;
}

/* Capa degradada para oscurecer la zona de texto */
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.70) 40%,
    rgba(0, 0, 0, 0.35) 65%,
    rgba(0, 0, 0, 0.00) 100%);
  z-index: -1;
}

/* Contenedor del contenido para centrar y limitar ancho */
.hero-content {
  width: min(1200px, 90%);
  margin: 0 auto;
  padding: 60px 0;
}

/* Título principal */
.hero-title {
  margin: 0 0 18px;
  font-size: clamp(32px, 6vw, 64px);
  line-height: 1.1;
  font-weight: 900;
}

/* Párrafos introductorios y de cierre */
.hero-intro,
.hero-sub {
  margin: 0;
  max-width: 65ch;
  color: #C9D3E3;
  font-size: clamp(14px, 2.5vw, 18px);
}

.hero-intro {
  margin-bottom: 12px;
}

/* Lista de verticales */
.hero-list {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 12px 0 12px;
}

.hero-list-icon img {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.hero-list-content p {
  margin: 0;
  font-size: clamp(15px, 2.6vw, 20px);
  font-weight: 800;
  line-height: 1.3;
  color: #69E23C; /* verde original del PDF */
}

/* Botón verde (WhatsApp) */
.btn-hero {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 24px;
  padding: 14px 20px;
  font-weight: 800;
  border-radius: 14px;
  text-decoration: none;
  color: #051807;
  background: #69E23C;
  box-shadow: 0 8px 20px rgba(105, 226, 60, 0.35);
  transition: transform 0.15s ease, filter 0.15s ease;
}

.btn-hero:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
}

.btn-icon {
  width: 20px;
  height: 20px;
}
/* Secciones */
section{padding:56px 0}.section-title{font-size:24px;margin:0 0 8px}
/* Partida */
.partida{position:relative}.partida::before{content:"";position:absolute;inset:0;background:var(--bg-partida) center/cover no-repeat;opacity:.28;pointer-events:none}
.overview{display:grid;gap:14px;margin-top:12px}@media(min-width:900px){.overview{grid-template-columns:repeat(3,1fr)}}
.o-card{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--border);border-radius:16px;background:rgba(15,23,42,.8);padding:14px}
.o-ico{width:40px;height:40px;border-radius:12px;flex:0 0 auto;background:#0F1830;border:1px solid var(--border)}
.o-ico.data{background:var(--ico-data) center/24px 24px no-repeat, #0F1830}
.o-ico.auto{background:var(--ico-auto) center/24px 24px no-repeat, #0F1830}
.o-ico.ai{background:var(--ico-ai) center/24px 24px no-repeat, #0F1830}
/* Verticales */
.vertical{position:relative;overflow:hidden;border-radius:18px;border:1px solid var(--border);background:var(--panel)}.band{height:4px}
.vertical__head{padding:18px;display:flex;gap:12px;align-items:center}.chip{display:inline-flex;gap:8px;align-items:center;padding:6px 10px;border-radius:999px;border:1px solid var(--border);font-weight:800;font-size:12px;background:#0B1427}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:12px 18px}@media(min-width:720px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{border:1px dashed var(--border);border-radius:12px;background:#0B1427;padding:12px;text-align:center}.kpi b{display:block;font-size:20px}
.services{display:grid;gap:12px;padding:0 18px 18px}@media(min-width:980px){.services{grid-template-columns:repeat(2,1fr)}}.service{border:1px solid var(--border);border-radius:14px;background:#0F1830}
.service summary{list-style:none;cursor:pointer;padding:14px;font-weight:800;display:flex;align-items:center;justify-content:space-between}.service summary::-webkit-details-marker{display:none}.service .content{padding:0 14px 14px;color:#C9D3E3}
.data .band{background:var(--data)}.auto .band{background:var(--auto)}.ai .band{background:var(--ai)}
#bg-data{background:var(--bg-data) center/cover no-repeat;opacity:.25}#bg-auto{background:var(--bg-auto) center/cover no-repeat;opacity:.25}#bg-ai{background:var(--bg-ai) center/cover no-repeat;opacity:.25}.vbg{position:absolute;inset:0;pointer-events:none}
/* Logos */
.logos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}@media(min-width:680px){.logos{grid-template-columns:repeat(5,1fr)}}.logo{aspect-ratio:16/9;border:1px solid var(--border);border-radius:12px;background:#0D1730;display:block;padding:10px}
/* Nosotros/Contacto */
.section--alt{background:#0B1427;border:1px solid var(--border);border-radius:18px}.about{align-items:center}.about__text{flex:1 1 280px}.about__media{flex:1 1 280px}.about__media img{border-radius:16px;border:1px solid var(--border)}
.section--contact{background:linear-gradient(180deg,#0B1427,#0E1E48);border:1px solid var(--border);border-radius:18px}.contact{display:grid;gap:16px;align-items:center}@media(min-width:900px){.contact{grid-template-columns:1.2fr .8fr}}
/* Footer */
footer{background:#0B1221;color:#C7D0E0;padding:36px 0;border-top:1px solid rgba(255,255,255,.06)}.footer__inner{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}.brand__logo--foot{width:120px;height:26px;background:var(--logo) center/contain no-repeat}
/* Animaciones */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.reveal{opacity:0}.reveal.in{animation:fadeUp .6s cubic-bezier(.22,1,.36,1) forwards}.stagger>*{opacity:0}.stagger.in>*{animation:fadeUp .6s cubic-bezier(.22,1,.36,1) forwards}.stagger.in>*:nth-child(1){animation-delay:.06s}.stagger.in>*:nth-child(2){animation-delay:.12s}.stagger.in>*:nth-child(3){animation-delay:.18s}.stagger.in>*:nth-child(4){animation-delay:.24s}.stagger.in>*:nth-child(5){animation-delay:.30s}
:focus-visible{outline:3px solid #8B5CF6;outline-offset:2px;border-radius:8px}
