@font-face{font-family:'Toxigenesis';src:url('../assets/fonts/toxigenesis-bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}

@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamThin.otf') format('opentype');font-weight:100;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamThinItalic.otf') format('opentype');font-weight:100;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamExtraLight.otf') format('opentype');font-weight:200;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamExtraLightItalic.otf') format('opentype');font-weight:200;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamLight.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamLightItalic.otf') format('opentype');font-weight:300;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBook.otf') format('opentype');font-weight:350;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBookItalic.otf') format('opentype');font-weight:350;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamRegular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamRegularItalic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamSemiBold.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamSemiBoldItalic.otf') format('opentype');font-weight:600;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBoldItalic.otf') format('opentype');font-weight:700;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamHeavy.otf') format('opentype');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamHeavyItalic.otf') format('opentype');font-weight:800;font-style:italic;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBlack.otf') format('opentype');font-weight:900;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilam';src:url('../assets/fonts/gilam/GilamBlackItalic.otf') format('opentype');font-weight:900;font-style:italic;font-display:swap;}

:root{
  --bg:#000000;
  --bg-alt:#0a0a0a;
  --surface-1:#141414;
  --surface-2:#1f1f1f;
  --text:#f5f7fa;
  --text-1:rgba(245,247,250,0.78);
  --text-2:rgba(245,247,250,0.65);
  --text-3:rgba(245,247,250,0.5);
  --border-1:rgba(255,255,255,0.08);
  --border-2:rgba(255,255,255,0.15);
  --border-3:rgba(255,255,255,0.25);
  --border-4:rgba(255,255,255,0.4);
  --nav-glass:rgba(0,0,0,0.72);
  --hero-bg:
    radial-gradient(circle at 18% 15%, rgba(16,119,250,0.22), transparent 40%),
    radial-gradient(circle at 82% 78%, rgba(254,174,27,0.16), transparent 45%),
    linear-gradient(180deg,#0a0a0a 0%, #000000 60%, #000000 100%);
  --countdown-bg:
    linear-gradient(180deg, rgba(20,20,20,0.5), rgba(0,0,0,1)),
    repeating-linear-gradient(-45deg, rgba(16,119,250,0.06) 0 18px, transparent 18px 36px);
  --sheen-color:rgba(255,255,255,0.18);
  --yellow:#feae1b;
  --yellow-dim:#d89412;
  --blue:#1077fa;
  --blue-dim:#0a5dc4;
  --silver:#a7a9ac;
  --paper:#f5f7fa;
  --ink:#000000;
  --max:1180px;
}
:root[data-theme="light"]{
  --bg:#ffffff;
  --bg-alt:#f3f4f6;
  --surface-1:#ffffff;
  --surface-2:#eef0f3;
  --text:#0a0a0a;
  --text-1:rgba(10,10,15,0.75);
  --text-2:rgba(10,10,15,0.62);
  --text-3:rgba(10,10,15,0.48);
  --border-1:rgba(0,0,0,0.08);
  --border-2:rgba(0,0,0,0.12);
  --border-3:rgba(0,0,0,0.18);
  --border-4:rgba(0,0,0,0.28);
  --nav-glass:rgba(255,255,255,0.72);
  --hero-bg:
    radial-gradient(circle at 18% 15%, rgba(16,119,250,0.12), transparent 40%),
    radial-gradient(circle at 82% 78%, rgba(254,174,27,0.14), transparent 45%),
    linear-gradient(180deg,#ffffff 0%, #f4f5f7 60%, #eef0f3 100%);
  --countdown-bg:
    linear-gradient(180deg, rgba(255,255,255,0.6), rgba(238,240,243,1)),
    repeating-linear-gradient(-45deg, rgba(16,119,250,0.05) 0 18px, transparent 18px 36px);
  --sheen-color:rgba(0,0,0,0.07);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#ffffff;
    --bg-alt:#f3f4f6;
    --surface-1:#ffffff;
    --surface-2:#eef0f3;
    --text:#0a0a0a;
    --text-1:rgba(10,10,15,0.75);
    --text-2:rgba(10,10,15,0.62);
    --text-3:rgba(10,10,15,0.48);
    --border-1:rgba(0,0,0,0.08);
    --border-2:rgba(0,0,0,0.12);
    --border-3:rgba(0,0,0,0.18);
    --border-4:rgba(0,0,0,0.28);
    --nav-glass:rgba(255,255,255,0.72);
    --hero-bg:
      radial-gradient(circle at 18% 15%, rgba(16,119,250,0.12), transparent 40%),
      radial-gradient(circle at 82% 78%, rgba(254,174,27,0.14), transparent 45%),
      linear-gradient(180deg,#ffffff 0%, #f4f5f7 60%, #eef0f3 100%);
    --countdown-bg:
      linear-gradient(180deg, rgba(255,255,255,0.6), rgba(238,240,243,1)),
      repeating-linear-gradient(-45deg, rgba(16,119,250,0.05) 0 18px, transparent 18px 36px);
    --sheen-color:rgba(0,0,0,0.07);
  }
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;color-scheme:dark;}
html[data-theme="light"]{color-scheme:light;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Gilam',sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  transition:background .25s ease, color .25s ease;
}
h1,h2,h3,.display{
  font-family:'Toxigenesis',sans-serif;
  line-height:1.05;
  margin:0;
  letter-spacing:0.5px;
}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px;}
::selection{background:var(--yellow);color:var(--ink);}

/* focus visibility */
a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:3px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}
}

