/* =========================================================
   FAES — Preparación para admisión UAQ
   Hoja de estilos principal del sitio público
   ========================================================= */

:root{
  --faes-navy: #0A2647;
  --faes-navy-2: #0F3460;
  --faes-blue: #1B6FC9;
  --faes-blue-light: #EAF2FC;
  --faes-gold: #F2A93C;
  --faes-gold-dark: #D98C1F;
  --faes-ink: #142433;
  --faes-gray: #5B6B7B;
  --faes-bg: #F7F9FC;
  --faes-white: #FFFFFF;
  --faes-success: #1F9D6C;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --shadow-soft: 0 10px 30px rgba(10,38,71,.08);
  --shadow-mid: 0 16px 40px rgba(10,38,71,.14);
  --ff-display: 'Poppins', 'Inter', sans-serif;
  --ff-body: 'Inter', sans-serif;
}

*{ box-sizing: border-box; }

html{ scroll-behavior: smooth; }

body{
  font-family: var(--ff-body);
  color: var(--faes-ink);
  background: var(--faes-bg);
  overflow-x: hidden;
}

h1,h2,h3,h4,h5,.display-font{
  font-family: var(--ff-display);
  font-weight: 700;
  color: var(--faes-navy);
  letter-spacing: -0.02em;
}

a{ text-decoration: none; }

.text-gold{ color: var(--faes-gold-dark) !important; }
.text-blue{ color: var(--faes-blue) !important; }
.bg-navy{ background: var(--faes-navy) !important; }
.bg-blue-light{ background: var(--faes-blue-light) !important; }

.section-pad{ padding: 5.5rem 0; }
@media (max-width: 767px){ .section-pad{ padding: 3.5rem 0; } }

.section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--faes-blue);
  background:var(--faes-blue-light);
  padding:.4rem .9rem;
  border-radius:50px;
  margin-bottom:1rem;
}
.section-eyebrow.on-dark{
  color:var(--faes-gold);
  background:rgba(242,169,60,.14);
}

.lead-muted{ color: var(--faes-gray); font-size:1.08rem; }

/* ---------- Navbar ---------- */
.faes-navbar{
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(180%) blur(10px);
  box-shadow: 0 1px 0 rgba(10,38,71,.06);
  padding: .65rem 0;
  transition: box-shadow .25s ease;
}
.faes-navbar.scrolled{ box-shadow: var(--shadow-soft); }

.faes-logo{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-family: var(--ff-display);
  font-weight:800;
  font-size:1.35rem;
  color: var(--faes-navy);
}
.faes-logo .mark{
  width:42px; height:42px;
  border-radius:12px;
  background: linear-gradient(145deg, var(--faes-navy), var(--faes-blue));
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:1.05rem;
  box-shadow: var(--shadow-soft);
}
.faes-logo small{
  display:block;
  font-family: var(--ff-body);
  font-weight:600;
  font-size:.62rem;
  letter-spacing:.14em;
  color: var(--faes-gray);
  text-transform:uppercase;
}

.faes-nav .nav-link{
  font-weight:600;
  color: var(--faes-navy);
  padding: .55rem 1rem !important;
  font-size:.95rem;
}
.faes-nav .nav-link:hover{ color: var(--faes-blue); }

