:root{
  --bg:#0a0a0a;
  --panel:#121212;
  --panel-2:#171717;
  --text:#ffffff;
  --muted:#c9c9c9;
  --line:#2a2a2a;
  --accent:#ffffff;
  --shadow:0 20px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:var(--text);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
header{
  position:sticky; top:0; z-index:100;
  background:rgba(10,10,10,.88);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;justify-content:space-between;align-items:center;
  min-height:72px;
}
.brand strong{display:block;letter-spacing:.18em;text-transform:uppercase;font-size:1rem}
.brand span{color:#a8a8a8;font-size:.92rem}
.nav-links{display:flex;gap:22px;flex-wrap:wrap}
.nav-links a{color:#d8d8d8;font-size:.95rem}
.nav-links a:hover{color:#fff}
.hero{
  min-height:86vh;
  display:flex;
  align-items:center;
  background:
   linear-gradient(to right, rgba(0,0,0,.70), rgba(0,0,0,.45)),
   url('assets/hero-event.jpg') center center/cover no-repeat;
  border-bottom:1px solid var(--line);
}
.hero-inner{max-width:820px;padding:80px 0}
.eyebrow{
  display:inline-block;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:7px 12px;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.22em;
  color:#e2e2e2;
}
h1{
  font-size:clamp(2.4rem, 6vw, 4.6rem);
  line-height:1.08;
  margin:18px 0 18px;
}
h2{
  font-size:clamp(1.8rem, 4vw, 3rem);
  line-height:1.1;
  margin:0 0 14px;
}
.lead{font-size:1.08rem;max-width:760px;color:#dfdfdf}
.section{padding:82px 0}
.section.alt{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:28px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.card-body{padding:22px}
.card h3{margin:0 0 8px;font-size:1.25rem}
.card p{margin:0;color:var(--muted)}
.project-image{
  aspect-ratio: 16/10;
  object-fit: cover;
  width:100%;
}
.about-copy p, .legal-copy p, .legal-copy li{
  color:var(--muted);
  margin:0 0 16px;
}
.timeline{
  display:grid;gap:14px;
}
.timeline-item{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:20px;
  padding:18px 18px;
}
.timeline-item small{
  display:block;color:#8e8e8e;letter-spacing:.18em;text-transform:uppercase;font-size:.7rem;margin-bottom:6px
}
.stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px
}
.stat{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:20px;
  padding:20px;
}
.stat strong{display:block;font-size:2rem;line-height:1}
.stat span{display:block;color:#9c9c9c;text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;margin-top:8px}
.gallery-3{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px
}
.gallery-3 img{
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius:18px;
  border:1px solid var(--line);
}
.contact-grid{
  display:grid;grid-template-columns:1fr .9fr;gap:28px
}
.panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  padding:28px;
  box-shadow:var(--shadow);
}
.btn{
  display:inline-block;
  padding:13px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.18);
  margin-right:10px;
  margin-top:8px;
  transition:transform .22s ease, opacity .22s ease, border-color .22s ease;
}
.btn.primary{background:#fff;color:#000;border-color:#fff}
.btn:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.42)}
.social-list{display:grid;gap:12px}
.social-item{
  display:flex;justify-content:space-between;gap:14px;
  padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--panel-2)
}
footer{
  border-top:1px solid var(--line);
  padding:28px 0 34px;
  color:#8d8d8d;
}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px}
.note{
  color:#9d9d9d;
  font-size:.92rem;
}
.fade-in{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .8s ease, transform .8s ease;
}
.fade-in.visible{
  opacity:1;
  transform:translateY(0);
}
@media (max-width: 900px){
  .grid-2,.grid-3,.contact-grid{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 700px){
  .nav{padding:10px 0}
  .nav-links{gap:12px}
  .stats,.gallery-3{grid-template-columns:1fr}
  .hero{min-height:72vh}
}


/* Premium micro-interactions */
.card, .panel, .timeline-item, .stat, .gallery-3 img {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.card:hover, .panel:hover, .timeline-item:hover, .stat:hover {
  transform: translateY(-4px);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 24px 70px rgba(0,0,0,.42);
}
.hover-zoom {
  transition: transform .5s ease, filter .5s ease;
}
.card:hover .hover-zoom,
.gallery-3 img:hover,
.panel .hover-zoom:hover {
  transform: scale(1.035);
  filter: brightness(1.03);
}
.hero {
  animation: heroDrift 18s ease-in-out infinite alternate;
}
@keyframes heroDrift {
  from { background-position: center center, center center; }
  to   { background-position: center center, center 46%; }
}