/* ---------- NAV ---------- */
header.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  border-bottom:1px solid var(--border-1);
}
header.nav::before{
  content:'';position:absolute;inset:0;z-index:-1;
  background:var(--nav-glass);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.nav-inner{
  max-width:var(--max);margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.nav-actions{display:flex;align-items:center;gap:14px;}
.logo-mark{display:flex;align-items:center;gap:10px;}
.logo-mark img{height:28px;width:auto;}
nav.links{display:flex;gap:18px;align-items:center;}
nav.links a{font-size:13px;font-weight:600;color:var(--text);opacity:0.85;transition:opacity .2s, color .2s;white-space:nowrap;}
nav.links a:hover{opacity:1;color:var(--yellow);}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 26px;border-radius:8px;font-weight:700;font-size:14px;
  border:2px solid transparent;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease;
  font-family:'Gilam',sans-serif;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--yellow);color:var(--ink);box-shadow:0 0 0 0 rgba(254,174,27,0.5);}
.btn-primary:hover{box-shadow:4px 4px 0 var(--blue);transform:translate(-2px,-2px);}
.btn-outline{background:transparent;border-color:var(--border-4);color:var(--text);}
.btn-outline:hover{border-color:var(--blue);color:var(--blue);}
.btn-outline-blue{background:transparent;border-color:var(--blue);color:var(--blue);}
.btn-outline-blue:hover{background:rgba(16,119,250,0.1);box-shadow:4px 4px 0 var(--blue);transform:translate(-2px,-2px);}
.btn-outline-yellow{background:transparent;border-color:var(--yellow);color:var(--yellow);}
.btn-outline-yellow:hover{background:rgba(254,174,27,0.1);box-shadow:4px 4px 0 var(--yellow);transform:translate(-2px,-2px);}
.btn-sm{padding:9px 18px;font-size:12.5px;border-radius:7px;}
.btn-arrow{display:inline-block;transition:transform .2s ease;}
.btn:hover .btn-arrow{transform:translateX(4px);}
.btn.is-closed{background:transparent;border-color:var(--border-4);color:var(--text);opacity:0.6;cursor:not-allowed;pointer-events:none;}
.btn.is-closed:hover{box-shadow:none;transform:none;}
a.is-closed{opacity:0.6;cursor:not-allowed;pointer-events:none;}
.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  background:none;border:1.5px solid var(--border-3);color:var(--text);
  cursor:pointer;transition:border-color .2s ease, color .2s ease;
}
.theme-toggle:hover{border-color:var(--blue);color:var(--blue);}
.theme-toggle svg{width:17px;height:17px;}
.theme-toggle .icon-sun{display:none;}
:root[data-theme="light"] .theme-toggle .icon-moon{display:none;}
:root[data-theme="light"] .theme-toggle .icon-sun{display:block;}
.nav-cta{display:none;}
@media(min-width:860px){.nav-cta{display:inline-flex;}}
.nav-links-cta{display:inline-flex;margin-top:10px;}
@media(min-width:860px){.nav-links-cta{display:none;}}
.burger{display:flex;background:none;border:none;color:var(--text);font-size:26px;cursor:pointer;padding:4px;}
@media(min-width:860px){.burger{display:none;}nav.links{display:flex;}}
@media(max-width:859px){
  nav.links{
    position:fixed;top:60px;left:0;right:0;bottom:0;
    background:var(--bg-alt);flex-direction:column;justify-content:flex-start;
    padding:36px 24px;gap:22px;transform:translateX(100%);transition:transform .3s ease;
  }
  nav.links.open{transform:translateX(0);}
  nav.links a{font-size:20px;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  background:var(--hero-bg);
  overflow:hidden;
}
/* Hero height comes from the banner image's own aspect ratio (not a
   fixed viewport height) so it always displays whole - no crop, no
   letterboxing. It's fine if this leaves the hero shorter than the
   viewport on some screens; the next section can peek in below it.
   Width is capped on very wide monitors (letterboxed by .hero's own
   background on the sides) so the hero doesn't grow so tall that the
   CTA buttons at its bottom get pushed below the first view. */
.hero-banner{position:relative;width:100%;max-width:1600px;margin:0 auto;line-height:0;}
.hero-banner > picture{display:block;width:100%;}
.hero-banner > picture img{display:block;width:100%;height:auto;aspect-ratio:2400/1350;}
@media(orientation:portrait){
  .hero-banner > picture img{aspect-ratio:1200/1500;}
  /* Portrait hero image has its own logo baked in near the top; without this
     gap the fixed, translucent nav sits directly over it and the small nav
     logo ghosts on top of the large image logo. */
  .hero{padding-top:70px;}
}
.hero-banner-ctas{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  display:flex;justify-content:center;gap:clamp(12px,2vw,20px);flex-wrap:wrap;
  padding:15% 24px 6%;
  background:linear-gradient(to top, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.45) 45%, transparent 100%);
}
.hero-banner-ctas .btn{
  padding:clamp(13px,1.8vw,18px) clamp(26px,4vw,40px);
  font-size:clamp(14px,1.8vw,17px);
  text-transform:uppercase;letter-spacing:0.4px;
}
@media(max-width:640px){
  /* Below this width the three CTAs no longer fit on one row and wrap
     individually - give them a shared width (not full-bleed) and taller
     padding so they read as one consistent button group. */
  .hero-banner-ctas{flex-direction:column;align-items:center;}
  .hero-banner-ctas .btn{width:82%;max-width:320px;padding:17px 24px;}
}
.hero-ctas{display:flex;justify-content:center;gap:16px;margin-top:38px;flex-wrap:wrap;}

