:root{
  --void:#04070F;
  --navy-deep:#061529;
  --navy:#002A56;
  --blue:#0190F6;
  --blue-bright:#5CB8FF;
  --ice:#D9EAFA;
  --white:#FFFFFF;
  --dim:rgba(217,234,250,.55);
  --dimmer:rgba(217,234,250,.32);
  --line:rgba(217,234,250,.13);
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{background:var(--void);}
body{
  font-family:'Inter',sans-serif;
  background:var(--void);
  color:var(--ice);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.is-loading{overflow:hidden;height:100vh;}
::selection{background:var(--blue);color:#fff;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
button{font-family:inherit;border:none;background:none;color:inherit;cursor:pointer;}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.025em;line-height:1.04;}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(22px,5vw,72px);}

.mono{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;}
.eyebrow{display:flex;align-items:center;gap:11px;color:var(--blue-bright);}
.eyebrow::before{
  content:'';width:6px;height:6px;border-radius:50%;background:var(--blue);
  box-shadow:0 0 0 4px rgba(1,144,246,.2);flex-shrink:0;
}

/* ---------- reveal primitives ---------- */
.line-mask{
  display:inline-block;overflow:hidden;vertical-align:bottom;
  padding-bottom:.14em;margin-bottom:-.14em;
}
.line-mask > span{display:block;will-change:transform;}
.reveal-up{opacity:0;transform:translateY(38px);}

/* ---------- preloader ---------- */
#preloader{
  position:fixed;inset:0;z-index:200;background:var(--void);
  display:flex;align-items:center;justify-content:center;
}
.pre-dot{
  width:14px;height:14px;border-radius:50%;background:var(--blue);
  box-shadow:0 0 34px 6px rgba(1,144,246,.55);
}
.pre-count{
  position:absolute;bottom:38px;right:clamp(22px,5vw,72px);
  color:var(--dimmer);
}
.pre-bar{position:absolute;left:0;bottom:0;height:1px;width:0%;background:var(--blue);}

/* ---------- cursor ---------- */
.cursor{
  position:fixed;top:0;left:0;width:9px;height:9px;border-radius:50%;
  background:var(--blue);pointer-events:none;z-index:190;
  transform:translate(-50%,-50%);opacity:0;
}
.cursor-ring{
  position:fixed;top:0;left:0;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(92,184,255,.45);pointer-events:none;z-index:189;
  transform:translate(-50%,-50%);opacity:0;
}
@media(hover:none),(max-width:840px){.cursor,.cursor-ring{display:none;}}

/* ---------- nav ---------- */
header.nav{
  position:fixed;top:0;left:0;width:100%;z-index:100;
  /* padding:22px clamp(20px,4vw,48px); */
  padding: 0 clamp(22px, 6vw, 92px);
  padding-top: 10px;
  padding-bottom: 10px;
  display:flex;align-items:center;justify-content:space-between;
}
.nav-brand img{height:60px;filter:brightness(0) invert(1);}
.nav-links{display:none;align-items:center;gap:32px;color:var(--dim);}
.nav-links a{position:relative;padding:4px 0;transition:color .3s;}
.nav-links a:hover{color:var(--white);}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--blue);
  transition:width .4s var(--ease);
}
.nav-links a:hover::after{width:100%;}
@media(min-width:880px){.nav-links{display:flex;}}
.nav-cta{
  border:1px solid var(--line);border-radius:100px;padding:10px 20px;
  transition:border-color .3s,color .3s,background .3s;
}
.nav-cta:hover{border-color:var(--blue);color:var(--blue-bright);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:12px;
  font-family:'JetBrains Mono',monospace;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:17px 28px;border-radius:100px;
  transition:transform .5s var(--ease),background .35s,color .35s,border-color .35s;
}
.btn svg{width:14px;height:14px;transition:transform .45s var(--ease);}
.btn:hover svg{transform:translateX(5px);}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:var(--blue-bright);}
.btn-ghost{border:1px solid var(--line);color:var(--ice);}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue-bright);}

/* ---------- progress dot rail ---------- */
.rail{
  position:fixed;right:26px;top:50%;transform:translateY(-50%);
  width:1px;height:150px;background:rgba(217,234,250,.14);z-index:90;display:none;
}
.rail .rail-dot{
  position:absolute;left:50%;top:0;width:7px;height:7px;border-radius:50%;
  background:var(--blue);box-shadow:0 0 0 5px rgba(1,144,246,.18);
  transform:translate(-50%,-50%);
}
@media(min-width:960px){.rail{display:block;}}

