/**
 * Education Platform — Content Component Styles
 * Styles for exam cards, trust bar, subject grid, sidebar widgets,
 * newsletter, and homepage layout ONLY.
 *
 * Does NOT override the base Anymag theme header, footer, or layout.
 * The original Anymag "book-like" design is preserved.
 */

/* ── Prevent horizontal scroll from off-screen nav panel elements ── */
html, body { overflow-x: hidden; }

/* ── CSS Custom Properties ────────────────────────────────────── */
:root {
  --edu-primary: #111111;
  --edu-primary-light: #333333;
  --edu-accent: #ff027f;
  --edu-accent-hover: #cc0066;
  --edu-success: #27ae60;
  --edu-danger: #e74c3c;
  --edu-bg: #f8f9fa;
  --edu-card: #ffffff;
  --edu-text: #2d3748;
  --edu-text-secondary: #718096;
  --edu-border: #e2e8f0;
  --edu-radius: 8px;
  --edu-radius-lg: 12px;
  --edu-shadow: 0 1px 3px rgba(0,0,0,0.1);
  --edu-shadow-md: 0 4px 6px rgba(0,0,0,0.07);
  --edu-shadow-lg: 0 10px 25px rgba(0,0,0,0.1);
  --edu-transition: 0.2s ease;
  --edu-container: 1280px;
}

/* ═══════════════════════════════════════════════════════════════
   GLOBAL LIST-STYLE RESET

   The base Anymag theme sets: ul, li { list-style: circle outside; margin-left: 10px; }
   This bleeds into ALL components. We must override on individual li elements
   with !important to ensure clean display in navigation, tickers, and footers.
   ═══════════════════════════════════════════════════════════════ */

/* ── ALL header types — horizontal menu ─────────────────────── */
.horizontal-menu li,
.edu-horizontal-menu li,
.split-left-menu li,
.split-right-menu li,
.overlay-menu li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── ALL header types — nav panel (mobile slide-in) ────────── */
.nav-panel li,
.nav-panel .nav-menu li,
#nav-panel li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Classic education header navbar ───────────────────────── */
.edu-navbar li,
.edu-horizontal-menu li,
.edu-navbar .horizontal-menu li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Header action areas ───────────────────────────────────── */
.header-topbar-actions li,
.header-centered-nav li,
.header-topbar-nav li,
.header-split-nav li,
.header-overlay-bar li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Breaking news ticker items ────────────────────────────── */
.anymag-ticker-wrap li,
.anymag-ticker-wrap .ticker-item {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Footer — all variants ─────────────────────────────────── */
.footer-edu-links li,
.footer-edu-links-row li,
.edu-footer-links-row li,
#footer li,
#footer .menu li,
#footer.footer-education li,
.footer-education .menu li,
.footer-education .footer-menu li,
.footer-magazine li,
.footer-social-links li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Education content sections ────────────────────────────── */
.edu-trust-bar li,
.edu-how-it-works li,
.edu-subject-grid li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ── Searchform overlay ────────────────────────────────────── */
.searchform-overlay li {
  list-style: none !important;
  margin-left: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════
   BREAKING NEWS TICKER — Newspaper Pro Inspired
   Reference: Demo 1 "TRENDING NOW" bar — dark label pill +
   scrolling headlines on clean background.
   ═══════════════════════════════════════════════════════════════ */
.anymag-ticker-wrap {
  background-color: #f8f8f8 !important;
  border-bottom: 1px solid #eee;
}

.anymag-ticker-wrap .ticker-label {
  background-color: #222 !important;
  color: #fff !important;
  padding: 7px 14px !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  font-family: 'Poppins', sans-serif !important;
}

.anymag-ticker-wrap .ticker-item {
  font-size: 13px !important;
  padding: 8px 20px !important;
  font-family: 'Poppins', sans-serif !important;
}

.anymag-ticker-wrap .ticker-item a {
  color: #444 !important;
  font-weight: 400 !important;
}

.anymag-ticker-wrap .ticker-item a:hover {
  color: var(--edu-accent) !important;
}

/* Separator dot between ticker items */
.anymag-ticker-wrap .ticker-item + .ticker-item::before {
  content: '•';
  margin-right: 20px;
  color: #ccc;
  font-size: 8px;
}

/* ═══════════════════════════════════════════════════════════════
   CLASSIC EDUCATION HEADER
   Styles for header-classic.php — the education-focused header
   with top bar, logo/search row, and sticky navigation bar.
   ═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   BOOK-LAYOUT OVERRIDE FOR ALL HEADER TYPES

   The Anymag "book" layout uses:
     .magheader  → position:absolute, height:0
     #site-header → position:absolute, height:86px, width:50%
     .magcontent → float:right, width:60%

   ALL education-aware headers need full-width normal document
   flow, similar to the Newspaper theme's stacked header design.
   ═══════════════════════════════════════════════════════════════ */

body.header-type-classic .site-wrapper,
body.header-type-centered .site-wrapper,
body.header-type-topbar-menu .site-wrapper,
body.header-type-split .site-wrapper,
body.header-type-overlay .site-wrapper,
body.header-type-default .site-wrapper {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh;
}

/* Sticky footer: magcontent grows to fill, footer pushed to bottom */
body.header-type-classic .magcontent,
body.header-type-centered .magcontent,
body.header-type-topbar-menu .magcontent,
body.header-type-split .magcontent,
body.header-type-overlay .magcontent,
body.header-type-default .magcontent {
  flex: 1 0 auto;
  min-height: auto !important;
  display: flex;
  flex-direction: column;
}
body.header-type-classic .footer-wrapper,
body.header-type-classic .main-footer,
body.header-type-centered .footer-wrapper,
body.header-type-centered .main-footer,
body.header-type-topbar-menu .footer-wrapper,
body.header-type-topbar-menu .main-footer,
body.header-type-split .footer-wrapper,
body.header-type-split .main-footer,
body.header-type-overlay .footer-wrapper,
body.header-type-overlay .main-footer,
body.header-type-default .footer-wrapper,
body.header-type-default .main-footer {
  margin-top: auto;
}

body.header-type-classic .magheader,
body.header-type-centered .magheader,
body.header-type-topbar-menu .magheader,
body.header-type-split .magheader,
body.header-type-overlay .magheader,
body.header-type-default .magheader {
  position: relative !important;
  height: auto !important;
  width: 100% !important;
  float: none !important;
  order: -1;
}

#site-header.header-classic-type,
#site-header.header-centered-type,
#site-header.header-topbar-type,
#site-header.header-split-type,
#site-header.header-overlay-type,
.f-width #site-header.header-classic-type,
.f-width #site-header.header-centered-type,
.f-width #site-header.header-topbar-type,
.f-width #site-header.header-split-type,
.f-width #site-header.header-overlay-type,
.f-width #site-header {
  position: relative !important;
  height: auto !important;
  padding: 0 !important;
  float: none !important;
  width: 100% !important;
  left: auto !important;
}

/* ── Sticky header override ──────────────────────────────────
   Restore fixed positioning when scrolled past the header.
   Must use !important to beat the relative !important above.
   Compact mode: hide logo row, show only nav + actions.       */
.header-sticky #site-header.header-classic-type,
.header-sticky #site-header.header-centered-type,
.header-sticky #site-header.header-topbar-type,
.header-sticky #site-header.header-split-type,
.header-sticky #site-header.header-overlay-type,
.header-sticky #site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 15px rgba(0,0,0,.1);
  animation: slideDown .35s ease;
}
.header-sticky.admin-bar #site-header {
  top: 32px !important;
}
@media (max-width: 782px) {
  .header-sticky.admin-bar #site-header {
    top: 46px !important;
  }
}

/* Remove stacking context from .magheader when sticky
   so the fixed #site-header can escape and sit on top of content */
.header-sticky .magheader {
  z-index: auto !important;
}

/* Hide bulky sections when sticky — keep it compact */
.header-sticky .edu-topbar,
.header-sticky .header-ad-banner {
  display: none !important;
}

/* Centered header: compact the logo row when sticky */
.header-sticky .header-centered-wrapper {
  padding: 6px 2% !important;
}
.header-sticky .header-centered-logo img {
  max-height: 32px !important;
}

/* Classic header: compact the main header row */
.header-sticky .edu-main-header {
  padding: 6px 2% !important;
}
.header-sticky .edu-logo img {
  max-height: 32px !important;
}

/* Classic: make the edu-navbar slimmer when whole header is fixed */
.header-sticky .edu-navbar {
  position: relative !important; /* no need for its own sticky inside fixed parent */
  top: auto !important;
}

/* Mobile sticky: ensure full width, hide navbar, compact logo */
@media (max-width: 960px) {
  .header-sticky #site-header {
    width: 100% !important;
  }
  .header-sticky .edu-navbar {
    display: none !important;
  }
  .header-sticky .edu-main-header {
    padding: 8px 12px !important;
    gap: 10px !important;
  }
  .header-sticky .header-classic-logo.edu-logo {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .header-sticky .edu-logo .site-title-text {
    font-size: 16px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .header-sticky .edu-logo img {
    max-height: 28px !important;
  }
}
@media (max-width: 480px) {
  .header-sticky .edu-logo .site-title-text {
    display: none !important;
  }
  .header-sticky .edu-main-header {
    padding: 6px 10px !important;
    gap: 8px !important;
  }
}

/* Also make #content-header fixed for headers that use it */
.header-sticky #content-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9998 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 15px rgba(0,0,0,.1);
}
.header-sticky.admin-bar #content-header {
  top: 32px !important;
}

body.header-type-classic .magcontent,
body.header-type-centered .magcontent,
body.header-type-topbar-menu .magcontent,
body.header-type-split .magcontent,
body.header-type-overlay .magcontent,
body.header-type-default .magcontent {
  float: none !important;
  width: 100% !important;
  padding-top: 0 !important;
  margin-left: 0 !important;
}

/* Nav-open state — all header types */
.f-width.nav-open #site-header.header-classic-type,
.f-width.nav-open #site-header.header-centered-type,
.f-width.nav-open #site-header.header-topbar-type,
.f-width.nav-open #site-header.header-split-type,
.f-width.nav-open #site-header.header-overlay-type,
.f-width.nav-open #site-header {
  position: relative !important;
  height: auto !important;
}

/* #main-area padding-top was for the old absolute header — zero it out */
body.header-type-classic #main-area,
body.header-type-centered #main-area,
body.header-type-topbar-menu #main-area,
body.header-type-split #main-area,
body.header-type-overlay #main-area,
body.header-type-default #main-area {
  padding-top: 0 !important;
}

/* Hide the book-layout fold-shadow decorative element */
body.header-type-classic .fold-shadow,
body.header-type-centered .fold-shadow,
body.header-type-topbar-menu .fold-shadow,
body.header-type-split .fold-shadow,
body.header-type-overlay .fold-shadow,
body.header-type-default .fold-shadow {
  display: none !important;
}

/* ── Top Bar (Newspaper Pro inspired — dark utility strip) ──── */
/* Reference: Newspaper Pro Demo 1 — 28px dark #222 bar with
   utility items left, social/auth right. Clean, minimal. */
.edu-topbar {
  background: #222222;
  color: rgba(255,255,255,0.85);
  font-size: 12px;
  line-height: 1;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.edu-topbar-inner {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  position: relative;
}

.edu-topbar-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.edu-topbar-ticker {
  display: flex;
  align-items: center;
  gap: 7px;
  font-weight: 500;
  font-size: 11px;
  color: rgba(255,255,255,0.9);
  letter-spacing: 0.2px;
}

.edu-topbar-ticker i {
  color: #ffd700;
  font-size: 10px;
}

.edu-topbar-center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.edu-topbar-student {
  font-size: 11px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  letter-spacing: 0.2px;
  white-space: nowrap;
}
.edu-topbar-student em {
  font-style: normal;
  color: #ffd700;
  font-weight: 600;
}
/* Mobile: hide center, show name on the left instead of ticker */
.edu-topbar-left .edu-topbar-student-mobile { display: none; }
@media (max-width: 768px) {
  .edu-topbar-center { display: none; }
  .edu-topbar-left .edu-topbar-ticker { display: none; }
  .edu-topbar-left .edu-topbar-student-mobile { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 500; color: rgba(255,255,255,0.85); }
  .edu-topbar-left .edu-topbar-student-mobile em { font-style: normal; color: #ffd700; font-weight: 600; }
}

.edu-topbar-right {
  display: flex;
  align-items: center;
  gap: 0;
}

/* Newspaper Pro style: simple text links with pipe separators */
.edu-topbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 12px;
  color: rgba(255,255,255,0.75);
  font-size: 11px;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s ease;
  border: none;
  background: none;
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: 0.3px;
}

.edu-topbar-btn:hover {
  color: #fff;
}

.edu-topbar-btn i {
  font-size: 12px;
  opacity: 0.8;
}

/* Accent register button — Newspaper Momentum style pill */
.edu-topbar-btn-accent {
  background: var(--edu-accent);
  color: #fff !important;
  border-radius: 3px;
  margin-left: 6px;
  font-weight: 600;
}

.edu-topbar-btn-accent:hover {
  background: var(--edu-accent-hover);
  color: #fff !important;
}

/* Country badge in top bar */
.edu-topbar-country {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  background: rgba(255,255,255,0.12);
  border-radius: 3px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  margin-right: 6px;
}
.edu-topbar-country-flag { font-size: 15px; line-height: 1; }

@media (max-width: 600px) {
  .edu-topbar-country-name { display: none; }
  .edu-topbar-country { padding: 4px 6px; margin-right: 2px; }
}

/* ── Main Header Row (Newspaper Pro inspired — logo + search + actions) ── */
/* Reference: Demo 1 has a 127px logo row with generous whitespace.
   Demo 2 has editorial double-rule borders (thin+thick) between rows.
   We combine both: generous height + editorial border at bottom. */
.edu-main-header {
  background: #fff;
  position: relative;
}

/* Editorial double-rule bottom border (Newspaper Urban Observer style) */
.edu-main-header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(to bottom,
    #e0e0e0 0%, #e0e0e0 25%,   /* 1px thin line */
    transparent 25%, transparent 50%, /* 1px gap */
    #222 50%, #222 100%         /* 2px thick line */
  );
}

.header-classic-wrapper.edu-main-header {
  max-width: none;
  width: 100%;
  padding: 20px max(20px, calc((100% - var(--edu-container)) / 2 + 20px));
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  gap: 28px;
  box-sizing: border-box;
}

/* ── Inline nav: menu sits right of logo in same row ─── */
.header-classic-inline {
  justify-content: flex-start !important;
}

.header-classic-inline .edu-nav-inline {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
}

