/* ============================================================
   ARDRA CHARITABLE SOCIETY — Complete Design System
   Palette: Coral · Rose · Teal · Amber · Violet
   Typography: Fraunces (display) + Plus Jakarta Sans (body)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700;9..144,800;9..144,900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

/* ---------- 1. TOKENS ---------- */
:root {
  --rose-50:#FFF1F4; --rose-100:#FFE0E7; --rose-200:#FFC2CE; --rose-300:#FDA4AF;
  --rose-400:#FB7185; --rose-500:#F43F5E; --rose-600:#E11D48; --rose-700:#BE123C; --rose-900:#881337;
  --coral:#FF4D6D; --coral-dk:#C9184A;
  --teal-50:#ECFDF5; --teal-400:#2DD4BF; --teal-500:#14B8A6; --teal-600:#0D9488;
  --amber-100:#FEF3C7; --amber-400:#FBBF24; --amber-500:#F59E0B; --amber-600:#D97706;
  --violet-500:#8B5CF6; --violet-600:#7C3AED;
  --ink:#1F1937; --ink-soft:#4A4363; --muted:#8B85A0;
  --line:#EFEAF5; --cream:#FFF9F4; --blush:#FFF1F4; --white:#FFFFFF;
  --grad-red:linear-gradient(135deg,#FF4D6D 0%,#C9184A 100%);
  --grad-rose:linear-gradient(135deg,#FB7185 0%,#E11D48 100%);
  --grad-gold:linear-gradient(135deg,#FFD166 0%,#F59E0B 100%);
  --grad-teal:linear-gradient(135deg,#2DD4BF 0%,#0D9488 100%);
  --grad-violet:linear-gradient(135deg,#A78BFA 0%,#7C3AED 100%);
  --grad-sunset:linear-gradient(135deg,#FF4D6D 0%,#FFB703 100%);
  --grad-aurora:linear-gradient(120deg,#FF4D6D 0%,#8338EC 50%,#06D6A0 100%);
  --grad-ink:linear-gradient(135deg,#1F1937 0%,#3D2C5E 100%);
  --font-heading:'Fraunces',Georgia,serif;
  --font-body:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  --r-sm:12px; --r-md:18px; --r-lg:26px; --r-xl:36px; --r-full:999px;
  --sh-sm:0 4px 14px rgba(31,25,55,0.06);
  --sh-md:0 12px 32px rgba(31,25,55,0.08);
  --sh-lg:0 24px 60px rgba(31,25,55,0.12);
  --sh-rose:0 18px 44px rgba(244,63,94,0.30);
  --sh-gold:0 18px 44px rgba(245,158,11,0.28);
  --sh-teal:0 18px 44px rgba(20,184,166,0.28);
  --sh-violet:0 18px 44px rgba(124,58,237,0.26);
  --ease:cubic-bezier(0.22,1,0.36,1);
  --ease-bounce:cubic-bezier(0.34,1.56,0.64,1);
}

/* ---------- 2. RESET & BASE ---------- */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  margin:0; font-family:var(--font-body); font-size:16px; line-height:1.7;
  color:var(--ink-soft); background:var(--cream); overflow-x:hidden;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
body::before {
  content:""; position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(1200px 700px at 12% -10%, rgba(255,77,109,0.10), transparent 60%),
    radial-gradient(1000px 600px at 100% 10%, rgba(139,92,246,0.09), transparent 60%),
    radial-gradient(900px 600px at 50% 110%, rgba(45,212,191,0.09), transparent 60%);
  pointer-events:none;
}
img { max-width:100%; height:auto; display:block; }
a { color:var(--rose-600); text-decoration:none; transition:color .25s var(--ease); }
a:hover { color:var(--coral); }
::selection { background:var(--rose-200); color:var(--rose-900); }
::-webkit-scrollbar { width:12px; }
::-webkit-scrollbar-track { background:var(--rose-50); }
::-webkit-scrollbar-thumb { background:var(--grad-red); border-radius:var(--r-full); border:3px solid var(--rose-50); }

/* ---------- 3. TYPOGRAPHY ---------- */
h1,h2,h3,h4,h5,h6,.section-title,.founder-name,.hero-slide-title {
  font-family:var(--font-heading); font-weight:800; line-height:1.15;
  color:var(--ink); letter-spacing:-0.02em; margin:0 0 .6em;
}
h1 { font-size:clamp(1.85rem,4vw,3.1rem); }
h2 { font-size:clamp(1.45rem,2.75vw,2.2rem); }
h3 { font-size:clamp(1.1rem,1.75vw,1.45rem); }
h4 { font-size:clamp(1rem,1.4vw,1.2rem); }
p { margin:0 0 1rem; }
.lead { font-size:1.05rem; color:var(--ink-soft); line-height:1.8; }

.text-gradient-red,.accent {
  background:var(--grad-red);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.text-gradient-gold {
  background:var(--grad-gold);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.text-gradient-aurora {
  background:var(--grad-aurora);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.accent-gold {
  background:var(--grad-gold);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-style:italic;
}

/* ---------- 4. LAYOUT ---------- */
.page-section { position:relative; padding:clamp(3.5rem,7vw,6.5rem) 0; }
.page-section-white { background:linear-gradient(180deg,#FFFFFF 0%,#FFFCFA 100%); }
.page-section-cream { background:linear-gradient(180deg,#FFF9F4 0%,#FFF4EC 100%); }
.page-section-blush { background:linear-gradient(180deg,#FFF1F4 0%,#FFF9F4 100%); }
.page-section-white::after,
.page-section-cream::after {
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:60px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23FFF9F4' d='M0,30 C240,60 480,0 720,30 C960,60 1200,0 1440,30 L1440,60 L0,60 Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  pointer-events:none; opacity:.9;
}
.page-section-cream::after {
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23FFFFFF' d='M0,30 C240,60 480,0 720,30 C960,60 1200,0 1440,30 L1440,60 L0,60 Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
}
.container { width:min(1240px,92%); margin:0 auto; }

/* ---------- 5. SECTION HEADERS ---------- */
.section-header { text-align:center; max-width:720px; margin:0 auto clamp(2.25rem,4.5vw,3.75rem); position:relative; }
.section-label {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem 1.1rem; border-radius:var(--r-full);
  background:linear-gradient(135deg,rgba(255,77,109,0.14),rgba(255,209,102,0.10),rgba(139,92,246,0.10));
  color:var(--rose-700); font-family:var(--font-body); font-weight:700;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid rgba(255,77,109,0.16);
  margin-bottom:1rem; position:relative;
}
.section-label::before {
  content:""; width:6px; height:6px; border-radius:50%;
  background:var(--grad-red); box-shadow:0 0 0 4px rgba(255,77,109,0.18);
}
.section-title { margin:0 0 .6rem; font-size:clamp(1.45rem,2.75vw,2.2rem); }
.section-desc { color:var(--muted); font-size:.98rem; max-width:620px; margin:0 auto; }
.section-label-light { background:rgba(255,255,255,0.10); border-color:rgba(255,255,255,0.22); color:#FFE9B0; }
.section-label-light::before { background:#FFD166; box-shadow:0 0 0 4px rgba(255,209,102,0.22); }
.section-header-row { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; margin-bottom:clamp(1.75rem,3.5vw,2.75rem); flex-wrap:wrap; }
.section-header-inline { text-align:left; max-width:640px; }
.section-header-inline .section-title { margin-bottom:.3rem; }

/* ---------- 6. BUTTONS ---------- */
.btn,.btn-red,.btn-gold,.btn-outline,.btn-outline-light,.btn-see-more,.btn-download {
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.9rem 1.75rem; border-radius:var(--r-full);
  font-family:var(--font-body); font-weight:700; font-size:.9rem;
  letter-spacing:.01em; text-decoration:none; border:0; cursor:pointer;
  transition:all .35s var(--ease); position:relative; overflow:hidden; white-space:nowrap;
}
.btn-red,.btn-primary { background:var(--grad-red); color:#fff; box-shadow:var(--sh-rose); }
.btn-red::before,.btn-primary::before {
  content:""; position:absolute; inset:0; background:var(--grad-sunset);
  opacity:0; transition:opacity .35s var(--ease); z-index:0;
}
.btn-red > *,.btn-primary > * { position:relative; z-index:1; }
.btn-red:hover,.btn-primary:hover { color:#fff; transform:translateY(-3px) scale(1.02); box-shadow:0 26px 56px rgba(244,63,94,0.4); }
.btn-red:hover::before,.btn-primary:hover::before { opacity:1; }
.btn-gold { background:var(--grad-gold); color:#3A2A00; box-shadow:var(--sh-gold); }
.btn-gold:hover { color:#3A2A00; transform:translateY(-3px) scale(1.02); box-shadow:0 26px 56px rgba(245,158,11,0.42); }
.btn-outline-light { background:rgba(255,255,255,0.10); color:#fff; border:1.5px solid rgba(255,255,255,0.45); backdrop-filter:blur(12px); }
.btn-outline-light:hover { background:#fff; color:var(--rose-700); transform:translateY(-3px); }
.btn-outline { background:transparent; color:var(--ink); border:1.5px solid var(--line); }
.btn-outline:hover { border-color:var(--rose-500); color:var(--rose-600); transform:translateY(-3px); background:var(--rose-50); }
.btn-see-more { background:transparent; color:var(--rose-600); padding:.5rem .25rem; font-weight:700; border:0; gap:.55rem; }
.btn-see-more i { transition:transform .35s var(--ease); }
.btn-see-more:hover { color:var(--coral-dk); }
.btn-see-more:hover i { transform:translateX(6px); }
.btn-download { background:var(--ink); color:#fff; padding:.55rem 1.15rem; font-size:.8rem; }
.btn-download:hover { background:var(--rose-600); color:#fff; }
.btn-lg { padding:1rem 2.15rem; font-size:.95rem; }
.btn-sm { padding:.55rem 1.05rem; font-size:.8rem; }

/* ---------- 7. HERO ---------- */
.hero-slider {
  position:relative; min-height:clamp(520px,88vh,820px);
  overflow:hidden; background:var(--ink); isolation:isolate;
}
.hero-slide {
  position:absolute; inset:0; opacity:0; transform:scale(1.06);
  transition:opacity 1.1s var(--ease),transform 8s linear;
  display:flex; align-items:center; pointer-events:none;
}
.hero-slide.active { opacity:1; transform:scale(1); pointer-events:auto; z-index:2; }
.hero-slide-bg { position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.05); }
.hero-slide-overlay {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg,rgba(31,25,55,0.82) 0%,rgba(31,25,55,0.55) 45%,rgba(31,25,55,0.15) 100%),
    radial-gradient(900px 500px at 15% 80%,rgba(255,77,109,0.30),transparent 60%);
}
.hero-slide-inner {
  position:relative; z-index:2; width:min(1240px,92%); margin:0 auto;
  padding:5.5rem 0 5rem;
  display:flex; align-items:center; justify-content:space-between; gap:2.5rem;
}
.hero-slide-content { max-width:620px; color:#fff; }
.hero-slide-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem 1rem;
  background:rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.25);
  border-radius:var(--r-full);
  color:#FFE9B0; font-weight:700; font-size:.72rem;
  letter-spacing:.1em; text-transform:uppercase;
  backdrop-filter:blur(14px); margin-bottom:1.25rem;
}
.hero-slide-badge i { color:var(--amber-400); animation:pulseGlow 2.4s ease-in-out infinite; }
.hero-slide-title {
  color:#fff; font-size:clamp(1.75rem,4vw,3rem);
  line-height:1.1; margin-bottom:1rem;
  text-shadow:0 6px 40px rgba(0,0,0,0.35);
}
.hero-slide-title .accent {
  background:var(--grad-gold);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; font-style:italic;
}
.hero-slide-subtitle {
  color:rgba(255,255,255,0.85);
  font-size:clamp(.92rem,1.1vw,1rem);
  max-width:520px; margin-bottom:1.75rem; line-height:1.7;
}
.hero-slide-actions { display:flex; flex-wrap:wrap; gap:.85rem; }
.hero-slider-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  width:50px; height:50px; border-radius:50%;
  background:rgba(255,255,255,0.10);
  border:1px solid rgba(255,255,255,0.25);
  color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(14px); transition:all .35s var(--ease); z-index:5;
}
.hero-slider-nav:hover { background:var(--grad-red); border-color:transparent; transform:translateY(-50%) scale(1.1); box-shadow:var(--sh-rose); }
.hero-slider-prev { left:2.5%; }
.hero-slider-next { right:2.5%; }
.hero-slider-dots {
  position:absolute; left:50%; bottom:2rem;
  transform:translateX(-50%);
  display:flex; gap:.55rem; z-index:5;
}
.hero-slider-dot {
  width:28px; height:26px; border-radius:50%;
  background:transparent; border:1.5px solid rgba(255,255,255,0.28);
  padding:0; display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; transition:all .35s var(--ease);
}
.hero-slider-dot span { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,0.65); transition:all .35s var(--ease); }
.hero-slider-dot.active { width:40px; border-radius:var(--r-full); background:rgba(255,209,102,0.18); border-color:var(--amber-400); }
.hero-slider-dot.active span { width:22px; border-radius:var(--r-full); background:var(--grad-gold); box-shadow:0 0 12px rgba(255,209,102,0.6); }
.hero-progress {
  position:absolute; bottom:1.25rem; left:50%; transform:translateX(-50%);
  width:min(460px,60vw); height:3px;
  background:rgba(255,255,255,0.15); border-radius:3px; overflow:hidden; z-index:5;
}
.hero-progress-bar { height:100%; width:0%; background:var(--grad-gold); border-radius:3px; box-shadow:0 0 12px rgba(255,209,102,0.6); }
.hero-slide-png-wrapper { position:relative; z-index:3; flex-shrink:0; animation:bob 6s ease-in-out infinite; }
.hero-slide-png { max-height:440px; width:auto; filter:drop-shadow(0 30px 60px rgba(0,0,0,0.4)); }
.hero-png-ring { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; }
.hero-png-ring-1 { width:110%; height:110%; border:2px dashed rgba(255,209,102,0.35); animation:rotateSlow 26s linear infinite; }
.hero-png-ring-2 { width:128%; height:128%; border:2px solid rgba(255,77,109,0.28); animation:rotateSlow 38s linear infinite reverse; }
.hero-scroll-hint {
  position:absolute; right:2.5rem; bottom:1.75rem; z-index:5;
  display:inline-flex; flex-direction:column; align-items:center; gap:.3rem;
  color:rgba(255,255,255,0.7); font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700;
  animation:bob 3s ease-in-out infinite; pointer-events:none;
}
.hero-scroll-hint i { color:var(--amber-400); font-size:.75rem; }

/* Magical hero */
.hero-magical .hero-slide-bg { animation:heroKenBurns 16s ease-in-out infinite alternate; }
@keyframes heroKenBurns { 0% { transform:scale(1.05) translate(0,0); } 100% { transform:scale(1.22) translate(-2.5%,-2%); } }
.hero-magic-layer { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.hero-magical .hero-orb { position:absolute; border-radius:50%; filter:blur(80px); opacity:.6; mix-blend-mode:screen; }
.hero-magical .hero-orb-1 { width:520px; height:520px; background:radial-gradient(circle,#FF4D6D,transparent 70%); top:-160px; left:-100px; animation:floatSlow 16s ease-in-out infinite; }
.hero-magical .hero-orb-2 { width:420px; height:420px; background:radial-gradient(circle,#FFD166,transparent 70%); bottom:-160px; right:12%; animation:floatSlow 20s ease-in-out infinite reverse; }
.hero-magical .hero-orb-3 { width:380px; height:380px; background:radial-gradient(circle,#8B5CF6,transparent 70%); top:30%; right:30%; opacity:.4; animation:bob 9s ease-in-out infinite; }
.hero-sparkles {
  position:absolute; inset:0;
  background-image:
    radial-gradient(2px 2px at 15% 20%,rgba(255,209,102,0.95),transparent 60%),
    radial-gradient(2px 2px at 78% 15%,rgba(255,255,255,0.95),transparent 60%),
    radial-gradient(1.5px 1.5px at 35% 68%,rgba(255,209,102,0.9),transparent 60%),
    radial-gradient(2px 2px at 88% 60%,rgba(255,255,255,0.9),transparent 60%),
    radial-gradient(1.5px 1.5px at 55% 42%,rgba(255,209,102,0.8),transparent 60%),
    radial-gradient(2px 2px at 25% 85%,rgba(255,255,255,0.85),transparent 60%);
  opacity:.9; animation:sparkleTwinkle 5s ease-in-out infinite;
}
@keyframes sparkleTwinkle { 0%,100% { opacity:.9; transform:scale(1); } 50% { opacity:.55; transform:scale(1.05); } }
.hero-magical .hero-slide.active .hero-slide-content { animation:heroContentIn 1s var(--ease) both; }
.hero-magical .hero-slide.active .hero-slide-badge { animation:heroContentIn .8s var(--ease) .1s both; }
.hero-magical .hero-slide.active .hero-slide-title { animation:heroContentIn .9s var(--ease) .25s both; }
.hero-magical .hero-slide.active .hero-slide-subtitle { animation:heroContentIn .9s var(--ease) .4s both; }
.hero-magical .hero-slide.active .hero-slide-actions { animation:heroContentIn .9s var(--ease) .55s both; }
.hero-magical .hero-slide.active .hero-slide-png-wrapper { animation:heroPngIn 1.2s var(--ease-bounce) .35s both; }
@keyframes heroContentIn { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:none; } }
@keyframes heroPngIn { from { opacity:0; transform:translateX(80px) scale(0.85) rotate(4deg); } to { opacity:1; transform:none; } }

/* ---------- 8. FEATURE TILES ---------- */
.feature-tiles-wrap { position:relative; z-index:20; margin-top:-60px; padding-bottom:2rem; }
.feature-tiles-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.25rem; max-width:900px; margin:0 auto; }
.feature-tiles-grid.feature-tiles-3 { grid-template-columns:repeat(3,1fr); max-width:1080px; }
.feature-tile {
  display:flex; align-items:center; gap:1.15rem;
  padding:1.35rem 1.45rem; border-radius:22px;
  text-decoration:none; transition:all .45s var(--ease);
  position:relative; overflow:hidden;
  box-shadow:0 20px 50px rgba(31,25,55,0.14);
}
.feature-tile::before {
  content:""; position:absolute; inset:0;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,0.15) 50%,transparent 60%);
  transform:translateX(-100%); transition:transform 1s var(--ease); pointer-events:none;
}
.feature-tile:hover::before { transform:translateX(100%); }
.feature-tile-primary { background:var(--grad-red); color:#fff; box-shadow:0 24px 60px rgba(244,63,94,0.32); }
.feature-tile-primary:hover { color:#fff; transform:translateY(-6px); box-shadow:0 32px 70px rgba(244,63,94,0.42); }
.feature-tile-light { background:#fff; color:var(--ink); border:1px solid var(--line); }
.feature-tile-light:hover { color:var(--ink); transform:translateY(-6px); border-color:transparent; box-shadow:0 32px 70px rgba(31,25,55,0.18); }
.feature-tile-gold { background:linear-gradient(135deg,#FFD166 0%,#F59E0B 100%); color:#3A2A00; box-shadow:0 24px 60px rgba(245,158,11,0.32); }
.feature-tile-gold:hover { color:#3A2A00; transform:translateY(-6px); box-shadow:0 32px 70px rgba(245,158,11,0.42); }
.feature-tile-jubilee {
  background:linear-gradient(135deg,#FFF3C4 0%,#FFD166 45%,#F59E0B 100%);
  color:#3A2A00; box-shadow:0 24px 60px rgba(245,158,11,0.42);
  position:relative; overflow:hidden;
}
.feature-tile-jubilee::after {
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,0.55),transparent 60%);
  pointer-events:none;
}
.feature-tile-jubilee:hover { color:#3A2A00; transform:translateY(-6px) scale(1.02); box-shadow:0 34px 80px rgba(245,158,11,0.55); }
.feature-tile-icon {
  width:52px; height:52px; border-radius:15px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.35rem; flex-shrink:0;
}
.feature-tile-primary .feature-tile-icon { background:rgba(255,255,255,0.15); color:#fff; }
.feature-tile-light   .feature-tile-icon { background:var(--grad-red); color:#fff; box-shadow:0 10px 22px rgba(244,63,94,0.30); }
.feature-tile-gold    .feature-tile-icon { background:rgba(255,255,255,0.30); color:#3A2A00; }
.feature-tile-jubilee-icon {
  background:rgba(255,255,255,0.35) !important;
  box-shadow:0 10px 22px rgba(245,158,11,0.4);
  overflow:hidden;
}
.feature-tile-jubilee-icon img { width:100%; height:100%; object-fit:contain; padding:4px; }
.feature-tile-text { flex:1; min-width:0; }
.feature-tile-text strong { display:block; font-family:var(--font-heading); font-weight:800; font-size:.98rem; line-height:1.25; margin-bottom:.15rem; }
.feature-tile-text span { display:block; font-size:.8rem; opacity:.82; line-height:1.5; }
.feature-tile-arrow { font-size:.95rem; opacity:.6; transition:all .35s var(--ease); }
.feature-tile:hover .feature-tile-arrow { opacity:1; transform:translateX(6px); }

/* ---------- 9. ABOUT ETYMOLOGY ---------- */
.about-etymology-section { position:relative; overflow:hidden; }
.about-etymology-section::before {
  content:""; position:absolute; top:-50%; right:-10%;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,77,109,0.12),transparent 70%);
  filter:blur(60px); pointer-events:none;
}
.etymology-visual {
  position:relative; aspect-ratio:1/1; max-width:440px; margin:0 auto;
  display:flex; align-items:center; justify-content:center;
}
.etymology-letters { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:.4rem; flex-wrap:wrap; padding:2rem; }
.etymology-letters .letter {
  font-family:var(--font-heading); font-size:clamp(2.5rem,6vw,4.5rem);
  font-weight:900; letter-spacing:-0.03em; line-height:1; display:inline-block;
  animation:letterFloat 4s ease-in-out infinite;
}
.etymology-letters .letter-1 { color:#FF4D6D; animation-delay:0s; }
.etymology-letters .letter-2 { color:#C9184A; animation-delay:.15s; }
.etymology-letters .letter-3 { color:#FFD166; -webkit-text-stroke:2px #F59E0B; animation-delay:.3s; }
.etymology-letters .letter-4 { color:#C9184A; animation-delay:.45s; }
.etymology-letters .letter-5 { color:#FF4D6D; animation-delay:.6s; }
@keyframes letterFloat { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-14px) rotate(-3deg); } }
.etymology-visual::before { content:""; position:absolute; inset:8%; border-radius:50%; border:2px dashed rgba(255,77,109,0.28); animation:rotateSlow 40s linear infinite; }
.etymology-visual::after { content:""; position:absolute; inset:20%; border-radius:50%; background:radial-gradient(circle,rgba(255,209,102,0.25),transparent 65%); animation:pulseGlow 6s ease-in-out infinite; }
.etymology-tag {
  position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  padding:.6rem 1.2rem; background:var(--grad-red); color:#fff;
  border-radius:999px; font-size:.72rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; box-shadow:0 14px 30px rgba(244,63,94,0.35); white-space:nowrap;
}
.etymology-content { position:relative; }
.etymology-highlight {
  display:flex; gap:1.25rem; align-items:flex-start;
  padding:1.5rem 1.75rem;
  background:linear-gradient(135deg,rgba(255,77,109,0.08),rgba(255,209,102,0.06));
  border-radius:18px; border-left:4px solid var(--rose-500); margin-top:1.5rem;
}
.etymology-highlight-icon {
  width:52px; height:52px; flex-shrink:0; border-radius:15px;
  background:var(--grad-red); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.25rem; box-shadow:0 12px 26px rgba(244,63,94,0.28);
}
@media (max-width:767px) {
  .etymology-visual { max-width:320px; }
  .etymology-highlight { flex-direction:column; align-items:center; text-align:center; }
}

/* ---------- 10. FOUNDER TRIBUTE ---------- */
.founder-tribute-hero {
  position:relative; padding:clamp(4rem,8vw,7rem) 0;
  background:
    radial-gradient(1000px 500px at 15% 10%,rgba(255,77,109,0.18),transparent 60%),
    radial-gradient(900px 500px at 85% 90%,rgba(255,209,102,0.14),transparent 60%),
    linear-gradient(180deg,#17122B 0%,#1F1937 100%);
  color:#fff; overflow:hidden;
}
.ft-heaven-rays {
  position:absolute; inset:-20% -10%;
  background:conic-gradient(from 220deg at 50% 0%,transparent 0deg,rgba(255,209,102,0.10) 25deg,transparent 50deg,transparent 80deg,rgba(255,209,102,0.08) 100deg,transparent 130deg,transparent 160deg,rgba(255,255,255,0.06) 190deg,transparent 220deg);
  animation:rotateSlow 60s linear infinite; pointer-events:none; opacity:.8;
}
.ft-float-particles { position:absolute; inset:0; pointer-events:none; }
.ft-float-particles span {
  position:absolute; width:5px; height:5px; border-radius:50%;
  background:radial-gradient(circle,#FFD166,transparent 70%); filter:blur(1px);
  animation:ftFloatUp 12s linear infinite;
}
.ft-float-particles span:nth-child(1) { left:8%; animation-delay:0s; }
.ft-float-particles span:nth-child(2) { left:22%; animation-delay:2s; }
.ft-float-particles span:nth-child(3) { left:42%; animation-delay:4s; }
.ft-float-particles span:nth-child(4) { left:62%; animation-delay:1s; }
.ft-float-particles span:nth-child(5) { left:82%; animation-delay:3s; }
.ft-float-particles span:nth-child(6) { left:92%; animation-delay:5s; }
@keyframes ftFloatUp { 0% { transform:translateY(100vh) scale(0.6); opacity:0; } 10% { opacity:1; } 90% { opacity:1; } 100% { transform:translateY(-40px) scale(1); opacity:0; } }
.ft-header { text-align:center; margin-bottom:clamp(2.25rem,4.5vw,3.5rem); }
.ft-ornament { display:inline-flex; align-items:center; gap:1.15rem; color:var(--amber-400); margin-bottom:1.15rem; }
.ft-ornament .line { width:85px; height:1px; background:linear-gradient(90deg,transparent,var(--amber-400),transparent); }
.ft-ornament i { font-size:1.4rem; animation:pulseGlow 3s ease-in-out infinite; }
.ft-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem 1.15rem;
  background:rgba(255,209,102,0.14);
  border:1px solid rgba(255,209,102,0.35);
  border-radius:var(--r-full);
  color:var(--amber-400); font-weight:700; font-size:.7rem;
  letter-spacing:.18em; text-transform:uppercase; margin-bottom:1rem;
}
.ft-title {
  font-family:var(--font-heading); color:#fff;
  font-size:clamp(1.65rem,3.2vw,2.5rem);
  font-weight:800; letter-spacing:-0.02em; line-height:1.15;
  margin:.5rem 0 .75rem;
  background:linear-gradient(180deg,#fff 0%,#FFE9B0 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.ft-subtitle { color:rgba(255,255,255,0.72); max-width:640px; margin:0 auto; font-size:.95rem; line-height:1.7; }
.ft-grid { display:grid; grid-template-columns:400px 1fr; gap:3rem; align-items:center; }
.ft-photo-col { position:relative; }
.ft-photo-frame {
  position:relative; aspect-ratio:4/5; border-radius:28px; overflow:hidden;
  box-shadow:0 40px 90px rgba(0,0,0,0.55),0 0 0 1px rgba(255,209,102,0.18) inset;
}
.ft-photo-slider { position:relative; width:100%; height:100%; }
.ft-photo-slide { position:absolute; inset:0; opacity:0; transform:scale(1.06) rotate(1deg); transition:opacity 1.4s var(--ease),transform 2s var(--ease); }
.ft-photo-slide.active { opacity:1; transform:scale(1) rotate(0); }
.ft-photo-slide img { width:100%; height:100%; object-fit:cover; object-position:top center; }
.ft-photo-slide::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(23,18,43,0.55) 100%); pointer-events:none; }
.ft-photo-fallback { display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:var(--amber-400); font-size:4rem; background:rgba(255,255,255,0.02); }
.ft-photo-halo { position:absolute; inset:-18px; border-radius:34px; border:1.5px dashed rgba(255,209,102,0.30); pointer-events:none; animation:rotateSlow 40s linear infinite; }
.ft-photo-halo-2 { inset:-32px; border-color:rgba(255,77,109,0.20); animation-duration:55s; animation-direction:reverse; }
.ft-photo-controls { display:flex; align-items:center; justify-content:center; gap:1rem; margin-top:1.35rem; }
.ft-prev, .ft-next {
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,209,102,0.30);
  color:var(--amber-400); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:all .3s var(--ease);
}
.ft-prev:hover, .ft-next:hover { background:var(--grad-gold); color:#3A2A00; border-color:transparent; box-shadow:var(--sh-gold); }
.ft-dots { display:flex; gap:.45rem; }
.ft-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,0.28); border:0; cursor:pointer; transition:all .35s var(--ease); }
.ft-dot.active { background:var(--amber-400); width:24px; border-radius:var(--r-full); box-shadow:0 0 12px rgba(255,209,102,0.55); }
.ft-quote {
  position:relative;
  padding:1.65rem 1.75rem 1.65rem 3.5rem;
  background:linear-gradient(135deg,rgba(255,209,102,0.06),rgba(255,77,109,0.04));
  border-left:3px solid var(--amber-400);
  border-radius:0 var(--r-md) var(--r-md) 0; margin-bottom:1.65rem;
}
.ft-quote i { position:absolute; left:1.25rem; top:1.65rem; color:var(--amber-400); font-size:1.3rem; opacity:.9; }
.ft-quote p { font-family:var(--font-heading); font-style:italic; font-size:1.05rem; color:#fff; line-height:1.65; margin:0 0 .55rem; }
.ft-quote cite { display:block; font-style:normal; font-size:.7rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--amber-400); }
.ft-para { color:rgba(255,255,255,0.78); line-height:1.85; margin-bottom:1.15rem; font-size:.94rem; }
.ft-plaque {
  position:relative; display:flex; align-items:center; gap:1.25rem;
  padding:1.35rem 1.6rem;
  background:linear-gradient(135deg,rgba(255,209,102,0.12),rgba(255,77,109,0.06));
  border:1px solid rgba(255,209,102,0.28);
  border-radius:var(--r-lg); margin:1.65rem 0; overflow:hidden;
}
.ft-plaque-glow {
  position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background:conic-gradient(from 0deg,transparent,rgba(255,209,102,0.20),transparent);
  animation:rotateSlow 16s linear infinite; pointer-events:none;
}
.ft-plaque > i {
  position:relative; width:52px; height:52px; border-radius:15px;
  background:var(--grad-gold); color:#3A2A00;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; flex-shrink:0; box-shadow:var(--sh-gold);
}
.ft-plaque > div { position:relative; }
.ft-plaque-label { color:var(--amber-400); font-size:.66rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; margin-bottom:.25rem; }
.ft-plaque-name { font-family:var(--font-heading); font-size:1.08rem; font-weight:800; color:#fff; line-height:1.25; margin-bottom:.15rem; }
.ft-plaque-dates { color:rgba(255,255,255,0.65); font-size:.82rem; letter-spacing:.14em; }
.ft-cta { display:flex; flex-wrap:wrap; gap:1rem; }
.ft-benediction { display:flex; align-items:center; justify-content:center; gap:1.5rem; margin-top:clamp(2.5rem,4.5vw,4rem); }
.ft-benediction .line { width:100px; height:1px; background:linear-gradient(90deg,transparent,rgba(255,209,102,0.55),transparent); }
.ft-benediction-text { font-family:var(--font-heading); font-style:italic; color:var(--amber-400); font-size:1rem; letter-spacing:.06em; }

/* ---------- 11. LEADERSHIP ---------- */
.leaders-pro { position:relative; padding:clamp(3.5rem,7vw,6rem) 0; background:linear-gradient(180deg,var(--cream) 0%,#fff 100%); overflow:hidden; }
.leaders-pro-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:1080px; margin:0 auto 2.5rem; }
.leader-pro-card {
  position:relative; border-radius:var(--r-xl); overflow:hidden;
  padding:1.75rem 1.75rem 2rem; text-align:center;
  transition:all .5s var(--ease); isolation:isolate;
  min-height:500px; display:flex; flex-direction:column;
}
.leader-pro-card:hover { transform:translateY(-8px); }
.leader-pro-bg { position:absolute; inset:0; z-index:0; overflow:hidden; }
.leader-pro-patron .leader-pro-bg { background:linear-gradient(160deg,#FFF7E1 0%,#FFE9B0 55%,#FFD166 100%); }
.leader-pro-president .leader-pro-bg { background:linear-gradient(160deg,#F5F0FF 0%,#E0D4FF 55%,#A78BFA 100%); }
.leader-pro-orb {
  position:absolute; width:340px; height:340px; border-radius:50%;
  top:-100px; right:-80px; filter:blur(50px);
  animation:floatSlow 16s ease-in-out infinite;
}
.leader-pro-patron .leader-pro-orb { background:radial-gradient(circle,rgba(255,77,109,0.55),transparent 70%); }
.leader-pro-president .leader-pro-orb { background:radial-gradient(circle,rgba(45,212,191,0.55),transparent 70%); }
.leader-pro-orb-2 { width:260px; height:260px; bottom:-80px; left:-60px; top:auto; right:auto; animation-delay:-6s; }
.leader-pro-patron .leader-pro-orb-2 { background:radial-gradient(circle,rgba(245,158,11,0.55),transparent 70%); }
.leader-pro-president .leader-pro-orb-2 { background:radial-gradient(circle,rgba(139,92,246,0.55),transparent 70%); }
.leader-pro-grid-lines {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,0.10) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.10) 1px,transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 85%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 85%);
  pointer-events:none;
}
.leader-pro-photo-wrap {
  position:relative; z-index:2; width:260px; height:320px;
  margin:0 auto; border-radius:24px; overflow:hidden;
  box-shadow:0 28px 60px rgba(31,25,55,0.28); flex-shrink:0;
}
.leader-pro-photo-wrap img { width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform 1s var(--ease); }
.leader-pro-card:hover .leader-pro-photo-wrap img { transform:scale(1.06); }
.leader-pro-photo-empty { display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:rgba(255,255,255,0.15); color:#fff; font-size:4rem; }
.leader-pro-photo-ring { position:absolute; inset:-10px; border-radius:30px; border:2px dashed rgba(255,255,255,0.55); animation:rotateSlow 30s linear infinite; pointer-events:none; }
.leader-pro-body { position:relative; z-index:2; margin-top:auto; padding-top:1.5rem; flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.leader-pro-role {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.42rem 1.05rem; border-radius:var(--r-full);
  font-size:.68rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  margin-bottom:.85rem; box-shadow:0 10px 24px rgba(31,25,55,0.18);
}
.leader-pro-patron .leader-pro-role { background:#3A2A00; color:var(--amber-400); }
.leader-pro-president .leader-pro-role { background:#4C1D95; color:#DDD6FE; }
.leader-pro-name { font-family:var(--font-heading); font-size:clamp(1.05rem,1.8vw,1.3rem); margin:0 0 .45rem; color:var(--ink); line-height:1.25; font-weight:800; }
.leader-pro-title { color:var(--ink-soft); font-size:.88rem; font-style:italic; margin:0; line-height:1.55; max-width:300px; }
.leaders-pro-cta { display:flex; justify-content:center; }
.btn-committee-full { display:inline-flex; padding:0; background:transparent; text-decoration:none; }
.btn-committee-full-inner {
  display:inline-flex; align-items:center; gap:1.15rem;
  padding:1rem 1.65rem; border-radius:var(--r-full);
  background:linear-gradient(120deg,#FF4D6D 0%,#C9184A 40%,#7C3AED 100%);
  background-size:200% 100%; color:#fff;
  box-shadow:0 22px 50px rgba(244,63,94,0.32);
  transition:all .5s var(--ease); position:relative; overflow:hidden;
}
.btn-committee-full-inner::before {
  content:""; position:absolute; inset:0;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,0.28) 50%,transparent 60%);
  transform:translateX(-100%); transition:transform 1s var(--ease);
}
.btn-committee-full:hover .btn-committee-full-inner { background-position:100% 0; transform:translateY(-4px); box-shadow:0 32px 70px rgba(244,63,94,0.42); color:#fff; }
.btn-committee-full:hover .btn-committee-full-inner::before { transform:translateX(100%); }
.btn-committee-full-inner > i:first-child {
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,0.22);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1rem; flex-shrink:0;
}
.btn-committee-full-text { display:flex; flex-direction:column; text-align:left; line-height:1.2; }
.btn-committee-full-text strong { font-family:var(--font-heading); font-size:1rem; font-weight:800; }
.btn-committee-full-text small { font-size:.72rem; opacity:.82; letter-spacing:.04em; margin-top:.15rem; }
.btn-committee-full-arrow { font-size:1rem; transition:transform .4s var(--ease); }
.btn-committee-full:hover .btn-committee-full-arrow { transform:translateX(6px); }

/* ---------- 12. SILVER JUBILEE — SINGLE LOGO ---------- */
.jubilee-single-section { padding:clamp(3rem,6vw,5rem) 0; background:linear-gradient(180deg,#FFF9F4 0%,#FFF1F4 100%); overflow:hidden; }
.jubilee-single-inner {
  position:relative; border-radius:var(--r-xl);
  padding:clamp(2rem,4vw,3rem) clamp(1.5rem,4vw,3rem);
  background:linear-gradient(135deg,#1F1937 0%,#3D2C5E 55%,#6B1C3E 100%);
  box-shadow:0 40px 90px rgba(31,25,55,0.32); overflow:hidden; isolation:isolate;
}
.jubilee-single-rays {
  position:absolute; inset:-20%;
  background:conic-gradient(from 0deg at 50% 50%,transparent 0deg,rgba(255,209,102,0.10) 20deg,transparent 40deg,transparent 80deg,rgba(255,209,102,0.08) 100deg,transparent 130deg,transparent 180deg,rgba(255,255,255,0.06) 200deg,transparent 240deg,transparent 300deg,rgba(255,209,102,0.08) 320deg,transparent 340deg);
  animation:rotateSlow 90s linear infinite; pointer-events:none; z-index:0;
}
.jubilee-single-glow {
  position:absolute; top:50%; left:30%; transform:translate(-50%,-50%);
  width:700px; height:700px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,209,102,0.35),rgba(255,77,109,0.14) 40%,transparent 70%);
  filter:blur(70px); pointer-events:none; z-index:0;
  animation:pulseGlow 8s ease-in-out infinite;
}
.jubilee-single-layout { position:relative; z-index:2; display:grid; grid-template-columns:1fr 1.3fr; gap:2.5rem; align-items:center; }
.jubilee-single-side { display:flex; justify-content:center; align-items:center; }
.jubilee-single-img {
  max-width:100%; max-height:340px; width:auto;
  filter:drop-shadow(0 30px 60px rgba(255,209,102,0.55));
  animation:bob 6s ease-in-out infinite;
}
.jubilee-single-fallback { text-align:center; padding:2rem; border-radius:50%; background:radial-gradient(circle,rgba(255,209,102,0.25),transparent 70%); }
.jubilee-single-fallback-year {
  font-family:var(--font-heading); font-weight:900;
  font-size:clamp(3.5rem,8vw,6rem); line-height:1;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 16px 34px rgba(255,209,102,0.55));
}
.jubilee-single-fallback-year small { font-size:.4em; vertical-align:super; }
.jubilee-single-fallback-label { font-family:var(--font-heading); font-size:1.25rem; color:#fff; margin-top:.35rem; }
.jubilee-single-center { text-align:left; color:#fff; }
.jubilee-single-label { display:inline-block; font-size:.72rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,0.65); font-weight:700; margin-bottom:.5rem; }
.jubilee-single-title {
  font-family:var(--font-heading); font-size:clamp(1.75rem,3.4vw,2.6rem);
  font-weight:800; letter-spacing:-0.02em; margin:0 0 .5rem;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; line-height:1.1;
}
.jubilee-single-sub { color:rgba(255,255,255,0.82); font-size:1rem; margin:0 0 1.5rem; letter-spacing:.02em; }
.jubilee-single-facts { display:grid; grid-template-columns:1fr 1fr; gap:.6rem .85rem; margin-bottom:1.75rem; }
.jubilee-single-facts span {
  display:inline-flex; align-items:center; gap:.55rem;
  color:rgba(255,255,255,0.9); font-weight:600; font-size:.82rem;
  padding:.55rem .85rem; border-radius:var(--r-full);
  background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.10);
}
.jubilee-single-facts span i { color:var(--amber-400); font-size:.8rem; }
.jubilee-single-cta { display:flex; gap:.75rem; flex-wrap:wrap; }
@media (max-width:991px) {
  .jubilee-single-layout { grid-template-columns:1fr; gap:2rem; text-align:center; }
  .jubilee-single-center { text-align:center; }
  .jubilee-single-facts { justify-content:center; }
  .jubilee-single-cta { justify-content:center; }
}

/* ---------- 13. FILMSTRIP GALLERY ---------- */
.filmstrip-section {
  position:relative; padding:clamp(3.5rem,7vw,6rem) 0 clamp(2.75rem,4.5vw,3.5rem);
  background:linear-gradient(180deg,#0F0A1A 0%,#17122B 100%); color:#fff; overflow:hidden;
}
.filmstrip-section .section-title { color:#fff; }
.filmstrip-section .section-label { background:rgba(255,77,109,0.14); border-color:rgba(255,77,109,0.30); color:#FFB3C1; }
.filmstrip-section .section-label::before { background:var(--grad-gold); box-shadow:0 0 0 4px rgba(255,209,102,0.18); }
.filmstrip-section .btn-see-more { color:var(--amber-400); }
.filmstrip-section .btn-see-more:hover { color:#FFE9B0; }
.filmstrip-wrap { position:relative; margin-top:1rem; padding:0; overflow:hidden; }
.filmstrip-strip {
  display:flex; gap:12px; width:100%; padding:30px 24px;
  background:#08060D;
  background-image:
    repeating-linear-gradient(90deg,#08060D 0 16px,#1a1a1a 16px 24px,#08060D 24px 40px),
    repeating-linear-gradient(90deg,#08060D 0 16px,#1a1a1a 16px 24px,#08060D 24px 40px);
  background-size:40px 14px,40px 14px;
  background-position:0 8px,0 calc(100% - 8px);
  background-repeat:repeat-x;
  overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:thin; scrollbar-color:#FF4D6D #1a1a1a; cursor:grab; outline:none;
}
.filmstrip-strip::-webkit-scrollbar { height:10px; }
.filmstrip-strip::-webkit-scrollbar-track { background:#1a1a1a; border-radius:10px; }
.filmstrip-strip::-webkit-scrollbar-thumb { background:linear-gradient(90deg,#FF4D6D,#FFD166); border-radius:10px; border:2px solid #08060D; }
.filmstrip-frame {
  flex:0 0 auto; width:min(340px,72vw); scroll-snap-align:center;
  border:4px solid #F5F1EA; border-radius:4px;
  background:#0F0A1A; overflow:hidden; margin:0; position:relative;
  transition:all .4s var(--ease); box-shadow:0 20px 45px rgba(0,0,0,0.55);
}
.filmstrip-frame:hover { border-color:#FFD166; transform:translateY(-6px); box-shadow:0 30px 60px rgba(255,77,109,0.35),0 0 0 1px rgba(255,209,102,0.4); }
.filmstrip-frame-link { display:block; text-decoration:none; color:#fff; position:relative; }
.filmstrip-frame-media {
  position:relative; aspect-ratio:3/2; background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.45); font-size:2.5rem;
  filter:saturate(0.95) contrast(1.05); transition:filter .5s var(--ease);
}
.filmstrip-frame:hover .filmstrip-frame-media { filter:saturate(1.15) contrast(1.1) brightness(1.05); }
.filmstrip-frame-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 35%,rgba(15,10,26,0.85) 100%); pointer-events:none; }
.filmstrip-frame-count { position:absolute; top:.6rem; right:.6rem; padding:.3rem .7rem; background:rgba(255,209,102,0.92); color:#3A2A00; border-radius:var(--r-full); font-size:.68rem; font-weight:800; z-index:2; }
.filmstrip-frame-caption { position:absolute; left:0; right:0; bottom:0; padding:1rem 1.1rem 1.1rem; z-index:2; }
.filmstrip-frame-caption h5 { font-family:var(--font-heading); color:#fff; font-size:.95rem; font-weight:700; margin:0 0 .2rem; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.filmstrip-frame-caption small { color:rgba(255,209,102,0.92); font-size:.7rem; font-weight:600; }
.filmstrip-cta { display:flex; justify-content:center; margin-top:2rem; }

/* ---------- 14. JOURNEY TIMELINE ---------- */
.journey-timeline {
  position:relative; padding:clamp(3.5rem,7vw,6rem) 0;
  background:
    radial-gradient(900px 500px at 15% 10%,rgba(255,77,109,0.10),transparent 60%),
    radial-gradient(900px 500px at 85% 90%,rgba(139,92,246,0.10),transparent 60%),
    radial-gradient(900px 500px at 50% 50%,rgba(45,212,191,0.06),transparent 60%),
    linear-gradient(180deg,#FFF9F4 0%,#FFF1F4 100%);
  overflow:hidden;
}
.journey-aurora {
  position:absolute; inset:0;
  background-image:
    radial-gradient(2px 2px at 10% 15%,rgba(255,209,102,0.9),transparent 60%),
    radial-gradient(1.5px 1.5px at 85% 25%,rgba(255,77,109,0.8),transparent 60%),
    radial-gradient(2px 2px at 30% 80%,rgba(45,212,191,0.85),transparent 60%),
    radial-gradient(1.5px 1.5px at 70% 55%,rgba(167,139,250,0.85),transparent 60%);
  pointer-events:none; opacity:.8; animation:sparkleTwinkle 6s ease-in-out infinite;
}
.journey-layout { display:grid; grid-template-columns:380px 1fr; gap:2.25rem; align-items:start; }
.journey-sidebar {
  background:linear-gradient(180deg,#FFFFFF 0%,#FFF7F4 100%);
  border-radius:var(--r-xl); padding:1.5rem 1.35rem;
  border:1px solid rgba(255,77,109,0.12);
  box-shadow:0 20px 50px rgba(31,25,55,0.10),0 0 0 1px rgba(255,209,102,0.08) inset;
  position:sticky; top:100px; max-height:700px; display:flex; flex-direction:column;
}
.journey-sidebar-head { display:flex; align-items:center; gap:.85rem; padding:0 .3rem 1.15rem; border-bottom:1.5px solid var(--line); margin-bottom:1.15rem; }
.journey-sidebar-head > i {
  width:44px; height:44px; border-radius:13px;
  background:linear-gradient(135deg,#FF4D6D 0%,#C9184A 40%,#7C3AED 100%);
  background-size:200% 200%; animation:auroraShift 6s ease-in-out infinite alternate;
  color:#fff; display:inline-flex; align-items:center; justify-content:center;
  font-size:1rem; box-shadow:0 10px 22px rgba(244,63,94,0.35),0 0 0 4px rgba(255,209,102,0.18);
  flex-shrink:0;
}
.js-head-title { display:block; font-family:var(--font-heading); font-weight:800; font-size:1rem; color:var(--ink); line-height:1.15; }
.js-head-sub { display:block; font-size:.72rem; color:var(--muted); font-weight:600; letter-spacing:.04em; margin-top:.2rem; }
.journey-list { list-style:none; margin:0; padding:0; overflow-y:auto; flex:1; scrollbar-width:thin; }
.journey-list::-webkit-scrollbar { width:6px; }
.journey-list::-webkit-scrollbar-thumb { background:var(--rose-300); border-radius:6px; }
.journey-list-item {
  display:flex; align-items:center; gap:.85rem;
  padding:.85rem .7rem; border-radius:14px; cursor:pointer;
  transition:all .35s var(--ease); border-left:3px solid transparent;
  margin-bottom:.35rem; position:relative;
}
.journey-list-item:hover { background:var(--rose-50); }
.journey-list-item.active {
  background:linear-gradient(135deg,rgba(255,77,109,0.14) 0%,rgba(255,209,102,0.10) 50%,rgba(124,58,237,0.10) 100%);
  position:relative; box-shadow:0 12px 26px rgba(244,63,94,0.14),0 0 0 1px rgba(255,209,102,0.25);
}
.journey-list-item.active::before {
  content:""; position:absolute; left:0; top:8px; bottom:8px; width:4px; border-radius:4px;
  background:linear-gradient(180deg,#FF4D6D 0%,#FFD166 50%,#7C3AED 100%);
}
.journey-list-num { position:absolute; top:.5rem; right:.7rem; font-family:var(--font-heading); font-size:.65rem; font-weight:800; color:var(--rose-500); opacity:.9; letter-spacing:.05em; }
.journey-list-item.active .journey-list-num { color:#7C3AED; opacity:1; }
.journey-list-icon { width:40px; height:40px; border-radius:12px; background:var(--grad-red); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:.88rem; flex-shrink:0; transition:all .35s var(--ease); box-shadow:0 8px 18px rgba(244,63,94,0.22); }
.journey-list-milestone .journey-list-icon { background:var(--grad-violet); }
.journey-list-award .journey-list-icon { background:var(--grad-gold); color:#3A2A00; }
.journey-list-item.active .journey-list-icon { background:linear-gradient(135deg,#FF4D6D 0%,#FFD166 100%); transform:scale(1.1) rotate(-8deg); box-shadow:0 12px 26px rgba(255,209,102,0.35),0 0 0 3px rgba(255,209,102,0.25); }
.journey-list-text { flex:1; min-width:0; padding-right:1.4rem; }
.journey-list-meta { display:block; font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; color:var(--rose-600); margin-bottom:.2rem; }
.journey-list-milestone .journey-list-meta { color:#7C3AED; }
.journey-list-award .journey-list-meta { color:#D97706; }
.journey-list-title { display:-webkit-box; font-family:var(--font-heading); font-weight:700; font-size:.88rem; color:var(--ink); line-height:1.35; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.journey-viewport { position:relative; min-height:580px; }
.journey-stage {
  position:relative; background:#fff; border-radius:var(--r-xl);
  padding:2rem; box-shadow:0 24px 60px rgba(31,25,55,0.12);
  border:1px solid var(--line); overflow:hidden; min-height:580px;
  display:flex; flex-direction:column;
}
.journey-road-bg { position:absolute; top:50%; left:0; right:0; height:110px; transform:translateY(-50%); pointer-events:none; z-index:0; overflow:hidden; border-radius:20px; }
.road-scene { position:absolute; inset:0; overflow:hidden; border-radius:20px; }
.road-sky { position:absolute; inset:0 0 40% 0; background:linear-gradient(180deg,#2B1F4D 0%,#5B2C4F 60%,#8B3A5C 100%); }
.road-hills {
  position:absolute; left:0; right:0; bottom:40%; height:60px;
  background:
    radial-gradient(circle at 20% 100%,#C9184A 0 40px,transparent 42px),
    radial-gradient(circle at 55% 100%,#7C3AED 0 50px,transparent 52px),
    radial-gradient(circle at 85% 100%,#FF4D6D 0 45px,transparent 47px);
  opacity:.65; filter:blur(1px);
}
.road-surface {
  position:absolute; left:0; right:0; bottom:0; height:45%;
  background:linear-gradient(180deg,#1a1523 0%,#0d0a14 100%);
  border-top:3px solid #FFD166;
  box-shadow:0 -6px 20px rgba(255,209,102,0.35),inset 0 4px 12px rgba(0,0,0,0.6);
}
.road-stripe {
  position:absolute; top:50%; left:0; right:0; height:5px;
  transform:translateY(-50%);
  background-image:linear-gradient(90deg,#FFD166 0 55px,transparent 55px 110px);
  background-size:110px 5px; background-repeat:repeat-x;
  border-radius:3px; box-shadow:0 0 14px rgba(255,209,102,0.7);
  animation:roadMove 12s linear infinite;
}
@keyframes roadMove { from { background-position:0 0; } to { background-position:110px 0; } }
.road-glow { position:absolute; width:200px; height:40px; border-radius:50%; filter:blur(24px); opacity:.7; top:50%; transform:translateY(-50%); }
.road-glow-1 { background:rgba(255,77,109,0.65); left:8%; animation:glowDrift 6s ease-in-out infinite; }
.road-glow-2 { background:rgba(255,209,102,0.65); left:45%; animation:glowDrift 6s ease-in-out infinite .5s; }
.road-glow-3 { background:rgba(45,212,191,0.6); right:8%; animation:glowDrift 6s ease-in-out infinite 1s; }
@keyframes glowDrift { 0%,100% { transform:translateY(-50%) scale(1); opacity:.7; } 50% { transform:translateY(-50%) scale(1.3); opacity:1; } }
.journey-road-line { display:none; }
.journey-cards-pair { position:relative; z-index:1; flex:1; display:grid; grid-template-columns:1fr 1fr; gap:1.15rem; padding:1.75rem 0; align-items:center; }
.journey-card { opacity:0; transform:translateY(20px) scale(0.96); transition:opacity .7s var(--ease),transform .7s var(--ease); pointer-events:none; display:none; }
.journey-card.active { display:block; opacity:1; transform:none; pointer-events:auto; animation:fadeInUp .6s var(--ease) both; }
.journey-card-link {
  display:flex; flex-direction:column; background:#fff; border-radius:var(--r-lg);
  overflow:hidden; text-decoration:none; color:inherit;
  box-shadow:0 20px 50px rgba(31,25,55,0.15); border:1px solid rgba(31,25,55,0.05);
  transition:all .4s var(--ease); height:100%;
}
.journey-card-programme .journey-card-link { border-top:3px solid #FF4D6D; }
.journey-card-milestone .journey-card-link { border-top:3px solid #7C3AED; }
.journey-card-award .journey-card-link { border-top:3px solid #F59E0B; }
.journey-card-link:hover { color:inherit; transform:translateY(-4px); }
.journey-card-programme .journey-card-link:hover { box-shadow:0 30px 60px rgba(244,63,94,0.28); }
.journey-card-milestone .journey-card-link:hover { box-shadow:0 30px 60px rgba(124,58,237,0.28); }
.journey-card-award .journey-card-link:hover { box-shadow:0 30px 60px rgba(245,158,11,0.28); }
.journey-card-photo { position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--grad-red); }
.journey-card-photo img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.journey-card-link:hover .journey-card-photo img { transform:scale(1.06); }
.journey-card-photo-fallback { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2.5rem; }
.journey-card-programme .journey-card-photo-fallback { background:linear-gradient(135deg,#FF4D6D,#C9184A); }
.journey-card-milestone .journey-card-photo-fallback { background:linear-gradient(135deg,#A78BFA,#7C3AED); }
.journey-card-award .journey-card-photo-fallback { background:linear-gradient(135deg,#FFD166,#F59E0B); color:#3A2A00; }
.journey-card-body { padding:1.35rem 1.25rem 1.35rem; text-align:left; flex:1; display:flex; flex-direction:column; }
.journey-card-meta { display:inline-block; padding:.25rem .75rem; border-radius:var(--r-full); font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.7rem; align-self:flex-start; }
.journey-card-programme .journey-card-meta { background:rgba(255,77,109,0.14); color:#C9184A; }
.journey-card-milestone .journey-card-meta { background:rgba(124,58,237,0.14); color:#6D28D9; }
.journey-card-award .journey-card-meta { background:rgba(255,209,102,0.25); color:#92400E; }
.journey-card-title { font-family:var(--font-heading); font-size:.98rem; font-weight:800; color:var(--ink); margin:0 0 .5rem; line-height:1.3; }
.journey-card-text { color:var(--muted); font-size:.82rem; line-height:1.6; margin:0 0 .9rem; flex:1; }
.journey-card-link-text { display:inline-flex; align-items:center; gap:.4rem; font-weight:700; font-size:.8rem; transition:gap .3s var(--ease); align-self:flex-start; }
.journey-card-programme .journey-card-link-text { color:#C9184A; }
.journey-card-milestone .journey-card-link-text { color:#7C3AED; }
.journey-card-award .journey-card-link-text { color:#D97706; }
.journey-card-link:hover .journey-card-link-text { gap:.7rem; }
.journey-controls { display:flex; align-items:center; gap:1rem; padding-top:1rem; border-top:1px solid var(--line); z-index:2; position:relative; }
.journey-ctrl { width:44px; height:44px; border-radius:50%; background:#fff; border:1.5px solid var(--line); color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s var(--ease); flex-shrink:0; }
.journey-ctrl:hover { background:linear-gradient(135deg,#FF4D6D 0%,#7C3AED 100%); color:#fff; border-color:transparent; box-shadow:0 14px 30px rgba(244,63,94,0.35),0 0 0 4px rgba(255,209,102,0.20); }
.journey-progress-track { flex:1; height:4px; background:var(--line); border-radius:var(--r-full); overflow:hidden; }
.journey-progress-fill { height:100%; width:0%; background:linear-gradient(90deg,#FF4D6D 0%,#FFD166 50%,#7C3AED 100%); border-radius:var(--r-full); box-shadow:0 0 12px rgba(255,209,102,0.6); }
.journey-timeline-cta { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; margin-top:2.5rem; }

/* ---------- 15. NEWS ---------- */
.news-section-v2 { padding:clamp(3.5rem,7vw,6rem) 0; background:#fff; }
.news-ticker-bar { display:flex; align-items:center; gap:1.25rem; background:var(--ink); border-radius:var(--r-full); padding:.5rem .5rem .5rem 1.35rem; margin-bottom:2.25rem; overflow:hidden; box-shadow:var(--sh-md); }
.news-ticker-label { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1.1rem; background:var(--grad-red); color:#fff; border-radius:var(--r-full); font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap; flex-shrink:0; }
.news-ticker-label i { animation:pulseGlow 1.8s ease-in-out infinite; font-size:.75rem; }
.news-ticker-track { flex:1; overflow:hidden; position:relative; mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent); }
.news-ticker-scroll { display:flex; gap:2.25rem; animation:marquee 45s linear infinite; white-space:nowrap; }
.news-ticker-item { display:inline-flex; align-items:center; gap:.55rem; color:rgba(255,255,255,0.8); font-size:.84rem; font-weight:500; }
.news-ticker-item i { color:var(--rose-500); font-size:.42rem; }
.news-ticker-item:hover { color:var(--amber-400); }
.news-split-grid { display:grid; grid-template-columns:320px 1fr; gap:1.75rem; align-items:stretch; }
.news-side-slider, .news-featured-slider { position:relative; border-radius:var(--r-lg); overflow:hidden; min-height:440px; }
.news-side-slider { background:var(--ink); padding:1.35rem; }
.news-side-label { display:inline-flex; align-items:center; gap:.5rem; color:var(--rose-500); font-size:.68rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1.15rem; }
.news-side-label i { font-size:.45rem; animation:pulseGlow 1.6s infinite; }
.news-side-track { position:relative; height:340px; }
.news-side-item {
  position:absolute; inset:0; padding:1.15rem; border-radius:var(--r-md);
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08);
  background-size:cover !important; background-position:center !important;
  opacity:0; transform:translateX(20px); transition:all .55s var(--ease); cursor:pointer;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.news-side-item.active { opacity:1; transform:none; }
.news-side-item:not([style*="background-image"]).active { background:linear-gradient(180deg,rgba(255,77,109,0.15),rgba(31,25,55,0.6)); }
.news-side-item-content { position:relative; z-index:2; }
.news-side-item-date { color:var(--amber-400); font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:.5rem; }
.news-side-item-title { color:#fff; font-size:.98rem; margin:0 0 .5rem; line-height:1.35; }
.news-side-item-excerpt { color:rgba(255,255,255,0.68); font-size:.78rem; margin:0; }
.news-side-dots { display:flex; gap:.35rem; justify-content:center; margin-top:.85rem; }
.news-side-dot { width:18px; height:3px; border-radius:var(--r-full); background:rgba(255,255,255,0.2); border:0; cursor:pointer; transition:all .35s var(--ease); }
.news-side-dot.active { background:var(--rose-500); width:32px; }
.news-featured-slider { position:relative; background:var(--ink); }
.news-featured-item { position:absolute; inset:0; background-size:cover; background-position:center; background-image:var(--bg-img); opacity:0; transition:opacity 1s var(--ease); display:flex; align-items:flex-end; cursor:pointer; }
.news-featured-item.active { opacity:1; }
.news-featured-item::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(31,25,55,0.9) 100%); }
.news-featured-content { position:relative; padding:2.5rem 2.25rem; max-width:640px; }
.news-featured-badge { display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .9rem; background:var(--grad-gold); color:#3A2A00; border-radius:var(--r-full); font-size:.66rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.85rem; }
.news-featured-title { color:#fff; font-size:clamp(1.15rem,2vw,1.6rem); margin:0 0 .65rem; line-height:1.25; }
.news-featured-excerpt { color:rgba(255,255,255,0.8); font-size:.88rem; margin:0 0 1.1rem; }
.news-featured-cta { display:inline-flex; align-items:center; gap:.5rem; color:var(--amber-400); font-weight:700; font-size:.84rem; }
.news-featured-nav { position:absolute; bottom:1.35rem; right:1.35rem; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.25); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(10px); transition:all .35s var(--ease); z-index:5; }
.news-featured-nav:hover { background:var(--grad-red); border-color:transparent; }
.news-featured-prev { right:4.35rem; }
.news-card { display:block; border-radius:var(--r-lg); overflow:hidden; background:#fff; border:1px solid var(--line); box-shadow:var(--sh-sm); transition:all .45s var(--ease); height:100%; text-decoration:none; color:inherit; }
.news-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); color:inherit; }
.news-image-wrapper { position:relative; aspect-ratio:16/10; overflow:hidden; }
.news-image-wrapper img { width:100%; height:100%; object-fit:cover; }
.news-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:var(--grad-rose); color:rgba(255,255,255,0.6); font-size:2.75rem; }
.news-category { position:absolute; top:1rem; left:1rem; padding:.28rem .8rem; background:var(--grad-gold); color:#3A2A00; border-radius:var(--r-full); font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.news-card .card-body { padding:1.35rem 1.25rem 1.5rem; }
.news-card h5 { font-size:.98rem; margin:0 0 .85rem; }
.news-meta { font-size:.74rem; color:var(--muted); margin-bottom:.55rem; font-weight:600; }
.read-more { color:var(--rose-600); font-size:.82rem; font-weight:700; }
.news-full-card { display:grid; grid-template-columns:320px 1fr; gap:2rem; align-items:center; background:#fff; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--sh-sm); margin-bottom:1.75rem; transition:all .45s var(--ease); text-decoration:none; color:inherit; }
.news-full-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); }
.news-full-photo { aspect-ratio:4/3; overflow:hidden; }
.news-full-photo img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.news-full-card:hover .news-full-photo img { transform:scale(1.06); }
.news-full-body { padding:2rem 2rem 2rem 0; }
.news-full-date { display:inline-block; padding:.25rem .8rem; background:var(--rose-50); color:var(--rose-700); border-radius:var(--r-full); font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:.85rem; }
.news-full-body h3 { font-size:1.2rem; margin:0 0 .75rem; }
.news-full-body p { color:var(--muted); font-size:.9rem; line-height:1.75; }
.news-full-meta { display:flex; justify-content:space-between; align-items:center; margin-top:1rem; }
.news-full-read { color:var(--rose-600); font-weight:700; font-size:.84rem; display:inline-flex; align-items:center; gap:.45rem; }

/* ---------- 16. REPORTS ---------- */
.reports-home-section { padding:clamp(3.5rem,7vw,6rem) 0; background:linear-gradient(180deg,var(--cream) 0%,#fff 100%); }
.reports-home-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1.25rem; }
.report-home-card { display:grid; grid-template-columns:66px 1fr auto; gap:1.1rem; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.25rem 1.35rem; transition:all .4s var(--ease); box-shadow:var(--sh-sm); }
.report-home-card:hover { transform:translateY(-5px); box-shadow:var(--sh-lg); border-color:transparent; }
.report-home-icon { width:66px; height:66px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; font-size:1.85rem; flex-shrink:0; }
.report-home-body h4 { font-family:var(--font-heading); font-size:.98rem; margin:0 0 .3rem; line-height:1.3; }
.report-home-body p { color:var(--muted); font-size:.82rem; margin:0 0 .5rem; line-height:1.55; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.report-home-meta { display:flex; gap:.85rem; flex-wrap:wrap; font-size:.68rem; color:var(--muted); font-weight:600; }
.report-home-meta span { display:inline-flex; align-items:center; gap:.3rem; }
.report-home-meta i { color:var(--rose-500); }
.report-home-actions { display:flex; flex-direction:column; gap:.45rem; align-items:stretch; }

/* ---------- 17. IMPACT TILES ---------- */
.impact-compact-section { padding:clamp(3rem,5.5vw,4.5rem) 0; background:linear-gradient(180deg,#FFF9F4 0%,#FFF4EC 100%); }
.impact-compact-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; max-width:1100px; margin:0 auto; }
.impact-tile { position:relative; display:flex; align-items:center; gap:1.05rem; padding:1.25rem 1.4rem; border-radius:var(--r-lg); background:linear-gradient(180deg,#FFFFFF 0%,#FFFBF8 100%); border:1px solid var(--line); box-shadow:var(--sh-sm); overflow:hidden; transition:all .45s var(--ease); }
.impact-tile:hover { transform:translateY(-6px); box-shadow:var(--sh-lg); border-color:transparent; background:#fff; }
.impact-tile-icon { width:52px; height:52px; flex-shrink:0; border-radius:15px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.25rem; position:relative; z-index:2; }
.impact-tile-red .impact-tile-icon { background:var(--grad-red); box-shadow:0 12px 24px rgba(244,63,94,0.28); }
.impact-tile-gold .impact-tile-icon { background:var(--grad-gold); box-shadow:0 12px 24px rgba(245,158,11,0.28); color:#3A2A00; }
.impact-tile-teal .impact-tile-icon { background:var(--grad-teal); box-shadow:0 12px 24px rgba(20,184,166,0.28); }
.impact-tile-violet .impact-tile-icon { background:var(--grad-violet); box-shadow:0 12px 24px rgba(124,58,237,0.28); }
.impact-tile-body { position:relative; z-index:2; min-width:0; }
.impact-tile-value { font-family:var(--font-heading); font-weight:800; font-size:clamp(1.3rem,2.1vw,1.7rem); color:var(--ink); line-height:1; }
.impact-tile-label { color:var(--muted); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-top:.3rem; }
.impact-tile-shine { position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:conic-gradient(from 0deg,transparent,rgba(255,77,109,0.06),transparent); animation:rotateSlow 18s linear infinite; pointer-events:none; z-index:1; }

/* ---------- 18. INFO CARDS ---------- */
.info-card { position:relative; background:linear-gradient(180deg,#FFFFFF 0%,#FFFDFC 100%); border-radius:var(--r-lg); padding:1.75rem 1.65rem; border:1px solid var(--line); box-shadow:var(--sh-sm); transition:all .45s var(--ease); overflow:hidden; height:100%; }
.info-card::before { content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--grad-rose); transform:scaleX(0); transform-origin:left; transition:transform .55s var(--ease); }
.info-card:hover { transform:translateY(-8px); box-shadow:var(--sh-lg); border-color:transparent; background:#fff; }
.info-card:hover::before { transform:scaleX(1); }
.info-card h3 { font-size:1.05rem; margin-bottom:.6rem; }
.info-card p { color:var(--muted); margin:0; font-size:.9rem; line-height:1.75; }

/* ---------- 19. OFFICER CARDS ---------- */
.officer-card { position:relative; border-radius:var(--r-lg); overflow:hidden; background:linear-gradient(180deg,#FFFFFF 0%,#FFFDFC 100%); border:1px solid var(--line); box-shadow:var(--sh-sm); transition:all .45s var(--ease); }
.officer-card:hover { transform:translateY(-8px); box-shadow:var(--sh-lg); }
.officer-photo { aspect-ratio:1/1.05; overflow:hidden; background:var(--grad-rose); position:relative; }
.officer-photo img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.officer-card:hover .officer-photo img { transform:scale(1.08); }
.officer-photo-fallback { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:var(--grad-ink); color:var(--amber-400); font-size:3.5rem; }
.officer-body { padding:1.35rem 1.2rem; text-align:center; }
.officer-role { display:inline-block; padding:.25rem .8rem; background:var(--rose-50); color:var(--rose-700); border-radius:var(--r-full); font-size:.64rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.7rem; }
.officer-name { margin:0 0 .3rem; font-size:.98rem; }
.officer-title { font-size:.82rem; color:var(--muted); margin:0; }

/* ---------- 20. CTA ---------- */
.cta-section {
  position:relative; padding:clamp(3.5rem,7vw,6rem) 0;
  background:
    radial-gradient(900px 500px at 15% 20%,rgba(255,209,102,0.25),transparent 60%),
    radial-gradient(900px 500px at 85% 80%,rgba(45,212,191,0.20),transparent 60%),
    var(--grad-red);
  color:#fff; overflow:hidden;
}
.cta-section::before { content:""; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M0 30h60M30 0v60' stroke='rgba(255,255,255,0.06)' stroke-width='1'/%3E%3C/svg%3E"); opacity:.8; pointer-events:none; }
.cta-section h2 { color:#fff; font-size:clamp(1.5rem,2.7vw,2.15rem); }
.cta-section p { color:rgba(255,255,255,0.85); font-size:1rem; margin-bottom:1.75rem; }
.cta-section .section-label { background:rgba(255,255,255,0.15); border-color:rgba(255,255,255,0.3); color:#fff; }
.cta-section .section-label::before { background:#fff; box-shadow:0 0 0 4px rgba(255,255,255,0.2); }

/* ---------- 21. SUPPORT CTA ---------- */
.support-cta-section {
  position:relative; padding:clamp(3.5rem,7vw,6rem) 0;
  background:linear-gradient(135deg,#1F1937 0%,#3D2C5E 55%,#6B1C3E 100%);
  overflow:hidden; color:#fff;
}
.support-cta-bg { position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M0 40h80M40 0v80' stroke='rgba(255,255,255,0.04)' stroke-width='1'/%3E%3C/svg%3E"); pointer-events:none; }
.support-cta-glow { position:absolute; width:700px; height:700px; border-radius:50%; top:50%; left:20%; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(255,77,109,0.35),transparent 70%); filter:blur(80px); animation:floatSlow 18s ease-in-out infinite; pointer-events:none; }
.support-cta-inner { position:relative; display:grid; grid-template-columns:1.25fr 1fr; gap:2.5rem; align-items:center; }
.support-cta-label { display:inline-flex; align-items:center; gap:.5rem; padding:.45rem 1.05rem; background:rgba(255,209,102,0.15); border:1px solid rgba(255,209,102,0.3); border-radius:var(--r-full); color:var(--amber-400); font-weight:700; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.15rem; }
.support-cta-title { font-family:var(--font-heading); color:#fff; font-size:clamp(1.5rem,2.7vw,2.15rem); font-weight:800; line-height:1.15; letter-spacing:-0.02em; margin:0 0 .9rem; }
.support-cta-title span { background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; font-style:italic; }
.support-cta-text { color:rgba(255,255,255,0.78); font-size:.98rem; line-height:1.75; max-width:540px; margin:0 0 1.75rem; }
.support-cta-actions { display:flex; flex-direction:column; gap:.8rem; max-width:480px; }
.support-cta-btn { display:grid; grid-template-columns:48px 1fr 22px; gap:.95rem; align-items:center; padding:.95rem 1.25rem; border-radius:18px; text-decoration:none; transition:all .4s var(--ease); position:relative; overflow:hidden; }
.support-cta-btn::before { content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,0.18) 50%,transparent 60%); transform:translateX(-100%); transition:transform 1s var(--ease); }
.support-cta-btn:hover::before { transform:translateX(100%); }
.support-cta-btn-icon { width:48px; height:48px; border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:1.15rem; flex-shrink:0; transition:all .5s var(--ease-bounce); }
.support-cta-btn:hover .support-cta-btn-icon { transform:scale(1.15) rotate(-10deg); box-shadow:0 14px 30px rgba(0,0,0,0.35); }
.support-cta-btn-text { display:flex; flex-direction:column; line-height:1.2; }
.support-cta-btn-text strong { font-family:var(--font-heading); font-size:.98rem; font-weight:800; }
.support-cta-btn-text small { font-size:.74rem; opacity:.8; letter-spacing:.03em; margin-top:.15rem; }
.support-cta-btn-arrow { font-size:.9rem; transition:transform .35s var(--ease); }
.support-cta-btn:hover .support-cta-btn-arrow { transform:translateX(6px); }
.support-cta-btn-primary { background:linear-gradient(135deg,#FF4D6D 0%,#C9184A 100%); color:#fff; box-shadow:0 18px 40px rgba(244,63,94,0.42); }
.support-cta-btn-primary:hover { color:#fff; transform:translateY(-4px); box-shadow:0 28px 60px rgba(244,63,94,0.55); }
.support-cta-btn-primary .support-cta-btn-icon { background:rgba(255,255,255,0.22); color:#fff; }
.support-cta-btn-secondary { background:rgba(255,255,255,0.06); border:1.5px solid rgba(255,255,255,0.16); color:#fff; backdrop-filter:blur(10px); }
.support-cta-btn-secondary:hover { background:rgba(255,255,255,0.12); color:#fff; transform:translateY(-4px); border-color:rgba(255,209,102,0.5); }
.support-cta-btn-secondary .support-cta-btn-icon { background:var(--grad-teal); color:#fff; }
.support-cta-btn-tertiary { background:rgba(255,255,255,0.06); border:1.5px solid rgba(255,255,255,0.16); color:#fff; }
.support-cta-btn-tertiary .support-cta-btn-icon { background:var(--grad-gold); color:#3A2A00; }
.support-cta-visual { position:relative; aspect-ratio:1/1; max-width:400px; margin:0 auto; border-radius:50%; background:radial-gradient(circle at 50% 40%,rgba(255,209,102,0.28),transparent 65%); display:flex; align-items:center; justify-content:center; }
.support-cta-visual-orb { position:absolute; inset:-20px; border-radius:50%; border:1.5px dashed rgba(255,209,102,0.32); animation:rotateSlow 44s linear infinite; }
.support-cta-visual-icon { width:150px; height:150px; border-radius:50%; background:var(--grad-gold); color:#3A2A00; display:flex; align-items:center; justify-content:center; font-size:3.75rem; box-shadow:0 30px 70px rgba(245,158,11,0.55); animation:bob 5s ease-in-out infinite; }
.support-cta-visual-stats { position:absolute; inset:0; pointer-events:none; }
.support-cta-stat { position:absolute; padding:.5rem .9rem; background:rgba(255,255,255,0.10); border:1px solid rgba(255,255,255,0.18); border-radius:var(--r-full); backdrop-filter:blur(14px); display:flex; flex-direction:column; align-items:center; text-align:center; box-shadow:0 10px 24px rgba(0,0,0,0.25); animation:bob 6s ease-in-out infinite; }
.support-cta-stat-1 { top:8%; left:-4%; animation-delay:0s; }
.support-cta-stat-2 { top:45%; right:-8%; animation-delay:-2s; }
.support-cta-stat-3 { bottom:6%; left:12%; animation-delay:-4s; }
.support-cta-stat strong { color:var(--amber-400); font-family:var(--font-heading); font-size:.95rem; font-weight:800; line-height:1; }
.support-cta-stat span { color:rgba(255,255,255,0.82); font-size:.64rem; font-weight:600; letter-spacing:.04em; margin-top:.15rem; }

/* ---------- 22. CONTACT & FORMS ---------- */
.contact-split { display:grid; grid-template-columns:1fr 1.15fr; gap:2.5rem; align-items:start; }
.contact-info-box { background:var(--grad-ink); color:#fff; padding:2.25rem; border-radius:var(--r-xl); box-shadow:var(--sh-lg); position:relative; overflow:hidden; }
.contact-info-box::before { content:""; position:absolute; top:-40%; right:-40%; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(255,77,109,0.4),transparent 70%); filter:blur(40px); }
.contact-info-box > * { position:relative; }
.contact-info-box h3 { color:#fff; font-size:1.35rem; margin-bottom:.75rem; }
.contact-info-box .lead { color:rgba(255,255,255,0.75); margin-bottom:1.75rem; font-size:.95rem; }
.contact-info-item { display:flex; gap:.95rem; align-items:flex-start; padding:1rem 0; border-bottom:1px solid rgba(255,255,255,0.08); }
.contact-info-item:last-child { border-bottom:0; }
.contact-info-item > i { flex-shrink:0; width:42px; height:42px; border-radius:13px; background:var(--grad-red); color:#fff; display:flex; align-items:center; justify-content:center; font-size:.95rem; box-shadow:var(--sh-rose); }
.contact-info-item:nth-child(2) > i { background:var(--grad-gold); box-shadow:var(--sh-gold); }
.contact-info-item:nth-child(3) > i { background:var(--grad-teal); box-shadow:var(--sh-teal); }
.contact-info-item:nth-child(4) > i { background:var(--grad-violet); box-shadow:var(--sh-violet); }
.contact-info-item strong { display:block; color:#fff; font-family:var(--font-heading); font-size:.9rem; margin-bottom:.15rem; }
.contact-info-item span, .contact-info-item a { color:rgba(255,255,255,0.7); font-size:.86rem; line-height:1.5; }
.contact-info-item a:hover { color:var(--amber-400); }
.modern-form { background:#fff; border-radius:var(--r-xl); padding:2.25rem; border:1px solid var(--line); box-shadow:var(--sh-md); }
.modern-form label { display:block; font-family:var(--font-body); font-weight:600; font-size:.82rem; color:var(--ink); margin-bottom:.35rem; }
.modern-form input, .modern-form textarea, .modern-form select { width:100%; padding:.85rem 1.05rem; border:1.5px solid var(--line); border-radius:var(--r-md); font-family:var(--font-body); font-size:.9rem; color:var(--ink); background:#FDFCFF; transition:all .3s var(--ease); outline:none; }
.modern-form input:focus, .modern-form textarea:focus, .modern-form select:focus { border-color:var(--rose-500); background:#fff; box-shadow:0 0 0 4px rgba(255,77,109,0.12); }
.modern-form textarea { min-height:120px; resize:vertical; }
.alert { display:flex; align-items:flex-start; gap:.9rem; padding:1rem 1.25rem; border-radius:var(--r-md); border:1px solid; font-size:.88rem; }
.alert-success { background:#ECFDF5; border-color:#A7F3D0; color:#065F46; }
.alert-danger { background:#FEF2F2; border-color:#FECACA; color:#991B1B; }
.alert i { font-size:1.1rem; flex-shrink:0; }

/* ---------- 23. DONATION ---------- */
.donate-tabs { display:flex; gap:.5rem; margin-bottom:2.25rem; flex-wrap:wrap; justify-content:center; }
.donate-tab { padding:.85rem 1.6rem; background:#fff; border:1.5px solid var(--line); border-radius:var(--r-full); font-family:var(--font-body); font-weight:700; font-size:.82rem; color:var(--muted); cursor:pointer; transition:all .35s var(--ease); }
.donate-tab:hover { border-color:var(--rose-500); color:var(--rose-600); transform:translateY(-2px); }
.donate-tab.active { background:var(--grad-red); border-color:transparent; color:#fff; box-shadow:var(--sh-rose); }
.donate-panel { display:none; animation:fadeInUp .5s var(--ease); }
.donate-panel.active { display:block; }
.qr-card { background:#fff; border-radius:var(--r-xl); padding:2.25rem; text-align:center; box-shadow:var(--sh-md); border:1px solid var(--line); }
.qr-image { max-width:240px; margin:1.35rem auto; border-radius:var(--r-md); box-shadow:var(--sh-md); }
.bank-card, .info-card[style*="linear-gradient"] { background:var(--grad-ink) !important; color:#fff; border-radius:var(--r-xl) !important; border:none !important; }
.bank-field { padding:1.05rem; background:rgba(255,255,255,0.05); border-radius:var(--r-md); border:1px solid rgba(255,209,102,0.18); margin-bottom:.8rem; }
.bank-field-label { font-family:var(--font-body); font-size:.64rem; letter-spacing:.15em; text-transform:uppercase; color:var(--amber-400); font-weight:800; margin-bottom:.3rem; }
.bank-field-value { color:#fff; font-weight:600; font-size:.94rem; }
.bank-field-value.mono { font-family:'Courier New',monospace; letter-spacing:.04em; }
.copy-btn { background:rgba(255,255,255,0.1); border:none; color:var(--amber-400); padding:4px 10px; border-radius:8px; font-size:.68rem; cursor:pointer; margin-left:8px; }
.copy-btn:hover { background:rgba(255,255,255,0.2); color:#fff; }
.amount-pill { padding:.55rem 1.05rem; border:1.5px solid var(--line); background:#fff; border-radius:var(--r-full); font-family:var(--font-body); font-weight:700; font-size:.8rem; color:var(--muted); cursor:pointer; transition:all .3s var(--ease); }
.amount-pill:hover, .amount-pill.active { border-color:var(--rose-500); color:var(--rose-600); background:var(--rose-50); transform:translateY(-2px); }

/* ---------- 24. PROSE / REPORTS ---------- */
.prose-content p { color:var(--ink-soft); line-height:1.85; margin-bottom:1.1rem; font-size:.96rem; }
.prose-content strong { color:var(--ink); font-weight:700; }
.feature-image-block { border-radius:var(--r-xl); overflow:hidden; aspect-ratio:4/5; background:var(--grad-rose); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.7); font-size:5rem; box-shadow:var(--sh-lg); position:relative; }
.feature-image-block img { width:100%; height:100%; object-fit:cover; }
.report-full-card { display:grid; grid-template-columns:66px 1fr auto; gap:1.35rem; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.35rem 1.5rem; margin-bottom:1rem; box-shadow:var(--sh-sm); transition:all .4s var(--ease); }
.report-full-card:hover { transform:translateX(6px); box-shadow:var(--sh-md); border-color:var(--rose-200); }
.report-full-icon { width:66px; height:66px; border-radius:var(--r-md); background:var(--rose-50); display:flex; align-items:center; justify-content:center; font-size:1.85rem; }
.report-full-body h4 { font-size:.98rem; margin:0 0 .35rem; }
.report-full-body p { color:var(--muted); font-size:.84rem; margin:0 0 .55rem; }
.report-full-meta { display:flex; gap:1.1rem; flex-wrap:wrap; font-size:.74rem; color:var(--muted); font-weight:600; }

/* ---------- 25. PAGINATION ---------- */
.pagination { display:flex; gap:.4rem; list-style:none; padding:0; }
.page-link { display:flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 .8rem; border-radius:var(--r-full); background:#fff; border:1.5px solid var(--line); color:var(--ink); font-weight:700; font-size:.86rem; transition:all .3s var(--ease); text-decoration:none; }
.page-link:hover { border-color:var(--rose-500); color:var(--rose-600); transform:translateY(-2px); }
.page-item.active .page-link { background:var(--grad-red); border-color:transparent; color:#fff; box-shadow:var(--sh-rose); }

/* ---------- 26. MODALS ---------- */
.activity-modal-backdrop, .event-modal-backdrop, .award-modal-backdrop, .lightbox-modal {
  position:fixed; inset:0; background:rgba(15,10,30,0.75); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center; z-index:9999; padding:1.5rem;
  opacity:0; pointer-events:none; transition:opacity .35s var(--ease);
}
.activity-modal-backdrop.active, .event-modal-backdrop.active, .award-modal-backdrop.active, .lightbox-modal.active { opacity:1; pointer-events:auto; }
.activity-modal, .event-modal, .award-modal, .lightbox-inner { background:#fff; border-radius:var(--r-xl); max-width:680px; width:100%; max-height:90vh; overflow:auto; box-shadow:0 40px 100px rgba(0,0,0,0.4); animation:modalIn .5s var(--ease-bounce); }
.activity-modal-header, .event-modal-header, .award-modal-header { padding:2rem 1.75rem; background:var(--grad-red); color:#fff; position:relative; }
.event-modal-header { background:var(--grad-violet); }
.award-modal-header { background:var(--grad-gold); color:#3A2A00; }
.activity-modal-header h3, .event-modal-header h3, .award-modal-header h3 { color:inherit; font-size:1.3rem; margin:0 0 .5rem; }
.activity-modal-close, .event-modal-close, .award-modal-close { position:absolute; top:1.05rem; right:1.05rem; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.18); border:0; color:#fff; cursor:pointer; font-size:.95rem; }
.activity-modal-body, .event-modal-body, .award-modal-body { padding:1.75rem; }
.lightbox-media img { max-width:100%; max-height:78vh; border-radius:var(--r-md); }
.lightbox-caption { padding:1.15rem; text-align:center; }

/* ---------- 27. SCROLL REVEAL ---------- */
.reveal { transition:opacity .9s var(--ease), transform .9s var(--ease); }
.js .reveal { opacity:0; transform:translateY(36px); }
.js .reveal.visible { opacity:1; transform:none; }
.js .reveal-left { opacity:0; transform:translateX(-50px); }
.js .reveal-right { opacity:0; transform:translateX(50px); }
.js .reveal-left.visible, .js .reveal-right.visible { opacity:1; transform:none; }
html:not(.js) .reveal, html:not(.js) .reveal-left, html:not(.js) .reveal-right { opacity:1 !important; transform:none !important; }
.reveal[data-delay="100"] { transition-delay:.1s; }
.reveal[data-delay="150"] { transition-delay:.15s; }
.reveal[data-delay="200"] { transition-delay:.2s; }
.reveal[data-delay="250"] { transition-delay:.25s; }
.reveal[data-delay="300"] { transition-delay:.3s; }

/* ---------- 28. KEYFRAMES ---------- */
@keyframes fadeInUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
@keyframes floatSlow { 0%,100% { transform:translate(0,0) scale(1); } 33% { transform:translate(40px,-30px) scale(1.05); } 66% { transform:translate(-30px,30px) scale(0.95); } }
@keyframes rotateSlow { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes pulseGlow { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.6; transform:scale(1.15); } }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes modalIn { from { opacity:0; transform:scale(0.92) translateY(20px); } to { opacity:1; transform:none; } }
@keyframes bob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
@keyframes heartbeat { 0%,100% { transform:scale(1); } 15%,35% { transform:scale(1.2); } 25% { transform:scale(1); } }
@keyframes auroraShift { 0% { background-position:0% 50%; transform:scale(1); } 100% { background-position:100% 50%; transform:scale(1.08); } }

/* ---------- 29. RESPONSIVE ---------- */
@media (max-width: 991px) {
  .hero-slide-inner { flex-direction:column; align-items:flex-start; padding:4.5rem 0 3.5rem; }
  .hero-slide-title { font-size:clamp(1.5rem,5.5vw,2.35rem); }
  .news-split-grid { grid-template-columns:1fr; }
  .news-side-slider { min-height:360px; }
  .contact-split { grid-template-columns:1fr; }
  .impact-compact-grid { grid-template-columns:repeat(2,1fr); }
  .leaders-pro-grid { grid-template-columns:1fr; }
  .founder-tribute-hero .ft-grid { grid-template-columns:1fr; gap:2.5rem; }
  .ft-photo-col { max-width:340px; margin:0 auto; }
  .journey-layout { grid-template-columns:1fr; }
  .journey-sidebar { position:static; max-height:none; }
  .journey-list { max-height:320px; }
  .journey-cards-pair { grid-template-columns:1fr; }
  .leader-pro-photo-wrap { width:220px; height:280px; }
  .feature-tiles-grid.feature-tiles-3 { grid-template-columns:1fr 1fr; }
  .jubilee-single-layout { grid-template-columns:1fr; gap:2rem; text-align:center; }
  .jubilee-single-img { max-height:220px; }
  .news-full-card { grid-template-columns:1fr; }
  .news-full-body { padding:0 1.5rem 1.5rem; }
}
@media (max-width: 767px) {
  .page-section { padding:3rem 0; }
  .feature-tiles-grid { grid-template-columns:1fr; }
  .feature-tiles-grid.feature-tiles-3 { grid-template-columns:1fr; }
  .feature-tiles-wrap { margin-top:-45px; }
  .hero-slide-png-wrapper { display:none; }
  .hero-slider { min-height:580px; }
  .hero-slider-nav { display:none; }
  .hero-scroll-hint { display:none; }
  .impact-compact-grid { grid-template-columns:1fr; }
  .jubilee-single-facts { grid-template-columns:1fr; }
  .report-home-card { grid-template-columns:1fr; text-align:center; }
  .report-home-icon { margin:0 auto; }
  .report-home-actions { flex-direction:row; justify-content:center; }
}
@media (max-width: 480px) {
  .hero-slide-title { font-size:1.5rem; }
  .impact-tile { padding:1.05rem 1.15rem; }
}

/* ---------- 30. REDUCED MOTION ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .hero-magical .hero-slide-bg { animation:none !important; }
}

/* ============================================================
   COMMITTEE PAGE v6 — HD photos, mobile optimised
   ============================================================ */

/* ---------- BACKGROUND LAYER ---------- */
.committee-bg-layer { position: relative; overflow: hidden; pointer-events: none; }
.committee-bg-layer::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(1000px 500px at 20% 10%, rgba(255,77,109,0.10), transparent 65%),
    radial-gradient(900px 500px at 85% 30%, rgba(139,92,246,0.10), transparent 65%),
    radial-gradient(900px 500px at 50% 100%, rgba(45,212,191,0.10), transparent 65%);
  pointer-events: none;
}
.committee-bg-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .35; pointer-events: none; z-index: 1; }
.committee-bg-orb-1 { width: 380px; height: 380px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: 5%; left: -8%; animation: floatSlow 18s ease-in-out infinite; }
.committee-bg-orb-2 { width: 320px; height: 320px; background: radial-gradient(circle, #FFD166, transparent 70%); top: 40%; right: -6%; animation: floatSlow 22s ease-in-out infinite reverse; }
.committee-bg-orb-3 { width: 280px; height: 280px; background: radial-gradient(circle, #2DD4BF, transparent 70%); bottom: 5%; left: 15%; animation: bob 12s ease-in-out infinite; }
.committee-bg-orb-4 { width: 260px; height: 260px; background: radial-gradient(circle, #A78BFA, transparent 70%); bottom: 25%; right: 20%; animation: bob 15s ease-in-out infinite reverse; }
.committee-bg-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,77,109,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,77,109,0.04) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at center, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 20%, transparent 75%);
  pointer-events: none; z-index: 0;
}

/* ---------- FILTER SECTION ---------- */
.committee-filter-section { position: relative; padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(1.5rem, 3vw, 2.5rem); background: linear-gradient(180deg, #FFFFFF 0%, #FFFCFA 100%); z-index: 2; }
.committee-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; max-width: 1080px; margin: 0 auto clamp(1.5rem, 3vw, 2.5rem); }
.committee-stat { position: relative; text-align: center; padding: 1.5rem 1rem 1.25rem; background: linear-gradient(180deg, #FFFFFF 0%, #FFFBF8 100%); border: 1px solid var(--line); border-radius: 20px; transition: all .4s var(--ease); overflow: hidden; }
.committee-stat::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--grad-red); transform: scaleX(0); transition: transform .5s var(--ease); }
.committee-stat:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(31,25,55,0.12); border-color: transparent; }
.committee-stat:hover::before { transform: scaleX(1); }
.committee-stat-gold::before { background: var(--grad-gold); }
.committee-stat-teal::before { background: var(--grad-teal); }
.committee-stat-violet::before { background: var(--grad-violet); }
.committee-stat-icon { width: 48px; height: 48px; margin: 0 auto .85rem; display: flex; align-items: center; justify-content: center; border-radius: 14px; color: #fff; font-size: 1.15rem; transition: transform .5s var(--ease-bounce); }
.committee-stat:hover .committee-stat-icon { transform: scale(1.15) rotate(-8deg); }
.committee-stat-red    .committee-stat-icon { background: var(--grad-red);    box-shadow: 0 12px 24px rgba(244,63,94,0.28); }
.committee-stat-gold   .committee-stat-icon { background: var(--grad-gold);   box-shadow: 0 12px 24px rgba(245,158,11,0.28); color: #3A2A00; }
.committee-stat-teal   .committee-stat-icon { background: var(--grad-teal);   box-shadow: 0 12px 24px rgba(20,184,166,0.28); }
.committee-stat-violet .committee-stat-icon { background: var(--grad-violet); box-shadow: 0 12px 24px rgba(124,58,237,0.28); }
.committee-stat-value { font-family: var(--font-heading); font-weight: 900; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1; background: var(--grad-red); -webkit-background-clip: text; background-clip: text; color: transparent; letter-spacing: -0.02em; }
.committee-stat-label { font-size: .7rem; font-weight: 700; color: var(--muted); letter-spacing: .1em; text-transform: uppercase; margin-top: .55rem; }

/* ---------- SHARE BUTTON ---------- */
.committee-share-row { display: flex; justify-content: center; margin: 0 auto 1.5rem; }
.committee-page-share-btn { display: inline-flex; align-items: center; gap: 1rem; padding: .9rem 1.5rem; border: 0; border-radius: var(--r-full); background: linear-gradient(120deg, #FF4D6D 0%, #C9184A 40%, #7C3AED 100%); background-size: 200% 100%; color: #fff; font-family: var(--font-body); font-weight: 700; font-size: .88rem; cursor: pointer; transition: all .5s var(--ease); box-shadow: 0 22px 50px rgba(244,63,94,0.32); position: relative; overflow: hidden; }
.committee-page-share-btn::before { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.28) 50%, transparent 60%); transform: translateX(-100%); transition: transform 1s var(--ease); }
.committee-page-share-btn:hover { background-position: 100% 0; transform: translateY(-4px); box-shadow: 0 32px 70px rgba(244,63,94,0.45); }
.committee-page-share-btn:hover::before { transform: translateX(100%); }
.committee-page-share-icon { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.22); display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.committee-page-share-text { display: flex; flex-direction: column; text-align: left; line-height: 1.2; }
.committee-page-share-text strong { font-family: var(--font-heading); font-size: 1rem; font-weight: 800; }
.committee-page-share-text small { font-size: .72rem; opacity: .82; margin-top: .12rem; }
.committee-page-share-arrow { font-size: 1rem; transition: transform .4s var(--ease); }
.committee-page-share-btn:hover .committee-page-share-arrow { transform: translateX(6px); }

/* ---------- FILTER BAR ---------- */
.committee-filter-bar { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; padding: .55rem; background: #fff; border-radius: var(--r-full); border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(31,25,55,0.08); max-width: max-content; margin: 0 auto; position: relative; }
.committee-filter-bar::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; background: linear-gradient(90deg, #FF4D6D, #FFD166, #2DD4BF, #A78BFA, #FF4D6D); background-size: 300% 100%; z-index: -1; opacity: .35; animation: filterGradient 6s linear infinite; filter: blur(6px); }
@keyframes filterGradient { from { background-position: 0% 50%; } to { background-position: 300% 50%; } }
.committee-filter-btn { display: inline-flex; align-items: center; gap: .55rem; padding: .7rem 1.15rem; border: 0; background: transparent; border-radius: var(--r-full); font-family: var(--font-body); font-weight: 700; font-size: .8rem; color: var(--ink-soft); cursor: pointer; transition: all .35s var(--ease); }
.committee-filter-icon { width: 26px; height: 26px; border-radius: 50%; background: var(--rose-50); color: var(--rose-600); display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; transition: all .35s var(--ease); }
.committee-filter-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 .5rem; background: var(--rose-50); color: var(--rose-700); border-radius: var(--r-full); font-size: .66rem; font-weight: 800; transition: all .35s var(--ease); }
.committee-filter-btn:hover { color: var(--rose-600); background: rgba(255,77,109,0.06); }
.committee-filter-btn:hover .committee-filter-icon { background: var(--grad-red); color: #fff; }
.committee-filter-btn.active { background: var(--grad-red); color: #fff; box-shadow: 0 14px 30px rgba(244,63,94,0.35); }
.committee-filter-btn.active .committee-filter-icon { background: rgba(255,255,255,0.24); color: #fff; }
.committee-filter-btn.active .committee-filter-count { background: rgba(255,255,255,0.25); color: #fff; }
.committee-hidden { display: none !important; }
@keyframes committeeFadeIn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

/* ---------- BLOCK BACKGROUNDS ---------- */
.committee-block { padding: clamp(2.5rem, 5vw, 4.5rem) 0; position: relative; }
.committee-block-leadership { background: linear-gradient(180deg, #FFF9F4 0%, #FFF4EC 100%); }
.committee-block-office     { background: linear-gradient(180deg, #FFFFFF 0%, #FFFCFA 100%); }
.committee-block-executive  { background: linear-gradient(180deg, #FFF9F4 0%, #FFF4EC 100%); }
.committee-block-invitees   { background: linear-gradient(180deg, #FFFFFF 0%, #FFFCFA 100%); }
.committee-block-secretary  { background: linear-gradient(180deg, #FFF9F4 0%, #FFF4EC 100%); }

/* ---------- LEADERSHIP GRID ---------- */
.committee-leadership-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; max-width: 1000px; margin: 0 auto; }
.committee-leadership-single { grid-template-columns: minmax(0, 560px); justify-content: center; }

/* ---------- BIG CARD ---------- */
.committee-leader-card {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 22px 50px rgba(31,25,55,0.10);
  transition: all .5s var(--ease);
  display: grid;
  grid-template-columns: 220px 1fr;
}
.committee-leader-card-reverse { grid-template-columns: 1fr 220px; }
.committee-leader-card-reverse .committee-leader-photo { order: 2; }
.committee-leader-card-reverse .committee-leader-body { order: 1; text-align: right; align-items: flex-end; }
.committee-leader-card:hover { transform: translateY(-8px); box-shadow: 0 34px 70px rgba(31,25,55,0.20); border-color: transparent; }
.committee-leader-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 5px; z-index: 4; }

/* Theme stripes */
.leader-theme-gold::before    { background: var(--grad-gold); }
.leader-theme-violet::before  { background: var(--grad-violet); }
.leader-theme-teal::before    { background: var(--grad-teal); }
.leader-theme-rose::before    { background: var(--grad-red); }
.leader-theme-sky::before     { background: linear-gradient(135deg,#38BDF8,#0EA5E9); }

.leader-theme-gold    .committee-leader-role { background: linear-gradient(135deg,#FFD166,#F59E0B); color:#3A2A00; box-shadow: 0 10px 24px rgba(245,158,11,0.32); }
.leader-theme-violet  .committee-leader-role { background: linear-gradient(135deg,#A78BFA,#7C3AED); color:#fff;    box-shadow: 0 10px 24px rgba(124,58,237,0.32); }
.leader-theme-teal    .committee-leader-role { background: linear-gradient(135deg,#2DD4BF,#0D9488); color:#fff;    box-shadow: 0 10px 24px rgba(20,184,166,0.32); }
.leader-theme-rose    .committee-leader-role { background: var(--grad-red);                        color:#fff;    box-shadow: 0 10px 24px rgba(244,63,94,0.32); }
.leader-theme-sky     .committee-leader-role { background: linear-gradient(135deg,#38BDF8,#0EA5E9); color:#fff;    box-shadow: 0 10px 24px rgba(14,165,233,0.32); }

.leader-theme-gold   .committee-decor-ring { border-color:#F59E0B; }
.leader-theme-violet .committee-decor-ring { border-color:#7C3AED; }
.leader-theme-teal   .committee-decor-ring { border-color:#14B8A6; }
.leader-theme-rose   .committee-decor-ring { border-color:#E11D48; }
.leader-theme-sky    .committee-decor-ring { border-color:#0EA5E9; }
.leader-theme-gold   .committee-decor-star { color:#F59E0B; }
.leader-theme-violet .committee-decor-star { color:#7C3AED; }
.leader-theme-teal   .committee-decor-star { color:#14B8A6; }
.leader-theme-rose   .committee-decor-star { color:#E11D48; }
.leader-theme-sky    .committee-decor-star { color:#0EA5E9; }

.leader-theme-gold   .committee-leader-photo { background: linear-gradient(135deg,#FFE9B0,#FFD166); }
.leader-theme-violet .committee-leader-photo { background: linear-gradient(135deg,#A78BFA,#7C3AED); }
.leader-theme-teal   .committee-leader-photo { background: linear-gradient(135deg,#2DD4BF,#0D9488); }
.leader-theme-rose   .committee-leader-photo { background: var(--grad-rose); }
.leader-theme-sky    .committee-leader-photo { background: linear-gradient(135deg,#38BDF8,#0EA5E9); }

/* ---------- DECOR RINGS ---------- */
.committee-leader-decor { position: absolute; inset: 0; pointer-events: none; z-index: 1; overflow: hidden; }
.committee-decor-ring { position: absolute; border-radius: 50%; border: 2px dashed; opacity: .3; }
.committee-decor-ring-1 { width: 280px; height: 280px; top: -80px; right: -80px; animation: rotateSlow 40s linear infinite; }
.committee-decor-ring-2 { width: 200px; height: 200px; bottom: -60px; left: 40px; animation: rotateSlow 30s linear infinite reverse; }
.committee-decor-star { position: absolute; font-size: 1.5rem; opacity: .28; animation: pulseGlow 3s ease-in-out infinite; top: 1rem; right: 1rem; }
.committee-leader-card-reverse .committee-decor-star { right: auto; left: 1rem; }

/* ============================================================
   HD PHOTO RENDERING — SAME QUALITY FOR ALL CARDS
   ============================================================ */
.committee-leader-photo {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4/5;
  z-index: 2;
  transform: translateZ(0);
  isolation: isolate;
}
.committee-leader-photo img,
.committee-member-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 15%; /* Focus on faces */
  display: block;

  /* HD sharpening */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  image-rendering: high-quality;

  /* Force GPU rendering for sharpness */
  transform: translateZ(0) scale(1.002);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
  perspective: 1000px;

  /* Sharpening filter (subtle) */
  filter: contrast(1.03) saturate(1.05) brightness(1.01);

  /* Smoother transitions */
  transition: transform 1.2s var(--ease), filter .6s var(--ease);
}

/* Retina-specific */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .committee-leader-photo img,
  .committee-member-photo img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: high-quality;
  }
}

.committee-leader-card:hover .committee-leader-photo img,
.committee-member-card:hover .committee-member-photo img {
  transform: translateZ(0) scale(1.06);
  filter: contrast(1.05) saturate(1.08) brightness(1.02);
}

.committee-leader-photo-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--grad-ink); color: var(--amber-400); font-size: 3.5rem; }
.committee-leader-shine { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.35) 50%, transparent 60%); transform: translateX(-100%); transition: transform 1.2s var(--ease); pointer-events: none; z-index: 3; }
.committee-leader-card:hover .committee-leader-shine { transform: translateX(100%); }

/* ---------- LEADER BODY ---------- */
.committee-leader-body { padding: 1.75rem 1.5rem; display: flex; flex-direction: column; justify-content: center; gap: .6rem; position: relative; z-index: 2; }
.committee-leader-role {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .4rem .95rem; border-radius: var(--r-full);
  font-size: .64rem; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  align-self: flex-start;
}
.committee-leader-card-reverse .committee-leader-role { align-self: flex-end; }

.committee-leader-name { font-family: var(--font-heading); font-size: clamp(1rem, 1.5vw, 1.15rem); font-weight: 800; color: var(--ink); margin: 0; line-height: 1.25; }
.committee-leader-designation { color: var(--muted); font-size: .82rem; font-style: italic; margin: 0; line-height: 1.5; }
.committee-leader-address { color: var(--muted); font-size: .78rem; display: inline-flex; align-items: center; gap: .35rem; line-height: 1.5; }
.committee-leader-card-reverse .committee-leader-address { justify-content: flex-end; }
.committee-leader-address i { color: var(--rose-500); font-size: .72rem; flex-shrink: 0; }

.committee-leader-phone {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .65rem 1rem;
  background: linear-gradient(135deg, rgba(244,63,94,0.08), rgba(255,209,102,0.06));
  border: 1.5px solid rgba(244,63,94,0.18);
  border-radius: 14px;
  text-decoration: none; color: var(--ink);
  font-weight: 700; font-size: .82rem;
  transition: all .35s var(--ease);
  position: relative; overflow: hidden;
  align-self: flex-start;
  margin-top: .35rem;
}
.committee-leader-card-reverse .committee-leader-phone { align-self: flex-end; }
.committee-leader-phone::before { content: ""; position: absolute; inset: 0; background: var(--grad-red); opacity: 0; transition: opacity .35s var(--ease); z-index: 0; }
.committee-leader-phone > * { position: relative; z-index: 1; }
.committee-leader-phone:hover { border-color: transparent; transform: translateY(-2px); box-shadow: 0 14px 30px rgba(244,63,94,0.30); color: #fff; }
.committee-leader-phone:hover::before { opacity: 1; }
.committee-leader-phone-icon { width: 26px; height: 26px; border-radius: 50%; background: var(--grad-red); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .65rem; flex-shrink: 0; }
.committee-leader-phone-label { font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rose-600); margin-left: auto; }
.committee-leader-phone:hover .committee-leader-phone-label { color: rgba(255,255,255,0.85); }

/* ---------- EXECUTIVE / INVITEES SMALL CARDS ---------- */
.committee-grid { display: grid; gap: 1.5rem; }
.committee-grid-compact { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); max-width: 1200px; margin: 0 auto; }
.committee-member-card { position: relative; background: #fff; border-radius: 22px; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(31,25,55,0.07); transition: all .45s var(--ease); display: flex; flex-direction: column; height: 100%; }
.committee-member-card:hover { transform: translateY(-8px); box-shadow: 0 26px 55px rgba(31,25,55,0.14); border-color: transparent; }
.committee-member-photo { position: relative; aspect-ratio: 1/1; overflow: hidden; background: var(--grad-rose); }
.committee-member-photo-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--grad-ink); color: var(--amber-400); font-size: 2.5rem; }
.committee-fallback-gold { background: var(--grad-gold); color: rgba(0,0,0,0.35); }
.committee-member-shine { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.30) 50%, transparent 60%); transform: translateX(-100%); transition: transform 1.2s var(--ease); pointer-events: none; }
.committee-member-card:hover .committee-member-shine { transform: translateX(100%); }
.committee-member-body { padding: 1.1rem .95rem; text-align: center; display: flex; flex-direction: column; flex: 1; gap: .5rem; }
.committee-member-designation { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; padding: .28rem .75rem; border-radius: var(--r-full); font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; align-self: center; }
.committee-designation-rose { background: linear-gradient(135deg, rgba(255,77,109,0.15), rgba(201,24,74,0.10)); color: #C9184A; border: 1px solid rgba(255,77,109,0.28); }
.committee-designation-gold { background: linear-gradient(135deg, rgba(255,209,102,0.28), rgba(245,158,11,0.18)); color: #92400E; border: 1px solid rgba(255,209,102,0.42); }
.committee-member-name { font-family: var(--font-heading); font-size: .9rem; font-weight: 800; color: var(--ink); margin: 0; line-height: 1.3; }
.committee-member-address { display: inline-flex; align-items: flex-start; justify-content: center; gap: .35rem; color: var(--muted); font-size: .72rem; line-height: 1.5; margin: 0; padding: 0 .25rem; }
.committee-member-address i { color: var(--rose-500); font-size: .68rem; margin-top: .18rem; flex-shrink: 0; }
.committee-member-phone { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .8rem; background: linear-gradient(135deg, rgba(244,63,94,0.08), rgba(255,209,102,0.06)); border: 1.5px solid rgba(244,63,94,0.18); border-radius: 12px; text-decoration: none; color: var(--ink); font-weight: 700; font-size: .74rem; margin-top: auto; justify-content: center; transition: all .35s var(--ease); position: relative; overflow: hidden; }
.committee-member-phone::before { content: ""; position: absolute; inset: 0; background: var(--grad-red); opacity: 0; transition: opacity .35s var(--ease); z-index: 0; }
.committee-member-phone > * { position: relative; z-index: 1; }
.committee-member-phone:hover { border-color: transparent; color: #fff; box-shadow: 0 12px 26px rgba(244,63,94,0.30); }
.committee-member-phone:hover::before { opacity: 1; }
.committee-member-phone-icon { width: 22px; height: 22px; border-radius: 50%; background: var(--grad-red); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .6rem; flex-shrink: 0; }
.committee-member-phone-number { color: var(--ink); font-size: .74rem; }
.committee-member-phone:hover .committee-member-phone-number { color: #fff; }

/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */
@media (max-width: 991px) {
  .committee-leadership-grid { grid-template-columns: 1fr; }
  .committee-leadership-single { grid-template-columns: 1fr; }
  .committee-leader-card,
  .committee-leader-card-reverse { grid-template-columns: 200px 1fr; }
}

/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */
@media (max-width: 767px) {
  .committee-stats { grid-template-columns: 1fr 1fr; gap: .75rem; }
  .committee-stat { padding: 1.1rem .75rem 1rem; border-radius: 16px; }
  .committee-stat-icon { width: 40px; height: 40px; font-size: .95rem; border-radius: 12px; margin-bottom: .65rem; }
  .committee-stat-value { font-size: 1.4rem; }
  .committee-stat-label { font-size: .62rem; }

  .committee-share-row { margin-bottom: 1rem; }
  .committee-page-share-btn { padding: .75rem 1.15rem; gap: .75rem; }
  .committee-page-share-text strong { font-size: .88rem; }
  .committee-page-share-text small { font-size: .66rem; }
  .committee-page-share-icon { width: 34px; height: 34px; font-size: .88rem; }

  .committee-filter-bar { width: 100%; max-width: 100%; overflow-x: auto; justify-content: flex-start; flex-wrap: nowrap; scrollbar-width: none; padding: .4rem; }
  .committee-filter-bar::-webkit-scrollbar { display: none; }
  .committee-filter-btn { flex-shrink: 0; padding: .6rem .9rem; font-size: .74rem; }
  .committee-filter-icon { width: 22px; height: 22px; font-size: .62rem; }
  .committee-filter-count { font-size: .6rem; min-width: 18px; height: 18px; padding: 0 .4rem; }

  .committee-block { padding: 2.5rem 0; }

  /* BIG CARD — stacked on mobile */
  .committee-leader-card,
  .committee-leader-card-reverse { grid-template-columns: 1fr; }
  .committee-leader-card-reverse .committee-leader-photo { order: 0; }
  .committee-leader-card-reverse .committee-leader-body { order: 0; text-align: left; align-items: flex-start; }
  .committee-leader-card-reverse .committee-leader-role,
  .committee-leader-card-reverse .committee-leader-address,
  .committee-leader-card-reverse .committee-leader-phone { align-self: flex-start; justify-content: flex-start; }
  .committee-leader-card-reverse .committee-decor-star { right: 1rem; left: auto; }
  .committee-leader-photo { aspect-ratio: 3/3.5; }
  .committee-leader-photo img { object-position: center 10%; }
  .committee-leader-body { padding: 1.35rem 1.25rem; gap: .55rem; }
  .committee-leader-name { font-size: 1.05rem; }
  .committee-leader-designation { font-size: .78rem; }
  .committee-leader-address { font-size: .75rem; }
  .committee-leader-phone { padding: .6rem .9rem; font-size: .78rem; }
  .committee-leader-phone-icon { width: 24px; height: 24px; font-size: .6rem; }
  .committee-leader-phone-label { font-size: .56rem; }

  .committee-grid-compact { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1rem; }
  .committee-member-body { padding: .95rem .8rem; }
  .committee-member-name { font-size: .85rem; }
  .committee-member-phone { padding: .45rem .7rem; font-size: .7rem; }
  .committee-member-phone-number { font-size: .7rem; }
}

@media (max-width: 480px) {
  .committee-stats { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .committee-stat { padding: 1rem .5rem .85rem; }
  .committee-stat-icon { width: 36px; height: 36px; font-size: .85rem; margin-bottom: .5rem; }
  .committee-stat-value { font-size: 1.25rem; }
  .committee-stat-label { font-size: .58rem; letter-spacing: .06em; }
  .committee-grid-compact { grid-template-columns: 1fr 1fr; }
  .committee-leader-photo { aspect-ratio: 1/1; }
}

/* ---------- SHARE MODAL ---------- */
.committee-share-modal { position: fixed; inset: 0; z-index: 9999; display: none; }
.committee-share-modal.active { display: block; }
.committee-share-backdrop { position: absolute; inset: 0; background: rgba(15,10,30,0.72); backdrop-filter: blur(8px); animation: fadeInUp .3s var(--ease); }
.committee-share-panel { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(460px, 92vw); background: #fff; border-radius: 28px; padding: 2.25rem 1.75rem 1.75rem; box-shadow: 0 40px 100px rgba(0,0,0,0.45); animation: modalIn .45s var(--ease-bounce); text-align: center; }
.committee-share-icon { width: 68px; height: 68px; margin: 0 auto 1rem; border-radius: 20px; background: linear-gradient(120deg, #FF4D6D 0%, #C9184A 40%, #7C3AED 100%); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; box-shadow: 0 18px 40px rgba(244,63,94,0.35); animation: bob 4s ease-in-out infinite; }
.committee-share-close { position: absolute; top: 1rem; right: 1rem; width: 36px; height: 36px; border-radius: 50%; background: var(--cream); border: 0; color: var(--ink); cursor: pointer; font-size: .9rem; transition: all .3s var(--ease); }
.committee-share-close:hover { background: var(--rose-500); color: #fff; transform: rotate(90deg); }
.committee-share-title { font-family: var(--font-heading); font-size: 1.35rem; font-weight: 800; color: var(--ink); margin: 0 0 .35rem; }
.committee-share-sub { color: var(--muted); font-size: .85rem; margin: 0 0 1.5rem; line-height: 1.55; }
.committee-share-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.committee-share-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1rem; border-radius: 14px; font-family: var(--font-body); font-size: .82rem; font-weight: 700; text-decoration: none; border: 0; cursor: pointer; color: #fff; transition: all .3s var(--ease); }
.committee-share-btn:hover { transform: translateY(-3px); color: #fff; box-shadow: 0 14px 30px rgba(0,0,0,0.18); }
.committee-share-whatsapp { background: linear-gradient(135deg,#25D366,#128C7E); }
.committee-share-facebook { background: linear-gradient(135deg,#1877F2,#0D5FD1); }
.committee-share-twitter  { background: linear-gradient(135deg,#000,#1a1a1a); }
.committee-share-linkedin { background: linear-gradient(135deg,#0A66C2,#004182); }
.committee-share-telegram { background: linear-gradient(135deg,#229ED9,#1478A6); }
.committee-share-email    { background: var(--grad-red); }
.committee-share-copy     { background: var(--grad-ink); grid-column: 1 / -1; }
.committee-share-copied { margin-top: 1rem; padding: .6rem 1.1rem; background: #ECFDF5; color: #065F46; border-radius: var(--r-full); font-size: .78rem; font-weight: 700; opacity: 0; transform: translateY(6px); transition: all .3s var(--ease); display: inline-flex; align-items: center; gap: .4rem; }
.committee-share-copied.show { opacity: 1; transform: none; }
@media (max-width: 480px) { .committee-share-buttons { grid-template-columns: 1fr; } .committee-share-copy { grid-column: auto; } }

/* ============================================================
   ABOUT PAGE — Professional, animated, colourful (v2)
   ============================================================ */

/* ============ OPENING QUOTE — Animated aurora ============ */
.about-quote-section {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 60%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.about-quote-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.about-quote-bg::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(700px 400px at 15% 50%, rgba(255,209,102,0.22), transparent 60%),
    radial-gradient(700px 400px at 85% 50%, rgba(45,212,191,0.22), transparent 60%),
    radial-gradient(600px 400px at 50% 0%, rgba(139,92,246,0.20), transparent 60%);
}
.about-quote-orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .45; }
.about-quote-orb-1 { width: 380px; height: 380px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -100px; left: -80px; animation: floatSlow 18s ease-in-out infinite; }
.about-quote-orb-2 { width: 320px; height: 320px; background: radial-gradient(circle, #FFD166, transparent 70%); bottom: -100px; right: -60px; animation: floatSlow 22s ease-in-out infinite reverse; }
.about-quote-orb-3 { width: 280px; height: 280px; background: radial-gradient(circle, #2DD4BF, transparent 70%); top: 40%; left: 45%; opacity: .3; animation: bob 14s ease-in-out infinite; }
.about-quote-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at center, #000 25%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 25%, transparent 75%);
  pointer-events: none;
}

.about-quote-inner { text-align: center; max-width: 820px; margin: 0 auto; position: relative; z-index: 2; }
.about-quote-icon-top {
  display: inline-flex; width: 78px; height: 78px; border-radius: 50%;
  background: var(--grad-gold); color: #3A2A00;
  align-items: center; justify-content: center;
  font-size: 1.85rem;
  box-shadow: 0 18px 44px rgba(245,158,11,0.42), 0 0 0 8px rgba(255,209,102,0.15);
  margin-bottom: 1.75rem;
  animation: bob 4s ease-in-out infinite;
}
.about-quote-text {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: clamp(1.4rem, 3vw, 2.25rem);
  line-height: 1.35;
  color: #fff;
  font-weight: 500;
  margin: 0 0 1.5rem;
  letter-spacing: -0.01em;
  text-shadow: 0 6px 30px rgba(0,0,0,0.3);
}
.about-quote-divider {
  display: block; width: 120px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--amber-400), transparent);
  margin: 0 auto 1.5rem;
}
.about-motto-badge {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .75rem 1.6rem;
  background: rgba(255,209,102,0.14);
  border: 1px solid rgba(255,209,102,0.35);
  border-radius: var(--r-full);
  color: var(--amber-400);
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .02em;
  backdrop-filter: blur(12px);
}

/* ============ INTRO SECTION ============ */
.about-intro-section { background: linear-gradient(180deg, #FFFFFF 0%, #FFFCFA 100%); }
.about-visual { position: relative; max-width: 500px; margin: 0 auto; }
.about-visual-main {
  border-radius: 28px;
  overflow: hidden;
  aspect-ratio: 4/5;
  box-shadow: 0 40px 90px rgba(31,25,55,0.22);
  position: relative;
  background: var(--grad-rose);
  display: flex; align-items: center; justify-content: center;
}
.about-visual-main::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.2), transparent 60%);
  pointer-events: none;
}
.about-visual-main img { width: 100%; height: 100%; object-fit: cover; }
.about-visual-fallback { color: rgba(255,255,255,0.65); font-size: 6rem; }

.about-visual-jubilee {
  position: absolute;
  bottom: -30px; right: -30px;
  width: 160px; height: 160px;
  filter: drop-shadow(0 20px 40px rgba(255,209,102,0.55));
  animation: bob 5s ease-in-out infinite;
  z-index: 3;
}
.about-visual-jubilee img { width: 100%; height: 100%; object-fit: contain; }

.about-visual-badge {
  position: absolute;
  top: 24px; left: 24px;
  padding: 1rem 1.25rem;
  background: rgba(255,255,255,0.95);
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(31,25,55,0.15);
  backdrop-filter: blur(12px);
  z-index: 3;
  animation: bob 6s ease-in-out infinite;
}
.about-visual-badge-label { font-size: .62rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--rose-600); margin-bottom: .15rem; }
.about-visual-badge-value { font-family: var(--font-heading); font-size: 1.55rem; font-weight: 900; color: var(--ink); line-height: 1; }

.about-quick-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.75rem; }
.about-fact {
  display: flex; align-items: center; gap: .85rem;
  padding: 1rem 1.15rem;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFBF8 100%);
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: all .35s var(--ease);
}
.about-fact:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(31,25,55,0.10); border-color: transparent; }
.about-fact-icon {
  width: 44px; height: 44px; flex-shrink: 0;
  border-radius: 13px;
  background: var(--grad-red); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  box-shadow: 0 10px 22px rgba(244,63,94,0.28);
}
.about-fact:nth-child(2) .about-fact-icon { background: var(--grad-gold); color: #3A2A00; box-shadow: 0 10px 22px rgba(245,158,11,0.28); }
.about-fact-label { font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: .2rem; }
.about-fact-value { font-family: var(--font-heading); font-size: .9rem; font-weight: 800; color: var(--ink); line-height: 1.25; }

/* ============ OUR AIM ============ */
.about-aim-section { background: linear-gradient(180deg, #FFF9F4 0%, #FFF4EC 100%); position: relative; overflow: hidden; }
.about-aim-section::before {
  content: ""; position: absolute; top: -30%; right: -10%;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,77,109,0.10), transparent 70%);
  filter: blur(60px);
  pointer-events: none;
}
.about-aim-statement {
  max-width: 900px;
  margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
  padding: 1.75rem 2rem;
  background: #fff;
  border-radius: 22px;
  border-left: 5px solid var(--rose-500);
  box-shadow: 0 20px 45px rgba(31,25,55,0.08);
  position: relative;
  z-index: 1;
}
.about-aim-statement p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.02rem;
  line-height: 1.9;
}
.about-aim-statement strong { color: var(--rose-600); font-weight: 800; }
.about-aim-statement em { font-style: italic; color: var(--ink); font-weight: 600; }

.about-aim-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1.15rem;
  max-width: 1080px;
  margin: 0 auto;
}
.about-aim-tile {
  position: relative;
  padding: 1.5rem 1.15rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  text-align: center;
  transition: all .45s var(--ease);
  overflow: hidden;
  cursor: default;
}
.about-aim-tile::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0;
  height: 4px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .5s var(--ease);
}
.about-aim-tile-red::before    { background: var(--grad-red); }
.about-aim-tile-gold::before   { background: var(--grad-gold); }
.about-aim-tile-teal::before   { background: var(--grad-teal); }
.about-aim-tile-violet::before { background: var(--grad-violet); }
.about-aim-tile:hover { transform: translateY(-8px); box-shadow: 0 24px 55px rgba(31,25,55,0.14); border-color: transparent; }
.about-aim-tile:hover::before { transform: scaleX(1); }
.about-aim-icon {
  width: 62px; height: 62px;
  margin: 0 auto .85rem;
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 1.4rem;
  transition: transform .5s var(--ease-bounce);
}
.about-aim-tile-red    .about-aim-icon { background: var(--grad-red);    box-shadow: 0 12px 26px rgba(244,63,94,0.32); }
.about-aim-tile-gold   .about-aim-icon { background: var(--grad-gold);   box-shadow: 0 12px 26px rgba(245,158,11,0.32); color: #3A2A00; }
.about-aim-tile-teal   .about-aim-icon { background: var(--grad-teal);   box-shadow: 0 12px 26px rgba(20,184,166,0.32); }
.about-aim-tile-violet .about-aim-icon { background: var(--grad-violet); box-shadow: 0 12px 26px rgba(124,58,237,0.32); }
.about-aim-tile:hover .about-aim-icon { transform: scale(1.12) rotate(-8deg); }
.about-aim-label { font-family: var(--font-heading); font-size: .95rem; font-weight: 800; color: var(--ink); line-height: 1.3; }
.about-aim-shine {
  position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
  background: conic-gradient(from 0deg, transparent, rgba(255,77,109,0.06), transparent);
  animation: rotateSlow 20s linear infinite;
  pointer-events: none; z-index: 0;
}

/* ============ CHARITY WING ============ */
.about-wing-section {
  position: relative;
  padding: clamp(3.5rem, 7vw, 6rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 55%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.about-wing-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.about-wing-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .4; }
.about-wing-orb-1 { width: 420px; height: 420px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -120px; left: 5%; animation: floatSlow 20s ease-in-out infinite; }
.about-wing-orb-2 { width: 380px; height: 380px; background: radial-gradient(circle, #2DD4BF, transparent 70%); bottom: -120px; right: 5%; animation: floatSlow 24s ease-in-out infinite reverse; }
.about-wing-rays {
  position: absolute; inset: -20%;
  background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255,209,102,0.08) 20deg, transparent 40deg, transparent 90deg, rgba(255,77,109,0.08) 110deg, transparent 130deg, transparent 200deg, rgba(45,212,191,0.06) 220deg, transparent 240deg, transparent 320deg, rgba(255,209,102,0.08) 340deg);
  animation: rotateSlow 100s linear infinite;
  opacity: .9;
}
.about-wing-inner {
  position: relative;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 3rem;
  align-items: center;
  max-width: 1080px;
  margin: 0 auto;
}
.about-wing-icon {
  position: relative;
  width: 160px; height: 160px;
  margin: 0 auto;
  border-radius: 50%;
  background: var(--grad-gold); color: #3A2A00;
  display: flex; align-items: center; justify-content: center;
  font-size: 3.25rem;
  box-shadow: 0 30px 70px rgba(245,158,11,0.55);
  animation: bob 5s ease-in-out infinite;
}
.about-wing-ring {
  position: absolute;
  inset: -14px;
  border-radius: 50%;
  border: 2px dashed rgba(255,209,102,0.4);
  animation: rotateSlow 30s linear infinite;
}
.about-wing-ring-2 { inset: -28px; border-color: rgba(255,255,255,0.15); animation-duration: 45s; animation-direction: reverse; }
.about-wing-label {
  display: inline-block;
  font-size: .74rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.68);
  font-weight: 700;
  margin-bottom: .5rem;
}
.about-wing-title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 1.25rem;
  line-height: 1.2;
  color: #fff;
}
.about-wing-title span {
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  font-style: italic;
}
.about-wing-text {
  color: rgba(255,255,255,0.82);
  font-size: .98rem;
  line-height: 1.9;
  margin-bottom: 1rem;
}
.about-wing-text strong { color: #FFE9B0; font-weight: 800; }
.about-wing-text em { font-style: italic; color: #fff; }
.about-wing-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.about-wing-chips span {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .55rem 1rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--r-full);
  font-size: .78rem; font-weight: 600; color: rgba(255,255,255,0.92);
}
.about-wing-chips i { color: var(--amber-400); font-size: .78rem; }

/* ============ SILVER JUBILEE ============ */
.about-jubilee-section {
  position: relative;
  padding: clamp(3.5rem, 7vw, 6rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 55%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.about-jubilee-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.about-jubilee-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .4; }
.about-jubilee-orb-1 { width: 420px; height: 420px; background: radial-gradient(circle, #FFD166, transparent 70%); top: -120px; left: 5%; animation: floatSlow 20s ease-in-out infinite; }
.about-jubilee-orb-2 { width: 380px; height: 380px; background: radial-gradient(circle, #FF4D6D, transparent 70%); bottom: -120px; right: 5%; animation: floatSlow 24s ease-in-out infinite reverse; }
.about-jubilee-rays {
  position: absolute; inset: -20%;
  background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255,209,102,0.10) 20deg, transparent 40deg, transparent 80deg, rgba(255,209,102,0.08) 100deg, transparent 130deg, transparent 180deg, rgba(255,255,255,0.05) 200deg, transparent 240deg, transparent 300deg, rgba(255,209,102,0.08) 320deg, transparent 340deg);
  animation: rotateSlow 90s linear infinite;
  opacity: .8;
}
.about-jubilee-inner {
  position: relative;
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 3rem;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
}
.about-jubilee-left { display: flex; justify-content: center; align-items: center; }
.about-jubilee-img { max-width: 100%; max-height: 320px; filter: drop-shadow(0 30px 60px rgba(255,209,102,0.55)); animation: bob 6s ease-in-out infinite; }
.about-jubilee-fallback { text-align: center; }
.about-jubilee-year {
  font-family: var(--font-heading);
  font-weight: 900;
  font-size: clamp(4rem, 9vw, 7rem);
  line-height: 1;
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  filter: drop-shadow(0 16px 34px rgba(255,209,102,0.55));
}
.about-jubilee-year small { font-size: .4em; vertical-align: super; }
.about-jubilee-label {
  display: inline-block;
  font-size: .78rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  font-weight: 700;
  margin-bottom: .5rem;
}
.about-jubilee-title {
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 3vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 1rem;
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  line-height: 1.15;
}
.about-jubilee-desc { color: rgba(255,255,255,0.82); font-size: .98rem; line-height: 1.9; margin-bottom: 1rem; }
.about-jubilee-desc strong { color: #FFE9B0; font-weight: 800; }
.about-jubilee-desc em { font-style: italic; color: #fff; }
.about-jubilee-facts { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }
.about-jubilee-facts span {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .55rem 1rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--r-full);
  color: rgba(255,255,255,0.9);
  font-weight: 600; font-size: .82rem;
}
.about-jubilee-facts i { color: var(--amber-400); font-size: .78rem; }

/* ============ LEADERSHIP ============ */
.about-leadership-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  max-width: 900px;
  margin: 0 auto;
}
.about-leader-card {
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: 0 20px 45px rgba(31,25,55,0.10);
  transition: all .5s var(--ease);
}
.about-leader-card:hover { transform: translateY(-8px); box-shadow: 0 34px 70px rgba(31,25,55,0.18); }
.about-leader-photo { position: relative; aspect-ratio: 4/5; overflow: hidden; background: var(--grad-rose); }
.about-leader-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 1.2s var(--ease); image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; }
.about-leader-card:hover .about-leader-photo img { transform: scale(1.06); }
.about-leader-photo-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--grad-ink); color: var(--amber-400); font-size: 3.5rem; }
.about-leader-badge {
  position: absolute; top: 1rem; left: 1rem;
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .4rem .9rem;
  background: var(--grad-gold); color: #3A2A00;
  border-radius: var(--r-full);
  font-size: .64rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(245,158,11,0.4);
  z-index: 2;
}
.about-leader-shine {
  position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.30) 50%, transparent 60%);
  transform: translateX(-100%);
  transition: transform 1.2s var(--ease);
  pointer-events: none; z-index: 3;
}
.about-leader-card:hover .about-leader-shine { transform: translateX(100%); }
.about-leader-body { padding: 1.5rem 1.35rem; text-align: center; }
.about-leader-name { font-family: var(--font-heading); font-size: 1.05rem; font-weight: 800; color: var(--ink); margin: 0 0 .35rem; line-height: 1.3; }
.about-leader-title { color: var(--muted); font-size: .84rem; font-style: italic; margin: 0; line-height: 1.5; }

/* ============ VIEW FULL COMMITTEE — centered CTA ============ */
.about-committee-cta-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2.5rem;
  width: 100%;
}
.about-committee-cta-wrap .btn {
  display: inline-flex;
}

/* ============ LEGAL / REGISTRATION CARD ============ */
.about-legal {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 2rem;
  align-items: center;
  padding: 2.5rem;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 100%);
  border-radius: 28px;
  box-shadow: 0 30px 70px rgba(31,25,55,0.28);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.about-legal::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(600px 300px at 15% 30%, rgba(255,209,102,0.18), transparent 60%),
    radial-gradient(600px 300px at 85% 70%, rgba(45,212,191,0.15), transparent 60%);
  pointer-events: none;
}
.about-legal > * { position: relative; }
.about-legal-icon {
  position: relative;
  width: 100px; height: 100px;
  border-radius: 26px;
  background: var(--grad-gold); color: #3A2A00;
  display: flex; align-items: center; justify-content: center;
  font-size: 2.5rem;
  box-shadow: 0 20px 40px rgba(245,158,11,0.42);
  flex-shrink: 0;
  animation: bob 5s ease-in-out infinite;
}
.about-legal-ring {
  position: absolute;
  inset: -12px;
  border-radius: 32px;
  border: 2px dashed rgba(255,209,102,0.4);
  animation: rotateSlow 40s linear infinite;
}
.about-legal-body h3 { font-family: var(--font-heading); color: #fff; font-size: 1.35rem; font-weight: 800; margin: 0 0 .85rem; }
.about-legal-body p { color: rgba(255,255,255,0.82); line-height: 1.9; margin: 0 0 1.25rem; font-size: .94rem; }
.about-legal-body p strong { color: #FFE9B0; font-weight: 800; }
.about-legal-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.about-legal-chips span {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .55rem 1rem;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--r-full);
  font-size: .78rem; font-weight: 600; color: rgba(255,255,255,0.92);
}
.about-legal-chips i { color: #10B981; font-size: .8rem; }

/* ============ UTILITY ============ */
.text-center { text-align: center; }

/* ============ RESPONSIVE — TABLET ============ */
@media (max-width: 991px) {
  .about-wing-inner,
  .about-jubilee-inner { grid-template-columns: 1fr; gap: 2rem; text-align: center; }
  .about-wing-icon { width: 130px; height: 130px; font-size: 2.65rem; }
  .about-wing-chips { justify-content: center; }
  .about-jubilee-img { max-height: 220px; }
  .about-jubilee-facts { justify-content: center; }
}

/* ============ RESPONSIVE — MOBILE ============ */
@media (max-width: 767px) {
  .about-aim-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
  .about-aim-icon { width: 52px; height: 52px; font-size: 1.15rem; border-radius: 15px; }
  .about-aim-label { font-size: .85rem; }
  .about-aim-statement { padding: 1.35rem 1.5rem; font-size: .96rem; }
  .about-quote-icon-top { width: 64px; height: 64px; font-size: 1.5rem; }
  .about-quote-text { font-size: 1.35rem; }
  .about-motto-badge { font-size: .88rem; padding: .65rem 1.25rem; }
  .about-leadership-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .about-quick-facts { grid-template-columns: 1fr; }
  .about-visual-jubilee { width: 110px; height: 110px; bottom: -20px; right: -10px; }
  .about-visual-badge { padding: .75rem 1rem; top: 16px; left: 16px; }
  .about-visual-badge-value { font-size: 1.25rem; }
  .about-legal { grid-template-columns: 1fr; text-align: center; padding: 2rem 1.5rem; }
  .about-legal-icon { margin: 0 auto; }
  .about-legal-chips { justify-content: center; }
}

@media (max-width: 480px) {
  .about-committee-cta-wrap { margin-top: 1.75rem; }
  .about-committee-cta-wrap .btn { padding: .85rem 1.6rem; font-size: .88rem; }
}

/* ============================================================
   FOUNDER PAGE — Complete styles
   Pen writing · Colourful borderless slider · Timeline · Legacy
   ============================================================ */

/* ============ 1. IN LOVING MEMORY — Pen writing ============ */
.founder-memory-section {
  position: relative;
  padding: clamp(4rem, 8vw, 7rem) 0 clamp(3rem, 6vw, 5rem);
  background: linear-gradient(180deg, #17122B 0%, #1F1937 60%, #2a0a15 100%);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.founder-memory-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.founder-memory-orb { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .45; }
.founder-memory-orb-1 { width: 500px; height: 500px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -180px; left: -120px; animation: floatSlow 20s ease-in-out infinite; }
.founder-memory-orb-2 { width: 420px; height: 420px; background: radial-gradient(circle, #FFD166, transparent 70%); bottom: -140px; right: -100px; animation: floatSlow 24s ease-in-out infinite reverse; }
.founder-memory-rays {
  position: absolute; inset: -20%;
  background: conic-gradient(from 200deg at 50% 0%, transparent 0deg, rgba(255,209,102,0.15) 25deg, transparent 50deg, transparent 100deg, rgba(255,209,102,0.10) 130deg, transparent 160deg, transparent 220deg, rgba(255,255,255,0.06) 250deg, transparent 280deg);
  animation: rotateSlow 80s linear infinite;
  opacity: .9;
}
.founder-memory-stars {
  position: absolute; inset: 0;
  background-image:
    radial-gradient(2px 2px at 15% 25%, rgba(255,209,102,0.9), transparent 60%),
    radial-gradient(1.5px 1.5px at 82% 18%, rgba(255,255,255,0.85), transparent 60%),
    radial-gradient(2px 2px at 45% 78%, rgba(255,209,102,0.8), transparent 60%),
    radial-gradient(1.5px 1.5px at 68% 45%, rgba(255,255,255,0.75), transparent 60%),
    radial-gradient(1.5px 1.5px at 25% 65%, rgba(255,209,102,0.75), transparent 60%);
  animation: sparkleTwinkle 6s ease-in-out infinite;
  pointer-events: none;
}
.founder-memory-inner { text-align: center; max-width: 900px; margin: 0 auto; position: relative; z-index: 2; }
.founder-memory-ornament {
  display: inline-flex; align-items: center; gap: 1.25rem;
  color: var(--amber-400);
  margin-bottom: 2rem;
}
.founder-memory-ornament .line { width: 100px; height: 1px; background: linear-gradient(90deg, transparent, var(--amber-400), transparent); }
.founder-memory-ornament i { font-size: 1.5rem; animation: bob 4s ease-in-out infinite; }

/* ---------- Pen-writing animation ---------- */
.pen-writing-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.4em;
  padding: 0 2rem;
  margin: 0 auto 1.5rem;
}
.pen-writing-text {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  clip-path: inset(0 100% 0 0);
  animation: penReveal 3s cubic-bezier(0.65, 0, 0.35, 1) forwards;
  animation-delay: 0.6s;
}
.pen-writing-inner {
  font-family: 'Dancing Script', 'Caveat', cursive;
  font-weight: 700;
  font-size: clamp(2.5rem, 7vw, 5rem);
  line-height: 1.1;
  background: linear-gradient(120deg, #FFD166 0%, #FFE9B0 40%, #FF4D6D 100%);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: 0.02em;
  padding: 0 .15em;
  filter: drop-shadow(0 8px 24px rgba(255,209,102,0.35));
  animation: penShimmer 6s ease-in-out infinite 3.6s;
}
.pen-writing-text::after {
  content: "";
  position: absolute;
  left: 0; bottom: 6px;
  height: 2px; width: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,209,102,0.35), transparent);
  opacity: 0;
  animation: penUnderline 3s ease-out forwards;
  animation-delay: 0.6s;
}
.pen-writing-cursor {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
  color: #FFD166;
  font-size: 1.6rem;
  opacity: 0;
  pointer-events: none;
  filter: drop-shadow(0 0 8px rgba(255,209,102,0.9));
  animation: penCursor 3s cubic-bezier(0.65, 0, 0.35, 1) forwards;
  animation-delay: 0.6s;
}
.pen-writing-cursor i { display: block; transform: rotate(-15deg); }

@keyframes penReveal {
  0%   { clip-path: inset(0 100% 0 0); }
  100% { clip-path: inset(0 0 0 0); }
}
@keyframes penCursor {
  0%   { left: 2rem;         opacity: 1; }
  85%  { left: calc(100% - 2rem); opacity: 1; }
  100% { left: calc(100% - 2rem); opacity: 0; }
}
@keyframes penUnderline {
  0%   { opacity: 0; transform: scaleX(0); transform-origin: left; }
  40%  { opacity: .8; }
  100% { opacity: 0; transform: scaleX(1); transform-origin: left; }
}
@keyframes penShimmer {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

.founder-memory-sub {
  color: rgba(255,255,255,0.75);
  font-size: clamp(.95rem, 1.4vw, 1.1rem);
  font-style: italic;
  max-width: 620px;
  margin: 0 auto;
  line-height: 1.7;
  opacity: 0;
  animation: memoryFadeIn 1.2s ease-out 3.6s forwards;
}
@keyframes memoryFadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

/* ============ 2. PHOTO SLIDER — Colourful borderless ============ */
.founder-slider-section {
  position: relative;
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(2rem, 4vw, 3.5rem);
  background: linear-gradient(180deg, #2a0a15 0%, #1F1937 30%, #FFF9F4 30%, #FFFCFA 100%);
  overflow: hidden;
}

/* Colourful aurora layer behind the slider */
.founder-slider-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 500px at 20% 20%, rgba(255,77,109,0.30), transparent 60%),
    radial-gradient(900px 500px at 80% 30%, rgba(255,209,102,0.28), transparent 60%),
    radial-gradient(800px 500px at 15% 80%, rgba(139,92,246,0.22), transparent 60%),
    radial-gradient(800px 500px at 85% 85%, rgba(45,212,191,0.22), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.founder-slider-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(2px 2px at 12% 15%, rgba(255,209,102,0.9), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 22%, rgba(255,255,255,0.9), transparent 60%),
    radial-gradient(2px 2px at 42% 88%, rgba(255,77,109,0.8), transparent 60%),
    radial-gradient(1.5px 1.5px at 72% 72%, rgba(45,212,191,0.8), transparent 60%),
    radial-gradient(1.5px 1.5px at 28% 45%, rgba(255,209,102,0.7), transparent 60%);
  animation: sparkleTwinkle 7s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}

.founder-slider-wrap {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
  z-index: 1;
}

/* Slider — smaller, centred, with colourful rotating aura */
.founder-slider {
  position: relative;
  width: min(560px, 88%);
  margin: 0 auto;
  aspect-ratio: 4/5;
  overflow: hidden;
  -webkit-mask-image: radial-gradient(ellipse 92% 95% at 50% 50%, #000 65%, transparent 100%);
  mask-image: radial-gradient(ellipse 92% 95% at 50% 50%, #000 65%, transparent 100%);
  filter: drop-shadow(0 40px 80px rgba(31,25,55,0.40));
}

/* Colourful rotating aura just behind the photo */
.founder-slider::before {
  content: "";
  position: absolute;
  inset: -20%;
  background: conic-gradient(from 0deg,
    rgba(255, 77, 109, 0.55) 0deg,
    rgba(255, 209, 102, 0.55) 90deg,
    rgba(139, 92, 246, 0.50) 180deg,
    rgba(45, 212, 191, 0.55) 270deg,
    rgba(255, 77, 109, 0.55) 360deg);
  filter: blur(60px);
  animation: rotateSlow 24s linear infinite;
  z-index: -1;
  pointer-events: none;
}

.founder-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.10);
  transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 3.5s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
.founder-slide.active {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
  animation: founderMemoryDrift 8s ease-in-out infinite alternate;
}
@keyframes founderMemoryDrift {
  0%   { transform: scale(1) translate(0, 0); }
  100% { transform: scale(1.04) translate(-0.5%, -1%); }
}

.founder-slide-frame {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 28px;
  box-shadow:
    0 0 0 1px rgba(255,209,102,0.20) inset,
    0 0 60px rgba(255,77,109,0.28) inset,
    0 0 120px rgba(139,92,246,0.20) inset;
}
.founder-slide-frame img {
  width: 100%; height: 100%;
  object-fit: contain;
  object-position: center;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  transform: translateZ(0);
  background: radial-gradient(circle at 50% 50%, rgba(255,209,102,0.10), rgba(31,25,55,0.35));
  padding: 4px;
}

.founder-slide-glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%, transparent 55%, rgba(255,77,109,0.22) 100%),
    linear-gradient(180deg, transparent 65%, rgba(255,209,102,0.20) 100%);
}

.founder-slide-caption {
  position: absolute;
  bottom: 1.75rem; left: 50%;
  transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .6rem 1.25rem;
  background: rgba(23,18,43,0.88);
  backdrop-filter: blur(14px);
  border-radius: var(--r-full);
  border: 1px solid rgba(255,209,102,0.35);
  color: #FFE9B0;
  font-size: .82rem;
  font-weight: 600;
  white-space: nowrap;
  z-index: 3;
  max-width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 12px 30px rgba(0,0,0,0.4), 0 0 40px rgba(255,209,102,0.25);
}
.founder-slide-caption-icon {
  display: inline-flex; width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--grad-gold); color: #3A2A00;
  align-items: center; justify-content: center;
  font-size: .6rem;
  flex-shrink: 0;
}

/* Navigation — colourful gradient */
.founder-nav {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 52px; height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(255,77,109,0.85), rgba(201,24,74,0.85));
  border: 1px solid rgba(255,209,102,0.45);
  color: #fff;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  backdrop-filter: blur(14px);
  transition: all .35s var(--ease);
  z-index: 4;
  box-shadow: 0 16px 34px rgba(244,63,94,0.45);
}
.founder-nav:hover {
  background: var(--grad-gold);
  border-color: transparent;
  color: #3A2A00;
  transform: translateY(-50%) scale(1.12);
  box-shadow: 0 22px 44px rgba(245,158,11,0.55);
}
.founder-nav-prev { left: -26px; }
.founder-nav-next { right: -26px; }

/* Progress bar — rainbow */
.founder-slider-progress {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(255,255,255,0.15);
  z-index: 4;
  border-radius: 0 0 28px 28px;
  overflow: hidden;
}
.founder-slider-progress-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, #FF4D6D 0%, #FFD166 40%, #A78BFA 70%, #2DD4BF 100%);
  background-size: 200% 100%;
  animation: auroraShift 3s linear infinite;
  box-shadow: 0 0 16px rgba(255,209,102,0.8);
}

/* Thumbnails */
.founder-thumbs {
  display: flex; justify-content: center;
  gap: .85rem; margin-top: 1.75rem;
  position: relative; z-index: 3;
}
.founder-thumb {
  position: relative;
  width: 70px; height: 70px;
  border-radius: 50%;
  overflow: hidden;
  border: 0;
  cursor: pointer;
  background: #fff;
  padding: 0;
  transition: all .5s var(--ease);
  opacity: .55;
  box-shadow: 0 10px 26px rgba(31,25,55,0.20);
}
.founder-thumb img { width: 100%; height: 100%; object-fit: cover; }
.founder-thumb.active {
  opacity: 1;
  transform: translateY(-6px) scale(1.10);
  box-shadow:
    0 22px 44px rgba(245,158,11,0.5),
    0 0 0 3px rgba(255,209,102,0.85),
    0 0 30px rgba(255,77,109,0.55);
}
.founder-thumb:hover { opacity: 1; transform: translateY(-4px) scale(1.05); }
.founder-thumb-ring {
  position: absolute; inset: -8px;
  border-radius: 50%;
  border: 2px dashed rgba(255,209,102,0.55);
  opacity: 0;
  transition: opacity .4s var(--ease);
  pointer-events: none;
}
.founder-thumb.active .founder-thumb-ring {
  opacity: 1;
  animation: rotateSlow 20s linear infinite;
}

/* Halo behind slider */
.founder-slider-halo {
  position: absolute;
  inset: -80px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 40%, rgba(255,209,102,0.25), transparent 55%),
    radial-gradient(circle at 65% 60%, rgba(45,212,191,0.22), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(255,77,109,0.28), transparent 65%);
  filter: blur(60px);
  z-index: -1;
  animation: pulseGlow 7s ease-in-out infinite;
  pointer-events: none;
}

/* ============ 3. WRITING BELOW PHOTOS ============ */
.founder-writing-section {
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(3rem, 6vw, 5rem);
  background: linear-gradient(180deg, #FFFCFA 0%, #FFF7F4 100%);
  position: relative;
  overflow: hidden;
}
.founder-writing-section::before {
  content: "";
  position: absolute;
  top: -40%; left: -10%;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,77,109,0.10), transparent 70%);
  filter: blur(60px);
  pointer-events: none;
}
.founder-writing-section::after {
  content: "";
  position: absolute;
  bottom: -40%; right: -10%;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,209,102,0.12), transparent 70%);
  filter: blur(60px);
  pointer-events: none;
}
.founder-writing-inner { text-align: center; max-width: 900px; margin: 0 auto; position: relative; z-index: 2; }
.founder-writing-badge {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .5rem 1.35rem;
  background: rgba(255,209,102,0.16);
  border: 1px solid rgba(245,158,11,0.35);
  border-radius: var(--r-full);
  color: #B45309;
  font-weight: 700; font-size: .76rem;
  letter-spacing: .18em; text-transform: uppercase;
  margin-bottom: 1.5rem;
}
.founder-writing-badge i { color: #F59E0B; font-size: .82rem; }
.founder-writing-name {
  font-family: var(--font-heading);
  font-size: clamp(1.9rem, 4.2vw, 3.25rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0 0 1rem;
  background: linear-gradient(180deg, #1F1937 0%, #C9184A 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.founder-writing-title {
  color: var(--ink-soft);
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 500;
  font-style: italic;
  margin: 0 0 1.5rem;
  letter-spacing: .02em;
}
.founder-writing-dates {
  display: inline-flex; align-items: center; gap: 1rem;
  color: var(--rose-600);
  font-weight: 700; font-size: 1rem;
  letter-spacing: .12em;
  margin-bottom: 2rem;
  padding: 0 1rem;
}
.founder-writing-dates i { font-size: .75rem; opacity: .7; }
.founder-writing-benediction {
  display: inline-flex; align-items: center; gap: 1rem;
  padding: 1rem 1.75rem;
  background: linear-gradient(135deg, rgba(255,209,102,0.10), rgba(255,77,109,0.06));
  border-top: 1px solid rgba(245,158,11,0.30);
  border-bottom: 1px solid rgba(245,158,11,0.30);
  border-radius: 4px;
}
.founder-writing-benediction i { color: #F59E0B; font-size: .9rem; opacity: .7; }
.founder-writing-benediction p {
  font-family: var(--font-heading);
  font-style: italic;
  color: var(--ink);
  font-size: 1.05rem;
  margin: 0;
  letter-spacing: .04em;
}

/* ============ 4. OPENING QUOTE ============ */
.founder-quote-section {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: linear-gradient(180deg, #FFFCFA 0%, #FFF7F4 100%);
  overflow: hidden;
}
.founder-quote-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.founder-quote-orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .25; }
.founder-quote-orb-1 { width: 400px; height: 400px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -120px; left: -100px; animation: floatSlow 18s ease-in-out infinite; }
.founder-quote-orb-2 { width: 360px; height: 360px; background: radial-gradient(circle, #FFD166, transparent 70%); bottom: -120px; right: -80px; animation: floatSlow 22s ease-in-out infinite reverse; }
.founder-quote-inner { text-align: center; max-width: 900px; margin: 0 auto; position: relative; z-index: 2; }
.founder-quote-mark {
  display: inline-flex; width: 80px; height: 80px;
  border-radius: 50%;
  background: var(--grad-red); color: #fff;
  align-items: center; justify-content: center;
  font-size: 1.85rem;
  box-shadow: 0 22px 50px rgba(244,63,94,0.42);
  margin-bottom: 1.75rem;
  animation: bob 4s ease-in-out infinite;
}
.founder-quote-text {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: clamp(1.35rem, 2.8vw, 2rem);
  line-height: 1.45;
  color: var(--ink);
  font-weight: 600;
  margin: 0 0 1.75rem;
  letter-spacing: -0.01em;
}
.founder-quote-author { display: inline-flex; align-items: center; gap: 1rem; }
.founder-quote-line { display: block; width: 60px; height: 1.5px; background: var(--rose-500); }
.founder-quote-cite {
  font-family: var(--font-heading);
  font-weight: 800; font-size: .8rem;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--rose-600);
}

/* ============ 5. BIOGRAPHY ============ */
.founder-bio-section { background: linear-gradient(180deg, #FFFFFF 0%, #FFFCFA 100%); }
.founder-bio-content { display: flex; flex-direction: column; gap: 1.75rem; }
.founder-bio-block {
  display: grid; grid-template-columns: 72px 1fr; gap: 1.75rem;
  align-items: flex-start;
  padding: 1.75rem 2rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  transition: all .45s var(--ease);
  position: relative;
  overflow: hidden;
}
.founder-bio-block::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--grad-red);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .55s var(--ease);
}
.founder-bio-block:hover { transform: translateY(-6px); box-shadow: 0 24px 55px rgba(31,25,55,0.12); border-color: transparent; }
.founder-bio-block:hover::before { transform: scaleY(1); }
.founder-bio-icon {
  width: 72px; height: 72px;
  border-radius: 22px;
  background: var(--grad-red); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.65rem;
  box-shadow: 0 14px 30px rgba(244,63,94,0.32);
  flex-shrink: 0;
  transition: transform .5s var(--ease-bounce);
}
.founder-bio-icon-gold   { background: var(--grad-gold);   box-shadow: 0 14px 30px rgba(245,158,11,0.32); color: #3A2A00; }
.founder-bio-icon-violet { background: var(--grad-violet); box-shadow: 0 14px 30px rgba(124,58,237,0.32); }
.founder-bio-block:hover .founder-bio-icon { transform: scale(1.1) rotate(-8deg); }
.founder-bio-body h3 {
  font-family: var(--font-heading);
  font-size: clamp(1.15rem, 1.8vw, 1.35rem);
  font-weight: 800;
  color: var(--ink);
  margin: 0 0 .75rem;
  line-height: 1.3;
}
.founder-bio-body p { color: var(--ink-soft); font-size: .98rem; line-height: 1.9; margin: 0; }

/* ============ 6. TIMELINE ============ */
.founder-timeline-section {
  position: relative;
  padding: clamp(4rem, 8vw, 6.5rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 55%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
}
.founder-timeline-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.founder-timeline-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .4; }
.founder-timeline-orb-1 { width: 400px; height: 400px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -100px; left: 10%; animation: floatSlow 20s ease-in-out infinite; }
.founder-timeline-orb-2 { width: 380px; height: 380px; background: radial-gradient(circle, #FFD166, transparent 70%); bottom: -100px; right: 10%; animation: floatSlow 24s ease-in-out infinite reverse; }
.founder-timeline { position: relative; max-width: 900px; margin: 0 auto; padding: 1rem 0; }
.founder-timeline::before {
  content: ""; position: absolute;
  left: 50%; top: 0; bottom: 0;
  transform: translateX(-50%);
  width: 2px;
  background: linear-gradient(180deg, transparent, rgba(255,209,102,0.5) 10%, rgba(255,209,102,0.5) 90%, transparent);
}
.founder-timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 90px 1fr;
  align-items: center;
  margin-bottom: 2.5rem;
  gap: 0;
}
.founder-timeline-item:last-child { margin-bottom: 0; }
.founder-timeline-marker {
  grid-column: 2;
  width: 68px; height: 68px;
  margin: 0 auto;
  border-radius: 50%;
  background: var(--grad-gold); color: #3A2A00;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.35rem;
  box-shadow: 0 16px 34px rgba(245,158,11,0.42), 0 0 0 8px rgba(255,209,102,0.15);
  z-index: 2;
  position: relative;
  transition: all .5s var(--ease-bounce);
}
.founder-timeline-item:hover .founder-timeline-marker { transform: scale(1.12) rotate(-8deg); }
.founder-timeline-card {
  grid-row: 1;
  padding: 1.5rem 1.65rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 20px;
  backdrop-filter: blur(10px);
  transition: all .4s var(--ease);
  position: relative;
}
.founder-timeline-card:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,209,102,0.30);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.28);
}
.founder-timeline-item-left .founder-timeline-card { grid-column: 1; text-align: right; }
.founder-timeline-item-right .founder-timeline-card { grid-column: 3; text-align: left; }
.founder-timeline-year {
  display: inline-block;
  padding: .35rem .9rem;
  background: var(--grad-gold); color: #3A2A00;
  border-radius: var(--r-full);
  font-family: var(--font-heading);
  font-weight: 800; font-size: .75rem;
  letter-spacing: .08em;
  margin-bottom: .75rem;
}
.founder-timeline-title { font-family: var(--font-heading); color: #fff; font-size: 1.05rem; font-weight: 800; margin: 0 0 .55rem; line-height: 1.3; }
.founder-timeline-text { color: rgba(255,255,255,0.78); font-size: .88rem; line-height: 1.75; margin: 0; }

/* ============ 7. BLESSINGS ============ */
.founder-blessings-section { background: linear-gradient(180deg, #FFF9F4 0%, #FFF4EC 100%); }
.founder-blessings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
  max-width: 1000px;
  margin: 0 auto;
}
.founder-blessing {
  position: relative;
  padding: 2rem 1.75rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  transition: all .45s var(--ease);
  overflow: hidden;
  text-align: center;
}
.founder-blessing::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0;
  height: 4px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .5s var(--ease);
}
.founder-blessing-red::before    { background: var(--grad-red); }
.founder-blessing-gold::before   { background: var(--grad-gold); }
.founder-blessing-teal::before   { background: var(--grad-teal); }
.founder-blessing-violet::before { background: var(--grad-violet); }
.founder-blessing:hover { transform: translateY(-8px); box-shadow: 0 26px 55px rgba(31,25,55,0.14); border-color: transparent; }
.founder-blessing:hover::before { transform: scaleX(1); }
.founder-blessing-icon {
  width: 62px; height: 62px;
  margin: 0 auto 1.15rem;
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 1.4rem;
  transition: transform .5s var(--ease-bounce);
}
.founder-blessing-red    .founder-blessing-icon { background: var(--grad-red);    box-shadow: 0 12px 26px rgba(244,63,94,0.32); }
.founder-blessing-gold   .founder-blessing-icon { background: var(--grad-gold);   box-shadow: 0 12px 26px rgba(245,158,11,0.32); color: #3A2A00; }
.founder-blessing-teal   .founder-blessing-icon { background: var(--grad-teal);   box-shadow: 0 12px 26px rgba(20,184,166,0.32); }
.founder-blessing-violet .founder-blessing-icon { background: var(--grad-violet); box-shadow: 0 12px 26px rgba(124,58,237,0.32); }
.founder-blessing:hover .founder-blessing-icon { transform: scale(1.12) rotate(-8deg); }
.founder-blessing-quote {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: .98rem;
  color: var(--ink-soft);
  line-height: 1.65;
  margin: 0;
}

/* ============ 8. LEGACY STATS ============ */
.founder-legacy-section {
  position: relative;
  padding: clamp(4rem, 8vw, 6.5rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 55%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
}
.founder-legacy-bg { position: absolute; inset: 0; pointer-events: none; }
.founder-legacy-rays {
  position: absolute; inset: -20%;
  background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255,209,102,0.10) 30deg, transparent 60deg, transparent 120deg, rgba(255,77,109,0.08) 150deg, transparent 180deg, transparent 240deg, rgba(45,212,191,0.06) 270deg, transparent 300deg, rgba(255,209,102,0.08) 330deg);
  animation: rotateSlow 100s linear infinite;
  opacity: .9;
}
.founder-legacy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem;
  max-width: 1080px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.founder-legacy-card {
  padding: 2rem 1.5rem;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 24px;
  text-align: center;
  backdrop-filter: blur(12px);
  transition: all .5s var(--ease);
}
.founder-legacy-card:hover { transform: translateY(-8px); border-color: rgba(255,209,102,0.40); box-shadow: 0 30px 60px rgba(0,0,0,0.35); }
.founder-legacy-icon {
  width: 64px; height: 64px;
  margin: 0 auto 1.25rem;
  border-radius: 18px;
  background: var(--grad-red); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem;
  box-shadow: 0 14px 30px rgba(244,63,94,0.32);
  transition: transform .5s var(--ease-bounce);
}
.founder-legacy-icon-gold   { background: var(--grad-gold);   box-shadow: 0 14px 30px rgba(245,158,11,0.32); color: #3A2A00; }
.founder-legacy-icon-teal   { background: var(--grad-teal);   box-shadow: 0 14px 30px rgba(20,184,166,0.32); }
.founder-legacy-violet      { background: var(--grad-violet); box-shadow: 0 14px 30px rgba(124,58,237,0.32); }
.founder-legacy-card:hover .founder-legacy-icon { transform: scale(1.12) rotate(-8deg); }
.founder-legacy-value {
  font-family: var(--font-heading);
  font-size: clamp(1.9rem, 3.2vw, 2.5rem);
  font-weight: 900;
  color: #fff;
  line-height: 1;
  margin-bottom: .5rem;
}
.founder-legacy-value span { color: var(--amber-400); font-size: .6em; vertical-align: super; }
.founder-legacy-label {
  color: rgba(255,255,255,0.7);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ============ 9. CLOSING BLESSING ============ */
.founder-closing-section {
  padding: clamp(4rem, 8vw, 6.5rem) 0;
  background: linear-gradient(180deg, #FFFCFA 0%, #FFF7F4 100%);
  position: relative;
  overflow: hidden;
}
.founder-closing-inner {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 3rem 2rem;
  background: #fff;
  border-radius: 32px;
  border: 1px solid var(--line);
  box-shadow: 0 30px 70px rgba(31,25,55,0.10);
  position: relative;
}
.founder-closing-cross {
  position: relative;
  width: 100px; height: 100px;
  margin: -5rem auto 1.75rem;
  border-radius: 50%;
  background: var(--grad-gold); color: #3A2A00;
  display: flex; align-items: center; justify-content: center;
  font-size: 2.25rem;
  box-shadow: 0 24px 50px rgba(245,158,11,0.42);
  animation: bob 5s ease-in-out infinite;
}
.founder-closing-ring {
  position: absolute;
  inset: -14px;
  border-radius: 50%;
  border: 2px dashed rgba(255,209,102,0.5);
  animation: rotateSlow 30s linear infinite;
}
.founder-closing-title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2.15rem);
  font-weight: 800;
  margin: 0 0 1rem;
  letter-spacing: -0.02em;
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
}
.founder-closing-text {
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.85;
  max-width: 620px;
  margin: 0 auto 1.5rem;
}
.founder-closing-dates {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .55rem 1.35rem;
  background: var(--rose-50);
  color: var(--rose-700);
  border-radius: var(--r-full);
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .12em;
}

/* ============ RESPONSIVE ============ */
@media (max-width: 991px) {
  .founder-nav-prev { left: 8px; }
  .founder-nav-next { right: 8px; }
}

@media (max-width: 767px) {
  .founder-memory-ornament .line { width: 60px; }
  .pen-writing-inner { font-size: clamp(2rem, 8vw, 3.2rem); }
  .pen-writing-cursor { font-size: 1.3rem; }
  .founder-quote-mark { width: 64px; height: 64px; font-size: 1.5rem; }
  .founder-quote-line { width: 40px; }
  .founder-bio-block { grid-template-columns: 60px 1fr; gap: 1.25rem; padding: 1.35rem 1.5rem; }
  .founder-bio-icon { width: 60px; height: 60px; font-size: 1.35rem; border-radius: 18px; }
  .founder-timeline::before { left: 26px; }
  .founder-timeline-item { grid-template-columns: 60px 1fr; gap: 1.25rem; }
  .founder-timeline-marker { grid-column: 1; width: 56px; height: 56px; font-size: 1.15rem; margin: 0; }
  .founder-timeline-item-left .founder-timeline-card,
  .founder-timeline-item-right .founder-timeline-card { grid-column: 2; text-align: left; }
  .founder-slider { width: min(420px, 92%); }
  .founder-nav { width: 44px; height: 44px; font-size: .9rem; }
  .founder-nav-prev { left: 6px; }
  .founder-nav-next { right: 6px; }
  .founder-thumb { width: 58px; height: 58px; }
  .founder-slide-caption { font-size: .74rem; padding: .5rem 1rem; }
  .founder-writing-benediction { flex-direction: column; gap: .5rem; padding: .85rem 1.25rem; }
  .founder-writing-benediction p { font-size: .92rem; }
  .founder-closing-cross { width: 84px; height: 84px; font-size: 1.85rem; margin-top: -4rem; }
}

@media (max-width: 480px) {
  .founder-slider { width: min(320px, 94%); }
  .founder-nav { display: none; }
  .founder-thumb { width: 50px; height: 50px; }
  .founder-thumbs { gap: .55rem; }
  .pen-writing-wrap { padding: 0 1rem; }
  .pen-writing-cursor { display: none; }
}

/* ============================================================
   ACTIVITIES PAGE — Tab platform with auto-icons
   ============================================================ */

/* ============ INTRO STRIP ============ */
.activity-intro-strip {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: linear-gradient(135deg, #1F1937 0%, #3D2C5E 55%, #6B1C3E 100%);
  color: #fff;
  overflow: hidden;
}
.activity-intro-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.activity-intro-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .4; }
.activity-intro-orb-1 { width: 420px; height: 420px; background: radial-gradient(circle, #FF4D6D, transparent 70%); top: -140px; left: -100px; animation: floatSlow 20s ease-in-out infinite; }
.activity-intro-orb-2 { width: 380px; height: 380px; background: radial-gradient(circle, #FFD166, transparent 70%); bottom: -140px; right: -100px; animation: floatSlow 24s ease-in-out infinite reverse; }
.activity-intro-orb-3 { width: 320px; height: 320px; background: radial-gradient(circle, #2DD4BF, transparent 70%); top: 40%; left: 45%; opacity: .25; animation: bob 14s ease-in-out infinite; }

.activity-intro-inner {
  position: relative;
  display: grid;
  grid-template-columns: 140px 1fr 320px;
  gap: 2.5rem;
  align-items: center;
}
.activity-intro-icon {
  position: relative;
  width: 140px; height: 140px;
  border-radius: 50%;
  background: var(--grad-gold);
  color: #3A2A00;
  display: flex; align-items: center; justify-content: center;
  font-size: 3rem;
  box-shadow: 0 30px 70px rgba(245,158,11,0.55);
  animation: bob 5s ease-in-out infinite;
}
.activity-intro-ring {
  position: absolute; inset: -14px;
  border-radius: 50%;
  border: 2px dashed rgba(255,209,102,0.5);
  animation: rotateSlow 30s linear infinite;
}
.activity-intro-label {
  display: inline-block;
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  font-weight: 700;
  margin-bottom: .5rem;
}
.activity-intro-title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 .85rem;
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  line-height: 1.15;
}
.activity-intro-desc {
  color: rgba(255,255,255,0.8);
  font-size: .98rem;
  line-height: 1.85;
  margin: 0;
  max-width: 620px;
}
.activity-intro-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.activity-intro-stat {
  text-align: center;
  padding: 1.25rem .75rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 18px;
  backdrop-filter: blur(12px);
  transition: all .35s var(--ease);
}
.activity-intro-stat:hover { transform: translateY(-4px); border-color: rgba(255,209,102,0.4); }
.activity-intro-stat-value {
  font-family: var(--font-heading);
  font-size: clamp(1.4rem, 2.2vw, 1.85rem);
  font-weight: 900;
  line-height: 1;
  background: var(--grad-gold);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.activity-intro-stat-value span { color: var(--amber-400); -webkit-text-fill-color: var(--amber-400); font-size: .6em; vertical-align: super; }
.activity-intro-stat-label {
  margin-top: .45rem;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.72);
}

@media (max-width: 991px) {
  .activity-intro-inner { grid-template-columns: 1fr; text-align: center; gap: 2rem; }
  .activity-intro-icon { margin: 0 auto; width: 120px; height: 120px; font-size: 2.5rem; }
  .activity-intro-desc { margin: 0 auto; }
  .activity-intro-stats { max-width: 500px; margin: 0 auto; }
}

/* ============ PLATFORM ============ */
.activity-platform {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) 0 clamp(3.5rem, 7vw, 6rem);
  background: linear-gradient(180deg, #FFFCFA 0%, #FFF7F4 100%);
  overflow: hidden;
}
.activity-platform::before {
  content: "";
  position: absolute; top: -30%; left: -10%;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,77,109,0.08), transparent 70%);
  filter: blur(60px);
  pointer-events: none;
}

/* ============ TAB BAR ============ */
.activity-tabs-wrap {
  position: relative;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  z-index: 2;
}
.activity-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .6rem;
  padding: .65rem;
  background: #fff;
  border-radius: 22px;
  border: 1px solid var(--line);
  box-shadow: 0 14px 40px rgba(31,25,55,0.08);
  max-width: max-content;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
.activity-tabs::before {
  content: "";
  position: absolute; inset: -1px;
  border-radius: inherit;
  background: linear-gradient(90deg, #FF4D6D, #FFD166, #2DD4BF, #A78BFA, #FF4D6D);
  background-size: 300% 100%;
  z-index: -1;
  opacity: .3;
  animation: filterGradient 6s linear infinite;
  filter: blur(6px);
  pointer-events: none;
}
@keyframes filterGradient { from { background-position: 0% 50%; } to { background-position: 300% 50%; } }

.activity-tab {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .75rem 1.15rem;
  border: 0;
  background: transparent;
  border-radius: 14px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: .82rem;
  color: var(--ink-soft);
  cursor: pointer;
  transition: all .35s var(--ease);
  white-space: nowrap;
  position: relative;
}
.activity-tab-icon {
  width: 32px; height: 32px;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: .85rem;
  flex-shrink: 0;
  transition: all .35s var(--ease);
}
.activity-tab-label { display: inline-block; }

/* Theme colors for tab icons (default state) */
.activity-tab-red     .activity-tab-icon { background: var(--grad-red);    box-shadow: 0 8px 18px rgba(244,63,94,0.28); }
.activity-tab-gold    .activity-tab-icon { background: var(--grad-gold);   box-shadow: 0 8px 18px rgba(245,158,11,0.28); color: #3A2A00; }
.activity-tab-teal    .activity-tab-icon { background: var(--grad-teal);   box-shadow: 0 8px 18px rgba(20,184,166,0.28); }
.activity-tab-violet  .activity-tab-icon { background: var(--grad-violet); box-shadow: 0 8px 18px rgba(124,58,237,0.28); }
.activity-tab-rose    .activity-tab-icon { background: var(--grad-rose);   box-shadow: 0 8px 18px rgba(244,63,94,0.28); }
.activity-tab-sky     .activity-tab-icon { background: linear-gradient(135deg,#38BDF8,#0EA5E9); box-shadow: 0 8px 18px rgba(14,165,233,0.28); }

.activity-tab:hover {
  background: rgba(255,77,109,0.06);
  color: var(--rose-600);
  transform: translateY(-2px);
}
.activity-tab.active {
  background: var(--grad-red);
  color: #fff;
  box-shadow: 0 14px 30px rgba(244,63,94,0.35);
}
.activity-tab.active .activity-tab-icon {
  background: rgba(255,255,255,0.24);
  box-shadow: none;
  color: #fff;
}

.activity-tabs-hint {
  text-align: center;
  margin-top: 1rem;
  font-size: .78rem;
  color: var(--muted);
  font-weight: 600;
  letter-spacing: .04em;
}
.activity-tabs-hint i { color: var(--rose-500); margin-right: .35rem; }

@media (max-width: 767px) {
  .activity-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    max-width: 100%;
    width: 100%;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .activity-tabs::-webkit-scrollbar { display: none; }
  .activity-tab { flex-shrink: 0; padding: .65rem 1rem; font-size: .78rem; }
}

/* ============ PANELS ============ */
.activity-panels { position: relative; }
.activity-panel {
  display: none;
  background: #fff;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: 0 24px 60px rgba(31,25,55,0.10);
}
.activity-panel.active { display: block; }
@keyframes activityPanelIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}

/* Panel header */
.activity-panel-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 1.75rem 2rem;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #FFFDFB, #fff);
}
.activity-panel-icon {
  position: relative;
  width: 68px; height: 68px;
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.65rem;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 14px 30px rgba(0,0,0,0.18);
}
.activity-panel-icon-red    { background: var(--grad-red);    box-shadow: 0 14px 30px rgba(244,63,94,0.32); }
.activity-panel-icon-gold   { background: var(--grad-gold);   box-shadow: 0 14px 30px rgba(245,158,11,0.32); color: #3A2A00; }
.activity-panel-icon-teal   { background: var(--grad-teal);   box-shadow: 0 14px 30px rgba(20,184,166,0.32); }
.activity-panel-icon-violet { background: var(--grad-violet); box-shadow: 0 14px 30px rgba(124,58,237,0.32); }
.activity-panel-icon-rose   { background: var(--grad-rose);   box-shadow: 0 14px 30px rgba(244,63,94,0.32); }
.activity-panel-icon-sky    { background: linear-gradient(135deg,#38BDF8,#0EA5E9); box-shadow: 0 14px 30px rgba(14,165,233,0.32); }
.activity-panel-icon-ring {
  position: absolute; inset: -10px;
  border-radius: 28px;
  border: 2px dashed rgba(255,255,255,0.35);
  animation: rotateSlow 25s linear infinite;
}

.activity-panel-heading { flex: 1; min-width: 0; }
.activity-panel-badge {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .35rem .9rem;
  background: var(--rose-50);
  color: var(--rose-700);
  border-radius: var(--r-full);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: .65rem;
}
.activity-panel-badge i { color: var(--rose-500); font-size: .7rem; }
.activity-panel-badge-featured {
  background: linear-gradient(135deg, #FFD166, #F59E0B);
  color: #3A2A00;
}
.activity-panel-badge-featured i { color: #3A2A00; }

.activity-panel-title {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.4vw, 1.85rem);
  font-weight: 800;
  color: var(--ink);
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

/* Panel body */
.activity-panel-body {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 2.5rem;
  padding: 2rem 2rem 2.5rem;
}

/* Image column */
.activity-panel-image-col { display: flex; flex-direction: column; gap: 1rem; }
.activity-panel-image {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 22px 50px rgba(31,25,55,0.15);
  background: var(--grad-rose);
}
.activity-panel-image img {
  width: 100%; height: 100%;
  object-fit: cover;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  transform: translateZ(0);
}
.activity-panel-image-shine {
  position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,0.28) 50%, transparent 60%);
  transform: translateX(-100%);
  transition: transform 1.2s var(--ease);
  pointer-events: none;
}
.activity-panel:hover .activity-panel-image-shine { transform: translateX(100%); }

/* Icon fallback */
.activity-panel-image-fallback {
  width: 100%; height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  color: #fff;
  text-align: center;
  padding: 2rem 1.5rem;
  position: relative;
  overflow: hidden;
}
.activity-panel-image-fallback::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.25), transparent 60%);
  pointer-events: none;
}
.activity-panel-image-fallback i {
  font-size: 4.5rem;
  filter: drop-shadow(0 14px 30px rgba(0,0,0,0.35));
  animation: bob 5s ease-in-out infinite;
  position: relative;
}
.activity-panel-image-fallback span {
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.3;
  padding: 0 1rem;
  position: relative;
  text-shadow: 0 3px 12px rgba(0,0,0,0.3);
}
.activity-panel-image-fallback-red    { background: var(--grad-red); }
.activity-panel-image-fallback-gold   { background: var(--grad-gold); color: #3A2A00; }
.activity-panel-image-fallback-teal   { background: var(--grad-teal); }
.activity-panel-image-fallback-violet { background: var(--grad-violet); }
.activity-panel-image-fallback-rose   { background: var(--grad-rose); }
.activity-panel-image-fallback-sky    { background: linear-gradient(135deg,#38BDF8,#0EA5E9); }

/* Highlights strip */
.activity-panel-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .6rem;
}
.activity-panel-highlight {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .65rem .85rem;
  background: linear-gradient(180deg, #FFFBF8, #FFF7F4);
  border: 1px solid var(--line);
  border-radius: 12px;
  font-size: .72rem;
  font-weight: 700;
  color: var(--ink-soft);
}
.activity-panel-highlight i { color: var(--rose-500); font-size: .85rem; }

/* Text column */
.activity-panel-text-col { display: flex; flex-direction: column; }
.activity-panel-prose p { font-size: 1rem; line-height: 1.9; color: var(--ink-soft); }
.activity-panel-prose p strong { color: var(--ink); font-weight: 800; }
.activity-panel-lead { font-size: 1.05rem; line-height: 1.85; color: var(--ink-soft); margin-bottom: 1.5rem; }

.activity-panel-ctas {
  display: flex;
  gap: .85rem;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 1.5rem;
}

/* Empty state */
.activity-empty {
  text-align: center;
  padding: 5rem 2rem;
  background: #fff;
  border-radius: 28px;
  border: 1px solid var(--line);
}
.activity-empty i { font-size: 4rem; color: var(--rose-400); margin-bottom: 1rem; display: block; }
.activity-empty h3 { font-family: var(--font-heading); color: var(--ink); margin: 0 0 .5rem; }
.activity-empty p { color: var(--muted); margin: 0; }

/* ============ RESPONSIVE ============ */
@media (max-width: 991px) {
  .activity-panel-body { grid-template-columns: 1fr; gap: 2rem; }
  .activity-panel-image { aspect-ratio: 16/10; max-height: 400px; }
  .activity-panel-image-fallback i { font-size: 3.5rem; }
}
@media (max-width: 767px) {
  .activity-panel-header { flex-direction: column; align-items: flex-start; text-align: left; padding: 1.5rem 1.35rem; gap: 1rem; }
  .activity-panel-icon { width: 58px; height: 58px; font-size: 1.4rem; border-radius: 17px; }
  .activity-panel-body { padding: 1.35rem 1.35rem 1.75rem; }
  .activity-panel-title { font-size: 1.35rem; }
  .activity-panel-image { aspect-ratio: 1/1; }
  .activity-panel-highlights { grid-template-columns: 1fr; }
  .activity-panel-image-fallback i { font-size: 3rem; }
  .activity-panel-ctas { flex-direction: column; }
  .activity-panel-ctas .btn { width: 100%; justify-content: center; }
}