
:root{--plum:#1A1020;--plum2:#271630;--plum3:#3a1d3f;--pink:#EE2265;--gold:#E8B422;--orange:#F28C28;--card:#FBF8FC;--ink:#1A1020;--muted:#6B5C72;--line:#e7dfea;--soft:#f3eef5}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--card);color:var(--ink);font:500 17px/1.55 Quicksand,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.os{font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.08em}

/* nav */
.nav{position:absolute;inset:0 0 auto;z-index:5;background:var(--plum);border-bottom:1px solid rgba(255,255,255,.08)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:76px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;font:700 22px Oswald;letter-spacing:.16em}
.brand svg{width:26px;height:34px}
.nav nav{display:flex;gap:28px;align-items:center}
.nav nav a{color:#e6d8ea;text-decoration:none;font-weight:700;font-size:15px}
.nav nav a:hover{color:#fff}
.nav .btn-s{border:2px solid rgba(255,255,255,.35);padding:8px 16px;border-radius:30px;color:#fff}

/* hero */
.hero{background:radial-gradient(ellipse 60% 70% at 70% 30%,#5a1838 0%,#2b1230 50%,var(--plum) 100%);color:#fff;padding:76px 0 40px;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
.hero .wrap>div:first-child{padding-top:70px}
.eyebrow{display:inline-block;font:600 14px Oswald;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:22px}
.hero h1{font:700 clamp(54px,8vw,104px)/.95 Oswald;text-transform:uppercase;letter-spacing:.01em}
.hero h1 em{font-style:normal;color:var(--pink)}
.hero p.lede{font-size:20px;line-height:1.55;color:#e6d8ea;max-width:30em;margin:26px 0 34px}
.cta{display:flex;gap:14px;flex-wrap:wrap;padding-bottom:90px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:40px;font:600 17px Oswald;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.btn.pink{background:var(--pink);color:#fff}
.btn.pink:hover{background:#d71a59}
.btn.ghost{border:2px solid rgba(255,255,255,.4);color:#fff}
.btn.ghost:hover{border-color:#fff}

/* the hanging badge */
.hang{position:relative;align-self:stretch;min-height:560px}
.strap{position:absolute;left:50%;top:-80px;width:74px;height:300px;margin-left:-37px;background:var(--pink);overflow:hidden;display:flex;justify-content:center;align-items:flex-end;padding-bottom:14px}
.strap span{writing-mode:vertical-rl;transform:rotate(180deg);font:700 20px Oswald;letter-spacing:.3em;color:#fff;white-space:nowrap}
.buckle{position:absolute;left:50%;top:206px;width:120px;height:54px;margin-left:-60px;border-radius:20px;background:linear-gradient(#F59A3A,#E07E1C);box-shadow:0 6px 0 #c86a12,0 12px 24px rgba(0,0,0,.35);z-index:2}
.buckle:after{content:"";position:absolute;left:50%;top:24px;width:36px;height:24px;margin-left:-18px;border-radius:7px;background:rgba(120,60,10,.45)}
.clip{position:absolute;left:50%;top:250px;width:52px;height:72px;margin-left:-26px;border-radius:26px;background:linear-gradient(90deg,#9a9aa3,#f2f2f5 45%,#b9b9c2);box-shadow:0 5px 12px rgba(0,0,0,.35);z-index:3}
.clip:after{content:"";position:absolute;left:50%;top:16px;width:8px;height:38px;margin-left:-4px;border-radius:4px;background:#77777f}
.badge{position:absolute;left:0;right:0;top:292px;background:var(--card);color:var(--ink);border-radius:28px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.5);transform-origin:50% -60px;animation:swing 3.2s cubic-bezier(.3,.6,.4,1) 1 both}
@keyframes swing{0%{transform:rotate(5deg)}30%{transform:rotate(-3deg)}55%{transform:rotate(1.6deg)}75%{transform:rotate(-.7deg)}100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.badge{animation:none}}
.badge .art{height:110px;background:var(--plum2);position:relative;overflow:hidden}
.badge .art svg{position:absolute;inset:0;width:100%;height:100%}
.badge .slot{position:absolute;left:50%;top:26px;width:110px;height:24px;margin-left:-55px;border-radius:12px;background:var(--plum)}
.badge .in{padding:26px 32px 40px}
.badge .lab{display:flex;justify-content:space-between;font:700 15px Oswald;letter-spacing:.2em;text-transform:uppercase}
.badge .lab span:first-child{color:var(--muted)}.badge .lab span:last-child{color:var(--pink)}
.badge img.logo{width:100%;max-width:400px;height:auto;margin:22px 0 14px;display:block}
.badge .when{font:700 30px/1.15 Quicksand;color:#D9531E}
.badge .venue{color:var(--muted);font-weight:700;margin-top:6px}

/* featured */
.feat{background:var(--plum);color:#fff;padding:90px 0 100px}
.sec-h{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.sec-h h2{font:700 clamp(36px,5vw,58px)/1 Oswald;text-transform:uppercase}
.sec-h p{max-width:34em;color:#cbb9cf}
.kicker{font:600 14px Oswald;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:12px}
.cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.gcard img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:0 14px 30px rgba(0,0,0,.35);transition:transform .25s}
.gcard:hover img{transform:translateY(-6px) rotate(-1deg)}
.gcard figcaption{margin-top:12px;font-size:14px;line-height:1.35;color:#cbb9cf}
.gcard figcaption b{display:block;color:#fff;font:600 16px Oswald;letter-spacing:.06em;text-transform:uppercase}
.feat-foot{margin-top:44px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.14);padding-top:28px}
.disc{color:#a996ae;font-size:15px;max-width:36em}

/* directory */
.dir{padding:96px 0 40px}
.dir .sec-h p{color:var(--muted)}
.dir .sec-h h2{color:var(--ink)}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 40px}
.chip{border:2px solid var(--line);background:#fff;border-radius:30px;padding:9px 18px;font:700 15px Quicksand;color:var(--ink);cursor:pointer}
.chip:hover{border-color:var(--muted)}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.month{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:26px 0;border-top:2px solid var(--ink)}
.month h2{font:700 22px/1.2 Oswald;text-transform:uppercase;letter-spacing:.06em}
.month h2 span{position:sticky;top:20px}
.month ul{list-style:none}
.ev{display:grid;grid-template-columns:78px 1fr auto;gap:22px;align-items:start;padding:20px 0;border-bottom:1px solid var(--line)}
.ev:last-child{border-bottom:0}
.dt{width:78px;height:78px;border-radius:16px;background:#fff;border:2px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.dt:before{content:"";position:absolute;top:-2px;left:50%;width:26px;height:7px;margin-left:-13px;border-radius:0 0 6px 6px;background:var(--pink)}
.dt b{font:700 25px/1 Oswald}
.dt span{font:600 13px Oswald;letter-spacing:.14em;color:var(--muted);margin-top:4px}
.dt.tbc b{font-size:20px;color:var(--muted)}
.ev h3{font:700 21px/1.25 Quicksand}
.ev h3 a{text-decoration:none}
.ev h3 a:hover{text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:3px}
.tag{display:inline-block;vertical-align:3px;margin-left:6px;font:600 12px Oswald;letter-spacing:.12em;text-transform:uppercase;padding:3px 9px;border-radius:20px;background:var(--soft);color:var(--muted)}
.tag.hot{background:var(--gold);color:var(--ink)}
.meta{color:var(--muted);font-weight:700;font-size:15px;margin-top:3px}
.where{display:flex;align-items:center;gap:6px;font-size:15px;margin-top:4px}
.where svg{width:16px;height:16px;fill:none;stroke:var(--pink);stroke-width:2.2;flex:none}
.note{font-size:15px;color:var(--muted);margin-top:4px}
.go{font:600 14px Oswald;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:2px solid var(--line);border-radius:30px;padding:8px 14px;white-space:nowrap;margin-top:4px}
.go:hover{border-color:var(--ink)}
.checked{color:var(--muted);font-size:14px;margin-top:30px}
.empty{display:none;color:var(--muted);padding:30px 0}

/* submit + about */
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:60px 0 100px}
.panel{border-radius:28px;padding:40px}
.panel h2{font:700 34px/1.05 Oswald;text-transform:uppercase;margin-bottom:14px}
.panel p{margin-bottom:22px}
.panel.pink{background:var(--pink);color:#fff}
.panel.pink .btn{background:#fff;color:var(--pink)}
.panel.soft{background:var(--soft)}
.panel.soft p{color:#4D3F55}

footer{background:var(--plum);color:#a996ae;padding:40px 0;font-size:15px}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
footer .brand{font-size:18px}

@media (max-width:980px){
  .hero .wrap{grid-template-columns:1fr}
  .hang{min-height:560px;max-width:460px;width:100%;margin:0 auto}
  .cta{padding-bottom:20px}
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .month{grid-template-columns:1fr;gap:8px}
  .two{grid-template-columns:1fr}
}
@media (max-width:640px){
  .wrap{padding:0 16px}
  .nav nav a:not(.btn-s){display:none}
  .hero{padding-top:76px}
  .hero p.lede{font-size:18px}
  .hang{min-height:520px}
  .badge .in{padding:20px 22px 30px}
  .badge .when{font-size:24px}
  .cards{grid-template-columns:repeat(6,72%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
  .gcard{scroll-snap-align:start}
  .ev{grid-template-columns:62px 1fr;gap:14px}
  .dt{width:62px;height:62px}.dt b{font-size:20px}
  .go{grid-column:2;justify-self:start}
  .panel{padding:28px}
}

/* pinned featured card */
.pin{display:grid;grid-template-columns:280px 1fr;gap:0;border-radius:24px;overflow:hidden;background:var(--plum);color:#fff;margin:0 0 44px;box-shadow:0 20px 40px -20px rgba(26,16,32,.5)}
.pin .pa{position:relative;background:#2A1530;min-height:220px}
.pin .pa svg{position:absolute;inset:0;width:100%;height:100%}
.pin .pb{padding:30px 34px;display:grid;gap:12px;align-content:center}
.pin .pk{font:600 13px Oswald;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:flex;gap:10px;align-items:center}
.pin .pk svg{width:14px;height:14px;fill:var(--gold)}
.pin img{width:min(360px,100%);height:auto;background:var(--card);padding:12px 16px;border-radius:12px}
.pin .pw{font:700 20px Quicksand;color:#F5B08A}
.pin p{color:#d8c8dc;max-width:46ch}
.pin .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.pin .btn{padding:12px 20px;font-size:15px}
@media (max-width:760px){.pin{grid-template-columns:1fr}.pin .pa{min-height:120px}.pin .pb{padding:24px}}
/* event page */
.ehero{background:radial-gradient(ellipse 60% 70% at 70% 30%,#5a1838 0%,#2b1230 50%,var(--plum) 100%);color:#fff;padding:120px 0 70px}
.ehero .wrap{display:grid;gap:18px}
.ehero img.logo{width:min(520px,100%);height:auto;background:var(--card);padding:18px 22px;border-radius:16px}
.ehero .when{font:700 26px Quicksand;color:#F5B08A}
.ehero p{color:#e6d8ea;max-width:40em;font-size:19px}
.crumb{font:600 13px Oswald;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);text-decoration:none}

.badge .badgename{font:700 54px/.95 Oswald;text-transform:uppercase;margin:18px 0 12px;color:var(--ink)}
@media (max-width:640px){.badge .badgename{font-size:42px}}

.gos{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.go.guide{background:var(--pink);border-color:var(--pink);color:#fff}
@media (max-width:640px){.gos{grid-column:2;justify-content:flex-start}}