.header-classic-inline .edu-nav-inline .horizontal-menu,
.header-classic-inline .edu-nav-inline .edu-horizontal-menu {
  display: flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-content: flex-end;
  gap: 4px;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li > a,
.header-classic-inline .edu-nav-inline .edu-horizontal-menu > li > a {
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 600;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s ease, background 0.2s ease;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li > a:hover,
.header-classic-inline .edu-nav-inline .edu-horizontal-menu > li > a:hover {
  opacity: 0.8;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li.current-menu-item > a,
.header-classic-inline .edu-nav-inline .horizontal-menu > li.current-menu-ancestor > a {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 3px;
}

/* Dropdown styles for inline nav */
.header-classic-inline .edu-nav-inline .horizontal-menu > li {
  position: relative;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li > .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  min-width: 200px;
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.2s ease;
  z-index: 100;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li > .sub-menu a {
  display: block;
  padding: 8px 16px;
  font-size: 13px;
  color: #444;
  text-decoration: none;
  font-weight: 500;
}

.header-classic-inline .edu-nav-inline .horizontal-menu > li > .sub-menu a:hover {
  background: #f8f8f8;
  color: var(--edu-accent);
}

/* CTA button inside actions row */
.header-classic-inline .edu-header-actions {
  gap: 10px;
}

.header-classic-inline .edu-header-actions .edu-navbar-cta {
  margin-right: 4px;
}

.header-classic-inline .edu-header-actions .edu-navbar-cta .edu-cta-btn {
  font-size: 13px;
  padding: 8px 18px;
}

/* Hide the old separate navbar when inline layout is used */
.header-classic-type .edu-navbar {
  display: none;
}

/* Mobile: hide inline nav, show hamburger */
@media (max-width: 1024px) {
  .header-classic-inline .edu-nav-inline,
  .edu-header .edu-nav-inline {
    display: none !important;
  }
  .header-classic-inline .edu-header-actions .edu-navbar-cta,
  .edu-header .edu-header-actions .edu-navbar-cta {
    display: none !important;
  }
  .header-classic-inline {
    justify-content: space-between !important;
  }
  /* Hide buttons that cause overflow on mobile — keep only cart + hamburger */
  .edu-header-actions .edu-cta-btn,
  .edu-header-actions .edu-login-btn,
  .edu-header-actions .edu-login-btn-header,
  .edu-header-actions .edu-search-toggle,
  .edu-header-actions .edu-user-btn {
    display: none !important;
  }
}

.header-classic-logo.edu-logo {
  flex: 0 0 auto;
  width: auto;
}

.header-classic-logo.edu-logo a {
  display: inline-flex;
  align-items: center;
}

.header-classic-logo.edu-logo img {
  max-height: 55px;
  width: auto;
}

.header-classic-logo.edu-logo .site-title-text {
  font-size: 28px;
  font-weight: 800;
  color: #111;
  text-decoration: none;
  white-space: nowrap;
  font-family: 'Poppins', sans-serif;
  letter-spacing: -0.3px;
}

/* Search form — refined Newspaper Pro style with clean borders */
.edu-header-search {
  flex: 1 1 0%;
  min-width: 200px;
  max-width: 560px;
}

.edu-search-form {
  display: flex;
  align-items: center;
  background: #fff;
  border: 2px solid #e8e8e8;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.edu-search-form:focus-within {
  border-color: var(--edu-accent);
  box-shadow: 0 0 0 3px rgba(255, 2, 127, 0.08);
}

.edu-search-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 10px 16px;
  font-size: 14px;
  color: #333;
  outline: none;
  font-family: 'Poppins', sans-serif;
}

.edu-search-input::placeholder {
  color: #b0b8c4;
  font-size: 13px;
}

.edu-search-btn {
  background: var(--edu-accent);
  color: #fff;
  border: none;
  padding: 10px 18px;
  cursor: pointer;
  font-size: 15px;
  transition: background 0.2s ease;
  display: flex;
  align-items: center;
}

.edu-search-btn:hover {
  background: var(--edu-accent-hover);
}

/* Header action icons — clean circular buttons */
.header-classic-actions.edu-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.edu-user-btn,
.edu-cart-btn,
.edu-search-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #f5f5f5;
  color: #555;
  text-decoration: none;
  transition: all 0.2s ease;
  font-size: 16px;
  position: relative;
  border: 1px solid transparent;
}

.edu-user-btn:hover,
.edu-cart-btn:hover,
.edu-search-toggle:hover {
  background: #fff;
  color: var(--edu-accent);
  border-color: var(--edu-accent);
  box-shadow: 0 2px 8px rgba(255, 2, 127, 0.15);
}

.edu-user-btn img {
  border-radius: 50%;
  width: 34px;
  height: 34px;
  border: 2px solid #eee;
}

/* Distinct login button for logged-out users */
.edu-login-btn-header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 50px;
  background: var(--edu-accent, #e8a924);
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.edu-login-btn-header:hover {
  opacity: 0.9;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.edu-login-btn-header i {
  font-size: 13px;
}

@media (max-width: 960px) {
  .edu-login-btn-text {
    display: none;
  }
  .edu-login-btn-header {
    width: 36px;
    height: 36px;
    padding: 0;
    justify-content: center;
    border-radius: 50%;
  }
  .edu-login-btn-header i {
    font-size: 14px;
  }
}

/* Dark mode */
body.dark-mode .edu-login-btn-header {
  background: var(--edu-accent, #e8a924);
  color: #fff;
}

.edu-cart-count {
  position: absolute;
  top: -3px;
  right: -3px;
  background: var(--edu-accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid #fff;
}

/* ═══════════════════════════════════════════════════════════════
   NAVIGATION BAR — Newspaper Pro Inspired
   Reference: Demo 1 (classic news) — white bar, black bold text,
   3px accent underline on hover/active.
   Demo 2 (Urban Observer) — editorial double-rule borders top/bottom,
   heavier 18px bold typography.
   We blend: dark bar with white text + editorial top accent line +
   clean accent-only underline hover (no background change).
   ═══════════════════════════════════════════════════════════════ */
.edu-navbar {
  background: #222222;
  position: sticky;
  top: 0;
  z-index: 999;
  box-shadow: 0 2px 12px rgba(0,0,0,0.12);
  border-top: 3px solid var(--edu-accent);
}

/* When WP admin bar is present, offset the sticky */
.admin-bar .edu-navbar {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .edu-navbar {
    top: 46px;
  }
}

.edu-navbar-inner {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Override the horizontal menu inside the navbar */
.edu-navbar .horizontal-menu,
.edu-navbar .edu-horizontal-menu {
  display: flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0;
  flex: 1;
}

.edu-navbar .horizontal-menu > li,
.edu-navbar .edu-horizontal-menu > li {
  position: relative;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Nav links — Newspaper Pro Demo 1 style: bold uppercase, clean */
.edu-navbar .horizontal-menu > li > a,
.edu-navbar .edu-horizontal-menu > li > a {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 16px;
  line-height: 48px;
  color: rgba(255,255,255,0.85);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  transition: color 0.2s ease;
  white-space: nowrap;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  position: relative;
}

/* Active indicator — 3px accent underline at bottom (Newspaper Pro signature) */
.edu-navbar .horizontal-menu > li > a::after,
.edu-navbar .edu-horizontal-menu > li > a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--edu-accent);
  transform: scaleX(0);
  transition: transform 0.25s ease;
}

.edu-navbar .horizontal-menu > li.current-menu-item > a::after,
.edu-navbar .horizontal-menu > li.current-menu-ancestor > a::after,
.edu-navbar .edu-horizontal-menu > li.current-menu-item > a::after,
.edu-navbar .edu-horizontal-menu > li.current-menu-ancestor > a::after {
  transform: scaleX(1);
}

/* Hover: accent underline slides in + text brightens (NO background change) */
.edu-navbar .horizontal-menu > li > a:hover::after,
.edu-navbar .edu-horizontal-menu > li > a:hover::after {
  transform: scaleX(1);
}

.edu-navbar .horizontal-menu > li > a:hover,
.edu-navbar .edu-horizontal-menu > li > a:hover {
  color: #fff;
}

.edu-navbar .horizontal-menu > li.current-menu-item > a,
.edu-navbar .horizontal-menu > li.current-menu-ancestor > a,
.edu-navbar .edu-horizontal-menu > li.current-menu-item > a,
.edu-navbar .edu-horizontal-menu > li.current-menu-ancestor > a {
  color: #fff;
}

/* Dropdown chevron for items with children */
.edu-navbar .horizontal-menu > li.menu-item-has-children > a::before,
.edu-navbar .edu-horizontal-menu > li.menu-item-has-children > a::before {
  content: '\f107';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', FontAwesome;
  font-weight: 900;
  font-size: 10px;
  margin-left: 4px;
  opacity: 0.5;
  order: 999;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.edu-navbar .horizontal-menu > li.menu-item-has-children:hover > a::before,
.edu-navbar .edu-horizontal-menu > li.menu-item-has-children:hover > a::before {
  opacity: 0.9;
  transform: rotate(180deg);
}

/* ═══════════════════════════════════════════════════════════════
   DROPDOWN SUB-MENUS — Newspaper Pro Inspired
   Reference: Demo 1 — white dropdown with accent top border,
   clean list with hover slide-in effect.
   ═══════════════════════════════════════════════════════════════ */
.edu-navbar .horizontal-menu > li > .sub-menu,
.edu-navbar .edu-horizontal-menu > li > .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border-radius: 0 0 6px 6px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.08);
  min-width: 250px;
  border-top: 3px solid var(--edu-accent);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
  padding: 8px 0;
  list-style: none !important;
}

.edu-navbar .horizontal-menu > li:hover > .sub-menu,
.edu-navbar .edu-horizontal-menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.edu-navbar .horizontal-menu > li > .sub-menu li,
.edu-navbar .edu-horizontal-menu > li > .sub-menu li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.edu-navbar .horizontal-menu > li > .sub-menu a,
.edu-navbar .edu-horizontal-menu > li > .sub-menu a {
  display: flex;
  align-items: center;
  color: #444;
  padding: 10px 22px;
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  text-decoration: none;
  transition: all 0.15s ease;
  border-bottom: 1px solid #f5f5f5;
  font-family: 'Poppins', sans-serif;
  position: relative;
}

/* Accent left-border on hover (Newspaper Pro style) */
.edu-navbar .horizontal-menu > li > .sub-menu a::before,
.edu-navbar .edu-horizontal-menu > li > .sub-menu a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--edu-accent);
  transform: scaleY(0);
  transition: transform 0.2s ease;
}

.edu-navbar .horizontal-menu > li > .sub-menu li:last-child a,
.edu-navbar .edu-horizontal-menu > li > .sub-menu li:last-child a {
  border-bottom: none;
}

.edu-navbar .horizontal-menu > li > .sub-menu a:hover,
.edu-navbar .edu-horizontal-menu > li > .sub-menu a:hover {
  background: #fafafa;
  color: var(--edu-accent);
  transform: translateX(4px);
}

.edu-navbar .horizontal-menu > li > .sub-menu a:hover::before,
.edu-navbar .edu-horizontal-menu > li > .sub-menu a:hover::before {
  transform: scaleY(1);
}

/* Nested sub-menus (flyout right) */
.edu-navbar .horizontal-menu .sub-menu .sub-menu,
.edu-navbar .edu-horizontal-menu .sub-menu .sub-menu {
  top: -8px;
  left: 100%;
  border-radius: 0 6px 6px 0;
  border-top: 3px solid var(--edu-accent);
}

.edu-navbar .horizontal-menu .sub-menu li:hover > .sub-menu,
.edu-navbar .edu-horizontal-menu .sub-menu li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* ═══════════════════════════════════════════════════════════════
   MEGA MENU — Newspaper Pro Inspired Full-Width Dropdown
   Reference: Demo 1 — left category filter + 4-column article grid.
   Demo 2 — clean 5-column article grid.
   ═══════════════════════════════════════════════════════════════ */
.edu-navbar .horizontal-menu > li.mega-menu,
.edu-navbar .horizontal-menu > li.mega-menu-column {
  position: static;
}

.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu,
.edu-navbar .mega-menu-wrap {
  left: 0;
  right: 0;
  width: 100%;
  border-top: 3px solid var(--edu-accent);
  display: flex !important;
  flex-wrap: wrap;
  padding: 24px 20px;
  gap: 0;
  border-radius: 0 0 6px 6px;
}

.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu > li,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu > li {
  flex: 1;
  min-width: 200px;
  padding: 0 20px;
  border-right: 1px solid #eee;
}

.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu > li:last-child,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu > li:last-child {
  border-right: none;
}

/* Mega menu column headings — editorial style with accent underline */
.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu > li > a,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu > li > a {
  font-weight: 700;
  font-size: 13px;
  color: #111;
  border-bottom: 2px solid var(--edu-accent);
  padding: 0 0 10px;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu > li > a:hover,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu > li > a:hover {
  padding-left: 0;
  background: transparent;
  color: var(--edu-accent);
}

.edu-navbar .horizontal-menu > li.mega-menu > .sub-menu > li > a::before,
.edu-navbar .horizontal-menu > li.mega-menu-column > .sub-menu > li > a::before {
  display: none;
}

/* Mega menu sub-items — clean vertical list */
.edu-navbar .mega-menu .sub-menu .sub-menu {
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  box-shadow: none;
  border: none;
  border-top: none;
  padding: 0;
  min-width: auto;
}

.edu-navbar .mega-menu .sub-menu .sub-menu a {
  padding: 7px 0;
  border-bottom: none;
  font-size: 13px;
  color: #555;
}

.edu-navbar .mega-menu .sub-menu .sub-menu a::before {
  display: none;
}

.edu-navbar .mega-menu .sub-menu .sub-menu a:hover {
  transform: translateX(4px);
  color: var(--edu-accent);
  background: transparent;
}

/* ── Navbar CTA Button — Newspaper Momentum style pill ─────── */
/* Reference: Demo 4 — filled accent button with 8px radius,
   prominent placement at right end of nav bar. */
.edu-navbar-cta {
  flex-shrink: 0;
  padding: 0;
  display: flex;
  align-items: center;
  height: 48px;
}

.edu-navbar-cta .edu-cta-btn {
  padding: 9px 22px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 6px;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  box-shadow: 0 2px 8px rgba(255, 2, 127, 0.3);
  transition: all 0.2s ease;
}

.edu-navbar-cta .edu-cta-btn:hover {
  box-shadow: 0 4px 16px rgba(255, 2, 127, 0.4);
  transform: translateY(-1px);
}

/* ── Mobile User Section in Nav Panel ───────────────────────── */
.edu-mobile-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 30px;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
}

.edu-mobile-user img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

.edu-mobile-user-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.edu-mobile-user-info strong {
  font-size: 14px;
  color: #111;
  font-family: 'Poppins', sans-serif;
}

.edu-mobile-user-info a {
  font-size: 12px;
  color: var(--edu-accent);
  text-decoration: none;
}

.edu-mobile-cta {
  padding: 12px 30px;
}

/* ── Mobile Auth Buttons (Login/Register in nav panel for logged-out users) ── */
.edu-mobile-auth {
  display: flex;
  gap: 10px;
  padding: 16px 30px;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
}

.edu-mobile-auth-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 1;
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
}

.edu-mobile-login-btn {
  background: var(--edu-accent, #e8a924);
  color: #fff;
}

.edu-mobile-login-btn:hover {
  opacity: 0.9;
  color: #fff;
}

.edu-mobile-register-btn {
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #e2e8f0;
}

.edu-mobile-register-btn:hover {
  background: #e2e8f0;
  color: #334155;
}

/* ── Classic Header — Mobile Toggle ─────────────────────────── */
.header-classic-mobile-toggle {
  display: none;
}

/* Hamburger button styling — Newspaper Pro clean 3-bar style */
.header-classic-mobile-toggle .open-hidden-menu {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 38px;
}

.header-classic-mobile-toggle .open-hidden-menu span {
  display: block;
  width: 22px;
  height: 2px;
  background: #333;
  border-radius: 2px;
  transition: all 0.25s ease;
}

/* Ensure hamburger lines are always visible — dark on light, light on dark backgrounds */
.header-sticky .header-classic-mobile-toggle .open-hidden-menu span {
  background: #333;
}

.header-classic-mobile-toggle .open-hidden-menu:hover span {
  background: var(--edu-accent);
}

@media (max-width: 960px) {
  .header-classic-mobile-toggle {
    display: flex;
  }

  .edu-navbar {
    display: none;
  }

  .edu-header-search {
    display: none;
  }

  .edu-search-toggle {
    display: flex;
  }

  .edu-topbar-btn-text {
    display: none;
  }

  .edu-topbar-btn {
    padding: 8px 6px;
  }

  /* Logo row: more compact on mobile */
  .header-classic-wrapper.edu-main-header {
    padding: 12px 16px;
    gap: 12px;
  }

  .header-classic-logo.edu-logo img {
    max-height: 40px;
  }

  .header-classic-logo.edu-logo .site-title-text {
    font-size: 20px;
  }

  /* Ensure logo can shrink on mobile */
  .header-classic-logo.edu-logo {
    flex: 0 1 auto !important;
    min-width: 0;
    overflow: hidden;
  }

  /* Hide editorial border on mobile */
  .edu-main-header::after {
    display: none;
  }
}

@media (min-width: 961px) {
  .header-classic-mobile-toggle {
    display: none;
  }
}

/* ── CTA Button (reusable) ───────────────────────────────────── */
.edu-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--edu-accent);
  color: #fff;
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: var(--edu-transition);
  white-space: nowrap;
}

.edu-cta-btn:hover {
  background: var(--edu-accent-hover);
  color: #fff;
  transform: translateY(-1px);
}

.edu-cta-btn-full {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 12px 20px;
}

/* ── Nav Panel Education Additions ────────────────────────────── */
/* User section inside the slide-in nav panel */
.edu-nav-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 30px;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
}

