/* Enhancements Layer: Professional UI, Animations, Theming */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

:root {
  --ec-gradient-hero: linear-gradient(135deg,#0c0032 0%,#3500d3 55%,#612bff 100%);
  --ec-gradient-accent: linear-gradient(135deg,#00f3b9 0%,#06d6a0 100%);
  --ec-card-bg: linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.58));
  --ec-blur: blur(14px) saturate(160%);
  --ec-radius-sm:6px;--ec-radius:14px;--ec-radius-lg:22px;--ec-radius-pill:999px;
  --ec-shadow-sm:0 4px 14px -4px rgba(0,0,0,.22);
  --ec-shadow-lg:0 25px 65px -25px rgba(0,0,0,.55),0 10px 28px -10px rgba(0,0,0,.35);
  --ec-text-dark:#141727;--ec-text-muted:#6c7389;
  --ec-surface-dark:#161b2b;--ec-surface-darker:#0d111d;
}
body { font-family:'Poppins',system-ui,sans-serif; color:var(--ec-text-dark); }
h1,h2,h3,h4 { font-weight:700; letter-spacing:-.5px; }
.hero-section { background:var(--ec-gradient-hero); position:relative; overflow:hidden; }
.hero-section .hero-heading { font-size:clamp(2.3rem,5vw,3.8rem); line-height:1.05; font-weight:700; background:linear-gradient(90deg,#fff,#f2f5ff 45%,#d6e2ff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-section .gradient-text { background:var(--ec-gradient-accent); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-badge { display:inline-flex; gap:.5rem; align-items:center; font-size:.7rem; letter-spacing:.15em; padding:.55rem .9rem; background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.15); border-radius:var(--ec-radius-pill); text-transform:uppercase; backdrop-filter:blur(6px) saturate(140%); margin-bottom:1rem; }
.feature-card,.event-card,.product-card,.blog-card,.testimonial-card,.counter-item { background:var(--ec-card-bg); backdrop-filter:var(--ec-blur); -webkit-backdrop-filter:var(--ec-blur); border:1px solid rgba(255,255,255,.45); border-radius:var(--ec-radius-lg); position:relative; transition:.6s cubic-bezier(.34,1.56,.51,1); }
.feature-card:hover,.event-card:hover,.product-card:hover,.blog-card:hover,.testimonial-card:hover { transform:translateY(-8px) scale(1.015); box-shadow:var(--ec-shadow-lg); }
.feature-card::after { content:""; position:absolute; inset:0; background:linear-gradient(150deg,rgba(0,243,185,0.18),transparent 60%); opacity:0; transition:opacity .6s; }
.feature-card:hover::after { opacity:1; }
.btn-primary { background:var(--ec-gradient-accent); border:0; color:#041018; font-weight:600; border-radius:var(--ec-radius-pill); position:relative; overflow:hidden; box-shadow:0 5px 20px -5px rgba(0,243,185,.55); }
.btn-primary::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg,rgba(255,255,255,.65),transparent 40%,transparent 60%,rgba(255,255,255,.4)); mix-blend-mode:overlay; opacity:0; transition:opacity .55s; }
.btn-primary:hover { transform:translateY(-4px); box-shadow:0 10px 38px -10px rgba(0,243,185,.65); }
.btn-primary:hover::after { opacity:1; }
.btn-outline-primary { border-radius:var(--ec-radius-pill); font-weight:600; }
.btn-outline-primary:hover { background:var(--ec-gradient-accent); color:#041018; }
.section-title { font-size:clamp(1.9rem,3.2vw,2.6rem); }
.counter-number[data-count] { position:relative; }
.counter-number[data-count]::after { content:""; position:absolute; left:0; bottom:-6px; height:3px; width:0; background:var(--ec-gradient-accent); border-radius:3px; transition:width 1s; }
.counter-number[data-animated="true"]::after { width:60%; }
.scroll-indicator { position:absolute; left:50%; bottom:12px; transform:translateX(-50%); width:26px; height:44px; border:2px solid rgba(255,255,255,.4); border-radius:20px; display:flex; justify-content:center; padding-top:6px; opacity:.75; }
.scroll-indicator span { width:6px; height:6px; background:var(--secondary-color,#00f3b9); border-radius:50%; animation:scrollDot 1.4s infinite; }
@keyframes scrollDot { 0%{transform:translateY(0);opacity:1;} 70%{transform:translateY(14px);opacity:0;} 100%{opacity:0;} }
.blog-card img,.product-card img,.event-card img { transition:transform 1.2s ease; }
.blog-card:hover img,.product-card:hover img,.event-card:hover img { transform:scale(1.08); }
.footer { background:radial-gradient(circle at 80% 10%,rgba(53,0,211,.4),transparent 60%),#0c0032; }
/* Dark theme removed per request */
.fade-in-up { opacity:0; transform:translateY(24px); transition:.8s cubic-bezier(.19,1,.22,1); }
.fade-in-up.is-visible { opacity:1; transform:translateY(0); }
@media (max-width: 768px) { .hero-section .hero-heading { font-size:clamp(2rem,8vw,2.8rem); } #themeToggle { width:38px; height:38px; } }

/* AOS fallback: if JS fails, ensure content is visible */
body.aos-disabled [data-aos] { opacity: 1 !important; transform: none !important; }
body.aos-disabled [data-aos][style] { opacity: 1 !important; transform: none !important; }
/* Progressive enhancement: if JS doesn't run, keep elements visible */
[data-aos]:not(.aos-init) { opacity: 1 !important; transform: none !important; }

/* Glass card variant for forms and panels */
.glass-card { 
  background: linear-gradient(180deg, rgba(255,255,255,0.75), rgba(255,255,255,0.55));
  backdrop-filter: var(--ec-blur);
  -webkit-backdrop-filter: var(--ec-blur);
  border: 1px solid rgba(255,255,255,0.45);
  border-radius: var(--ec-radius-lg);
}

/* Masonry gallery */
.masonry { column-count:4; column-gap:1rem; }
@media (max-width:1200px){ .masonry { column-count:3; } }
@media (max-width:992px){ .masonry { column-count:2; } }
@media (max-width:576px){ .masonry { column-count:1; } }
.masonry-item { break-inside:avoid; margin-bottom:1rem; position:relative; cursor:pointer; }
.photo-frame { background:var(--ec-card-bg); backdrop-filter:var(--ec-blur); -webkit-backdrop-filter:var(--ec-blur); border:1px solid rgba(255,255,255,.55); border-radius:16px; overflow:hidden; box-shadow:var(--ec-shadow-sm); transition:.6s cubic-bezier(.34,1.56,.51,1); }
.photo-frame:hover { transform:translateY(-6px); box-shadow:var(--ec-shadow-lg); }
.photo-frame .ratio-4x3 { position:relative; width:100%; padding-top:75%; }
.photo-frame .ratio-inner > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s ease; }
.photo-frame:hover .ratio-inner > img { transform:scale(1.06); }
/* Fancy overlay + caption */
.photo-frame::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%); opacity:0; transition:opacity .45s ease; border-radius:inherit; }
.masonry-item .caption { position:absolute; left:0; right:0; bottom:10px; color:#fff; padding:.6rem .9rem; font-size:.9rem; line-height:1.2; opacity:0; transform:translateY(10px); transition:.45s ease; display:flex; align-items:center; gap:.5rem; }
.masonry-item .caption i { font-size:.9rem; opacity:.9; }
.photo-frame:hover::before, .photo-frame:focus-within::before { opacity:1; }
.photo-frame:hover + .caption, .photo-frame:focus-within + .caption { opacity:1; transform:translateY(0); }

/* Lightbox */
#lightboxOverlay { position:fixed; inset:0; background:rgba(0,0,0,.75); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:.4s; z-index:1200; backdrop-filter:blur(4px); }
#lightboxOverlay.active { opacity:1; visibility:visible; }
#lightboxOverlay .lightbox-content { position:relative; max-width:80vw; max-height:80vh; }
#lightboxOverlay img { width:100%; height:auto; max-height:80vh; object-fit:contain; border-radius:12px; box-shadow:0 20px 60px -10px rgba(0,0,0,.6); }
.lightbox-close { position:absolute; top:-14px; right:-14px; width:38px; height:38px; border-radius:50%; border:none; background:linear-gradient(135deg,#ff416c,#ff4b2b); color:#fff; font-size:20px; line-height:1; cursor:pointer; box-shadow:0 6px 18px -4px rgba(0,0,0,.4); }
.lightbox-close:hover { transform:scale(1.05); }

/* Filter bar spacing */
.filter-bar { margin-bottom:1.5rem; }

/* Global responsive images */
img, picture, video, canvas { max-width:100%; height:auto; }
figure { margin:0; }

/* Sponsors: modern creative professional grid */
.sponsor-section { position: relative; }
.sponsor-section::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(60% 40% at 80% 10%, rgba(53,0,211,.18), transparent 70%);
}
.sponsor-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  align-items: stretch;
}
.sponsor-card {
  background: var(--ec-card-bg);
  backdrop-filter: var(--ec-blur);
  -webkit-backdrop-filter: var(--ec-blur);
  border: 1px solid rgba(255,255,255,.45);
  border-radius: var(--ec-radius-lg);
  box-shadow: var(--ec-shadow-sm);
  transition: .5s cubic-bezier(.34,1.56,.51,1);
  display: flex; align-items: center; justify-content: center;
  padding: 22px 18px;
}
.sponsor-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--ec-shadow-lg);
}
.sponsor-logo { width: 100%; display: grid; place-items: center; }
.sponsor-logo img {
  max-height: 80px; width: 100%; height: auto; object-fit: contain;
  filter: grayscale(100%) contrast(1.05) opacity(.9);
  transition: filter .45s ease, transform .5s ease;
}
.sponsor-card:hover .sponsor-logo img {
  filter: grayscale(0%) contrast(1) opacity(1);
  transform: scale(1.02);
}
@media (max-width: 576px) {
  .sponsor-logo img { max-height: 64px; }
}
@media (min-width: 992px) {
  .sponsor-logo img { max-height: 96px; }
}

/* Mobile marquee variant: horizontal auto-scroll experience */
@media (max-width: 576px) {
  .sponsor-grid.is-marquee {
    display: flex;
    gap: .75rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    padding-bottom: .25rem;
  }
  .sponsor-grid.is-marquee::-webkit-scrollbar { display: none; }
  .sponsor-grid.is-marquee .sponsor-card {
    flex: 0 0 72%;
    min-width: 220px;
    scroll-snap-align: center;
  }
  /* Optional gradient edges for nicer fade */
  .sponsor-section {
    position: relative;
  }
  .sponsor-section::after,
  .sponsor-section::before {
    content: ""; position: absolute; top: 0; bottom: 0; width: 18px; z-index: 1; pointer-events: none;
  }
  .sponsor-section::before { left: 0; background: linear-gradient(90deg, rgba(12,0,50,.22), transparent); }
  .sponsor-section::after { right: 0; background: linear-gradient(270deg, rgba(12,0,50,.22), transparent); }
}

/* Utility aspect ratio helpers */
.ratio-16x9 { position:relative; width:100%; padding-top:56.25%; }
.ratio-1x1 { position:relative; width:100%; padding-top:100%; }
.ratio-4x3 { position:relative; width:100%; padding-top:75%; }
.ratio-inner > img, .ratio-inner > .ratio-content, .ratio-16x9 > img, .ratio-1x1 > img, .ratio-4x3 > img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }

/* Modern video cards + Lite YouTube */
.video-card { background:var(--ec-card-bg); backdrop-filter:var(--ec-blur); border:1px solid rgba(255,255,255,.45); border-radius:16px; overflow:hidden; box-shadow:var(--ec-shadow-sm); transition:.5s cubic-bezier(.34,1.56,.51,1); }
.video-card:hover { transform:translateY(-6px); box-shadow:var(--ec-shadow-lg); }
.video-card h6 { padding:.75rem .75rem 1rem; margin:0; }

.yt-lite { position:relative; background-color:#000; cursor:pointer; border-radius:16px 16px 0 0; overflow:hidden; }
.yt-lite::before { content:""; display:block; padding-bottom:56.25%; background:#000; }
.yt-lite > .yt-thumbnail { position:absolute; inset:0; background-position:center; background-size:cover; filter:saturate(105%); transform:scale(1.02); transition:transform 1s ease; }
.yt-lite:hover > .yt-thumbnail { transform:scale(1.07); }
.yt-lite > .yt-play { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:68px; height:68px; border-radius:50%; border:none; display:grid; place-items:center; background:var(--ec-gradient-accent); color:#041018; box-shadow:0 12px 30px -10px rgba(0,243,185,.6); }
.yt-lite > .yt-play::before { content:"\25BA"; font-size:28px; margin-left:4px; }
.yt-lite.activated::before, .yt-lite.activated > .yt-thumbnail, .yt-lite.activated > .yt-play { display:none; }

/* Constrain logo images inside nav/footer */
.navbar-brand img { height:28px; width:auto; }
footer .navbar-brand img { height:40px; width:auto; }

/* Responsive tables (future-proof) */
.table-responsive { overflow-x:auto; }


/* Accessible skip link */
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { left:16px; top:16px; width:auto; height:auto; padding:.6rem 1rem; background:#000; color:#fff; z-index:1100; border-radius:8px; box-shadow:0 8px 20px -8px rgba(0,0,0,.5); }


/* Homepage: About image sizing and responsiveness */
#about .about-image {
  display:block;
  width:85%;
  max-width:420px;
  margin-left:auto;
  margin-right:auto;
}
@media (min-width: 992px) { /* lg+ */
  #about .about-image { width:80%; max-width:440px; }
}
@media (min-width: 1200px) { /* xl+ */
  #about .about-image { width:75%; max-width:480px; }
}
@media (max-width: 576px) { /* xs */
  #about .about-image { width:70%; max-width:360px; }
}

/* Modern card polish + consistent media ratios */
.event-card .card-img-top,
.product-card .card-img-top,
.blog-card .card-img-top,
.card.border-0 .card-img-top { aspect-ratio: 16/9; object-fit: cover; }

.event-card .card-body,
.product-card .card-body,
.blog-card .card-body { padding: 1rem 1.1rem 1.25rem; }

.event-card .card-title,
.product-card .card-title,
.blog-card .card-title { font-size: 1.05rem; font-weight: 700; letter-spacing: -.2px; }

/* Subtle hover lift for all cards on touch-friendly range */
@media (hover: hover) {
  .card.border-0.shadow-sm:hover,
  .event-card:hover,
  .product-card:hover,
  .blog-card:hover { transform: translateY(-8px) scale(1.01); }
}

/* Better small-screen spacing for grids */
@media (max-width: 576px) {
  .row.g-4 > [class*="col-"] { padding-left: .6rem; padding-right: .6rem; }
  .row.g-4 { --bs-gutter-x: 1rem; --bs-gutter-y: 1.1rem; }
}