/* ================= HERO ================= */
#hero{position:relative;height:320vh;}
.hero-stage{
  position:sticky;top:0;height:100vh;width:100%;overflow:hidden;background:var(--void);
}
#light-canvas{position:absolute;inset:0;width:100%;height:100%;}
.grain{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}
/* HUD técnico del hero */
.hud-corner{
  position:absolute;width:22px;height:22px;border:1px solid rgba(92,184,255,.3);pointer-events:none;
}
.hud-corner.tl{top:84px;left:clamp(22px,6vw,92px);border-right:none;border-bottom:none;}
.hud-corner.tr{top:84px;right:clamp(22px,6vw,92px);border-left:none;border-bottom:none;}
.hud-corner.bl{bottom:84px;left:clamp(22px,6vw,92px);border-right:none;border-top:none;}
.hud-corner.br{bottom:84px;right:clamp(22px,6vw,92px);border-left:none;border-top:none;}
.hero-copy{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  padding:0 clamp(22px,6vw,92px);
}
.slide{position:absolute;left:clamp(22px,6vw,92px);right:clamp(22px,6vw,92px);max-width:620px;}
.slide .eyebrow{margin-bottom:24px;}
.slide h1{font-size:clamp(31px,5vw,60px);color:var(--white);margin-bottom:26px;}
.slide p{color:var(--dim);font-size:16.5px;line-height:1.7;max-width:500px;margin-bottom:36px;}
.hero-meta{
  position:absolute;bottom:36px;left:clamp(22px,6vw,92px);right:clamp(22px,6vw,92px);
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;color:var(--dimmer);
}
.scroll-cue{display:flex;align-items:center;gap:12px;}
.scroll-cue .track{width:36px;height:1px;background:rgba(217,234,250,.22);position:relative;overflow:hidden;}
.scroll-cue .track::after{
  content:'';position:absolute;left:-100%;top:0;width:100%;height:100%;background:var(--blue);
  animation:cue 2.4s ease-in-out infinite;
}
@keyframes cue{0%{left:-100%}50%{left:0}100%{left:100%}}
.hero-index{display:none;}
@media(min-width:880px){.hero-index{display:block;}}

/* ================= MANIFIESTO (lectura frase por frase) ================= */
#manifiesto{position:relative;height:230vh;background:var(--void);}
.mani-stage{
  position:sticky;top:0;height:100vh;display:flex;align-items:center;
  padding:0 clamp(22px,6vw,92px);
}
.mani-text{
  font-family:'Space Grotesk',sans-serif;font-weight:500;
  font-size:clamp(23px,3.6vw,46px);line-height:1.32;letter-spacing:-.02em;max-width:1000px;
}
.mani-text .w{
  display:inline-block;color:rgba(217,234,250,.15);transition:none;margin-right:.24em;
}
.mani-text .w.hot{color:var(--white);}
.mani-text .w.accent.hot{color:var(--blue-bright);}

/* ================= SERVICIOS (órbita con chips) ================= */
#servicios{position:relative;height:340vh;background:var(--navy-deep);}
.orb-stage{position:sticky;top:0;height:100vh;overflow:hidden;}
.orb-head{
  position:absolute;top:96px;left:clamp(22px,6vw,92px);right:clamp(22px,6vw,92px);
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
}
.orb-head h2{font-size:clamp(19px,2.2vw,26px);color:var(--white);}
.orb-count{color:var(--dimmer);}
.orbit-wrap{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(76vh,640px);height:min(76vh,640px);
}
.orbit{position:absolute;inset:0;}
.orbit-ring{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(92,184,255,.16);}
.chip{
  position:absolute;top:50%;left:50%;will-change:transform;
  display:flex;align-items:center;gap:9px;white-space:nowrap;
  padding:11px 18px;border-radius:100px;
  border:1px solid var(--line);background:rgba(4,7,15,.72);
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dim);transition:border-color .5s,color .5s,background .5s;
}
.chip i{
  width:6px;height:6px;border-radius:50%;background:rgba(217,234,250,.3);
  transition:background .5s,box-shadow .5s;flex-shrink:0;
}
.chip.on{border-color:var(--blue);color:var(--white);background:rgba(1,144,246,.1);}
.chip.on i{background:var(--blue);box-shadow:0 0 0 4px rgba(1,144,246,.22);}
.orb-center{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(70vw,400px);text-align:center;
}
.orb-center .num{color:var(--blue-bright);margin-bottom:16px;display:block;}
.orb-panel{position:relative;min-height:180px;}
.orb-item{
  position:absolute;inset:0;opacity:0;visibility:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
}
.orb-item h3{font-size:clamp(21px,2.6vw,30px);color:var(--white);margin-bottom:14px;}
.orb-item p{color:var(--dim);font-size:15px;line-height:1.65;max-width:330px;}

