:root{
 --navy:#061827;
 --navy2:#0a2538;
 --steel:#60717d;
 --blue:#0d5f99;
 --electric:#2ba6df;
 --cyan:#65c7ee;
 --silver:#d7e0e6;
 --light:#edf3f6;
 --white:#fff;
 --ink:#102431;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;background:#071722;color:#d8e5ec;line-height:1.6}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.container{width:min(1200px,92%);margin:auto}
.eyebrow{font-size:11px;letter-spacing:2.6px;text-transform:uppercase;font-weight:800;color:var(--cyan);margin:0 0 14px}
.topline{background:#04111d;border-bottom:1px solid rgba(255,255,255,.06);font-size:11px}
.topline .container{height:34px;display:flex;justify-content:flex-end;align-items:center;gap:25px}
.topline a{color:#9fb3bf}
.site-header{position:sticky;top:0;z-index:100;background:rgba(5,18,29,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav-wrap{height:82px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:14px}
.brand-logo{width:88px;height:48px;object-fit:contain;background:#fff;border-radius:4px;padding:4px}
.brand-copy{display:flex;flex-direction:column}
.brand-copy strong{font-family:Montserrat,sans-serif;font-size:13px;letter-spacing:1.6px;color:#fff}
.brand-copy small{font-size:10px;color:#8fa3ae}
.main-nav{display:flex;gap:22px;align-items:center}
.main-nav a{font-size:12px;font-weight:700;color:#cfdae0;transition:.2s}
.main-nav a:hover{color:#fff}
.nav-cta{padding:12px 17px;background:linear-gradient(135deg,var(--blue),var(--electric));color:#fff!important;border-radius:4px;box-shadow:0 10px 30px rgba(43,166,223,.18)}
.menu-toggle{display:none;color:#fff;background:none;border:0;font-size:26px}

.hero{position:relative;min-height:720px;display:flex;align-items:center;overflow:hidden;background:#071722}
.hero:before{content:"";position:absolute;inset:0;background:
 linear-gradient(90deg,rgba(4,17,29,.96) 0%,rgba(4,17,29,.83) 44%,rgba(4,17,29,.30) 74%,rgba(4,17,29,.55) 100%),
 url('imagenes/hero.jpg') center/cover no-repeat}
.hero:after{content:"";position:absolute;inset:0;background:
 linear-gradient(135deg,transparent 0 46%,rgba(43,166,223,.08) 46% 48%,transparent 48% 100%),
 repeating-linear-gradient(90deg,transparent 0 118px,rgba(255,255,255,.018) 119px 120px)}
.hero .container{position:relative;z-index:2}
.hero-content{max-width:790px;padding:90px 0}
.hero h1{font-family:Montserrat,sans-serif;color:#fff;font-size:clamp(46px,6vw,78px);line-height:1.01;letter-spacing:-2.8px;margin:0 0 24px}
.hero h1 em{font-style:normal;color:var(--cyan)}
.hero p{font-size:18px;max-width:720px;color:#c8d8e1}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0 34px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;border-radius:4px;font-weight:800;font-size:12px;border:1px solid transparent}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--electric));color:#fff;box-shadow:0 14px 35px rgba(43,166,223,.18)}
.btn-outline{border-color:rgba(255,255,255,.34);color:#fff;background:rgba(255,255,255,.035)}
.hero-metrics{display:flex;gap:34px;flex-wrap:wrap;margin-top:26px}
.hero-metrics div{padding-left:14px;border-left:2px solid var(--electric)}
.hero-metrics strong{display:block;color:#fff;font-size:13px}
.hero-metrics span{display:block;color:#8fa5b2;font-size:10px;margin-top:2px}

.section{padding:105px 0;position:relative}
.section-dark{background:#071722}
.section-mid{background:#0a2233}
.section-steel{background:linear-gradient(180deg,#102d40,#0b2231)}
.section-light{background:#eaf0f3;color:var(--ink)}
.section-light .eyebrow{color:var(--blue)}
.section-light h2,.section-light h3{color:#0a2538}
.section-heading{max-width:760px;margin-bottom:46px}
.section-heading h2,.split h2,.cta h2{font-family:Montserrat,sans-serif;font-size:clamp(33px,4vw,54px);line-height:1.08;letter-spacing:-1.7px;margin:0 0 16px;color:#fff}
.section-heading p{color:#9fb3bf}
.section-light .section-heading p{color:#5c6e79}

.tech-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.tech-card{min-height:330px;position:relative;overflow:hidden;background:#0b2231}
.tech-card .bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:.4s;filter:saturate(.85)}
.tech-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,18,29,.1),rgba(5,18,29,.92))}
.tech-card:hover .bg{transform:scale(1.045);filter:saturate(1.1)}
.tech-content{position:absolute;z-index:2;left:28px;right:28px;bottom:26px}
.tech-no{font-size:10px;color:var(--cyan);font-weight:800;letter-spacing:1.8px}
.tech-card h3{font-family:Montserrat,sans-serif;font-size:24px;margin:6px 0 9px;color:#fff}
.tech-card p{font-size:12px;color:#b8cad4;max-width:520px}
.tech-card a{font-size:11px;font-weight:800;color:#fff;border-bottom:1px solid var(--electric);padding-bottom:3px}

.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.category{border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.01));padding:26px;min-height:210px}
.category small{color:var(--cyan);font-weight:800}
.category h3{font-family:Montserrat,sans-serif;font-size:18px;color:#fff;margin:10px 0}
.category p{font-size:12px;color:#8ea3af}

.photo-mosaic{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:12px}
.photo-panel{min-height:360px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.photo-panel.small{min-height:174px}
.photo-panel:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(5,18,29,.91))}
.photo-caption{position:absolute;z-index:2;left:22px;right:22px;bottom:20px}
.photo-caption small{color:var(--cyan);font-weight:800;font-size:10px;letter-spacing:1.6px}
.photo-caption strong{display:block;color:#fff;font-family:Montserrat,sans-serif;font-size:18px;margin-top:5px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center}
.split p{color:#9db0bb}
.list{display:grid;gap:11px;margin-top:26px}
.list div{font-size:13px;color:#d7e3e9}
.list div:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--electric);margin:0 10px 1px 0}
.process{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(255,255,255,.09);margin-top:30px}
.process div{background:#0b2231;padding:20px}
.process small{color:var(--cyan);font-weight:800}
.process strong{display:block;color:#fff;margin-top:8px;font-size:13px}

.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#cbd7de}
.sector-grid div{background:#eef3f5;padding:28px;color:#183342;font-weight:800;font-size:13px}

.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.project{min-height:360px;position:relative;overflow:hidden;background:#0b2231;padding:28px;display:flex;flex-direction:column;justify-content:flex-end}
.project:before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,#153f58,#071722)}
.project>*{position:relative;z-index:2}
.project small{color:var(--cyan);font-weight:800}
.project h3{font-family:Montserrat,sans-serif;color:#fff;font-size:22px;margin:8px 0}
.project p{color:#a8bbc5;font-size:12px}

.cta{padding:100px 0;background:linear-gradient(135deg,#0c344b,#071722);position:relative;overflow:hidden}
.cta:after{content:"CMT";position:absolute;right:-3%;bottom:-18%;font:800 220px/1 Montserrat,sans-serif;color:rgba(255,255,255,.025)}
.cta-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.contact-box{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);padding:30px}
.contact-box h3{font-family:Montserrat,sans-serif;color:#fff;margin:0 0 18px}
.contact-box div{padding:13px 0;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#a8bbc5}
.contact-box strong{display:block;color:#fff}

.footer{background:#04111d;padding:65px 0 22px;border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px}
.footer h4{font-size:12px;color:#fff}
.footer p,.footer a{color:#8196a2;font-size:11px}
.footer a{display:block;margin:8px 0}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);margin-top:46px;padding-top:18px;display:flex;justify-content:space-between;color:#5f7480;font-size:10px}
.floating-wa{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--blue),var(--electric));font-weight:900;z-index:120;box-shadow:0 12px 32px rgba(0,0,0,.3)}

.quote-form{background:#0a2233;border:1px solid rgba(255,255,255,.1);padding:30px;display:grid;gap:12px}
.quote-form input,.quote-form select,.quote-form textarea{background:#071722;border:1px solid rgba(255,255,255,.12);color:#fff;padding:13px;font:inherit;font-size:12px}
.quote-form input::placeholder,.quote-form textarea::placeholder{color:#778c98}

@media(max-width:980px){
 .main-nav{gap:13px}.tech-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}
 .photo-mosaic{grid-template-columns:1fr 1fr}.photo-mosaic>div:first-child{grid-row:span 2}
 .split,.cta-grid{grid-template-columns:1fr}.projects{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
 .topline{display:none}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:82px;left:0;right:0;background:#061827;padding:18px 4%;flex-direction:column;align-items:stretch;border-top:1px solid rgba(255,255,255,.07)}
 .main-nav.open{display:flex}.hero{min-height:690px}.hero h1{letter-spacing:-1.5px}.hero-content{padding:78px 0}
 .category-grid,.photo-mosaic,.sector-grid,.projects,.footer-grid{grid-template-columns:1fr}
 .photo-mosaic>div:first-child{grid-row:auto}.section,.cta{padding:72px 0}.process{grid-template-columns:1fr}
 .brand-copy small{display:none}.footer-bottom{flex-direction:column;gap:8px}
}

/* V7 — identidad premium / logo circular */
.brand-logo{
  width:68px!important;
  height:68px!important;
  object-fit:cover!important;
  border-radius:50%!important;
  background:#fff!important;
  padding:5px!important;
  border:2px solid rgba(255,255,255,.82)!important;
  box-shadow:
    0 0 0 5px rgba(43,166,223,.08),
    0 8px 28px rgba(0,0,0,.34),
    0 0 24px rgba(43,166,223,.18)!important;
}
.site-header .brand{gap:15px}
.site-header .brand-copy strong{
  font-size:14px!important;
  letter-spacing:1.9px!important;
}
.site-header .brand-copy small{
  text-transform:uppercase;
  letter-spacing:1px;
  color:#8da2ae!important;
}
.site-header{background:rgba(3,15,25,.95)!important}
.nav-wrap{height:88px!important}
.main-nav a{letter-spacing:.25px}
.nav-cta{border-radius:24px!important;padding:13px 20px!important}

/* refinamiento visual hero */
.hero:before{
  background:
    linear-gradient(90deg,rgba(3,15,25,.98) 0%,rgba(3,15,25,.90) 39%,rgba(3,15,25,.50) 64%,rgba(3,15,25,.28) 100%),
    url('imagenes/hero.jpg') center/cover no-repeat!important;
}
.hero h1{
  text-transform:uppercase;
  font-size:clamp(44px,5.7vw,74px)!important;
  line-height:.98!important;
  max-width:860px;
}
.hero h1 .hero-blue{color:#1c92e5}
.hero-rule{
  width:54px;height:3px;border-radius:3px;
  background:linear-gradient(90deg,#1e94e7,#63c9ef);
  margin:22px 0 14px;
}
.hero-copy{max-width:640px!important;font-size:16px!important}
.trust-panel{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  max-width:930px;
  background:rgba(3,19,31,.72);
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  overflow:hidden;
  margin-top:28px;
  backdrop-filter:blur(8px);
}
.trust-item{padding:16px 18px;display:flex;gap:12px;align-items:center;border-right:1px solid rgba(255,255,255,.08)}
.trust-item:last-child{border-right:0}
.trust-icon{width:38px;height:38px;border:1px solid #1c92e5;border-radius:50%;display:grid;place-items:center;color:#49b8ec;font-size:17px;font-weight:800;flex:0 0 auto}
.trust-item strong{display:block;font-size:11px;color:white;letter-spacing:.5px;text-transform:uppercase}
.trust-item span{display:block;font-size:10px;color:#9db0bc;margin-top:2px}

/* franja de trabajos reales */
.real-work-strip{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  background:#061827;
}
.real-work{
  min-height:116px;display:grid;grid-template-columns:150px 1fr;align-items:center;
  gap:18px;padding:14px 22px;border-right:1px solid rgba(255,255,255,.08);
}
.real-work:last-child{border-right:0}
.real-work img{width:150px;height:84px;object-fit:cover;border-radius:5px;filter:saturate(.9)}
.real-work small{font-size:9px;color:#52b9ea;letter-spacing:1.3px;font-weight:800}
.real-work strong{display:block;color:#fff;font-size:13px;margin:5px 0}
.real-work p{margin:0;color:#8ea4af;font-size:10px}

/* servicios más compactos y 'wow' */
.tech-grid{grid-template-columns:repeat(5,1fr)!important;gap:10px!important;background:transparent!important;border:0!important}
.tech-card{min-height:315px!important;border-radius:8px;border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 40px rgba(0,0,0,.12)}
.tech-content{left:18px!important;right:18px!important;bottom:17px!important}
.tech-card h3{font-size:17px!important;line-height:1.05}
.tech-card p{font-size:10px!important;line-height:1.45;min-height:42px}
.tech-no{font-size:19px!important;letter-spacing:0!important;color:#1f9ae9!important}

/* línea inferior tecnológica */
.stat-band{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.08);
  background:#061827;
}
.stat-band div{padding:27px 30px;border-right:1px solid rgba(255,255,255,.09)}
.stat-band div:last-child{border-right:0}
.stat-band strong{font:800 24px Montserrat,sans-serif;color:#2ea8ec}
.stat-band span{display:block;color:#d2dfe5;font-size:10px;text-transform:uppercase;letter-spacing:.7px;margin-top:3px}

/* Footer logo slightly smaller */
.footer .brand-logo{width:58px!important;height:58px!important}
@media(max-width:1080px){
 .tech-grid{grid-template-columns:repeat(2,1fr)!important}
 .trust-panel{grid-template-columns:repeat(2,1fr)}
 .trust-item:nth-child(2){border-right:0}
 .real-work-strip{grid-template-columns:1fr}
 .real-work{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
 .stat-band{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
 .brand-logo{width:56px!important;height:56px!important}
 .nav-wrap{height:76px!important}
 .main-nav{top:76px!important}
 .hero h1{
  font-size:clamp(31px,8.7vw,46px)!important;
  line-height:1.02!important;
  letter-spacing:-1.6px!important;
  max-width:100%!important;
  overflow-wrap:normal;
  word-break:normal;
}
 .trust-panel{grid-template-columns:1fr}
 .trust-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
 .real-work{grid-template-columns:110px 1fr;padding:12px 4%}
 .real-work img{width:110px;height:72px}
 .tech-grid{grid-template-columns:1fr!important}
 .stat-band{grid-template-columns:1fr}
 .stat-band div{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
}

/* V8 — casos de éxito + captación comercial */
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.case-card{background:#0a2233;border:1px solid rgba(255,255,255,.09);overflow:hidden;border-radius:8px}
.case-photo{height:260px;background-size:cover;background-position:center;position:relative}
.case-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(4,17,29,.78))}
.case-body{padding:26px}
.case-body small{color:#58bce9;font-size:9px;font-weight:800;letter-spacing:1.5px}
.case-body h3{font:700 22px/1.15 Montserrat,sans-serif;color:#fff;margin:8px 0 13px}
.case-body p{color:#9db0bb;font-size:12px}
.case-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.07);margin:20px 0}
.case-meta div{background:#081d2b;padding:12px}
.case-meta strong{display:block;color:#fff;font-size:10px}
.case-meta span{display:block;color:#7f95a0;font-size:9px;margin-top:2px}
.case-link{font-size:10px;font-weight:800;color:#58bce9;letter-spacing:.5px}
.lead-section{padding:105px 0;background:linear-gradient(145deg,#0b3045,#061827);position:relative;overflow:hidden}
.lead-section:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 139px,rgba(255,255,255,.018) 140px 141px)}
.lead-wrap{position:relative;z-index:2;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.lead-copy h2{font:700 clamp(34px,4vw,54px)/1.06 Montserrat,sans-serif;color:#fff;margin:0 0 18px}
.lead-copy p{color:#a9bac4}
.lead-benefits{display:grid;gap:11px;margin-top:28px}
.lead-benefits div{font-size:12px;color:#d7e4ea}
.lead-benefits div:before{content:"✓";color:#58bce9;font-weight:900;margin-right:9px}
.lead-form{background:#071722;border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:30px;box-shadow:0 25px 70px rgba(0,0,0,.2)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lead-form label{display:block;font-size:9px;color:#91a6b1;letter-spacing:.8px;text-transform:uppercase;margin-bottom:5px}
.lead-form input,.lead-form select,.lead-form textarea{
 width:100%;background:#0a2233;border:1px solid rgba(255,255,255,.11);color:#fff;padding:13px 12px;border-radius:4px;font:inherit;font-size:12px;outline:none
}
.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{border-color:#2ca9e8;box-shadow:0 0 0 2px rgba(44,169,232,.08)}
.lead-form textarea{min-height:120px;resize:vertical}
.form-full{grid-column:1/-1}
.form-note{font-size:9px;color:#748a96;margin:10px 0 0}
.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}
.micro-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:32px}
.micro-proof div{border:1px solid rgba(255,255,255,.08);padding:14px;background:rgba(255,255,255,.02)}
.micro-proof strong{display:block;color:#fff;font-size:11px}
.micro-proof span{display:block;color:#7f95a0;font-size:9px;margin-top:3px}
@media(max-width:900px){.case-grid,.lead-wrap{grid-template-columns:1fr}.micro-proof{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.form-grid,.case-meta,.micro-proof{grid-template-columns:1fr}.case-photo{height:220px}}

/* V9 service landing pages */
.service-hero{min-height:520px;display:flex;align-items:center;position:relative;overflow:hidden;background:#061827}
.service-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,15,25,.96),rgba(3,15,25,.78) 48%,rgba(3,15,25,.30)),var(--hero-img) center/cover no-repeat}
.service-hero .container{position:relative;z-index:2}
.service-hero h1{font:800 clamp(42px,5vw,68px)/1 Montserrat,sans-serif;color:#fff;max-width:820px;margin:0 0 20px;letter-spacing:-2px}
.service-hero p{max-width:720px;color:#c7d7df;font-size:17px}
.service-detail{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:start}
.service-detail h2{font:700 clamp(31px,4vw,48px)/1.08 Montserrat,sans-serif;color:#fff;margin:0 0 18px}
.service-detail p{color:#a6b8c2}
.scope-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:25px}
.scope-grid div{border:1px solid rgba(255,255,255,.09);background:#0a2233;padding:17px;color:#dce7ec;font-size:12px}
.scope-grid div:before{content:"✓";color:#58bce9;font-weight:900;margin-right:8px}
.service-photo{min-height:480px;background-size:cover;background-position:center;border-radius:8px;box-shadow:0 25px 70px rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.08)}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.related a{display:block;padding:20px;background:#0a2233;border:1px solid rgba(255,255,255,.08);color:#fff;font-size:12px;font-weight:800}
.related a span{display:block;color:#6fbfe7;font-size:9px;margin-top:6px}
.breadcrumbs{font-size:10px;color:#8da0aa;margin-bottom:22px}
.breadcrumbs a{color:#7ec8ea}
@media(max-width:800px){.service-detail{grid-template-columns:1fr}.scope-grid,.related{grid-template-columns:1fr}.service-photo{min-height:320px}}

.floating-wa{background:#25D366!important;color:#fff!important}
.floating-wa svg{width:28px;height:28px;display:block}
.wa-inline{display:inline-flex;align-items:center;gap:8px}
.wa-inline svg{width:17px;height:17px}

@media(max-width:380px){
  .hero h1{
    font-size:8.4vw!important;
    letter-spacing:-1.3px!important;
  }
}