/* ---------- RIYADH PREVIEW EVENT (temporary one-pager) ---------- */
/* Logo/tagline/dates overlay real event photography (16_9-Hero-Riyadh.jpg /
   4_5-Hero-Riyadh-Mobile.jpg) - same aspect-ratio-driven .hero/.hero-banner
   pattern as the Doha site, so the photo is never cropped. */
.hero-bg-video{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.2s ease;
}
.hero-bg-video.is-ready{opacity:1;}
.hero-scrim{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 65% 60% at 50% 42%, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.35) 55%, rgba(0,0,0,0.08) 100%);
}
.riyadh-hero-content{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:0 24px 10%;
}
.riyadh-hero-logo{width:clamp(190px,26vw,360px);height:auto;margin-bottom:clamp(12px,2vw,20px);filter:drop-shadow(0 4px 22px rgba(0,0,0,0.6));}
.riyadh-hero-tagline{
  font-family:'JetBrains Mono',monospace;font-size:clamp(11px,1.5vw,15px);
  letter-spacing:4px;text-transform:uppercase;font-weight:700;color:#12151c;
  background:rgba(255,255,255,0.82);padding:14px 26px;border-radius:999px;
  box-shadow:0 4px 16px rgba(0,0,0,0.35);
}
.riyadh-hero-dates{margin-top:clamp(12px,2.2vw,20px);display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1;filter:drop-shadow(0 3px 10px rgba(0,0,0,0.55));}
.riyadh-hero-dates-days{font-family:'Toxigenesis',sans-serif;font-size:clamp(30px,5.8vw,54px);color:#feae1b;-webkit-text-stroke:2px #000;paint-order:stroke fill;}
.riyadh-hero-dates-days sup{font-size:0.5em;}
.riyadh-hero-dates-month{font-family:'Toxigenesis',sans-serif;font-size:clamp(24px,4.6vw,44px);color:#1077fa;-webkit-text-stroke:1.5px #fff;paint-order:stroke fill;}
.riyadh-hero-dates-year{font-family:'Toxigenesis',sans-serif;font-size:clamp(20px,4vw,38px);color:#fff;-webkit-text-stroke:2px #000;paint-order:stroke fill;}
.riyadh-hero-sub{
  margin-top:clamp(16px,2.6vw,24px);font-family:'Toxigenesis',sans-serif;
  font-size:clamp(17px,2.2vw,24px);color:#fff;text-shadow:0 2px 10px rgba(0,0,0,0.7);
}
.riyadh-hero-location{
  margin-top:6px;font-family:'Gilam',sans-serif;font-size:clamp(12.5px,1.6vw,15px);
  color:rgba(255,255,255,0.85);text-shadow:0 2px 8px rgba(0,0,0,0.7);
}
.riyadh-hero-schedule{margin-top:clamp(10px,1.8vw,16px);display:flex;flex-wrap:wrap;justify-content:center;gap:8px;}
.riyadh-hero-schedule span{
  font-family:'JetBrains Mono',monospace;font-size:clamp(11px,1.4vw,13px);
  letter-spacing:0.3px;font-weight:700;color:#12151c;
  background:rgba(255,255,255,0.82);padding:8px 16px;border-radius:999px;
  box-shadow:0 4px 16px rgba(0,0,0,0.35);white-space:nowrap;
}
.coming-soon-badge{
  margin-top:clamp(12px,2.2vw,20px);font-family:'Toxigenesis',sans-serif;
  font-size:clamp(30px,5.8vw,54px);color:#feae1b;-webkit-text-stroke:2px #000;paint-order:stroke fill;
}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- SECTION HEADERS (banner style) ---------- */
.section{padding:100px 0;position:relative;}
.section-alt{background:var(--bg-alt);}
/* Sponsors sits directly under "At a Glance" as a continuation, not a
   full new section - tighten the gap between them on both sides. */
#about{padding-bottom:40px;}
#sponsors{padding-top:40px;}
@media(max-width:640px){
  .section{padding:50px 0;}
  #about{padding-bottom:20px;}
  #sponsors{padding-top:20px;}
}
.section-title{
  font-size:clamp(30px,5vw,52px);
  color:var(--text);
  margin-bottom:16px;
}
.section-title .hl{color:var(--blue);}
.section-lead{max-width:640px;color:var(--text-1);font-size:17px;line-height:1.7;}
.head-block{margin-bottom:56px;}

/* ---------- QUICK EVENT INFO ---------- */
.quick-info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
@media(min-width:680px){.quick-info-grid{grid-template-columns:repeat(3,1fr);}}
@media(min-width:960px){.quick-info-grid{grid-template-columns:repeat(5,1fr);}}
.quick-info{
  background:var(--surface-1);border:1px solid var(--border-1);
  border-radius:14px;padding:22px 16px;text-align:center;
}
.quick-info .heading{font-family:'Toxigenesis',sans-serif;font-size:16px;color:var(--yellow);line-height:1.25;}
.quick-info .sub{font-size:11.5px;color:var(--text-2);margin-top:8px;letter-spacing:0.3px;line-height:1.4;}

/* ---------- FOIL CARDS (signature element) ---------- */
.card-grid{display:grid;grid-template-columns:1fr;gap:26px;}
@media(min-width:680px){.card-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:1000px){.card-grid{grid-template-columns:repeat(3,1fr);}}
.foil-card{
  position:relative;
  border-radius:18px;
  padding:2px;
  background:linear-gradient(135deg, var(--blue), var(--yellow), var(--blue));
  background-size:220% 220%;
  cursor:pointer;
  transition:transform .35s ease;
}
.foil-card:hover{transform:translateY(-6px) rotate(-0.5deg);}
.foil-card .foil-inner{
  background:var(--surface-1);
  border-radius:16px;
  padding:30px 26px;
  height:100%;
  position:relative;
  overflow:hidden;
}
.foil-card .sheen{
  position:absolute;inset:-40%;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%), var(--sheen-color), transparent 45%);
  pointer-events:none;
  transition:opacity .3s ease;
  opacity:0;
}
.foil-card:hover .sheen{opacity:1;}
.foil-card .card-no{
  font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--blue);letter-spacing:1.5px;
  position:absolute;top:18px;right:20px;
}
.card-icon{width:52px;height:52px;margin-bottom:20px;}
.foil-card h3{font-family:'Toxigenesis',sans-serif;font-size:20px;color:var(--text);margin-bottom:10px;}
.foil-card p{font-size:14.5px;color:var(--text-1);line-height:1.6;margin:0;}

