:root {
  --es-primary: #6366f1;
  --es-primary-dark: #4338ca;
  --es-accent: #22c55e;
  --es-dark: #0f172a;
  --es-muted: #64748b;
  --es-radius: 14px;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #f8fafc;
  color: #1e293b;
}

.navbar-brand {
  font-weight: 800;
  color: var(--es-primary) !important;
}

.hero {
  background: linear-gradient(135deg, #0f172a 0%, #312e81 100%);
  color: #fff;
  padding: 100px 0 120px;
}

.hero h1 { font-weight: 800; font-size: 2.75rem; }
.hero p.lead { color: #cbd5e1; }

.btn-es-primary {
  background: var(--es-primary);
  border-color: var(--es-primary);
  color: #fff;
  font-weight: 600;
}
.btn-es-primary:hover { background: var(--es-primary-dark); border-color: var(--es-primary-dark); color:#fff; }

.card-feature {
  border: none;
  border-radius: var(--es-radius);
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.06);
  transition: transform .15s ease;
  height: 100%;
}
.card-feature:hover { transform: translateY(-4px); }
.card-feature .icon-wrap {
  width: 52px; height: 52px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(99,102,241,.12); color: var(--es-primary); font-size: 1.4rem;
}

.stat-number { font-size: 2.2rem; font-weight: 800; color: var(--es-primary); }

.auth-card {
  max-width: 460px;
  margin: 60px auto;
  border: none;
  border-radius: var(--es-radius);
  box-shadow: 0 10px 40px rgba(15,23,42,0.08);
}

.dashboard-sidebar {
  background: var(--es-dark);
  min-height: 100vh;
  color: #cbd5e1;
}
.dashboard-sidebar a {
  color: #cbd5e1; text-decoration: none; display:flex; align-items:center; gap:.6rem;
  padding: .6rem 1rem; border-radius: 8px; margin: 2px 8px;
}
.dashboard-sidebar a:hover, .dashboard-sidebar a.active {
  background: rgba(99,102,241,.2); color: #fff;
}

.stat-card {
  border: none; border-radius: var(--es-radius);
  box-shadow: 0 4px 20px rgba(15,23,42,.06);
}

/* Mobile floating bottom nav */
.bottom-nav {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
  background: #fff; border-top: 1px solid #e2e8f0;
  display: flex; justify-content: space-around; padding: 8px 0;
  box-shadow: 0 -4px 20px rgba(15,23,42,.08);
}
.bottom-nav a {
  color: var(--es-muted); text-decoration: none; text-align: center; font-size: .72rem;
  display:flex; flex-direction:column; align-items:center; gap:2px; flex:1;
}
.bottom-nav a.active, .bottom-nav a:hover { color: var(--es-primary); }
.bottom-nav .fa-plus-circle { font-size: 1.9rem; color: var(--es-primary); }

.learn-fab-menu {
  position: fixed; bottom: 78px; left: 50%; transform: translateX(-50%);
  background: #fff; border-radius: 16px; box-shadow: 0 8px 30px rgba(15,23,42,.15);
  padding: 12px; display: none; grid-template-columns: repeat(4, 1fr); gap: 10px; z-index: 1031; width: 92%; max-width: 420px;
}
.learn-fab-menu.show { display: grid; }
.learn-fab-menu a { text-decoration:none; color:#1e293b; text-align:center; font-size:.7rem; }
.learn-fab-menu a i { display:block; font-size:1.3rem; margin-bottom:4px; color: var(--es-primary); }

@media (min-width: 992px) {
  .bottom-nav, .learn-fab-menu { display: none !important; }
}

/* Homepage hero image carousel */
.hero-carousel { position: relative; }
.hero-carousel-img { height: 560px; object-fit: cover; filter: brightness(0.55); }
.hero-carousel-overlay {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  display: flex; align-items: center; z-index: 2;
}
@media (max-width: 767px) {
  .hero-carousel-img { height: 420px; }
}

/* Homepage news list (moderate, compact styling) */
.news-list-item { transition: background .15s ease; }
.news-list-item:hover { background: rgba(99,102,241,.06); }

/* Homepage news section (redesigned - featured + compact list, editorial style) */
.news-eyebrow {
  display: inline-block; font-size: .7rem; font-weight: 800; letter-spacing: .08em;
  color: var(--es-primary); text-transform: uppercase; margin-bottom: 4px;
}
.news-featured-img-wrap { position: relative; border-radius: var(--es-radius); overflow: hidden; }
.news-featured-img { width: 100%; height: 280px; object-fit: cover; transition: transform .35s ease; }
.news-featured-card:hover .news-featured-img { transform: scale(1.04); }
.news-cat-pill {
  position: absolute; top: 14px; left: 14px; color: #fff; font-size: .7rem; font-weight: 700;
  padding: 4px 12px; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em;
}
.news-row-item {
  display: flex; gap: 14px; padding: 10px; border-radius: 12px; transition: background .15s ease;
  border-bottom: 1px solid #f1f5f9;
}
.news-row-item:hover { background: rgba(99,102,241,.06); }
.news-row-thumb-wrap { width: 72px; height: 72px; border-radius: 10px; overflow: hidden; }
.news-row-thumb { width: 100%; height: 100%; object-fit: cover; }
.news-cat-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; }

/* ============================================================
   LANDING PAGE REDESIGN — "Academic Seal" identity
   Scoped entirely to .landing so the logged-in dashboard app
   (indigo theme, --es-* vars above) is completely unaffected.
   ============================================================ */
.landing {
  --landing-ink: #0B1F3A;
  --landing-ink-soft: #1C3357;
  --landing-parchment: #FBF7EE;
  --landing-parchment-dim: #F3EDDF;
  --landing-gold: #E8A33D;
  --landing-gold-dark: #C97F1E;
  --landing-green: #1F7A5C;
  --landing-coral: #D64550;
  --landing-slate: #5B6472;
  background: var(--landing-parchment);
  color: var(--landing-ink);
}
.landing, .landing p, .landing li, .landing input, .landing textarea, .landing select {
  font-family: 'Inter', sans-serif;
}
.landing .font-display, .landing h1, .landing h2, .landing h3,
.landing .landing-headline, .landing .landing-quote-text {
  font-family: 'Fraunces', serif;
}
.landing .font-mono, .landing .landing-eyebrow, .landing .landing-stat-label,
.landing .landing-tag, .landing .landing-attribution {
  font-family: 'IBM Plex Mono', monospace;
}

/* ---- Navbar ---- */
.landing-navbar {
  background: var(--landing-parchment);
  border-bottom: 1px solid rgba(11,31,58,.08);
}
.landing-navbar .navbar-brand {
  font-family: 'Fraunces', serif; font-weight: 700; font-size: 1.4rem;
  color: var(--landing-ink) !important;
}
.landing-navbar .nav-link {
  color: var(--landing-ink); font-weight: 500; position: relative;
}
.landing-navbar .nav-link:hover { color: var(--landing-gold-dark); }
.landing-btn-gold {
  background: var(--landing-gold); border: 2px solid var(--landing-ink); color: var(--landing-ink) !important;
  font-weight: 700; border-radius: 999px; padding: .5rem 1.4rem; transition: transform .15s ease, background .15s ease;
}
.landing-btn-gold:hover { background: var(--landing-gold-dark); transform: translateY(-1px); color: var(--landing-ink) !important; }
.landing-btn-outline-ink {
  background: transparent; border: 2px solid var(--landing-ink); color: var(--landing-ink) !important;
  font-weight: 700; border-radius: 999px; padding: .5rem 1.4rem; transition: background .15s ease, color .15s ease;
}
.landing-btn-outline-ink:hover { background: var(--landing-ink); color: var(--landing-parchment) !important; }

/* ---- Hero ---- */
.landing-hero {
  padding: 90px 0 70px;
  background:
    radial-gradient(circle at 88% 15%, rgba(232,163,61,.14) 0%, transparent 45%),
    var(--landing-parchment);
}
.landing-eyebrow {
  display: inline-block; font-size: .78rem; font-weight: 600; letter-spacing: .09em;
  color: var(--landing-gold-dark); text-transform: uppercase; margin-bottom: 14px;
}
.landing-headline {
  font-size: 3.1rem; font-weight: 600; line-height: 1.08; color: var(--landing-ink); margin-bottom: 20px;
}
.landing-headline em { font-style: italic; color: var(--landing-gold-dark); }
.landing-hero-sub { font-size: 1.15rem; color: var(--landing-slate); max-width: 480px; margin-bottom: 32px; }

/* Signature seal badge (SVG styled via CSS) */
.landing-seal-wrap { display: flex; justify-content: center; align-items: center; }
.landing-seal { width: 260px; height: 260px; filter: drop-shadow(0 12px 24px rgba(11,31,58,.15)); }
.landing-seal-small { width: 110px; height: 110px; }
.landing-seal .seal-ring { fill: none; stroke: var(--landing-ink); stroke-width: 2; }
.landing-seal .seal-disc { fill: var(--landing-gold); }
.landing-seal .seal-notches { fill: var(--landing-parchment); }
.landing-seal .seal-icon { fill: none; stroke: var(--landing-ink); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.landing-seal .seal-text { font-family: 'IBM Plex Mono', monospace; font-size: 6.2px; font-weight: 600; letter-spacing: 2px; fill: var(--landing-ink); }
@media (max-width: 991px) { .landing-seal { width: 180px; height: 180px; } }

/* ---- Stats strip ---- */
.landing-stats-strip { background: var(--landing-ink); padding: 46px 0; }
.landing-stat-number {
  font-size: 2.6rem; font-weight: 600; color: var(--landing-gold); line-height: 1; margin-bottom: 6px;
}
.landing-stat-label {
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(251,247,238,.65);
}
.landing-stat-block { border-left: 1px solid rgba(251,247,238,.15); }
.landing-stat-block:first-child { border-left: none; }

/* ---- Feature cards ---- */
.landing-feature-card {
  background: #fff; border: 1px solid rgba(11,31,58,.08); border-radius: 4px;
  padding: 32px 28px; height: 100%; transition: border-color .15s ease, transform .15s ease;
}
.landing-feature-card:hover { border-color: var(--landing-gold); transform: translateY(-3px); }
.landing-feature-icon-ring {
  width: 56px; height: 56px; border-radius: 50%; border: 2px solid var(--landing-gold);
  display: flex; align-items: center; justify-content: center; margin-bottom: 18px; flex-shrink: 0;
}
.landing-feature-icon-ring i { color: var(--landing-ink); font-size: 1.25rem; }
.landing-tag {
  display: inline-block; font-size: .65rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--landing-green); border: 1px solid var(--landing-green); border-radius: 3px; padding: 2px 8px; margin-bottom: 12px;
}
.landing-feature-card h5 { font-weight: 600; margin-bottom: 10px; }
.landing-feature-rule { width: 36px; height: 2px; background: var(--landing-gold); border: none; margin: 0 0 14px; }
.landing-feature-card p { color: var(--landing-slate); font-size: .95rem; margin: 0; }

/* ---- Section headers ---- */
.landing-section-head { text-align: center; margin-bottom: 48px; }
.landing-section-head h2 { font-size: 2.1rem; font-weight: 600; }
.landing-section-head p { color: var(--landing-slate); }

/* ---- Exam logos strip ---- */
.landing-exam-strip { background: var(--landing-parchment-dim); padding: 36px 0; border-top: 1px solid rgba(11,31,58,.06); border-bottom: 1px solid rgba(11,31,58,.06); }
.landing-exam-strip img { filter: grayscale(15%); opacity: .88; transition: opacity .15s ease; }
.landing-exam-strip img:hover { opacity: 1; }

/* ---- Testimonials ---- */
.landing-testimonial-card {
  background: #fff; border: 1px solid rgba(11,31,58,.08); border-radius: 4px; padding: 34px 30px; height: 100%;
}
.landing-quote-mark { font-size: 2.6rem; color: var(--landing-gold); line-height: 1; margin-bottom: 6px; }
.landing-quote-text { font-style: italic; font-size: 1.08rem; color: var(--landing-ink); margin-bottom: 20px; }
.landing-attribution { font-size: .78rem; color: var(--landing-slate); text-transform: uppercase; letter-spacing: .04em; }
.landing-attribution strong { color: var(--landing-ink); font-family: 'Inter', sans-serif; text-transform: none; letter-spacing: 0; display: block; font-size: .95rem; }

/* ---- FAQ ---- */
.landing-faq .accordion-item { border: 1px solid rgba(11,31,58,.1); border-radius: 4px !important; margin-bottom: 10px; overflow: hidden; }
.landing-faq .accordion-button { font-family: 'Fraunces', serif; font-weight: 600; color: var(--landing-ink); background: #fff; }
.landing-faq .accordion-button:not(.collapsed) { background: var(--landing-parchment-dim); color: var(--landing-ink); box-shadow: none; }
.landing-faq .accordion-button::after { filter: sepia(1) saturate(3) hue-rotate(0deg) brightness(.9); }

/* ---- News (landing variant - reuse structure, retint accents) ---- */
.landing .news-eyebrow { color: var(--landing-gold-dark); font-family: 'IBM Plex Mono', monospace; }
.landing .news-featured-card h4 { font-family: 'Fraunces', serif; }

/* ---- Footer ---- */
.landing-footer { background: var(--landing-ink); color: rgba(251,247,238,.75); }
.landing-footer h6 { font-family: 'Fraunces', serif; color: var(--landing-parchment); }
.landing-footer a { color: rgba(251,247,238,.65); }
.landing-footer a:hover { color: var(--landing-gold); }
.landing-footer .btn-outline-light { border-color: rgba(251,247,238,.3); }
.landing-footer .btn-outline-light:hover { background: var(--landing-gold); border-color: var(--landing-gold); color: var(--landing-ink); }

@media (max-width: 767px) {
  .landing-headline { font-size: 2.15rem; }
  .landing-stat-block { border-left: none; border-top: 1px solid rgba(251,247,238,.15); padding-top: 16px; }
  .landing-stat-block:first-child { border-top: none; }
}

/* ============================================================
   LANDING PAGE ANIMATION LAYER
   Scroll-reveal + hover polish. Respects prefers-reduced-motion.
   ============================================================ */
.landing-animate {
  opacity: 0; transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}
.landing-animate.in-view { opacity: 1; transform: translateY(0); }
.landing-animate-delay-1.in-view { transition-delay: .08s; }
.landing-animate-delay-2.in-view { transition-delay: .16s; }
.landing-animate-delay-3.in-view { transition-delay: .24s; }
.landing-animate-delay-4.in-view { transition-delay: .32s; }
.landing-animate-delay-5.in-view { transition-delay: .40s; }

/* Gentle continuous float on the seal badge */
@keyframes sealFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-10px) rotate(1.5deg); }
}
.landing-seal-wrap .landing-seal { animation: sealFloat 6s ease-in-out infinite; }

