/* ── UPRISE SHARED STYLES ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --brand: #3E3F94;
  --brand-dark: #2B2C6B;
  --brand-10: rgba(62,63,148,0.10);
  --brand-5: rgba(62,63,148,0.05);
  --accent-blue: #60A5FA;
  --accent-blue-20: rgba(96,165,250,0.20);
  --accent-purple: #818CF8;
  --accent-purple-20: rgba(129,140,248,0.20);
  --accent-purple-5: rgba(129,140,248,0.05);
  --light-blue: #EFF6FF;
  --light-blue-2: #DBEAFE;
  --light-blue-3: #F8FAFF;
  --blue-accent: #60A5FA;
  --section-bg: rgb(249,250,251);
  --gray-50: #F9FAFB;
  --gray-100: #F3F4F6;
  --gray-200: #E5E7EB;
  --gray-300: #D1D5DB;
  --gray-400: #9CA3AF;
  --gray-500: #6B7280;
  --gray-600: #4B5563;
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;
  --white: #FFFFFF;
}

html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', sans-serif;
  background: var(--white);
  color: var(--gray-600);
  overflow-x: hidden;
  line-height: 1.6;
}
h1,h2,h3,h4 { font-family: 'Nunito', sans-serif; font-weight: 800; line-height: 1.2; }

/* ── NAVBAR ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  padding: 0 40px; height: 68px;
  display: flex; align-items: center; justify-content: space-between;
  transition: background 0.4s, backdrop-filter 0.4s, border-color 0.4s;
}
nav.scrolled, nav.solid {
  background: rgba(249,250,251,0.95);
  backdrop-filter: blur(24px);
  border-bottom: 1px solid rgba(62,63,148,0.08);
}
.nav-logo a { display: flex; align-items: center; }
.nav-logo img { height: 44px; width: auto; }
.nav-center { display: flex; align-items: center; gap: 0; }

/* Nav items */
.nav-item { position: relative; }
.nav-item > a, .nav-item > button {
  color: var(--gray-500); text-decoration: none;
  font-size: 14px; font-weight: 500;
  padding: 8px 14px; border-radius: 8px; border: none;
  background: none; cursor: pointer; font-family: 'Inter', sans-serif;
  display: flex; align-items: center; gap: 5px; white-space: nowrap;
  transition: color 0.18s, background 0.18s;
}
.nav-item > a:hover, .nav-item > button:hover {
  color: var(--white); background: linear-gradient(135deg, #3E3F94, #60A5FA);
}
.nav-chevron {
  display: inline-block; width: 0; height: 0;
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid currentColor; opacity: 0.55;
  transition: transform 0.2s; flex-shrink: 0; margin-top: 1px;
}
.nav-item:hover .nav-chevron { transform: rotate(180deg); }
.nav-sep { width: 1px; height: 20px; background: var(--gray-200); margin: 0 4px; }

/* Mega dropdown */
.nav-dropdown {
  position: absolute; top: calc(100% + 4px); left: 50%;
  transform: translateX(-50%) translateY(-6px);
  background: var(--white); border: 1px solid var(--gray-200);
  border-radius: 16px; padding: 8px; min-width: 220px;
  opacity: 0; pointer-events: none;
  transition: opacity 0.18s, transform 0.18s;
  box-shadow: 0 20px 60px rgba(0,0,0,0.1), 0 0 0 1px rgba(62,63,148,0.04);
}
.nav-dropdown::before {
  content: ''; position: absolute; bottom: 100%;
  left: -20px; right: -20px; height: 8px;
}
.nav-item:hover .nav-dropdown {
  opacity: 1; pointer-events: all; transform: translateX(-50%) translateY(0);
}
.nav-dropdown-header {
  font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--gray-400); padding: 6px 12px 4px; font-family: 'Nunito', sans-serif;
}
.nav-dropdown-divider { height: 1px; background: var(--gray-200); margin: 4px 0; }
.nav-dropdown a {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 10px; text-decoration: none;
  color: var(--gray-600); font-size: 13px;
  transition: background 0.14s, color 0.14s;
}
.nav-dropdown a:hover { background: linear-gradient(135deg, #3E3F94, #60A5FA); color: var(--white); }
.nav-dropdown a:hover .dd-icon-wrap { background: rgba(255,255,255,0.2); border-color: rgba(255,255,255,0.15); }
.nav-dropdown a:hover .dd-text strong { color: var(--white); }
.nav-dropdown a:hover .dd-text span { color: rgba(255,255,255,0.75); }
.dd-icon-wrap {
  width: 32px; height: 32px; border-radius: 9px; flex-shrink: 0;
  background: var(--brand-5); border: 1px solid var(--brand-10);
  display: flex; align-items: center; justify-content: center; font-size: 15px;
  transition: background 0.14s;
}
.dd-text strong { display: block; font-size: 13px; font-weight: 700; color: var(--gray-900); font-family: 'Nunito', sans-serif; line-height: 1.2; }
.dd-text span { font-size: 11px; color: var(--gray-500); line-height: 1; }

.nav-right { display: flex; align-items: center; gap: 8px; }
.nav-login {
  color: var(--gray-500); text-decoration: none; font-size: 13px; font-weight: 500;
  padding: 8px 14px; border-radius: 8px; border: 1px solid var(--gray-200);
  transition: color 0.18s, background 0.18s, border-color 0.18s;
}
.nav-login:hover { color: var(--white); border-color: transparent; background: linear-gradient(135deg, #3E3F94, #60A5FA); }
.nav-cta {
  background: linear-gradient(135deg, #3E3F94, #60A5FA);
  color: var(--white); padding: 8px 20px; border-radius: 50px; font-weight: 800;
  font-size: 13px; text-decoration: none; font-family: 'Nunito', sans-serif;
  transition: opacity 0.18s, transform 0.18s; box-shadow: 0 4px 16px rgba(62,63,148,0.3);
}
.nav-cta:hover { opacity: 0.88; transform: translateY(-1px); }

/* ── PAGE HEADER ── */
.page-header {
  padding: 140px 48px 80px;
  background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
  text-align: center;
}
.page-header .section-label { margin-bottom: 16px; display: inline-block; }
.page-header h1 { font-size: clamp(2.2rem, 5vw, 3.8rem); margin-bottom: 20px; color: var(--gray-800); }
.page-header p { color: var(--gray-500); max-width: 560px; margin: 0 auto; font-size: 1.1rem; }

/* ── UTILITIES ── */
.section-label {
  display: inline-block; font-family: 'Nunito', sans-serif; font-weight: 700;
  font-size: 12px; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--brand); background: var(--brand-10);
  padding: 5px 14px; border-radius: 50px;
}
.btn-primary {
  background: linear-gradient(135deg, var(--brand) 0%, var(--accent-blue) 100%);
  color: var(--white); padding: 14px 32px; border-radius: 50px;
  font-family: 'Nunito', sans-serif; font-weight: 800; font-size: 15px;
  text-decoration: none; display: inline-block;
  box-shadow: 0 8px 32px rgba(62,63,148,0.3);
  transition: transform 0.2s, box-shadow 0.2s; border: none; cursor: pointer;
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 40px rgba(62,63,148,0.4); }
.btn-ghost {
  background: var(--white); border: 1px solid var(--gray-200);
  color: var(--gray-600); padding: 10px 22px; border-radius: 50px;
  font-family: 'Nunito', sans-serif; font-weight: 700; font-size: 14px;
  text-decoration: none; display: inline-block;
  transition: background 0.2s, border-color 0.2s; cursor: pointer;
}
.btn-ghost:hover { background: var(--brand-5); border-color: var(--brand); }
.tag {
  display: inline-block; font-size: 11px; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 4px 12px; border-radius: 50px;
  font-family: 'Nunito', sans-serif;
}
.tag-blue { background: var(--accent-blue-20); color: var(--brand); }
.tag-yellow { background: var(--accent-purple-20); color: var(--accent-purple); }
.tag-purple { background: var(--brand-10); color: var(--brand); }
.tag-green { background: var(--accent-purple-5); color: var(--gray-700); }

/* ── SCROLL REVEAL ── */
.reveal { opacity:0; transform:translateY(28px); transition: opacity 0.65s cubic-bezier(.22,1,.36,1), transform 0.65s cubic-bezier(.22,1,.36,1); }
.reveal.visible { opacity:1; transform:none; }
.reveal-left { opacity:0; transform:translateX(-28px); transition: opacity 0.65s cubic-bezier(.22,1,.36,1), transform 0.65s cubic-bezier(.22,1,.36,1); }
.reveal-left.visible { opacity:1; transform:none; }
.reveal-right { opacity:0; transform:translateX(28px); transition: opacity 0.65s cubic-bezier(.22,1,.36,1), transform 0.65s cubic-bezier(.22,1,.36,1); }
.reveal-right.visible { opacity:1; transform:none; }
.delay-1{transition-delay:.1s} .delay-2{transition-delay:.2s} .delay-3{transition-delay:.3s} .delay-4{transition-delay:.4s} .delay-5{transition-delay:.5s}

/* ── FOOTER ── */
footer {
  background: var(--gray-100); border-top: 1px solid var(--gray-200);
  padding: 64px 48px 32px;
}
.footer-grid {
  display: grid; grid-template-columns: 2fr 1fr 1fr; /* was 2fr 1fr 1fr 1fr – restore when Resources col is re-enabled */ gap: 48px;
  max-width: 1100px; margin: 0 auto 48px;
}
.footer-logo img { height: 44px; width: auto; margin-bottom: 16px; }
.footer-logo p { color: var(--gray-600); font-size: 14px; line-height: 1.7; max-width: 280px; }
.footer-socials { display: flex; gap: 10px; margin-top: 20px; }
.footer-social {
  width: 36px; height: 36px; border-radius: 9px;
  background: var(--white); border: 1px solid var(--gray-200);
  display: flex; align-items: center; justify-content: center;
  color: var(--gray-500); text-decoration: none; line-height: 0;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.footer-social:hover { background: linear-gradient(135deg, #3E3F94, #60A5FA); color: var(--white); border-color: transparent; }
.footer-col h3 { font-family: 'Nunito', sans-serif; font-size: 14px; font-weight: 800; margin-bottom: 16px; color: var(--gray-800); }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col ul li a { color: var(--gray-600); text-decoration: none; font-size: 14px; transition: color 0.2s; }
.footer-col ul li a:hover { color: var(--brand); }
.footer-bottom {
  border-top: 1px solid var(--gray-200); padding-top: 24px;
  display: flex; justify-content: space-between; align-items: center;
  max-width: 1100px; margin: 0 auto; flex-wrap: wrap; gap: 12px;
}
.footer-bottom p { color: var(--gray-600); font-size: 13px; }
.footer-bottom-links { display: flex; gap: 20px; }
.footer-bottom-links a { color: var(--gray-600); font-size: 13px; text-decoration: none; transition: color 0.2s; }
.footer-bottom-links a:hover { color: var(--brand); }

/* ── MOBILE ── */
@media (max-width: 900px) {
  nav { padding: 0 20px; }
  .nav-center { display: none; }
  .page-header { padding: 120px 24px 60px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  footer { padding: 48px 24px 32px; }
}


/* ══ Premium Material Icons — Shared ══ */
.dd-icon-wrap .material-symbols-outlined {
  font-size: 16px;
  color: var(--brand);
  -webkit-text-fill-color: var(--brand);
  background: none;
}
.nav-dropdown a:hover .dd-icon-wrap .material-symbols-outlined {
  color: #fff;
  -webkit-text-fill-color: #fff;
}
h2 .material-symbols-outlined {
  font-size: 1.2em;
  vertical-align: middle;
  color: var(--brand);
  -webkit-text-fill-color: var(--brand);
  background: none;
  margin-right: 6px;
}
h3 .material-symbols-outlined {
  font-size: 1em;
  vertical-align: middle;
  color: var(--brand);
  -webkit-text-fill-color: var(--brand);
  background: none;
}
.live-badge .material-symbols-outlined {
  font-size: 8px;
  color: #DC2626;
  -webkit-text-fill-color: #DC2626;
  background: none;
  vertical-align: middle;
  margin-right: 2px;
}
.resource-thumb .material-symbols-outlined {
  background: linear-gradient(135deg, var(--brand) 0%, var(--accent-blue) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.search-icon .material-symbols-outlined {
  font-size: 20px;
  color: var(--gray-400);
  -webkit-text-fill-color: var(--gray-400);
  background: none;
}
.share-icon .material-symbols-outlined {
  background: linear-gradient(135deg, var(--brand) 0%, var(--accent-blue) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}


/* ══ Lively Icons — shared ══ */

/* Nav dropdown icon: spring pop on hover */
.nav-dropdown a { transition: transform 0.2s ease; }
.dd-icon-wrap {
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), background 0.14s;
}
.nav-dropdown a:hover .dd-icon-wrap { transform: scale(1.18) rotate(-4deg); }

/* Blog card images: scale icon on card hover */
.blog-card-img .material-symbols-outlined {
  transition: transform 0.32s cubic-bezier(0.34,1.56,0.64,1);
}
.blog-card:hover .blog-card-img .material-symbols-outlined { transform: scale(1.18); }

/* Blog card images: unique gradient per card */
.blog-card:nth-child(1) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#0891B2,#67E8F9); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(2) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#D97706,#FCD34D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(3) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#059669,#6EE7B7); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(4) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#7C3AED,#A78BFA); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(5) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#DB2777,#F472B6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(6) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#3E3F94,#60A5FA); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(7) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#D97706,#FCD34D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.blog-card:nth-child(8) .blog-card-img .material-symbols-outlined { background:linear-gradient(135deg,#0891B2,#67E8F9); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* Resource thumbnails: tilt icon on card hover */
.resource-thumb .material-symbols-outlined {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.resource-card:hover .resource-thumb .material-symbols-outlined { transform: scale(1.15) rotate(-6deg); }

/* Resource thumbnail: colour variety per card */
.resource-card:nth-child(1) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#D97706,#FCD34D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(2) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#0891B2,#67E8F9); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(3) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#059669,#6EE7B7); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(4) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#7C3AED,#A78BFA); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(5) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#DB2777,#F472B6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(6) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#D97706,#FCD34D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(7) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#3E3F94,#60A5FA); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.resource-card:nth-child(8) .resource-thumb .material-symbols-outlined { background:linear-gradient(135deg,#0891B2,#67E8F9); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* Share icon: pulse on section appear */
@keyframes iconPulse {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.08); }
}
.share-icon .material-symbols-outlined { animation: iconPulse 2.8s ease-in-out infinite; }


/* ═══════════════════════════════════════════════════════
   MATERIAL SYMBOLS — Premium Icon System (shared)
   ═══════════════════════════════════════════════════════ */
.material-symbols-outlined {
  font-variation-settings:'FILL' 0,'wght' 350,'GRAD' 0,'opsz' 24;
  font-size:inherit; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  vertical-align:middle; user-select:none; flex-shrink:0;
}

/* NAV ICONS */
.dd-icon-wrap .material-symbols-outlined {
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 20;
  font-size:16px; color:var(--brand); -webkit-text-fill-color:var(--brand); background:none;
}
.nav-dropdown a:hover .dd-icon-wrap { transform:scale(1.15) rotate(-6deg); }
.nav-dropdown a:hover .dd-icon-wrap .material-symbols-outlined {
  color:#fff; -webkit-text-fill-color:#fff;
}
.dd-icon-wrap { transition:transform .22s cubic-bezier(.34,1.56,.64,1),background .14s; }

/* SECTION HEADINGS */
h2 .material-symbols-outlined {
  font-variation-settings:'FILL' 1,'wght' 300,'GRAD' 0,'opsz' 32;
  font-size:1.1em; vertical-align:middle; margin-right:8px;
  color:var(--brand,#3E3F94); -webkit-text-fill-color:var(--brand,#3E3F94); background:none;
}
h3 .material-symbols-outlined {
  font-variation-settings:'FILL' 1,'wght' 300,'GRAD' 0,'opsz' 24;
  font-size:1em; vertical-align:middle;
  color:var(--brand,#3E3F94); -webkit-text-fill-color:var(--brand,#3E3F94); background:none;
}

/* BLOG CARD IMAGES */
.blog-card-img .material-symbols-outlined {
  font-variation-settings:'FILL' 1,'wght' 200,'GRAD' 0,'opsz' 48;
  font-size:58px; display:block; text-align:center;
  transition:transform .32s cubic-bezier(.34,1.56,.64,1);
}
.blog-card:hover .blog-card-img .material-symbols-outlined { transform:scale(1.16); }
.blog-card:nth-child(1) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#0891B2,#67E8F9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(2) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#D97706,#FBBF24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(3) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#059669,#34D399);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(4) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#7C3AED,#A78BFA);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(5) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#DB2777,#F472B6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(6) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#3E3F94,#818CF8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(7) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#D97706,#FBBF24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.blog-card:nth-child(8) .blog-card-img .material-symbols-outlined{background:linear-gradient(135deg,#0891B2,#67E8F9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* RESOURCE THUMBNAILS */
.resource-thumb .material-symbols-outlined {
  font-variation-settings:'FILL' 1,'wght' 200,'GRAD' 0,'opsz' 48;
  font-size:46px; display:block; text-align:center;
  transition:transform .30s cubic-bezier(.34,1.56,.64,1);
}
.resource-card:hover .resource-thumb .material-symbols-outlined {
  transform:scale(1.16) rotate(-7deg);
}
.resource-card:nth-child(1) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#D97706,#FBBF24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(2) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#0891B2,#67E8F9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(3) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#059669,#34D399);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(4) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#7C3AED,#A78BFA);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(5) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#DB2777,#F472B6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(6) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#D97706,#FBBF24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(7) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#3E3F94,#818CF8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.resource-card:nth-child(8) .resource-thumb .material-symbols-outlined{background:linear-gradient(135deg,#0891B2,#67E8F9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* SHARE BANNER ICON */
@keyframes ms-pulse { 0%,100%{transform:scale(1);}50%{transform:scale(1.09);} }
.share-icon .material-symbols-outlined {
  font-variation-settings:'FILL' 1,'wght' 200,'GRAD' 0,'opsz' 48;
  font-size:54px;
  background:linear-gradient(135deg,#3E3F94,#818CF8,#60A5FA);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:ms-pulse 2.8s ease-in-out infinite;
}

/* LIVE BADGE DOT */
.live-badge .material-symbols-outlined {
  font-size:8px; color:#DC2626; -webkit-text-fill-color:#DC2626;
  background:none; vertical-align:middle; margin-right:2px;
}

/* SEARCH ICON */
.search-icon .material-symbols-outlined {
  font-size:20px; color:var(--gray-400,#9CA3AF);
  -webkit-text-fill-color:var(--gray-400,#9CA3AF); background:none;
}