/* ---------- COMMUNITY / AUDIENCE ---------- */
.audience-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;}
.foil-card-sm{
  border-radius:14px;
  flex:0 1 calc(50% - 9px);max-width:220px;
}
@media(min-width:560px){.foil-card-sm{flex-basis:calc(33.333% - 12px);}}
@media(min-width:900px){.foil-card-sm{flex-basis:calc(25% - 13.5px);}}
.foil-card-sm .foil-inner{
  border-radius:12px;padding:24px 18px;height:100%;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;
}
.foil-card-sm .audience-ic{font-size:30px;}
.foil-card-sm h3{font-family:'Gilam',sans-serif;font-weight:700;font-size:15px;margin:0;color:var(--text);}
.foil-card-sm p{font-size:12.5px;color:var(--text-2);line-height:1.5;margin:0;}
.community-ctas{display:flex;justify-content:center;gap:16px;margin-top:40px;flex-wrap:wrap;}

.approved-vendors{margin-top:44px;}
.vendor-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:32px 28px;}
.vendor-logo-card{display:flex;flex-direction:column;align-items:center;gap:10px;width:200px;}
.vendor-logo-card .logo-box{
  background:#fff;border-radius:12px;padding:16px;
  display:flex;align-items:center;justify-content:center;
  width:200px;height:110px;box-sizing:border-box;
}
.vendor-logo-card .logo-box img{max-height:78px;max-width:168px;width:auto;height:auto;object-fit:contain;display:block;}
.vendor-logo-card .vendor-name{font-size:13px;font-weight:600;color:var(--text-1);text-align:center;line-height:1.35;}

/* ---------- SOCIAL ---------- */
.social-ic{width:34px;height:34px;color:var(--blue);}

/* ---------- SPONSORSHIP / PARTNERS ---------- */
.sponsor-logos{display:flex;flex-wrap:wrap;gap:14px;}
.sponsor-logo-slot{
  width:120px;height:56px;border-radius:10px;
  border:1.5px dashed var(--border-3);
  display:flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:1px;
  color:var(--text-3);
  padding:6px;
  flex-shrink:0;
}
.sponsor-logo-slot:has(img){
  width:auto;min-width:96px;height:60px;padding:9px 16px;
  border:none;background:var(--paper);
  box-shadow:0 3px 0 var(--yellow), 4px 7px 14px rgba(0,0,0,0.45);
}
.sponsor-logo-slot img{max-width:150px;max-height:100%;width:auto;height:100%;object-fit:contain;}

/* Auto-scrolling logo strip, split into two shorter rows (rather than one
   long one) so the full sponsor set stays close to fully visible even
   while scrolling, per row. With only 3 unique logos per row, 2x
   duplication isn't always wider than the viewport (a wide screen could
   run out of track before the loop point, showing genuine blank space) -
   so each track repeats its logos 4x and animates by exactly 1/4 of its
   own width (always exactly one unique-set-width, so speed is unaffected
   by the duplication count) for a comfortable width buffer. Rows 1/2
   scroll in opposite directions. Edges fade via mask so logos don't
   appear to clip abruptly. As more sponsors are added, keep the two rows
   roughly balanced in count. */