.edu-nav-user img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

.edu-nav-user-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.edu-nav-user-info strong {
  font-size: 14px;
  color: #111;
  font-family: 'Poppins', sans-serif;
}

.edu-nav-user-info a {
  font-size: 12px;
  color: var(--edu-accent);
  text-decoration: none;
}

.edu-nav-auth {
  display: flex;
  gap: 8px;
  padding: 12px 30px;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
}

.edu-nav-auth a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  font-family: 'Poppins', sans-serif;
  text-decoration: none;
  border-radius: 4px;
  transition: var(--edu-transition);
}

.edu-nav-auth .edu-nav-login {
  color: #111;
  border: 1px solid #e8e8e8;
}

.edu-nav-auth .edu-nav-login:hover {
  background: #f5f5f5;
}

.edu-nav-auth .edu-nav-register {
  background: var(--edu-accent);
  color: #fff;
  border: 1px solid var(--edu-accent);
}

.edu-nav-auth .edu-nav-register:hover {
  background: var(--edu-accent-hover);
}

.edu-nav-cta {
  padding: 12px 30px;
}

/* Dashboard icon in header-right top-bar-right */
.header-icon.edu-dashboard-icon a {
  color: #111;
  font-size: 16px;
  transition: var(--edu-transition);
}

.header-icon.edu-dashboard-icon a:hover {
  color: var(--edu-accent);
}

/* ── Trust Bar ────────────────────────────────────────────────── */
.edu-trust-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  padding: 12px 20px;
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius-lg);
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.edu-trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--edu-text-secondary);
  white-space: nowrap;
}

.edu-trust-item i {
  color: var(--edu-accent);
  font-size: 16px;
}

.edu-trust-item strong {
  color: var(--edu-text);
  font-weight: 700;
}

/* ── Homepage Template Layout ────────────────────────────────── */
.edu-home-layout {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 24px;
}

.edu-home-main {
  min-width: 0;
}

.edu-home-sidebar {
  min-width: 0;
}

/* Hide page titles on pages using shortcodes or Elementor content */
.edu-shortcode-wrap .entry-title,
.page .entry-title,
.page .page-title {
  display: none;
}

/* Home/front page: show only topbar, hide main header row */
body.home .header-classic-wrapper.edu-main-header,
body.home .header-ad-banner {
  display: none;
}

/* Adjust sticky header on home — don't show main header on scroll either */
body.home.header-sticky .header-classic-wrapper.edu-main-header {
  display: none !important;
}

/* WooCommerce product thumbnails — contain, not crop */
.woocommerce img,
.woocommerce-page img.attachment-woocommerce_thumbnail,
.woocommerce-page img.attachment-shop_catalog,
.woocommerce ul.products li.product img,
.woocommerce-cart .product-thumbnail img,
.woocommerce-checkout img,
.woocommerce table.shop_table img,
.woocommerce .woocommerce-checkout-review-order img,
.woocommerce .woocommerce-checkout-review-order-table img,
.wc-block-components-product-image img,
.wc-block-cart-items img {
  object-fit: contain !important;
  background: #fff;
}

/* ── Featured Exams Section ───────────────────────────────────── */
.edu-section {
  margin: 16px 0;
}

.edu-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--edu-primary);
}

.edu-section-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--edu-primary);
  margin: 0;
}

.edu-section-header .edu-view-all {
  font-size: 13px;
  color: var(--edu-accent);
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.edu-section-header .edu-view-all:hover {
  color: var(--edu-accent-hover);
}

/* Exam Cards Grid */
.edu-exam-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.edu-exam-card {
  background: var(--edu-card);
  border-radius: var(--edu-radius-lg);
  border: 1px solid var(--edu-border);
  padding: 20px;
  transition: var(--edu-transition);
  text-decoration: none;
  color: var(--edu-text);
  display: flex;
  flex-direction: column;
}

.edu-exam-card:hover {
  box-shadow: var(--edu-shadow-lg);
  border-color: var(--edu-accent);
  transform: translateY(-2px);
}

.edu-exam-card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--edu-text);
  margin: 0 0 8px;
  line-height: 1.4;
}

.edu-exam-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.edu-exam-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
  background: var(--edu-bg);
  color: var(--edu-text-secondary);
}

.edu-exam-badge-premium {
  background: #fef3c7;
  color: #92400e;
}

.edu-exam-badge-free {
  background: #d1fae5;
  color: #065f46;
}

.edu-exam-card-stats {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--edu-text-secondary);
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--edu-border);
}

.edu-exam-card-stats span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.edu-exam-card-cta {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  color: var(--edu-accent);
  font-weight: 600;
  font-size: 12px;
  gap: 4px;
}

/* ── Subject Explorer Grid ────────────────────────────────────── */
.edu-subjects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}

.edu-subject-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 12px;
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius);
  text-decoration: none;
  color: var(--edu-text);
  transition: var(--edu-transition);
  text-align: center;
}

.edu-subject-tile:hover {
  border-color: var(--edu-accent);
  box-shadow: var(--edu-shadow-md);
  transform: translateY(-2px);
}

.edu-subject-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--edu-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  font-size: 18px;
  color: var(--edu-primary);
}

.edu-subject-name {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 2px;
}

.edu-subject-count {
  font-size: 11px;
  color: var(--edu-text-secondary);
}

/* ── How It Works Steps ─────────────────────────────────────── */
.edu-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.edu-step-card {
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius-lg);
  padding: 20px 16px;
  text-align: center;
  position: relative;
  transition: var(--edu-transition);
}

.edu-step-card:hover {
  box-shadow: var(--edu-shadow-lg);
  border-color: var(--edu-accent);
  transform: translateY(-3px);
}

.edu-step-number {
  position: absolute;
  top: -12px;
  left: 20px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--edu-accent);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.edu-step-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--edu-primary), var(--edu-primary-light));
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  font-size: 22px;
  color: #fff;
}

.edu-step-card h4 {
  font-size: 16px;
  font-weight: 700;
  color: var(--edu-text);
  margin: 0 0 8px;
}

.edu-step-card p {
  font-size: 13px;
  color: var(--edu-text-secondary);
  line-height: 1.6;
  margin: 0;
}

/* ── Newsletter Section ───────────────────────────────────────── */
.edu-newsletter {
  background: linear-gradient(135deg, var(--edu-primary), var(--edu-primary-light));
  color: #fff;
  padding: 28px 24px;
  border-radius: var(--edu-radius-lg);
  text-align: center;
  margin: 16px 0 0;
}

.edu-newsletter h3 {
  font-size: 22px;
  margin: 0 0 8px;
  color: #fff;
}

.edu-newsletter p {
  margin: 0 0 20px;
  opacity: 0.85;
  font-size: 14px;
}

.edu-newsletter-form {
  display: flex;
  max-width: 460px;
  margin: 0 auto;
  gap: 0;
}

.edu-newsletter-form input[type="email"] {
  flex: 1;
  padding: 12px 18px;
  border: 2px solid rgba(255,255,255,0.3);
  border-right: none;
  border-radius: 50px 0 0 50px;
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 14px;
  outline: none;
}

.edu-newsletter-form input[type="email"]::placeholder {
  color: rgba(255,255,255,0.6);
}

.edu-newsletter-form button {
  padding: 12px 24px;
  background: var(--edu-accent);
  color: #fff;
  border: none;
  border-radius: 0 50px 50px 0;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: var(--edu-transition);
}

.edu-newsletter-form button:hover {
  background: var(--edu-accent-hover);
}

/* ── Sidebar Widgets ──────────────────────────────────────────── */
.edu-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.edu-widget {
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius-lg);
  padding: 16px;
}

.edu-widget-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--edu-primary);
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--edu-accent);
}

/* Trending Tests Widget */
.edu-trending-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.edu-trending-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--edu-border);
  list-style: none;
  margin: 0;
}

.edu-trending-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.edu-trending-rank {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--edu-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--edu-primary);
  flex-shrink: 0;
}

.edu-trending-rank.rank-1 { background: #fef3c7; color: #92400e; }
.edu-trending-rank.rank-2 { background: #e5e7eb; color: #374151; }
.edu-trending-rank.rank-3 { background: #fed7aa; color: #9a3412; }

.edu-trending-info {
  flex: 1;
  min-width: 0;
}

.edu-trending-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--edu-text);
  text-decoration: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.edu-trending-title:hover {
  color: var(--edu-accent);
}

.edu-trending-attempts {
  font-size: 11px;
  color: var(--edu-text-secondary);
}

/* Leaderboard Widget */
.edu-leaderboard-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.edu-leaderboard-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--edu-border);
  list-style: none;
  margin: 0;
}

.edu-leaderboard-item:last-child {
  border-bottom: none;
}

.edu-leaderboard-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

.edu-leaderboard-name {
  flex: 1;
  font-size: 13px;
  font-weight: 500;
  color: var(--edu-text);
}

.edu-leaderboard-score {
  font-size: 12px;
  font-weight: 700;
  color: var(--edu-success);
}

/* Subject Filter Widget */
.edu-filter-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.edu-filter-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  margin: 0;
}

.edu-filter-item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 8px 0;
  text-decoration: none;
  color: var(--edu-text);
  font-size: 13px;
  border-bottom: 1px solid var(--edu-border);
  transition: var(--edu-transition);
}

.edu-filter-item:last-child a {
  border-bottom: none;
}

.edu-filter-item a:hover {
  color: var(--edu-accent);
}

.edu-filter-count {
  background: var(--edu-bg);
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 500;
  color: var(--edu-text-secondary);
}

/* Sticky CTA Widget */
.edu-sticky-cta {
  background: linear-gradient(135deg, var(--edu-primary), var(--edu-primary-light));
  color: #fff;
  border: none;
  text-align: center;
  position: sticky;
  top: 100px;
}

.edu-sticky-cta .edu-widget-title {
  color: #fff;
  border-bottom-color: rgba(255,255,255,0.3);
}

.edu-sticky-cta-price {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 4px;
}

.edu-sticky-cta-period {
  font-size: 13px;
  opacity: 0.7;
  margin-bottom: 16px;
}

.edu-sticky-cta-features {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  text-align: left;
}

.edu-sticky-cta-features li {
  padding: 6px 0;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
}

.edu-sticky-cta-features li::before {
  content: '\f00c';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  color: var(--edu-success);
  font-size: 12px;
}

.edu-sticky-cta .edu-cta-btn {
  width: 100%;
  justify-content: center;
  padding: 12px;
  box-sizing: border-box;
}

/* ── Education Footer Links Row ──────────────────────────────── */
/* Compact row of education links shown above the Anymag footer */
.edu-footer-links-row {
  background: #f5f5f5;
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
  padding: 14px 5%;
  text-align: center;
}

.edu-footer-links-row ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px 24px;
}

.edu-footer-links-row li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.edu-footer-links-row a {
  font-size: 13px;
  font-weight: 500;
  color: #555;
  text-decoration: none;
  transition: var(--edu-transition);
}

.edu-footer-links-row a:hover {
  color: var(--edu-accent);
}

/* Newsletter in footer (compact version) */
.edu-footer-newsletter {
  padding: 24px 5%;
  text-align: center;
  background: #fafafa;
  border-bottom: 1px solid #e8e8e8;
}

.edu-footer-newsletter h4 {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 6px;
  color: #111;
}

.edu-footer-newsletter p {
  font-size: 13px;
  color: #787878;
  margin: 0 0 14px;
}

.edu-footer-newsletter form {
  display: flex;
  max-width: 420px;
  margin: 0 auto;
  gap: 0;
}

.edu-footer-newsletter input[type="email"] {
  flex: 1;
  padding: 10px 16px;
  border: 1px solid #e8e8e8;
  border-right: none;
  border-radius: 4px 0 0 4px;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  outline: none;
  color: #444;
}

.edu-footer-newsletter input[type="email"]:focus {
  border-color: var(--edu-accent);
}

.edu-footer-newsletter button {
  padding: 10px 20px;
  background: var(--edu-accent);
  color: #fff;
  border: none;
  border-radius: 0 4px 4px 0;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
  transition: var(--edu-transition);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.edu-footer-newsletter button:hover {
  background: var(--edu-accent-hover);
}

/* ── Footer Mega Menu ────────────────────────────────────────── */
.footer-mega-menu {
  background: #1a1a2e;
  padding: 50px 0 40px;
}

.footer-mega-grid {
  display: grid;
  gap: 30px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
}

.footer-mega-cols-2 { grid-template-columns: repeat(2, 1fr); }
.footer-mega-cols-3 { grid-template-columns: repeat(3, 1fr); }
.footer-mega-cols-4 { grid-template-columns: repeat(4, 1fr); }

.footer-mega-title {
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.12);
  font-family: 'Poppins', sans-serif;
}

.footer-mega-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-mega-links li {
  list-style: none;
  margin: 0;
  padding: 0;
}

#footer .footer-mega-links a {
  display: block;
  color: #a0aec0;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.4;
  padding: 6px 0;
  transition: color 0.2s ease, transform 0.2s ease;
}

#footer .footer-mega-links a:hover {
  color: #ffffff;
  transform: translateX(6px);
}

