/* =========================================================
   Sanki Events — Homepage
   Page-specific styles. Brand tokens + shared components
   (navbar, hero shell, marquee, sanki-way, teaser, footer)
   live in style.css and are reused as-is.
========================================================= */

/* ---------- Hero copy variant: stacked kinetic lines ---------- */
.hero-kinetic--stack .kinetic-row{ margin-bottom:.05em; }
.kinetic-row--grad2 .kinetic-word{
  background:linear-gradient(115deg, var(--violet) 0%, var(--crimson) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.badge-boring{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:'Space Mono', monospace; font-size:.7rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-dim);
  border:1px dashed rgb(var(--contrast-rgb) / .22);
  padding:.55rem 1rem; border-radius:999px;
  align-self:center;
}
.badge-boring i{ color:var(--orange); }

/* ---------- Hero visual: promo ticket card (replaces video portal) ---------- */
.promo-ticket{
  position:relative; width:100%; max-width:340px; aspect-ratio:4/5;
  margin:0 auto;
  padding:2.2rem 1.9rem;
  border-radius:34px;
  background:var(--grad);
  transform:rotate(-4deg);
  box-shadow:0 30px 70px rgba(230,28,88,.3), 0 14px 44px rgba(0,0,0,.55);
  color:#fff5ec;
  display:flex; flex-direction:column;
  will-change:transform;
}
.promo-ticket__kicker{
  font-family:'Space Mono', monospace; font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; opacity:.85;
}
.promo-ticket__title{
  font-size:clamp(2.1rem, 5vw, 2.7rem); line-height:1.02;
  text-transform:uppercase; margin:.7rem 0 auto; color:#fff5ec;
}
.promo-ticket__book{
  align-self:flex-end;
  display:flex; align-items:center; gap:.3rem;
  width:76px; height:76px; border-radius:50%;
  background:#fff5ec; color:var(--crimson);
  font-family:'Space Mono', monospace; font-size:.62rem; font-weight:700;
  letter-spacing:.04em; line-height:1.15; text-align:center;
  text-transform:uppercase;
  justify-content:center; text-align:center;
  box-shadow:0 12px 26px rgba(0,0,0,.28);
  margin-top:1.6rem;
  transform:rotate(6deg);
}
.promo-ticket__book i{ display:none; }
.promo-ticket__foot{
  display:flex; justify-content:space-between;
  font-family:'Space Mono', monospace; font-size:.72rem; letter-spacing:.05em;
  text-transform:uppercase; opacity:.85; margin-top:1.4rem;
}
.promo-ticket__notch{
  position:relative; top:50%; width:26px; height:26px; border-radius:50%;
  background:var(--bg); transform:translateY(-50%);
}
.promo-ticket__notch--left{ left:-13px; }
.promo-ticket__notch--right{ right:-13px; }

/* ---------- Promo ticket "brought to life" with a real event photo ---------- */
.promo-ticket{
  background-size:cover; background-position:center;
  animation:ticketGlow 4s ease-in-out infinite;
}
.promo-ticket__live{
  display:inline-flex; align-items:center; gap:.45rem;
  align-self:flex-start;
  font-family:'Space Mono', monospace; font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase;
  background:rgba(23,8,26,.55); backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.25);
  padding:.4rem .85rem; border-radius:999px;
  margin-bottom:1rem;
}
.promo-ticket__dot{ width:6px; height:6px; border-radius:50%; background:var(--orange); animation:pulseDot 1.6s ease-in-out infinite; }
.promo-ticket__kicker, .promo-ticket__title, .promo-ticket__foot{ text-shadow:0 2px 14px rgba(0,0,0,.5); }
@keyframes ticketGlow{
  0%,100%{ box-shadow:0 30px 70px rgba(230,28,88,.3), 0 14px 44px rgba(0,0,0,.55); }
  50%{ box-shadow:0 34px 82px rgba(251,74,37,.42), 0 14px 44px rgba(0,0,0,.55); }
}

@media (max-width: 575px){
  .promo-ticket{ max-width:280px; }
}
.promo-ticket__notch--left{ left:-13px; }
.promo-ticket__notch--right{ right:-13px; }

@media (max-width: 575px){
  .promo-ticket{ max-width:280px; }
}

