:root{
  --blue:#0079FA;
  --blue-deep:#0050B8;
  --navy:#001B44;
  --grey-dark:#7B8087;
  --grey:#CACBCC;
  --grey-light:#EDEDED;
  --white:#FFFFFF;
  --font: 'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--navy);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,p{margin:0;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

/* ---------- header ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(0,27,68,.9);
  backdrop-filter:blur(10px);
}
header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:78px;
}
.logo{display:flex; align-items:center; gap:10px;}
.logo svg{width:30px; height:30px; flex-shrink:0;}
.logo-text{display:flex; flex-direction:column; line-height:1.05;}
.logo-text .n1{font-weight:900; font-size:1.02rem; color:var(--white); letter-spacing:.01em;}
.logo-text .n2{font-weight:600; font-size:.66rem; color:#9cc4ff; letter-spacing:.03em;}
nav ul{display:flex; gap:30px;}
nav a{color:rgba(255,255,255,.82); font-weight:700; font-size:.92rem; transition:color .2s;}
nav a:hover,nav a:focus{color:var(--white);}
.header-cta{
  background:var(--blue); color:var(--white); font-weight:800;
  font-size:.9rem; padding:11px 22px; border-radius:100px;
  transition:background .2s, transform .2s;
  white-space:nowrap;
}
.header-cta:hover{background:var(--white); color:var(--navy); transform:translateY(-1px);}
.header-cta:focus-visible{outline:2px solid var(--white); outline-offset:3px;}
.nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.nav-toggle span{display:block; width:22px; height:2px; background:var(--white); margin:5px 0;}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:86vh;
  display:flex; align-items:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 42%;
  z-index:0;
}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(0,27,68,.94) 0%, rgba(0,42,94,.88) 38%, rgba(0,121,250,.55) 100%);
  z-index:1;
}
.hero .wrap{position:relative; z-index:2; width:100%; padding-top:60px; padding-bottom:60px;}
.hero-content{max-width:640px;}
.hero-eyebrow{
  color:#9cc4ff; font-weight:700; font-size:.95rem; margin-bottom:22px;
  max-width:520px;
}
.hero h1{
  font-weight:900;
  font-size:clamp(2.6rem, 5.4vw, 4.6rem);
  line-height:1.05;
  letter-spacing:-0.01em;
  color:var(--white);
  max-width:820px;
}
.hero p.sub{
  margin-top:26px;
  font-size:1.18rem;
  color:rgba(255,255,255,.78);
  max-width:520px;
  line-height:1.6;
}
.hero-actions{margin-top:40px; display:flex; align-items:center; gap:22px; flex-wrap:wrap;}
.btn-primary{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--blue); color:var(--white);
  font-weight:800; font-size:1rem;
  padding:16px 30px; border-radius:100px;
  transition:background .2s, transform .2s;
}
.btn-primary:hover{background:var(--white); color:var(--navy); transform:translateY(-2px);}
.btn-primary:focus-visible{outline:2px solid var(--navy); outline-offset:3px;}
.hero-note{color:rgba(255,255,255,.55); font-size:.9rem;}

/* ---------- nosotros ---------- */
.nosotros{padding:120px 0 100px; background:var(--white);}
.nosotros-top{display:flex; align-items:center; justify-content:space-between; gap:64px;}
.section-head{max-width:560px; flex-shrink:0;}
.section-head h2{
  font-weight:900;
  font-size:clamp(1.9rem, 3.1vw, 2.65rem);
  line-height:1.14;
  letter-spacing:-.01em;
}
.section-head p{
  margin-top:20px; font-size:1.06rem; color:var(--grey-dark); line-height:1.7;
  max-width:600px;
}
.nosotros-photo{
  flex:1; max-width:420px; width:100%;
  aspect-ratio:4/3; border-radius:20px; overflow:hidden;
}
.nosotros-photo img{width:100%; height:100%; object-fit:cover; object-position:center 78%; display:block;}
.flow{
  margin-top:70px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0;
  position:relative;
}
.flow-line{
  position:absolute; top:15px; left:16px; right:calc(33.333% - 16px);
  height:2px; background:var(--grey);
  z-index:0;
}
.flow-step{position:relative; z-index:1; padding-right:28px;}
.flow-dot{
  width:32px; height:32px; border-radius:50%;
  background:var(--white); border:2px solid var(--blue);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; color:var(--blue); font-size:.85rem;
  margin-bottom:22px;
}
.flow-step h3{font-weight:800; font-size:1.15rem; margin-bottom:10px;}
.flow-step p{color:var(--grey-dark); font-size:.98rem; line-height:1.6;}

/* ---------- servicios ---------- */
.servicios{background:var(--grey-light); padding:120px 0;}
.servicios .section-head p{color:var(--grey-dark);}
.services-grid{
  margin-top:70px;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:28px;
}
.service-card{
  background:var(--white); border-radius:20px; overflow:hidden;
  box-shadow:0 14px 34px rgba(0,27,68,.07);
  display:flex; flex-direction:column;
}
.service-media{width:100%; aspect-ratio:16/10; overflow:hidden;}
.service-media img{width:100%; height:100%; object-fit:cover; display:block;}
.service-body{padding:30px 30px 34px;}
.service-num{
  display:inline-block; font-weight:800; font-size:.82rem; color:var(--blue-deep);
  background:var(--grey-light); padding:5px 14px; border-radius:100px; margin-bottom:16px;
}
.service-card h3{font-weight:800; font-size:1.22rem; margin-bottom:10px; color:var(--navy);}
.service-card p{color:var(--grey-dark); font-size:.98rem; line-height:1.65;}
.service-feature{
  grid-column:1 / -1;
  background:var(--white); border-radius:20px; overflow:hidden;
  box-shadow:0 14px 34px rgba(0,27,68,.07);
  display:grid; grid-template-columns:1fr 1fr; align-items:stretch;
}
.service-feature .service-media{aspect-ratio:auto; height:100%;}
.service-feature .service-body{display:flex; flex-direction:column; justify-content:center; align-items:flex-start;}

/* ---------- compromiso ambiente ---------- */
.ambiente{
  background:linear-gradient(120deg, var(--navy) 0%, var(--blue-deep) 100%);
  padding:100px 0;
  position:relative;
  overflow:hidden;
}
.ambiente .wrap{position:relative; z-index:2;}
.ambiente-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.ambiente h2{
  font-weight:900; color:var(--white);
  font-size:clamp(1.8rem, 2.8vw, 2.3rem);
  line-height:1.18; letter-spacing:-.01em;
}
.ambiente p{
  color:rgba(255,255,255,.82); font-size:1.05rem; line-height:1.7; margin-top:20px;
  max-width:480px;
}
.ambiente-photo{
  border-radius:20px;
  overflow:hidden;
  aspect-ratio:4/3;
  border:1px solid rgba(255,255,255,.18);
}
.ambiente-photo img{width:100%; height:100%; object-fit:cover;}

/* ---------- contacto ---------- */
.contacto{background:var(--white); padding:120px 0 100px;}
.contacto-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:70px;}
.contacto h2{
  font-weight:900; font-size:clamp(1.9rem, 3.1vw, 2.65rem); line-height:1.15;
  letter-spacing:-.01em; max-width:460px;
}
.contacto-lead{color:var(--grey-dark); font-size:1.05rem; margin-top:20px; max-width:440px; line-height:1.7;}
.contact-list{margin-top:36px; display:flex; flex-direction:column; gap:16px;}
.contact-list li{display:flex; align-items:center; gap:14px; font-weight:700; font-size:1rem;}
.contact-list .ic{
  width:38px; height:38px; border-radius:50%; background:var(--grey-light);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.contact-list .ic svg{width:17px; height:17px; stroke:var(--blue-deep);}
.form-card{
  background:var(--grey-light); border-radius:20px; padding:40px;
}
.form-card h3{font-weight:800; font-size:1.1rem; margin-bottom:24px;}

/* ---------- footer ---------- */
footer{background:var(--navy); padding:70px 0 30px;}
.footer-top{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:50px;
  padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,.12);
}
.footer-top .logo .n1{color:var(--white);}
.footer-desc{color:rgba(255,255,255,.6); font-size:.92rem; margin-top:18px; line-height:1.6; max-width:280px;}
.footer-col h4{color:rgba(255,255,255,.5); font-size:.78rem; font-weight:800; letter-spacing:.04em; margin-bottom:18px;}
.footer-col ul{display:flex; flex-direction:column; gap:12px;}
.footer-col a{color:rgba(255,255,255,.75); font-size:.94rem; transition:color .2s;}
.footer-col a:hover{color:var(--white);}
.footer-bottom{
  padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  color:rgba(255,255,255,.45); font-size:.84rem;
}

/* ---------- animaciones al aparecer ---------- */
.reveal{
  opacity:0; transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.2,.6,.2,1), transform .7s cubic-bezier(.2,.6,.2,1);
}
.reveal.is-visible{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
}

/* ---------- responsive ---------- */
@media (max-width:860px){
  nav, .header-cta{display:none;}
  .nav-toggle{display:block;}
  .wrap{padding:0 20px;}
  .nosotros-top{flex-direction:column; align-items:flex-start; gap:36px;}
  .nosotros-photo{max-width:100%;}
  .flow{grid-template-columns:1fr; gap:40px;}
  .flow-line{display:none;}
  .flow-step{padding-right:0;}
  .ambiente-grid{grid-template-columns:1fr; text-align:left;}
  .services-grid{grid-template-columns:1fr; gap:22px;}
  .service-body{padding:24px 20px 28px;}
  .service-feature{display:flex; flex-direction:column;}
  .service-feature .service-media{aspect-ratio:16/10; height:auto;}
  .service-feature .service-body{align-items:flex-start; justify-content:flex-start;}
  .contacto-grid{grid-template-columns:1fr; gap:50px;}
  .form-card{padding:28px 24px;}
  .footer-top{grid-template-columns:1fr; gap:36px;}
}