/* Responsive */
@media (max-width: 1024px) {
  .footer-mega-cols-3,
  .footer-mega-cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .footer-mega-cols-2,
  .footer-mega-cols-3,
  .footer-mega-cols-4 {
    grid-template-columns: 1fr;
  }
  .footer-mega-col {
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  .footer-mega-col:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
}

@media (max-width: 600px) {
  .footer-mega-menu {
    padding: 30px 0 20px;
  }
}

/* Dark mode */
body.dark-mode .footer-mega-menu {
  background: #0d0d1a;
}

body.dark-mode .footer-mega-title {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* ── Ad Zone ─────────────────────────────────────────────────── */
.edu-ad-zone {
  max-width: var(--edu-container);
  margin: 10px auto;
  padding: 0 20px;
  text-align: center;
}

/* ── WooCommerce Product Page Fix ─────────────────────────────── */
/* Only scope to pages actually using the education layout */
.content-area div.product > .magcontent {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

/* ── Responsive ───────────────────────────────────────────────── */

/* Laptop */
@media (max-width: 1280px) {
  .edu-home-layout {
    grid-template-columns: 1fr 280px;
  }

  .edu-subjects-grid {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  }
}

/* Tablet */
@media (max-width: 1024px) {
  .edu-home-layout {
    grid-template-columns: 1fr;
  }

  .edu-home-sidebar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .edu-steps-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .edu-exam-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .edu-subjects-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .edu-section-header h2 {
    font-size: 18px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .edu-trust-bar {
    gap: 12px;
    padding: 12px 16px;
    flex-direction: column;
  }

  .edu-trust-item {
    font-size: 12px;
    justify-content: center;
  }

  .edu-exam-grid {
    grid-template-columns: 1fr;
  }

  .edu-subjects-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .edu-subject-tile {
    padding: 14px 8px;
  }

  .edu-subject-icon {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .edu-steps-grid {
    grid-template-columns: 1fr;
  }

  .edu-home-sidebar {
    grid-template-columns: 1fr;
  }

  .edu-newsletter {
    padding: 24px 16px;
    margin: 24px 0;
  }

  .edu-newsletter h3 {
    font-size: 18px;
  }

  .edu-newsletter-form {
    flex-direction: column;
    gap: 8px;
  }

  .edu-newsletter-form input[type="email"] {
    border-radius: 50px;
    border-right: 2px solid rgba(255,255,255,0.3);
  }

  .edu-newsletter-form button {
    border-radius: 50px;
  }

  .edu-home-layout {
    padding: 12px;
  }

  .edu-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .edu-footer-newsletter form {
    flex-direction: column;
    gap: 8px;
  }

  .edu-footer-newsletter input[type="email"] {
    border-radius: 4px;
    border-right: 1px solid #e8e8e8;
  }

  .edu-footer-newsletter button {
    border-radius: 4px;
  }

  .edu-cta-btn-full {
    padding: 14px 20px;
    font-size: 15px;
  }

  .edu-nav-cta {
    padding: 12px 20px;
  }
}

/* Small mobile */
@media (max-width: 480px) {
  .edu-subjects-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .edu-exam-card {
    padding: 14px;
  }

  .edu-exam-card-title {
    font-size: 14px;
  }

  .edu-widget {
    padding: 12px;
  }

  .edu-widget-title {
    font-size: 14px;
  }

  .edu-section-header h2 {
    font-size: 16px;
  }

  .edu-step-card {
    padding: 16px 12px;
  }

  .edu-step-icon {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }
}

/* ══════════════════════════════════════════════════════════════════
   SHARED EDUCATION HEADER COMPONENTS
   Styles for edu-header-user and edu-header-cta in alternate headers
   ══════════════════════════════════════════════════════════════════ */

/* ── Compact Header Bar Components ──────────────────────────────── */
.edu-header-user-inline {
  display: flex;
  align-items: center;
  margin-left: 6px;
}

.edu-header-user-inline img {
  border-radius: 50%;
  width: 28px;
  height: 28px;
  object-fit: cover;
  display: block;
}

.edu-header-user-inline .edu-user-link {
  display: flex;
  align-items: center;
  transition: var(--edu-transition);
  opacity: 0.85;
}

.edu-header-user-inline .edu-user-link:hover {
  opacity: 1;
}

.edu-header-user-inline .edu-login-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: #555;
  font-size: 14px;
  transition: var(--edu-transition);
}

.edu-header-user-inline .edu-login-link:hover {
  color: var(--edu-accent);
  background: rgba(0,0,0,0.04);
}

.edu-header-cta-inline {
  display: flex;
  align-items: center;
  margin-left: 8px;
}

.edu-cta-btn-sm {
  padding: 6px 14px;
  font-size: 12px;
  border-radius: 50px;
}

/* ── Header Centered: Right actions group ─────────────────────── */
.header-centered-right {
  display: flex;
  align-items: center;
  gap: 6px;
}

.header-centered-type .edu-header-cta-inline {
  margin-left: 4px;
}

/* ── Header Topbar: Edu components ────────────────────────────── */
.header-topbar-type .edu-header-user-inline {
  margin-left: 4px;
}

.header-topbar-type .edu-header-cta-inline {
  margin-left: 4px;
}

/* ── Header Split: Edu components ─────────────────────────────── */
.header-split-type .edu-header-user-inline {
  margin-left: 4px;
}

/* ── Header Overlay: Edu components ───────────────────────────── */
.header-overlay-type .edu-header-user-inline {
  margin-left: 4px;
}

.header-overlay-type .edu-header-cta-inline {
  margin-left: 6px;
}

/* Overlay fullscreen nav - CTA positioning */
.overlay-fullscreen-nav .edu-nav-cta {
  padding: 20px 40px;
}

/* ══════════════════════════════════════════════════════════════════
   FOOTER VARIANT: MAGAZINE
   Newsletter banner + 4-column grid + bottom bar
   ══════════════════════════════════════════════════════════════════ */

/* ── Newsletter Banner ─────────────────────────────────────────── */
.footer-mag-newsletter {
  background: var(--edu-primary, #111111);
  color: #fff;
  padding: 0;
}

.footer-mag-newsletter-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 0;
}

.footer-mag-newsletter-text h4 {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #fff;
  font-family: 'Poppins', sans-serif;
}

.footer-mag-newsletter-text p {
  font-size: 13px;
  margin: 0;
  opacity: 0.75;
}

.footer-mag-newsletter-form {
  display: flex;
  gap: 0;
  flex-shrink: 0;
}

.footer-mag-newsletter-form input[type="email"] {
  padding: 10px 16px;
  border: 2px solid rgba(255,255,255,0.2);
  border-right: none;
  border-radius: 4px 0 0 4px;
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  width: 220px;
  outline: none;
}

.footer-mag-newsletter-form input[type="email"]::placeholder {
  color: rgba(255,255,255,0.5);
}

.footer-mag-newsletter-form input[type="email"]:focus {
  border-color: var(--edu-accent);
}

.footer-mag-newsletter-form button {
  padding: 10px 20px;
  background: var(--edu-accent);
  color: #fff;
  border: none;
  border-radius: 0 4px 4px 0;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
  transition: var(--edu-transition);
  white-space: nowrap;
}

.footer-mag-newsletter-form button:hover {
  background: var(--edu-accent-hover);
}

/* ── Magazine Footer Grid ──────────────────────────────────────── */
.footer-magazine {
  background: #1a1a1a;
  color: #c5c5c5;
  padding: 48px 0 0;
}

.footer-mag-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 36px;
}

.footer-mag-about .footer-logo {
  margin-bottom: 14px;
}

.footer-mag-about .footer-logo a {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
}

.footer-mag-about .footer-logo img {
  max-height: 36px;
  width: auto;
  filter: var(--footer-logo-filter, brightness(0) invert(1));
}

.footer-mag-tagline {
  font-size: 13px;
  line-height: 1.7;
  color: #999;
  margin: 0 0 16px;
}

.footer-mag-social {
  display: flex;
  gap: 8px;
}

.footer-mag-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  color: #ccc;
  font-size: 13px;
  transition: var(--edu-transition);
  text-decoration: none;
}

.footer-mag-social a span {
  display: none;
}

.footer-mag-social a:hover {
  background: var(--edu-accent);
  color: #fff;
}

.footer-mag-heading {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 18px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--edu-accent);
  font-family: 'Poppins', sans-serif;
}

.footer-mag-links,
ul.footer-mag-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-mag-links li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-mag-links a {
  display: block;
  padding: 5px 0;
  color: #aaa;
  font-size: 13px;
  text-decoration: none;
  transition: var(--edu-transition);
}

.footer-mag-links a:hover {
  color: #fff;
  transform: translateX(4px);
}

/* Latest Posts in column 4 */
.footer-mag-post {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.footer-mag-post:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.footer-mag-post a {
  display: block;
  color: #ccc;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  line-height: 1.5;
  transition: var(--edu-transition);
}

.footer-mag-post a:hover {
  color: var(--edu-accent);
}

.footer-mag-date {
  display: block;
  font-size: 11px;
  color: #777;
  margin-top: 4px;
}

/* ── Magazine Footer Bottom Bar ────────────────────────────────── */
.footer-mag-bottom {
  background: #111;
  padding: 16px 0;
  margin-top: 36px;
}

.footer-mag-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.footer-mag-bottom #footer-copyright {
  font-size: 12px;
  color: #777;
}

.footer-mag-bottom-menu,
ul.footer-mag-bottom-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 16px;
}

.footer-mag-bottom-menu li {
  list-style: none;
  margin: 0;
}

.footer-mag-bottom-menu a {
  font-size: 12px;
  color: #777;
  text-decoration: none;
  transition: var(--edu-transition);
}

.footer-mag-bottom-menu a:hover {
  color: #fff;
}

/* ══════════════════════════════════════════════════════════════════
   FOOTER VARIANT: EDUCATION
   Trust bar + 4-column grid + education links + bottom bar
   ══════════════════════════════════════════════════════════════════ */

/* ── Trust Bar ─────────────────────────────────────────────────── */
.footer-edu-trust {
  background: var(--brand-primary, var(--edu-accent, #ff027f));
  color: #fff;
  padding: 20px 0;
}

.footer-edu-trust-inner {
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 20px;
  flex-wrap: wrap;
}

.footer-edu-trust-item {
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
}

.footer-edu-trust-item i {
  font-size: 24px;
  opacity: 0.9;
}

.footer-edu-trust-item strong {
  display: block;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  font-family: 'Poppins', sans-serif;
}

.footer-edu-trust-item span {
  display: block;
  font-size: 12px;
  opacity: 0.85;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ── Education Footer Grid ─────────────────────────────────────── */
/* Use #footer ID to override the base theme's #footer { background: #fafafa } */
.footer-education,
#footer.footer-education {
  background: var(--anymag-footer-bg, #1a1a1a) !important;
  color: #c5c5c5 !important;
  padding: 48px 0 0;
}

/* Override base theme's #footer a color and container width */
#footer.footer-education a {
  color: #aaa;
}

#footer.footer-education a:hover {
  color: #fff !important;
}

#footer.footer-education .container {
  max-width: var(--edu-container);
}

.footer-edu-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 36px;
}

.footer-edu-about .footer-logo {
  margin-bottom: 14px;
}

.footer-edu-about .footer-logo a {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
}

.footer-edu-about .footer-logo img {
  max-height: 36px;
  width: auto;
  filter: var(--footer-logo-filter, brightness(0) invert(1));
}

.footer-edu-tagline {
  font-size: 13px;
  line-height: 1.7;
  color: #999;
  margin: 0 0 16px;
}

.footer-edu-social {
  display: flex;
  gap: 8px;
}

.footer-edu-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  color: #ccc;
  font-size: 13px;
  transition: var(--edu-transition);
  text-decoration: none;
}

.footer-edu-social a span {
  display: none;
}

.footer-edu-social a:hover {
  background: var(--edu-accent);
  color: #fff;
}

.footer-edu-heading {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 18px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--edu-accent);
  font-family: 'Poppins', sans-serif;
}

.footer-edu-links,
ul.footer-edu-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-edu-links li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-edu-links a {
  display: block;
  padding: 5px 0;
  color: #aaa;
  font-size: 13px;
  text-decoration: none;
  transition: var(--edu-transition);
}

.footer-edu-links a:hover {
  color: #fff;
  transform: translateX(4px);
}

/* wp_nav_menu() wrapper reset inside education footer */
.footer-education .menu-education-footer-menu-container,
.footer-education [class*="menu-"][class*="-container"] {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

.footer-education .footer-edu-links.menu,
.footer-education .footer-menu,
.footer-education [class*="menu-"][class*="-container"] ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

.footer-education .footer-edu-links.menu li,
.footer-education .footer-menu li,
.footer-education [class*="menu-"][class*="-container"] ul li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.footer-education .footer-edu-links.menu a,
.footer-education .footer-menu a,
.footer-education [class*="menu-"][class*="-container"] ul a {
  display: block;
  padding: 5px 0 !important;
  color: #aaa !important;
  font-size: 13px;
  text-decoration: none;
  background: transparent !important;
  transition: var(--edu-transition);
}

.footer-education .footer-edu-links.menu a:hover,
.footer-education .footer-menu a:hover,
.footer-education [class*="menu-"][class*="-container"] ul a:hover {
  color: #fff !important;
  padding-left: 4px !important;
  background: transparent !important;
}

/* ── Max Mega Menu Plugin Override in Education Footer ────────── */
/* The plugin applies a green gradient background to its wrapper */
.footer-education .mega-menu-wrap,
.footer-education #mega-menu-wrap-footer-menu,
#footer.footer-education .mega-menu-wrap,
#footer.footer-education #mega-menu-wrap-footer-menu {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.footer-education .mega-menu-wrap .mega-menu-toggle,
#footer.footer-education .mega-menu-toggle {
  display: none !important;
}

.footer-education .mega-menu-wrap ul.mega-menu,
#footer.footer-education ul.mega-menu {
  display: block !important;
  background: transparent !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.footer-education .mega-menu-wrap li.mega-menu-item,
#footer.footer-education li.mega-menu-item {
  display: block !important;
  float: none !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.footer-education .mega-menu-wrap li.mega-menu-item > a.mega-menu-link,
#footer.footer-education li.mega-menu-item > a.mega-menu-link {
  display: block !important;
  padding: 5px 0 !important;
  color: #aaa !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  line-height: 1.6 !important;
  text-transform: none !important;
  transition: color 0.2s ease, padding-left 0.2s ease !important;
}

.footer-education .mega-menu-wrap li.mega-menu-item > a.mega-menu-link:hover,
#footer.footer-education li.mega-menu-item > a.mega-menu-link:hover {
  color: #fff !important;
  padding-left: 4px !important;
  background: transparent !important;
}

/* ── Education Footer Newsletter ───────────────────────────────── */
.footer-edu-newsletter-desc {
  font-size: 13px;
  color: #999;
  margin: 0 0 14px;
  line-height: 1.6;
}

.footer-edu-newsletter-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.footer-edu-newsletter-form input[type="email"] {
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 4px;
  background: rgba(255,255,255,0.06);
  color: #fff;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  outline: none;
}

.footer-edu-newsletter-form input[type="email"]::placeholder {
  color: rgba(255,255,255,0.4);
}

.footer-edu-newsletter-form input[type="email"]:focus {
  border-color: var(--edu-accent);
}

.footer-edu-newsletter-form button {
  padding: 10px 16px;
  background: var(--edu-accent);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
  transition: var(--edu-transition);
}

.footer-edu-newsletter-form button:hover {
  background: var(--edu-accent-hover);
}

/* ── Education Links Row ───────────────────────────────────────── */
.footer-edu-links-row {
  background: rgba(255,255,255,0.04);
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 14px 0;
}

.footer-edu-links-row ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px 24px;
}

.footer-edu-links-row li {
  list-style: none;
  margin: 0;
}

.footer-edu-links-row a {
  font-size: 12px;
  font-weight: 500;
  color: #888;
  text-decoration: none;
  transition: var(--edu-transition);
}

.footer-edu-links-row a:hover {
  color: #fff;
}

/* ── Education Footer Bottom Bar ───────────────────────────────── */
.footer-edu-bottom {
  background: #111;
  padding: 16px 0;
  margin-top: 36px;
}

.footer-edu-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.footer-edu-bottom #footer-copyright {
  font-size: 12px;
  color: #777;
}

.footer-edu-bottom #footer-disclaimer {
  font-size: 11px;
  color: #666;
  opacity: 0.8;
}


/* ══════════════════════════════════════════════════════════════════
   RESPONSIVE — FOOTER VARIANTS & HEADER EDUCATION COMPONENTS
   ══════════════════════════════════════════════════════════════════ */