.btn-alumnos{
  background: var(--faes-navy);
  color:#fff;
  font-weight:700;
  padding:.6rem 1.4rem;
  border-radius: 50px;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  box-shadow: 0 8px 20px rgba(10,38,71,.25);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn-alumnos:hover{
  background: var(--faes-blue);
  color:#fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(27,111,201,.35);
}

.btn-gold{
  background: linear-gradient(135deg, var(--faes-gold), var(--faes-gold-dark));
  color: var(--faes-navy);
  font-weight:700;
  border:none;
  padding:.85rem 1.8rem;
  border-radius:50px;
  box-shadow: 0 10px 24px rgba(242,169,60,.35);
  transition: transform .18s ease, box-shadow .18s ease;
}
.btn-gold:hover{ transform: translateY(-2px); box-shadow: 0 14px 30px rgba(242,169,60,.45); color: var(--faes-navy); }

.btn-outline-navy{
  border:2px solid var(--faes-navy);
  color: var(--faes-navy);
  font-weight:700;
  padding:.8rem 1.8rem;
  border-radius:50px;
  background:transparent;
  transition: all .18s ease;
}
.btn-outline-navy:hover{ background: var(--faes-navy); color:#fff; }

.btn-outline-light-custom{
  border:2px solid rgba(255,255,255,.55);
  color:#fff;
  font-weight:700;
  padding:.8rem 1.8rem;
  border-radius:50px;
  background:transparent;
  transition: all .18s ease;
}
.btn-outline-light-custom:hover{ background: rgba(255,255,255,.12); border-color:#fff; color:#fff; }

/* ---------- Hero ---------- */
.hero{
  position:relative;
  background: radial-gradient(1200px 600px at 85% -10%, rgba(242,169,60,.20), transparent 60%),
              linear-gradient(160deg, var(--faes-navy) 0%, var(--faes-navy-2) 55%, #123A6B 100%);
  color:#fff;
  padding: 7.5rem 0 6rem;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity:.35;
  pointer-events:none;
}
.hero .badge-pill{
  display:inline-flex; align-items:center; gap:.5rem;
  background: rgba(242,169,60,.15);
  border:1px solid rgba(242,169,60,.35);
  color: var(--faes-gold);
  font-weight:700; font-size:.8rem;
  padding:.45rem 1rem; border-radius:50px;
  margin-bottom:1.4rem;
}
.hero h1{ color:#fff; font-size:3rem; line-height:1.12; }
.hero h1 span{ color: var(--faes-gold); }
@media (max-width: 767px){ .hero h1{ font-size:2.1rem; } .hero{ padding:6rem 0 4rem; } }
.hero p.lead{ color: rgba(255,255,255,.82); font-size:1.15rem; max-width:560px; }

.hero-stats{
  display:flex; flex-wrap:wrap; gap:1.8rem;
  margin-top:2.6rem;
}
.hero-stats .stat h3{ color:#fff; font-size:1.9rem; margin-bottom:0; }
.hero-stats .stat span{ color: rgba(255,255,255,.65); font-size:.82rem; }

.hero-card{
  position:relative;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--radius-lg);
  padding: 1.9rem;
  backdrop-filter: blur(6px);
}
.hero-card .mini-row{
  display:flex; align-items:center; gap:.9rem;
  background: rgba(255,255,255,.07);
  border-radius: var(--radius-md);
  padding: .9rem 1rem;
  margin-bottom: .8rem;
}
.hero-card .mini-row .ic{
  width:42px; height:42px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--faes-gold), var(--faes-gold-dark));
  color: var(--faes-navy); font-size:1.1rem; flex-shrink:0;
}
.hero-card .mini-row .txt strong{ color:#fff; display:block; font-size:.92rem; }
.hero-card .mini-row .txt span{ color: rgba(255,255,255,.6); font-size:.78rem; }

.floaty{ animation: floaty 5s ease-in-out infinite; }
@keyframes floaty{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-10px);} }

/* ---------- Cards / Features ---------- */
.faes-card{
  background:#fff;
  border-radius: var(--radius-lg);
  padding: 2rem 1.7rem;
  height:100%;
  box-shadow: var(--shadow-soft);
  border: 1px solid rgba(10,38,71,.05);
  transition: transform .22s ease, box-shadow .22s ease;
}
.faes-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-mid); }
.faes-card .icon-wrap{
  width:56px; height:56px; border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background: var(--faes-blue-light);
  color: var(--faes-blue);
  font-size:1.4rem;
  margin-bottom:1.1rem;
}
.faes-card.dark{
  background: var(--faes-navy);
  color: #fff;
}
.faes-card.dark h5, .faes-card.dark p{ color:#fff; }
.faes-card.dark .icon-wrap{ background: rgba(242,169,60,.18); color: var(--faes-gold); }

.program-card{
  background:#fff;
  border-radius: var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-soft);
  height:100%;
  border:1px solid rgba(10,38,71,.05);
  transition: transform .22s ease, box-shadow .22s ease;
}
.program-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-mid); }
.program-card .top{
  padding: 1.6rem 1.6rem 1.2rem;
  background: linear-gradient(135deg, var(--faes-blue-light), #fff);
}
.program-card .tag{
  display:inline-block;
  font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  color: var(--faes-blue);
  background:#fff;
  padding:.3rem .7rem; border-radius:50px;
  margin-bottom:.8rem;
}
.program-card .body{ padding: 1.4rem 1.6rem 1.8rem; }
.program-card ul{ list-style:none; padding:0; margin:0 0 1.4rem; }
.program-card ul li{ display:flex; gap:.6rem; align-items:flex-start; margin-bottom:.55rem; font-size:.92rem; color:var(--faes-gray); }
.program-card ul li i{ color: var(--faes-success); margin-top:.2rem; }

/* ---------- Carreras grid ---------- */
.carrera-chip{
  background:#fff;
  border:1px solid rgba(10,38,71,.08);
  border-radius: var(--radius-md);
  padding: 1.1rem 1.2rem;
  height:100%;
  transition: all .2s ease;
}
.carrera-chip:hover{ border-color: var(--faes-blue); box-shadow: var(--shadow-soft); transform: translateY(-3px); }
.carrera-chip .fac{ font-weight:800; font-size:.82rem; color: var(--faes-navy); margin-bottom:.35rem; display:flex; align-items:center; gap:.5rem;}
.carrera-chip .fac i{ color: var(--faes-gold-dark); }
.carrera-chip p{ font-size:.8rem; color: var(--faes-gray); margin:0; line-height:1.5; }

/* ---------- Steps ---------- */
.step-item{ position:relative; padding-left: 4.2rem; margin-bottom: 2.1rem; }
.step-item .num{
  position:absolute; left:0; top:0;
  width:52px; height:52px; border-radius:14px;
  background: var(--faes-navy);
  color: var(--faes-gold);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--ff-display); font-weight:800; font-size:1.2rem;
}
.step-item h5{ margin-bottom:.35rem; }
.step-item p{ color: var(--faes-gray); margin:0; font-size:.93rem; }