/* ---------- "Next Up" live countdown strip ---------- */
.countdown-strip{
  position:relative; z-index:2;
  margin:-2.4rem auto 0;
  max-width:960px;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:1.4rem;
  padding:1.3rem 2rem;
  border-radius:999px;
  background:rgb(var(--contrast-rgb) / .06);
  border:1px solid rgb(var(--contrast-rgb) / .16);
  backdrop-filter:blur(12px);
}
.countdown-strip__event{
  display:flex; align-items:center; gap:.7rem;
  font-family:'Outfit', sans-serif; font-size:.9rem; color:var(--ink-dim);
}
.countdown-strip__event i{ color:var(--orange); font-size:1.05rem; flex-shrink:0; }
.countdown-strip__event strong{ color:var(--ink); }
.countdown-timer{ display:flex; gap:1.1rem; }
.countdown-timer__unit{ text-align:center; min-width:42px; }
.countdown-timer__num{
  display:block; font-family:'Space Mono', monospace; font-weight:700;
  font-size:1.3rem; color:var(--orange); line-height:1;
}
.countdown-timer__label{ font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-dim); }

@media (max-width: 767px){
  .countdown-strip{ margin-top:1.4rem; border-radius:var(--radius-md); justify-content:center; text-align:center; }
}

/* =========================================================
   TESTIMONIALS
========================================================= */
.testimonials-section{ padding:6.5rem 0 7rem; background:var(--bg-soft); }
.testimonials-head{ text-align:center; max-width:560px; margin:0 auto 3rem; }
.testimonials-head .section-title{ margin-top:.6rem; }

/* =========================================================
   BROWSE BY VIBE
========================================================= */
.vibe-section{
  padding:6rem 0 9rem;
  background:#0b0410;
  background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1.6px);
  background-size:24px 24px;
  --ink:#fff5ec; --ink-dim:#d7b9cf; --contrast-rgb:255 255 255;
  color:var(--ink);
}
.vibe-title{
  font-size:clamp(1.9rem, 4vw, 2.7rem);
  text-transform:none;
  margin:.6rem 0 3rem;
  font-family:'Archivo Black','Outfit',sans-serif;
}
.vibe-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:1rem;
}
.vibe-chip{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; gap:.9rem;
  padding:1.6rem 1rem;
  border:1px solid rgb(255 255 255 / .1);
  border-radius:var(--radius-md);
  background:linear-gradient(160deg, rgba(230,28,88,.14), rgba(11,4,16,.4));
  color:var(--ink);
  font-family:'Outfit', sans-serif; font-weight:600; font-size:.88rem;
  cursor:pointer;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.vibe-chip:nth-child(2n){ background:linear-gradient(160deg, rgba(130,29,100,.2), rgba(11,4,16,.4)); }
.vibe-chip:nth-child(3n){ background:linear-gradient(160deg, rgba(7,164,153,.16), rgba(11,4,16,.4)); }
.vibe-chip:hover{ transform:translateY(-6px); border-color:var(--orange); box-shadow:0 16px 32px rgba(0,0,0,.3); }
.vibe-chip.is-active{ border-color:var(--orange); box-shadow:0 0 0 1px var(--orange), 0 16px 32px rgba(251,74,37,.18); }
.vibe-chip__icon{
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgb(255 255 255 / .08); color:var(--orange); font-size:1.1rem;
}

@media (max-width: 991px){
  .vibe-grid{ grid-template-columns:repeat(4, 1fr); }
}
@media (max-width: 575px){
  .vibe-grid{ grid-template-columns:repeat(2, 1fr); }
}

/* =========================================================
   FEATURED SPOTLIGHTS — parallax panels
========================================================= */
.spotlights-section{ position:relative; }
.spotlight{
  position:relative; overflow:clip;
  padding:7rem 0;
}
.spotlight--a{ background:var(--bg); }
.spotlight--b{ background:var(--bg-soft); }
.spotlight-letter{
  position:absolute; top:-6%;
  font-family:'Archivo Black', sans-serif;
  font-size:clamp(14rem, 34vw, 26rem);
  line-height:1; color:rgb(var(--contrast-rgb) / .04);
  z-index:0; pointer-events:none; user-select:none;
}
.spotlight-letter--right{ right:-3%; }
.spotlight-letter--left{ left:-3%; }
.spotlight-frame{
  position:relative;
  clip-path: polygon(8% 0%, 100% 0%, 100% 82%, 92% 100%, 0% 100%, 0% 14%);
  border-radius:12px; overflow:hidden;
  border:2px solid rgba(251,74,37,.35);
}
.spotlight-frame--alt{
  clip-path: polygon(0 0, 92% 0, 100% 18%, 100% 100%, 8% 100%, 0 86%);
  border-color:rgba(7,164,153,.4);
}
.spotlight-img{ width:100%; display:block; aspect-ratio:4/5; object-fit:cover; }
.spotlight-tag{
  position:absolute; bottom:1.2rem; left:1.2rem;
  background:rgba(23,8,26,.72); backdrop-filter:blur(6px);
  border:1px solid rgba(251,74,37,.45);
  color:var(--orange);
  font-family:'Space Mono', monospace; font-size:.7rem; letter-spacing:.16em;
  padding:.5rem 1rem; border-radius:999px;
}
.spotlight-tag--teal{ border-color:rgba(7,164,153,.5); color:var(--teal); }
.spotlight-cta{ margin-top:2.2rem; }
.kicker--teal{ color:var(--teal); }

@media (max-width: 767px){
  .spotlight{ padding:5rem 0; }
  .spotlight-letter{ display:none; }
}

/* =========================================================
   UPCOMING EVENTS
========================================================= */
.events-section{ padding:7rem 0 6rem; position:relative; }
.events-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1.5rem; flex-wrap:wrap; margin-bottom:3rem;
}
.events-title{
  font-size:clamp(2.2rem, 5.4vw, 3.6rem);
  line-height:.96; text-transform:uppercase; letter-spacing:-.02em;
}
.events-sub{ max-width:34ch; color:var(--ink-dim); line-height:1.6; font-size:.95rem; margin:0; }

