/* Reset & Base */
*{box-sizing:border-box;margin:0;padding:0}
html,body{
  height:100%;
  font-family:'Montserrat',Inter,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  background:linear-gradient(120deg,#08204b 0%,#0d47a1 50%,#1976d2 100%);
  color:#111; overflow-x:hidden; animation:blueBgMove 10s ease-in-out infinite;
}
@keyframes blueBgMove{
  0%{background:linear-gradient(120deg,#08204b 0%,#0d47a1 50%,#1976d2 100%)}
  20%{background:linear-gradient(120deg,#0d47a1 0%,#1976d2 50%,#08204b 100%)}
  40%{background:linear-gradient(120deg,#1976d2 0%,#08204b 50%,#0d47a1 100%)}
  60%{background:linear-gradient(120deg,#0d47a1 0%,#08204b 50%,#1976d2 100%)}
  80%{background:linear-gradient(120deg,#08204b 0%,#1976d2 50%,#0d47a1 100%)}
  100%{background:linear-gradient(120deg,#08204b 0%,#0d47a1 50%,#1976d2 100%)}
}
body.dark{
  background:linear-gradient(120deg,#181a20 0%,#08204b 60%,#23242a 100%);
  color:#eee; animation:blueBgMoveDark 18s ease-in-out infinite alternate;
}
@keyframes blueBgMoveDark{
  0%{background:linear-gradient(120deg,#181a20 0%,#08204b 60%,#23242a 100%)}
  50%{background:linear-gradient(120deg,#23242a 0%,#08204b 60%,#181a20 100%)}
  100%{background:linear-gradient(120deg,#181a20 0%,#08204b 60%,#23242a 100%)}
}

/* Navbar (copiado del contexto) */
.navbar{
  position:fixed;top:0;left:0;right:0;height:72px;display:flex;justify-content:space-between;align-items:center;
  padding:18px 40px;
  background:linear-gradient(90deg,#0d47a1 0%,#fff 40%,#d32f2f 100%);
  border-bottom:1px solid rgba(13,71,161,0.10);
  box-shadow:0 4px 18px rgba(13,71,161,0.08);
  transition:box-shadow .22s,background .22s; z-index:1500;
  animation:lavaNavbar 16s ease-in-out infinite alternate;
}
@keyframes lavaNavbar{
  0%{background:linear-gradient(90deg,#0d47a1 0%,#fff 40%,#d32f2f 100%)}
  10%{background:linear-gradient(90deg,#1565c0 0%,#e3eafc 40%,#e53935 100%)}
  20%{background:linear-gradient(90deg,#1976d2 0%,#f5f7fa 40%,#f44336 100%)}
  30%{background:linear-gradient(90deg,#2196f3 0%,#e3eafc 40%,#ff7043 100%)}
  40%{background:linear-gradient(90deg,#42a5f5 0%,#fff 40%,#ffb300 100%)}
  50%{background:linear-gradient(90deg,#64b5f6 0%,#e3eafc 40%,#ffd54f 100%)}
  60%{background:linear-gradient(90deg,#90caf9 0%,#f5f7fa 40%,#d32f2f 100%)}
  70%{background:linear-gradient(90deg,#1976d2 0%,#fff 40%,#0d47a1 100%)}
  80%{background:linear-gradient(90deg,#0d47a1 0%,#e3eafc 40%,#d32f2f 100%)}
  90%{background:linear-gradient(90deg,#1565c0 0%,#f5f7fa 40%,#e53935 100%)}
  100%{background:linear-gradient(90deg,#0d47a1 0%,#fff 40%,#d32f2f 100%)}
}
.navbar.scrolled{box-shadow:0 8px 32px rgba(13,71,161,0.18);background:linear-gradient(90deg,#d32f2f 0%,#fff 60%,#0d47a1 100%)}
.logo{font-weight:700;color:#0d47a1;font-size:22px;letter-spacing:1px}
.logo span{color:#d32f2f;font-weight:800;margin-left:6px}
.nav-links{display:flex;gap:22px}
.nav-links a{
  text-decoration:none;color:#263238;font-weight:600;padding:8px 12px;border-radius:8px;position:relative;transition:background .22s,color .22s;
}
.nav-links a::after{
  content:'';position:absolute;left:10%;right:10%;bottom:4px;height:3px;width:0;
  background:linear-gradient(90deg,#d32f2f,#0d47a1);border-radius:3px;transition:width .25s ease;
}
.nav-links a:hover::after,.nav-links a.active::after{width:80%}
.scroll-progress{
  position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(90deg,#d32f2f,#0d47a1);
  box-shadow:0 0 6px rgba(13,71,161,0.5);border-bottom-left-radius:2px;border-bottom-right-radius:2px;transition:width .15s linear;pointer-events:none;
}

/* Hamburguesa y menú lateral */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;z-index:1600}
.hamburger span{width:28px;height:4px;background:#0d47a1;border-radius:2px;transition:.3s}
.side-menu{position:fixed;top:0;right:-260px;width:260px;height:100vh;background:#fff;box-shadow:-2px 0 18px rgba(13,71,161,0.08);z-index:1550;display:flex;flex-direction:column;padding:40px 24px;transition:right .36s cubic-bezier(.2,.9,.3,1)}
.side-menu.open{right:0}
.side-menu a{margin-bottom:18px;font-weight:700;color:#0d47a1;text-decoration:none;font-size:18px}
.side-menu .close-btn{align-self:flex-end;font-size:22px;color:#d32f2f;cursor:pointer;margin-bottom:24px}
@media(max-width:700px){.nav-links{display:none}.hamburger{display:flex}}

/* Secciones */
main{max-width:1200px;margin:0 auto}
section{padding:92px 20px;scroll-margin-top:90px}
#contacto h2{color:#fff;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.35);margin-bottom:12px}
#contacto .lead{color:#eaf2ff;text-align:center;max-width:760px;margin:0 auto 24px;text-shadow:0 1px 6px rgba(0,0,0,.28)}

/* Layout contacto */
.contact-layout{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
.contact-left{display:flex;flex-direction:column;gap:18px}
.contact-cards{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:16px}
.card-ct{
  background:#fff;border-radius:14px;padding:18px;display:flex;gap:12px;align-items:flex-start;
  box-shadow:0 10px 30px rgba(10,20,40,0.06);transition:transform .24s,box-shadow .24s
}
.card-ct:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(10,20,40,0.16)}
.card-ct i{font-size:22px;color:#d32f2f;transition:transform .24s}
.card-ct:hover i{transform:scale(1.08) rotate(-6deg)}
.card-ct h3{margin:0 0 4px;color:#0d47a1;font-size:16px}
.card-ct p{margin:0;color:#334;font-size:14.5px;line-height:1.5}
.card-ct a{color:#0d47a1;text-decoration:none;font-weight:700}

/* Formulario (copiado estilo) */
.contact-box{max-width:700px;margin:0 auto;background:#fff;border-radius:14px;padding:26px;box-shadow:0 18px 40px rgba(10,20,40,0.06)}
.contact-box form{display:grid;gap:12px}
.input{position:relative}
input,textarea,select{width:100%;padding:14px;border:1px solid #e6ecf3;border-radius:10px;font-size:15px;transition:box-shadow .22s,border-color .22s}
input:focus,textarea:focus,select:focus{outline:none;border-color:#0d47a1;box-shadow:0 0 0 3px rgba(13,71,161,.12)}
textarea{min-height:140px;resize:vertical}
.submit-row{display:flex;justify-content:space-between;align-items:center;gap:12px}

/* Mapa */
.map-embed{max-width:1100px;margin:24px auto 0;border-radius:14px;overflow:hidden;background:#f5f7fa;box-shadow:0 10px 30px rgba(13,71,161,0.10)}
.map-embed iframe{width:100%;height:380px;border:0}

/* Botones */
.btn{background:linear-gradient(90deg,#d32f2f,#0d47a1);color:#fff;padding:12px 24px;border-radius:12px;border:none;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(13,71,161,0.12);transition:transform .22s,box-shadow .22s,background .22s;position:relative;overflow:hidden}
.btn::before{content:'';position:absolute;top:-20%;left:-120%;width:50%;height:140%;background:linear-gradient(120deg,rgba(255,255,255,.0) 0%,rgba(255,255,255,.35) 50%,rgba(255,255,255,.0) 100%);transform:skewX(-18deg);transition:transform .6s ease}
.btn:hover{transform:translateY(-4px) scale(1.04);box-shadow:0 16px 40px rgba(13,71,161,0.18);background:linear-gradient(90deg,#0d47a1,#d32f2f)}
.btn:hover::before{transform:translateX(280%) skewX(-18deg)}
.btn:active{transform:scale(.97)}

/* Footer */
footer{background:linear-gradient(90deg,#0d47a1,#d32f2f);color:#fff;padding:40px 20px;margin-top:40px}
.footer-grid{display:flex;gap:30px;max-width:1100px;margin:0 auto;flex-wrap:wrap}
.footer-col{flex:1;min-width:220px}
.footer-col h4{margin-bottom:12px}
.social-icons a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;background:rgba(255,255,255,0.06);margin-right:8px;color:#fff;text-decoration:none;transition:transform .22s,background .22s}
.social-icons a:hover{transform:translateY(-6px);background:rgba(255,255,255,0.12)}
.rights{text-align:center;margin-top:22px;color:rgba(255,255,255,0.9)}

/* Floating actions */
.whatsapp-float{position:fixed;bottom:24px;right:24px;background:#25D366;color:#fff;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;box-shadow:0 18px 36px rgba(37,211,102,0.18);z-index:1400;transition:transform .18s;animation:bob 4s ease-in-out infinite}
.whatsapp-float:hover{transform:scale(1.08)}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.to-top{
  position:fixed;right:24px;bottom:100px;background:#0d47a1;color:#fff;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;box-shadow:0 8px 20px rgba(13,71,161,0.12);cursor:pointer;z-index:1400;
  opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
}
.to-top.show{opacity:1;visibility:visible;transform:none}

/* AOS / Fallback */
[data-aos]{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.2,.9,.3,1),transform .9s cubic-bezier(.2,.9,.3,1)}
[data-aos].inview{opacity:1;transform:none}
[data-aos="zoom-in"]{transform:scale(.96);opacity:0}
[data-aos="zoom-in"].inview{transform:scale(1);opacity:1}

/* Dark Mode */
body.dark .navbar{background:linear-gradient(90deg,#23242a 80%,#d32f2f 120%);border-bottom:1px solid rgba(255,255,255,0.10);box-shadow:0 8px 32px rgba(211,47,47,0.18)}
body.dark .logo{color:#fff}
body.dark .logo span{color:#d32f2f}
body.dark .nav-links a{color:#eee}
body.dark .nav-links a.active{color:#d32f2f;background:rgba(211,47,47,0.18)}
body.dark .contact-box{background:#23242a;color:#eee}
body.dark .card-ct{background:#23242a;color:#eee;box-shadow:0 10px 30px rgba(0,0,0,0.25)}
body.dark .card-ct p{color:#e6e6e6}
body.dark .card-ct a{color:#90caf9}
body.dark .map-embed{background:#181a20;box-shadow:0 10px 30px rgba(0,0,0,0.35)}

@media(max-width:900px){
  .contact-layout{grid-template-columns:1fr}
  .contact-cards{grid-template-columns:1fr}
  .map-embed iframe{height:300px}
}
@media(max-width:600px){.map-embed iframe{height:240px}}