/* ---------- Testimonials ---------- */
.testi-card{
  background:#fff;
  border-radius: var(--radius-lg);
  padding: 1.8rem;
  box-shadow: var(--shadow-soft);
  height:100%;
}
.testi-card .stars{ color: var(--faes-gold); font-size:.85rem; margin-bottom:.8rem; }
.testi-card p.quote{ color: var(--faes-ink); font-size:.95rem; font-style:italic; }
.testi-card .who{ display:flex; align-items:center; gap:.7rem; margin-top:1.1rem; }
.testi-card .avatar{
  width:42px; height:42px; border-radius:50%;
  background: linear-gradient(135deg, var(--faes-blue), var(--faes-navy));
  color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700;
}
.testi-card .who strong{ display:block; font-size:.88rem; color: var(--faes-navy); }
.testi-card .who span{ font-size:.76rem; color: var(--faes-gray); }

/* ---------- CTA band ---------- */
.cta-band{
  background: linear-gradient(120deg, var(--faes-navy), #123A6B);
  border-radius: var(--radius-lg);
  padding: 3rem;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.cta-band::before{
  content:"";
  position:absolute; right:-60px; top:-60px;
  width:220px; height:220px; border-radius:50%;
  background: radial-gradient(circle, rgba(242,169,60,.35), transparent 70%);
}
@media (max-width: 767px){ .cta-band{ padding: 2.1rem 1.4rem; text-align:center; } }

/* ---------- Contact ---------- */
.contact-card{
  background:#fff;
  border-radius: var(--radius-lg);
  padding: 2.2rem;
  box-shadow: var(--shadow-soft);
}
.form-control, .form-select{
  border-radius: var(--radius-sm);
  padding: .75rem 1rem;
  border: 1.5px solid rgba(10,38,71,.12);
  font-size:.94rem;
}
.form-control:focus, .form-select:focus{
  border-color: var(--faes-blue);
  box-shadow: 0 0 0 4px rgba(27,111,201,.12);
}
.info-row{ display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.4rem; }
.info-row .ic{
  width:46px; height:46px; border-radius:12px; flex-shrink:0;
  background: var(--faes-blue-light); color:var(--faes-blue);
  display:flex; align-items:center; justify-content:center;
}
.info-row strong{ display:block; color:var(--faes-navy); font-size:.9rem; }
.info-row span{ font-size:.84rem; color:var(--faes-gray); }

/* ---------- Footer ---------- */
.faes-footer{ background: #071B33; color: rgba(255,255,255,.72); padding: 3.5rem 0 1.5rem; }
.faes-footer h6{ color:#fff; font-weight:700; font-size:.9rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:1.1rem; }
.faes-footer a{ color: rgba(255,255,255,.65); font-size:.9rem; display:block; margin-bottom:.6rem; transition: color .15s ease; }
.faes-footer a:hover{ color: var(--faes-gold); }
.faes-footer .social a{
  display:inline-flex; width:38px; height:38px; border-radius:50%;
  background: rgba(255,255,255,.08);
  align-items:center; justify-content:center; margin-right:.5rem;
}
.faes-footer .social a:hover{ background: var(--faes-gold); color: var(--faes-navy); }
.faes-footer hr{ border-color: rgba(255,255,255,.1); margin: 2rem 0 1.2rem; }
.faes-footer .bottom-line{ font-size:.8rem; color: rgba(255,255,255,.5); }

/* ---------- WhatsApp float ---------- */
.wa-float{
  position:fixed; right:22px; bottom:22px; z-index:1050;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.6rem;
  box-shadow: 0 10px 26px rgba(37,211,102,.45);
  transition: transform .2s ease;
}
.wa-float:hover{ transform: scale(1.08); color:#fff; }

/* ---------- Scroll reveal ---------- */
.reveal{ opacity:0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform: translateY(0); }

/* ---------- Utilities ---------- */
.badge-security{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.75rem; font-weight:700; color: var(--faes-success);
  background: rgba(31,157,108,.1);
  padding:.35rem .8rem; border-radius:50px;
}