*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#050505;color:#f4f2ee}
body{font-family:Arial,Helvetica,sans-serif}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}

.hero{
  min-height:100svh;max-width:1600px;margin:0 auto;padding:46px 64px 52px;
  display:grid;grid-template-rows:auto 1fr auto;background:#050505;
}
.topbar,.hero-links{display:flex;align-items:center;justify-content:space-between}
.logo{display:block;width:86px;height:86px;object-fit:contain}
.menu,.menu-close{
  appearance:none;border:0;background:transparent;color:#f4f2ee;
  font:500 15px/1 Arial,Helvetica,sans-serif;letter-spacing:.03em;cursor:pointer
}
.hero-center{align-self:center;text-align:center}
h1{
  margin:0;font-family:Impact,"Arial Narrow",Arial,sans-serif;
  font-size:clamp(70px,9.2vw,160px);line-height:.9;font-weight:900;
  letter-spacing:-.035em;white-space:nowrap
}
.descriptor{margin-top:92px;font-size:12px;letter-spacing:.12em;line-height:1.6}
.descriptor p{margin:0}
.hero-links a{font-size:clamp(18px,1.5vw,27px);letter-spacing:.04em;transition:.2s ease}
.hero-links a:hover{opacity:.6;transform:translateY(-2px)}

.site-footer{
  padding:24px 40px 34px;text-align:center;border-top:1px solid #1b1b1b;
  font-size:9px;letter-spacing:.12em;color:#777
}
.site-footer p{margin:0}

