/* Base */
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  background:#0f172a;
  color:#e5e7eb;
}
main{
  max-width:1000px;
  margin:2rem auto;
  padding:1rem;
  text-align:justify;
}
footer{
  text-align:center;
  padding:1rem;
  color:#94a3b8;
  font-size:.9rem;
  margin-top:2rem;
  border-top:1px solid #1f2937;
}

/* Cabecera / navegación */
header{background:#1e293b;padding:1rem;text-align:center}
header h1{margin:.2rem 0 .8rem;font-size:1.8rem}
nav a{
  color:#e5e7eb;
  text-decoration:none;
  margin:0 1rem;
  font-weight:500;
  padding:.25rem .4rem;
  border-radius:.4rem;
}
nav a:hover{color:#60a5fa;background:#0b1220}
nav a.active{background:#0b1220;color:#93c5fd;border:1px solid #334155}

/* HERO en portada */
.hero{
  position:relative;
  display:grid;
  place-items:center;
  min-height:38vh;
  padding:4rem 1rem;
  text-align:center;
  background:
    linear-gradient(to bottom, rgba(15,23,42,.6), rgba(15,23,42,.9)),
    url('https://images.unsplash.com/photo-1519681393784-d120267933ba?q=80&w=1600&auto=format&fit=crop') center/cover no-repeat;
  border-bottom:1px solid #1f2937;
}
.hero h2{font-size:2.2rem;margin:0 0 .6rem}
.hero p{max-width:800px;margin:0 auto;opacity:.95}

/* Formularios (Contacto) */
input, textarea, button{font:inherit}
input, textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid #334155;
  background:#0b1220;
  color:#e5e7eb;
  border-radius:8px;
  padding:.6rem .7rem;
}
textarea{resize:vertical}
button{
  margin-top:.5rem;
  padding:.6rem 1rem;
  border:1px solid #3b82f6;
  background:#1d4ed8;
  color:white;
  border-radius:8px;
  cursor:pointer;
}
button:hover{background:#2563eb}

/* Galería */
.gallery{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:16px;
  margin-top:1rem;
}
.gallery figure{
  margin:0;
  background:#0b1220;
  border:1px solid #1f2937;
  border-radius:12px;
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease;
}
.gallery img{display:block;width:100%;height:180px;object-fit:cover}
.gallery figcaption{padding:.6rem .8rem;color:#cbd5e1;font-size:.95rem}
.gallery figure:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.25)}

/* --- LIGHTBOX --- */
.lightbox{
  position:fixed; inset:0; display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.85); z-index:9999; padding:2rem;
}
.lightbox.open{ display:flex; }
.lightbox figure{ margin:0; max-width:min(95vw,1400px); max-height:90vh; display:grid; gap:.75rem; justify-items:center }
.lightbox img{
  max-width:100%; max-height:80vh; object-fit:contain; border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.lb-caption{ color:#cbd5e1; font-size:.95rem; text-align:center }
.lb-btn{
  position:absolute; top:50%; transform:translateY(-50%);
  border:1px solid #334155; background:#0b1220; color:#e5e7eb;
  padding:.6rem .8rem; border-radius:999px; cursor:pointer; user-select:none;
}
.lb-prev{ left:1rem; }
.lb-next{ right:1rem; }
.lb-close{
  position:absolute; top:1rem; right:1rem; border:1px solid #334155; background:#0b1220;
  color:#e5e7eb; border-radius:10px; padding:.4rem .6rem; cursor:pointer
}
.lb-btn:hover, .lb-close:hover{ background:#1e293b }
/* Bloque destacado tipo “nota” */
.nota {
  background-color: #0d9488;   /* turquesa suave */
  color: white;
  padding: 1em;
  border-radius: 10px;
  margin: 1em 0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

.nota h2 {
  margin-top: 0;
  font-size: 1.4em;
}