/* ============================================================
   FORKAIA® — Dark theme override for custom pages
   Unifies success-stories, testimonials, university-credit,
   hiring-partners, awards, why-forkaia, convocation with the
   homepage identity (black + hologram gradient + Archivo Black).
   ============================================================ */

:root {
  --sun: #22D3EE;         /* was gold — remap to cyan for brand consistency */
  --sun2: #EC4899;        /* was orange — magenta */
  --ivy: #8B5CF6;         /* was blue — purple accent */
  --ink: #ffffff;         /* was black — flip to white for dark bg */
  --paper-warm: #07070E;  /* was warm paper — flip to near-black */
  --mist: #11111C;
  --f-display: 'Archivo Black', sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --f-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Force dark body + white text */
body {
  background: #07070E !important;
  color: #ffffff !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Homepage-matching sticky nav */
nav.site-nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(7,7,14,0.85);
  backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid #2B2B3D;
}
.site-nav .nav-inner {
  max-width: 1180px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px; height: 72px; padding: 0 32px;
}
.site-nav .brand {
  display: flex; align-items: center; gap: 12px;
  color: #fff;
  font-family: 'Archivo Black', sans-serif;
  font-size: 17px; letter-spacing: 0.03em;
  flex-shrink: 0; text-decoration: none;
}
.site-nav .brand .dot {
  width: 4px; height: 22px;
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  border-radius: 2px;
  box-shadow: 0 0 14px rgba(178,94,255,0.7);
}
.site-nav .brand-tag {
  color: #22D3EE;
  font-size: 12px; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
}
.site-nav .nav-links {
  display: flex; align-items: center; gap: 22px;
  white-space: nowrap; flex: 1; justify-content: center;
}
.site-nav .nav-links a {
  font-size: 13.5px; font-weight: 500;
  color: rgba(255,255,255,0.72);
  transition: color 0.15s ease;
  padding: 6px 0;
}
.site-nav .nav-links a:hover,
.site-nav .nav-links a.active { color: #fff; }
.site-nav .nav-cta {
  display: inline-flex; align-items: center; gap: 8px;
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  color: #fff;
  padding: 11px 20px; border-radius: 999px;
  font-weight: 600; font-size: 14px;
  box-shadow: 0 4px 18px -6px rgba(178,94,255,0.55);
  text-decoration: none; white-space: nowrap; flex-shrink: 0;
}
.site-nav .nav-cta:hover { filter: brightness(1.1); transform: translateY(-1px); }
@media (max-width: 1360px) { .site-nav .nav-links { gap: 18px; } .site-nav .nav-links a { font-size: 13px; } }
@media (max-width: 1180px) { .site-nav .brand-tag { display: none; } .site-nav .nav-links { gap: 15px; } .site-nav .nav-links a { font-size: 12.5px; } }
@media (max-width: 1024px) { .site-nav .nav-links { display: none; } }

/* Hide the old college-nav if any page still has it */
.college-nav { display: none !important; }

/* Content area styling flip */
.pg { max-width: 1180px; margin: 0 auto; padding: 48px 32px; }
.eyebrow {
  font-family: 'Inter', sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.18em !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #B25EFF !important;
}
h1.hero {
  font-family: 'Archivo Black', sans-serif !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
}
h1.hero em {
  font-style: normal !important;
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent !important;
  font-weight: 900;
}
.hero-sub {
  color: #C7CBDE !important;
}
.hero-sub strong { color: #ffffff !important; }

/* Section headings */
.section-h {
  font-family: 'Archivo Black', sans-serif !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
}
.section-h em {
  font-style: normal !important;
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
}
.section-sub { color: #6B708A !important; }

/* Cards flip from cream to dark */
.college-card,
.traj,
.exhibit,
.q-tile,
.get-tile,
.pace-card,
.ship-card,
.year-block,
.press-tile,
.rank-tile,
.trophy,
.marquee-tile,
.cat-row,
.how-card,
.unis,
.dl,
.ulist,
.q-flagship,
.cta-strip,
.q-grid > div {
  background: #181826 !important;
  border: 1px solid #2B2B3D !important;
  color: #C7CBDE !important;
}
.traj.featured,
.q-flagship,
.exhibit {
  background: linear-gradient(135deg, rgba(139,92,246,0.08), rgba(236,72,153,0.04)) !important;
  border: 1px solid #B25EFF !important;
}

/* Make headings inside cards white */
.college-card h2, .college-card h3, .college-card h4,
.traj .person, .traj h4,
.q-tile h4, .q-tile .cite-info .name,
.get-tile h4,
.marquee-tile,
.cat-row .head h3,
.how-card h4,
.unis h3,
.exhibit h2 {
  color: #ffffff !important;
}

/* Make body text in cards readable on dark */
.college-card p, .college-card li,
.traj p, .arc-step .body p,
.q-tile blockquote,
.get-tile p,
.how-card p,
.unis .u {
  color: #C7CBDE !important;
}

/* Dark-mode "big-row" / "big-stats" banners already dark — just ensure */
.big-row, .big-stats, .trust-bar, .big-number-row, .headline-stat,
.companies-strip, .cta-dark {
  background: linear-gradient(135deg, #11111C, #181826) !important;
  border: 1px solid #2B2B3D !important;
}

/* Buttons flip */
.btn-primary-sun {
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 18px -6px rgba(178,94,255,0.55);
}
.btn-ghost-ink {
  background: transparent !important;
  color: #ffffff !important;
  border: 2px solid rgba(255,255,255,0.4) !important;
}
.btn-ghost-ink:hover { border-color: #B25EFF !important; }

/* Footer dark */
footer.college-foot {
  background: #07070E !important;
  color: rgba(255,255,255,0.5) !important;
  border-top: 1px solid #2B2B3D;
}
footer.college-foot a { color: #22D3EE !important; }

/* Pills + tags */
.chip, .course-tag, .q-tile .tag, .ship-tag, .status-pill,
.cat-row .count, .cat-row .name, .cat-row .plus {
  background: #11111C !important;
  color: #C7CBDE !important;
  border: 1px solid #2B2B3D !important;
}

/* Marquee tile hover */
.marquee-tile:hover { border-color: #B25EFF !important; }
.marquee-tile.gold {
  background: linear-gradient(135deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%) !important;
  color: #ffffff !important;
  border: none !important;
}
.marquee-tile.gold .role { color: rgba(255,255,255,0.85) !important; }

/* Flagship/showstopper gradient blocks */
.show, .cta-strip {
  background: linear-gradient(135deg, rgba(139,92,246,0.18), rgba(236,72,153,0.14), rgba(34,211,238,0.12)) !important;
  color: #ffffff !important;
  border: 1px solid #B25EFF !important;
}
.show h3, .show p { color: #ffffff !important; }
.show .company-row span {
  background: #07070E !important; color: #22D3EE !important;
}

/* Timeline nodes */
.arc-step .nod::before { background: #2B2B3D !important; }
.arc-step .nod .circle { background: #11111C !important; border-color: #B25EFF !important; }
.arc-step.start .nod .circle { background: #2B2B3D !important; border-color: #EC4899 !important; }
.arc-step.current .nod .circle {
  background: linear-gradient(135deg, #22D3EE, #B25EFF) !important;
  border-color: #EC4899 !important;
  box-shadow: 0 0 0 4px rgba(178,94,255,0.25) !important;
}
.arc-step .yr, .arc-step .body .co { color: #6B708A !important; }

/* Dashed dividers */
.cat-row .names, .q-tile .cite-row, .traj .thead {
  border-color: #2B2B3D !important;
}

/* Proof note (yellow) → tech blue */
.proof-note {
  background: rgba(34,211,238,0.08) !important;
  border: 1px solid rgba(34,211,238,0.3) !important;
  border-left: 4px solid #22D3EE !important;
  color: #C7CBDE !important;
}
.proof-note strong { color: #ffffff !important; }

/* Big stat numbers → gradient */
.big-stat .n, .big-save, .flagship .rank, .headline-stat .stat .n,
.rank-tile .pos, .year-block .yh .y {
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Pulse dot */
.pill-current .dot { background: #22D3EE !important; }

/* ============================================================
   MEGA-FOOTER — unified 4-column
   ============================================================ */
footer.mega-footer {
  background: #07070E;
  color: rgba(255,255,255,0.5);
  border-top: 1px solid #2B2B3D;
  padding: 64px 0 32px;
  margin-top: 80px;
}
.mf-inner {
  max-width: 1240px; margin: 0 auto; padding: 0 32px;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
  gap: 40px;
}
@media (max-width: 1024px) { .mf-inner { grid-template-columns: 1fr 1fr 1fr; } .mf-brand-col { grid-column: span 3; } }
@media (max-width: 640px)  { .mf-inner { grid-template-columns: 1fr 1fr; } .mf-brand-col { grid-column: span 2; } }

.mf-brand {
  display: flex; align-items: center; gap: 10px;
  color: #fff;
  font-family: 'Archivo Black', sans-serif;
  font-size: 18px; letter-spacing: 0.03em;
  margin-bottom: 14px;
}
.mf-brand .dot {
  width: 4px; height: 22px;
  background: linear-gradient(90deg, #22D3EE 0%, #8B5CF6 50%, #EC4899 100%);
  border-radius: 2px;
  box-shadow: 0 0 14px rgba(178,94,255,0.7);
}
.mf-tag {
  color: #22D3EE;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  margin-left: 8px;
}
.mf-blurb {
  font-size: 14px; line-height: 1.55;
  color: rgba(255,255,255,0.6);
  max-width: 380px; margin: 0;
}
.mf-col h5 {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  font-weight: 800;
  color: #B25EFF;
  margin: 0 0 16px;
}
.mf-col a {
  display: block;
  color: rgba(255,255,255,0.68);
  font-size: 13.5px;
  padding: 5px 0;
  text-decoration: none;
  transition: color 0.15s;
}
.mf-col a:hover { color: #22D3EE; }
.mf-tail {
  max-width: 1240px; margin: 48px auto 0;
  padding: 24px 32px 0;
  border-top: 1px solid #2B2B3D;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.05em;
  color: rgba(255,255,255,0.45);
}
.mf-tail a { color: #22D3EE; text-decoration: none; }