@media (max-width: 768px){
  .nav-links, .cta-nav{display:none}
  .hamburger{display:flex}
  .hero{padding:60px 0 40px}
  section{padding:60px 0}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
  .price-cols{grid-template-columns:1fr}
  .ctas{flex-direction:column;align-items:stretch}
  .ctas .btn, .btn{width:100%;text-align:center}
  .banner{padding:32px 20px}
  .pricing-card{padding:24px}
  .pathway-foot{flex-direction:column;align-items:stretch;gap:12px}
  .pathway-foot .btn{width:100%;text-align:center}
  .marquee-track{gap:24px}
  .taglines .row{gap:16px;font-size:.85rem}
  .container{padding:0 18px}
}
@media (max-width: 900px){
  .footer-grid{grid-template-columns:1fr 1fr}
  .testimonial-grid{grid-template-columns:1fr !important}
  .tier-grid{grid-template-columns:1fr !important}
}
@media (max-width: 560px){
  .footer-grid{grid-template-columns:1fr;gap:28px}
}
@media (max-width: 480px){
  h1{font-size:2rem}
  h2{font-size:1.55rem}
  .hero{padding:40px 0 30px}
  section{padding:46px 0}
  .stats{grid-template-columns:1fr;padding:24px}
  .card{padding:22px}
  .pricing-card{padding:20px}
  .nav-inner{padding:0 16px}
  .quiz-opt{padding:14px 16px;font-size:.92rem}
  .result-card{padding:24px}
  .slider-track{font-size:1.2rem;height:50px}
  .pill{font-size:.72rem}
  .container{padding:0 14px}
}
@media (max-width: 360px){
  h1{font-size:1.7rem}
  h2{font-size:1.35rem}
  .btn{padding:11px 18px;font-size:.88rem}
  .hero p.lead{font-size:1rem}
  .card .ico{width:42px;height:42px;font-size:1.4rem}
}

body, p, a, li, span, button, input, textarea, select{ font-family: 'Manrope', system-ui, -apple-system, sans-serif !important; }
h1, h2, h3, h4, h5, h6, .logo{ font-family: 'Sora', system-ui, -apple-system, sans-serif !important; }

/* Full-width hero banner on every non-home page, matching About us style.
   Title only on the image — pill/lead are hidden on the banner. */
