/* ── WLP CAPITAL SHARED THEME ── */

/* Logo swap */
.logo .logo-dark  { display: block; }
.logo .logo-light { display: none; }
html.light-mode .logo .logo-dark,
body.light-mode .logo .logo-dark  { display: none; }
html.light-mode .logo .logo-light,
body.light-mode .logo .logo-light { display: block; }

/* Theme image slots */
.theme-img-light { display: none; }
.theme-img-dark  { display: block; }
html.light-mode .theme-img-light,
body.light-mode .theme-img-light { display: block; }
html.light-mode .theme-img-dark,
body.light-mode .theme-img-dark  { display: none; }

/* ── TRANSITIONS ── */
body, body * {
  transition: background-color 0.3s ease, color 0.3s ease,
              border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.reveal, .serve-card img, .sol-card, .trust-card::before {
  transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1),
              background-color 0.3s ease, border-color 0.3s ease !important;
}

/* ── LIGHT MODE TOKENS ── */
html.light-mode,
body.light-mode {
  --black:   #FAFAF8;
  --charcoal:#F0EDE6;
  --deep:    #F0EDE6;
  --surface: #E8E4DC;
  --border:  rgba(11,22,40,0.10);
  --white:   #0B1628;
  --muted:   #6B7280;
}
body.light-mode {
  background: #FAFAF8;
  color: #0B1628;
}

