:root{
  --n3-blue:#063E73;
  --n3-blue-2:#0B5D9B;
  --n3-sky:#EAF5FF;
  --n3-graphite:#17212F;
  --n3-graphite-2:#263241;
  --n3-gray:#6C7684;
  --n3-light:#F5F8FB;
  --n3-line:#DDE7F0;
  --n3-white:#FFFFFF;
  --shadow:0 18px 45px rgba(23,33,47,.12);
  --shadow-soft:0 10px 30px rgba(23,33,47,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--n3-graphite);
  background:#fff;
  line-height:1.65;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1160px,92vw);margin:0 auto}
.section{padding:92px 0}
.section-soft{background:var(--n3-light)}
.eyebrow{
  color:var(--n3-blue-2);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.82rem;
  margin-bottom:12px;
}
h1,h2,h3,h4{font-family:'Jost',system-ui,sans-serif;line-height:1.1;margin:0 0 18px}
h1{font-size:clamp(2.7rem,6vw,5.5rem);letter-spacing:-.055em}
h2{font-size:clamp(2rem,4vw,3.35rem);letter-spacing:-.035em}
h3{font-size:1.45rem}
p{margin:0 0 18px;color:var(--n3-gray)}
.lead{font-size:1.16rem;color:#DCE9F5;max-width:760px}
.text-center{text-align:center}
.max-center{max-width:790px;margin:0 auto 48px}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 22px;
  border-radius:999px;
  font-weight:800;
  transition:.25s ease;
  border:1px solid transparent;
  cursor:pointer;
}
.btn-primary{
  background:var(--n3-blue-2);
  color:#fff;
  box-shadow:0 14px 30px rgba(11,93,155,.25);
}
.btn-primary:hover{background:var(--n3-blue);transform:translateY(-2px)}
.btn-light{
  background:#fff;
  color:var(--n3-graphite);
  border-color:rgba(255,255,255,.35);
}
.btn-light:hover{transform:translateY(-2px);box-shadow:0 14px 35px rgba(0,0,0,.12)}
.btn-outline{
  border-color:rgba(255,255,255,.45);
  color:#fff;
  background:rgba(255,255,255,.06);
  backdrop-filter: blur(8px);
}
.btn-outline:hover{background:#fff;color:var(--n3-graphite);transform:translateY(-2px)}

.topbar{
  background:var(--n3-graphite);
  color:#D7E2EC;
  font-size:.9rem;
}
.topbar .container{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:9px 0;
}
.topbar span{display:inline-flex;align-items:center;gap:7px}
.topbar strong{color:#fff}
.topbar i{color:#8FD6FF}

.nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(221,231,240,.82);
}
.nav-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:86px;
  gap:24px;
}
.logo{
  display:flex;
  align-items:center;
  gap:12px;
}
.logo img{width:184px;height:auto}
.nav-links{
  display:flex;
  align-items:center;
  gap:8px;
}
.nav-links a{
  color:var(--n3-graphite-2);
  font-weight:800;
  padding:10px 13px;
  border-radius:999px;
  transition:.2s ease;
}
.nav-links a:hover,
.nav-links a.active{color:var(--n3-blue-2);background:var(--n3-sky)}
.menu-btn{display:none;background:transparent;border:0;font-size:1.55rem;color:var(--n3-graphite)}

.hero{
  position:relative;
  min-height:calc(100vh - 126px);
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(23,33,47,.92),rgba(23,33,47,.74) 48%,rgba(6,62,115,.58)),
    url("../img/hero-bg-industrial.jpg") center/cover no-repeat;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(135deg,transparent 0 72%,rgba(255,255,255,.08) 72% 72.4%,transparent 72.4%),
    radial-gradient(circle at 80% 12%,rgba(143,214,255,.16),transparent 28%),
    radial-gradient(circle at 12% 95%,rgba(11,93,155,.24),transparent 36%);
}
.hero-grid{
  position:relative;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:48px;
  padding:82px 0;
}
.hero h1{color:#fff;margin-bottom:22px}
.hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:30px 0 34px;
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.16);
  padding:8px 12px;
  border-radius:999px;
  font-weight:700;
  font-size:.92rem;
}
.hero-card{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(255,255,255,.55);
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 30px 70px rgba(0,0,0,.22);
  transform:rotate(1.2deg);
}
.hero-card img{height:360px;width:100%;object-fit:cover}
.hero-card-body{padding:26px 28px}
.hero-card-body h3{color:var(--n3-graphite);margin-bottom:8px}
.hero-card-body p{margin:0}
.stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--n3-line);
  border-radius:22px;
  overflow:hidden;
  margin-top:34px;
  box-shadow:var(--shadow-soft);
}
.stat{
  background:#fff;
  padding:22px;
}
.stat strong{
  display:block;
  font-family:'Jost';
  font-size:2rem;
  color:var(--n3-blue);
  line-height:1;
}
.stat span{
  font-size:.88rem;
  color:var(--n3-gray);
  font-weight:700;
}

.service-strip{
  margin-top:-38px;
  position:relative;
  z-index:3;
}
.strip-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  border-radius:24px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow);
  border:1px solid var(--n3-line);
}
.strip-item{
  padding:24px 18px;
  text-align:center;
  border-right:1px solid var(--n3-line);
  transition:.25s ease;
}
.strip-item:last-child{border-right:0}
.strip-item:hover{background:var(--n3-sky);transform:translateY(-4px)}
.strip-item i{display:block;font-size:1.65rem;color:var(--n3-blue-2);margin-bottom:10px}
.strip-item span{font-weight:900;font-size:.94rem;color:var(--n3-graphite)}

.about-grid{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:58px;
  align-items:center;
}
.img-stack{
  position:relative;
}
.img-main{
  border-radius:30px;
  box-shadow:var(--shadow);
  height:520px;
  object-fit:cover;
  width:100%;
}
.float-card{
  position:absolute;
  right:-28px;
  bottom:34px;
  background:#fff;
  border-left:6px solid var(--n3-blue-2);
  border-radius:18px;
  padding:24px;
  box-shadow:var(--shadow);
  max-width:280px;
}
.float-card strong{font-family:'Jost';font-size:1.45rem;color:var(--n3-graphite)}
.check-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:28px 0;
}
.check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-weight:800;
  color:var(--n3-graphite);
}
.check i{color:var(--n3-blue-2);margin-top:4px}

.cards-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.card{
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:.28s ease;
}
.card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
.card-img{height:210px;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;transition:.35s}
.card:hover .card-img img{transform:scale(1.07)}
.card-body{padding:28px}
.icon-pill{
  width:62px;height:62px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:-58px;
  margin-bottom:18px;
  background:var(--n3-blue-2);
  color:#fff;
  font-size:1.55rem;
  box-shadow:0 12px 28px rgba(11,93,155,.25);
  position:relative;
}
.card-body h3{margin-bottom:12px;color:var(--n3-graphite)}
.card-body p{font-size:.98rem;margin-bottom:0}

