
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
:root{
  --maxw:1180px;
  --accent:#003366;
  --accent-light:#e6f0ff;
  --bg:#f5f7fb;
  --text:#1c1c1c;
  --muted:#666;
  --card:#fff;
  --radius:12px;
  --shadow:0 4px 14px rgba(0,0,0,0.08);
  --title: #e8e7e6;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'Roboto',system-ui,Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
.container{max-width:var(--maxw);margin:0 auto;padding:1rem}
.header{background:#003366;box-shadow:var(--shadow);position:sticky;top:0;z-index:1000}
.header .container{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.brand{display:flex;align-items:center;gap:.6rem}
.brand img{height:56px;width:auto}
.brand strong{font-size:1.05rem;color:var(--accent)}
.brand .title-text{color:var(--title)}
.menu-toggle{display:none;border:none;background:transparent;font-size:1.4rem;color:var(--accent);cursor:pointer}
nav ul{list-style:none;display:flex;gap:1rem;align-items:center}
nav li{position:relative;}
nav a{display:block;padding:.5rem .75rem;border-radius:6px;font-weight:500;color:var(--title)}
nav a:hover{background:var(--accent-light);color:var(--accent)}
nav li ul{position:absolute;top:100%;left:0;background:#fff;box-shadow:var(--shadow);border-radius:8px;display:none;flex-direction:column;min-width:220px;padding:.3rem 0;z-index:999}
nav li:hover>ul{display:flex}
nav li ul li a{padding:.6rem 1rem;font-weight:400;color:var(--text);white-space:nowrap}
/* Hero */
.hero{background:linear-gradient(180deg,#003366,var(--accent-light));border-radius:12px;margin:1.2rem 0;padding:1.6rem;display:grid;grid-template-columns:1fr 300px;gap:1rem;align-items:center;box-shadow:var(--shadow)}
.hero .slides{font-size:1.15rem;font-weight:500;min-height:120px;display:flex;align-items:center;justify-content:center;text-align:center}
.hero .aside{background:var(--card);padding:1rem;border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,0.04);font-size:.95rem;color:var(--muted)}
/* Grid */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:1rem}
.card{background:var(--card);padding:1rem;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,0.04);min-height:120px;transition:transform .18s,box-shadow .18s}
.card:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(0,0,0,0.06)}
/* Gallery */
.gallery{margin-top:1.5rem}
.gallery-wrapper{position:relative;overflow:hidden;border-radius:12px;box-shadow:var(--shadow);background:var(--card)}
.gallery-track{display:flex;transition:transform .6s ease}
.gallery-track img{width:100%;flex-shrink:0;height:420px;object-fit:cover;display:block}
.gallery-btn{position:absolute;top:50%;transform:translateY(-50%);border:none;background:rgba(0,0,0,0.45);color:#fff;font-size:1.8rem;cursor:pointer;padding:.3rem .6rem;border-radius:50%;z-index:2}
.gallery-btn:hover{background:rgba(0,0,0,0.7)}
.gallery-btn.prev{left:12px}.gallery-btn.next{right:12px}
.gallery-dots{display:flex;justify-content:center;gap:.6rem;padding:.8rem 0}
.dot{width:10px;height:10px;border-radius:50%;background:#d6dff0;cursor:pointer;transition:transform .18s,background .18s}.dot.active{background:var(--accent);transform:scale(1.25)}

/* Footer */
.footer{margin-top:1.8rem;background:#fff;border-top:1px solid #eaeaea;padding:1rem 0;box-shadow:var(--shadow)}
.footer-grid{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap}
.small{color:var(--muted);font-size:.9rem}

/* Header centered (internal pages) */
.header-centered{background:linear-gradient(180deg,var(--accent),#00509d);padding:1.2rem 0 1.6rem;text-align:center;color:#fff}
.header-center{display:flex;flex-direction:column;align-items:center;gap:.6rem}
.header-logo{height:72px}

/* Contact form */
.form-contacto{display:flex;flex-direction:column;gap:1rem;padding:1rem;border-radius:10px;background:var(--card);box-shadow:0 2px 8px rgba(0,0,0,0.04)}
.form-contacto label{display:flex;flex-direction:column;font-size:.95rem;color:var(--text)}
.form-contacto input,.form-contacto textarea{padding:.6rem;border:1px solid #dcdcdc;border-radius:8px;font-size:1rem}
.form-contacto button{background:var(--accent);color:#fff;border:none;padding:.75rem;border-radius:8px;font-weight:700;cursor:pointer}
.form-contacto .msg-success{display:none;padding:.6rem;border-radius:8px;background:#e6f7ee;color:#0a6b2a;border:1px solid #bde6c6}

/* Responsive */
@media(max-width:880px){
  .hero{grid-template-columns:1fr;padding:1rem}
  .menu-toggle{display:block}
  nav{display:none;width:100%}
  nav.open{display:block;margin-top:.6rem}
  nav ul{flex-direction:column;gap:.4rem}
  nav li ul{position:static;box-shadow:none;background:var(--accent-light);border-radius:6px}
  .gallery-track img{height:260px}
}