/* Ken Burns slow-zoom on hero carousel photos */
@keyframes kenBurns {
  0% { transform: scale(1); }
  100% { transform: scale(1.08); }
}
.carousel-item.active .hero-carousel-img { animation: kenBurns 6s ease-out forwards; }

/* Button micro-interaction */
.landing-btn-gold, .landing-btn-outline-ink {
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.landing-btn-gold:hover { box-shadow: 0 8px 20px rgba(232,163,61,.35); transform: translateY(-2px); }
.landing-btn-outline-ink:hover { transform: translateY(-2px); }

/* Nav link animated underline */
.landing-navbar .nav-link { position: relative; }
.landing-navbar .nav-link::after {
  content: ''; position: absolute; left: 0; bottom: 2px; width: 0; height: 2px;
  background: var(--landing-gold); transition: width .25s ease;
}
.landing-navbar .nav-link:hover::after { width: 100%; }

/* Feature card icon ring pulse on hover */
.landing-feature-card:hover .landing-feature-icon-ring {
  background: var(--landing-gold); transition: background .25s ease;
}
.landing-feature-card:hover .landing-feature-icon-ring i { color: #fff; transition: color .25s ease; }
.landing-feature-icon-ring, .landing-feature-icon-ring i { transition: background .25s ease, color .25s ease; }

@media (prefers-reduced-motion: reduce) {
  .landing-animate { opacity: 1; transform: none; transition: none; }
  .landing-seal-wrap .landing-seal, .carousel-item.active .hero-carousel-img { animation: none; }
}

/* ---- Secured Content: locked card + animated PIN modal ---- */
.secured-card-locked { background: linear-gradient(180deg, #fff 0%, #fdf6e8 100%); border: 1px dashed #e8c98a; }

.secured-pin-icon {
  width: 64px; height: 64px; border-radius: 50%; margin: 0 auto;
  background: rgba(230, 168, 45, .12); color: #C98A1F;
  display: flex; align-items: center; justify-content: center; font-size: 1.6rem;
  animation: secured-pin-pop .35s ease;
}
@keyframes secured-pin-pop {
  0% { transform: scale(0.4); opacity: 0; }
  70% { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); }
}
.secured-pin-icon.pin-shake { animation: secured-pin-shake .45s ease; }
@keyframes secured-pin-shake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(4px); }
  30%, 50%, 70% { transform: translateX(-8px); }
  40%, 60% { transform: translateX(8px); }
}

.pin-digit { transition: border-color .15s ease, box-shadow .15s ease; }
.pin-digit:focus { border-color: #E8A93B; box-shadow: 0 0 0 .2rem rgba(232,169,59,.25); }

.secured-pin-modal .modal-body { animation: secured-modal-in .3s ease; }
@keyframes secured-modal-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}