:root {
  --background-color: #ffffff;
  --default-color: #3f3f46;
  --heading-color: #5f1025;
  --accent-color: #a61f3c;
  --surface-color: #ffffff;
  --contrast-color: #ffffff;
  --wine-dark: #4a0d1d;
  --wine: #7b1730;
  --gold: #c59a55;
  --cream: #f7f2eb;
}

.light-background { --background-color: #f8f5f2; }
.dark-background { --background-color: #5f1025; --default-color: #fff; --heading-color: #fff; }

body { font-family: "Open Sans", sans-serif; }
h1, h2, h3, h4, h5, h6, .navmenu, .brand-copy { font-family: "Poppins", sans-serif; }

.header { background: rgba(74, 13, 29, .96); }
.header .logo { gap: 10px; color: #fff; }
.header .brand-logo { width: 44px; height: 44px; object-fit: contain; background: #fff; border-radius: 50%; padding: 4px; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.brand-name { color: #fff; font-size: 1rem; font-weight: 700; }
.brand-copy small { color: #e5c99d; font-size: .72rem; margin-top: 4px; }
.header .btn-getstarted { background: var(--gold); color: #32101a; font-weight: 700; }
.header .btn-getstarted:hover { background: #dbb878; color: #32101a; }

.hero { background: radial-gradient(circle at 85% 20%, #9e334f 0, #68152b 32%, #430b1a 100%); min-height: 680px; }
.hero h1 { max-width: 820px; }
.hero p { max-width: 720px; }
.hero-kicker, .eyebrow { color: #e5c99d; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hero-emblem { max-width: 400px; margin-inline: auto; padding: 2rem; background: rgba(255,255,255,.95); border-radius: 36% 64% 61% 39% / 42% 34% 66% 58%; box-shadow: 0 25px 80px rgba(0,0,0,.24); }
.hero-emblem img { animation: none !important; }
.btn-outline-light-custom { display: inline-flex; align-items: center; gap: 8px; border: 2px solid rgba(255,255,255,.75); color: #fff; padding: 11px 28px; border-radius: 50px; font-weight: 600; }
.btn-outline-light-custom:hover { background: #fff; color: var(--wine-dark); }

.stats-strip { padding: 28px 0; }
.stats-strip strong { display: block; color: var(--wine); font: 700 1.8rem "Poppins", sans-serif; }
.stats-strip span { display: block; color: #666; font-size: .86rem; }
.section-lead { font-size: 1.8rem; margin-bottom: 1.25rem; }
.feature-list { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.feature-list li { display: flex; gap: 10px; margin-bottom: 12px; }
.feature-list i { color: var(--accent-color); font-size: 1.15rem; }
.leadership-card { background: linear-gradient(135deg, #5f1025, #861f3a); color: #fff; border-radius: 20px; padding: 2rem; box-shadow: 0 20px 50px rgba(95,16,37,.2); }
.leadership-card h4 { color: #fff; }
.leadership-card hr { border-color: rgba(255,255,255,.22); }
.avatar-initials { display: grid; place-items: center; width: 68px; height: 68px; flex: 0 0 68px; border-radius: 50%; color: var(--wine-dark); background: #e5c99d; font: 700 1.25rem "Poppins", sans-serif; }

.path-card { position: relative; border-radius: 18px; padding: 2rem; box-shadow: 0 12px 35px rgba(50,20,30,.08); overflow: hidden; }
.path-card.legacy { background: #fff; border-top: 5px solid #7c7c86; }
.path-card.current { background: linear-gradient(145deg, #68152b, #9e334f); color: #fff; border-top: 5px solid var(--gold); }
.path-card.current h3 { color: #fff; }
.path-card .plan-status { display: inline-block; border-radius: 30px; padding: 6px 12px; margin-bottom: 1.4rem; background: rgba(123,23,48,.1); color: var(--wine); font-weight: 700; font-size: .76rem; text-transform: uppercase; }
.path-card.current .plan-status { background: rgba(255,255,255,.13); color: #f2d9ad; }
.path-icon { display: block; color: var(--accent-color); font-size: 2.5rem; margin-bottom: 1rem; }
.path-card.current .path-icon { color: var(--gold); }
.path-card a { font-weight: 700; }
.path-card.current a { color: #f2d9ad; }
.transition-arrow { color: var(--wine); display: flex; flex-direction: column; align-items: center; font-weight: 700; font-size: .75rem; text-transform: uppercase; }
.transition-arrow i { font-size: 2.4rem; }

.publication-card { height: 100%; padding: 2rem; background: #fff; border: 1px solid #eee5df; border-radius: 18px; transition: .25s ease; }
.publication-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(77,20,35,.12); }
.publication-icon { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 1.2rem; border-radius: 15px; background: #f5e6e9; color: var(--wine); font-size: 1.5rem; }
.content-tag { color: var(--accent-color); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.publication-card h3 { margin-top: .55rem; font-size: 1.25rem; }
.disabled-link { color: #7b7b83; cursor: default; font-weight: 600; }

.plantel-card { height: 100%; background: #fff; border: 1px solid #eadfe1; border-radius: 18px; padding: 1.4rem; transition: .25s ease; }
.plantel-card:hover { transform: translateY(-5px); border-color: #d9a9b4; box-shadow: 0 16px 35px rgba(70,15,29,.11); }
.plantel-logo-wrap { display: grid; place-items: center; height: 130px; background: #faf8f7; border-radius: 13px; margin-bottom: 1rem; overflow: hidden; }
.plantel-logo { width: 105px; height: 105px; object-fit: contain; }
.plantel-card h3 { font-size: 1.1rem; margin-bottom: .3rem; }
.plantel-location { min-height: 42px; color: #71717a; font-size: .86rem; }
.plantel-card .btn-site { display: inline-flex; align-items: center; gap: 7px; margin-top: .7rem; color: var(--wine); font-weight: 700; font-size: .88rem; }
.plantel-card .btn-site.disabled { color: #888; pointer-events: none; }
.source-note { color: #71717a; font-size: .82rem; }

.audience-card { height: 100%; display: flex; gap: 1.5rem; padding: 2rem; border-radius: 18px; color: #fff; }
.audience-card > i { font-size: 2.7rem; }
.audience-card h3 { color: #fff; margin-top: .35rem; }
.audience-card span { color: #f2d9ad; font-weight: 700; font-size: .78rem; text-transform: uppercase; }
.audience-card a { color: #fff; font-weight: 700; }
.student-card { background: linear-gradient(135deg, #6d142c, #a52d4a); }
.teacher-card { background: linear-gradient(135deg, #323741, #5e6571); }
.call-to-action { background: linear-gradient(rgba(65,10,25,.88), rgba(65,10,25,.88)), url("../img/bg/bg-8.webp") center/cover; }

.login-page { min-height: 100vh; background: #f7f3ef; }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: 1.08fr .92fr; }
.login-brand-panel { position: relative; display: flex; align-items: center; padding: clamp(2rem, 6vw, 6rem); color: #fff; background: radial-gradient(circle at 80% 15%, #a23b56, #65142a 45%, #3d0917); overflow: hidden; }
.login-brand-panel::after { content: "</>"; position: absolute; right: -1rem; bottom: -5rem; color: rgba(255,255,255,.045); font: 700 20rem "Poppins", sans-serif; }
.login-back { position: absolute; top: 2rem; left: 2rem; color: #fff; z-index: 2; }
.login-brand-content { position: relative; z-index: 1; max-width: 620px; }
.login-logo { width: 130px; background: #fff; border-radius: 18px; padding: 10px; margin-bottom: 2rem; }
.login-brand-content > span { display: block; color: #e5c99d; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.login-brand-content h1 { color: #fff; font-size: clamp(2.2rem, 4vw, 4.4rem); margin: 1rem 0; }
.login-brand-content p { font-size: 1.1rem; max-width: 560px; }
.login-form-panel { display: grid; place-items: center; padding: 2rem; }
.login-box { width: min(100%, 470px); background: #fff; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 24px; box-shadow: 0 24px 70px rgba(55,20,30,.12); }
.login-box h2 { margin: .55rem 0 .75rem; }
.login-box .form-control, .login-box .input-group-text, .login-box .btn-outline-secondary { min-height: 48px; }
.btn-login { border: 0; border-radius: 50px; padding: 13px 24px; color: #fff; background: var(--wine); font-weight: 700; }
.btn-login:hover { background: var(--wine-dark); }
.login-help { display: flex; gap: 8px; margin: 1.5rem 0 0; color: #71717a; font-size: .82rem; }

@media (max-width: 1199px) {
  .navmenu a, .navmenu a:focus { color: var(--heading-color); }
  .brand-name { font-size: .92rem; }
}
@media (max-width: 991px) {
  .hero { min-height: auto; }
  .hero-emblem { max-width: 260px; padding: 1.4rem; }
  .login-shell { grid-template-columns: 1fr; }
  .login-brand-panel { min-height: 340px; padding-top: 6rem; }
  .login-brand-content h1 { font-size: 2.2rem; }
  .login-brand-content p { margin-bottom: 0; }
  .login-logo { width: 90px; margin-bottom: 1rem; }
}
@media (max-width: 575px) {
  .header .brand-logo { width: 38px; height: 38px; }
  .brand-copy small { display: none; }
  .hero h1 { font-size: 2rem; }
  .audience-card { flex-direction: column; }
  .login-brand-panel { min-height: 300px; }
  .login-back { top: 1.25rem; left: 1.25rem; }
  .login-form-panel { padding: 1rem; }
}