:root{
  --bg:#eef3fb;
  --bg2:#f7f9fd;
  --card:rgba(255,255,255,.82);
  --card2:rgba(255,255,255,.92);
  --line:rgba(0,40,90,.08);

  --text:#0d1b34;
  --muted:#4c5b78;
  --soft:#6f7f9d;

  --blue:#2f80ff;
  --cyan:#00d2ff;
  --green:#25d366;

  --shadow:0 20px 60px rgba(0,40,90,.12);
  --radius:28px;
  --max:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{
  font-family:Inter,system-ui,sans-serif;
  background:
  linear-gradient(rgba(255,255,255,.88),rgba(255,255,255,.92)),
  url('assets/camaras.png') center top/cover fixed no-repeat;
  color:var(--text);
  overflow-x:hidden;
}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(var(--max),92%);margin:auto}.cursor-glow{position:fixed;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(47,128,255,.18),transparent 65%);pointer-events:none;z-index:0;transform:translate(-50%,-50%);filter:blur(20px)}
.header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(5,7,18,.72);backdrop-filter:blur(20px);border-bottom:1px solid var(--line);transition:.25s}.header.scrolled{background:rgba(5,7,18,.94);box-shadow:0 10px 40px rgba(0,0,0,.35)}.nav-wrap{height:78px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:14px;font-weight:900;letter-spacing:-.03em;min-width:330px}.brand img{width:58px;height:58px;border-radius:50%;object-fit:cover;box-shadow:0 0 34px rgba(47,128,255,.38)}.brand-text{display:flex;flex-direction:column;line-height:1.05}.brand-text strong{font-size:30px;font-weight:900;color:#ffffff;letter-spacing:-0.04em}.brand-text small{font-size:15px;font-weight:800;color:#d8e8ff;letter-spacing:0.02em;text-shadow:0 0 12px rgba(34,230,195,.35);margin-top:4px;white-space:nowrap}.nav{margin-left:auto;display:flex;gap:6px}.nav a{font-weight:650;color:var(--muted);padding:10px 14px;border-radius:999px;transition:.25s}.nav a:hover{color:#fff;background:rgba(255,255,255,.07)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:14px 22px;font-weight:800;transition:.25s;border:1px solid transparent}.btn:hover{transform:translateY(-3px)}.btn-primary{background:linear-gradient(135deg,var(--blue),#075dff);color:white;box-shadow:0 18px 45px rgba(47,128,255,.38)}.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.06);color:white}.btn-wa{background:linear-gradient(135deg,var(--green),#16a34a);color:white;box-shadow:0 18px 45px rgba(37,211,102,.25)}.big{font-size:18px;padding:18px 34px;white-space:nowrap;min-width:210px}.menu{display:none;margin-left:auto;gap:5px;flex-direction:column;background:transparent;border:0}.menu span{width:26px;height:2px;background:#fff;display:block}
.hero{min-height:100vh;position:relative;display:flex;align-items:center;padding:130px 0 90px;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 28%,rgba(34,230,195,.18),transparent 26%),radial-gradient(circle at 45% 50%,rgba(47,128,255,.16),transparent 32%);pointer-events:none;z-index:1}.hero-bg{position:absolute;inset:0}.hero-bg img{width:100%;height:100%;object-fit:cover;filter:brightness(1.18) saturate(1.25) contrast(1.12);transform:scale(1.03)}.hero-overlay{
  position:absolute;
  inset:0;
  background:
  linear-gradient(
    90deg,
    rgba(255,255,255,.78) 0%,
    rgba(255,255,255,.40) 40%,
    rgba(255,255,255,.12) 100%
  ),
  linear-gradient(
    180deg,
    rgba(0,140,255,.08),
    rgba(0,255,200,.03)
  );
}.grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:68px 68px;mask-image:radial-gradient(circle at 45% 30%,#000,transparent 68%)}.hero-content{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.eyebrow,.tag{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(34,230,195,.28);background:rgba(34,230,195,.08);color:var(--cyan);border-radius:999px;padding:8px 14px;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.eyebrow span{width:8px;height:8px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 8px rgba(34,230,195,.12)}h1{font-size:clamp(52px,7vw,92px);line-height:.92;letter-spacing:-.08em;margin:26px 0 24px;max-width:900px;text-shadow:0 0 25px rgba(47,128,255,.15),0 0 55px rgba(34,230,195,.08)}.hero-copy p{font-size:20px;line-height:1.7;color:var(--muted);max-width:650px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:36px 0}.trust-mini{display:flex;gap:22px;flex-wrap:wrap}.trust-mini div{border-left:1px solid var(--line);padding-left:18px}.trust-mini strong{display:block;font-size:34px;line-height:1;color:white}.trust-mini span{display:block;color:var(--soft);font-size:13px;margin-top:6px}.hero-panel{justify-self:end;width:min(440px,100%);border:1px solid rgba(255,255,255,.16);background:linear-gradient(145deg,rgba(15,22,41,.82),rgba(10,13,28,.55));backdrop-filter:blur(22px);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero-panel:before{content:"";position:absolute;inset:-1px;background:radial-gradient(circle at 80% 10%,rgba(34,230,195,.25),transparent 36%);pointer-events:none}.panel-top{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:700}.status-dot{width:10px;height:10px;background:var(--cyan);border-radius:50%;box-shadow:0 0 24px var(--cyan)}.security-card{margin:34px 0;padding:28px;border-radius:24px;background:rgba(255,255,255,.07);border:1px solid var(--line)}.security-card span{color:var(--cyan);font-weight:900;text-transform:uppercase;font-size:12px}.security-card strong{display:block;font-size:34px;letter-spacing:-.05em;margin:12px 0}.security-card p{color:var(--muted);line-height:1.65}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.metrics div{padding:14px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid var(--line)}.metrics span{display:block;color:var(--soft);font-size:12px}.metrics strong{font-size:14px}.brand-strip{position:relative;z-index:2;background:#ffffffd9;border-block:1px solid rgba(0,40,90,.08);padding:18px 0}.strip-inner{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:var(--muted);font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.08em}.section{padding:110px 0;background:linear-gradient(180deg,var(--bg),#f5f8ff)}.section-head{text-align:center;max-width:760px;margin:0 auto 58px}.section-head.left{text-align:left;margin:0}.section-head h2{font-size:clamp(34px,4.3vw,58px);line-height:1.02;letter-spacing:-.06em;margin:18px 0}.section-head p{font-size:18px;color:var(--muted);line-height:1.7}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.service-card{position:relative;overflow:hidden;border:1px solid var(--line);background:linear-gradient(145deg,var(--card),rgba(17,27,50,.7));border-radius:var(--radius);padding:34px;box-shadow:0 18px 55px rgba(0,0,0,.22);transition:.3s}.service-card:hover,.project-card:hover,.step:hover{transform:translateY(-7px);border-color:rgba(47,128,255,.45);box-shadow:0 30px 80px rgba(0,0,0,.35)}.featured{grid-column:span 2;display:grid;grid-template-columns:1.05fr .95fr;gap:36px;min-height:440px}.service-label{color:var(--cyan);font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.service-card h3{font-size:30px;line-height:1.05;letter-spacing:-.04em;margin:12px 0}.service-card p{color:var(--muted);line-height:1.72}.service-card ul{list-style:none;margin:22px 0;display:grid;gap:10px}.service-card li{color:#dce6ff}.service-card li:before{content:"✓";color:var(--cyan);font-weight:900;margin-right:10px}.service-card a:not(.btn){display:inline-block;margin-top:24px;color:var(--cyan);font-weight:900}.icon{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,rgba(47,128,255,.25),rgba(34,230,195,.12));border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;font-size:28px;color:var(--cyan)}.camera-visual{border-radius:26px;min-height:330px;background:linear-gradient(0deg,rgba(5,7,18,.35),rgba(5,7,18,.08)),url('assets/camaras.png') center/cover no-repeat;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}.dark-section{
  padding:110px 0;
  background:
  linear-gradient(rgba(245,249,255,.96),rgba(240,246,255,.96)),
  url('assets/banner.jpg') center/cover no-repeat;
}.process-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}.process-list{display:grid;gap:18px}.step{display:flex;gap:22px;border:1px solid var(--line);background:rgba(255,255,255,.055);border-radius:24px;padding:24px;transition:.3s}.step span{font-weight:900;color:var(--cyan);font-size:18px}.step h3{font-size:22px;margin-bottom:6px}.step p{color:var(--muted);line-height:1.65}.projects{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.project-card{min-height:260px;border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));transition:.3s}.project-card span{color:var(--cyan);font-size:12px;font-weight:900;text-transform:uppercase}.project-card h3{font-size:24px;line-height:1.1;margin:16px 0}.project-card p{color:var(--muted);line-height:1.65}.cta-section{padding:90px 0;background:#070a17}.cta-box{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:48px;border-radius:34px;border:1px solid rgba(34,230,195,.24);background:radial-gradient(circle at 80% 0,rgba(34,230,195,.18),transparent 32%),linear-gradient(135deg,var(--card),#081026);box-shadow:var(--shadow)}.cta-box h2{font-size:clamp(32px,4vw,54px);line-height:1.03;letter-spacing:-.06em;margin:16px 0}.cta-box p{color:var(--muted);font-size:18px;max-width:700px;line-height:1.7}.float-wa{position:fixed;right:24px;bottom:24px;width:62px;height:62px;border-radius:50%;background:var(--green);color:white;display:grid;place-items:center;font-size:30px;font-weight:900;z-index:60;box-shadow:0 20px 50px rgba(37,211,102,.42);animation:pulse 2s infinite}@keyframes pulse{50%{transform:scale(1.06)}}.footer{padding:30px 0;border-top:1px solid var(--line);background:#edf3fb;color:#5b6d8d}.footer-inner{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}.reveal{opacity:0;transform:translateY(28px);transition:.75s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:none}.delay{transition-delay:.15s}
@media(max-width:980px){.nav,.header .btn-wa{display:none}.menu{display:flex}.nav.open{display:flex;position:absolute;left:4%;right:4%;top:86px;flex-direction:column;background:rgba(5,7,18,.96);border:1px solid var(--line);border-radius:22px;padding:18px}.hero-content,.featured,.process-layout{grid-template-columns:1fr}.hero-panel{justify-self:start}.services-grid,.projects{grid-template-columns:1fr}.featured{grid-column:auto}.cta-box{flex-direction:column;align-items:flex-start}.hero{padding-top:120px}.brand-text small{display:none}.brand{min-width:auto}.brand-text strong{font-size:22px}}
@media(max-width:560px){.hero-actions{flex-direction:column}.btn{width:100%}.trust-mini{display:grid;grid-template-columns:1fr}.metrics{grid-template-columns:1fr}.section{padding:80px 0}.service-card,.cta-box{padding:24px}h1{font-size:44px}.cursor-glow{display:none}}



/* ================================
   ESTILO VIVO PREMIUM - VSL / TACSA
   ================================ */

:root{
  --bg:#eef6ff;
  --bg2:#ffffff;
  --card:rgba(255,255,255,.88);
  --card2:rgba(255,255,255,.96);
  --line:rgba(0,77,140,.14);

  --text:#071b38;
  --muted:#39516f;
  --soft:#6b7e99;

  --blue:#1167ff;
  --cyan:#00c9ff;
  --green:#20c85a;
  --aqua:#23e6c3;
  --gold:#ffb84d;

  --shadow:0 28px 80px rgba(10,54,115,.18);
  --radius:28px;
  --max:1180px;
}

body{
  color:var(--text);
  background:
    radial-gradient(circle at 15% 8%, rgba(0,201,255,.24), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(32,200,90,.18), transparent 24%),
    linear-gradient(180deg,#f6fbff 0%, #edf6ff 38%, #f8fbff 100%);
}

/* fondo con movimiento sutil */
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-2;
  background:
    linear-gradient(rgba(255,255,255,.86),rgba(255,255,255,.92)),
    url('assets/camaras.png') center top/cover fixed no-repeat;
  opacity:.72;
}

body:after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:
    linear-gradient(rgba(0,140,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,140,255,.055) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(180deg, #000 0%, transparent 78%);
}

.cursor-glow{
  background:
    radial-gradient(circle,rgba(0,201,255,.25),rgba(32,200,90,.14),transparent 68%);
  filter:blur(18px);
}

/* Header más premium y con vida */
.header{
  background:rgba(255,255,255,.76);
  backdrop-filter:blur(22px) saturate(1.35);
  border-bottom:1px solid rgba(0,93,170,.13);
  box-shadow:0 12px 45px rgba(0,42,100,.08);
}

.header.scrolled{
  background:rgba(255,255,255,.93);
  box-shadow:0 18px 55px rgba(0,42,100,.14);
}

.brand img{
  box-shadow:
    0 0 0 5px rgba(255,255,255,.75),
    0 0 32px rgba(0,201,255,.45),
    0 12px 35px rgba(0,42,100,.20);
}

.brand-text strong{
  color:#081b36;
  text-shadow:0 0 18px rgba(0,201,255,.12);
}

.brand-text small{
  color:#0b6fd3;
  text-shadow:0 0 14px rgba(0,201,255,.20);
}

.nav a{
  color:#344864;
}

.nav a:hover{
  color:#071b38;
  background:linear-gradient(135deg,rgba(0,201,255,.12),rgba(32,200,90,.10));
}

.btn-primary{
  background:linear-gradient(135deg,#1167ff,#00b7ff);
  box-shadow:0 18px 45px rgba(17,103,255,.32);
}

.btn-wa{
  background:linear-gradient(135deg,#20c85a,#0fbf80);
  box-shadow:
    0 18px 45px rgba(32,200,90,.30),
    inset 0 1px 0 rgba(255,255,255,.34);
}

.btn-ghost{
  border-color:rgba(0,116,210,.20);
  background:rgba(255,255,255,.56);
  color:#0b2346;
  box-shadow:0 12px 32px rgba(0,54,100,.08);
}

/* Hero más luminoso y con profundidad */
.hero{
  background:#eef6ff;
}

.hero-bg img{
  filter:brightness(1.12) saturate(1.42) contrast(1.10);
  transform:scale(1.035);
}

.hero-overlay{
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.88) 0%,
      rgba(255,255,255,.62) 34%,
      rgba(255,255,255,.16) 72%,
      rgba(255,255,255,.08) 100%),
    radial-gradient(circle at 22% 28%, rgba(255,255,255,.92), transparent 26%),
    radial-gradient(circle at 68% 32%, rgba(0,201,255,.12), transparent 34%),
    linear-gradient(0deg, #eef6ff 0%, transparent 25%);
}

.hero:after{
  background:
    radial-gradient(circle at 22% 35%,rgba(0,201,255,.24),transparent 22%),
    radial-gradient(circle at 76% 20%,rgba(32,200,90,.20),transparent 25%),
    radial-gradient(circle at 50% 88%,rgba(17,103,255,.16),transparent 28%);
  animation:heroGlow 7s ease-in-out infinite alternate;
}

@keyframes heroGlow{
  from{opacity:.75;transform:scale(1)}
  to{opacity:1;transform:scale(1.04)}
}

.grid-lines{
  background-image:
    linear-gradient(rgba(0,140,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,140,255,.08) 1px,transparent 1px);
  opacity:.75;
}

.eyebrow,.tag{
  border:1px solid rgba(0,201,255,.36);
  background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(0,201,255,.10));
  color:#007b9f;
  box-shadow:0 10px 30px rgba(0,201,255,.13);
}

.eyebrow span{
  background:#20c85a;
  box-shadow:0 0 0 8px rgba(32,200,90,.14),0 0 22px rgba(32,200,90,.55);
}

h1{
  color:#071b38;
  text-shadow:
    0 3px 0 rgba(255,255,255,.85),
    0 18px 50px rgba(0,54,115,.14);
}

.hero-copy p{
  color:#233b59;
  font-weight:600;
  text-shadow:0 1px 0 rgba(255,255,255,.75);
}

.trust-mini div{
  border-left:1px solid rgba(0,116,210,.22);
}

.trust-mini strong{
  background:linear-gradient(135deg,#1167ff,#20c85a);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.trust-mini span{
  color:#425976;
}

/* Panel derecho tipo cristal tecnológico */
.hero-panel{
  border:1px solid rgba(0,201,255,.24);
  background:
    radial-gradient(circle at 80% 8%,rgba(0,201,255,.20),transparent 36%),
    linear-gradient(145deg,rgba(255,255,255,.82),rgba(232,244,255,.58));
  backdrop-filter:blur(24px) saturate(1.25);
  box-shadow:
    0 35px 95px rgba(0,40,90,.20),
    inset 0 1px 0 rgba(255,255,255,.75);
}

.hero-panel:before{
  background:
    radial-gradient(circle at 80% 10%,rgba(32,200,90,.18),transparent 36%),
    linear-gradient(135deg,rgba(0,201,255,.10),transparent);
}

.panel-top{
  color:#243b57;
}

.security-card{
  background:rgba(255,255,255,.62);
  border:1px solid rgba(0,116,210,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
}

.security-card span{
  color:#0bbd8b;
}

.security-card strong{
  color:#081b36;
}

.security-card p{
  color:#3d5068;
}

.metrics div{
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(240,248,255,.58));
  border:1px solid rgba(0,116,210,.16);
}

.metrics span{color:#62758f}
.metrics strong{color:#071b38}

/* Franja de marcas más viva */
.brand-strip{
  background:
    linear-gradient(90deg,rgba(255,255,255,.92),rgba(235,248,255,.95),rgba(255,255,255,.92));
  border-block:1px solid rgba(0,116,210,.12);
  box-shadow:0 14px 50px rgba(0,60,120,.08);
}

.strip-inner span{
  color:#33506f;
}

/* Secciones con fondos claros, vivos y tarjetas premium */
.section{
  background:
    radial-gradient(circle at 10% 0%,rgba(0,201,255,.10),transparent 24%),
    radial-gradient(circle at 90% 10%,rgba(32,200,90,.10),transparent 24%),
    linear-gradient(180deg,#f5fbff,#edf6ff);
}

.section-head h2,
.section-head.left h2{
  color:#071b38;
}

.section-head p{
  color:#45607d;
}

.service-card,
.project-card,
.step{
  background:
    linear-gradient(145deg,rgba(255,255,255,.88),rgba(238,247,255,.78));
  border:1px solid rgba(0,116,210,.13);
  box-shadow:0 18px 55px rgba(0,45,110,.12);
}

.service-card:hover,
.project-card:hover,
.step:hover{
  border-color:rgba(0,201,255,.50);
  box-shadow:0 30px 90px rgba(0,75,145,.20);
}

.service-card h3,
.project-card h3,
.step h3{
  color:#071b38;
}

.service-card p,
.project-card p,
.step p{
  color:#45607d;
}

.service-card li{
  color:#213956;
}

.service-card li:before{
  color:#20c85a;
}

.icon{
  background:linear-gradient(135deg,rgba(0,201,255,.22),rgba(32,200,90,.18));
  border:1px solid rgba(0,116,210,.18);
  color:#0a98d6;
  box-shadow:0 16px 40px rgba(0,201,255,.14);
}

.camera-visual{
  background:
    linear-gradient(0deg,rgba(255,255,255,.10),rgba(255,255,255,.00)),
    url('assets/camaras.png') center/cover no-repeat;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.45),
    0 18px 55px rgba(0,45,110,.12);
}

/* Proceso con fondo vivo */
.dark-section{
  background:
    radial-gradient(circle at 20% 0%,rgba(17,103,255,.14),transparent 28%),
    radial-gradient(circle at 90% 20%,rgba(32,200,90,.12),transparent 24%),
    linear-gradient(rgba(245,250,255,.94),rgba(238,247,255,.96)),
    url('assets/banner.jpg') center/cover no-repeat;
}

.step span{
  color:#1167ff;
}

/* CTA con vida, pero premium */
.cta-section{
  background:
    radial-gradient(circle at 12% 0%,rgba(0,201,255,.12),transparent 25%),
    linear-gradient(180deg,#eef6ff,#f8fbff);
}

.cta-box{
  border:1px solid rgba(0,201,255,.28);
  background:
    radial-gradient(circle at 82% 0,rgba(32,200,90,.18),transparent 32%),
    radial-gradient(circle at 10% 100%,rgba(0,201,255,.16),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.90),rgba(235,248,255,.78));
  box-shadow:0 32px 90px rgba(0,54,120,.18);
}

.cta-box h2{
  color:#071b38;
}

.cta-box p{
  color:#45607d;
}

.float-wa{
  box-shadow:
    0 22px 55px rgba(32,200,90,.38),
    0 0 0 8px rgba(32,200,90,.10);
}

.footer{
  background:#f0f7ff;
  color:#55708f;
}

/* Pequeñas mejoras responsive */
@media(max-width:980px){
  .header{
    background:rgba(255,255,255,.92);
  }
  .nav.open{
    background:rgba(255,255,255,.96);
    box-shadow:0 24px 60px rgba(0,40,90,.15);
  }
  .nav.open a{
    color:#071b38;
  }
}

@media(max-width:560px){
  .hero-overlay{
    background:
      linear-gradient(180deg,rgba(255,255,255,.90),rgba(255,255,255,.70)),
      linear-gradient(0deg,#eef6ff,transparent 30%);
  }
}


/* ==========================================================
   AJUSTE FINAL: HERO NÍTIDO COMO LA IMAGEN ORIGINAL
   ========================================================== */
.hero{
  min-height:72vh;
  padding:150px 0 120px;
  background:#061226;
  isolation:isolate;
}

.hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  image-rendering:auto;
  filter:brightness(1.04) contrast(1.13) saturate(1.18);
  transform:none !important;
  will-change:auto;
}

.hero-overlay{
  background:
    linear-gradient(90deg,
      rgba(3,10,25,.66) 0%,
      rgba(3,10,25,.42) 36%,
      rgba(3,10,25,.18) 68%,
      rgba(3,10,25,.10) 100%),
    linear-gradient(180deg,
      rgba(0,0,0,.08) 0%,
      rgba(0,0,0,.00) 52%,
      rgba(3,10,25,.18) 100%) !important;
}

.hero:after{
  background:
    radial-gradient(circle at 78% 28%,rgba(0,201,255,.12),transparent 26%),
    radial-gradient(circle at 28% 42%,rgba(32,200,90,.10),transparent 22%) !important;
  opacity:.8;
  animation:none !important;
}

.grid-lines{
  opacity:.18;
  mix-blend-mode:screen;
}

.hero-copy{
  max-width:760px;
}

h1{
  color:#ffffff !important;
  text-shadow:0 6px 28px rgba(0,0,0,.45), 0 0 42px rgba(0,201,255,.18) !important;
}

.hero-copy p{
  color:#f1f7ff !important;
  text-shadow:0 3px 16px rgba(0,0,0,.38) !important;
  font-weight:700;
}

.eyebrow{
  background:rgba(0,0,0,.38) !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.22) !important;
  backdrop-filter:blur(12px);
}

.trust-mini strong{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  color:#ffffff !important;
  text-shadow:0 4px 18px rgba(0,0,0,.35);
}

.trust-mini span{
  color:#e7f3ff !important;
  text-shadow:0 2px 12px rgba(0,0,0,.35);
}

.hero-panel{
  background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(230,244,255,.56)) !important;
  border-color:rgba(255,255,255,.40) !important;
}

.header{
  background:rgba(255,255,255,.88) !important;
}

.header.scrolled{
  background:rgba(255,255,255,.96) !important;
}

/* mejora la nitidez visual de tarjetas con imágenes */
.camera-visual{
  background:
    linear-gradient(0deg,rgba(0,0,0,.08),rgba(0,0,0,.00)),
    url('assets/camaras.png') center/cover no-repeat !important;
  filter:contrast(1.08) saturate(1.08);
}

@media(max-width:700px){
  .hero{
    min-height:86vh;
    padding:125px 0 80px;
  }
  .hero-bg img{
    object-position:center center;
  }
  .hero-overlay{
    background:
      linear-gradient(180deg,
        rgba(3,10,25,.72) 0%,
        rgba(3,10,25,.48) 48%,
        rgba(3,10,25,.32) 100%) !important;
  }
}
