@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

* , *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background: #FAFAFA; color: #2B2B2B; margin: 0; }

.font-display { font-family: 'Cormorant Garamond', Georgia, serif; }

.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes floatY {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-8px); }
}
@keyframes pulseGold {
    0%, 100% { opacity: .6; }
    50%      { opacity: 1; }
}
@keyframes zoomIn {
    from { transform: scale(1); }
    to   { transform: scale(1.06); }
}
@keyframes scrollDot {
    0%   { opacity: 1; transform: translateY(0); }
    65%  { opacity: 0; transform: translateY(11px); }
    100% { opacity: 0; transform: translateY(11px); }
}

.hero-img { animation: zoomIn 12s ease-in-out infinite alternate; }
.float-card { animation: floatY 6s ease-in-out infinite; }
.gold-pulse { animation: pulseGold 3s ease-in-out infinite; }

/* Glass card */
.glass-card {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255, 255, 255, 0.9);
}

/* Masonry */
.masonry { columns: 3 240px; column-gap: 1rem; }
@media (max-width: 900px) { .masonry { columns: 2 200px; } }
@media (max-width: 540px) { .masonry { columns: 1; } }
.masonry-item { break-inside: avoid; margin-bottom: 1rem; display: block; }

/* Hover states */
.mentor-card { transition: transform .35s ease, box-shadow .35s ease; }
.mentor-card:hover { transform: translateY(-8px); box-shadow: 0 28px 56px rgba(94, 58, 158, .13); }
.mentor-card:hover .mentor-photo { transform: scale(1.04); }
.mentor-photo { transition: transform .5s ease; }
.event-card:hover { transform: translateY(-4px); box-shadow: 0 20px 48px rgba(0, 0, 0, .09); }
.event-card { transition: transform .3s ease, box-shadow .3s ease; }
.gallery-img:hover { transform: scale(1.03); filter: brightness(0.97); }
.gallery-img { transition: transform .5s ease, filter .5s ease; }
.nav-link { position: relative; }
.nav-link::after { content: ''; position: absolute; bottom: -2px; left: 0; right: 0; height: 1px; background: #5E3A9E; transform: scaleX(0); transition: transform .25s ease; transform-origin: left; }
.nav-link:hover::after { transform: scaleX(1); }

/* Timeline vertical line */
.timeline-track { position: relative; }
.timeline-track::before { content: ''; position: absolute; left: 6px; top: 24px; bottom: 24px; width: 1px; background: linear-gradient(to bottom, transparent, rgba(94, 58, 158, .2), transparent); }

/* Scroll reveal (JS toggles .is-visible via IntersectionObserver) */
.fade-in {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .8s ease, transform .8s ease;
}
.fade-in.is-visible { opacity: 1; transform: translateY(0); }

/* Hero entrance animation (runs once on load, no JS needed) */
.hero-anim { animation: fadeUp .9s ease both; opacity: 0; }

/* Mobile nav overlay */
.mobile-nav {
    position: fixed; inset: 0; z-index: 40;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.75rem;
    background: #FAFAFA;
    opacity: 0; pointer-events: none; transform: translateY(-12px);
    transition: opacity .4s ease, transform .4s ease;
}
.mobile-nav.open { opacity: 1; pointer-events: auto; transform: none; }

/* Header */
#site-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 50;
    background: transparent; border-bottom: 1px solid transparent;
    transition: background .5s ease, backdrop-filter .5s ease, border-color .5s ease;
}
#site-header.scrolled {
    background: rgba(250, 250, 250, 0.94);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-color: rgba(0, 0, 0, 0.05);
}

/* Modal / lightbox */
.modal-overlay, .lightbox-overlay {
    position: fixed; inset: 0; z-index: 50;
    display: none; align-items: center; justify-content: center;
    padding: 1.5rem;
}
.modal-overlay.open, .lightbox-overlay.open { display: flex; }
.modal-overlay { background: rgba(20, 10, 40, 0.7); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.lightbox-overlay { background: rgba(10, 5, 25, 0.94); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }

img { max-width: 100%; }
button { cursor: pointer; font-family: inherit; }
a { text-decoration: none; }