.sponsor-marquee-rows{display:flex;flex-direction:column;gap:22px;}
.sponsor-marquee{
  overflow:hidden;width:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.sponsor-marquee-track{
  display:flex;align-items:center;gap:32px;width:max-content;
  will-change:transform;
  animation:sponsor-marquee-scroll 10s linear infinite;
}
.sponsor-marquee-track--x4{animation-name:sponsor-marquee-scroll-x4;}
.sponsor-marquee--reverse .sponsor-marquee-track{animation-direction:reverse;}
.sponsor-marquee .sponsor-logo-slot:has(img){height:104px;padding:18px 32px;}
.sponsor-marquee .sponsor-logo-slot img{max-width:200px;}
@keyframes sponsor-marquee-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes sponsor-marquee-scroll-x4{from{transform:translateX(0);}to{transform:translateX(-25%);}}
.sponsor-cta{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  text-align:center;margin-top:38px;
}
.sponsor-cta span{font-size:14px;color:var(--text-2);}
@media (prefers-reduced-motion: reduce){.sponsor-marquee-track{animation:none;}}
.vendor-partner-grid{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:44px;}
@media(min-width:760px){.vendor-partner-grid{grid-template-columns:1fr 1fr;}}
.vp-card{
  position:relative;border-radius:20px;overflow:hidden;
  aspect-ratio:4/3;display:flex;align-items:flex-end;isolation:isolate;
}
@media(min-width:760px){.vp-card{aspect-ratio:11/9;}}
.vp-card-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.vp-card::after{
  content:'';position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 28%, rgba(0,0,0,0.6) 60%, rgba(0,0,0,0.94) 100%);
}
.vp-card-body{position:relative;z-index:1;padding:30px;width:100%;}
.vp-card-eyebrow{
  font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--yellow);margin:0 0 10px;
}
.vp-card-body h3{font-family:'Toxigenesis',sans-serif;font-size:26px;color:#fff;margin:0 0 12px;}
.vp-card-body p:not(.vp-card-eyebrow){font-size:15px;color:rgba(255,255,255,0.82);line-height:1.6;margin:0 0 24px;max-width:420px;}
.vp-card-ctas{display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- PREVIOUS EVENTS (recap card) ---------- */
.recap-card{
  display:flex;flex-wrap:wrap;gap:32px;align-items:center;
  background:var(--surface-2);border:1px solid var(--border-2);border-radius:18px;
  padding:28px;overflow:hidden;
}
.recap-media{flex:1 1 320px;min-width:280px;border-radius:12px;overflow:hidden;}
.recap-media img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:16/9;}
.recap-body{flex:1 1 320px;min-width:280px;}
.recap-body h3{font-family:'Toxigenesis',sans-serif;font-size:22px;color:var(--text);margin:0 0 6px;}
.recap-meta{font-size:13.5px;color:var(--text-2);margin:0 0 14px;}
.recap-summary{font-size:15px;color:var(--text-1);line-height:1.6;margin:0 0 22px;}
.recap-ctas{display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- HIGHLIGHT VIDEOS (lazy - click to load/play) ---------- */
.video-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;}
.video-tile{
  position:relative;flex:1 1 320px;max-width:460px;aspect-ratio:16/9;
  background:var(--surface-2);border:1px solid var(--border-2);border-radius:14px;
  overflow:hidden;
}
.video-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#000;}
.video-play-btn{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
  width:60px;height:60px;border-radius:50%;border:none;background:var(--yellow);color:var(--ink);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease;
}
.video-tile:hover .video-play-btn{transform:translate(-50%,-50%) scale(1.08);}
.video-play-btn svg{width:26px;height:26px;}
.video-tile-label{position:absolute;bottom:14px;left:14px;z-index:2;font-size:13px;font-weight:700;color:var(--text);background:rgba(0,0,0,0.55);padding:6px 12px;border-radius:999px;}
.video-tile.is-playing .video-play-btn,
.video-tile.is-playing .video-tile-label{display:none;}
.video-tile.is-playing .video-thumb{pointer-events:auto;}

/* ---------- TICKET PRICE LIST (informational - Platinumlist handles actual sales) ---------- */
.ticket-price-note{font-size:12.5px;color:var(--text-2);margin:0 0 20px;}

/* ---------- PAST EVENT BANNER ---------- */
.past-event-banner{
  background:var(--yellow);color:var(--ink);text-align:center;
  font-family:'Gilam',sans-serif;font-weight:700;font-size:13.5px;
  padding:10px 20px;
}

/* ---------- GALLERY ---------- */
.gallery-wrap{position:relative;}
@media(min-width:680px){.gallery-wrap{padding:0 64px;}}
.gallery-track{
  display:flex;gap:18px;
  overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding:2px 2px 10px;
}
.gallery-track::-webkit-scrollbar{display:none;}
.gallery-tile{
  position:relative;overflow:hidden;flex:0 0 auto;cursor:pointer;
  scroll-snap-align:start;
  width:82vw;max-width:340px;aspect-ratio:1/1;border-radius:14px;
  border:1px solid rgba(16,119,250,0.25);
  transition:transform .25s ease, border-color .25s ease;
}
.gallery-tile:hover{transform:translateY(-4px);border-color:var(--blue);}
@media(min-width:560px){.gallery-tile{width:42vw;max-width:340px;}}
@media(min-width:900px){.gallery-tile{width:27vw;max-width:340px;}}
.gallery-tile img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.gallery-tile span{
  position:absolute;left:12px;bottom:12px;z-index:1;
  background:rgba(0,0,0,0.75);
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.5px;
  color:#f5f7fa;padding:6px 12px;border-radius:999px;
}
.gallery-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;
  background:var(--surface-1);border:2px solid var(--blue);color:var(--blue);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:2;box-shadow:0 4px 14px rgba(0,0,0,0.45);
  transition:background .2s ease, color .2s ease;
}
.gallery-arrow svg{width:20px;height:20px;}
.gallery-arrow:hover{background:var(--blue);color:var(--ink);}
.gallery-arrow-prev{left:8px;}
.gallery-arrow-next{right:8px;}
@media(max-width:679px){.gallery-arrow{display:none;}}
.gallery-social{display:flex;justify-content:center;gap:14px;margin-top:40px;}

