/**
 * FUNDAAHE - Home Page Specific Styles
 * Fusion: Dark hero/CTA + Light content sections
 */

/* ===== NAVBAR TRANSPARENT ON HERO ===== */
#header {
  background: transparent !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#header.scrolled {
  background: rgba(10, 14, 26, 0.92) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom-color: rgba(3, 136, 138, 0.1);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3) !important;
}

html.light #header.scrolled {
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.06) !important;
  border-bottom-color: rgba(29, 78, 137, 0.08);
}

html.light #header.scrolled h1 {
  color: var(--teal) !important;
}

html.light #header.scrolled .navbar-link {
  color: #374151 !important;
}

html.light #header.scrolled .navbar-link:hover {
  color: var(--teal) !important;
}

html.light #header.scrolled button {
  color: #374151 !important;
}

main.pt-20 {
  padding-top: 0 !important;
}

/* ===== PARTICLE CANVAS ===== */
#particle-canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* ===== KEYFRAME ANIMATIONS ===== */
@keyframes text-reveal-up {
  from { transform: translateY(110%) skewY(4deg); opacity: 0; }
  to { transform: translateY(0) skewY(0deg); opacity: 1; }
}

@keyframes fade-in-up {
  from { transform: translateY(60px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes scale-in {
  from { transform: scale(0.8); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 20px var(--neon-teal-glow), 0 0 60px rgba(3,136,138,0.2); }
  50% { box-shadow: 0 0 40px var(--neon-teal-glow), 0 0 100px rgba(3,136,138,0.35); }
}

@keyframes text-glow {
  0%, 100% { text-shadow: 0 0 20px var(--neon-teal-glow), 0 0 40px rgba(3,136,138,0.15); }
  50% { text-shadow: 0 0 30px var(--neon-teal-glow), 0 0 80px rgba(3,136,138,0.3); }
}

@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes line-expand {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes hero-count-in {
  from { transform: translateY(30px) scale(0.8); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}

@keyframes scroll-bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(12px); }
  60% { transform: translateY(6px); }
}

@keyframes float-slow {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-30px) rotate(3deg); }
}

@keyframes scan-line {
  0% { top: -2px; }
  100% { top: 100%; }
}

@keyframes border-glow {
  0%, 100% { border-color: rgba(3,136,138,0.3); }
  50% { border-color: rgba(3,136,138,0.8); }
}

/* ===== HERO TEXT SYSTEM ===== */
.hero-line {
  overflow: hidden;
  display: block;
}

.hero-line > span {
  display: inline-block;
  transform: translateY(110%) skewY(4deg);
  opacity: 0;
  animation: text-reveal-up 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.hero-line:nth-child(1) > span { animation-delay: 0.2s; }
.hero-line:nth-child(2) > span { animation-delay: 0.4s; }
.hero-line:nth-child(3) > span { animation-delay: 0.6s; }
.hero-line:nth-child(4) > span { animation-delay: 0.8s; }

/* ===== HERO SECTION (Dark - neon impact) ===== */
.hero-section {
  background: var(--deep-navy);
}

.hero-neon-line {
  background: linear-gradient(90deg, transparent, #03888A, #4dc9cb, #03888A, transparent);
  box-shadow: 0 0 20px rgba(3,136,138,0.5), 0 0 60px rgba(3,136,138,0.2);
}

.hero-bg-img {
  filter: saturate(0.6) contrast(1.2);
}

.hero-vignette {
  background: radial-gradient(ellipse at center, transparent 40%, rgba(10,14,26,0.7) 100%);
}

.hero-eyebrow {
  animation: border-glow 3s ease-in-out infinite;
  background: rgba(3,136,138,0.05);
}

.hero-text-glow {
  animation: text-glow 4s ease-in-out infinite;
}

.hero-mega-btn {
  box-shadow: 0 0 30px var(--neon-teal-glow);
}

.hero-stat-box {
  min-width: 180px;
}

.hero-scroll-dot {
  animation: scroll-bounce 2s ease infinite;
}

/* ===== MARQUEE TICKER (Dark accent strip) ===== */
.marquee-bg {
  background: linear-gradient(135deg, #0a0e1a, #0d1525);
}

.marquee-container {
  overflow: hidden;
  white-space: nowrap;
}

.marquee-track {
  display: inline-flex;
  animation: marquee-scroll 30s linear infinite;
}

.marquee-container:hover .marquee-track {
  animation-play-state: paused;
}

.marquee-item {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding: 0 2rem;
  font-size: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.marquee-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ===== PILLARS SECTION ===== */
.pillars-bg {
  background: linear-gradient(180deg, #0a0e1a 0%, #0d1525 50%, #0a0e1a 100%);
}

.pillar-orb-teal {
  background: radial-gradient(circle, rgba(3,136,138,0.05) 0%, transparent 70%);
}

.pillar-orb-red {
  background: radial-gradient(circle, rgba(242,56,90,0.03) 0%, transparent 70%);
}

.pillar-card-v2 {
  position: relative;
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(29,78,137,0.15));
  border: 1px solid rgba(3,136,138,0.15);
  border-radius: 1.25rem;
  padding: 2.5rem 2rem;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.pillar-card-v2::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.pillar-card-v2::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--accent);
  opacity: 0;
  animation: scan-line 3s linear infinite;
  animation-play-state: paused;
}

.pillar-card-v2:hover {
  border-color: var(--accent);
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 25px 60px rgba(0,0,0,0.3), 0 0 30px color-mix(in srgb, var(--accent) 20%, transparent);
}

.pillar-card-v2:hover::before {
  transform: scaleX(1);
}

.pillar-card-v2:hover::after {
  animation-play-state: running;
  opacity: 0.3;
}

.pillar-card-v2 .card-number {
  font-size: 5rem;
  font-weight: 800;
  line-height: 1;
  opacity: 0.04;
  position: absolute;
  top: 0.5rem;
  right: 1.25rem;
  color: var(--accent);
  transition: opacity 0.5s;
}

.pillar-card-v2:hover .card-number {
  opacity: 0.1;
}

.pillar-icon-v2 {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}

.pillar-card-v2:hover .pillar-icon-v2 {
  transform: scale(1.15) rotate(-5deg);
  box-shadow: 0 0 25px color-mix(in srgb, var(--accent) 40%, transparent);
}

/* ===== NEWS SECTION ===== */
.news-bg {
  background: linear-gradient(180deg, #0a0e1a 0%, #0d1525 50%, #0a0e1a 100%);
}

.news-orb-red {
  background: radial-gradient(circle, rgba(242,56,90,0.04) 0%, transparent 70%);
}

.news-orb-teal {
  background: radial-gradient(circle, rgba(3,136,138,0.04) 0%, transparent 70%);
}

.news-card {
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(242,56,90,0.03));
}

.news-card:hover {
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

.text-gradient-red {
  background: linear-gradient(135deg, #F2385A, #ff6b8a);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ===== STATS SECTION (Dark - impact) ===== */
.stats-bg {
  background: linear-gradient(135deg, #071020, #0a0e1a);
}

.stats-img-filter {
  filter: hue-rotate(10deg);
}

/* ===== STATS GLOW BOXES (Dark section) ===== */
.stat-box {
  position: relative;
  background: linear-gradient(135deg, rgba(3,136,138,0.08), rgba(29,78,137,0.12));
  border: 1px solid rgba(3,136,138,0.2);
  border-radius: 1.25rem;
  padding: 2rem 1.5rem;
  text-align: center;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}

.stat-box::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  border: 1px solid transparent;
  background: linear-gradient(135deg, rgba(3,136,138,0.5), transparent, rgba(255,230,143,0.3)) border-box;
  mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  opacity: 0;
  transition: opacity 0.4s;
}

.stat-box:hover {
  transform: translateY(-6px);
  border-color: rgba(3,136,138,0.5);
  box-shadow: 0 20px 50px rgba(3,136,138,0.15), 0 0 30px rgba(3,136,138,0.08);
}

.stat-box:hover::before {
  opacity: 1;
}

/* ===== PROGRAMS SECTION ===== */
.programs-bg {
  background: linear-gradient(180deg, #0a0e1a, #0d1525);
}

.program-card-teal {
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(3,136,138,0.08));
}

.program-card-gold {
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(255,213,79,0.05));
}

.program-card-red {
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(242,56,90,0.05));
}

/* ===== ALLIES SECTION ===== */
.allies-bg {
  background: linear-gradient(180deg, #0d1525, #0a0e1a);
}

.ally-logo-wrapper {
  filter: grayscale(100%);
  opacity: 0.4;
  transition: all 0.3s ease;
}

.ally-logo-wrapper:hover {
  filter: grayscale(0%);
  opacity: 1;
}

.ally-card-v2 {
  background: linear-gradient(135deg, rgba(15,20,35,0.9), rgba(29,78,137,0.1));
  border: 1px solid rgba(3,136,138,0.1);
  border-radius: 1rem;
  padding: 1.5rem;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.ally-card-v2:hover {
  border-color: rgba(3,136,138,0.4);
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.25), 0 0 20px rgba(3,136,138,0.1);
}

.ally-card-v2 img {
  filter: brightness(0.85) contrast(1.1);
  transition: filter 0.4s;
}

.ally-card-v2:hover img {
  filter: brightness(1.1) contrast(1);
}

/* ===== CTA SECTION (Dark - neon impact) ===== */
.cta-bg-overlay {
  background: linear-gradient(135deg, #071020 0%, rgba(3,136,138,0.3) 50%, #071020 100%);
}

.cta-orb-teal {
  background: radial-gradient(circle, rgba(3,136,138,0.15) 0%, transparent 70%);
  animation: float-slow 10s ease-in-out infinite;
}

.cta-orb-gold {
  background: radial-gradient(circle, rgba(255,230,143,0.08) 0%, transparent 70%);
  animation: float-slow 14s ease-in-out infinite reverse;
}

.cta-badge {
  background: rgba(242,56,90,0.08);
}

.cta-btn-glow {
  box-shadow: 0 0 40px var(--neon-teal-glow), 0 20px 50px rgba(0,0,0,0.3);
  animation: glow-pulse 3s ease-in-out infinite;
}

/* ===== CONTACT SECTION ===== */
.contact-bg {
  background: linear-gradient(180deg, #0a0e1a, #0d1525);
}

.contact-glow,
.contact-card {
  position: relative;
  background: linear-gradient(135deg, rgba(10,14,26,0.95), rgba(29,78,137,0.1));
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 1.25rem;
  padding: 2.5rem 2rem;
  text-align: center;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}

.contact-glow::after,
.contact-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 3px;
  background: var(--c-accent, var(--teal, #03888A));
  transition: width 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 3px;
}

.contact-glow:hover,
.contact-card:hover {
  border-color: rgba(3,136,138,0.3);
  transform: translateY(-8px);
  box-shadow: 0 25px 60px rgba(0,0,0,0.2), 0 0 40px color-mix(in srgb, var(--c-accent, var(--teal, #03888A)) 15%, transparent);
}

.contact-glow:hover::after,
.contact-card:hover::after {
  width: 60%;
}

/* ===== UTILITY ANIMATIONS ===== */
.animate-fade-1 {
  animation: fade-in-up 0.8s ease-out forwards;
  animation-delay: 0.2s;
  opacity: 0;
}

.animate-fade-2 {
  animation: fade-in-up 0.8s ease-out forwards;
  animation-delay: 0.4s;
  opacity: 0;
}

.animate-fade-3 {
  animation: fade-in-up 0.8s ease-out forwards;
  animation-delay: 0.6s;
  opacity: 0;
}

.animate-fade-4 {
  animation: fade-in-up 0.8s ease-out forwards;
  animation-delay: 0.8s;
  opacity: 0;
}

/* Grain overlay */
.grain-overlay::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  opacity: 0.02;
  pointer-events: none;
  z-index: 100;
}

/* ===== HERO FADE ANIMATIONS ===== */
.hero-fade-1 {
  opacity: 0;
  animation: fade-in-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.9s forwards;
}

.hero-fade-2 {
  opacity: 0;
  animation: fade-in-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) 1.3s forwards;
}

.hero-fade-3 {
  opacity: 0;
  animation: fade-in-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) 1.5s forwards;
}

.hero-fade-4 {
  opacity: 0;
  animation: fade-in-up 0.6s ease 2.2s forwards;
}

/* ===== HERO MINI-STATS ===== */
.hero-stat {
  opacity: 0;
  animation: hero-count-in 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.hero-stat:nth-child(1) {
  animation-delay: 1.5s;
}

.hero-stat:nth-child(2) {
  animation-delay: 1.7s;
}

.hero-stat:nth-child(3) {
  animation-delay: 1.9s;
}

/* ===== MEGA BUTTON (Home) ===== */
.mega-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem 3rem;
  font-size: 1.125rem;
  font-weight: 700;
  border-radius: 0.875rem;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.mega-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent, rgba(255,255,255,0.1), transparent);
  transform: translateX(-100%);
  transition: transform 0.6s;
}

.mega-btn:hover::before {
  transform: translateX(100%);
}

.mega-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 40px rgba(3,136,138,0.3);
}

/* ============================================
   LIGHT MODE OVERRIDES
   ============================================ */

html.light .pillars-bg {
  background: linear-gradient(180deg, #E6F3F3 0%, #DCEEEE 50%, #E6F3F3 100%);
}

html.light .news-bg {
  background: linear-gradient(180deg, #F7EEF0 0%, #FCEEF1 50%, #F7EEF0 100%);
}

html.light .programs-bg {
  background: linear-gradient(180deg, #E8EFF7, #DCE9F2);
}

html.light .allies-bg {
  background: linear-gradient(180deg, #F5F1EE, #FAF7F5);
}

html.light .contact-bg {
  background: linear-gradient(180deg, #E6F3F3, #DCEEEE);
}

html.light .marquee-bg {
  background: linear-gradient(135deg, var(--navy), var(--navy-dark));
}

html.light .stats-bg {
  background: linear-gradient(135deg, var(--navy), var(--navy-dark));
}

html.light .cta-bg-overlay {
  background: linear-gradient(135deg, var(--navy-dark) 0%, rgba(3,136,138,0.4) 50%, var(--navy-dark) 100%);
}

html.light .pillar-card-v2 {
  background: linear-gradient(135deg, #E8F4F4, #E0EDED) !important;
  border-color: rgba(3,136,138,0.18) !important;
  box-shadow: 0 2px 12px rgba(3,136,138,0.1);
}

html.light .pillar-card-v2:hover {
  box-shadow: 0 15px 40px rgba(3,136,138,0.12);
  border-color: var(--accent) !important;
}

html.light .pillar-card-v2 .card-number {
  opacity: 0.08;
}

html.light .pillar-card-v2:hover .card-number {
  opacity: 0.15;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] {
  --accent: #B8860B !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .card-number {
  color: #B8860B !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .pillar-icon-v2 {
  background: rgba(184, 134, 11, 0.12) !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .pillar-icon-v2 i {
  color: #B8860B !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] a {
  color: #B8860B !important;
}

html.light .program-card-gold {
  background: linear-gradient(135deg, #FEFCF5, #FDF8EC) !important;
  border: 1px solid rgba(29,78,137,0.12) !important;
  box-shadow: 0 2px 8px rgba(29,78,137,0.06);
}

html.light .program-card-gold h3 {
  color: var(--navy) !important;
}

html.light .program-card-gold i {
  color: var(--navy) !important;
}

html.light .program-card-gold a,
html.light .program-card-gold span:not(.text-2xl) {
  color: var(--navy) !important;
}

html.light .program-card-gold .bg-\[\#FFD54F\]\/10 {
  background: rgba(29,78,137,0.08) !important;
}

html.light .program-card-gold .bg-gradient-to-r.from-\[\#FFD54F\] {
  background: linear-gradient(to right, var(--navy), var(--teal)) !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .card-number {
  color: #B8860B !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .pillar-icon-v2 {
  background: rgba(184, 134, 11, 0.12) !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] .pillar-icon-v2 i {
  color: #B8860B !important;
}

html.light .pillar-card-v2[style*="--accent: #FFD54F"] a {
  color: #B8860B !important;
}

html.light .contact-card[style*="--c-accent: #FFE68F"] {
  --c-accent: var(--navy) !important;
}

html.light .contact-card[style*="--c-accent: #FFE68F"] i {
  color: var(--navy) !important;
}

html.light .contact-card[style*="--c-accent: #FFE68F"] .bg-\[\#FFE68F\]\/10 {
  background: rgba(29,78,137,0.08) !important;
}

html.light .news-card {
  background: linear-gradient(135deg, #F7EEF0, #F2E8EA) !important;
  border-color: rgba(242,56,90,0.15) !important;
  box-shadow: 0 2px 8px rgba(242,56,90,0.08);
}

html.light .news-card:hover {
  box-shadow: 0 12px 30px rgba(242,56,90,0.12);
}

html.light .program-card-teal,
html.light .program-card-gold,
html.light .program-card-red {
  background: linear-gradient(135deg, #E8F4F4, #E0EDED) !important;
  border: 1px solid rgba(29,78,137,0.15) !important;
  box-shadow: 0 2px 8px rgba(29,78,137,0.08);
}

html.light .program-card-teal:hover,
html.light .program-card-gold:hover,
html.light .program-card-red:hover {
  box-shadow: 0 12px 30px rgba(29,78,137,0.12);
}

html.light .ally-card-v2 {
  background: linear-gradient(135deg, #F2EEEc, #EBE8E5) !important;
  border-color: rgba(29,78,137,0.15) !important;
  box-shadow: 0 2px 8px rgba(29,78,137,0.08);
}

html.light .ally-card-v2:hover {
  border-color: rgba(3,136,138,0.25) !important;
  box-shadow: 0 12px 30px rgba(29,78,137,0.12);
}

html.light .ally-card-v2 img {
  filter: brightness(1) contrast(1);
}

html.light .contact-glow,
html.light .contact-card {
  background: linear-gradient(135deg, #E8F4F4, #E0EDED) !important;
  border-color: rgba(3,136,138,0.15) !important;
  box-shadow: 0 2px 8px rgba(3,136,138,0.08);
}

html.light .contact-glow:hover,
html.light .contact-card:hover {
  box-shadow: 0 15px 40px rgba(29,78,137,0.08);
  border-color: rgba(3,136,138,0.2) !important;
}

html.light .pillars-bg .text-\[\#FFE68F\],
html.light .programs-bg .text-\[\#FFE68F\],
html.light .allies-bg .text-\[\#FFE68F\],
html.light .contact-bg .text-\[\#FFE68F\] {
  color: var(--navy) !important;
}

html.light .news-bg .text-\[\#FFE68F\] {
  color: var(--hot-pink) !important;
}

html.light .stat-box {
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.2) !important;
}

html.light .keep-dark .text-gradient {
  background: linear-gradient(135deg, #FFE68F, #FFD54F, #FFC107) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

html.light .pillar-orb-teal {
  background: radial-gradient(circle, rgba(3,136,138,0.04) 0%, transparent 70%);
}

html.light .pillar-orb-red {
  background: radial-gradient(circle, rgba(242,56,90,0.03) 0%, transparent 70%);
}

html.light .news-orb-red {
  background: radial-gradient(circle, rgba(242,56,90,0.03) 0%, transparent 70%);
}

html.light .news-orb-teal {
  background: radial-gradient(circle, rgba(3,136,138,0.03) 0%, transparent 70%);
}

html.light .mega-btn {
  box-shadow: 0 4px 15px rgba(3,136,138,0.25);
}

html.light .mega-btn:hover {
  box-shadow: 0 8px 25px rgba(3,136,138,0.35);
}

html.light .hero-mega-btn {
  box-shadow: 0 4px 20px rgba(3,136,138,0.3);
}

html.light .cta-btn-glow {
  box-shadow: 0 4px 25px rgba(3,136,138,0.3);
  animation: none;
}

html.light #allies-prev,
html.light #allies-next {
  background: rgba(29,78,137,0.05);
  border-color: rgba(29,78,137,0.1);
  color: var(--navy);
}

html.light #allies-prev:hover,
html.light #allies-next:hover {
  background: var(--teal);
  border-color: var(--teal);
  color: white;
}