/* Tablet */
@media (max-width: 1024px) {
  .footer-mag-grid,
  .footer-edu-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
  }

  .footer-mag-newsletter-inner {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }

  .footer-mag-newsletter-form {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
  }

  .footer-mag-newsletter-form input[type="email"] {
    flex: 1;
    width: auto;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .footer-mag-grid,
  .footer-edu-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .footer-edu-trust-inner {
    flex-direction: column;
    gap: 16px;
  }

  .footer-edu-trust-item strong {
    font-size: 18px;
  }

  .footer-mag-bottom-inner,
  .footer-edu-bottom-inner {
    flex-direction: column;
    text-align: center;
    gap: 8px;
  }

  .footer-mag-bottom-menu {
    justify-content: center;
  }

  .footer-edu-newsletter-form {
    flex-direction: column;
  }

  .footer-mag-newsletter-form {
    flex-direction: column;
    gap: 8px;
  }

  .footer-mag-newsletter-form input[type="email"] {
    border-radius: 4px;
    border-right: 2px solid rgba(255,255,255,0.2);
    width: 100%;
  }

  .footer-mag-newsletter-form button {
    border-radius: 4px;
  }

  /* Hide compact header edu components on mobile (shown in nav panel instead) */
  .edu-header-cta-inline,
  .edu-header-user-inline {
    display: none;
  }
}

/* Small mobile */
@media (max-width: 480px) {
  .footer-edu-trust-item {
    justify-content: center;
    text-align: center;
  }

  .footer-mag-social,
  .footer-edu-social {
    justify-content: center;
  }

  .footer-mag-about,
  .footer-edu-about {
    text-align: center;
  }

  .footer-mag-tagline,
  .footer-edu-tagline {
    text-align: center;
  }
}


/* ── Dark Mode Overrides (content components only) ────────────── */
body.dark-mode {
  --edu-bg: #1a1a2e;
  --edu-card: #16213e;
  --edu-text: #e2e8f0;
  --edu-text-secondary: #a0aec0;
  --edu-border: #2d3748;
}

/* Dark mode: footer variants inherit dark bg already, just tweak borders */
body.dark-mode .footer-mag-newsletter,
body.dark-mode .footer-edu-trust {
  background: var(--edu-accent);
}

body.dark-mode .footer-magazine,
body.dark-mode .footer-education {
  background: #0f0f1a;
}

body.dark-mode .footer-mag-bottom,
body.dark-mode .footer-edu-bottom {
  background: #0a0a12;
}

body.dark-mode .footer-mag-heading,
body.dark-mode .footer-edu-heading {
  color: #e2e8f0;
}

body.dark-mode .footer-mag-links a,
body.dark-mode .footer-edu-links a {
  color: #a0aec0;
}

body.dark-mode .footer-mag-links a:hover,
body.dark-mode .footer-edu-links a:hover {
  color: #fff;
}

body.dark-mode .edu-header-user-inline .edu-login-link {
  color: #a0aec0;
}

body.dark-mode .edu-header-user-inline .edu-login-link:hover {
  color: var(--edu-accent);
}

/* Dark mode: Classic education header */
body.dark-mode .edu-main-header {
  background: #1a1a2e;
  border-bottom-color: #2a2a3e;
}

body.dark-mode .edu-search-form {
  background: #2a2a3e;
  border-color: #3a3a4e;
}

body.dark-mode .edu-search-input {
  color: #e2e8f0;
}

body.dark-mode .edu-user-btn,
body.dark-mode .edu-cart-btn,
body.dark-mode .edu-search-toggle {
  background: #2a2a3e;
  color: #a0aec0;
}

body.dark-mode .edu-user-btn:hover,
body.dark-mode .edu-cart-btn:hover,
body.dark-mode .edu-search-toggle:hover {
  background: var(--edu-accent);
  color: #fff;
}

body.dark-mode .header-classic-logo .site-title-text {
  color: #e2e8f0;
}

/* ═══════════════════════════════════════════════════════════════
   EXAM ARCHIVE PAGE
   ═══════════════════════════════════════════════════════════════ */

.edu-exam-archive {
  max-width: 100%;
  overflow-x: hidden;
}

/* ── Archive Hero Banner ── */
.edu-archive-hero {
  background: linear-gradient(135deg, var(--edu-hero) 0%, var(--edu-hero-mid) 50%, var(--edu-hero-light) 100%);
  padding: 50px 20px 40px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.edu-archive-hero::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(255,2,127,0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.edu-archive-hero::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: -5%;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(99,102,241,0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.edu-archive-hero-inner {
  max-width: 700px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.edu-archive-title {
  color: #fff;
  font-size: 32px;
  font-weight: 800;
  margin: 0 0 10px;
  letter-spacing: -0.02em;
}
.edu-archive-subtitle {
  color: rgba(255,255,255,0.7);
  font-size: 15px;
  margin: 0 0 24px;
  line-height: 1.5;
}

/* Archive Search */
.edu-archive-search {
  display: flex;
  max-width: 520px;
  margin: 0 auto;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50px;
  overflow: hidden;
  transition: var(--edu-transition);
}
.edu-archive-search:focus-within {
  background: rgba(255,255,255,0.15);
  border-color: var(--edu-accent);
  box-shadow: 0 0 0 3px rgba(255,2,127,0.15);
}
.edu-archive-search input[type="search"] {
  flex: 1;
  border: none;
  background: transparent;
  padding: 12px 20px;
  color: #fff;
  font-size: 14px;
  outline: none;
}
.edu-archive-search input[type="search"]::placeholder {
  color: rgba(255,255,255,0.5);
}
.edu-archive-search button {
  background: var(--edu-accent);
  border: none;
  color: #fff;
  padding: 12px 20px;
  cursor: pointer;
  font-size: 14px;
  transition: var(--edu-transition);
}
.edu-archive-search button:hover {
  background: var(--edu-accent-hover);
}

/* ── Filter Bar ── */
.edu-filter-bar {
  background: var(--edu-card);
  border-bottom: 1px solid var(--edu-border);
  padding: 0 20px;
  position: sticky;
  top: 0;
  z-index: 90;
  box-shadow: var(--edu-shadow);
}
.edu-filter-inner {
  max-width: var(--edu-container);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  overflow-x: auto;
  padding: 12px 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.edu-filter-inner::-webkit-scrollbar {
  display: none;
}
.edu-filter-label {
  font-size: 13px;
  color: var(--edu-text-secondary);
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}
.edu-filter-label i {
  margin-right: 4px;
}
.edu-filter-pills {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
}
.edu-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: var(--edu-text);
  background: var(--edu-bg);
  border: 1px solid var(--edu-border);
  text-decoration: none;
  white-space: nowrap;
  transition: var(--edu-transition);
  flex-shrink: 0;
}
.edu-filter-pill:hover {
  border-color: var(--edu-accent);
  color: var(--edu-accent);
  background: rgba(255,2,127,0.05);
}
.edu-filter-pill.active {
  background: var(--edu-accent);
  color: #fff;
  border-color: var(--edu-accent);
}
.edu-pill-count {
  background: rgba(0,0,0,0.08);
  padding: 1px 6px;
  border-radius: 10px;
  font-size: 11px;
}
.edu-filter-pill.active .edu-pill-count {
  background: rgba(255,255,255,0.25);
}

/* ── Exam Grid ── */
.edu-archive-grid-wrap {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 30px 20px 50px;
}
.edu-exam-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* ── Exam Card ── */
.edu-exam-card {
  background: var(--edu-card);
  border-radius: var(--edu-radius-lg);
  border: 1px solid var(--edu-border);
  overflow: hidden;
  transition: var(--edu-transition);
}
.edu-exam-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--edu-shadow-lg);
  border-color: transparent;
}
.edu-exam-card-link {
  display: block;
  padding: 20px;
  text-decoration: none;
  color: inherit;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.edu-exam-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  gap: 8px;
}
.edu-exam-card-badge {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  background: rgba(255,2,127,0.1);
  color: var(--edu-accent);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.edu-exam-card-premium {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--edu-premium), var(--edu-premium-dark));
  color: #fff;
}
.edu-exam-card-free {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  background: rgba(39,174,96,0.1);
  color: var(--edu-success);
}
.edu-exam-card-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--edu-text);
  margin: 0 0 8px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.edu-exam-card:hover .edu-exam-card-title {
  color: var(--edu-accent);
}
.edu-exam-card-subject {
  font-size: 13px;
  color: var(--edu-text-secondary);
  margin: 0 0 auto;
  padding-bottom: 12px;
}
.edu-exam-card-subject i {
  margin-right: 4px;
  color: var(--edu-accent);
  font-size: 11px;
}
.edu-exam-card-stats {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid var(--edu-border);
  margin-bottom: 12px;
}
.edu-exam-card-stats span {
  font-size: 12px;
  color: var(--edu-text-secondary);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.edu-exam-card-stats i {
  font-size: 12px;
  color: var(--edu-accent);
}
.edu-exam-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--edu-accent);
  transition: var(--edu-transition);
}
.edu-exam-card:hover .edu-exam-card-cta {
  gap: 10px;
}
.edu-exam-card-cta i {
  font-size: 11px;
  transition: transform 0.2s ease;
}
.edu-exam-card:hover .edu-exam-card-cta i {
  transform: translateX(3px);
}

/* ── Pagination ── */
.edu-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: 40px;
  flex-wrap: wrap;
}
.edu-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: var(--edu-radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--edu-text);
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  text-decoration: none;
  transition: var(--edu-transition);
}
.edu-pagination .page-numbers:hover {
  border-color: var(--edu-accent);
  color: var(--edu-accent);
}
.edu-pagination .page-numbers.current {
  background: var(--edu-accent);
  color: #fff;
  border-color: var(--edu-accent);
}
.edu-pagination .prev,
.edu-pagination .next {
  width: auto;
  padding: 0 14px;
}

/* ── Empty State ── */
.edu-exam-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  color: var(--edu-text-secondary);
}
.edu-exam-empty i {
  font-size: 48px;
  margin-bottom: 16px;
  color: var(--edu-border);
}
.edu-exam-empty h3 {
  font-size: 20px;
  color: var(--edu-text);
  margin: 0 0 8px;
}
.edu-exam-empty p {
  font-size: 14px;
}
.edu-exam-empty a {
  color: var(--edu-accent);
  text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════
   SINGLE EXAM PAGE
   ═══════════════════════════════════════════════════════════════ */

.edu-single-exam {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 0 20px 50px;
}

/* ── Breadcrumbs ── */
.edu-breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: 16px 0;
  font-size: 13px;
  color: var(--edu-text-secondary);
}
.edu-breadcrumbs a {
  color: var(--edu-text-secondary);
  text-decoration: none;
  transition: var(--edu-transition);
}
.edu-breadcrumbs a:hover {
  color: var(--edu-accent);
}
.edu-breadcrumbs a i {
  margin-right: 3px;
}
.edu-bc-sep {
  color: var(--edu-border);
  font-size: 11px;
}
.edu-bc-current {
  color: var(--edu-text);
  font-weight: 500;
}

/* ── Exam Header Card ── */
.edu-exam-header {
  background: linear-gradient(135deg, var(--edu-hero) 0%, var(--edu-hero-mid) 50%, var(--edu-hero-light) 100%);
  border-radius: var(--edu-radius-lg);
  padding: 28px 30px;
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
}
.edu-exam-header::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -5%;
  width: 250px;
  height: 250px;
  background: radial-gradient(circle, rgba(255,2,127,0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.edu-exam-header-top {
  margin-bottom: 14px;
}
.edu-exam-header-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.edu-exam-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}
.edu-exam-badge-cat {
  background: rgba(255,2,127,0.2);
  color: #ff6baf;
}
.edu-exam-badge-sub {
  background: rgba(99,102,241,0.2);
  color: #a5b4fc;
}
.edu-exam-badge-premium {
  background: linear-gradient(135deg, var(--edu-premium), var(--edu-premium-dark));
  color: #fff;
}
.edu-exam-badge-free {
  background: rgba(39,174,96,0.2);
  color: #6ee7b7;
}
.edu-exam-badge i {
  font-size: 10px;
}
.edu-exam-title {
  color: #fff;
  font-size: 26px;
  font-weight: 800;
  margin: 0 0 18px;
  line-height: 1.25;
  letter-spacing: -0.02em;
  position: relative;
  z-index: 1;
}

/* ── Quick Stats ── */
.edu-exam-quick-stats {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.edu-exam-qs {
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,0.85);
}
.edu-exam-qs > i {
  font-size: 16px;
  color: var(--edu-accent);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.08);
  border-radius: 8px;
}
.edu-qs-value {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.edu-qs-label {
  font-size: 12px;
  color: rgba(255,255,255,0.55);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ── Exam Content Area ── */
.edu-exam-content {
  background: var(--edu-card);
  border-radius: var(--edu-radius-lg);
  border: 1px solid var(--edu-border);
  padding: 24px;
  margin-bottom: 30px;
  box-shadow: var(--edu-shadow);
}
.edu-exam-content > *:first-child {
  margin-top: 0;
}

/* ── Related Exams ── */
.edu-related-exams {
  margin-top: 10px;
}
.edu-related-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--edu-text);
  margin: 0 0 16px;
}
.edu-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.edu-related-card {
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius-lg);
  padding: 18px;
  text-decoration: none;
  color: inherit;
  transition: var(--edu-transition);
  display: flex;
  flex-direction: column;
}
.edu-related-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--edu-shadow-md);
  border-color: var(--edu-accent);
}
.edu-related-cat {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: rgba(255,2,127,0.1);
  color: var(--edu-accent);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  align-self: flex-start;
}
.edu-related-card h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--edu-text);
  margin: 0 0 auto;
  padding-bottom: 10px;
  line-height: 1.3;
}
.edu-related-card:hover h4 {
  color: var(--edu-accent);
}
.edu-related-meta {
  display: flex;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--edu-border);
  font-size: 12px;
  color: var(--edu-text-secondary);
}

/* ═══════════════════════════════════════════════════════════════
   SEARCH RESULTS PAGE (Enhanced)
   ═══════════════════════════════════════════════════════════════ */

.edu-search-page {
  max-width: 100%;
}

