/* =============================================================
   highlights.css — post-event Highlights pages (per year)
   ============================================================= */

.hl-hero { background: linear-gradient(160deg,#052a1c,#094e33 55%,#0c6441); color:#fff; }

.hl-stat { text-align:center; }
.hl-stat .n { font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(2.4rem,6vw,3.6rem); line-height:1; }

.gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
@media (min-width:640px){ .gallery { grid-template-columns:repeat(3,1fr); } }
.gallery .shot { aspect-ratio: 4/3; border-radius:14px; }

.video-ph { aspect-ratio:16/9; border-radius:18px; }

/* =============================================================
   Sponsor logo marquee (auto-scroll, pause on hover)
   ============================================================= */
.logo-marquee {
  position: relative; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.logo-track { display:flex; align-items:center; gap:1.1rem; width:max-content; animation: logo-scroll 70s linear infinite; }
.logo-marquee:hover .logo-track { animation-play-state: paused; }
@keyframes logo-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.logo-cell {
  flex:0 0 auto; width:180px; height:120px; background:#fff;
  border:1px solid var(--grey-200); border-radius:14px;
  display:flex; align-items:center; justify-content:center; padding:18px;
  box-shadow: 0 6px 18px -12px rgba(27,31,29,.35);
}
.logo-cell img { max-width:100%; max-height:100%; object-fit:contain; }
@media (prefers-reduced-motion: reduce){ .logo-track { animation:none; } .logo-marquee { overflow-x:auto; } }

/* =============================================================
   "Access the agenda + recordings" banner
   ============================================================= */
.agenda-access {
  background: linear-gradient(120deg, #e7f2ec, #f2f4f3);
  border: 1px solid #bfe0cb; border-radius: 20px;
}

/* Gallery real images */
.gallery a.shot { display:block; overflow:hidden; }
.gallery a.shot img { width:100%; height:100%; object-fit:cover; display:block; transition: transform .4s ease; }
.gallery a.shot:hover img { transform: scale(1.06); }


/* Stats — animated (count-up + male/female split bar) */
.stat-ico { width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:var(--entre-green-50); color:var(--entre-green-dark); margin:0 auto .8rem; }
.stat-reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.stat-reveal.in { opacity:1; transform:none; }
.mf-bar { display:flex; height:14px; border-radius:9999px; overflow:hidden; background:var(--grey-200); }
.mf-bar .mf-male, .mf-bar .mf-female { width:0; transition:width 1.1s cubic-bezier(.2,.7,.2,1) .15s; }
.mf-bar .mf-male { background:linear-gradient(90deg,#198bc6,#28a4d6); }
.mf-bar .mf-female { background:linear-gradient(90deg,#ff914d,#ff6f9c); }
.mf-bar.in .mf-male { width:var(--w); }
.mf-bar.in .mf-female { width:var(--w); }
.mf-dot { width:9px; height:9px; border-radius:9999px; display:inline-block; }
.mf-dot-m { background:#198bc6; } .mf-dot-f { background:#ff6f9c; }
@media (prefers-reduced-motion: reduce){
  .stat-reveal{ opacity:1; transform:none; }
  .mf-bar .mf-male, .mf-bar .mf-female { transition:none; }
}