@import url('https://fonts.googleapis.com/css2?family=Lato:wght@600&family=Roboto:wght@400;500&family=Montserrat:wght@600;700&family=Poppins:wght@400;500;600&family=Raleway:wght@500&family=Rubik:wght@400&display=swap');

:root{
  --blue: #00427B;
  --blue-dark: #003058;
  --ink: #3F3F3F;
  --ink-soft: #6b6b6b;
  --bg: #ffffff;
  --bg-alt: #F0F0F0;
  --bg-stats: #EFEFEF;
  --border: #e5e9ec;
  --radius: 10px;
  --max: 1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  font-size:16px;
}
h1,h2,h3{margin:0 0 .5em; color:var(--ink); line-height:1.25}
p{margin:0 0 1em; text-align:justify}
a{color:var(--blue); text-decoration:none}
a:hover{color:var(--blue-dark)}
img{max-width:100%; display:block}
.container{max-width:var(--max); margin:0 auto; padding:0 24px}

.skip-link{position:absolute; left:-999px; top:auto}
.skip-link:focus{left:16px; top:16px; background:#fff; padding:8px 14px; border-radius:6px; z-index:999}

/* ---------- Top bar ---------- */
.top-bar{background:var(--blue); color:#fff; font-size:.85rem}
.top-bar-inner{display:flex; align-items:center; gap:28px; height:42px; flex-wrap:wrap}
.top-bar-item{display:flex; align-items:center; gap:8px; color:#fff; font-weight:500}
.top-bar-item:hover{color:#dce8f3}
.top-bar-item img{width:16px; height:16px; object-fit:contain; filter:brightness(0) invert(1)}
.top-bar-schedule{color:#cfe0ef; margin-left:auto}

/* ---------- Header ---------- */
.site-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--border)}
.header-inner{display:flex; align-items:center; gap:24px; height:80px}
.brand{margin-right:auto}
.main-nav{display:flex; gap:28px}
.main-nav a{color:var(--ink); font-weight:500; font-family:'Roboto', sans-serif; font-size:.95rem; padding:6px 2px; border-bottom:2px solid transparent}
.main-nav a:hover{color:var(--blue); border-color:var(--blue)}
.header-cta{background:var(--blue); color:#fff; font-family:'Montserrat', sans-serif; font-weight:600; font-size:.95rem; padding:12px 22px; border-radius:8px; white-space:nowrap}
.header-cta:hover{background:var(--blue-dark); color:#fff}
.menu-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; background:none; border:none; cursor:pointer}
.menu-toggle span{display:block; height:2px; width:100%; background:var(--ink)}

/* ---------- Hero ---------- */
.hero{
  padding:120px 0;
  background:url('img/hero-banner.png');
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
}
.hero-inner{max-width:560px}
.hero h1{font-family:'Lato', sans-serif; font-weight:600; color:#323232; font-size:clamp(2.4rem, 5vw, 3.75rem)}
.hero .btn{margin-top:10px}

.btn{display:inline-block; font-family:'Roboto', sans-serif; padding:13px 30px; border-radius:11px; font-weight:500; font-size:1.15rem; border:2px solid transparent; cursor:pointer; transition:all .15s ease}
.btn-primary{background:var(--blue); color:#fff}
.btn-primary:hover{background:var(--blue-dark); color:#fff}
.btn.full{width:100%; text-align:center; display:block}

/* ---------- Sections ---------- */
.section{padding:80px 0}
.section.alt{background:var(--bg-alt)}
.section-kicker{color:var(--blue); text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; font-weight:700; margin-bottom:8px}
h2.center{text-align:center; max-width:640px; margin:0 auto .3em; font-family:'Montserrat', sans-serif; font-weight:700; color:#3F3F3F}
.divider{width:56px; height:3px; background:var(--blue); margin:0 0 22px; border-radius:2px}
.divider.center{margin:0 auto 36px}

.split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center}
.split-media img{border-radius:var(--radius); box-shadow:0 16px 40px rgba(0,66,123,.12)}
.split-content h2{font-family:'Montserrat', sans-serif; font-weight:700; font-size:2rem}

/* ---------- Misión / Visión / Objetivos ---------- */
.cards-3{display:grid; grid-template-columns:repeat(3, 1fr); gap:28px}
.mvo-card{
  background:#fff; border-radius:var(--radius); padding:36px 30px; text-align:center;
  box-shadow:0 8px 24px rgba(0,66,123,.06); transition:background .2s ease;
}
.mvo-card h3{font-family:'Montserrat', sans-serif; font-weight:700; color:var(--blue); transition:color .2s ease}
.mvo-card p{color:var(--ink); font-size:.94rem; margin-bottom:0; text-align:center; transition:color .2s ease}
.mvo-card:hover{background:var(--blue)}
.mvo-card:hover h3, .mvo-card:hover p{color:#fff}

/* ---------- Stats ---------- */
.stats{background:url('img/back-counter.png'); background-size:cover; background-position:center; color:#fff; padding:56px 0}
.stats-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:24px; text-align:center}
.stat-number{font-family:'Montserrat', sans-serif; font-size:2.6rem; font-weight:700; font-variant-numeric:tabular-nums}
.stat-plus{font-family:'Montserrat', sans-serif; font-size:2.6rem; font-weight:700}
.stat-label{display:block; font-family:'Raleway', sans-serif; font-weight:500; font-size:1rem; color:#f0f0f0; margin-top:4px}

/* ---------- Testimonios ---------- */
.testimonials{display:flex; justify-content:center}
.testimonial{background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:32px; box-shadow:0 8px 24px rgba(0,66,123,.06); max-width:560px; text-align:center}
.testimonial img{width:64px; height:64px; border-radius:50%; margin:0 auto 16px}
.testimonial p{color:var(--ink); font-size:.98rem; text-align:center}
.testimonial h3{font-family:'Poppins', sans-serif; font-weight:500; font-size:1.1rem; color:#494949; margin-bottom:0}

/* ---------- Contacto ---------- */
.contact-inner{display:grid; grid-template-columns:1fr 1.3fr; gap:0; align-items:stretch; margin-top:12px; border-radius:var(--radius); overflow:hidden; box-shadow:0 16px 40px rgba(0,66,123,.1)}
.contact-card{background:var(--blue); color:#fff; padding:40px 32px}
.contact-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:24px}
.contact-list li{display:flex; flex-direction:column; gap:4px}
.contact-label{font-family:'Poppins', sans-serif; font-style:italic; font-weight:700; font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; color:#cfe0ef}
.contact-list a, .contact-list span{color:#fff; font-family:'Poppins', sans-serif; font-weight:500; font-size:1.05rem}
.contact-list a:hover{color:#dce8f3}
.contact-note{font-family:'Poppins', sans-serif; font-weight:400 !important; font-size:.82rem !important; color:#cfe0ef !important}

.contact-form{background:#fff; padding:40px 32px; display:flex; flex-direction:column; gap:16px}
.field{display:flex; flex-direction:column; gap:4px}
.contact-form input, .contact-form textarea{
  font:inherit; font-size:1rem; padding:16px; border-radius:var(--radius);
  border:2px solid var(--ink); background:transparent; resize:vertical;
}
.contact-form input{height:60px}
.contact-form textarea{min-height:110px}
.contact-form input:focus, .contact-form textarea:focus{outline:none; border-color:var(--blue); background:#fff}
.contact-form input::placeholder, .contact-form textarea::placeholder{color:var(--ink-soft)}
.field-error{display:none; color:#dc3232; font-size:.85rem; text-align:center}
.field.is-invalid input{border-color:#dc3232}
.field.is-invalid .field-error{display:block}
.honeypot{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.btn-enviar{background:var(--blue); color:#fff; border-radius:var(--radius); padding:16px 28px; font-family:'Poppins', sans-serif; font-weight:600; font-size:1.15rem; border:none}
.btn-enviar:hover{background:var(--blue-dark)}
.form-summary{display:none; min-height:0; font-size:.9rem; border-radius:4px; padding:.6em 1em; margin:0}
.form-summary.pending{display:block; border:2px solid #00a0d2; color:#00627a; background:#eaf7fb}
.form-summary.error{display:block; border:2px solid #ffb900; color:#8a6d00; background:#fffbea}
.form-summary.ok{display:block; border:2px solid #46b450; color:#1b7a3d; background:#f2fbf3}

/* ---------- Páginas legales ---------- */
.legal-page{max-width:720px; margin:0 auto; padding:64px 24px}

/* ---------- Footer ---------- */
.site-footer{background:#fff; color:var(--blue); padding:40px 0; text-align:center; border-top:2px solid var(--blue)}
.footer-brand{margin-bottom:22px; display:flex; justify-content:center}
.footer-links{list-style:none; padding:0; margin:0 0 20px; display:flex; flex-wrap:wrap; justify-content:center; gap:8px 22px; font-family:'Roboto', sans-serif; font-size:.85rem}
.footer-links a{color:var(--blue)}
.footer-links a:hover{color:var(--blue-dark)}
.btn-outline-footer{display:inline-block; margin:4px 0 30px; border:2px solid var(--blue); color:var(--blue); text-transform:uppercase; font-family:'Roboto', sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.03em; padding:11px 26px; border-radius:8px}
.btn-outline-footer:hover{background:var(--blue); color:#fff}
.footer-icon-list{list-style:none; padding:0; margin:0 0 16px; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 32px; font-family:'Roboto', sans-serif; font-size:.85rem}
.footer-icon-list li{display:flex; align-items:center; gap:8px}
.footer-icon-list a, .footer-icon-list span{color:var(--blue)}
.footer-icon-list li:hover a, .footer-icon-list li:hover span{color:var(--blue-dark)}
.footer-icon-list svg{width:15px; height:15px; fill:var(--blue); flex-shrink:0}
.footer-cuit{font-family:'Rubik', sans-serif; font-size:.85rem; color:#757171; margin:0}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .split{grid-template-columns:1fr}
  .split-media{order:-1}
  .cards-3{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr); row-gap:32px}
  .contact-inner{grid-template-columns:1fr}
  .top-bar-schedule{display:none}
}

@media (max-width: 760px){
  .main-nav{
    position:fixed; top:80px; left:0; right:0; background:#fff; border-bottom:1px solid var(--border);
    flex-direction:column; padding:16px 24px; gap:4px; transform:translateY(-140%); transition:transform .2s ease;
  }
  .main-nav.open{transform:translateY(0)}
  .main-nav a{padding:12px 0; border-bottom:1px solid var(--border)}
  .header-cta{display:none}
  .menu-toggle{display:flex}
  .section{padding:56px 0}
  .hero{padding:70px 0}
  .top-bar-inner{justify-content:center; text-align:center}
}