/* Search Hero */
.edu-search-hero {
  background: linear-gradient(135deg, var(--edu-hero) 0%, var(--edu-hero-mid) 50%, var(--edu-hero-light) 100%);
  padding: 40px 20px 30px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.edu-search-hero::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(255,2,127,0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.edu-search-hero-inner {
  max-width: 650px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.edu-search-heading {
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 6px;
}
.edu-search-heading i {
  margin-right: 8px;
  font-size: 22px;
  opacity: 0.7;
}
.edu-search-query-text {
  color: var(--edu-accent);
}
.edu-search-count {
  color: rgba(255,255,255,0.6);
  font-size: 14px;
  margin: 0 0 20px;
}

/* Search Form in Hero */
.edu-search-hero-form {
  display: flex;
  max-width: 500px;
  margin: 0 auto 16px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50px;
  overflow: hidden;
  transition: var(--edu-transition);
}
.edu-search-hero-form:focus-within {
  background: rgba(255,255,255,0.15);
  border-color: var(--edu-accent);
  box-shadow: 0 0 0 3px rgba(255,2,127,0.15);
}
.edu-search-hero-form input[type="search"] {
  flex: 1;
  border: none;
  background: transparent;
  padding: 11px 18px;
  color: #fff;
  font-size: 14px;
  outline: none;
}
.edu-search-hero-form input[type="search"]::placeholder {
  color: rgba(255,255,255,0.5);
}
.edu-search-hero-form button {
  background: var(--edu-accent);
  border: none;
  color: #fff;
  padding: 11px 18px;
  cursor: pointer;
  font-size: 14px;
  transition: var(--edu-transition);
}
.edu-search-hero-form button:hover {
  background: var(--edu-accent-hover);
}

/* Search Tabs */
.edu-search-tabs {
  display: flex;
  justify-content: center;
  gap: 4px;
}
.edu-search-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.65);
  text-decoration: none;
  transition: var(--edu-transition);
}
.edu-search-tab:hover {
  color: #fff;
  background: rgba(255,255,255,0.08);
}
.edu-search-tab.active {
  background: var(--edu-accent);
  color: #fff;
}
.edu-search-tab i {
  font-size: 12px;
}
.edu-tab-count {
  font-size: 11px;
  padding: 1px 7px;
  border-radius: 10px;
  background: rgba(255,255,255,0.15);
}
.edu-search-tab.active .edu-tab-count {
  background: rgba(255,255,255,0.25);
}

/* Search Results List */
.edu-search-results {
  max-width: var(--edu-container);
  margin: 0 auto;
  padding: 24px 20px 50px;
}
.edu-search-item {
  display: flex;
  gap: 16px;
  padding: 18px;
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: var(--edu-radius-lg);
  margin-bottom: 12px;
  transition: var(--edu-transition);
}
.edu-search-item:hover {
  border-color: var(--edu-accent);
  box-shadow: var(--edu-shadow-md);
}
.edu-search-item-thumb {
  width: 80px;
  height: 80px;
  border-radius: var(--edu-radius);
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.edu-search-item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.edu-search-item-icon {
  background: var(--edu-bg);
  border: 1px solid var(--edu-border);
}
.edu-search-item-icon i {
  font-size: 24px;
  color: var(--edu-accent);
}
.edu-search-item-body {
  flex: 1;
  min-width: 0;
}
.edu-search-item-meta-top {
  display: flex;
  gap: 8px;
  margin-bottom: 6px;
}
.edu-search-item-type {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--edu-bg);
  color: var(--edu-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.edu-search-item-cat {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: rgba(255,2,127,0.08);
  color: var(--edu-accent);
}
.edu-search-item-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 4px;
  line-height: 1.3;
}
.edu-search-item-title a {
  color: var(--edu-text);
  text-decoration: none;
}
.edu-search-item:hover .edu-search-item-title a {
  color: var(--edu-accent);
}
.edu-search-item-excerpt {
  font-size: 13px;
  color: var(--edu-text-secondary);
  margin: 0 0 8px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.edu-search-item-footer {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 12px;
  color: var(--edu-text-secondary);
}
.edu-search-item-footer i {
  margin-right: 3px;
}
.edu-search-item-link {
  margin-left: auto;
  color: var(--edu-accent);
  font-weight: 600;
  text-decoration: none;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.edu-search-item-link:hover {
  gap: 7px;
}

/* Search Empty State */
.edu-search-empty {
  text-align: center;
  padding: 60px 20px;
}
.edu-search-empty-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--edu-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.edu-search-empty-icon i {
  font-size: 32px;
  color: var(--edu-border);
}
.edu-search-empty h2 {
  font-size: 22px;
  color: var(--edu-text);
  margin: 0 0 8px;
}
.edu-search-empty p {
  font-size: 14px;
  color: var(--edu-text-secondary);
  max-width: 450px;
  margin: 0 auto 24px;
}
.edu-search-suggestions {
  margin-top: 24px;
}
.edu-search-suggestions h3 {
  font-size: 16px;
  color: var(--edu-text);
  margin: 0 0 12px;
}
.edu-search-suggest-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.edu-search-suggest-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  border-radius: 20px;
  font-size: 13px;
  color: var(--edu-text);
  text-decoration: none;
  transition: var(--edu-transition);
}
.edu-search-suggest-item:hover {
  border-color: var(--edu-accent);
  color: var(--edu-accent);
}
.edu-search-suggest-item i {
  color: var(--edu-accent);
  font-size: 12px;
}

/* Search Pagination */
.edu-search-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: 30px;
}
.edu-search-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  border-radius: var(--edu-radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--edu-text);
  background: var(--edu-card);
  border: 1px solid var(--edu-border);
  text-decoration: none;
  transition: var(--edu-transition);
}
.edu-search-pagination .page-numbers:hover {
  border-color: var(--edu-accent);
  color: var(--edu-accent);
}
.edu-search-pagination .page-numbers.current {
  background: var(--edu-accent);
  color: #fff;
  border-color: var(--edu-accent);
}

/* Search Results with Sidebar */
.edu-search-results.has-sidebar {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 30px;
  align-items: start;
}
.edu-search-results-main {
  min-width: 0;
}
.edu-search-sidebar {
  position: sticky;
  top: 20px;
}
@media (max-width: 768px) {
  .edu-search-results.has-sidebar {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════
   DARK MODE — Exam Archive, Single Exam, Search
   ═══════════════════════════════════════════════════════════════ */

/* Archive */
body.dark-mode .edu-filter-bar {
  background: #1e1e2f;
  border-bottom-color: #2a2a3e;
}
body.dark-mode .edu-filter-pill {
  background: #2a2a3e;
  border-color: #3a3a4e;
  color: #cbd5e0;
}
body.dark-mode .edu-filter-pill:hover {
  background: rgba(255,2,127,0.12);
}
body.dark-mode .edu-filter-pill.active {
  background: var(--edu-accent);
  color: #fff;
}
body.dark-mode .edu-archive-grid-wrap {
  background: transparent;
}
body.dark-mode .edu-exam-card {
  background: #1e1e2f;
  border-color: #2a2a3e;
}
body.dark-mode .edu-exam-card:hover {
  border-color: rgba(255,2,127,0.3);
}
body.dark-mode .edu-exam-card-title {
  color: #e2e8f0;
}
body.dark-mode .edu-exam-card-subject {
  color: #a0aec0;
}
body.dark-mode .edu-exam-card-stats {
  border-top-color: #2a2a3e;
}
body.dark-mode .edu-exam-card-stats span {
  color: #a0aec0;
}
body.dark-mode .edu-exam-card-badge {
  background: rgba(255,2,127,0.15);
}
body.dark-mode .edu-exam-card-free {
  background: rgba(39,174,96,0.15);
}
body.dark-mode .edu-pagination .page-numbers {
  background: #1e1e2f;
  border-color: #2a2a3e;
  color: #cbd5e0;
}
body.dark-mode .edu-exam-empty {
  color: #a0aec0;
}
body.dark-mode .edu-exam-empty h3 {
  color: #e2e8f0;
}
body.dark-mode .edu-exam-empty i {
  color: #3a3a4e;
}

/* Single Exam */
body.dark-mode .edu-breadcrumbs {
  color: #a0aec0;
}
body.dark-mode .edu-breadcrumbs a {
  color: #a0aec0;
}
body.dark-mode .edu-bc-sep {
  color: #3a3a4e;
}
body.dark-mode .edu-bc-current {
  color: #e2e8f0;
}
body.dark-mode .edu-exam-content {
  background: #1e1e2f;
  border-color: #2a2a3e;
}
body.dark-mode .edu-related-title {
  color: #e2e8f0;
}
body.dark-mode .edu-related-card {
  background: #1e1e2f;
  border-color: #2a2a3e;
}
body.dark-mode .edu-related-card:hover {
  border-color: var(--edu-accent);
}
body.dark-mode .edu-related-card h4 {
  color: #e2e8f0;
}
body.dark-mode .edu-related-meta {
  color: #a0aec0;
  border-top-color: #2a2a3e;
}

/* Search */
body.dark-mode .edu-search-results {
  background: transparent;
}
body.dark-mode .edu-search-item {
  background: #1e1e2f;
  border-color: #2a2a3e;
}
body.dark-mode .edu-search-item:hover {
  border-color: rgba(255,2,127,0.3);
}
body.dark-mode .edu-search-item-type {
  background: #2a2a3e;
  color: #a0aec0;
}
body.dark-mode .edu-search-item-title a {
  color: #e2e8f0;
}
body.dark-mode .edu-search-item-excerpt {
  color: #a0aec0;
}
body.dark-mode .edu-search-item-footer {
  color: #a0aec0;
}
body.dark-mode .edu-search-item-icon {
  background: #2a2a3e;
  border-color: #3a3a4e;
}
body.dark-mode .edu-search-empty h2 {
  color: #e2e8f0;
}
body.dark-mode .edu-search-empty p {
  color: #a0aec0;
}
body.dark-mode .edu-search-empty-icon {
  background: #2a2a3e;
}
body.dark-mode .edu-search-empty-icon i {
  color: #4a4a5e;
}
body.dark-mode .edu-search-suggest-item {
  background: #1e1e2f;
  border-color: #2a2a3e;
  color: #cbd5e0;
}
body.dark-mode .edu-search-pagination .page-numbers {
  background: #1e1e2f;
  border-color: #2a2a3e;
  color: #cbd5e0;
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — Exam Archive, Single Exam, Search
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .edu-exam-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .edu-related-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  /* Archive */
  .edu-archive-hero {
    padding: 35px 16px 28px;
  }
  .edu-archive-title {
    font-size: 24px;
  }
  .edu-archive-subtitle {
    font-size: 13px;
  }
  .edu-archive-search {
    max-width: 100%;
  }
  .edu-archive-grid-wrap {
    padding: 20px 16px 40px;
  }
  .edu-exam-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .edu-exam-card-link {
    padding: 14px;
  }
  .edu-exam-card-title {
    font-size: 14px;
  }
  .edu-exam-card-stats {
    gap: 8px;
  }
  .edu-exam-card-stats span {
    font-size: 11px;
  }

  /* Single */
  .edu-single-exam {
    padding: 0 16px 30px;
  }
  .edu-exam-header {
    padding: 20px;
  }
  .edu-exam-title {
    font-size: 20px;
  }
  .edu-exam-quick-stats {
    gap: 14px;
  }
  .edu-exam-qs > i {
    width: 28px;
    height: 28px;
    font-size: 14px;
  }
  .edu-qs-value {
    font-size: 15px;
  }
  .edu-exam-content {
    padding: 16px;
  }
  .edu-related-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  /* Search */
  .edu-search-hero {
    padding: 28px 16px 20px;
  }
  .edu-search-heading {
    font-size: 20px;
  }
  .edu-search-tabs {
    flex-wrap: wrap;
    gap: 6px;
  }
  .edu-search-tab {
    padding: 6px 12px;
    font-size: 12px;
  }
  .edu-search-results {
    padding: 16px 16px 30px;
  }
  .edu-search-item {
    padding: 14px;
    gap: 12px;
  }
  .edu-search-item-thumb {
    width: 60px;
    height: 60px;
  }
  .edu-search-item-title {
    font-size: 14px;
  }
  .edu-search-item-footer {
    flex-wrap: wrap;
    gap: 8px;
  }
}

@media (max-width: 480px) {
  .edu-exam-grid {
    grid-template-columns: 1fr;
  }
  .edu-exam-quick-stats {
    flex-direction: column;
    gap: 10px;
  }
  .edu-search-item {
    flex-direction: column;
  }
  .edu-search-item-thumb {
    width: 100%;
    height: 120px;
  }
  .edu-search-item-link {
    margin-left: 0;
  }
}

/* ── Accessibility: Focus States ──────────────────────────────── */
/* Restore visible focus indicators for keyboard navigation.
   Uses :focus-visible so mouse clicks don't show outlines,
   but Tab/keyboard users see a clear ring. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--edu-accent, #ff027f);
  outline-offset: 2px;
}

/* Specific overrides for elements that set outline: none */
.edu-search-input:focus-visible,
.edu-newsletter-form input[type="email"]:focus-visible,
.edu-footer-newsletter input[type="email"]:focus-visible,
.footer-mag-newsletter-form input[type="email"]:focus-visible,
.footer-edu-newsletter-form input[type="email"]:focus-visible,
.edu-archive-search input[type="search"]:focus-visible,
.edu-search-hero-form input[type="search"]:focus-visible {
  outline: 2px solid var(--edu-accent, #ff027f);
  outline-offset: -2px;
}

/* Footer disclaimer styling (moved from inline) */
#footer-disclaimer {
  font-size: 11px;
  opacity: 0.7;
  padding: 5px 0;
}

/* ── Ad Placeholder Dummy Images ─────────────────────────────── */
/* Visible placeholder boxes shown when ad zones are enabled but
   no ad code has been pasted yet. Helps admins visualize layout. */
.ad-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: repeating-linear-gradient(
    45deg,
    #f0f0f0,
    #f0f0f0 10px,
    #fafafa 10px,
    #fafafa 20px
  );
  border: 2px dashed #ccc;
  border-radius: 6px;
  color: #999;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 10px auto;
  max-width: 100%;
  position: relative;
}
.ad-placeholder::before {
  content: 'AD';
  position: absolute;
  top: 6px;
  left: 10px;
  font-size: 10px;
  color: #bbb;
  font-weight: 700;
  letter-spacing: 2px;
}
.ad-placeholder-label {
  padding: 4px 12px;
  background: rgba(255,255,255,0.8);
  border-radius: 4px;
}

/* Size variants */
.ad-placeholder-728x90,
.ad-placeholder-header,
.ad-placeholder-after-content,
.ad-placeholder-footer,
.ad-placeholder-between-posts {
  width: 728px;
  height: 90px;
}
.ad-placeholder-after-first-para {
  width: 468px;
  height: 60px;
}
.ad-placeholder-mid-content {
  width: 336px;
  height: 280px;
}
.ad-placeholder-sidebar-top {
  width: 300px;
  height: 250px;
}
.ad-placeholder-sidebar-bottom {
  width: 300px;
  height: 600px;
}
.ad-placeholder-taxonomy-left,
.ad-placeholder-taxonomy-right {
  width: 160px;
  height: 600px;
}

/* Header ad banner area */
.header-ad-banner {
  text-align: center;
  padding: 10px 0;
  background: #f9f9f9;
  border-bottom: 1px solid #eee;
}
.header-ad-banner .ad-placeholder {
  margin: 0 auto;
}

/* Responsive ad placeholders */
@media (max-width: 768px) {
  .ad-placeholder-728x90,
  .ad-placeholder-header,
  .ad-placeholder-after-content,
  .ad-placeholder-footer,
  .ad-placeholder-between-posts,
  .ad-placeholder-after-first-para {
    width: 100%;
    height: 60px;
  }
  .ad-placeholder-mid-content {
    width: 100%;
    height: 200px;
  }
  .ad-placeholder-sidebar-top {
    width: 100%;
    height: 200px;
  }
  .ad-placeholder-sidebar-bottom,
  .ad-placeholder-taxonomy-left,
  .ad-placeholder-taxonomy-right {
    width: 100%;
    height: 300px;
  }
}


/* ══════════════════════════════════════════════════════════════
   FULLSCREEN SEARCH OVERLAY
   ══════════════════════════════════════════════════════════════ */

.searchform-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(0, 0, 0, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
body.open-search-form .searchform-overlay {
  opacity: 1;
  visibility: visible;
}
body.open-search-form {
  overflow: hidden;
}

.searchform-overlay-inner {
  width: 100%;
  max-width: 640px;
  padding: 0 24px;
  position: relative;
}

.searchform-overlay .btn-close-search {
  position: fixed;
  top: 30px;
  right: 30px;
  background: none;
  border: none;
  color: rgba(255,255,255,0.5);
  font-size: 28px;
  cursor: pointer;
  padding: 12px;
  transition: color 0.2s, transform 0.3s;
  z-index: 1;
}
.searchform-overlay .btn-close-search:hover {
  color: #fff;
  transform: rotate(90deg);
}

.searchform-overlay-content {
  text-align: center;
}
.searchform-overlay-content .searchform-overlay-field {
  display: flex;
  border-bottom: 2px solid rgba(255,255,255,0.3);
  transition: border-color 0.3s;
}
.searchform-overlay-content .searchform-overlay-field:focus-within {
  border-color: var(--edu-accent, #ff027f);
}

.search-field-fullpage {
  flex: 1;
  background: none;
  border: none;
  color: #fff;
  font-size: 28px;
  font-weight: 300;
  padding: 12px 0;
  outline: none;
  font-family: inherit;
}
.search-field-fullpage::placeholder {
  color: rgba(255,255,255,0.35);
}

.searchform-overlay-btn {
  background: none;
  border: none;
  color: rgba(255,255,255,0.5);
  font-size: 22px;
  cursor: pointer;
  padding: 12px 8px;
  transition: color 0.2s;
}
.searchform-overlay-btn:hover {
  color: var(--edu-accent, #ff027f);
}

.searchform-overlay-hint {
  color: rgba(255,255,255,0.3);
  font-size: 13px;
  margin-top: 16px;
}

/* Live search results inside overlay */
.live-search-results {
  margin-top: 20px;
  max-height: 50vh;
  overflow-y: auto;
  text-align: left;
}
.live-search-results .search-results-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.live-search-results .search-result-item {
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.live-search-results .search-result-item a {
  display: flex;
  gap: 14px;
  padding: 14px 0;
  color: #fff;
  text-decoration: none;
  transition: opacity 0.2s;
  align-items: center;
}
.live-search-results .search-result-item a:hover {
  opacity: 0.8;
}
.live-search-results .search-result-thumb {
  width: 60px;
  height: 60px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}
.live-search-results .search-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.live-search-results .search-result-info {
  flex: 1;
  min-width: 0;
}
.live-search-results .search-result-title {
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 4px;
  color: #fff;
}
.live-search-results .search-result-excerpt {
  font-size: 13px;
  color: rgba(255,255,255,0.5);
  margin: 0 0 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.live-search-results .search-result-date {
  font-size: 12px;
  color: rgba(255,255,255,0.35);
}
.live-search-results .no-results {
  color: rgba(255,255,255,0.5);
  text-align: center;
  padding: 24px 0;
}
.live-search-results .search-loading {
  text-align: center;
  padding: 24px 0;
  color: rgba(255,255,255,0.5);
  font-size: 20px;
}

/* Overlay animation */
.searchform-overlay .searchform-overlay-content {
  transform: translateY(20px);
  transition: transform 0.35s ease;
}
body.open-search-form .searchform-overlay .searchform-overlay-content {
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 600px) {
  .search-field-fullpage {
    font-size: 20px;
  }
  .btn-close-search {
    top: -60px;
    font-size: 24px;
  }
}


/* ═══════════════════════════════════════════════════════════════════
   EDUCATION PRO HEADER
   Hamburger + Logo (LEFT) | Primary Menu (CENTER) | Right Menu + Search (RIGHT)
   ═══════════════════════════════════════════════════════════════════ */

.header-edupro-type {
  position: relative;
  z-index: 999;
}

.header-edupro-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  height: 64px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  max-width: 1400px;
  margin: 0 auto;
}

/* ── LEFT: Hamburger + Logo ─────────────────────────────── */
.header-edupro-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.header-edupro-toggle .open-hidden-menu {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.header-edupro-toggle .open-hidden-menu span {
  display: block;
  width: 22px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 0.3s, opacity 0.3s;
}

.header-edupro-logo a {
  display: flex;
  align-items: center;
}

.header-edupro-logo img {
  max-height: 80px; /* Default; overridden by Customizer via custom-css.php */
  width: auto;
}

.header-edupro-logo .site-title-text {
  font-size: 22px;
  font-weight: 700;
  color: #1f2937;
  text-decoration: none;
}

/* ── CENTER: Primary Menu ───────────────────────────────── */
.header-edupro-nav-center {
  flex: 1;
  display: flex;
  justify-content: center;
}

.header-edupro-nav-center .edupro-horizontal-menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 4px;
}

.header-edupro-nav-center .edupro-horizontal-menu > li > a {
  display: block;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  text-decoration: none;
  border-radius: 6px;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.header-edupro-nav-center .edupro-horizontal-menu > li > a:hover,
.header-edupro-nav-center .edupro-horizontal-menu > li.current-menu-item > a {
  background: #f3f4f6;
  color: #1f2937;
}

/* ── Dropdown styles for edupro ── */
.header-edupro-nav-center .edupro-horizontal-menu > li {
  position: relative;
}

.header-edupro-nav-center .edupro-horizontal-menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 200px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.12), 0 1px 3px rgba(0,0,0,.06);
  padding: 8px;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .25s cubic-bezier(.4,0,.2,1), transform .25s cubic-bezier(.4,0,.2,1), visibility .25s;
  z-index: 1000;
}

.header-edupro-nav-center .edupro-horizontal-menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header-edupro-nav-center .edupro-horizontal-menu .sub-menu li a {
  display: block;
  padding: 8px 14px;
  font-size: 13px;
  color: #4b5563;
  text-decoration: none;
  border-radius: 8px;
  transition: background .15s, color .15s;
}

.header-edupro-nav-center .edupro-horizontal-menu .sub-menu li a:hover {
  background: #f3f4f6;
  color: #1f2937;
}

/* Nested sub-menu (depth 3) */
.header-edupro-nav-center .edupro-horizontal-menu .sub-menu .sub-menu {
  top: 0;
  left: 100%;
}

/* ═══════════════════════════════════════════════════════════════
   MEGA MENU — World-Class Desktop + Mobile (edupro header)
   ═══════════════════════════════════════════════════════════════ */

/* Make mega-menu parent static so dropdown spans full nav width */
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu {
  position: static;
}

/* Mega container — full width under the nav */
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .mega-menu-container,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .mega-menu-container {
  left: 0; right: 0;
  width: 100%;
  min-width: 100%;
  border-radius: 0 0 16px 16px;
  border: none;
  border-top: 3px solid var(--edu-accent, #ff027f);
  box-shadow: 0 25px 80px rgba(0,0,0,.12), 0 4px 12px rgba(0,0,0,.05);
  padding: 0;
  display: flex !important;
  flex-wrap: nowrap;
  background: #fff;
}

/* Mega columns wrapper */
.header-edupro-nav-center .mega-menu-columns,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu {
  display: flex !important;
  flex-wrap: nowrap;
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
}

/* Individual column */
.header-edupro-nav-center .mega-menu-column,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li {
  flex: 1;
  min-width: 0;
  padding: 20px 0;
  position: relative;
  border-right: none;
}

.header-edupro-nav-center .mega-menu-column::after,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li::after,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li::after {
  content: '';
  position: absolute;
  right: 0;
  top: 16px; bottom: 16px;
  width: 1px;
  background: #f0f0f0;
}

.header-edupro-nav-center .mega-menu-column:last-child::after,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li:last-child::after,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li:last-child::after {
  display: none;
}

/* Column heading */
.header-edupro-nav-center .mega-menu-heading,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li > a,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 11px;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  padding: 0 24px 12px;
  margin: 0;
  border-bottom: none;
  cursor: default;
  background: none !important;
  border-radius: 0 !important;
}

.header-edupro-nav-center .mega-menu-heading i,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li > a i {
  font-size: 13px;
  color: var(--edu-accent, #ff027f);
  width: 16px;
  text-align: center;
}

/* Column links container */
.header-edupro-nav-center .mega-menu-links,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li > .sub-menu,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li > .sub-menu {
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  box-shadow: none !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
  margin: 0;
  min-width: auto;
  display: block;
  border-radius: 0 !important;
}

/* Individual mega menu links */
.header-edupro-nav-center .mega-menu-links li a,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu .sub-menu .sub-menu li a,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu .sub-menu .sub-menu li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 24px !important;
  font-size: 13.5px;
  font-weight: 450;
  color: #374151;
  text-decoration: none;
  border-radius: 0 !important;
  border-bottom: none !important;
  transition: all .15s ease;
  line-height: 1.4;
}

.header-edupro-nav-center .mega-menu-links li a:hover,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu .sub-menu .sub-menu li a:hover,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu .sub-menu .sub-menu li a:hover {
  background: #f8fafc;
  color: var(--edu-accent, #ff027f);
  padding-left: 28px !important;
}

/* Icons inside mega links */
.header-edupro-nav-center .mega-menu-links li a i,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu .sub-menu .sub-menu li a i {
  font-size: 14px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

/* Arrow for mega items — small, subtle */
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > a .menu-arrow,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > a .menu-arrow {
  display: inline-flex; margin-left: 4px;
}
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > a .menu-arrow i,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > a .menu-arrow i {
  font-size: 8px;
  transition: transform .2s;
}
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu:hover > a .menu-arrow i,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu:hover > a .menu-arrow i {
  transform: rotate(180deg);
}

/* Hide dropdown arrow inside mega columns */
.header-edupro-nav-center .mega-menu-column .menu-arrow,
.header-edupro-nav-center .edupro-horizontal-menu > li.has-mega-menu > .sub-menu > li .menu-arrow,
.header-edupro-nav-center .edupro-horizontal-menu > li.mega-menu > .sub-menu > li .menu-arrow {
  display: none !important;
}

/* ── RIGHT: Secondary Menu + Search + User Greeting ────── */
.header-edupro-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  height: 100%;
}

.header-edupro-nav-right {
  display: flex;
  align-items: center;
  height: 100%;
}

.header-edupro-nav-right .edupro-right-menu {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 2px;
  height: 100%;
}

.header-edupro-nav-right .edupro-right-menu > li {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
}

.header-edupro-nav-right .edupro-right-menu > li > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 500;
  color: #6b7280;
  text-decoration: none;
  border-radius: 6px;
  transition: background .2s, color .2s;
  white-space: nowrap;
  line-height: 1;
}

.header-edupro-nav-right .edupro-right-menu > li > a:hover,
.header-edupro-nav-right .edupro-right-menu > li.current-menu-item > a {
  color: #1f2937;
  background: #f3f4f6;
}

/* Right menu dropdowns */
.header-edupro-nav-right .edupro-right-menu .sub-menu {
  position: absolute;
  top: 100%;
  right: 0;
  min-width: 180px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.12), 0 1px 3px rgba(0,0,0,.06);
  padding: 8px;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .25s cubic-bezier(.4,0,.2,1), transform .25s cubic-bezier(.4,0,.2,1), visibility .25s;
  z-index: 1000;
}

.header-edupro-nav-right .edupro-right-menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header-edupro-nav-right .edupro-right-menu .sub-menu li a {
  display: block;
  padding: 8px 14px;
  font-size: 13px;
  color: #4b5563;
  text-decoration: none;
  border-radius: 8px;
}

.header-edupro-nav-right .edupro-right-menu .sub-menu li a:hover {
  background: #f3f4f6;
  color: #1f2937;
}

/* Search icon */
.edupro-search-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: #6b7280;
  border-radius: 50%;
  transition: background .2s, color .2s;
  text-decoration: none;
}

.edupro-search-icon:hover {
  background: #f3f4f6;
  color: #1f2937;
}

/* ── Mobile Slide-in Panel Extras ───────────────────────── */
.header-edupro-type .edu-mobile-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  border-bottom: 1px solid #f3f4f6;
}

.header-edupro-type .edu-mobile-user img {
  border-radius: 50%;
}

.header-edupro-type .edu-mobile-user-info strong {
  display: block;
  font-size: 14px;
  color: #1f2937;
}

.header-edupro-type .edu-mobile-user-info a {
  font-size: 12px;
  color: var(--edu-primary, #2563eb);
  text-decoration: none;
}

.header-edupro-type .edupro-mobile-right-menu {
  border-top: 1px solid #f3f4f6;
  padding-top: 8px;
  margin-top: 8px;
}

.header-edupro-type .edu-mobile-cta {
  padding: 16px 20px;
}

.header-edupro-type .edu-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--edu-primary, #2563eb);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.header-edupro-type .edu-cta-btn:hover {
  background: var(--edu-primary-dark, #1d4ed8);
}

.header-edupro-type .edu-cta-btn-full {
  display: flex;
  justify-content: center;
  width: 100%;
}

/* ── Responsive: Hide center/right menus on mobile ────── */
@media (max-width: 960px) {
  .header-edupro-nav-center,
  .header-edupro-nav-right {
    display: none;
  }

  .header-edupro-wrapper {
    height: 56px;
    padding: 0 16px;
  }

  .header-edupro-logo img {
    max-height: 32px;
  }
}

@media (min-width: 961px) {
  /* On desktop, hamburger is still visible (opens the slide panel with full nav) */
  .header-edupro-toggle {
    /* Keep visible — users can access slide panel on desktop too */
  }
}


/* ═══════════════════════════════════════════════════════════════════
   COVER + ALT HEADER (Book Layout with Custom Headers)
   When the toggle is ON, the chosen header renders at top and the
   cover image panel sits below it in the classic "book" layout.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --alt-header-h: 0px; /* Set dynamically by JS */
}

/* The magheader sits above the cover, spanning full width */
.cover-alt-header .magheader {
  position: relative;
  z-index: 100;
  width: 100%;
}

/* The cover panel fills the full viewport height.
   It sits behind the header (z-index 4 vs 100) so no offset needed.
   This prevents white gaps when scrolling past the header.
   Dark bg prevents white flash while the cover image loads. */
.cover-alt-header .magcover {
  top: 0;
  height: 100vh;
  background: #1a1a2e;
}

/* When the cover header is suppressed, cover-content needs no extra
   top padding for the now-absent mini-header */
.cover-alt-header .magcover .cover-content {
  padding-top: 40px;
}

/* Override the education-platform full-width rules when book layout is active.
   Specificity (0,3,1) beats body.header-type-* .magcontent (0,2,1). */
body .site-wrapper.cover-alt-header .magcontent {
  float: none !important;
  width: 60% !important;
  padding-top: 0 !important;
  margin-left: 40% !important;
}

/* Prevent the slide animation from kicking in on #main-area */
body .site-wrapper.cover-alt-header .magcontent #main-area {
  position: relative !important;
  left: 0 !important;
  animation: none !important;
  -webkit-animation: none !important;
  padding-top: 20px !important;
}

/* Keep the fold-shadow-right visible in book layout */
body .site-wrapper.cover-alt-header .fold-shadow-right {
  display: block !important;
}

/* On mobile, stack vertically — no fixed cover */
@media (max-width: 960px) {
  .cover-alt-header .magcover {
    position: relative;
    top: 0;
    height: auto;
    min-height: 50vh;
    width: 100%;
  }
  body .site-wrapper.cover-alt-header .magcontent {
    float: none !important;
    width: 100% !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   VIVID NAV PANEL — Student-friendly, optimistic hamburger menu
   ═══════════════════════════════════════════════════════════════ */

/* ── Warm gradient background ──────────────────────────────── */
.header-edupro-type .nav-panel,
body.header-type-classic .nav-panel {
  background: linear-gradient(160deg, #f0f4ff 0%, #fefcf6 50%, #fff5f5 100%);
}

/* ── Nav header: bigger logo area + motivational tagline ───── */
.header-edupro-type .nav-header,
body.header-type-classic .nav-header {
  position: relative;
  padding: 24px 30px 16px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.header-edupro-type .nav-header::after,
body.header-type-classic .nav-header::after {
  content: "Your success journey starts here ✨";
  display: block;
  margin-top: 12px;
  font-size: 13px;
  font-weight: 500;
  color: #7c7c8a;
  font-family: 'Poppins', sans-serif;
  letter-spacing: 0.3px;
}

/* ── Menu logo: bigger default, controlled by Customizer ───── */
.header-edupro-type .menu-logo,
body.header-type-classic .menu-logo {
  position: relative;
  margin-top: 0;
  margin-left: 0;
  height: 45px;
}

/* ── User section: warmer styling ──────────────────────────── */
.header-edupro-type .edu-mobile-user,
body.header-type-classic .edu-mobile-user {
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(0,0,0,0.05);
  border-radius: 12px;
  margin: 12px 20px;
  padding: 14px 16px;
}

/* ── Menu items: reduced size, flex layout with icon badges ── */
.header-edupro-type #nav-wrapper .nav-menu > li > a,
body.header-type-classic #nav-wrapper .nav-menu > li > a {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.2px;
  color: #1f2937;
  padding: 12px 20px;
  margin: 2px 12px;
  border-radius: 12px;
  background: transparent;
  transition: all 0.25s ease;
}

/* Hover: soft accent pill */
.header-edupro-type #nav-wrapper .nav-menu > li > a:hover,
body.header-type-classic #nav-wrapper .nav-menu > li > a:hover {
  background: rgba(99, 102, 241, 0.08);
  color: var(--edu-accent, #6366f1);
  background-size: 0; /* reset the original underline animation */
}

/* Active item: accent left-border */
.header-edupro-type #nav-wrapper .nav-menu > li.current-menu-item > a,
body.header-type-classic #nav-wrapper .nav-menu > li.current-menu-item > a {
  background: rgba(99, 102, 241, 0.1);
  color: var(--edu-accent, #6366f1);
  border-left: 3px solid var(--edu-accent, #6366f1);
}

/* ── Icon circle badges via ::before ──────────────────────── */
.header-edupro-type #nav-wrapper .nav-menu > li > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li > a::before {
  content: "\f054"; /* default: chevron-right */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  font-size: 15px;
  color: #fff;
  background: linear-gradient(135deg, #a78bfa, #7c3aed);
  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Hover: icon badge lifts */
.header-edupro-type #nav-wrapper .nav-menu > li > a:hover::before,
body.header-type-classic #nav-wrapper .nav-menu > li > a:hover::before {
  transform: scale(1.08);
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.35);
}

/* Position-based icon mapping */
.header-edupro-type #nav-wrapper .nav-menu > li:nth-child(1) > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li:nth-child(1) > a::before {
  content: "\f015"; /* Home */
  background: linear-gradient(135deg, #60a5fa, #2563eb);
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}
.header-edupro-type #nav-wrapper .nav-menu > li:nth-child(2) > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li:nth-child(2) > a::before {
  content: "\f19d"; /* Graduation Cap */
  background: linear-gradient(135deg, #34d399, #059669);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.25);
}
.header-edupro-type #nav-wrapper .nav-menu > li:nth-child(3) > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li:nth-child(3) > a::before {
  content: "\f0b1"; /* Briefcase */
  background: linear-gradient(135deg, #fbbf24, #d97706);
  box-shadow: 0 2px 8px rgba(217, 119, 6, 0.25);
}
.header-edupro-type #nav-wrapper .nav-menu > li:nth-child(4) > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li:nth-child(4) > a::before {
  content: "\f46d"; /* Clipboard List */
  background: linear-gradient(135deg, #f472b6, #db2777);
  box-shadow: 0 2px 8px rgba(219, 39, 119, 0.25);
}
.header-edupro-type #nav-wrapper .nav-menu > li:nth-child(5) > a::before,
body.header-type-classic #nav-wrapper .nav-menu > li:nth-child(5) > a::before {
  content: "\f02b"; /* Tag / Pricing */
  background: linear-gradient(135deg, #fb923c, #ea580c);
  box-shadow: 0 2px 8px rgba(234, 88, 12, 0.25);
}

/* Hide CSS ::before when walker already injected an icon (emoji or legacy FA) */
.header-edupro-type #nav-wrapper .nav-menu > li > a:has(> .menu-emoji)::before,
.header-edupro-type #nav-wrapper .nav-menu > li > a:has(> i.fas)::before,
.header-edupro-type #nav-wrapper .nav-menu > li > a:has(> i.fab)::before,
body.header-type-classic #nav-wrapper .nav-menu > li > a:has(> .menu-emoji)::before,
body.header-type-classic #nav-wrapper .nav-menu > li > a:has(> i.fas)::before,
body.header-type-classic #nav-wrapper .nav-menu > li > a:has(> i.fab)::before {
  display: none;
}

/* ── Walker-injected emoji icons (top-level) ────────────────── */
.header-edupro-type #nav-wrapper .nav-menu > li > a > .menu-emoji,
body.header-type-classic #nav-wrapper .nav-menu > li > a > .menu-emoji {
  font-size: 16px;
  margin-right: 6px;
  vertical-align: middle;
  line-height: 1;
  font-style: normal;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
}

/* ── Legacy Walker-injected FontAwesome icons (top-level) ───── */
.header-edupro-type #nav-wrapper .nav-menu > li > a > i.fas,
.header-edupro-type #nav-wrapper .nav-menu > li > a > i.fab,
.header-edupro-type #nav-wrapper .nav-menu > li > a > i.far,
body.header-type-classic #nav-wrapper .nav-menu > li > a > i.fas,
body.header-type-classic #nav-wrapper .nav-menu > li > a > i.fab,
body.header-type-classic #nav-wrapper .nav-menu > li > a > i.far {
  font-size: 14px;
  margin-right: 8px;
  opacity: .7;
  transition: opacity .2s, color .2s;
  vertical-align: middle;
}
.header-edupro-type #nav-wrapper .nav-menu > li:hover > a > i.fas,
.header-edupro-type #nav-wrapper .nav-menu > li:hover > a > i.fab,
.header-edupro-type #nav-wrapper .nav-menu > li:hover > a > i.far,
.header-edupro-type #nav-wrapper .nav-menu > li.current-menu-item > a > i.fas,
.header-edupro-type #nav-wrapper .nav-menu > li.current-menu-item > a > i.fab,
body.header-type-classic #nav-wrapper .nav-menu > li:hover > a > i.fas,
body.header-type-classic #nav-wrapper .nav-menu > li:hover > a > i.fab,
body.header-type-classic #nav-wrapper .nav-menu > li.current-menu-item > a > i.fas {
  opacity: 1;
  color: var(--edu-accent, #ff027f);
}

/* Emoji icons in mega menu headings */
.mega-menu-heading .menu-emoji {
  font-size: 14px;
  margin-right: 4px;
  line-height: 1;
}
/* Legacy FA icons in mega menu headings */
.mega-menu-heading i.fas,
.mega-menu-heading i.fab,
.mega-menu-heading i.far {
  font-size: 13px;
  color: var(--edu-accent, #ff027f);
  opacity: .8;
}

/* Emoji icons in mega menu column links */
.mega-menu-columns a > .menu-emoji {
  font-size: 13px;
  width: 20px;
  display: inline-block;
  text-align: center;
  margin-right: 4px;
  line-height: 1;
}
/* Legacy FA icons in mega menu column links */
.mega-menu-columns a > i.fas,
.mega-menu-columns a > i.fab,
.mega-menu-columns a > i.far {
  font-size: 12px;
  width: 18px;
  text-align: center;
  opacity: .5;
  transition: opacity .15s;
}
.mega-menu-columns a:hover > i.fas,
.mega-menu-columns a:hover > i.fab,
.mega-menu-columns a:hover > i.far {
  opacity: .9;
  color: var(--edu-accent, #ff027f);
}

/* Mobile menu emoji icons */
.edu-mobile-menu-content .nav-menu li a > .menu-emoji {
  font-size: 15px;
  width: 22px;
  display: inline-block;
  text-align: center;
  margin-right: 8px;
  line-height: 1;
}
/* Mobile menu legacy FA icons */
.edu-mobile-menu-content .nav-menu li a > i.fas,
.edu-mobile-menu-content .nav-menu li a > i.fab {
  font-size: 14px;
  width: 22px;
  text-align: center;
  margin-right: 8px;
  opacity: .6;
}

/* ── Sub-menu items: smaller, indented ────────────────────── */
.header-edupro-type #nav-wrapper .nav-menu .sub-menu li a,
body.header-type-classic #nav-wrapper .nav-menu .sub-menu li a {
  font-size: 15px;
  font-weight: 500;
  padding: 8px 20px 8px 84px;
  color: #4b5563;
  background: none;
}
.header-edupro-type #nav-wrapper .nav-menu .sub-menu li a:hover,
body.header-type-classic #nav-wrapper .nav-menu .sub-menu li a:hover {
  color: var(--edu-accent, #6366f1);
  background: rgba(99, 102, 241, 0.04);
  background-size: 0;
}
/* No icon badge on submenu items */
.header-edupro-type #nav-wrapper .nav-menu .sub-menu li a::before,
body.header-type-classic #nav-wrapper .nav-menu .sub-menu li a::before {
  display: none;
}

/* ── Dropdown arrow: refined ──────────────────────────────── */
.header-edupro-type #nav-wrapper .menu-arrow,
body.header-type-classic #nav-wrapper .menu-arrow {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
}
.header-edupro-type #nav-wrapper .menu-arrow:hover,
body.header-type-classic #nav-wrapper .menu-arrow:hover {
  background: rgba(0,0,0,0.05);
}
.header-edupro-type #nav-wrapper .menu-arrow i,
body.header-type-classic #nav-wrapper .menu-arrow i {
  font-size: 12px;
  color: #9ca3af;
}