/* ---------- LIGHTBOX (always dark, image-viewer convention independent of site theme) ---------- */
.lightbox{
  display:none;position:fixed;inset:0;z-index:300;
  align-items:center;justify-content:center;
  background:rgba(0,0,0,0.92);
  padding:60px 24px;
}
.lightbox.open{display:flex;}
.lightbox img{
  max-width:100%;max-height:100%;border-radius:12px;
  box-shadow:0 20px 60px rgba(0,0,0,0.6);
}
.lightbox-close{
  position:absolute;top:20px;right:20px;
  width:44px;height:44px;border-radius:50%;
  background:#141414;border:2px solid var(--blue);color:#f5f7fa;
  font-size:20px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.lightbox-close:hover{background:var(--blue);color:var(--ink);}

/* ---------- COUNTDOWN ---------- */
.countdown-section{
  background:var(--countdown-bg);
  text-align:center;
}
.countdown-grid{
  display:flex;justify-content:center;gap:6px;flex-wrap:nowrap;margin-top:44px;
}
.count-box{
  width:62px;background:var(--surface-1);border:2px solid var(--yellow);border-radius:14px;
  padding:8px 2px;
}
.count-box .num{font-family:'Toxigenesis',sans-serif;font-size:21px;color:var(--yellow);}
.count-box .lbl{font-family:'JetBrains Mono',monospace;font-size:7.5px;color:var(--text-2);letter-spacing:0.8px;margin-top:4px;}
@media(min-width:420px){
  .countdown-grid{gap:14px;}
  .count-box{width:90px;padding:14px 6px;}
  .count-box .num{font-size:32px;}
  .count-box .lbl{font-size:10px;letter-spacing:1.3px;}
}
@media(min-width:560px){
  .countdown-grid{gap:18px;}
  .count-box{width:110px;padding:18px 8px;}
  .count-box .num{font-size:38px;}
  .count-box .lbl{font-size:11px;letter-spacing:1.5px;}
}

/* ---------- VENUE ---------- */
.venue-grid{display:grid;grid-template-columns:1fr;gap:40px;}
@media(min-width:900px){.venue-grid{grid-template-columns:1fr 1fr;}}
.venue-card{
  background:var(--surface-1);border-radius:20px;padding:36px;
  border:1px solid var(--border-1);
}
.venue-map{
  border-radius:20px;overflow:hidden;border:2px solid var(--blue);
  aspect-ratio:4/3;position:relative;
  background:linear-gradient(160deg, var(--surface-2), var(--bg));
}
.info-row{display:flex;gap:14px;margin-bottom:22px;align-items:flex-start;}
.info-row .ic{color:var(--yellow);flex-shrink:0;margin-top:2px;}
.info-row h4{margin:0 0 4px;font-size:15px;font-weight:700;color:var(--text);}
.info-row p{margin:0;font-size:14px;color:var(--text-2);line-height:1.6;}
.info-row .venue-schedule{margin-top:8px;font-size:13.5px;}
.venue-schedule strong{color:var(--text);}
.venue-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;}

/* ---------- FORMS (vendor application, etc.) ---------- */
.vendor-form{max-width:720px;margin:56px auto 0;text-align:left;}
.form-group{margin-bottom:30px;}
.form-group > label{display:block;font-weight:700;font-size:14px;margin-bottom:10px;color:var(--text);}
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="tel"],
.form-group input[type="url"],
.form-group input[type="number"],
.form-group textarea{
  width:100%;padding:14px 16px;border-radius:8px;border:2px solid var(--border-2);
  background:var(--surface-1);color:var(--text);font-family:'Gilam',sans-serif;font-size:15px;
}
.form-group textarea{min-height:110px;resize:vertical;font-family:'Gilam',sans-serif;}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--blue);}
.form-group .hint{font-size:12.5px;color:var(--text-2);margin-top:8px;line-height:1.5;}
.form-group .form-error{font-size:12.5px;color:var(--yellow);margin-top:8px;display:none;}
.form-group.invalid .form-error{display:block;}
.form-group.invalid input[type="text"],
.form-group.invalid input[type="email"],
.form-group.invalid input[type="tel"],
.form-group.invalid input[type="url"],
.form-group.invalid input[type="number"],
.form-group.invalid textarea,
.form-group.invalid .file-drop{border-color:var(--yellow);}

