/* ===== INMATEX · estilos compartidos ===== */
:root{
  --azul-marino:#0d2136; --azul-marino-2:#12304f; --azul:#1c6fc4; --azul-claro:#3d8fe0;
  --marca:#f5b301; --tinta:#1a2530; --tinta-suave:#5a6b78;
  --linea:#e4e9ee; --fondo:#f5f8fb; --panel:#ffffff;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Open Sans',system-ui,sans-serif;color:var(--tinta);line-height:1.65;background:var(--panel)}
h1,h2,h3{font-family:'Montserrat',system-ui,sans-serif}
img{max-width:100%;display:block}
a{color:inherit}

.franja{height:6px;background:repeating-linear-gradient(45deg,var(--marca),var(--marca) 16px,var(--azul-marino) 16px,var(--azul-marino) 32px)}

/* ---- Encabezado ---- */
header{background:var(--panel);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:30}
.barra{max-width:1140px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:16px}
.barra .logo{height:48px;width:auto}
.barra .espacio{flex:1}
.nav{display:flex;gap:26px;align-items:center}
.nav a{text-decoration:none;color:var(--tinta);font-weight:600;font-size:15px}
.nav a:hover{color:var(--azul)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:9px;cursor:pointer;
  text-decoration:none;font-family:'Montserrat',sans-serif;font-weight:700;font-size:15px;padding:12px 22px;transition:.15s;white-space:nowrap}
.btn-marca{background:var(--marca);color:#1a1400}
.btn-marca:hover{background:#ffc42e;transform:translateY(-1px)}
.btn-linea{background:transparent;color:#fff;border:1.5px solid #ffffff66}
.btn-linea:hover{border-color:#fff;background:#ffffff14}
.btn-azul{background:var(--azul);color:#fff}
.btn-azul:hover{background:#1a63b0}
.btn-claro{background:var(--panel);color:var(--tinta);border:1px solid var(--linea)}
.btn-claro:hover{border-color:var(--marca)}

/* ---- Secciones ---- */
section{scroll-margin-top:76px}
.env{max-width:1140px;margin:0 auto;padding:66px 22px}
.tit-sec{text-align:center;margin-bottom:14px}
.tit-sec .sub{color:var(--azul);font-weight:700;font-size:13px;letter-spacing:2.5px;text-transform:uppercase}
.tit-sec h2{font-size:clamp(24px,3.4vw,34px);font-weight:800;margin-top:6px;color:var(--azul-marino)}
.tit-sec p{color:var(--tinta-suave);max-width:62ch;margin:12px auto 0;font-size:16px}

/* ---- Pilares ---- */
.pilares{background:var(--azul-marino-2)}
.pilares-cont{max-width:1140px;margin:0 auto;padding:40px 22px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pilar{color:#fff;border-left:3px solid var(--marca);padding:6px 0 6px 16px}
.pilar b{display:block;font-family:'Montserrat',sans-serif;font-size:16px;letter-spacing:.5px;margin-bottom:4px}
.pilar span{color:#c0d0e0;font-size:13.5px;line-height:1.5}

/* ---- Galería ---- */
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}
.foto-card{border-radius:14px;overflow:hidden;background:var(--panel);border:1px solid var(--linea);
  box-shadow:0 6px 20px rgba(15,30,50,.06);transition:.18s}
.foto-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,30,50,.12)}
.foto-card .foto{aspect-ratio:4/3;overflow:hidden}
.foto-card .foto img{width:100%;height:100%;object-fit:cover;transition:.3s}
.foto-card:hover .foto img{transform:scale(1.05)}
.foto-card .txt{padding:16px 18px}
.foto-card .txt b{font-family:'Montserrat',sans-serif;font-size:17px;color:var(--azul-marino);display:block;margin-bottom:4px}
.foto-card .txt span{color:var(--tinta-suave);font-size:14px}

/* ---- Pie ---- */
footer{background:#0a1826;color:#b8c6d4;font-size:14px}
.pie{max-width:1140px;margin:0 auto;padding:44px 22px 30px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.pie .logo-pie{height:52px;margin-bottom:14px}
.pie h4{color:#fff;font-family:'Montserrat',sans-serif;font-size:14px;letter-spacing:1px;text-transform:uppercase;margin-bottom:14px}
.pie a{color:#b8c6d4;text-decoration:none}
.pie a:hover{color:var(--marca)}
.pie ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.copy{border-top:1px solid #ffffff16;text-align:center;padding:16px;color:#7f909f;font-size:13px}

/* ---- Apertura al desplazarse ---- */
.rev{opacity:0;transform:translateY(30px) rotateX(-10deg) scale(.97);transform-origin:top center;
  transition:opacity .55s ease, transform .6s cubic-bezier(.22,.7,.28,1);transition-delay:var(--d,0s);will-change:opacity,transform}
.rev.abierto{opacity:1;transform:none}
.abanico{perspective:900px}
@media (prefers-reduced-motion: reduce){ .rev{opacity:1 !important;transform:none !important;transition:none} }
@media print{ .rev{opacity:1 !important;transform:none !important} }
/* Si el navegador no ejecuta JavaScript, todo se muestra igual */
html.sin-js .rev{opacity:1;transform:none}

@media(max-width:900px){
  .nav{display:none}
  .pilares-cont{grid-template-columns:1fr 1fr;gap:22px 18px}
  .galeria{grid-template-columns:1fr 1fr}
  .pie{grid-template-columns:1fr;gap:26px}
}
@media(max-width:560px){
  .galeria{grid-template-columns:1fr}
  .pilares-cont{grid-template-columns:1fr}
  .barra .logo{height:40px}
  .barra{padding:10px 16px;gap:10px}
  .btn{padding:11px 16px;font-size:14px}
}