.menu-overlay{
  position:fixed;inset:0;z-index:1000;background:#050505;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .28s ease,transform .28s ease,visibility .28s;
}
.menu-overlay.is-open{opacity:1;visibility:visible;transform:translateY(0)}
.menu-panel{
  min-height:100svh;padding:46px 64px 42px;
  display:grid;grid-template-rows:auto 1fr auto;max-width:1600px;margin:0 auto
}
.menu-top,.menu-bottom{display:flex;align-items:center;justify-content:space-between}
.menu-brand img{width:86px;height:86px;object-fit:contain}
.menu-nav{
  width:min(850px,82vw);margin:auto;display:flex;flex-direction:column;
  border-top:1px solid #222
}
.menu-nav a{
  display:grid;grid-template-columns:54px 1fr auto;align-items:center;
  padding:13px 4px;border-bottom:1px solid #222;
  transition:padding-left .2s ease,opacity .2s ease
}
.menu-nav a:hover{padding-left:14px;opacity:.65}
.menu-nav span{font-size:10px;color:#777;letter-spacing:.08em}
.menu-nav strong{
  font-family:Impact,"Arial Narrow",Arial,sans-serif;font-size:clamp(36px,4.5vw,68px);
  font-weight:900;letter-spacing:-.02em;line-height:1
}
.menu-nav em{font-style:normal;font-size:22px}
.menu-bottom{font-size:9px;letter-spacing:.12em;color:#777}

.page{
  min-height:calc(100svh - 70px);padding:46px 64px;
  display:grid;grid-template-rows:auto 1fr
}
.page-header{display:flex;justify-content:space-between;align-items:center}
.page-content{display:grid;place-items:center;text-align:center}
.page-content h1{white-space:normal}
.page-content p{color:#888;letter-spacing:.06em}
.back-link{text-decoration:underline}

@media(max-width:800px){
  .hero,.menu-panel,.page{padding:28px 24px 32px}
  .logo,.menu-brand img{width:64px;height:64px}
  h1{font-size:clamp(58px,18vw,110px);white-space:normal}
  .descriptor{margin-top:52px;font-size:9px}
  .hero-links a{font-size:17px}
  .menu-nav{width:100%}
  .menu-nav a{grid-template-columns:40px 1fr auto;padding:12px 0}
  .menu-nav strong{font-size:clamp(38px,11vw,58px)}
  .menu-bottom{font-size:7px}
  .site-footer{padding:20px 22px 26px;font-size:7px;line-height:1.6}
}

/* V4 menu alignment correction */
.menu-nav a{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  padding:13px 50px !important;
  text-align:center !important;
}
.menu-nav a:hover{
  padding-left:50px !important;
  opacity:.65;
}
.menu-nav strong{
  display:block !important;
  width:100% !important;
  text-align:center !important;
}
.menu-nav em{
  position:absolute !important;
  right:4px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
}
@media(max-width:800px){
  .menu-nav a,
  .menu-nav a:hover{padding:12px 40px !important;}
}

/* Events / Yearbook archive */
.events-page{max-width:1600px;margin:0 auto;padding:46px 64px 80px;min-height:100svh}
.events-header{display:flex;align-items:center;justify-content:space-between}
.events-intro{padding:105px 0 95px;border-bottom:1px solid #242424}
.events-intro .eyebrow{margin:0 0 18px;font-size:10px;letter-spacing:.16em;color:#888}
.events-intro h1{font-size:clamp(90px,14vw,220px);line-height:.75;white-space:normal;text-align:left}
.events-deck{margin:36px 0 0;font-size:12px;letter-spacing:.15em}
.upcoming-section,.archive-section{padding:48px 0 0}
.section-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2a2a2a;padding-bottom:13px}
.section-heading p,.section-heading span{margin:0;font-size:10px;letter-spacing:.16em}
.section-heading span{color:#777}
.empty-upcoming{min-height:230px;display:grid;place-content:center;text-align:center;border-bottom:1px solid #242424}
.empty-upcoming strong{font-family:Impact,"Arial Narrow",Arial,sans-serif;font-size:clamp(30px,4vw,58px);letter-spacing:.01em}
.empty-upcoming p{max-width:520px;margin:12px auto 0;color:#777;font-size:11px;letter-spacing:.08em;line-height:1.6}
.archive-note{padding:18px 0 34px;font-size:9px;letter-spacing:.13em;color:#777}
.yearbook-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:42px 18px}
.event-card{display:block}
.event-art{
  aspect-ratio:4/5;background:#101010;border:1px solid #242424;padding:18px;
  display:flex;flex-direction:column;position:relative;overflow:hidden
}
.event-art:after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(135deg,transparent 0 14px,rgba(255,255,255,.018) 14px 15px)
}
.event-year,.event-tag{position:relative;z-index:1;font-size:9px;letter-spacing:.14em;color:#777}
.event-tag{margin-top:6px}
.event-art strong{
  position:relative;z-index:1;margin-top:auto;font-family:Impact,"Arial Narrow",Arial,sans-serif;
  font-size:clamp(28px,3.2vw,55px);line-height:.9;letter-spacing:-.02em
}
.event-meta{padding-top:13px}
.event-meta h3{font-size:12px;letter-spacing:.07em;margin:0 0 6px}
.event-meta p{font-size:9px;letter-spacing:.08em;color:#777;margin:0 0 12px;line-height:1.5}
.event-meta span{font-size:9px;letter-spacing:.1em;text-decoration:underline}
.event-card:hover .event-art{border-color:#666}
.event-card:hover .event-meta span{opacity:.6}

@media(max-width:1000px){.yearbook-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){
 .events-page{padding:28px 24px 60px}
 .events-intro{padding:80px 0 70px}
 .events-intro h1{font-size:clamp(82px,29vw,150px)}
 .yearbook-grid{gap:32px 12px}
 .event-art{padding:12px}
 .event-art strong{font-size:clamp(24px,8vw,42px)}
}
@media(max-width:520px){
 .yearbook-grid{grid-template-columns:1fr 1fr}
 .event-meta h3{font-size:10px}
 .event-meta p,.event-meta span{font-size:7px}
}

/* V6 featured upcoming event */
.featured-event{
  display:grid;grid-template-columns:minmax(280px,.78fr) 1.22fr;
  gap:clamp(42px,7vw,120px);align-items:center;
  padding:72px 5% 86px;border-bottom:1px solid #242424
}
.featured-art-wrap{display:flex;justify-content:center}
.featured-art{
  display:block;width:min(100%,460px);aspect-ratio:4/5;object-fit:cover;
  border:1px solid #262626
}
.featured-info{max-width:680px}
.featured-kicker{font-size:9px;letter-spacing:.16em;color:#777;margin:0 0 24px}
.featured-info h2{
  margin:0;font-family:Impact,"Arial Narrow",Arial,sans-serif;
  font-size:clamp(62px,7.5vw,122px);line-height:.82;letter-spacing:-.025em
}
.featured-details{margin-top:38px;padding:22px 0;border-top:1px solid #292929;border-bottom:1px solid #292929}
.featured-details p{margin:0 0 7px;font-size:11px;letter-spacing:.1em}
.featured-details p:last-child{margin-bottom:0}
.featured-details .collab{margin-top:20px;color:#aaa;font-size:9px}
.ticket-button{
  margin-top:30px;display:flex;justify-content:space-between;align-items:center;
  width:100%;padding:18px 0;border-bottom:1px solid #f4f2ee;
  font-size:13px;letter-spacing:.13em;transition:opacity .2s ease
}
.ticket-button span{font-size:22px}
.ticket-button:hover{opacity:.55}
.ticket-note{margin:12px 0 0;font-size:8px;letter-spacing:.14em;color:#666}

@media(max-width:800px){
  .featured-event{grid-template-columns:1fr;padding:48px 0 64px;gap:42px}
  .featured-art{width:min(100%,390px)}
  .featured-info h2{font-size:clamp(64px,20vw,105px)}
  .featured-details p{font-size:9px}
}