/* ================= POR QUE ================= */
#porque{background:var(--void);padding:150px 0 130px;position:relative;overflow:hidden;}
#porque .wrap{position:relative;z-index:1;}
.porque-grid{display:grid;grid-template-columns:1fr;gap:56px;position:relative;}
@media(min-width:980px){.porque-grid{grid-template-columns:.82fr 1.18fr;gap:48px;align-items:start;}}
.porque-head{position:relative;}
@media(min-width:980px){.porque-head{position:sticky;top:130px;}}
.porque-head .eyebrow{margin-bottom:22px;}
.porque-head h2{font-size:clamp(28px,3.6vw,42px);color:var(--white);margin-bottom:20px;}
.porque-head p{color:var(--dim);font-size:16px;line-height:1.7;max-width:380px;}
.why-list{position:relative;padding-left:36px;}
.why-rail{position:absolute;left:0;top:8px;bottom:14px;width:1px;background:rgba(217,234,250,.13);}
.why-fill{position:absolute;left:0;top:0;width:100%;height:0%;background:var(--blue);}
.why-dot{
  position:absolute;left:-3.5px;top:0;width:8px;height:8px;border-radius:50%;
  background:var(--blue);box-shadow:0 0 0 5px rgba(1,144,246,.2);
}
.why-item{padding-bottom:54px;}
.why-item:last-child{padding-bottom:4px;}
.why-item .tag{color:var(--dimmer);display:block;margin-bottom:12px;}
.why-item h3{font-size:clamp(19px,2.2vw,24px);color:var(--white);margin-bottom:11px;}
.why-item p{color:var(--dim);font-size:15.5px;line-height:1.7;max-width:470px;}

/* ================= MARQUEE ================= */
#tira{background:var(--void);padding:36px 0 44px;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.mq{display:flex;width:max-content;will-change:transform;}
.mq + .mq{margin-top:14px;}
.mq span{
  font-family:'Space Grotesk',sans-serif;font-weight:500;
  font-size:clamp(26px,4.4vw,54px);letter-spacing:-.02em;
  color:rgba(217,234,250,.13);padding-right:.55em;display:flex;align-items:center;gap:.5em;
}
.mq span::after{
  content:'';width:9px;height:9px;border-radius:50%;background:rgba(1,144,246,.5);flex-shrink:0;
}
.mq.alt span{color:transparent;-webkit-text-stroke:1px rgba(92,184,255,.28);}

/* ================= CONTACTO ================= */
#contacto{background:var(--navy-deep);padding:140px 0 120px;}
.contact-grid{display:grid;grid-template-columns:1fr;gap:56px;}
@media(min-width:980px){.contact-grid{grid-template-columns:.9fr 1.1fr;gap:64px;}}
.contact-head .eyebrow{margin-bottom:22px;}
.contact-head h2{font-size:clamp(28px,3.8vw,44px);color:var(--white);margin-bottom:20px;}
.contact-head p{color:var(--dim);font-size:16.5px;line-height:1.7;max-width:400px;margin-bottom:36px;}
.contact-detail{display:flex;flex-direction:column;gap:16px;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--dim);}
.contact-detail a{color:var(--white);border-bottom:1px solid var(--line);transition:color .3s,border-color .3s;}
.contact-detail a:hover{color:var(--blue-bright);border-color:var(--blue);}
form.cf{display:flex;flex-direction:column;gap:24px;}
.frow{display:grid;grid-template-columns:1fr;gap:24px;}
@media(min-width:620px){.frow.two{grid-template-columns:1fr 1fr;}}
.field{display:flex;flex-direction:column;gap:9px;}
.field label{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dimmer);}
.field input,.field textarea{
  background:transparent;border:none;border-bottom:1px solid var(--line);
  padding:11px 2px;font-size:15.5px;color:var(--white);font-family:'Inter',sans-serif;
  transition:border-color .35s;
}
.field textarea{resize:vertical;min-height:74px;}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);}
.field input::placeholder,.field textarea::placeholder{color:rgba(217,234,250,.24);}
.ffoot{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:6px;}
.fnote{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--dimmer);max-width:290px;line-height:1.6;}
.fstatus{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--blue-bright);display:none;}

/* ================= FOOTER ================= */
footer{background:var(--void);padding:56px 0 34px;color:var(--dimmer);}
.foot-row{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px;
  padding-bottom:32px;border-bottom:1px solid var(--line);margin-bottom:26px;
}
.foot-row img{height:70px;filter:brightness(0) invert(1);opacity:.85;}
.foot-links{display:flex;gap:26px;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;}
.foot-links a:hover{color:var(--white);}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.06em;}

:focus-visible{outline:2px solid var(--blue);outline-offset:3px;}
@media(prefers-reduced-motion:reduce){
  .reveal-up{opacity:1 !important;transform:none !important;}
  .line-mask > span{transform:none !important;}
  .mani-text .w{color:var(--white) !important;}
  .scroll-cue .track::after{animation:none;}
}