body:not(.home) header.hero{
  position: relative !important;
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 360px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  overflow: hidden !important;
  background-image:
    linear-gradient(135deg, rgba(59,130,246,.78), rgba(124,58,237,.55)),
    url("assets/hero-tech-professionals.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
body:not(.home) header.hero > *{ position: relative; z-index: 2; }
body:not(.home) header.hero .pill,
body:not(.home) header.hero p.lead,
body:not(.home) header.hero .ctas{
  display: none !important;
}
body:not(.home) header.hero h1{
  color: #fff !important;
  font-size: clamp(2.4rem, 5.5vw, 4.2rem) !important;
  letter-spacing: -.02em;
  padding: 90px 24px !important;
  margin: 0 !important;
  max-width: 1100px;
}
body:not(.home) header.hero h1 em{ font-style: normal; color: #fde68a; }
@media (max-width: 768px){
  body:not(.home) header.hero{ min-height: 240px !important; }
  body:not(.home) header.hero h1{ padding: 60px 18px !important; }
}


/* =====================================================================
   LIGHT THEME OVERRIDE — white background sitewide
   ===================================================================== */
:root{
  --bg:#ffffff !important;
  --bg-2:#f6f8fc !important;
  --surface:#ffffff !important;
  --surface-2:#f4f6fb !important;
  --surface-3:#eef1f8 !important;
  --border:rgba(15,23,42,.10) !important;
  --border-2:rgba(15,23,42,.16) !important;
  --primary:#2563eb !important;
  --primary-2:#1d4ed8 !important;
  --primary-soft:rgba(37,99,235,.08) !important;
  --secondary:#ea580c !important;
  --accent:#ea580c !important;
  --accent-2:#c2410c !important;
  --text:#0f172a !important;
  --muted:#475569 !important;
  --muted-2:#64748b !important;
}

/* Page background + base text */
html, body{ background:#ffffff !important; color:#0f172a !important; }
body::before{ display:none !important; }
p, li, span, label, td, th, dd, dt{ color:#334155; }

/* Headings dark on light */
h1, h2, h3, h4, h5, h6{ color:#0f172a !important; }
.card h3, .stat .num, .slider-track{ color:#0f172a !important; }
.hero h1 em, .slider-item span{
  background:linear-gradient(135deg,#2563eb,#7c3aed) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}
.stat .num{
  background:linear-gradient(135deg,#0f172a,#2563eb) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}

/* Navigation — same dark blue as footer */
.nav{
  background:#0f172a !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
}
.logo, .nav-links > li > a{ color:#ffffff !important; }
.nav-links > li > a:hover{ background:rgba(255,255,255,.10) !important; color:#93c5fd !important; }
.hamburger{ border-color:rgba(255,255,255,.25) !important; }
.hamburger span{ background:#ffffff !important; }
.drawer{ background:#0f172a !important; }
.drawer a{ color:#ffffff !important; border-bottom-color:rgba(255,255,255,.10) !important; }
.drawer-close{ color:#ffffff !important; border-color:rgba(255,255,255,.25) !important; }
.drawer h4{ color:#94a3b8 !important; }

/* Buttons */
.btn-primary, .cta-nav{ background:#2563eb !important; color:#ffffff !important; }
.btn-primary:hover, .cta-nav:hover{ background:#1d4ed8 !important; }
.btn-ghost{ color:#0f172a !important; border-color:rgba(15,23,42,.18) !important; }
.btn-ghost:hover{ color:#2563eb !important; border-color:#2563eb !important; background:rgba(37,99,235,.06) !important; }

/* Cards / surfaces */
.card, .track-row, .pricing-card, .result-card, .module-tile,
.stats, .testimonial-card, .feature-block, .tier-card{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 4px 20px -8px rgba(15,23,42,.08) !important;
  color:#0f172a !important;
}
.card p, .track-body p, .pricing-card p, .module-tile p{ color:#475569 !important; }
.track-row figure::after, .track-row-reverse figure::after{ display:none !important; }

/* Pills / chips */
.pill, .chip{
  background:rgba(37,99,235,.08) !important;
  border-color:rgba(37,99,235,.22) !important;
  color:#1d4ed8 !important;
}
.chip-accent{
  background:rgba(234,88,12,.08) !important;
  border-color:rgba(234,88,12,.22) !important;
  color:#c2410c !important;
}

/* Banners (CTA) — keep colorful but readable */
.banner{
  background:#0f172a !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#ffffff !important;
}
.banner h2, .banner h3, .banner p{ color:#ffffff !important; }

/* Footer */
footer, .site-footer, .footer{
  background:#0f172a !important;
  color:#cbd5e1 !important;
}
footer h4, .site-footer h4{ color:#ffffff !important; }
footer a, .site-footer a{ color:#cbd5e1 !important; }
footer a:hover{ color:#ffffff !important; }

/* Hero overlay on inner pages — keep white title legible */
body:not(.home) header.hero h1{ color:#ffffff !important; }

/* Marquee / taglines strips */
.marquee, .taglines{ background:#f6f8fc !important; color:#0f172a !important; border-color:rgba(15,23,42,.08) !important; }

/* Inputs */
input, textarea, select{
  background:#ffffff !important;
  color:#0f172a !important;
  border:1px solid rgba(15,23,42,.18) !important;
}
input::placeholder, textarea::placeholder{ color:#94a3b8 !important; }

/* Quiz options */
.quiz-opt{ background:#ffffff !important; color:#0f172a !important; border:1px solid rgba(15,23,42,.12) !important; }
.quiz-opt:hover{ border-color:#2563eb !important; background:rgba(37,99,235,.04) !important; }

/* Headings bold; subtext/lead/paragraphs never bold */
h1, h2, h3, h4, h5, h6{ font-weight: 800 !important; }
p, .lead, .hero p, .hero .lead, .sub, .subtitle, .subhead, .eyebrow,
section p, .card p, .section-head p, .hero-sub, .pricing-card p,
.track-body p, .module-tile p, .feature-block p, .tier-card p,
.testimonial-card p, header.hero p{
  font-weight: 400 !important;
}

/* Major section intro headings — full-width primary blue band, heading only */
.section-head{
  background:#2563eb !important;
  color:#ffffff !important;
  padding:18px 28px !important;
  margin: 0 auto 36px !important;
  display:inline-block !important;
  width:auto !important;
  max-width:100% !important;
  border-radius: 14px !important;
  text-align:center !important;
  box-shadow: 0 4px 20px -8px rgba(37,99,235,.35);
}
section > .container > .section-head,
.container > .section-head{ display:block !important; width:fit-content !important; margin-left:auto !important; margin-right:auto !important; }
.section-head h1,
.section-head h2,
.section-head h3{
  display:none !important;
}
.section-head .pill{
  display:inline-block !important;
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  font-family: 'Sora', system-ui, -apple-system, sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(1.25rem, 2.2vw, 1.75rem) !important;
  letter-spacing: -.01em;
  padding: 0 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.15);
}
.section-head .pill .dot{ display:none !important; }
.section-head p,
.section-head .lead,
.section-head .sub,
.section-head .subtitle,
.section-head .subhead,
.section-head .eyebrow{
  display:none !important;
}
@media (max-width: 768px){
  .section-head{ padding:14px 20px !important; margin-bottom:24px !important; }
}

/* Testimonials auto-sliding marquee */
.testimonial-marquee{
  overflow: hidden;
  position: relative;
  padding: 8px 0 20px;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.testimonial-marquee .testimonial-track{
  display: flex;
  gap: 20px;
  width: max-content;
  animation: testimonial-scroll var(--tm-duration, 60s) linear infinite;
}
.testimonial-marquee:hover .testimonial-track{ animation-play-state: paused; }
.testimonial-marquee .testimonial{
  flex: 0 0 340px;
  width: 340px;
  display: flex;
  flex-direction: column;
}
@media (max-width: 768px){
  .testimonial-marquee .testimonial{ flex-basis: 82vw; width: 82vw; }
}
@keyframes testimonial-scroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* =====================================================================
   Flagship hero — keep text white on dark image background
   ===================================================================== */
.flagship-hero h1,
.flagship-hero h2,
.flagship-hero h3,
.flagship-hero h4,
.flagship-hero p,
.flagship-hero .tracks,
.flagship-hero .lead{ color:#ffffff !important; }
.flagship-hero .pill{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.35) !important;
  color:#ffffff !important;
}
.flagship-hero .pill .dot{ background:#ffffff !important; }
.flagship-hero .btn-ghost{
  color:#ffffff !important;
  border-color:rgba(255,255,255,.45) !important;
  background:transparent !important;
}
.flagship-hero .btn-ghost:hover{
  background:rgba(255,255,255,.10) !important;
  border-color:#ffffff !important;
  color:#ffffff !important;
}