.event-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.6rem;
}
.event-card{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:rgb(var(--contrast-rgb) / .03);
  border:1px solid rgb(var(--contrast-rgb) / .1);
  transition:transform .5s var(--ease), border-color .4s, box-shadow .4s, opacity .3s, filter .3s;
}
.event-card:nth-child(odd):hover{ transform:translateY(-8px) rotate(-.6deg); }
.event-card:nth-child(even):hover{ transform:translateY(-8px) rotate(.6deg); }
.event-card:hover{ border-color:rgb(var(--contrast-rgb) / .3); box-shadow:0 24px 48px rgba(0,0,0,.28); }
.event-card.is-hidden{ display:none; }

.event-card__ribbon{
  position:absolute; top:1rem; right:-.4rem; z-index:3;
  font-family:'Space Mono', monospace; font-size:.66rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:#fff5ec;
  background:var(--grad-cta);
  padding:.4rem 1.1rem .4rem .9rem;
  border-radius:999px 0 0 999px;
  box-shadow:0 8px 18px rgba(0,0,0,.3);
}
.event-card__ribbon--hot{ background:linear-gradient(120deg, var(--teal), var(--violet)); }

.event-card__media{
  position:relative;
  aspect-ratio:4/3;
  clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
  overflow:hidden;
}
.event-card__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .7s var(--ease);
}
.event-card:hover .event-card__media img{ transform:scale(1.09); }
.event-card__media::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(11,4,16,.85));
}
.event-card__badge{
  position:absolute; left:1rem; bottom:1rem; z-index:2;
  font-family:'Space Mono', monospace; font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink);
  background:rgb(var(--contrast-rgb) / .12);
  border:1px solid rgb(var(--contrast-rgb) / .22);
  backdrop-filter:blur(6px);
  padding:.4rem .8rem; border-radius:999px;
}
.event-card__body{ padding:1.5rem 1.5rem 1.7rem; }
.event-card__body h3{
  font-family:'Archivo Black','Outfit',sans-serif; font-size:1.1rem;
  text-transform:uppercase; line-height:1.15; margin-bottom:.7rem;
}
.event-card__meta{
  color:var(--ink-dim); font-size:.82rem; margin-bottom:1.2rem;
  display:flex; flex-wrap:wrap; gap:.3rem .5rem; align-items:center;
}
.event-card__cta{
  display:inline-flex; align-items:center; gap:.5rem;
  background:rgb(var(--contrast-rgb) / .06);
  border:1px solid rgb(var(--contrast-rgb) / .16);
  color:var(--ink); font-weight:700; font-size:.85rem;
  padding:.55rem 1.1rem; border-radius:999px;
  transition:background .3s, border-color .3s, gap .3s, color .3s;
}
.event-card__cta:hover{ background:var(--grad-cta); border-color:transparent; color:#fff5ec; gap:.7rem; }

.event-empty{
  text-align:center; color:var(--ink-dim); padding:3rem 0 0;
  font-size:.95rem;
}

@media (max-width: 991px){
  .event-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 575px){
  .event-grid{ grid-template-columns:1fr; }
  .events-head{ flex-direction:column; align-items:flex-start; }
}

/* =========================================================
   JOIN THE COMMUNITY
========================================================= */
.community-section{ padding:7rem 0 8rem; }
.community-card{
  display:grid; grid-template-columns:1.1fr 1fr; gap:3rem; align-items:center;
  border-radius:var(--radius-lg);
  padding:3.5rem;
  background:linear-gradient(160deg, rgba(130,29,100,.18), rgba(230,28,88,.08) 60%, rgba(7,164,153,.1));
  border:1px solid rgb(var(--contrast-rgb) / .1);
}
.community-card .btn-cta{ margin-top:1.6rem; }
.community-mock{
  background:var(--ink); color:#241127;
  border-radius:var(--radius-md);
  padding:1.6rem;
  transform:rotate(1.5deg);
  box-shadow:0 24px 50px rgba(0,0,0,.35);
}
.community-mock__head{
  display:flex; align-items:center; gap:.8rem;
  padding-bottom:1rem; margin-bottom:1rem;
  border-bottom:1px solid rgba(36,17,39,.1);
}
.community-mock__head strong{ display:block; font-family:'Archivo Black',sans-serif; font-size:.95rem; }
.community-mock__head span{ font-size:.78rem; color:#6c5468; }
.community-mock__avatar{
  width:40px; height:40px; border-radius:50%;
  background:var(--grad-cta); flex-shrink:0;
}
.community-mock__msg{
  background:#f7eadc; color:#241127;
  padding:.65rem 1rem; border-radius:14px;
  font-size:.88rem; margin-bottom:.7rem;
}
.community-mock__msg:last-child{ margin-bottom:0; }

@media (max-width: 900px){
  .community-card{ grid-template-columns:1fr; padding:2.2rem; text-align:center; }
  .community-mock{ transform:none; }
  .community-card .section-text{ margin-inline:auto; }
}

/* =========================================================
   THE SANKI WAY (missing rules restored — was rendering unstyled)
========================================================= */
.sanki-way-section{
  position:relative; overflow:clip;
  padding:8rem 0 7rem;
  /* background:var(--bg-soft); */
}
.giant-letter{
  position:absolute; top:-8%; left:-2%;
  font-family:'Archivo Black', sans-serif;
  font-size:clamp(16rem, 38vw, 30rem);
  line-height:1; color:rgb(var(--contrast-rgb) / .04);
  z-index:0; pointer-events:none; user-select:none;
}
.memories-wrap{ position:relative; z-index:1; margin-bottom:3.5rem; }
.ghost-text{
  font-family:'Archivo Black','Outfit',sans-serif;
  font-size:clamp(2.6rem, 7vw, 5.4rem);
  line-height:.96; text-transform:uppercase;
  color:transparent;
  -webkit-text-stroke:1.5px rgb(var(--contrast-rgb) / .55);
  margin:0;
}
.memories-text{
  font-family:'Archivo Black','Outfit',sans-serif;
  font-size:clamp(2.6rem, 7vw, 5.4rem);
  line-height:.96; text-transform:uppercase;
  color:var(--crimson);
  margin:0;
}
.feature-grid{
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:1.4rem;
}
.feature-card{
  padding:2rem 1.6rem;
  border-radius:var(--radius-md);
  background:rgb(var(--contrast-rgb) / .04);
  border:1px solid rgb(var(--contrast-rgb) / .1);
  transition:transform .4s var(--ease), border-color .4s, background .4s;
}
.feature-card:hover{ transform:translateY(-6px); border-color:rgb(var(--contrast-rgb) / .25); background:rgb(var(--contrast-rgb) / .07); }
.feature-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:16px;
  font-size:1.3rem; color:#fff5ec;
  margin-bottom:1.2rem;
  transition:transform .4s var(--ease);
}
.feature-card:hover .feature-icon{ transform:scale(1.08) rotate(-4deg); }
.feature-icon--orange{ background:linear-gradient(140deg, var(--orange), var(--crimson)); }
.feature-icon--crimson{ background:linear-gradient(140deg, var(--crimson), var(--violet)); }
.feature-icon--teal{ background:linear-gradient(140deg, var(--teal), #0b6b63); }
.feature-icon--violet{ background:linear-gradient(140deg, var(--violet), var(--crimson)); }
.feature-card h4{
  font-family:'Archivo Black','Outfit',sans-serif; font-size:1.05rem;
  text-transform:uppercase; margin-bottom:.5rem; color:var(--ink);
}
.feature-card p{ color:var(--ink-dim); font-size:.92rem; line-height:1.6; margin:0; }

.feature-grid .feature-card:nth-child(1){ transition-delay:0s; }
.feature-grid .feature-card:nth-child(2){ transition-delay:.08s; }
.feature-grid .feature-card:nth-child(3){ transition-delay:.16s; }
.feature-grid .feature-card:nth-child(4){ transition-delay:.24s; }

@media (max-width: 991px){
  .feature-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 575px){
  .feature-grid{ grid-template-columns:1fr; }
  .giant-letter{ display:none; }
}

/* =========================================================
   HOW IT WORKS
========================================================= */
.how-section{ padding:6.5rem 0 9rem; position:relative; background:var(--bg-soft); }
.how-head{ max-width:560px; margin:0 auto 3.5rem; }
.how-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:2rem;
  position:relative;
}
.how-grid::before{
  content:"";
  position:absolute; top:34px; left:12%; right:12%; height:1px;
  background:repeating-linear-gradient(90deg, rgb(var(--contrast-rgb) / .25) 0 10px, transparent 10px 20px);
  z-index:0;
}
.how-step{ position:relative; z-index:1; text-align:center; padding:0 1rem; }
.how-step__num{
  display:block; font-family:'Space Mono', monospace; font-weight:700;
  font-size:.78rem; letter-spacing:.1em; color:var(--ink-dim); margin-bottom:.6rem;
}
.how-step__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:68px; height:68px; border-radius:50%;
  background:var(--bg); border:2px solid rgb(var(--contrast-rgb) / .15);
  font-size:1.5rem; color:var(--orange);
  margin-bottom:1.2rem;
  transition:transform .4s var(--ease), border-color .4s;
}
.how-step:hover .how-step__icon{ transform:translateY(-4px) scale(1.05); border-color:var(--orange); }
.how-step h4{
  font-family:'Archivo Black','Outfit',sans-serif; font-size:1.05rem;
  text-transform:uppercase; margin-bottom:.6rem; color:var(--ink);
}
.how-step p{ color:var(--ink-dim); font-size:.9rem; line-height:1.65; max-width:30ch; margin:0 auto; }

.how-grid .how-step:nth-child(1){ transition-delay:0s; }
.how-grid .how-step:nth-child(2){ transition-delay:.1s; }
.how-grid .how-step:nth-child(3){ transition-delay:.2s; }

@media (max-width: 767px){
  .how-grid{ grid-template-columns:1fr; gap:2.6rem; }
  .how-grid::before{ display:none; }
}

/* =========================================================
   FAQ
========================================================= */
.faq-section{ padding:7rem 0; }
.sanki-accordion .accordion-item{
  background:transparent;
  border:none;
  border-bottom:1px solid rgb(var(--contrast-rgb) / .1);
}
.sanki-accordion .accordion-item:first-child{ border-top:1px solid rgb(var(--contrast-rgb) / .1); }
.sanki-accordion .accordion-button{
  background:transparent; color:var(--ink);
  font-family:'Outfit', sans-serif; font-weight:600; font-size:1.02rem;
  padding:1.4rem .2rem; box-shadow:none;
}
.sanki-accordion .accordion-button:not(.collapsed){ color:var(--orange); }
.sanki-accordion .accordion-button::after{ filter:invert(1) brightness(1.6); }
[data-theme="light"] .sanki-accordion .accordion-button::after{ filter:none; }
.sanki-accordion .accordion-body{
  padding:0 .2rem 1.6rem;
  color:var(--ink-dim); font-size:.95rem; line-height:1.7;
}