.dark-band{
  background:
    linear-gradient(135deg,rgba(23,33,47,.98),rgba(6,62,115,.94)),
    url("../img/hero-2.jpg") center/cover no-repeat;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.dark-band:after{
  content:"";
  position:absolute;
  width:520px;height:520px;
  right:-160px;top:-160px;
  border-radius:50%;
  border:58px solid rgba(255,255,255,.06);
}
.dark-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:42px;
  align-items:center;
}
.dark-band h2,.dark-band h3{color:#fff}
.dark-band p{color:#D7E2EC}
.reason-list{
  display:grid;
  gap:14px;
}
.reason{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  padding:18px 20px;
  border-radius:18px;
  display:flex;
  gap:14px;
}
.reason i{color:#8FD6FF;margin-top:4px}
.reason strong{display:block;color:#fff}
.reason span{display:block;color:#D7E2EC;font-size:.94rem}

.process{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}
.step{
  position:relative;
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:22px;
  padding:28px;
  box-shadow:var(--shadow-soft);
}
.step-num{
  width:42px;height:42px;border-radius:50%;
  background:var(--n3-blue-2);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:900;margin-bottom:18px;
}
.step h3{font-size:1.25rem}

.cta{
  background:var(--n3-blue);
  color:#fff;
  border-radius:30px;
  padding:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  box-shadow:var(--shadow);
}
.cta h2{font-size:clamp(1.8rem,3vw,2.8rem);color:#fff;margin-bottom:8px}
.cta p{color:#D7E2EC;margin:0}

.page-hero{
  background:
    linear-gradient(90deg,rgba(23,33,47,.94),rgba(6,62,115,.82)),
    url("../img/hero-2.jpg") center/cover no-repeat;
  color:#fff;
  padding:92px 0;
}
.page-hero h1{color:#fff}
.breadcrumb{color:#D7E2EC;font-weight:700}
.breadcrumb a{color:#fff}

.service-detail{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.detail-card{
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:24px;
  padding:30px;
  box-shadow:var(--shadow-soft);
  display:grid;
  grid-template-columns:70px 1fr;
  gap:18px;
}
.detail-icon{
  width:66px;height:66px;border-radius:20px;
  background:var(--n3-sky);
  color:var(--n3-blue-2);
  display:flex;align-items:center;justify-content:center;
  font-size:1.65rem;
}
.detail-card ul{margin:12px 0 0;padding-left:18px;color:var(--n3-gray)}
.detail-card li{margin:6px 0}

.contact-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:36px;
  align-items:start;
}
.contact-info{
  background:var(--n3-graphite);
  color:#fff;
  border-radius:28px;
  padding:36px;
  box-shadow:var(--shadow);
}
.contact-info h2{color:#fff}
.contact-info p{color:#D7E2EC}
.contact-list{display:grid;gap:16px;margin-top:28px}
.contact-row{
  display:flex;gap:13px;align-items:flex-start;
  padding:16px;
  border-radius:16px;
  background:rgba(255,255,255,.08);
}
.contact-row i{color:#8FD6FF;margin-top:4px}
.contact-row strong{display:block;color:#fff}
.contact-row span{color:#D7E2EC}

.form{
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:28px;
  padding:36px;
  box-shadow:var(--shadow);
}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
label{font-weight:800;color:var(--n3-graphite)}
input,textarea,select{
  width:100%;
  border:1px solid var(--n3-line);
  border-radius:14px;
  padding:14px 15px;
  font:inherit;
  color:var(--n3-graphite);
  background:var(--n3-light);
  outline:none;
  transition:.2s ease;
}
textarea{min-height:145px;resize:vertical}
input:focus,textarea:focus,select:focus{
  border-color:var(--n3-blue-2);
  box-shadow:0 0 0 4px rgba(11,93,155,.12);
  background:#fff;
}

.footer{
  background:var(--n3-graphite);
  color:#D7E2EC;
  padding:58px 0 28px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr .8fr .8fr 1fr;
  gap:34px;
}
.footer img{width:180px;background:#fff;border-radius:14px;padding:10px;margin-bottom:18px}
.footer h3{color:#fff;font-size:1.15rem}
.footer a,.footer p{color:#D7E2EC}
.footer a:hover{color:#8FD6FF}
.footer-links{display:grid;gap:9px}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:38px;
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  gap:18px;
  font-size:.92rem;
}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.show{opacity:1;transform:none}

.whatsapp{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:60;
  width:58px;height:58px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:1.7rem;
  box-shadow:0 16px 32px rgba(0,0,0,.22);
}

@media(max-width:980px){
  .topbar{display:none}
  .nav-inner{min-height:76px}
  .logo img{width:150px}
  .menu-btn{display:block}
  .nav-links{
    position:absolute;
    top:76px;left:0;right:0;
    background:#fff;
    border-bottom:1px solid var(--n3-line);
    box-shadow:var(--shadow-soft);
    flex-direction:column;
    align-items:stretch;
    padding:18px 4vw 24px;
    display:none;
  }
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 14px}
  .nav-links .btn{width:100%}
  .hero-grid,.about-grid,.dark-grid,.contact-grid{grid-template-columns:1fr}
  .hero{min-height:auto}
  .hero-card{transform:none}
  .strip-grid{grid-template-columns:repeat(2,1fr)}
  .strip-item:nth-child(2n){border-right:0}
  .cards-grid,.process{grid-template-columns:repeat(2,1fr)}
  .service-detail{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .cta{flex-direction:column;align-items:flex-start}
}
@media(max-width:640px){
  .section{padding:66px 0}
  .hero-grid{padding:58px 0}
  .hero h1{font-size:2.65rem}
  .lead{font-size:1.02rem}
  .stats{grid-template-columns:1fr}
  .cards-grid,.process,.form-grid{grid-template-columns:1fr}
  .strip-grid{grid-template-columns:1fr}
  .strip-item{border-right:0;border-bottom:1px solid var(--n3-line)}
  .check-grid{grid-template-columns:1fr}
  .detail-card{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column}
}


/* ================= AJUSTES V2 - LOGO SUPERPUESTO Y CORTE VISUAL ================= */

/* Topbar más ordenada: ubicación a la derecha para que no compita con el logo */
.topbar .container{
  justify-content:flex-end;
}
.topbar span:first-child{
  margin-right:auto;
}
.topbar span:first-child{
  transform:translateX(220px);
}
.topbar span:last-child{
  margin-left:auto;
}

/* Header: logo con placa blanca más protagonista, superpuesta hacia el hero */
.nav{
  overflow:visible;
}
.nav-inner{
  min-height:74px;
  position:relative;
}
.logo{
  position:relative;
  align-self:stretch;
  display:flex;
  align-items:center;
  min-width:270px;
}
.logo img{
  position:absolute;
  left:0;
  top:-26px;
  width:245px;
  max-width:none;
  background:#fff;
  border:1px solid rgba(221,231,240,.95);
  border-radius:0 0 24px 0;
  padding:14px 18px;
  box-shadow:0 18px 42px rgba(23,33,47,.18);
  z-index:4;
}
.logo::after{
  content:"";
  position:absolute;
  left:236px;
  top:0;
  width:3px;
  height:92px;
  background:linear-gradient(180deg,var(--n3-blue-2),var(--n3-blue));
  opacity:.9;
  z-index:3;
}
.nav-links{
  margin-left:auto;
}

/* Hero baja apenas para que el logo pise visualmente borde superior y foto */
.hero{
  margin-top:0;
}
.hero-grid{
  padding-top:100px;
}

/* Sección blanca que corta el exceso de azul en servicios */
.service-bridge{
  background:#fff;
  position:relative;
  overflow:hidden;
}
.service-bridge::before{
  content:"";
  position:absolute;
  left:-90px;
  top:-140px;
  width:330px;
  height:330px;
  border:42px solid rgba(11,93,155,.06);
  border-radius:50%;
}
.service-bridge::after{
  content:"";
  position:absolute;
  right:-80px;
  bottom:-120px;
  width:320px;
  height:300px;
  background:linear-gradient(135deg,rgba(11,93,155,.08),rgba(23,33,47,.04));
  clip-path:polygon(0 22%,100% 0,78% 100%,0 72%);
}
.bridge-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:22px;
}
.bridge-card{
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:24px;
  padding:28px;
  box-shadow:var(--shadow-soft);
  transition:.28s ease;
}
.bridge-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
}
.bridge-card i{
  width:58px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  color:#fff;
  background:var(--n3-blue-2);
  font-size:1.45rem;
  margin-bottom:18px;
}
.bridge-card h3{
  margin-bottom:10px;
}
.bridge-card p{
  margin-bottom:0;
}

@media(max-width:980px){
  .topbar .container{
    justify-content:space-between;
  }
  .topbar span:first-child{
    transform:none;
    margin-right:0;
  }
  .logo{
    min-width:auto;
    align-self:center;
  }
  .logo img{
    position:static;
    width:165px;
    padding:8px 10px;
    border-radius:0 0 16px 0;
    box-shadow:0 8px 22px rgba(23,33,47,.13);
  }
  .logo::after{
    display:none;
  }
  .hero-grid{
    padding-top:58px;
  }
  .bridge-grid{
    grid-template-columns:1fr;
  }
}


/* ================= AJUSTES V3 - LOGO EQUILIBRADO Y SERVICIOS NO-BOTÓN ================= */

/* Ubicación sin quedar tapada por el logo */
.topbar .container{
  justify-content:space-between !important;
}
.topbar span:first-child{
  margin-left:255px !important;
  margin-right:24px !important;
  transform:none !important;
  white-space:nowrap;
}
.topbar span:last-child{
  margin-left:auto !important;
  white-space:nowrap;
}

/* Logo: placa más chica y superposición pareja arriba/abajo */
.logo{
  min-width:235px !important;
}
.logo img{
  top:-14px !important;
  width:205px !important;
  padding:10px 14px !important;
  border-radius:0 0 20px 0 !important;
  box-shadow:0 14px 32px rgba(23,33,47,.16) !important;
}
.logo::after{
  left:206px !important;
  height:82px !important;
}
.nav-inner{
  min-height:76px !important;
}
.hero-grid{
  padding-top:82px !important;
}

/* Hero servicios: dejan de parecer botones falsos */
.hero-badges{
  gap:12px 18px !important;
  margin:30px 0 34px !important;
  max-width:620px;
}
.badge{
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  color:#EAF5FF !important;
  font-weight:800 !important;
  font-size:.96rem !important;
  box-shadow:none !important;
}
.badge i{
  width:30px;
  height:30px;
  border-radius:10px;
  background:rgba(143,214,255,.16);
  border:1px solid rgba(143,214,255,.24);
  color:#8FD6FF;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.85rem;
}
.badge:hover{
  transform:none !important;
}

/* Variante: cuando queramos links reales, que se vean como chips clickeables */
.hero-badges a.badge{
  transition:.2s ease;
}
.hero-badges a.badge:hover{
  color:#fff !important;
}
.hero-badges a.badge:hover i{
  background:#fff;
  color:var(--n3-blue);
}

/* Ajuste responsive */
@media(max-width:980px){
  .topbar span:first-child{
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .logo{
    min-width:auto !important;
  }
  .logo img{
    width:160px !important;
    top:auto !important;
    padding:8px 10px !important;
  }
  .hero-grid{
    padding-top:58px !important;
  }
}
@media(max-width:640px){
  .hero-badges{
    display:grid;
    grid-template-columns:1fr;
    gap:10px !important;
  }
}


/* ================= AJUSTES V4 - REGLAS FINALES FUERTES ================= */
.topbar .topbar-grid{
  display:grid !important;
  grid-template-columns:260px 1fr auto !important;
  align-items:center !important;
  gap:20px !important;
  justify-content:initial !important;
}
.topbar .topbar-location{
  grid-column:2 !important;
  margin:0 !important;
  transform:none !important;
  white-space:nowrap !important;
}
.topbar .topbar-contact{
  grid-column:3 !important;
  margin:0 !important;
  white-space:nowrap !important;
}

.nav .logo{
  min-width:235px !important;
  width:235px !important;
  align-self:stretch !important;
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
.nav .logo img{
  position:absolute !important;
  left:0 !important;
  top:-18px !important;
  width:205px !important;
  max-width:205px !important;
  height:auto !important;
  background:#ffffff !important;
  padding:12px 14px !important;
  border:1px solid rgba(221,231,240,.95) !important;
  border-radius:22px !important;
  box-shadow:0 16px 34px rgba(23,33,47,.17) !important;
  z-index:10 !important;
}
.nav .logo::after{
  display:none !important;
}
.nav .nav-inner{
  min-height:76px !important;
}
.hero .hero-grid{
  padding-top:82px !important;
}

.hero .hero-badges{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(170px, max-content)) !important;
  gap:10px 24px !important;
  align-items:start !important;
  margin:28px 0 34px !important;
}
.hero .hero-badges .badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  border-radius:0 !important;
  color:#EAF5FF !important;
  font-weight:800 !important;
  text-align:left !important;
}
.hero .hero-badges .badge i{
  flex:0 0 30px !important;
  width:30px !important;
  height:30px !important;
  border-radius:9px !important;
  background:rgba(143,214,255,.16) !important;
  border:1px solid rgba(143,214,255,.26) !important;
  color:#8FD6FF !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:.82rem !important;
}
.hero .hero-badges .badge:hover{
  color:#ffffff !important;
}
.hero .hero-badges .badge:hover i{
  background:#ffffff !important;
  color:var(--n3-blue) !important;
}

@media(max-width:980px){
  .topbar .topbar-grid{
    display:flex !important;
    justify-content:space-between !important;
    gap:14px !important;
  }
  .topbar .topbar-location,
  .topbar .topbar-contact{
    grid-column:auto !important;
    margin:0 !important;
    transform:none !important;
  }
  .nav .logo{
    width:auto !important;
    min-width:auto !important;
    align-self:center !important;
  }
  .nav .logo img{
    position:static !important;
    width:158px !important;
    max-width:158px !important;
    padding:8px 10px !important;
    border-radius:16px !important;
    box-shadow:0 10px 22px rgba(23,33,47,.14) !important;
  }
  .hero .hero-grid{
    padding-top:58px !important;
  }
  .hero .hero-badges{
    grid-template-columns:1fr 1fr !important;
  }
}
@media(max-width:640px){
  .hero .hero-badges{
    grid-template-columns:1fr !important;
  }
}


/* ================= AJUSTES V5 - LOGO CHICO Y HERO CON TRANSICIONES ================= */

/* Logo más chico, centrado visualmente entre topbar y hero */
.nav .logo{
  min-width:198px !important;
  width:198px !important;
}
.nav .logo img{
  width:168px !important;
  max-width:168px !important;
  padding:9px 11px !important;
  top:-10px !important;
  border-radius:20px !important;
  box-shadow:0 12px 28px rgba(23,33,47,.16) !important;
}

/* Deja espacio justo para el logo sin tapar el texto de arriba */
.topbar .topbar-grid{
  grid-template-columns:210px 1fr auto !important;
}
.hero .hero-grid{
  padding-top:72px !important;
}

/* Hero copy slider */
.hero-copy-slider{
  position:relative;
  min-height:255px;
  max-width:780px;
}
.hero-copy-slide{
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  opacity:0;
  transform:translateY(18px);
  pointer-events:none;
  transition:opacity .65s ease, transform .65s ease;
}
.hero-copy-slide.active{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.hero-copy-slide h1{
  margin-bottom:22px;
}
.hero-slider-dots{
  display:flex;
  align-items:center;
  gap:10px;
  margin:8px 0 30px;
}
.hero-slider-dots button{
  width:34px;
  height:6px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.28);
  cursor:pointer;
  transition:.25s ease;
}
.hero-slider-dots button.active{
  width:54px;
  background:#8FD6FF;
}

/* Ya no se usan badges arriba; quedan los accesos de abajo */
.hero .hero-badges{
  display:none !important;
}

@media(max-width:980px){
  .nav .logo{
    width:auto !important;
    min-width:auto !important;
  }
  .nav .logo img{
    position:static !important;
    width:150px !important;
    max-width:150px !important;
    padding:8px 10px !important;
    border-radius:16px !important;
  }
  .topbar .topbar-grid{
    grid-template-columns:auto auto !important;
  }
  .hero-copy-slider{
    min-height:285px;
  }
}
@media(max-width:640px){
  .hero-copy-slider{
    min-height:330px;
  }
}


/* ================= AJUSTES V6 - HERO MÁS PROLIJO + IMÁGENES SINCRONIZADAS ================= */

/* El título del carrusel baja tamaño para no aplastar el texto ni el botón */
.hero-copy-slider{
  min-height:270px !important;
  max-width:680px !important;
}
.hero-copy-slide h1{
  font-size:clamp(2.35rem, 4.8vw, 4.65rem) !important;
  line-height:.98 !important;
  letter-spacing:-.045em !important;
  margin-bottom:20px !important;
}
.hero-copy-slide .lead{
  max-width:620px !important;
  font-size:1.08rem !important;
  line-height:1.72 !important;
}
.hero-slider-dots{
  margin:0 0 26px !important;
}

/* Botón separado del texto/carrusel para evitar solapes */
.hero .btn-primary{
  position:relative;
  z-index:3;
  margin-top:0 !important;
}

/* Hero card ahora tiene slides de imagen y contenido */
.hero-image-slider{
  position:relative !important;
  min-height:520px !important;
  overflow:hidden !important;
}
.hero-image-slide{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transition:opacity .75s ease, transform .75s ease;
  transform:scale(1.015);
  display:flex;
  flex-direction:column;
}
.hero-image-slide.active{
  opacity:1;
  pointer-events:auto;
  transform:scale(1);
}
.hero-image-slide img{
  height:360px !important;
  width:100% !important;
  object-fit:cover !important;
}
.hero-image-slide .hero-card-body{
  flex:1;
  background:#fff;
}

/* Un poco más de aire general en hero */
.hero .hero-grid{
  gap:54px !important;
  align-items:center !important;
}

@media(max-width:980px){
  .hero-copy-slider{
    min-height:300px !important;
  }
  .hero-copy-slide h1{
    font-size:clamp(2.35rem, 8vw, 3.9rem) !important;
  }
  .hero-image-slider{
    min-height:500px !important;
  }
}
@media(max-width:640px){
  .hero-copy-slider{
    min-height:350px !important;
  }
  .hero-copy-slide h1{
    font-size:2.3rem !important;
  }
  .hero-copy-slide .lead{
    font-size:1rem !important;
  }
  .hero-image-slider{
    min-height:460px !important;
  }
  .hero-image-slide img{
    height:280px !important;
  }
}


/* ================= AJUSTES V7 - HERO SIN SOLAPES + BOTÓN HEADER ================= */

/* Botón de presupuesto del menú: texto blanco siempre */
.nav-links .btn-primary,
.nav-links a.btn-primary,
.nav .btn-primary{
  color:#ffffff !important;
}
.nav-links .btn-primary:hover,
.nav-links a.btn-primary:hover,
.nav .btn-primary:hover{
  color:#ffffff !important;
}

/* Frases más compactas y bloque con altura suficiente */
.hero-copy-slider{
  min-height:230px !important;
  max-width:650px !important;
  margin-bottom:6px !important;
}
.hero-copy-slide h1{
  font-size:clamp(2.3rem, 4.35vw, 4.15rem) !important;
  line-height:1.02 !important;
  letter-spacing:-.04em !important;
  margin-bottom:18px !important;
}
.hero-copy-slide .lead{
  max-width:560px !important;
  font-size:1.05rem !important;
  line-height:1.62 !important;
  margin-bottom:0 !important;
}
.hero-slider-dots{
  margin:10px 0 26px !important;
  position:relative !important;
  z-index:3 !important;
}
.hero-slider-dots button{
  height:5px !important;
}

/* Evita que el botón quede demasiado pegado al carrusel */
.hero .btn-primary{
  margin-top:4px !important;
}

/* Ajuste para pantallas medianas tipo captura */
@media(max-width:980px){
  .hero-copy-slider{
    min-height:250px !important;
    max-width:620px !important;
  }
  .hero-copy-slide h1{
    font-size:clamp(2.25rem, 7vw, 3.65rem) !important;
  }
  .hero-copy-slide .lead{
    max-width:540px !important;
    font-size:1rem !important;
  }
}
@media(max-width:700px){
  .hero-copy-slider{
    min-height:260px !important;
  }
  .hero-copy-slide h1{
    font-size:2.8rem !important;
  }
}
@media(max-width:520px){
  .hero-copy-slider{
    min-height:290px !important;
  }
  .hero-copy-slide h1{
    font-size:2.35rem !important;
  }
}


/* ================= AJUSTES V11 - HERO MÁS COMPLETO ================= */
.hero-copy-slider{
  min-height: 340px !important;
  max-width: 660px !important;
}
.hero-copy-slide h1{
  font-size: clamp(2.15rem, 4vw, 3.85rem) !important;
  line-height: 1.03 !important;
  margin-bottom: 16px !important;
}
.hero-copy-slide .lead{
  max-width: 590px !important;
  font-size: 1.08rem !important;
  line-height: 1.62 !important;
  margin-bottom: 12px !important;
}
.hero-sublead{
  max-width: 560px;
  margin: 0;
  color: #d6e5f3;
  font-size: .98rem;
  line-height: 1.6;
}
.hero-slider-dots{
  margin: 16px 0 22px !important;
}
.hero .btn-primary{
  margin-top: 2px !important;
}
.hero-image-slider{
  min-height: 580px !important;
}
.hero-image-slide img{
  height: 355px !important;
}
.hero-card-body{
  padding: 24px 28px 28px !important;
}
.hero-card-kicker{
  display: inline-block;
  margin-bottom: 8px;
  color: var(--n3-blue-2);
  font-weight: 800;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.hero-card-body h3{
  margin-bottom: 10px !important;
  font-size: 1.7rem;
}
.hero-card-body p{
  margin-bottom: 16px !important;
  color: var(--n3-gray);
  line-height: 1.6;
}
.hero-card-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.hero-card-tags span{
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--n3-sky);
  color: var(--n3-blue);
  font-weight: 800;
  font-size: .84rem;
}
@media (max-width: 980px){
  .hero-copy-slider{ min-height: 360px !important; }
  .hero-image-slider{ min-height: 560px !important; }
}
@media (max-width: 640px){
  .hero-copy-slider{ min-height: 390px !important; }
  .hero-copy-slide h1{ font-size: 2.15rem !important; }
  .hero-copy-slide .lead{ font-size: 1rem !important; }
  .hero-sublead{ font-size: .95rem; }
  .hero-image-slider{ min-height: 520px !important; }
  .hero-image-slide img{ height: 260px !important; }
  .hero-card-body h3{ font-size: 1.45rem; }
}


/* ================= AJUSTES V14 - LOGO CON TRANSICIÓN EN SCROLL ================= */

/* El hero ya no necesita la etiqueta azul de arriba */
.hero > .container .eyebrow{
  display:none !important;
}

/* Header más vivo: logo grande al tope, logo chico al scrollear */
.nav{
  transition:box-shadow .35s ease, background .35s ease, border-color .35s ease;
}
.nav.scrolled{
  box-shadow:0 12px 28px rgba(23,33,47,.10);
  background:rgba(255,255,255,.98);
}
.nav .nav-inner{
  transition:min-height .35s ease;
}
.nav.scrolled .nav-inner{
  min-height:66px !important;
}

/* Estado inicial: logo con placa blanca flotante/superpuesta */
.nav .logo{
  transition:width .35s ease, min-width .35s ease;
}
.nav .logo img{
  transition:
    width .42s ease,
    max-width .42s ease,
    top .42s ease,
    padding .42s ease,
    border-radius .42s ease,
    box-shadow .42s ease,
    transform .42s ease,
    opacity .25s ease;
  will-change:width, top, transform;
}

/* Estado scrolleado: se integra al header blanco como marca más chica */
.nav.scrolled .logo{
  width:170px !important;
  min-width:170px !important;
}
.nav.scrolled .logo img{
  top:50% !important;
  transform:translateY(-50%) !important;
  width:132px !important;
  max-width:132px !important;
  padding:6px 8px !important;
  border-radius:14px !important;
  box-shadow:0 6px 18px rgba(23,33,47,.10) !important;
}

/* Al achicar el header, acomodamos links y botón */
.nav.scrolled .nav-links a:not(.btn){
  padding-top:8px;
  padding-bottom:8px;
}
.nav.scrolled .nav-links .btn{
  padding:12px 20px;
}

/* Evita que el hero quede demasiado pegado tras sacar el eyebrow */
.hero-copy-slider{
  margin-top:12px !important;
}

@media(max-width:980px){
  .nav.scrolled .nav-inner{
    min-height:72px !important;
  }
  .nav.scrolled .logo{
    width:auto !important;
    min-width:auto !important;
  }
  .nav.scrolled .logo img{
    position:static !important;
    transform:none !important;
    width:138px !important;
    max-width:138px !important;
    padding:7px 9px !important;
    border-radius:14px !important;
  }
}


/* ================= AJUSTES V15 - SERVICIOS CON TABS INTERNOS ================= */

.services-hero{padding-bottom:70px!important}
.services-tabs-section{padding-top:76px!important}

.services-tabs{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
  margin:0 0 28px;
  background:#fff;
  padding:14px;
  border:1px solid var(--n3-line);
  border-radius:26px;
  box-shadow:var(--shadow-soft);
}

.service-tab{
  border:0;
  background:var(--n3-light);
  color:var(--n3-graphite);
  border-radius:18px;
  padding:18px 12px;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  transition:.24s ease;
  min-height:94px;
}

.service-tab i{font-size:1.45rem;color:var(--n3-blue-2);transition:.24s ease}
.service-tab:hover{transform:translateY(-3px);background:var(--n3-sky)}
.service-tab.active{
  background:linear-gradient(135deg,var(--n3-blue),var(--n3-blue-2));
  color:#fff;
  box-shadow:0 16px 32px rgba(11,93,155,.22);
}
.service-tab.active i{color:#fff}

.service-panels{position:relative;min-height:610px}
.service-panel{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:0;
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:30px;
  overflow:hidden;
  box-shadow:var(--shadow);
  opacity:0;
  pointer-events:none;
  transform:translateY(18px);
  transition:opacity .32s ease, transform .32s ease;
  position:absolute;
  inset:0;
}
.service-panel.active{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
  position:relative;
}
.service-panel-img{min-height:520px;background:var(--n3-graphite)}
.service-panel-img img{width:100%;height:100%;min-height:520px;object-fit:cover}
.service-panel-content{padding:48px;align-self:center}
.panel-kicker{
  display:inline-block;
  color:var(--n3-blue-2);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.8rem;
  margin-bottom:12px;
}
.service-panel-content h2{margin-bottom:18px}
.service-panel-content p{font-size:1.02rem}
.panel-list{display:grid;gap:10px;margin:24px 0 28px}
.panel-list p{margin:0;display:flex;gap:10px;color:var(--n3-graphite);font-weight:700}
.panel-list i{color:var(--n3-blue-2);margin-top:5px}

@media(max-width:1100px){.services-tabs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
  .service-panel{grid-template-columns:1fr}
  .service-panel-img,.service-panel-img img{min-height:310px}
  .service-panel-content{padding:34px}
  .service-panels{min-height:850px}
}
@media(max-width:640px){
  .services-tabs{grid-template-columns:repeat(2,1fr);padding:10px}
  .service-tab{min-height:82px;padding:14px 8px;font-size:.88rem}
  .service-panel-content{padding:28px 22px}
  .service-panels{min-height:930px}
}


/* ================= AJUSTES V16 - CARRUSEL MANUAL DE TRABAJOS ================= */
.works-carousel-section{overflow:hidden}
.works-carousel{position:relative;min-height:620px}
.works-slide{
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:42px;
  align-items:center;
  opacity:0;
  pointer-events:none;
  position:absolute;
  inset:0;
  transform:translateY(16px);
  transition:opacity .35s ease, transform .35s ease;
}
.works-slide.active{
  opacity:1;
  pointer-events:auto;
  position:relative;
  transform:translateY(0);
}
.works-copy h2{max-width:700px}
.works-copy p{max-width:650px;margin-bottom:26px}
.works-showcase{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  border-radius:28px;
  padding:18px;
  backdrop-filter:blur(10px);
  box-shadow:0 24px 50px rgba(0,0,0,.16);
}
.works-main-image{border-radius:20px;overflow:hidden;margin-bottom:14px}
.works-main-image img{width:100%;height:300px;object-fit:cover;display:block}
.works-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.works-thumbs img{width:100%;height:110px;object-fit:cover;border-radius:16px;display:block}
.works-meta{display:grid;gap:12px}
.work-chip{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  padding:14px 16px;
}
.work-chip strong{display:block;color:#fff;margin-bottom:4px;font-size:1rem}
.work-chip span{display:block;color:#D7E2EC;font-size:.95rem;line-height:1.5}
.works-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px;height:48px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  backdrop-filter:blur(10px);
  transition:.24s ease;
  z-index:5;
}
.works-nav:hover{background:#fff;color:var(--n3-blue);transform:translateY(-50%) scale(1.05)}
.works-prev{left:-8px}
.works-next{right:-8px}
.works-dots{display:flex;justify-content:center;gap:10px;margin-top:24px}
.works-dots span{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.28);display:inline-block;transition:.24s ease}
.works-dots span.active{background:#8FD6FF;transform:scale(1.15)}
@media(max-width:1100px){
  .works-slide{grid-template-columns:1fr;gap:28px}
  .works-carousel{min-height:900px}
  .works-prev{left:0}
  .works-next{right:0}
}
@media(max-width:700px){
  .works-carousel{min-height:980px}
  .works-main-image img{height:240px}
  .works-thumbs img{height:90px}
  .works-nav{width:42px;height:42px;top:auto;bottom:-4px;transform:none}
  .works-nav:hover{transform:scale(1.04)}
  .works-prev{left:calc(50% - 56px)}
  .works-next{right:calc(50% - 56px)}
  .works-dots{margin-top:62px}
}


/* ================= AJUSTES V17 - CARRUSEL DE TRABAJOS MÁS COMPACTO ================= */

.works-carousel-section{
  padding-top:70px !important;
  padding-bottom:70px !important;
}

.works-carousel{
  min-height:470px !important;
}

.works-slide{
  gap:34px !important;
  align-items:center !important;
}

.works-copy h2{
  font-size:clamp(1.9rem, 3vw, 2.85rem) !important;
  margin-bottom:18px !important;
}

.works-copy p{
  margin-bottom:20px !important;
  font-size:1rem !important;
  line-height:1.62 !important;
}

.works-showcase{
  padding:14px !important;
  border-radius:24px !important;
}

.works-main-image{
  border-radius:18px !important;
  margin-bottom:12px !important;
}

.works-main-image img{
  height:210px !important;
}

.works-thumbs{
  gap:10px !important;
  margin-bottom:12px !important;
}

.works-thumbs img{
  height:72px !important;
  border-radius:13px !important;
}

.works-meta{
  grid-template-columns:repeat(3, 1fr) !important;
  gap:10px !important;
}

.work-chip{
  padding:11px 12px !important;
  border-radius:14px !important;
}

.work-chip strong{
  font-size:.88rem !important;
  margin-bottom:2px !important;
}

.work-chip span{
  font-size:.78rem !important;
  line-height:1.35 !important;
}

.works-nav{
  width:42px !important;
  height:42px !important;
}

.works-dots{
  margin-top:16px !important;
}

@media(max-width:1100px){
  .works-carousel{
    min-height:760px !important;
  }
  .works-meta{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:700px){
  .works-carousel-section{
    padding-top:58px !important;
    padding-bottom:58px !important;
  }
  .works-carousel{
    min-height:850px !important;
  }
  .works-main-image img{
    height:190px !important;
  }
  .works-thumbs img{
    height:70px !important;
  }
}


/* ================= AJUSTES V18 - FLECHAS SIN TAPAR TEXTO ================= */

/* En desktop, apenas más afuera del bloque para que respiren */
.works-prev{
  left:-18px !important;
}
.works-next{
  right:-18px !important;
}

/* En tablet/mobile, las flechas bajan y se centran debajo del contenido */
@media(max-width:900px){
  .works-carousel{
    padding-bottom:74px !important;
  }

  .works-nav{
    top:auto !important;
    bottom:8px !important;
    transform:none !important;
    width:44px !important;
    height:44px !important;
  }

  .works-nav:hover{
    transform:scale(1.04) !important;
  }

  .works-prev{
    left:calc(50% - 58px) !important;
    right:auto !important;
  }

  .works-next{
    right:calc(50% - 58px) !important;
    left:auto !important;
  }

  .works-dots{
    margin-top:54px !important;
  }
}

/* En mobile más chico, un poquito más de aire todavía */
@media(max-width:700px){
  .works-carousel{
    padding-bottom:78px !important;
  }

  .works-nav{
    bottom:10px !important;
  }

  .works-dots{
    margin-top:58px !important;
  }
}


/* ================= AJUSTES V19 - CONTROLES DE TRABAJOS ABAJO ================= */

/* Eliminamos definitivamente flechas laterales: ahora van con los puntos */
.works-carousel{
  padding-bottom:0 !important;
}

.works-controls{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:16px !important;
  margin-top:22px !important;
  position:relative !important;
  z-index:8 !important;
}

.works-controls .works-nav{
  position:static !important;
  inset:auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  width:42px !important;
  height:42px !important;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.24) !important;
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  backdrop-filter:blur(10px) !important;
  transition:.24s ease !important;
}

.works-controls .works-nav:hover{
  background:#fff !important;
  color:var(--n3-blue) !important;
  transform:scale(1.05) !important;
}

.works-controls .works-dots{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  margin:0 !important;
}

.works-controls .works-dots span{
  width:11px !important;
  height:11px !important;
}

/* Neutraliza reglas anteriores que mandaban flechas abajo con absolute */
@media(max-width:900px){
  .works-carousel{
    padding-bottom:0 !important;
  }

  .works-controls{
    margin-top:24px !important;
  }

  .works-controls .works-nav{
    position:static !important;
    inset:auto !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    transform:none !important;
  }

  .works-controls .works-nav:hover{
    transform:scale(1.04) !important;
  }

  .works-controls .works-dots{
    margin:0 !important;
  }
}

@media(max-width:700px){
  .works-carousel{
    padding-bottom:0 !important;
  }

  .works-controls{
    margin-top:26px !important;
  }
}


/* ================= AJUSTES V31 - OPTIMIZACIÓN MOBILE ================= */
/* Objetivo: que la web se lea y navegue bien en celulares sin textos cortados,
   sin logos gigantes y con imágenes entendibles dentro de cada bloque. */

html, body{
  max-width:100%;
  overflow-x:hidden;
}

img{
  max-width:100%;
}

/* Header / menú mobile */
@media(max-width:980px){
  .topbar{
    display:none !important;
  }

  .nav{
    overflow:visible !important;
  }

  .nav-inner{
    min-height:68px !important;
    padding-top:8px !important;
    padding-bottom:8px !important;
  }

  .nav .logo,
  .logo{
    min-width:auto !important;
    width:auto !important;
    align-self:center !important;
    position:relative !important;
  }

  .nav .logo img,
  .logo img{
    position:static !important;
    width:138px !important;
    max-width:138px !important;
    padding:6px 8px !important;
    border-radius:14px !important;
    box-shadow:0 8px 22px rgba(23,33,47,.14) !important;
  }

  .logo::after{
    display:none !important;
  }

  .menu-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:44px !important;
    height:44px !important;
    border-radius:14px !important;
    background:var(--n3-sky) !important;
    color:var(--n3-blue-2) !important;
    z-index:80 !important;
  }

  .nav-links{
    position:absolute !important;
    top:100% !important;
    left:14px !important;
    right:14px !important;
    width:auto !important;
    display:none !important;
    flex-direction:column !important;
    gap:8px !important;
    align-items:stretch !important;
    background:#fff !important;
    border:1px solid var(--n3-line) !important;
    border-radius:0 0 22px 22px !important;
    box-shadow:0 24px 55px rgba(23,33,47,.18) !important;
    padding:14px !important;
    margin-left:0 !important;
    z-index:70 !important;
  }

  .nav-links.open{
    display:flex !important;
  }

  .nav-links a{
    width:100% !important;
    text-align:center !important;
    padding:13px 14px !important;
    border-radius:14px !important;
  }

  .nav-links .btn,
  .nav-links .btn-primary{
    justify-content:center !important;
    color:#fff !important;
  }
}

/* Home hero en celular */
@media(max-width:980px){
  .hero{
    min-height:auto !important;
  }

  .hero .hero-grid{
    grid-template-columns:1fr !important;
    gap:28px !important;
    padding-top:44px !important;
    padding-bottom:46px !important;
  }

  .hero-copy-slider{
    min-height:230px !important;
    max-width:100% !important;
  }

  .hero-copy-slide h1{
    font-size:clamp(2.15rem, 9vw, 3.25rem) !important;
    line-height:1.03 !important;
    letter-spacing:-.035em !important;
    margin-bottom:16px !important;
  }

  .hero-copy-slide .lead,
  .hero-sublead{
    max-width:100% !important;
    font-size:1rem !important;
    line-height:1.55 !important;
  }

  .hero-slider-dots{
    margin:0 0 22px !important;
  }

  .hero-slider-dots button{
    width:30px !important;
  }

  .hero-slider-dots button.active{
    width:46px !important;
  }

  .hero-image-slider,
  .hero-card{
    min-height:auto !important;
    transform:none !important;
    border-radius:22px !important;
  }

  .hero-image-slide{
    position:relative !important;
    display:none !important;
    transform:none !important;
    opacity:1 !important;
  }

  .hero-image-slide.active{
    display:flex !important;
  }

  .hero-image-slide img{
    height:230px !important;
    object-fit:cover !important;
  }

  .hero-card-body{
    padding:22px !important;
  }

  .hero-card-body h3{
    font-size:1.25rem !important;
  }

  .hero-card-body p{
    font-size:.96rem !important;
    line-height:1.55 !important;
  }

  .hero-card-tags{
    flex-wrap:wrap !important;
    gap:8px !important;
  }
}

@media(max-width:520px){
  .container{
    width:min(100% - 28px, var(--container)) !important;
  }

  .hero .hero-grid{
    padding-top:32px !important;
  }

  .hero-copy-slider{
    min-height:255px !important;
  }

  .hero-copy-slide h1{
    font-size:2.18rem !important;
  }

  .hero-copy-slide .lead,
  .hero-sublead{
    font-size:.96rem !important;
  }

  .hero .btn-primary{
    width:100% !important;
    justify-content:center !important;
  }

  .hero-image-slide img{
    height:205px !important;
  }
}

/* Tira de servicios del home */
@media(max-width:760px){
  .service-strip{
    margin-top:0 !important;
  }

  .strip-grid{
    grid-template-columns:repeat(2,1fr) !important;
    border-radius:22px !important;
  }

  .strip-item{
    min-height:100px !important;
    padding:18px 10px !important;
    border-bottom:1px solid var(--n3-line) !important;
  }

  .strip-item i{
    font-size:1.2rem !important;
  }

  .strip-item strong{
    font-size:.88rem !important;
  }
}

@media(max-width:430px){
  .strip-grid{
    grid-template-columns:1fr 1fr !important;
  }
}

/* Secciones generales */
@media(max-width:760px){
  .section{
    padding:58px 0 !important;
  }

  .eyebrow{
    font-size:.78rem !important;
    letter-spacing:.18em !important;
  }

  h1{
    font-size:2.35rem !important;
  }

  h2{
    font-size:2rem !important;
    line-height:1.12 !important;
  }

  .lead{
    font-size:1rem !important;
    line-height:1.6 !important;
  }

  .cards-grid,
  .process,
  .bridge-grid,
  .footer-grid{
    grid-template-columns:1fr !important;
  }

  .card,
  .bridge-card{
    border-radius:22px !important;
  }

  .card-img{
    height:190px !important;
  }
}

/* Página Servicios: tabs y paneles */
@media(max-width:980px){
  .services-tabs{
    display:grid !important;
    grid-template-columns:repeat(2,1fr) !important;
    gap:10px !important;
  }

  .service-tab{
    min-height:74px !important;
    justify-content:center !important;
    text-align:center !important;
    padding:12px 10px !important;
    border-radius:18px !important;
  }

  .service-panels{
    min-height:auto !important;
  }

  .service-panel{
    position:relative !important;
    display:none !important;
    grid-template-columns:1fr !important;
    min-height:auto !important;
  }

  .service-panel.active{
    display:grid !important;
  }

  .service-panel-img{
    min-height:0 !important;
    height:auto !important;
  }

  .service-panel-img img{
    min-height:0 !important;
    height:260px !important;
    width:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
  }

  .service-panel-content{
    padding:28px 22px 30px !important;
  }

  .service-panel-content h2{
    font-size:1.75rem !important;
  }

  .service-panel-content p{
    font-size:.98rem !important;
    line-height:1.62 !important;
  }
}

/* Encuadres específicos en servicios mobile */
@media(max-width:980px){
  [data-service-panel="automatizacion"] .service-panel-img img{
    object-position:center center !important;
  }

  [data-service-panel="accesos"] .service-panel-img img{
    object-position:left center !important;
  }

  [data-service-panel="obra"] .service-panel-img img{
    object-position:center center !important;
  }
}

@media(max-width:520px){
  .services-tabs{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  .service-tab{
    min-height:66px !important;
    font-size:.86rem !important;
  }

  .service-tab i{
    font-size:1rem !important;
  }

  .service-panel-img img{
    height:220px !important;
  }

  .service-panel-content{
    padding:24px 18px 26px !important;
  }

  .panel-list{
    gap:9px !important;
  }
}

/* Trabajos recientes / carrusel */
@media(max-width:760px){
  .works-section,
  .works-carousel{
    min-height:auto !important;
  }

  .works-slide{
    min-height:auto !important;
    padding:54px 0 !important;
  }

  .works-grid{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }

  .works-copy h2{
    font-size:2.05rem !important;
    line-height:1.12 !important;
  }

  .works-main-image img{
    height:210px !important;
  }

  .works-thumbs{
    grid-template-columns:repeat(3,1fr) !important;
    gap:8px !important;
  }

  .works-thumbs img{
    height:76px !important;
  }

  .works-controls{
    gap:12px !important;
    margin-top:18px !important;
  }
}

/* Contacto mobile */
@media(max-width:980px){
  .contact-grid{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .contact-info,
  .form{
    padding:28px !important;
    border-radius:24px !important;
  }

  .form-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:520px){
  .page-hero{
    padding:54px 0 !important;
  }

  .page-hero h1{
    font-size:2.25rem !important;
  }

  .contact-info,
  .form{
    padding:22px 18px !important;
  }

  .contact-row{
    padding:14px !important;
  }

  input, textarea, select{
    font-size:16px !important; /* evita zoom automático en iPhone */
  }

  .form .btn,
  .form button{
    width:100% !important;
    justify-content:center !important;
  }
}

/* Footer + WhatsApp */
@media(max-width:760px){
  .footer{
    padding:46px 0 24px !important;
  }

  .footer img{
    max-width:170px !important;
  }

  .footer-bottom{
    gap:10px !important;
    align-items:flex-start !important;
  }

  .whatsapp{
    right:16px !important;
    bottom:16px !important;
    width:54px !important;
    height:54px !important;
    font-size:1.45rem !important;
  }
}



/* ================= AJUSTES V34 - MOBILE B: VERSIÓN COMERCIAL SIMPLIFICADA ================= */
/* Desktop mantiene la web completa. En mobile se muestra una versión más corta y vendible. */

.mobile-home,
.mobile-services-intro{
  display:none;
}

.btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:14px 22px;
  border-radius:999px;
  border:1px solid rgba(11,93,155,.22);
  color:var(--n3-blue-2);
  background:#fff;
  font-weight:900;
}

@media(max-width:760px){
  /* Ocultamos las secciones largas del home desktop para evitar efecto chorizo */
  body:has(.mobile-home) .hero,
  body:has(.mobile-home) .service-strip,
  body:has(.mobile-home) .about-grid,
  body:has(.mobile-home) .section-soft,
  body:has(.mobile-home) .works-carousel-section,
  body:has(.mobile-home) .cta{
    display:none !important;
  }

  .mobile-home{
    display:block !important;
    background:#f6f9fc;
  }

  .mobile-hero-card{
    background:
      linear-gradient(180deg,rgba(23,33,47,.96),rgba(6,62,115,.88)),
      url("../img/hero-bg-industrial.jpg") center/cover no-repeat;
    padding:26px 14px 30px;
  }

  .mobile-hero-img{
    width:min(100%, 430px);
    margin:0 auto 18px;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 22px 45px rgba(0,0,0,.28);
    border:1px solid rgba(255,255,255,.16);
  }

  .mobile-hero-img img{
    display:block;
    width:100%;
    height:205px;
    object-fit:cover;
  }

  .mobile-hero-copy{
    width:min(100%, 430px);
    margin:0 auto;
    color:#fff;
  }

  .mobile-kicker{
    display:inline-block;
    color:#8FD6FF;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:.72rem;
    margin-bottom:10px;
  }

  .mobile-hero-copy h1{
    color:#fff !important;
    font-size:2.38rem !important;
    line-height:1.02 !important;
    letter-spacing:-.04em !important;
    margin:0 0 14px;
  }

  .mobile-hero-copy p{
    color:#EAF5FF;
    font-size:1rem;
    line-height:1.55;
    margin:0 0 20px;
  }

  .mobile-actions{
    display:grid;
    gap:10px;
  }

  .mobile-actions .btn,
  .mobile-cta-final .btn,
  .mobile-work-short .btn{
    width:100%;
    justify-content:center;
  }

  .mobile-section{
    width:min(100% - 28px, 430px);
    margin:0 auto;
    padding:34px 0;
  }

  .mobile-section-head{
    margin-bottom:16px;
  }

  .mobile-section h2,
  .mobile-section-head h2,
  .mobile-cta-final h2{
    font-size:1.85rem !important;
    line-height:1.12 !important;
    letter-spacing:-.025em;
    margin:0 0 10px;
  }

  .mobile-service-list{
    display:grid;
    gap:10px;
  }

  .mobile-service-list a{
    display:grid;
    grid-template-columns:46px 1fr;
    gap:6px 12px;
    align-items:center;
    background:#fff;
    border:1px solid var(--n3-line);
    border-radius:20px;
    padding:15px;
    box-shadow:0 10px 26px rgba(23,33,47,.06);
    color:var(--n3-graphite);
  }

  .mobile-service-list i{
    grid-row:1/3;
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    background:var(--n3-sky);
    color:var(--n3-blue-2);
    font-size:1.15rem;
  }

  .mobile-service-list strong{
    font-size:1rem;
    line-height:1.1;
  }

  .mobile-service-list span{
    color:var(--n3-gray);
    font-size:.9rem;
    line-height:1.35;
  }

  .mobile-about-short{
    background:#fff;
    width:100%;
    max-width:none;
    padding:34px 14px;
    display:grid;
    gap:18px;
  }

  .mobile-about-short > *{
    width:min(100%, 430px);
    margin-left:auto;
    margin-right:auto;
  }

  .mobile-about-short img{
    height:230px;
    object-fit:cover;
    border-radius:24px;
    box-shadow:var(--shadow-soft);
  }

  .mobile-about-short p,
  .mobile-work-short p,
  .mobile-cta-final p{
    color:var(--n3-gray);
    line-height:1.58;
    margin:0 0 16px;
  }

  .mobile-about-short ul{
    list-style:none;
    padding:0;
    margin:14px 0 0;
    display:grid;
    gap:8px;
  }

  .mobile-about-short li{
    background:var(--n3-light);
    border:1px solid var(--n3-line);
    border-radius:14px;
    padding:10px 12px;
    font-weight:800;
    color:var(--n3-graphite);
  }

  .mobile-about-short li::before{
    content:"✓";
    color:var(--n3-blue-2);
    font-weight:900;
    margin-right:8px;
  }

  .mobile-work-short{
    background:#fff;
    border:1px solid var(--n3-line);
    border-radius:24px;
    padding:24px;
    box-shadow:var(--shadow-soft);
    margin-top:30px;
    margin-bottom:34px;
  }

  .mobile-work-short img{
    width:100%;
    height:185px;
    object-fit:cover;
    border-radius:18px;
    margin:8px 0 16px;
  }

  .mobile-cta-final{
    background:linear-gradient(135deg,var(--n3-blue),var(--n3-graphite));
    color:#fff;
    padding:34px 14px 42px;
    text-align:left;
  }

  .mobile-cta-final > *{
    width:min(100%, 430px);
    margin-left:auto;
    margin-right:auto;
  }

  .mobile-cta-final h2{
    color:#fff !important;
  }

  .mobile-cta-final p{
    color:#EAF5FF;
  }

  /* En servicios, escondemos el encabezado explicativo largo y mostramos versión corta */
  .mobile-services-intro{
    display:block !important;
    background:#f6f9fc;
    padding:28px 0 8px;
  }

  .mobile-services-intro h2{
    font-size:1.75rem !important;
    margin:0 0 8px;
  }

  .mobile-services-intro p{
    margin:0;
    color:var(--n3-gray);
    line-height:1.5;
  }

  .services-tabs-section{
    padding-top:24px !important;
  }

  .services-tabs-section .max-center{
    display:none !important;
  }

  .services-tabs{
    border-radius:22px !important;
    box-shadow:none !important;
    padding:10px !important;
    background:#fff !important;
  }

  .service-panel-content .panel-kicker{
    font-size:.7rem !important;
  }

  .service-panel-content h2{
    font-size:1.55rem !important;
  }

  .service-panel-content p{
    display:none !important; /* deja solo bullets, más usable en celular */
  }

  .panel-list{
    margin-top:16px !important;
  }

  .panel-list p{
    display:flex !important;
    font-size:.92rem !important;
  }

  .service-panel-content .btn{
    width:100%;
    justify-content:center;
    margin-top:4px;
  }

  /* Contacto: más simple y directo en mobile */
  .contact-grid{
    gap:16px !important;
  }

  .contact-info h2{
    font-size:1.8rem !important;
  }

  .contact-info > p{
    font-size:.95rem !important;
  }

  .form .eyebrow{
    display:none !important;
  }

  .form h2{
    font-size:1.65rem !important;
  }

  .form > p{
    font-size:.95rem !important;
  }
}

@media(max-width:420px){
  .mobile-hero-copy h1{
    font-size:2.12rem !important;
  }

  .mobile-hero-img img{
    height:190px;
  }

  .mobile-about-short img,
  .mobile-work-short img{
    height:170px;
  }
}



/* ================= AJUSTES V40 - PUBLICACIÓN FINAL ================= */
.not-found-page{
  background:linear-gradient(180deg,#F6F9FC,#FFFFFF);
}
.not-found-card{
  max-width:780px;
  background:#fff;
  border:1px solid var(--n3-line);
  border-radius:30px;
  padding:54px;
  box-shadow:var(--shadow);
}
.not-found-card h1{
  margin-bottom:14px;
}
.not-found-card p{
  font-size:1.08rem;
  line-height:1.7;
}
.not-found-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
@media(max-width:640px){
  .not-found-card{
    padding:32px 22px;
    border-radius:24px;
  }
  .not-found-actions{
    display:grid;
  }
  .not-found-actions .btn{
    width:100%;
    justify-content:center;
  }
}


/* === Footer redesign === */
.footer.footer-elevated{
  background:linear-gradient(135deg,#051f3b 0%, #062b54 54%, #093765 100%);
  color:#E5EEF7;
  padding:56px 0 24px;
  position:relative;
  overflow:hidden;
}
.footer.footer-elevated::before,
.footer.footer-elevated::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.footer.footer-elevated::before{
  width:360px;height:360px;
  right:-140px;top:-120px;
  background:radial-gradient(circle,rgba(143,214,255,.15),transparent 65%);
}
.footer.footer-elevated::after{
  width:420px;height:420px;
  left:-180px;bottom:-220px;
  background:radial-gradient(circle,rgba(11,93,155,.25),transparent 62%);
}
.footer-main{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.2fr .95fr 1fr .95fr;
  gap:28px;
  align-items:start;
}
.footer-col,
.footer-brand-col{
  padding:0 10px 0 0;
}
.footer-col:not(:first-child), .footer-brand-col + .footer-col{
  border-left:1px solid rgba(255,255,255,.14);
  padding-left:28px;
}
.footer-brand{display:inline-flex;flex-direction:column;gap:2px;margin-bottom:18px}
.footer-brandmark{
  display:inline-flex;align-items:flex-end;gap:6px;
  font-family:'Jost',system-ui,sans-serif;
  font-weight:900;letter-spacing:-.05em;line-height:1;
}
.footer-brand-nodo{font-size:3rem;color:#fff}
.footer-brand-num{font-size:3.25rem;color:#2C8EF4}
.footer-brand-sub{
  color:#D8E6F3;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
}
.footer-brand-col p,
.footer-col p,
.footer-col a{color:#E0E8F0}
.footer-brand-col p{max-width:280px}
.footer-social{display:flex;gap:14px;margin-top:16px;flex-wrap:wrap}
.footer-social a{
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.04);transition:.25s ease;font-size:1.08rem;
}
.footer-social a:hover{background:rgba(255,255,255,.12);transform:translateY(-2px)}
.footer.footer-elevated h3{color:#fff;font-size:1.15rem;margin-bottom:14px}
.footer-links{display:grid;gap:10px}
.footer-links a{position:relative;padding-left:16px}
.footer-links a::before{
  content:"›";position:absolute;left:0;top:0;color:#8FD6FF;font-weight:900;
}
.footer-links a:hover{color:#8FD6FF}
.footer-contact-list{display:grid;gap:12px}
.footer-contact-list p{display:flex;gap:12px;align-items:flex-start;margin:0}
.footer-contact-list i{color:#fff;min-width:16px;margin-top:4px}
.footer-coverage p{margin:0 0 10px}
.footer-bottom.footer-bottom-centered{
  position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:18px;
  justify-content:center;text-align:center;color:#D6E2EF;font-size:.94rem;
}

/* === 404 page redesign === */
.not-found-page{background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%)}
.not-found-hero{padding-top:70px;padding-bottom:70px}
.not-found-layout{
  display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center;
  background:#fff;border:1px solid var(--n3-line);border-radius:34px;padding:44px;
  box-shadow:var(--shadow-soft);margin-bottom:30px;
}
.not-found-code{
  font-family:'Jost',system-ui,sans-serif;font-size:clamp(5rem,14vw,9rem);font-weight:900;line-height:.9;
  color:var(--n3-blue-2);letter-spacing:-.08em;margin-bottom:12px;
}
.not-found-copy h1{font-size:clamp(2.2rem,4vw,4.3rem);margin-bottom:16px;color:var(--n3-graphite)}
.not-found-lead{font-size:1.18rem;max-width:560px;color:var(--n3-graphite-2)}
.not-found-tip{
  display:flex;gap:18px;align-items:flex-start;background:#F8FBFF;border:1px solid var(--n3-line);
  border-radius:22px;padding:22px;margin-top:28px;max-width:560px;
}
.not-found-tip strong{display:block;font-family:'Jost',system-ui,sans-serif;font-size:1.28rem;margin-bottom:8px}
.not-found-tip p{margin:0;color:var(--n3-graphite-2)}
.not-found-tip-icon{
  width:64px;height:64px;min-width:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--n3-blue-2);color:#fff;font-size:1.5rem;
}
.not-found-visual img{
  width:100%;border-radius:28px;background:#fff;box-shadow:0 16px 40px rgba(23,33,47,.10);
}
.not-found-actions-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:#fff;border:1px solid var(--n3-line);
  border-radius:28px;overflow:hidden;box-shadow:var(--shadow-soft);
}
.not-found-action-card{padding:34px 30px;text-align:center;border-right:1px solid var(--n3-line)}
.not-found-action-card:last-child{border-right:0}
.not-found-action-icon{
  width:70px;height:70px;border-radius:50%;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
  background:#EAF5FF;color:var(--n3-blue-2);font-size:1.8rem;
}
.not-found-action-icon.whatsapp{background:#DDF7E6;color:#25D366}
.not-found-action-card h3{margin-bottom:12px}
.not-found-action-card p{margin-bottom:18px}
.btn-light-border{border:1px solid var(--n3-blue-2);color:var(--n3-blue-2);background:#fff}
.btn-light-border:hover{background:var(--n3-sky)}
.btn-whatsapp{background:#25D366;color:#fff;box-shadow:0 14px 30px rgba(37,211,102,.22)}
.btn-whatsapp:hover{background:#1FA857;transform:translateY(-2px)}

@media(max-width:980px){
  .footer-main{grid-template-columns:1fr 1fr;gap:28px 18px}
  .footer-col:not(:first-child), .footer-brand-col + .footer-col{padding-left:22px}
  .not-found-layout{grid-template-columns:1fr;padding:30px}
  .not-found-actions-grid{grid-template-columns:1fr}
  .not-found-action-card{border-right:0;border-bottom:1px solid var(--n3-line)}
  .not-found-action-card:last-child{border-bottom:0}
}
@media(max-width:720px){
  .footer-main{grid-template-columns:1fr}
  .footer-col,.footer-brand-col{padding-right:0}
  .footer-col:not(:first-child), .footer-brand-col + .footer-col{border-left:0;border-top:1px solid rgba(255,255,255,.14);padding-left:0;padding-top:22px}
  .footer-brand-nodo{font-size:2.45rem}
  .footer-brand-num{font-size:2.7rem}
  .not-found-hero{padding-top:38px;padding-bottom:46px}
  .not-found-layout{padding:24px;border-radius:24px;gap:24px}
  .not-found-code{font-size:4.9rem}
  .not-found-tip{flex-direction:column;align-items:flex-start;padding:18px;border-radius:18px}
  .not-found-tip-icon{width:56px;height:56px;min-width:56px}
  .not-found-actions-grid{border-radius:22px}
  .not-found-action-card{padding:26px 20px}
}


/* === FIX V42 - HEADER FIJO DEFINITIVO === */
/* Sticky fallaba por capas/overflow de algunas secciones. Lo dejamos fixed real. */
body{
  padding-top:116px !important;
}

.topbar{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  z-index:20000 !important;
}

.nav{
  position:fixed !important;
  top:38px !important;
  left:0 !important;
  right:0 !important;
  z-index:19999 !important;
  width:100% !important;
  background:rgba(255,255,255,.97) !important;
  box-shadow:0 12px 28px rgba(23,33,47,.10) !important;
  transform:none !important;
}

.nav-inner{
  position:relative !important;
  z-index:20001 !important;
}

.nav-links{
  z-index:20005 !important;
}

.logo,
.logo img{
  z-index:20006 !important;
}

/* En mobile no hay topbar, entonces el menú queda arriba del todo */
@media(max-width:980px){
  body{
    padding-top:76px !important;
  }

  .topbar{
    display:none !important;
  }

  .nav{
    top:0 !important;
    z-index:20000 !important;
  }

  .nav-links{
    z-index:20010 !important;
  }
}

/* Si el header cambia a scrolled, mantiene fixed y no desaparece */
.nav.scrolled{
  position:fixed !important;
  top:38px !important;
  left:0 !important;
  right:0 !important;
  transform:none !important;
}

@media(max-width:980px){
  .nav.scrolled{
    top:0 !important;
  }
}


/* === FIX V43 - TOPBAR SOLO ARRIBA, MENÚ FIJO SOLO AL HACER SCROLL === */
body{
  padding-top:0 !important;
}

/* La barra oscura vuelve a ser parte del encabezado inicial */
.topbar{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  z-index:40 !important;
}

/* Estado inicial: menú normal, debajo de la barra oscura */
.nav{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:60 !important;
  background:rgba(255,255,255,.94) !important;
  backdrop-filter:blur(14px);
  box-shadow:none !important;
  transform:none !important;
}

/* Cuando se hace scroll: desaparece la barra oscura y queda solo el menú */
body.nav-fixed{
  padding-top:76px !important;
}
body.nav-fixed .nav,
.nav.scrolled{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:20000 !important;
  background:rgba(255,255,255,.98) !important;
  box-shadow:0 12px 28px rgba(23,33,47,.10) !important;
  transform:none !important;
}
body.nav-fixed .nav-inner,
.nav.scrolled .nav-inner{
  min-height:66px !important;
}

/* El logo conserva el efecto de superposición arriba y se integra al menú al scrollear */
.nav .logo{
  min-width:235px !important;
  width:235px !important;
  align-self:stretch !important;
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
.nav .logo img{
  position:absolute !important;
  left:0 !important;
  top:-18px !important;
  width:205px !important;
  max-width:205px !important;
  height:auto !important;
  background:#ffffff !important;
  padding:12px 14px !important;
  border:1px solid rgba(221,231,240,.95) !important;
  border-radius:22px !important;
  box-shadow:0 16px 34px rgba(23,33,47,.17) !important;
  z-index:20006 !important;
}
body.nav-fixed .nav .logo,
.nav.scrolled .logo{
  width:170px !important;
  min-width:170px !important;
}
body.nav-fixed .nav .logo img,
.nav.scrolled .logo img{
  top:50% !important;
  transform:translateY(-50%) !important;
  width:132px !important;
  max-width:132px !important;
  padding:6px 8px !important;
  border-radius:14px !important;
  box-shadow:0 6px 18px rgba(23,33,47,.10) !important;
}

/* Mobile */
@media(max-width:980px){
  body.nav-fixed{
    padding-top:72px !important;
  }
  .topbar{
    display:none !important;
  }
  .nav,
  body.nav-fixed .nav,
  .nav.scrolled{
    position:fixed !important;
    top:0 !important;
    z-index:20000 !important;
  }
  .nav-inner,
  body.nav-fixed .nav-inner,
  .nav.scrolled .nav-inner{
    min-height:72px !important;
  }
  .nav .logo,
  .nav.scrolled .logo,
  body.nav-fixed .nav .logo{
    width:auto !important;
    min-width:auto !important;
  }
  .nav .logo img,
  .nav.scrolled .logo img,
  body.nav-fixed .nav .logo img{
    position:static !important;
    transform:none !important;
    width:138px !important;
    max-width:138px !important;
    padding:7px 9px !important;
    border-radius:14px !important;
  }
}


/* === FOOTER BRAND REFINADO V44 === */
.footer-brand{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:0 !important;
  margin-bottom:18px !important;
  text-decoration:none !important;
  line-height:1 !important;
}
.footer-brandmark{
  display:inline-flex !important;
  align-items:flex-end !important;
  gap:6px !important;
  font-family:'Jost',system-ui,sans-serif !important;
  font-weight:900 !important;
  letter-spacing:-.07em !important;
  line-height:.82 !important;
}
.footer-brand-nodo{
  font-size:3.12rem !important;
  color:#ffffff !important;
}
.footer-brand-num{
  font-size:3.82rem !important;
  color:#2C8EF4 !important;
  line-height:.76 !important;
  margin-left:1px !important;
  transform:translateY(.02em) !important;
}
.footer-brand-sub{
  display:block !important;
  width:11.9rem !important;
  max-width:11.9rem !important;
  margin-top:2px !important;
  padding-left:2px !important;
  color:#F2F7FC !important;
  font-size:.43rem !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  line-height:1.08 !important;
  white-space:nowrap !important;
}
@media (max-width: 640px){
  .footer-brand-nodo{font-size:2.52rem !important;}
  .footer-brand-num{font-size:3.08rem !important;}
  .footer-brand-sub{
    width:9.65rem !important;
    max-width:9.65rem !important;
    font-size:.36rem !important;
    letter-spacing:.16em !important;
  }
}


/* === FOOTER BRAND IMAGE V45 === */
.footer-brand-image-link{display:inline-block !important; text-decoration:none !important; background:transparent !important; padding:0 !important; margin:0 0 18px 0 !important; border:0 !important; box-shadow:none !important;}
.footer-brand-image{display:block; width:300px; max-width:100%; height:auto; border-radius:0; box-shadow:none; background:transparent !important; padding:0 !important; margin:0 !important; border:0 !important;}
.footer-brand-col p{max-width:280px;}
@media (max-width:640px){.footer-brand-image{width:280px;}}
/* === FIX V46 - FOOTER PNG TRANSPARENTE SIN RECUADRO === */
.footer.footer-elevated .footer-brand-image-link{
  display:inline-block !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 0 18px 0 !important;
  border:0 !important;
  box-shadow:none !important;
}

.footer.footer-elevated .footer-brand-image,
.footer.footer-elevated .footer-brand-image-link img{
  display:block !important;
  width:300px !important;
  max-width:100% !important;
  height:auto !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

@media (max-width: 640px){
  .footer.footer-elevated .footer-brand-image,
  .footer.footer-elevated .footer-brand-image-link img{
    width:280px !important;
  }
}


/* === FIX V47 - FOOTER WORDMARK EXACTO DESDE PNG ORIGINAL === */
.footer.footer-elevated .footer-brand-image-link{
  display:inline-block !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 0 20px 0 !important;
  border:0 !important;
  box-shadow:none !important;
  line-height:0 !important;
}

.footer.footer-elevated .footer-brand-image,
.footer.footer-elevated .footer-brand-image-link img{
  display:block !important;
  width:235px !important;
  max-width:100% !important;
  height:auto !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
}

@media(max-width:640px){
  .footer.footer-elevated .footer-brand-image,
  .footer.footer-elevated .footer-brand-image-link img{
    width:220px !important;
  }
}


/* === FIX V48 - FOOTER WORDMARK NITIDO === */
.footer.footer-elevated .footer-brand-image-link{display:inline-block !important;background:transparent !important;padding:0 !important;margin:0 0 18px 0 !important;border:0 !important;box-shadow:none !important;line-height:0 !important;}
.footer.footer-elevated .footer-brand-image,.footer.footer-elevated .footer-brand-image-link img{display:block !important;width:250px !important;max-width:100% !important;height:auto !important;background:transparent !important;padding:0 !important;margin:0 !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;image-rendering:auto !important;}
@media(max-width:640px){.footer.footer-elevated .footer-brand-image,.footer.footer-elevated .footer-brand-image-link img{width:235px !important;}}


/* === FIX V49 - FOOTER WORDMARK VECTORIAL / NÍTIDO === */
/* Se reemplaza el PNG problemático por texto HTML/CSS: no se pixela ni arrastra fondos. */
.footer.footer-elevated .footer-brand-vector{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:0 !important;
  text-decoration:none !important;
  margin:0 0 20px 0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  line-height:1 !important;
}

.footer-wordmark{
  display:inline-flex !important;
  align-items:flex-end !important;
  gap:6px !important;
  line-height:.78 !important;
  white-space:nowrap !important;
}

.footer-word-nodo,
.footer-word-three{
  font-family:'Orbitron','Eurostile','Arial Black',system-ui,sans-serif !important;
  font-weight:900 !important;
  letter-spacing:-.055em !important;
  text-transform:uppercase !important;
  text-shadow:0 1px 0 rgba(255,255,255,.04);
}

.footer-word-nodo{
  color:#F7FAFD !important;
  font-size:3.15rem !important;
}

.footer-word-three{
  color:#0D86F2 !important;
  font-size:4.02rem !important;
  line-height:.74 !important;
  margin-left:2px !important;
}

.footer-word-sub{
  display:block !important;
  font-family:'Inter',system-ui,sans-serif !important;
  color:#F7FAFD !important;
  font-size:.56rem !important;
  font-weight:800 !important;
  letter-spacing:.075em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  margin-top:3px !important;
  margin-left:2px !important;
  width:14.2rem !important; /* alineada visualmente con el ancho de NODO3 */
  max-width:14.2rem !important;
  white-space:nowrap !important;
}

.footer.footer-elevated .footer-brand-image,
.footer.footer-elevated .footer-brand-image-link{
  display:none !important;
}

@media(max-width:640px){
  .footer-word-nodo{
    font-size:2.8rem !important;
  }
  .footer-word-three{
    font-size:3.55rem !important;
  }
  .footer-word-sub{
    font-size:.49rem !important;
    width:12.6rem !important;
    max-width:12.6rem !important;
  }
}

/* === MOBILE + ACCESIBILIDAD + RENDIMIENTO V54 === */
img{max-width:100%;height:auto}
.menu-btn{min-width:44px;min-height:44px;touch-action:manipulation}
a,button{touch-action:manipulation}
@media(max-width:700px){
  html{scroll-padding-top:78px}
  body{overflow-x:hidden}
  .container{width:min(100% - 32px, 1180px)}
  .section{padding-top:58px;padding-bottom:58px}
  .hero{padding-top:42px;padding-bottom:52px}
  .hero-grid{gap:28px}
  .hero h1{font-size:clamp(2rem,11vw,3.15rem);line-height:1.02}
  .hero .lead{font-size:1.04rem;line-height:1.58}
  .hero-sublead{font-size:.97rem;line-height:1.55}
  .hero-card{min-width:0}
  .hero-image-slide img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
  .works-carousel-section{padding-top:56px!important;padding-bottom:76px!important}
  .works-carousel{min-height:0!important;padding-bottom:62px}
  .works-slide,.works-slide.active{position:relative!important;inset:auto!important}
  .works-slide:not(.active){display:none!important}
  .works-copy h2{font-size:clamp(1.75rem,8.6vw,2.35rem)!important}
  .works-showcase{padding:10px!important;border-radius:20px!important}
  .works-main-image img{height:auto!important;aspect-ratio:16/9;object-fit:cover}
  .works-thumbs img{height:auto!important;aspect-ratio:16/9;object-fit:cover}
  .works-meta{grid-template-columns:1fr!important}
  .work-chip{padding:12px 14px}
  .works-controls{position:absolute;left:0;right:0;bottom:0}
  .works-nav{bottom:0!important}
  .footer-main{gap:34px}
  .footer-wordmark{max-width:100%}
  .footer-word-sub{white-space:normal!important;line-height:1.25!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Hero rotativo usa H2 para mantener un único H1 semántico */
.hero-copy-slide h2{font-size:inherit;line-height:inherit;margin:0 0 22px;font-family:inherit;font-weight:inherit;letter-spacing:inherit;color:inherit}
@media(max-width:700px){.hero-copy-slide h2{font-size:clamp(2rem,11vw,3.15rem);line-height:1.02}}

/* Formulario de contacto PHP */
.form-honeypot{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
}
.form-status{
  display:none;
  margin-bottom:14px;
  padding:13px 15px;
  border-radius:12px;
  font-size:.96rem;
  line-height:1.45;
  border:1px solid transparent;
}
.form-status.is-visible{display:block}
.form-status.is-success{
  color:#155724;
  background:#dff3e4;
  border-color:#aed8b8;
}
.form-status.is-error{
  color:#842029;
  background:#f8d7da;
  border-color:#f1aeb5;
}
.form-status.is-loading{
  color:#084298;
  background:#dbeafe;
  border-color:#9ec5fe;
}
.form button[disabled]{opacity:.72;cursor:not-allowed}
.field input:invalid:not(:placeholder-shown),
.field textarea:invalid:not(:placeholder-shown){border-color:#c94a55}

/* === FIX V55 - HEADER MOBILE SIN SUPERPOSICIÓN === */
@media (max-width:980px){
  :root{
    --n3-mobile-header-height: 92px;
  }

  /* El menú es fijo en mobile: reservamos siempre su altura desde el inicio. */
  body,
  body.nav-fixed{
    padding-top:var(--n3-mobile-header-height) !important;
  }

  .nav,
  body.nav-fixed .nav,
  .nav.scrolled{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    height:var(--n3-mobile-header-height) !important;
    min-height:var(--n3-mobile-header-height) !important;
    background:rgba(255,255,255,.98) !important;
    box-shadow:0 8px 24px rgba(23,33,47,.12) !important;
  }

  .nav-inner,
  body.nav-fixed .nav-inner,
  .nav.scrolled .nav-inner{
    min-height:var(--n3-mobile-header-height) !important;
    height:var(--n3-mobile-header-height) !important;
    padding-top:8px !important;
    padding-bottom:8px !important;
    align-items:center !important;
  }

  .nav .logo,
  .nav.scrolled .logo,
  body.nav-fixed .nav .logo{
    height:auto !important;
    align-self:center !important;
    display:flex !important;
    align-items:center !important;
  }

  .nav .logo img,
  .nav.scrolled .logo img,
  body.nav-fixed .nav .logo img{
    position:static !important;
    transform:none !important;
    width:112px !important;
    max-width:112px !important;
    height:auto !important;
    padding:4px 6px !important;
    border-radius:12px !important;
    box-shadow:0 6px 16px rgba(23,33,47,.12) !important;
  }

  .menu-btn{
    width:46px !important;
    height:46px !important;
    flex:0 0 46px !important;
  }

  /* Los anclajes no quedan escondidos detrás del menú fijo. */
  html{
    scroll-padding-top:calc(var(--n3-mobile-header-height) + 12px) !important;
  }
}

@media (max-width:420px){
  :root{
    --n3-mobile-header-height: 86px;
  }

  .nav .logo img,
  .nav.scrolled .logo img,
  body.nav-fixed .nav .logo img{
    width:104px !important;
    max-width:104px !important;
  }
}