/* ── TYPOGRAPHY ── */
html.light-mode h1, body.light-mode h1,
html.light-mode h2, body.light-mode h2,
html.light-mode h3, body.light-mode h3,
html.light-mode h4, body.light-mode h4 { color: #0B1628; }
html.light-mode h1 em, body.light-mode h1 em,
html.light-mode h2 em, body.light-mode h2 em { color: #e2c87a; }
html.light-mode p, body.light-mode p,
html.light-mode li, body.light-mode li { color: #3D3D3D !important; }
html.light-mode .section-intro, body.light-mode .section-intro { color: #3D3D3D !important; }
html.light-mode .section-label, body.light-mode .section-label { color: #c9a84c; }
html.light-mode .eyebrow, body.light-mode .eyebrow { color: #c9a84c; }
html.light-mode .card-title, body.light-mode .card-title { color: #0B1628; }
html.light-mode .card-body, body.light-mode .card-body { color: #3D3D3D !important; }
html.light-mode .sol-title, body.light-mode .sol-title { color: #0B1628; }
html.light-mode .sol-body, body.light-mode .sol-body { color: #3D3D3D !important; }
html.light-mode .step-title, body.light-mode .step-title { color: #0B1628; }
html.light-mode .step-body, body.light-mode .step-body { color: #3D3D3D !important; }
html.light-mode .problem-list li, body.light-mode .problem-list li { color: #3D3D3D !important; }
html.light-mode .problem-list li::before, body.light-mode .problem-list li::before { color: #c9a84c; }
html.light-mode .body-text, body.light-mode .body-text { color: #3D3D3D !important; }

/* ── HERO — INDEX PAGE ONLY (body.page-index) ── */
body.page-index.light-mode #hero { background: transparent !important; }
body.page-index.light-mode #hero .bg { display: block !important; }
body.page-index.light-mode #hero .bg img.theme-img-light { filter: none !important; }
body.page-index.light-mode #hero .bg::after { display: none !important; }
body.page-index.light-mode .hero-content h1 { color: #FFFFFF !important; text-shadow: 0 2px 20px rgba(0,0,0,0.4); text-decoration: none !important; }
body.page-index.light-mode .hero-content h1 em { color: var(--gold-lt) !important; text-decoration: none !important; }
body.page-index.light-mode .hero-sub { color: rgba(255,255,255,0.85) !important; text-shadow: 0 1px 8px rgba(0,0,0,0.3); }
body.page-index.light-mode .conviction-line { color: rgba(201,168,76,0.60) !important; text-shadow: none; }
body.page-index.light-mode .scroll-hint { color: rgba(255,255,255,0.65); }
body.page-index.light-mode .scroll-hint::before { opacity: 0.5; }
/* Logo: white until scrolled, dark after */
body.page-index.light-mode header:not(.scrolled) .logo .logo-dark  { display: block; }
body.page-index.light-mode header:not(.scrolled) .logo .logo-light { display: none; }
body.page-index.light-mode header.scrolled .logo .logo-dark  { display: none; }
body.page-index.light-mode header.scrolled .logo .logo-light { display: block; }

/* ── NAV ── */
html.light-mode header:not(.scrolled) nav#main-nav a,
body.light-mode header:not(.scrolled) nav#main-nav a { color: rgba(245,243,239,0.85); }
html.light-mode header:not(.scrolled) nav#main-nav a:hover,
body.light-mode header:not(.scrolled) nav#main-nav a:hover { color: #e2c87a; }
html.light-mode header.scrolled,
body.light-mode header.scrolled {
  background: rgba(255,255,255,0.95) !important;
  border-color: #D4D0C8 !important;
  box-shadow: 0 1px 16px rgba(11,22,40,0.08);
}
html.light-mode header.scrolled nav#main-nav a,
body.light-mode header.scrolled nav#main-nav a { color: rgba(11,22,40,0.65); }
html.light-mode header.scrolled nav#main-nav a:hover,
body.light-mode header.scrolled nav#main-nav a:hover,
html.light-mode header.scrolled nav#main-nav a.active,
body.light-mode header.scrolled nav#main-nav a.active { color: #c9a84c; }
html.light-mode .hamburger span,
body.light-mode .hamburger span { background: #0B1628; }
html.light-mode .mobile-menu,
body.light-mode .mobile-menu { background: rgba(250,250,248,0.97); }
html.light-mode .mobile-menu a,
body.light-mode .mobile-menu a { color: #0B1628; }

/* ── CARDS ── */
html.light-mode .trust-card,
body.light-mode .trust-card {
  background: #FFFFFF;
  border: 1px solid #D4D0C8;
  box-shadow: 0 2px 12px rgba(11,22,40,0.06);
}
html.light-mode .trust-grid,
body.light-mode .trust-grid {
  background: transparent;
  border-color: #D4D0C8;
  gap: 2px;
}
html.light-mode .trust-card:hover,
body.light-mode .trust-card:hover {
  background: #F0EDE6 !important;
  border-color: #B8B4AC !important;
  box-shadow: 0 4px 24px rgba(11,22,40,0.10) !important;
}
html.light-mode .trust-card:hover .card-title,
body.light-mode .trust-card:hover .card-title { color: #0B1628 !important; }
html.light-mode .trust-card:hover .card-body,
body.light-mode .trust-card:hover .card-body { color: #3D3D3D !important; }
html.light-mode .trust-card:hover .card-num,
body.light-mode .trust-card:hover .card-num { opacity: 0.35; }
html.light-mode .sol-card,
body.light-mode .sol-card {
  background: #FFFFFF !important;
  border: 1px solid #D4D0C8 !important;
  box-shadow: 0 2px 12px rgba(11,22,40,0.06) !important;
}
html.light-mode .sol-card:hover,
body.light-mode .sol-card:hover {
  background: #F0EDE6 !important;
  border-color: #B8B4AC !important;
  box-shadow: 0 4px 24px rgba(11,22,40,0.10) !important;
  transform: translateY(-4px);
}
html.light-mode .sol-card:hover .sol-title,
body.light-mode .sol-card:hover .sol-title { color: #0B1628 !important; }
html.light-mode .sol-card:hover .sol-body,
body.light-mode .sol-card:hover .sol-body { color: #3D3D3D !important; }
html.light-mode .step,
body.light-mode .step { border-bottom-color: #D4D0C8; }
html.light-mode .card-num,
body.light-mode .card-num { color: #c9a84c; opacity: 0.35; }
html.light-mode #team .trust-card,
body.light-mode #team .trust-card { background: #FFFFFF; }

/* ── SERVE CARDS ── */
html.light-mode .serve-card-body,
body.light-mode .serve-card-body {
  background: linear-gradient(to top, rgba(8,8,8,0.92) 0%, rgba(8,8,8,0.45) 50%, transparent 100%);
}
html.light-mode .serve-title,
body.light-mode .serve-title { color: #FFFFFF !important; text-shadow: 0 1px 8px rgba(0,0,0,0.5); }
html.light-mode .serve-tag,
body.light-mode .serve-tag { color: #c9a84c; }

/* ── RESULTS BOX ── */
html.light-mode .stats-box,
body.light-mode .stats-box {
  background: #FFFFFF !important;
  border-color: #D4D0C8 !important;
  box-shadow: 0 2px 16px rgba(11,22,40,0.07);
}
html.light-mode #results [style*="border-right:1px solid var(--border)"],
body.light-mode #results [style*="border-right:1px solid var(--border)"] { border-right-color: #D4D0C8 !important; }

/* ── FORMS ── */
html.light-mode input, body.light-mode input,
html.light-mode textarea, body.light-mode textarea,
html.light-mode select, body.light-mode select {
  background: #FFFFFF;
  border-color: #D4D0C8;
  color: #0B1628;
}
html.light-mode input::placeholder, body.light-mode input::placeholder,
html.light-mode textarea::placeholder, body.light-mode textarea::placeholder { color: rgba(11,22,40,0.30); }
html.light-mode label, body.light-mode label { color: #6B7280; }
html.light-mode input:focus, body.light-mode input:focus,
html.light-mode textarea:focus, body.light-mode textarea:focus { border-color: #c9a84c; }
html.light-mode .contact-info, body.light-mode .contact-info { color: #3D3D3D !important; }
html.light-mode .contact-detail p, body.light-mode .contact-detail p { color: #3D3D3D !important; }
html.light-mode .contact-detail span, body.light-mode .contact-detail span { color: #c9a84c; }

/* Contact qualification box */
html.light-mode form > div[style*="border:1px solid"],
body.light-mode form > div[style*="border:1px solid"] {
  background: #FFFFFF !important;
  border-color: rgba(201,168,76,0.4) !important;
}
html.light-mode form > div[style*="border:1px solid"] p,
body.light-mode form > div[style*="border:1px solid"] p { color: #0B1628 !important; }
html.light-mode form > div[style*="border:1px solid"] strong,
body.light-mode form > div[style*="border:1px solid"] strong { color: #0B1628 !important; }
html.light-mode form > div[style*="border:1px solid"] em,
body.light-mode form > div[style*="border:1px solid"] em { color: rgba(11,22,40,0.55) !important; }

/* Entry pills */
html.light-mode [style*="border:1px solid rgba(201,168,76,.3)"],
body.light-mode [style*="border:1px solid rgba(201,168,76,.3)"] {
  border-color: rgba(201,168,76,0.4) !important;
  color: #3D3D3D !important;
  background: rgba(201,168,76,0.06);
}

/* ── FOOTER ── */
html.light-mode footer, body.light-mode footer { background: #EEEBE3; border-top-color: #D4D0C8; }
html.light-mode .footer-brand p, body.light-mode .footer-brand p { color: #6B7280; }
html.light-mode .footer-col h4, body.light-mode .footer-col h4 { color: #c9a84c; }
html.light-mode .footer-col a, body.light-mode .footer-col a { color: #6B7280; }
html.light-mode .footer-col a:hover, body.light-mode .footer-col a:hover { color: #0B1628; }
html.light-mode .footer-links a, body.light-mode .footer-links a { color: rgba(11,22,40,0.40); }
html.light-mode .footer-links a:hover, body.light-mode .footer-links a:hover { color: #0B1628; }
html.light-mode .disclaimer, body.light-mode .disclaimer { color: rgba(11,22,40,0.40); }
html.light-mode .footer-disc, body.light-mode .footer-disc { color: rgba(11,22,40,0.40); }

/* ── BUTTONS ── */
html.light-mode .btn:hover, body.light-mode .btn:hover { color: #080808; }
html.light-mode .btn-solid, body.light-mode .btn-solid { color: #080808; }
html.light-mode .btn-solid:hover, body.light-mode .btn-solid:hover { color: #080808; }
html.light-mode .mobile-cta:hover, body.light-mode .mobile-cta:hover { color: #080808; }

/* ── THEME TOGGLE SWITCH ── */
.theme-toggle {
  display: flex; align-items: center;
  background: none; border: none; cursor: pointer;
  padding: 0; margin: 0;
}
.theme-toggle-track {
  position: relative;
  width: 44px; height: 24px;
  border-radius: 12px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.15);
  transition: background 0.3s ease, border-color 0.3s ease !important;
  flex-shrink: 0;
}
html.light-mode .theme-toggle-track,
body.light-mode .theme-toggle-track {
  background: rgba(11,22,40,0.08);
  border-color: rgba(11,22,40,0.18);
}
.theme-toggle-thumb {
  position: absolute;
  top: 3px; left: 3px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #c9a84c;
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.3s ease !important;
}
html.light-mode .theme-toggle-thumb,
body.light-mode .theme-toggle-thumb { transform: translateX(20px); }
.theme-toggle-thumb svg { width: 10px; height: 10px; fill: #080808; }
.icon-sun  { display: none; }
.icon-moon { display: block; }
html.light-mode .icon-sun,  body.light-mode .icon-sun  { display: block; }
html.light-mode .icon-moon, body.light-mode .icon-moon { display: none; }