.package-tier-grid{display:grid;grid-template-columns:1fr;gap:14px;}
@media(min-width:760px){.package-tier-grid{grid-template-columns:repeat(3,1fr);}}
.package-tier{
  position:relative;display:block;cursor:pointer;
  background:var(--surface-1);border:2px solid var(--border-2);border-radius:14px;
  padding:20px 20px 16px;transition:border-color .2s ease, background .2s ease;
}
.package-tier:hover{border-color:var(--border-3);}
.package-tier:has(input:checked){border-color:var(--yellow);background:var(--surface-2);}
.package-tier input[type="radio"]{position:absolute;top:18px;right:18px;width:18px;height:18px;accent-color:var(--yellow);}
.package-tier h3{font-family:'Toxigenesis',sans-serif;font-size:17px;color:var(--text);margin:0 26px 6px 0;}
.package-tier-price{font-family:'Toxigenesis',sans-serif;font-size:20px;color:var(--yellow);}
.package-tier-slots{font-size:11.5px;color:var(--text-2);margin:2px 0 12px;letter-spacing:0.3px;}
.package-tier ul{margin:0;padding-left:18px;font-size:13px;color:var(--text-2);line-height:1.8;}
.package-total-box{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--surface-1);border:1px solid var(--border-1);border-radius:12px;
  padding:16px 20px;font-weight:700;color:var(--text);
}
.package-total-box #package-total{font-family:'Toxigenesis',sans-serif;font-size:19px;color:var(--yellow);}

.addon-grid{display:grid;grid-template-columns:1fr;gap:12px;}
@media(min-width:640px){.addon-grid{grid-template-columns:repeat(3,1fr);}}
.addon-item{
  background:var(--surface-1);border:1px solid var(--border-1);border-radius:10px;
  padding:14px 16px;
}
.addon-item label{display:block;font-size:13.5px;font-weight:700;color:var(--text);margin-bottom:2px;}
.addon-item .addon-price{display:block;font-size:12px;color:var(--text-2);margin-bottom:8px;}
.addon-item input[type="number"]{padding:10px 12px;font-size:14px;}

/* ---------- VENUE TABLE PICKER (floor plans) ---------- */
.venue-legend{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0;}
.venue-legend-item{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-2);}
.venue-legend-swatch{display:inline-block;width:14px;height:14px;border-radius:3px;}
.venue-selection-label{font-size:13.5px;font-weight:700;color:var(--yellow);margin:8px 0 16px;}
.venue-selection-label.is-unset{color:var(--text-2);font-weight:600;}
.venue-clear-btn{background:none;border:1px solid var(--border-1);color:var(--text-2);border-radius:8px;
padding:7px 14px;font-size:12.5px;font-family:inherit;cursor:pointer;margin:0 0 16px;}
.venue-clear-btn:hover{border-color:var(--yellow);color:var(--yellow);}
.venue-map-wrap{background:var(--surface-1);border:1px solid var(--border-1);border-radius:12px;padding:16px;margin-bottom:20px;overflow-x:auto;}
.venue-map-wrap h4{margin:0 0 12px;font-size:14px;color:var(--text);}
.venue-map-wrap svg{width:100%;height:auto;display:block;}
#majlisSvgWrap svg{max-width:680px;}
#foyerSvgWrap svg{max-width:732px;}

/* Sampled directly from the floor-plan images' own table fills (ImageMagick
   histogram) so the legend swatches match what's actually drawn on screen. */
