 :root{
  --ink:#101820;
  --muted:#56616d;
  --line:#dfe6ee;
  --paper:#ffffff;
  --soft:#eef4f9;
  --blue:#004f9f;
  --blue-dark:#003b73;
  --blue-deep:#06233f;
  --blue-soft:#e8f1fa;
  --red:#df1f2d;
  --gray:#3f4650;
  --shadow:0 28px 80px rgba(0,63,130,.16);
  --radius:28px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:linear-gradient(180deg,#ffffff 0%,#f4f8fc 100%)}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}.section-pad{padding:96px 6vw}.narrow{max-width:980px;margin:auto}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-weight:800;font-size:12px;color:var(--blue);margin:0 0 18px}.lead{font-size:20px;line-height:1.65;color:var(--muted);max-width:720px}.site-header{position:sticky;top:0;z-index:20;height:84px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.90);backdrop-filter:blur(16px);border-bottom:1px solid rgba(230,233,238,.75)}.brand img{width:210px}.main-nav{display:flex;align-items:center;gap:34px;font-size:14px;font-weight:700}.main-nav a:not(.nav-cta){color:#333}.main-nav a:hover{color:var(--blue)}.nav-cta{border:1px solid var(--blue);color:var(--blue);padding:13px 18px;border-radius:999px;transition:.25s ease}.nav-cta:hover{background:var(--blue);color:#fff;transform:translateY(-2px);box-shadow:0 14px 32px rgba(11,95,165,.18)}.nav-toggle{display:none;background:none;border:0;width:42px;height:42px}.nav-toggle span{display:block;height:2px;background:var(--ink);margin:8px 0}.hero{min-height:calc(100vh - 84px);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:70px}.hero h1{font-size:clamp(46px,7vw,94px);line-height:.94;letter-spacing:-.07em;margin:0;max-width:980px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:999px;font-weight:800;font-size:14px}.btn{transition:transform .25s ease,box-shadow .25s ease,background .25s ease}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--blue);color:#fff;box-shadow:0 18px 38px rgba(11,95,165,.18)}.btn-primary:hover{background:var(--blue-dark)}.btn-secondary{border:1px solid var(--line);color:var(--ink);background:#fff}.btn-secondary:hover{box-shadow:0 14px 34px rgba(32,36,40,.08)}.hero-visual{--mx:50%;--my:50%;height:560px;border-radius:var(--radius);background:radial-gradient(circle at var(--mx) var(--my),rgba(11,94,168,.18),transparent 20%),radial-gradient(circle at 18% 20%,rgba(6,47,95,.18),transparent 34%),linear-gradient(140deg,#ffffff,#edf4fa);position:relative;overflow:hidden;box-shadow:var(--shadow);transition:background .15s ease}.hero-visual:before{content:"";position:absolute;inset:12%;background-image:linear-gradient(rgba(17,19,23,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(17,19,23,.08) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle,#000,transparent 72%)}.orb{position:absolute;border-radius:50%;background:var(--blue);opacity:.9}.orb-one{width:12px;height:12px;left:24%;top:28%;box-shadow:130px 55px 0 #111317,250px 170px 0 var(--blue),75px 285px 0 #111317}.orb-two{width:9px;height:9px;right:26%;bottom:24%;box-shadow:-95px -120px 0 var(--blue-dark),-210px 40px 0 #111317}.network-card{position:absolute;left:38px;right:38px;bottom:38px;padding:28px;border-radius:24px;background:rgba(255,255,255,.78);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.8)}.network-card strong{display:block;letter-spacing:.08em;font-size:14px}.network-card small{display:block;color:var(--muted);margin-top:8px}.mini-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.mini-metrics span{border:1px solid var(--line);border-radius:16px;padding:12px;background:rgba(255,255,255,.62);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.mini-metrics b{display:block;color:var(--blue);font-size:22px;letter-spacing:-.04em;margin-bottom:2px}.pulse{width:12px;height:12px;background:var(--blue);border-radius:50%;display:inline-block;margin-bottom:16px;box-shadow:0 0 0 8px rgba(11,94,168,.14)}.intro{font-size:34px;line-height:1.22;letter-spacing:-.04em;color:#20242a}.trust-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}.trust-strip div{border:1px solid var(--line);border-radius:22px;padding:24px;background:#fff;box-shadow:0 14px 32px rgba(7,61,111,.05)}.trust-strip strong{display:block;font-size:42px;color:var(--blue);letter-spacing:-.05em}.trust-strip span{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:4px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:42px}.section-head h2{font-size:clamp(36px,5vw,68px);line-height:1;letter-spacing:-.06em;margin:0;max-width:760px}.compact{display:block}.accordion{display:flex;gap:14px;min-height:480px}.acc-item{display:flex;flex:0 0 94px;border:1px solid var(--line);border-radius:26px;background:#fff;overflow:hidden;transition:flex .45s ease,box-shadow .45s ease,transform .3s ease,border-color .3s ease}.acc-item:hover{border-color:rgba(11,95,165,.32);transform:translateY(-3px)}.acc-item.active{flex:1 1 auto;box-shadow:var(--shadow);border-color:rgba(11,95,165,.20)}.acc-tab{width:94px;padding:24px 18px;background:#fff;border:0;border-right:1px solid var(--line);display:flex;align-items:center;gap:18px;cursor:pointer;writing-mode:vertical-rl;transform:rotate(180deg);font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#191c21;transition:background .25s ease,color .25s ease}.acc-item.active .acc-tab,.acc-tab:hover{background:linear-gradient(180deg,var(--blue),var(--blue-dark));color:#fff}.acc-item.active .icon,.acc-tab:hover .icon{background:rgba(255,255,255,.16)}.acc-item.active .icon svg,.acc-tab:hover .icon svg{fill:#fff}.icon{width:38px;height:38px;border-radius:14px;background:var(--soft);display:grid;place-items:center;flex:0 0 38px;transition:.25s ease}.icon svg{width:22px;height:22px;fill:var(--ink);transition:.25s ease}.acc-panel{padding:52px;display:none;max-width:720px}.acc-item.active .acc-panel{display:block}.acc-panel h3{font-size:42px;letter-spacing:-.05em;line-height:1;margin:0 0 18px}.acc-panel p{font-size:18px;line-height:1.7;color:var(--muted);margin:0 0 24px}.acc-panel ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}.acc-panel li{padding-left:20px;position:relative;color:#333}.acc-panel li:before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--blue)}.method{background:var(--soft)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:42px}.steps div{background:#fff;padding:34px}.steps span{display:block;color:var(--blue);font-weight:900;margin-bottom:40px}.steps h3{font-size:22px;margin:0 0 10px}.steps p{color:var(--muted);line-height:1.6;margin:0}.contact{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center;background:linear-gradient(135deg,var(--blue-dark),#111923 58%,#0b5ea8);color:#fff;position:relative;overflow:hidden}.contact:before{content:"";position:absolute;inset:auto -10% -45% auto;width:520px;height:520px;border-radius:50%;background:rgba(11,94,168,.18);filter:blur(20px)}.contact>*{position:relative}.contact h2{font-size:clamp(38px,5vw,68px);line-height:1;letter-spacing:-.06em;margin:0}.contact-card{display:grid;gap:12px}.contact-card a{padding:22px 24px;border:1px solid rgba(255,255,255,.18);border-radius:20px;background:rgba(255,255,255,.05);font-weight:800}.contact-card a:hover{background:#fff;color:var(--ink)}.site-footer{padding:42px 6vw;display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}.site-footer img{width:190px}.float-wa,.to-top{position:fixed;right:22px;z-index:30;border:0;border-radius:50%;width:54px;height:54px;display:grid;place-items:center;font-weight:900;box-shadow:0 18px 40px rgba(0,0,0,.18)}.float-wa{bottom:88px;background:var(--blue);color:#fff}.float-wa:hover{background:var(--blue);transform:translateY(-2px)}.to-top{bottom:24px;background:#fff;color:#111317;border:1px solid var(--line);cursor:pointer;opacity:0;pointer-events:none;transition:.25s}.to-top.show{opacity:1;pointer-events:auto}
@media(max-width:900px){.site-header{height:76px}.brand img{width:168px}.nav-toggle{display:block}.main-nav{position:fixed;left:0;right:0;top:76px;background:#fff;border-bottom:1px solid var(--line);padding:22px 6vw;display:none;flex-direction:column;align-items:flex-start}.main-nav.open{display:flex}.hero{grid-template-columns:1fr;min-height:auto;padding-top:62px}.hero-visual{height:360px}.hero h1{font-size:48px}.section-pad{padding:70px 5vw}.intro{font-size:26px}.section-head{display:block}.accordion{display:grid;min-height:unset}.acc-item,.acc-item.active{display:block;flex:auto}.acc-tab{width:100%;writing-mode:horizontal-tb;transform:none;border-right:0;border-bottom:1px solid var(--line);justify-content:flex-start}.acc-panel{padding:28px;max-width:none}.acc-panel h3{font-size:30px}.steps{grid-template-columns:1fr}.contact{grid-template-columns:1fr}.site-footer{display:grid}.float-wa,.to-top{right:16px}}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:none}.acc-tab:focus-visible,.btn:focus-visible,.contact-card a:focus-visible,.nav-cta:focus-visible{outline:3px solid rgba(11,94,168,.35);outline-offset:3px}
@media(max-width:900px){.trust-strip{grid-template-columns:1fr}.mini-metrics{grid-template-columns:1fr 1fr 1fr}.acc-item:hover{transform:none}}

/* Paleta inspirada en integradoresti.com: azul corporativo, blanco y grises técnicos */
.nav-cta,.btn-primary,.float-wa{letter-spacing:.01em}
.acc-item.active .acc-tab,.acc-tab:hover{background:linear-gradient(180deg,var(--blue),var(--blue-dark));}
.btn-secondary:hover,.contact-card a:hover{border-color:rgba(11,94,168,.22)}


/* V2 — Colores Integradores TI aplicados de forma visible */
body{background:linear-gradient(180deg,#ffffff 0%,#eef4f9 48%,#ffffff 100%)}
.site-header{background:rgba(255,255,255,.94);border-bottom:3px solid var(--blue);box-shadow:0 10px 28px rgba(0,59,115,.08)}
.main-nav a:not(.nav-cta):hover{color:var(--red)}
.nav-cta{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 14px 32px rgba(223,31,45,.18)}
.nav-cta:hover{background:#b91824;border-color:#b91824;color:#fff}
.eyebrow{color:var(--red)}
.hero{position:relative;isolation:isolate}
.hero:before{content:"";position:absolute;left:0;top:60px;width:8px;height:72%;border-radius:999px;background:linear-gradient(180deg,var(--blue),var(--red));z-index:-1}
.hero h1{color:var(--blue-deep)}
.hero .lead{border-left:4px solid var(--blue);padding-left:18px}
.btn-primary{background:var(--red);box-shadow:0 18px 38px rgba(223,31,45,.22)}
.btn-primary:hover{background:#b91824}
.btn-secondary{border:1px solid var(--blue);color:var(--blue-dark);background:#fff}
.btn-secondary:hover{background:var(--blue-soft);box-shadow:0 14px 34px rgba(0,79,159,.12)}
.hero-visual{background:radial-gradient(circle at var(--mx) var(--my),rgba(223,31,45,.16),transparent 18%),radial-gradient(circle at 18% 20%,rgba(0,79,159,.24),transparent 34%),linear-gradient(140deg,#ffffff,#e8f1fa 54%,#dcebf7);border:1px solid rgba(0,79,159,.16)}
.orb{background:var(--red)}
.orb-one{box-shadow:130px 55px 0 var(--blue-deep),250px 170px 0 var(--blue),75px 285px 0 var(--blue-dark)}
.orb-two{box-shadow:-95px -120px 0 var(--blue-dark),-210px 40px 0 var(--red)}
.pulse{background:var(--red);box-shadow:0 0 0 8px rgba(223,31,45,.14)}
.mini-metrics b,.trust-strip strong{color:var(--blue)}
.trust-strip div{border-top:4px solid var(--blue)}
.trust-strip div:nth-child(2){border-top-color:var(--red)}
.section-head h2{color:var(--blue-deep)}
.acc-item{border-color:#d8e3ee}
.acc-item.active{border-color:rgba(0,79,159,.35);box-shadow:0 30px 80px rgba(0,79,159,.16)}
.acc-item.active .acc-tab,.acc-tab:hover{background:linear-gradient(180deg,var(--blue),var(--blue-dark))!important;color:#fff}
.acc-panel h3{color:var(--blue-deep)}
.acc-panel li:before{background:var(--red)}
.method{background:linear-gradient(180deg,#eef4f9,#ffffff)}
.steps span{color:var(--red)}
.steps div{border-top:4px solid transparent}
.steps div:hover{border-top-color:var(--blue);transform:translateY(-4px);transition:.25s ease;box-shadow:0 16px 36px rgba(0,79,159,.09)}
.contact{background:linear-gradient(135deg,var(--blue-deep),var(--blue-dark) 50%,var(--blue));border-top:8px solid var(--red)}
.contact .eyebrow{color:#fff}
.contact-card a{border-color:rgba(255,255,255,.22)}
.contact-card a:hover{background:var(--red);color:#fff;border-color:var(--red)}
.float-wa{background:var(--red);color:#fff}
.float-wa:hover{background:#b91824}
.to-top.show:hover{background:var(--blue);color:#fff}
.site-footer{border-top:4px solid var(--blue);background:#fff}
@media(max-width:900px){.hero:before{display:none}.hero .lead{border-left:0;padding-left:0}.site-header{border-bottom:2px solid var(--blue)}}
