/* ==========================================================================
   Shahriar Biography — light mode (v6.3.0)
   Loaded after the Earth edition's dark glass overrides. The toggle sets
   `light-mode` on <html>; everything below re-themes via variables plus
   targeted overrides where the dark edition hard-codes colors.
   ========================================================================== */

html.light-mode {
  background: #f5f1ec;
  color-scheme: light;
  --ink: #171514;
  --ink-soft: #383330;
  --muted: #514b47;
  --paper: #f5f1ec;
  --paper-white: #fffdfa;
  --line: rgba(31, 24, 20, .14);
  --accent: #4c7a4f;
  --accent-deep: #2f4a32;
  --amber: #b97f2a;
  --card: rgba(255, 253, 250, .72);
  --card-solid: rgba(255, 253, 250, .94);
  --shadow: 0 24px 60px rgba(35, 25, 20, .12);
  --glass-bg: rgba(255, 253, 250, .72);
  --glass-border: 1px solid rgba(31, 24, 20, .12);
  --glass-blur: blur(16px);
  --glass-shadow: 0 18px 50px rgba(35, 25, 20, .12), inset 0 1px 0 rgba(255, 255, 255, .6);
}
html.light-mode body { color: var(--ink); }
html.light-mode ::selection { background: #4c7a4f; color: #fff; }

/* The globe becomes a whisper behind a paper page */
html.light-mode.earth-ready #earth-canvas { opacity: .1 !important; }
html.light-mode #earth-labels { opacity: .35; }
html.light-mode.no-webgl .earth-fallback {
  background:
    radial-gradient(circle at 50% 118%, #cfe0c2 0 28%, #a9c193 29% 33%, rgba(111, 149, 98, .25) 34%, transparent 46%),
    radial-gradient(ellipse at 50% 0%, #f5f1ec, #e9e2d6 70%);
}

/* ---------- header & nav ---------- */
html.light-mode .site-header {
  background: rgba(255, 253, 250, .88) !important;
  border-bottom: 1px solid rgba(31, 24, 20, .1) !important;
}
html.light-mode .brand-text strong { color: #171514; }
html.light-mode .menu-toggle { color: #171514; border-color: rgba(31, 24, 20, .3); }
html.light-mode .main-nav a:hover, html.light-mode .main-nav a:focus-visible {
  background: rgba(31, 24, 20, .06) !important;
}

/* ---------- typography ---------- */
html.light-mode main h1, html.light-mode main h2, html.light-mode main h3,
html.light-mode main h4, html.light-mode main strong, html.light-mode main b,
html.light-mode .career-card .career-copy strong, html.light-mode .facts .fact strong,
html.light-mode .brand-text strong { color: #171514 !important; }
html.light-mode .hero h1 { text-shadow: none; }

/* ---------- buttons ---------- */
html.light-mode .button-primary, html.light-mode .nav-cta, html.light-mode .closing-action .button {
  background: #4c7a4f !important; color: #fff !important; border: 0 !important;
}
html.light-mode .button-primary .arrow, html.light-mode .nav-cta .arrow,
html.light-mode .closing-action .button .arrow { color: #fff !important; }
html.light-mode .button-quiet {
  background: rgba(31, 24, 20, .05) !important; color: #171514 !important;
  border: 1px solid rgba(31, 24, 20, .28) !important;
}
html.light-mode .button-quiet:hover { background: rgba(31, 24, 20, .1) !important; }
html.light-mode .story-photo-label {
  background: rgba(185, 127, 42, .14) !important; color: #6b4d1a !important; border: 0 !important;
}

/* ---------- chips & icons ---------- */
html.light-mode .story-facts span, html.light-mode .career-employers a,
html.light-mode .social-links a, html.light-mode .community-tags span,
html.light-mode .chapter-index-grid a {
  background: rgba(31, 24, 20, .05) !important;
  border: 1px solid rgba(31, 24, 20, .14) !important;
}
html.light-mode .chapter-index-grid a:hover, html.light-mode .career-employers a:hover,
html.light-mode .social-links a:hover {
  background: rgba(76, 122, 79, .12) !important; border-color: rgba(76, 122, 79, .45) !important;
}
html.light-mode .heading-icon, html.light-mode .heading-icon-sm, html.light-mode .fact-icon,
html.light-mode .step-icon, html.light-mode .cert-icon, html.light-mode .career-symbol,
html.light-mode .aspiration-emblem svg {
  background: rgba(76, 122, 79, .12) !important;
  border: 1px solid rgba(76, 122, 79, .3) !important;
}
html.light-mode .education-panel .degree { background: rgba(31, 24, 20, .04) !important; }

/* ---------- portrait & community ---------- */
html.light-mode .portrait-card { background: rgba(255, 253, 250, .6) !important; }
html.light-mode .portrait-caption { background: rgba(255, 253, 250, .85) !important; }
html.light-mode .community-board::after {
  background: linear-gradient(90deg, rgba(245, 241, 236, .94) 0%, rgba(245, 241, 236, .62) 55%, rgba(245, 241, 236, .18) 100%) !important;
}
html.light-mode .photo-mosaic figure { border-color: rgba(31, 24, 20, .1) !important; }

/* ---------- premium layer in light ---------- */
html.light-mode #preloader {
  background: radial-gradient(120% 120% at 50% 20%, #faf7f1 0%, #e9e2d6 70%);
}
html.light-mode .preloader-name { color: #171514; }
html.light-mode .preloader-sub { color: #4c7a4f; }
html.light-mode .preloader-bar { background: rgba(31, 24, 20, .14); }
html.light-mode .preloader-bar span { background: linear-gradient(90deg, #4c7a4f, #b97f2a); }
html.light-mode .marquee { border-color: rgba(31, 24, 20, .14); }
html.light-mode .marquee-track span { color: rgba(23, 21, 20, .45); }
html.light-mode .chapter-dot span { border-color: rgba(31, 24, 20, .4); }
html.light-mode .chapter-dot:hover span { border-color: #b97f2a; }
html.light-mode .chapter-dot.is-active span {
  background: #b97f2a; border-color: #b97f2a; box-shadow: 0 0 12px rgba(185, 127, 42, .6);
}
html.light-mode .stats-inner {
  background: rgba(255, 253, 250, .72); border-color: rgba(31, 24, 20, .12);
}
html.light-mode .stat strong {
  background: linear-gradient(120deg, #2f4a32, #4c7a4f 60%, #b97f2a);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
html.light-mode .stat span { color: rgba(23, 21, 20, .6); }
html.light-mode .testimonial-card {
  background: rgba(255, 253, 250, .72); border-color: rgba(31, 24, 20, .12);
}
html.light-mode .testimonial-card blockquote { color: #383330; }
html.light-mode .testimonial-card figcaption { color: #4c7a4f; }
html.light-mode .testimonial-card:hover { border-color: rgba(185, 127, 42, .45); }
html.light-mode .career-timeline::before {
  background: linear-gradient(180deg, transparent, rgba(76, 122, 79, .45) 12%, rgba(76, 122, 79, .45) 88%, transparent);
}
html.light-mode .timeline-marker {
  background: #fffdfa; border-color: #4c7a4f; box-shadow: 0 0 14px rgba(76, 122, 79, .5);
}
html.light-mode .timeline-item.is-visible .timeline-card { border-color: rgba(185, 127, 42, .4); }
html.light-mode #to-top {
  background: rgba(255, 253, 250, .85); border-color: rgba(31, 24, 20, .2); color: #171514;
}
html.light-mode #to-top:hover { border-color: #b97f2a; color: #b97f2a; }
html.light-mode .note-card {
  background: rgba(255, 253, 250, .72); border-color: rgba(31, 24, 20, .12);
}
html.light-mode .note-card time { color: #4c7a4f; }
html.light-mode .contact-form input, html.light-mode .contact-form textarea {
  background: rgba(255, 253, 250, .8); border-color: rgba(31, 24, 20, .2); color: #171514;
}
html.light-mode .contact-form label span { color: #514b47; }
html.light-mode ::-webkit-scrollbar-track { background: #f5f1ec; }
html.light-mode ::-webkit-scrollbar-thumb { border-color: #f5f1ec; }

/* theme toggle icon swap */
#theme-toggle .icon-sun { display: none; }
html.light-mode #theme-toggle .icon-sun { display: block; }
html.light-mode #theme-toggle .icon-moon { display: none; }

/* ---------- v6.4.0 additions ---------- */
html.light-mode .aurora { opacity: .32; }
html.light-mode .win-card, html.light-mode .service-card, html.light-mode .faq-item {
  background: rgba(255, 253, 250, .72); border-color: rgba(31, 24, 20, .12);
}
html.light-mode .win-card p:last-child, html.light-mode .service-card p, html.light-mode .faq-item p { color: #514b47; }
html.light-mode .win-metric {
  background: linear-gradient(120deg, #4c7a4f, #b97f2a);
  -webkit-background-clip: text; background-clip: text;
}
html.light-mode .service-num { color: #b97f2a; }
html.light-mode .marquee-label { color: rgba(23, 21, 20, .5); }
html.light-mode .marquee-logos .marquee-track span { color: rgba(23, 21, 20, .42); }
html.light-mode .marquee-logos .marquee-track span:hover { color: #b97f2a; }
html.light-mode .faq-icon { color: #b97f2a; }
html.light-mode #pin-popup {
  background: rgba(255, 253, 250, .96); border-color: rgba(185, 127, 42, .5);
}
html.light-mode #pin-popup h3 { color: #b97f2a; }
html.light-mode #pin-popup p { color: #383330; }
html.light-mode .pin-popup-close { color: #514b47; }
html.light-mode .pin-popup-close:hover { color: #171514; }
html.light-mode #ask-fab {
  background: linear-gradient(135deg, #fffdfa, #efe8db); color: #b97f2a;
  border-color: rgba(185, 127, 42, .55);
  box-shadow: 0 10px 30px rgba(35, 25, 20, .18), 0 0 18px rgba(185, 127, 42, .2);
}
html.light-mode #ask-panel {
  background: rgba(255, 253, 250, .97); border-color: rgba(31, 24, 20, .16);
}
html.light-mode .ask-head { border-color: rgba(31, 24, 20, .1); }
html.light-mode .ask-close { color: #514b47; }
html.light-mode .ask-close:hover { color: #171514; }
html.light-mode .ask-msg.bot { background: rgba(76, 122, 79, .1); border-color: rgba(76, 122, 79, .25); color: #171514; }
html.light-mode .ask-msg.user { background: rgba(185, 127, 42, .14); border-color: rgba(185, 127, 42, .4); color: #4a3413; }
html.light-mode .ask-chip { background: rgba(76, 122, 79, .08); border-color: rgba(76, 122, 79, .3); color: #2f4a32; }
html.light-mode .ask-chip:hover { background: rgba(185, 127, 42, .14); border-color: rgba(185, 127, 42, .5); color: #4a3413; }
html.light-mode .ask-form { border-color: rgba(31, 24, 20, .1); }
html.light-mode .ask-form input { background: rgba(255, 253, 250, .9); border-color: rgba(31, 24, 20, .2); color: #171514; }
html.light-mode .ask-form input:focus { border-color: #b97f2a; }
html.light-mode .qr-block figcaption { color: rgba(23, 21, 20, .55); }

/* ---------- v6.5.0 additions ---------- */
html.light-mode .hero-role { color: #171514 !important; text-shadow: none; }
html.light-mode .section-heading .display, html.light-mode .cta-inner h2 { text-shadow: none; }
html.light-mode .hero-keywords { color: rgba(23, 21, 20, .72); }
html.light-mode .kw-label { color: rgba(23, 21, 20, .5); }
html.light-mode .rot-word { color: #b97f2a; text-shadow: none; }
html.light-mode .supply-leg, html.light-mode .exp-card, html.light-mode .project-card,
html.light-mode .capm-wrap, html.light-mode .cta-inner {
  background: rgba(255, 253, 250, .72); border-color: rgba(31, 24, 20, .12);
}
html.light-mode .cta-inner { box-shadow: 0 18px 50px rgba(35, 25, 20, .12); }
html.light-mode .supply-leg strong, html.light-mode .exp-card h3,
html.light-mode .project-card h3, html.light-mode .cta-inner h2,
html.light-mode .capm-matrix tbody th { color: #171514; }
html.light-mode .supply-leg span, html.light-mode .exp-caption,
html.light-mode .project-facts dd, html.light-mode .capm-matrix tbody td,
html.light-mode .cta-inner p, html.light-mode .career-legacy { color: #514b47; }
html.light-mode .project-facts dt { color: #4c7a4f; }
html.light-mode .project-facts > div:last-child dt { color: #b97f2a; }
html.light-mode .capm-matrix thead th { color: #b97f2a; border-color: rgba(185, 127, 42, .4); }
html.light-mode .capm-matrix tbody tr { border-color: rgba(31, 24, 20, .08); }
html.light-mode .capm-matrix tbody tr:hover { background: rgba(31, 24, 20, .03); }
html.light-mode .leg-dot {
  background: #b97f2a;
  box-shadow: 0 0 0 5px rgba(185, 127, 42, .14), 0 0 14px rgba(185, 127, 42, .5);
}
html.light-mode .supply-leg:not(:last-child)::after { color: #b97f2a; }
html.light-mode .contact-card { background: rgba(31, 24, 20, .04); border-color: rgba(31, 24, 20, .12); }
html.light-mode .cc-name, html.light-mode .cc-role { color: #171514 !important; }
html.light-mode .cc-nick { color: #b97f2a; }
html.light-mode .cc-tag { color: #514b47; }
html.light-mode .cc-rows { border-color: rgba(31, 24, 20, .12); }
html.light-mode .cc-rows li > span { color: rgba(23, 21, 20, .5); }
html.light-mode .cc-rows a { color: #2f4a32; }
html.light-mode .geo-label {
  background: rgba(255, 253, 250, .88); border-color: rgba(185, 127, 42, .55);
  color: #6b4d1a; box-shadow: 0 0 14px rgba(185, 127, 42, .25);
}