.venue-legend-swatch.venue-table-standard{background:#fdc862;}
.venue-legend-swatch.venue-table-standard_plus{background:#a8cc87;}
.venue-legend-swatch.venue-table-premium{background:#c8cced;}
.venue-legend-swatch.venue-table-premium_plus{background:#eea8cc;}
.venue-legend-swatch.is-taken{background:#8a3a3a;}

/* Embedded floor-plan SVGs ship their own .vendor-hit style; !important
   overrides it so tier eligibility / availability / selection show through.
   Once a package is picked: anything NOT pickable (wrong tier OR already
   taken) reads as one uniform greyed-out group via backdrop-filter, which
   desaturates/dims the colorful table artwork actually behind the hit
   region (a plain fill overlay only tints it, never truly greys it out).
   Only tables you can actually click stay bright/colorful. */
.vendor-link .vendor-hit{transition:fill .15s ease,fill-opacity .15s ease,stroke .15s ease,stroke-opacity .15s ease,stroke-width .15s ease,filter .15s ease;}

.vendor-link.is-ineligible .vendor-hit,.vendor-link.is-taken .vendor-hit{
  fill:#000!important;fill-opacity:.4!important;stroke-opacity:0!important;
  -webkit-backdrop-filter:grayscale(1) brightness(.5)!important;backdrop-filter:grayscale(1) brightness(.5)!important;
  cursor:not-allowed!important;pointer-events:none!important;
}
.vendor-link.is-taken .vendor-hit{fill-opacity:.55!important;}

.vendor-link.is-eligible:not(.is-taken) .vendor-hit{
  fill:#2f8fff!important;fill-opacity:.05!important;stroke:#6cc0ff!important;stroke-opacity:1!important;stroke-width:3!important;
  filter:drop-shadow(0 0 6px rgba(47,143,255,.8))!important;
  cursor:pointer!important;pointer-events:all!important;
}
.vendor-link.is-eligible:not(.is-taken):hover .vendor-hit,.vendor-link.is-eligible:not(.is-taken):focus .vendor-hit{
  fill-opacity:.5!important;stroke-width:4.5!important;filter:drop-shadow(0 0 10px rgba(47,143,255,1))!important;
}

.vendor-link.is-eligible.selected .vendor-hit{fill:var(--yellow)!important;fill-opacity:.6!important;stroke:var(--yellow)!important;stroke-opacity:1!important;stroke-width:4.5!important;filter:drop-shadow(0 0 12px rgba(254,174,27,1))!important;}

.checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
.checkbox-item{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  background:var(--surface-1);border:1px solid var(--border-1);border-radius:8px;
  padding:12px 14px;font-size:13.5px;color:var(--text);line-height:1.4;
}
.checkbox-item input{width:18px;height:18px;accent-color:var(--yellow);flex-shrink:0;}

.file-drop{
  border:2px dashed var(--border-3);border-radius:10px;padding:18px;
  background:var(--surface-1);
}
.file-drop input[type="file"]{width:100%;font-size:13px;color:var(--text-2);font-family:'Gilam',sans-serif;}

.terms-box{
  background:var(--surface-2);border:1px solid var(--border-2);border-radius:12px;
  padding:22px;font-size:13.5px;color:var(--text-1);line-height:1.7;
  max-height:280px;overflow-y:auto;
}
.terms-box h4{font-family:'Toxigenesis',sans-serif;font-size:14px;color:var(--yellow);margin:18px 0 8px;}
.terms-box h4:first-child{margin-top:0;}
.terms-box p{margin:0 0 12px;}
.terms-box ul{margin:0 0 12px;padding-left:20px;}
.terms-box li{margin-bottom:4px;}

.form-status{margin-top:24px;padding:18px;border-radius:10px;text-align:center;font-weight:600;display:none;}
.form-status.show{display:block;}
.form-status.success{background:rgba(16,119,250,0.12);border:1px solid var(--blue);color:var(--blue);}
.form-status.error{background:rgba(254,174,27,0.12);border:1px solid var(--yellow);color:var(--yellow);}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid var(--border-2);}
.faq-q{
  width:100%;text-align:left;background:none;border:none;color:var(--text);
  padding:22px 4px;font-size:17px;font-weight:600;font-family:'Gilam',sans-serif;
  display:flex;justify-content:space-between;align-items:center;cursor:pointer;gap:20px;
}
.faq-q .plus{font-family:'JetBrains Mono',monospace;font-size:22px;color:var(--yellow);transition:transform .25s ease;flex-shrink:0;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-item.open .faq-a{max-height:220px;}
.faq-a p{margin:0 0 22px;color:var(--text-2);font-size:15px;line-height:1.7;padding-right:40px;}

/* ---------- FOOTER / NEWSLETTER ---------- */
footer{background:var(--bg-alt);padding:70px 0 30px;border-top:1px solid var(--border-1);}
.foot-top{display:grid;grid-template-columns:1fr;gap:44px;margin-bottom:56px;}
@media(min-width:800px){.foot-top{grid-template-columns:1.2fr 1fr;}}
.foot-logo img{height:26px;width:auto;}
.foot-logo-lockup{display:flex;align-items:center;gap:14px;}
.foot-logo-lockup img{height:32px;width:auto;}
.foot-logo-x{font-size:16px;color:rgba(245,247,250,0.35);font-weight:300;}
.newsletter-form{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;}
.newsletter-form input{
  flex:1;min-width:160px;padding:14px 16px;border-radius:8px;border:2px solid var(--border-2);
  background:var(--surface-1);color:var(--text);font-family:'Gilam',sans-serif;font-size:16px;
}
.newsletter-form input:focus{outline:none;border-color:var(--blue);}
.newsletter-status{margin-top:10px;font-size:13px;display:none;}
.newsletter-status.show{display:block;}
.newsletter-status.success{color:var(--blue);}
.newsletter-status.error{color:var(--yellow);}
.foot-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;}
@media(min-width:560px){.foot-cols{grid-template-columns:repeat(3,1fr);}}
.foot-col h5{font-size:12px;letter-spacing:1.5px;color:var(--yellow);margin-bottom:16px;font-family:'JetBrains Mono',monospace;}
.foot-col a{display:block;font-size:14px;color:var(--text-1);margin-bottom:12px;transition:color .2s;}
.foot-col a:hover{color:var(--blue);}
.foot-cta{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;
  background:var(--surface-2);border:1px solid var(--border-2);border-radius:16px;
  padding:26px 30px;margin-bottom:40px;
}
.foot-cta p{font-family:'Toxigenesis',sans-serif;font-size:19px;color:var(--text);margin:0;}
.foot-cta-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.foot-bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
  padding-top:28px;border-top:1px solid var(--border-1);
  font-size:13px;color:var(--text-3);
}
.social-row{display:flex;gap:14px;}
.social-row a{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--border-2);color:var(--text-2);
  display:flex;align-items:center;justify-content:center;transition:border-color .2s, color .2s;
}
.social-row a:hover{border-color:var(--blue);color:var(--blue);}

.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
