/* Colegio Nuevo Milenio - estilos */
:root {
  --primary: #0b2a60;
  --accent: #1f6feb;
  --light: #f5f7fb;
  --text: #1c2330;
}
* { box-sizing: border-box; }
body {
  margin: 0; font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji','Segoe UI Emoji'; color: var(--text); background:#fff;
}
.container { width: min(1100px, 92%); margin: 0 auto; }
.topbar { background: var(--primary); color:#fff; font-size: .9rem; }
.topbar-inner { display:flex; gap:1rem; align-items:center; justify-content:flex-end; padding:.4rem 0; }
.topbar a { color:#fff; text-decoration:none; opacity:.9; }
.header { position: sticky; top:0; background:#fff; border-bottom: 1px solid #e9eef7; z-index:9; }
.nav { display:flex; align-items:center; justify-content:space-between; padding:.7rem 0; }
.brand { display:flex; align-items:center; gap:.6rem; }
.brand img { width:44px; height:44px; border-radius:50%; }
.brand-text { font-weight:700; color:var(--primary); letter-spacing:.2px; }
nav a { margin-left:1rem; text-decoration:none; color:var(--text); font-weight:600; }
.btn { display:inline-block; padding:.75rem 1rem; border-radius:.8rem; border:2px solid transparent; text-decoration:none; font-weight:700; }
.btn-primary { background: var(--accent); color:#fff; }
.btn-light { background:#fff; color:var(--primary); border-color: var(--primary); }
.btn-outline { background:#fff; color:var(--accent); border-color: var(--accent); }
.nav-toggle { display:none; background:transparent; border:none; font-size:1.6rem; }

.hero { position:relative; min-height:70vh; background-size:cover; background-position:center; display:flex; align-items:center; }
.hero .overlay { position:absolute; inset:0; background: linear-gradient(180deg, rgba(11,42,96,.65), rgba(11,42,96,.45)); }
.hero-content { position:relative; color:#fff; }
.hero h1 { font-size: clamp(1.8rem, 4vw, 3rem); margin:0 0 .3rem; }
.hero p { font-size: clamp(1rem, 2vw, 1.3rem); opacity:.95; }
.hero-cta { margin-top:1rem; display:flex; gap:.7rem; flex-wrap:wrap; }
.badges { margin-top:1rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.badges span { background:#ffffff22; border:1px solid #ffffff55; padding:.35rem .6rem; border-radius:999px; font-weight:600; }

.section { padding: 64px 0; }
.section.alt { background: var(--light); }
h2 { color: var(--primary); font-size: clamp(1.5rem, 3vw, 2rem); margin: 0 0 1rem; }
.cards { display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; }
.card { background:#fff; border:1px solid #e8eef7; border-radius:1rem; padding:1rem; box-shadow: 0 8px 24px rgba(20,40,80,.06); }
.card h3{ margin-top:0; color:var(--primary);}

.ticks { columns: 2; gap:2rem; }
.ticks li { margin: .5rem 0; list-style: '✔ ' inside; }

.gallery { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:.7rem; }
.g-item img { width:100%; height:200px; object-fit:cover; border-radius:.8rem; border:1px solid #e5ebf6; transition: transform .2s; }
.g-item:hover img { transform: scale(1.02); }

.contact-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem; align-items:start; }
.form { background:#fff; border:1px solid #e8eef7; padding:1rem; border-radius:1rem; box-shadow: 0 8px 24px rgba(20,40,80,.06); }
.form label { display:block; font-weight:600; margin:.6rem 0 .2rem; }
.form input, .form select, .form textarea { width:100%; padding:.7rem .8rem; border-radius:.6rem; border:1px solid #cfd9ea; font: inherit; }
.form button { margin-top:.8rem; width:100%; }

.footer { background: var(--primary); color:#fff; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; padding:1rem 0; }
.footer a { color:#fff; text-decoration:none; opacity:.95; }

.wa-float { position: fixed; right: 18px; bottom: 18px; background: #25D366; color:#fff; width:56px; height:56px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:24px; box-shadow: 0 8px 16px rgba(0,0,0,.2); text-decoration:none; }

@media (max-width: 900px) {
  .cards { grid-template-columns: 1fr; }
  .ticks { columns: 1; }
  .contact-grid { grid-template-columns: 1fr; }
  nav { display:none; position:absolute; right:4%; top:64px; background:#fff; padding:1rem; border:1px solid #e8eef7; border-radius:.8rem; box-shadow: 0 12px 24px rgba(0,0,0,.08); }
  nav.open { display:block; }
  .nav-toggle { display:block; }
}