:root{
  --white:#ffffff;
  --ink:#0b1220;
  --muted:#5d6b82;
  --line:#e6edf7;
  --soft:#f5f9ff;
  --blue:#0d3d8f;
  --blue-2:#1074ff;
  --cyan:#00b7ff;
  --dark:#08162d;
  --shadow:0 22px 60px rgba(11,18,32,.12);
  --radius:28px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.container{width:min(1160px,92%);margin:auto}
.section-pad{padding:92px 0}
.soft-bg{background:linear-gradient(180deg,#f7fbff 0%,#fff 100%)}

.site-header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}
.navbar{
  width:min(1180px,94%);
  margin:auto;
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{
  width:48px;height:48px;border-radius:16px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--blue),var(--cyan));
  color:#fff;
  font-weight:900;
  box-shadow:0 14px 30px rgba(16,116,255,.25);
}
.brand strong{display:block;font-size:1.08rem;line-height:1.1}
.brand small{display:block;color:var(--muted);font-size:.78rem;letter-spacing:.04em}
.nav-links{display:flex;align-items:center;gap:10px}
.nav-links a{
  padding:10px 14px;
  color:#243248;
  font-weight:700;
  font-size:.94rem;
  border-radius:999px;
}
.nav-links a:hover{background:var(--soft);color:var(--blue)}
.nav-cta{background:var(--blue)!important;color:#fff!important;box-shadow:0 12px 26px rgba(13,61,143,.22)}
.menu-toggle{display:none;background:none;border:0;gap:5px;flex-direction:column;cursor:pointer}
.menu-toggle span{display:block;width:28px;height:3px;background:var(--ink);border-radius:99px}

.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 15% 20%,rgba(16,116,255,.12),transparent 32%),
    radial-gradient(circle at 85% 10%,rgba(0,183,255,.16),transparent 28%),
    linear-gradient(180deg,#fff 0%,#f8fbff 100%);
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.38;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,#000,transparent 78%);
}
.hero-grid{
  position:relative;
  width:min(1180px,92%);
  margin:auto;
  display:grid;
  grid-template-columns:1.04fr .96fr;
  align-items:center;
  gap:48px;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--blue);
  background:#edf6ff;
  border:1px solid #d6eaff;
  padding:8px 13px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.eyebrow.light{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28);color:#fff}
h1{
  font-size:clamp(2.55rem,5vw,5.25rem);
  line-height:.98;
  letter-spacing:-.07em;
  margin:22px 0 20px;
}
.hero-content p{font-size:1.18rem;color:var(--muted);max-width:650px}
.hero-actions,.contact-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:14px 22px;
  font-weight:900;
  transition:.25s ease;
  border:1px solid transparent;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;box-shadow:0 18px 36px rgba(16,116,255,.24)}