/* ── Hide dropdown arrows on dynamic plugin menu items ────── */
.tb-dynamic-menu-item > .menu-arrow,
.tb-dynamic-menu-item > .sub-menu-toggle,
.tb-user-menu > .menu-arrow,
.tb-user-menu > .sub-menu-toggle {
  display: none !important;
}

/* ── CTA button: prominent gradient ───────────────────────── */
.header-edupro-type .edu-mobile-cta .edu-cta-btn,
body.header-type-classic .edu-mobile-cta .edu-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, var(--edu-accent, #6366f1), var(--edu-primary, #4f46e5));
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.header-edupro-type .edu-mobile-cta .edu-cta-btn:hover,
body.header-type-classic .edu-mobile-cta .edu-cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(99, 102, 241, 0.45);
}

/* ── Search: clean styling ────────────────────────────────── */
.header-edupro-type .menu-search,
body.header-type-classic .menu-search {
  padding: 0 20px 20px;
}

/* ── Scrollbar area spacing ───────────────────────────────── */
.header-edupro-type #nav-wrapper,
body.header-type-classic #nav-wrapper {
  padding-top: 8px;
}
.header-edupro-type #nav-wrapper ul.nav-menu,
body.header-type-classic #nav-wrapper ul.nav-menu {
  right: 0;
  padding: 0;
}