.btn-secondary{background:#fff;color:var(--blue);border-color:#cfe1f8;box-shadow:0 12px 24px rgba(11,18,32,.06)}
.btn-white{background:#fff;color:var(--blue)}
.hero-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.hero-pills span{background:#fff;border:1px solid var(--line);padding:9px 13px;border-radius:999px;color:#39506f;font-weight:700;font-size:.9rem}

.hero-visual{position:relative;min-height:520px;display:grid;place-items:center}
.network-card{
  width:min(430px,92vw);
  height:430px;
  border-radius:42px;
  background:linear-gradient(145deg,#ffffff,#ecf6ff);
  border:1px solid #d9e9fb;
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.main-card::before{
  content:"";
  position:absolute;
  width:260px;height:260px;border-radius:50%;
  border:1px dashed rgba(16,116,255,.35);
  left:50%;top:50%;transform:translate(-50%,-50%);
}
.card-topline{height:10px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
.device-row{position:absolute;left:38px;right:38px;top:42px;display:flex;gap:12px}
.device-row span{height:50px;flex:1;border-radius:16px;background:#f8fbff;border:1px solid #d8e8fa;box-shadow:inset 0 -10px 20px rgba(13,61,143,.06)}
.connection-lines i{position:absolute;height:2px;background:linear-gradient(90deg,transparent,var(--blue-2),transparent);transform-origin:left}
.connection-lines i:nth-child(1){width:240px;left:96px;top:190px;transform:rotate(18deg)}
.connection-lines i:nth-child(2){width:255px;left:96px;top:245px;transform:rotate(-17deg)}
.connection-lines i:nth-child(3){width:195px;left:118px;top:310px;transform:rotate(0deg)}
.connection-lines i:nth-child(4){width:160px;left:210px;top:150px;transform:rotate(90deg)}
.node{
  position:absolute;
  display:grid;place-items:center;
  min-width:86px;height:86px;
  border-radius:26px;
  background:#fff;
  border:1px solid #d8e9fb;
  color:var(--blue);
  font-size:.76rem;
  letter-spacing:.03em;
  box-shadow:0 16px 36px rgba(13,61,143,.13);
}
.n1{left:52px;top:148px}.n2{right:54px;top:140px}.n3{left:72px;bottom:62px}.n4{right:56px;bottom:72px}
.floating-stat{
  position:absolute;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 18px 42px rgba(11,18,32,.12);
  padding:14px 18px;
  border-radius:18px;
  color:#243248;
  font-weight:900;
}
.stat-one{left:0;bottom:78px}.stat-two{right:0;top:88px}

.intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:46px;align-items:start}
.section-heading h2{font-size:clamp(2rem,3.6vw,3.35rem);line-height:1.04;letter-spacing:-.045em;margin:18px 0 14px}
.section-heading p,.intro-text p{color:var(--muted);font-size:1.04rem}
.intro-text{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px;box-shadow:0 18px 40px rgba(11,18,32,.06)}
.intro-text p + p{margin-top:14px}
.centered{text-align:center;max-width:820px;margin:0 auto 46px}

.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.service-card{
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  border-radius:26px;
  padding:28px;
  min-height:258px;
  box-shadow:0 16px 36px rgba(11,18,32,.06);
  overflow:hidden;
  transition:.28s ease;
}
.service-card::after{
  content:"";
  position:absolute;
  width:150px;height:150px;border-radius:50%;
  background:rgba(16,116,255,.08);
  right:-70px;bottom:-70px;
}
.service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:#c8def8}
.icon{
  width:58px;height:58px;border-radius:20px;
  display:grid;place-items:center;
  color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--cyan));
  font-size:1.42rem;
  font-weight:900;
  margin-bottom:18px;
}
.service-card h3{font-size:1.25rem;margin-bottom:10px;letter-spacing:-.02em}
.service-card p{color:var(--muted)}
.featured-card{background:linear-gradient(135deg,#071a39,#0d3d8f);color:#fff}
.featured-card p{color:#dcecff}.featured-card .icon{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24)}

.solution-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.solution-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:32px;
  box-shadow:0 16px 38px rgba(11,18,32,.06);
}
.solution-card span{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:16px;background:#edf6ff;color:var(--blue);font-weight:900;margin-bottom:42px}
.solution-card h3{font-size:1.45rem;margin-bottom:8px}.solution-card p{color:var(--muted)}

.cta{padding-top:30px}
.cta-box{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:28px;
  background:linear-gradient(135deg,#06172f,#0d3d8f 58%,#00a8ff);
  color:#fff;
  border-radius:36px;
  padding:48px;
  box-shadow:0 28px 70px rgba(13,61,143,.25);
}
.cta-box h2{font-size:clamp(1.9rem,3vw,3rem);line-height:1.05;letter-spacing:-.04em;margin:18px 0 12px}.cta-box p{color:#e6f4ff}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:32px;padding:34px;box-shadow:var(--shadow)}
.contact-item{padding:18px 0;border-bottom:1px solid var(--line)}
.contact-item:first-child{padding-top:0}.contact-item span{display:block;color:var(--muted);font-weight:800;font-size:.84rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.contact-item a{font-size:2rem;color:var(--blue);font-weight:900}.contact-item p{font-size:1.05rem;color:#26364d;font-weight:700}

.floating-call{
  position:fixed;
  right:20px;
  bottom:20px;
  width:60px;height:60px;
  border-radius:50%;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--blue),var(--blue-2));
  color:#fff;
  font-size:1.45rem;
  box-shadow:0 18px 44px rgba(16,116,255,.32);
  z-index:30;
}
.footer{background:#061224;color:#fff;padding:34px 0}.footer-grid{display:flex;justify-content:space-between;gap:20px}.footer p{color:#b8c7db;margin-top:6px;max-width:640px}

.reveal{opacity:0;transform:translateY(22px);transition:.7s ease}.reveal.visible{opacity:1;transform:translateY(0)}

@media (max-width:900px){
  .menu-toggle{display:flex}.nav-links{position:absolute;top:78px;left:3%;right:3%;background:#fff;border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:var(--shadow);display:none;flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links a{text-align:center}
  .hero-grid,.intro-grid,.contact-grid{grid-template-columns:1fr}.hero-visual{min-height:420px}.service-grid,.solution-row{grid-template-columns:1fr}.cta-box{flex-direction:column;align-items:flex-start}.footer-grid{flex-direction:column}
}
@media (max-width:560px){
  .section-pad{padding:68px 0}.navbar{min-height:72px}.nav-links{top:72px}.brand small{display:none}h1{font-size:2.35rem}.hero-visual{min-height:360px}.network-card{height:330px}.node{min-width:72px;height:72px;font-size:.66rem}.n1{left:28px;top:122px}.n2{right:28px;top:116px}.n3{left:36px;bottom:42px}.n4{right:28px;bottom:48px}.floating-stat{font-size:.78rem}.stat-one{bottom:44px}.stat-two{top:54px}.cta-box{padding:32px}.contact-item a{font-size:1.55rem}.floating-call{width:54px;height:54px}
}

/* Corrección Cloudflare: si JavaScript no carga, el contenido sigue visible */
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; }
}