/* ── Mobile Mega Menu: accordion stack ──────────────────── */
.header-edupro-type #nav-wrapper .mega-menu-container,
body.header-type-classic #nav-wrapper .mega-menu-container {
  display: block !important;
  padding: 0;
  border: none;
  box-shadow: none;
  background: none;
}
.header-edupro-type #nav-wrapper .mega-menu-columns,
body.header-type-classic #nav-wrapper .mega-menu-columns {
  display: block !important;
  padding: 0;
  list-style: none;
}
.header-edupro-type #nav-wrapper .mega-menu-column,
body.header-type-classic #nav-wrapper .mega-menu-column {
  padding: 0;
  border: none;
  margin-bottom: 4px;
}
.header-edupro-type #nav-wrapper .mega-menu-column::after,
body.header-type-classic #nav-wrapper .mega-menu-column::after {
  display: none;
}
.header-edupro-type #nav-wrapper .mega-menu-heading,
body.header-type-classic #nav-wrapper .mega-menu-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 20px 8px 84px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #94a3b8;
  margin-top: 8px;
}
.header-edupro-type #nav-wrapper .mega-menu-links,
body.header-type-classic #nav-wrapper .mega-menu-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.header-edupro-type #nav-wrapper .mega-menu-links li a,
body.header-type-classic #nav-wrapper .mega-menu-links li a {
  font-size: 14px !important;
  padding: 7px 20px 7px 94px !important;
  color: #4b5563;
}
.header-edupro-type #nav-wrapper .mega-menu-links li a:hover,
body.header-type-classic #nav-wrapper .mega-menu-links li a:hover {
  color: var(--edu-accent, #ff027f);
  background: rgba(255, 2, 127, 0.04);
}

/* =========================================================================
   Design Style Variants  (Customizer → Header & Navigation → Design Style)
   ========================================================================= */

/* ── Minimal — Green & White (Playful) ─────────────────────── */
body.edu-variant-minimal .edu-topbar { background: #10b981; }
body.edu-variant-minimal .edu-topbar a:hover { color: #fff; }
body.edu-variant-minimal .edu-main-nav a { color: #065f46; }
body.edu-variant-minimal .edu-main-nav a:hover,
body.edu-variant-minimal .edu-main-nav a.active { color: #10b981; }
body.edu-variant-minimal .edu-cta-btn { background: #10b981; color: #fff; }
body.edu-variant-minimal .edu-cta-btn:hover { background: #059669; }
body.edu-variant-minimal .edu-main-header { border-bottom: 2px solid #d1fae5; }

/* ── Professional — Blue & Formal (Corporate) ─────────────── */
body.edu-variant-professional .edu-topbar { background: #1e3a5f; }
body.edu-variant-professional .edu-main-nav a { color: #1e3a5f; }
body.edu-variant-professional .edu-main-nav a:hover,
body.edu-variant-professional .edu-main-nav a.active { color: #2563eb; }
body.edu-variant-professional .edu-cta-btn { background: #2563eb; color: #fff; border-radius: 4px; }
body.edu-variant-professional .edu-cta-btn:hover { background: #1d4ed8; }
body.edu-variant-professional .edu-main-header { border-bottom: 1px solid #e2e8f0; }

/* ── Bold — Gradients & Glass (Modern) ─────────────────────── */
body.edu-variant-bold .edu-topbar { background: linear-gradient(90deg, #7c3aed, #2563eb); }
body.edu-variant-bold .edu-main-nav a { color: #4c1d95; font-weight: 700; }
body.edu-variant-bold .edu-main-nav a:hover,
body.edu-variant-bold .edu-main-nav a.active { color: #7c3aed; }
body.edu-variant-bold .edu-cta-btn {
  background: linear-gradient(135deg, #7c3aed, #ec4899);
  color: #fff; border-radius: 50px; font-weight: 700;
}
body.edu-variant-bold .edu-cta-btn:hover { opacity: .9; }
body.edu-variant-bold .edu-main-header {
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ── Dark Premium — Neon & Dark (Exclusive) ────────────────── */
body.edu-variant-dark .edu-topbar { background: #0f0f0f; }
body.edu-variant-dark .edu-topbar,
body.edu-variant-dark .edu-topbar a { color: #a3e635; }
body.edu-variant-dark .edu-main-header { background: #1a1a2e !important; }
body.edu-variant-dark .edu-main-nav a { color: #e2e8f0; }
body.edu-variant-dark .edu-main-nav a:hover,
body.edu-variant-dark .edu-main-nav a.active { color: #a3e635; }
body.edu-variant-dark .edu-cta-btn {
  background: #a3e635; color: #0f0f0f; font-weight: 700;
}
body.edu-variant-dark .edu-cta-btn:hover { background: #bef264; }
body.edu-variant-dark .header-classic-logo.edu-logo .site-title-text,
body.edu-variant-dark .header-edupro-logo .site-title-text { color: #fff; }

/* Hide duplicate topbar auth buttons when main nav has them */
.topbar-right .tb-topbar-auth {
    display: none;
}

/* Mega menu dropdown z-index fix */
.horizontal-menu > .menu-item-has-children > .sub-menu {
    min-width: 180px;
    z-index: 1000;
}
