/* ============================================================
   Compute! Paris 2026 — Stylesheet
   Retro-futurist space theme · Beauty pass
   ============================================================ */

/* Fonts loaded via <link> in HTML head for faster rendering */

/* ── Palette extracted from logo ── */
:root {
  /* Blues */
  --space:       #0A1628;   /* darkest — hero sky */
  --navy:        #14274E;   /* badge bg blue */
  --navy-mid:    #1A3468;
  --blue-horizon:#3A6FB5;   /* horizon glow in logo */
  --saucer:      #A8D8F0;   /* saucer metallic */

  /* Warm beam */
  --beam-gold:   #F2C94C;   /* yellow beam core */
  --beam-orange: #E07535;   /* orange beam body */
  --beam-glow:   rgba(242,201,76,.18);

  /* Text */
  --cream:       #F5EDDA;   /* logo letterform color */
  --cream-dim:   rgba(245,237,218,.65);
  --white:       #ffffff;

  /* Neutrals */
  --text-dark:   #111827;
  --text-mid:    #4B5A6E;
  --muted:       #6B83A0;

  /* Functional */
  --success:     #3ECF8E;

  /* Type */
  --font-head:    'Space Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;

  --nav-h:    80px;
  --r:        10px;
  --r-lg:     20px;
  --max-w:    1160px;
  --t:        0.25s ease;
  --pad:      96px 24px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  color: var(--text-dark);
  background: var(--cream);
  line-height: 1.65;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a   { color: inherit; text-decoration: none; }
ul  { list-style: none; }
p   { max-width: 68ch; }

/* ── Type ── */
h1, h2, h3, h4 {
  font-family: var(--font-head);
  line-height: 1.15;
  font-weight: 700;
}
h1 { font-size: clamp(2.4rem, 6vw, 5rem); }
h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.55rem); }

/* ── Layout ── */
.container  { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; }
.section    { padding: var(--pad); position: relative; }
.text-center { text-align: center; }
.text-center p { margin: 0 auto; }

/* Section colour variants */
.section--dark       { background: var(--navy); color: var(--cream); }
.section--space      { background: var(--space); color: var(--cream); }
.section--cream      { background: var(--cream); }
.section--stars-light {
  background-color: #d6e8f5;
  background-image: url('../images/backgrounds/LightBG-Stars.jpg');
  background-size: cover;
  background-position: center;
  color: var(--text-dark);
}
/* All text on light backgrounds must be dark */
.section--stars-light h2,
.section--stars-light h3,
.section--stars-light h4          { color: var(--space); }
.section--stars-light p,
.section--cream p                  { color: var(--text-mid); }
.section--stars-light .section-header p { color: var(--text-mid); }
/* Overline: swap gold for dark navy tones that read on light */
.section--stars-light .overline,
.section--cream .overline          { color: var(--navy-mid); }
.section--stars-light .overline::before,
.section--cream .overline::before  { color: var(--beam-gold); animation: none; }
/* Cards inherit dark text even without --light modifier */
.section--stars-light .expect__card h3 { color: var(--navy); }
.section--stars-light .expect__card p  { color: var(--text-mid); }
.section--navy-mid    { background: var(--navy-mid); color: var(--cream); }
.section--stars-blue  {
  background-color: var(--navy);
  background-image: url('../images/backgrounds/BlueBG-Stars.jpg');
  background-size: cover;
  background-position: center;
  color: var(--cream);
}
.section--stars-dark  {
  background-color: var(--space);
  background-image: url('../images/backgrounds/DarkBG-Stars.jpg');
  background-size: cover;
  background-position: center;
  color: var(--cream);
}

/* Subtle grain overlay on dark sections */
.section--dark::before,
.section--space::before,
.section--navy-mid::before,
.section--stars-dark::before,
.section--stars-blue::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity: .025;
  pointer-events: none;
  z-index: 0;
}
.section--dark > *, .section--space > *, .section--navy-mid > *,
.section--stars-dark > *, .section--stars-blue > * { position: relative; z-index: 1; }

/* ── Overline / Section label ── */
.overline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--beam-gold);
}
.overline::before {
  content: '✦';
  font-size: .85rem;
  color: var(--beam-gold);
  animation: star-pulse 3s ease-in-out infinite;
}
.overline--orange { color: var(--beam-orange); }
.overline--orange::before { color: var(--beam-orange); }
.overline--cyan  { color: var(--saucer); }
.overline--cyan::before { color: var(--saucer); }
.overline--cream { color: var(--cream); }
.overline--cream::before { color: var(--beam-gold); }

/* ── Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 30px;
  border-radius: 100px;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: .97rem;
  cursor: pointer;
  border: none;
  transition: transform var(--t), box-shadow var(--t), opacity var(--t);
  text-decoration: none;
}
.btn:hover { transform: translateY(-2px); }
.btn--gold {
  background: linear-gradient(135deg, var(--beam-gold), var(--beam-orange));
  color: var(--navy);
  box-shadow: 0 4px 24px rgba(242,201,76,.35);
}
.btn--gold:hover { box-shadow: 0 8px 32px rgba(242,201,76,.5); }
.btn--outline {
  background: transparent;
  border: 1.5px solid rgba(245,237,218,.3);
  color: var(--cream);
}
.btn--outline:hover {
  background: rgba(245,237,218,.08);
  border-color: rgba(245,237,218,.55);
}
.btn--dark {
  background: var(--navy);
  color: var(--cream);
  box-shadow: 0 4px 20px rgba(20,39,78,.4);
}
.btn--dark:hover { box-shadow: 0 8px 28px rgba(20,39,78,.5); }

/* ============================================================
   ANIMATIONS
   ============================================================ */

@keyframes saucer-float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-14px); }
}
@keyframes saucer-glow-pulse {
  0%, 100% { opacity: .55; transform: scale(1);   }
  50%       { opacity: 1;   transform: scale(1.08); }
}
@keyframes beam-breathe {
  0%, 100% { opacity: .6; }
  50%       { opacity: 1;  }
}
@keyframes star-pulse {
  0%, 100% { opacity: 1;   transform: scale(1);    }
  50%       { opacity: .4; transform: scale(.75); }
}
@keyframes star-float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%       { transform: translateY(-18px) rotate(15deg); }
}
@keyframes twinkle {
  0%, 100% { opacity: 1;   transform: scale(1);    }
  40%       { opacity: .15; transform: scale(.65); }
  60%       { opacity: .15; transform: scale(.65); }
}
@keyframes star-pulse {
  0%, 100% { transform: scale(1);    }
  50%       { transform: scale(1.35); }
}
@keyframes scroll-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(8px); }
}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--nav-h);
  z-index: 100;
  transition: background var(--t), backdrop-filter var(--t);
}
.nav--scrolled {
  background: rgba(10,22,40,.88);
  backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid rgba(168,216,240,.07);
}
.nav__inner {
  max-width: var(--max-w);
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.nav__logo { display: flex; align-items: center; }
.nav__logo-text { height: 35px; width: auto; display: block; }
.nav__links {
  display: flex;
  align-items: center;
  gap: 32px;
}
.nav__links a {
  color: rgba(245,237,218,.7);
  font-family: var(--font-head);
  font-weight: 500;
  font-size: .9rem;
  letter-spacing: .02em;
  transition: color var(--t);
  position: relative;
}
.nav__links a::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 0; right: 0;
  height: 1.5px;
  background: linear-gradient(90deg, var(--beam-gold), var(--beam-orange));
  border-radius: 2px;
  transform: scaleX(0);
  transition: transform var(--t);
}
.nav__links a:hover,
.nav__links a.active { color: var(--cream); }
.nav__links a:hover::after,
.nav__links a.active::after { transform: scaleX(1); }

.nav__social { display: flex; align-items: center; gap: 18px; }
.nav__social a {
  color: #5a9fd4;
  transition: color var(--t), transform var(--t);
  display: flex;
}
.nav__social a:hover {
  color: var(--beam-gold);
  transform: scale(1.15);
}
.nav__social svg { width: 20px; height: 20px; fill: currentColor; }

.nav__burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--cream);
  padding: 4px;
}
.nav__burger svg { width: 24px; height: 24px; fill: currentColor; }
.nav__mobile {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--space);
  z-index: 99;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 36px;
}
.nav__mobile.is-open { display: flex; }
.nav__mobile a {
  color: var(--cream);
  font-family: var(--font-head);
  font-size: 2rem;
  font-weight: 700;
  transition: color var(--t);
}
.nav__mobile a:hover { color: var(--beam-gold); }
.nav__mobile-close {
  position: absolute;
  top: 20px; right: 24px;
  background: none;
  border: none;
  color: var(--cream);
  cursor: pointer;
  padding: 4px;
}
.nav__mobile-close svg { width: 28px; height: 28px; fill: currentColor; }

/* ============================================================
   HERO
   ============================================================ */
.hero {
  min-height: 100svh;
  background: var(--space);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(var(--nav-h) + 48px) 24px 100px;
  overflow: hidden;
  color: var(--cream);
}

/* Starfield bg */
.hero__bg {
  position: absolute;
  inset: 0;
  background: url('../images/backgrounds/BlueBG-Stars.jpg') center/cover no-repeat;
  opacity: .45;
}

/* UFO beam — warm cone anchored at logo center, covers full hero height */
.hero__beam {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 70% at 50% 42%,
      rgba(242,201,76,.20) 0%,
      rgba(224,117,53,.10) 30%,
      transparent 65%);
  pointer-events: none;
  animation: beam-breathe 5s ease-in-out infinite;
}

/* Floating star decorations */
.hero__stars { position: absolute; inset: 0; pointer-events: none; }
.hero__star {
  position: absolute;
  animation: star-pulse 5s ease-in-out infinite;
}
.hero__star--1  { top: 10%; left:  7%; width: 40px; animation-delay:  0s; }
.hero__star--2  { top: 18%; right:  9%; width: 32px; animation-delay: -2s; }
.hero__star--3  { bottom: 30%; left: 11%; width: 44px; animation-delay: -4s; }
.hero__star--4  { bottom: 20%; right:  7%; width: 36px; animation-delay: -1s; }
.hero__star--5  { top: 55%; left:  3%; width: 28px; animation-delay: -3s; }
.hero__star--6  { top: 42%; right:  4%; width: 38px; animation-delay: -5s; }

/* Saucer logo */
.hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
}
.hero__logo-wrap {
  position: relative;
  display: inline-flex;
}
.hero__logo-wrap::after {
  content: '';
  position: absolute;
  inset: -16px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(242,201,76,.28) 0%, transparent 68%);
  animation: saucer-glow-pulse 5s ease-in-out infinite;
  pointer-events: none;
}
.hero__logo { height: 340px; width: 340px; position: relative; z-index: 1; display: block; }

/* Hero headline */
.hero__title {
  font-family: var(--font-head);
  font-size: clamp(2.4rem, 7vw, 5.5rem);
  font-weight: 700;
  background: linear-gradient(160deg, var(--white) 30%, var(--beam-gold) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: none;
  letter-spacing: -.01em;
}

.hero__date {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hero__date-main {
  font-family: var(--font-head);
  font-size: clamp(1rem, 2.2vw, 1.35rem);
  font-weight: 700;
  color: var(--beam-gold);
}
.hero__date-venue {
  font-size: clamp(.85rem, 1.6vw, 1rem);
  color: var(--muted);
}
.hero__desc {
  font-size: clamp(.95rem, 1.8vw, 1.15rem);
  color: var(--cream-dim);
  max-width: 52ch;
  line-height: 1.7;
}
.hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}
.hero__scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  color: rgba(245,237,218,.3);
  animation: scroll-bounce 2s infinite;
}
.hero__scroll svg { width: 22px; height: 22px; fill: currentColor; }

/* ============================================================
   CONVICTION STRIP
   ============================================================ */
.conviction {
  background: var(--navy);
  padding: 80px 24px;
  position: relative;
  overflow: hidden;
}
/* decorative glow orb */
.conviction::after {
  content: '';
  position: absolute;
  top: -40%; left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 400px;
  background: radial-gradient(ellipse, rgba(242,201,76,.06) 0%, transparent 65%);
  pointer-events: none;
}
.conviction__inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}
.conviction__quote {
  font-family: var(--font-head);
  font-size: clamp(1.35rem, 3vw, 2.1rem);
  font-weight: 700;
  line-height: 1.4;
  color: var(--cream);
}
.conviction__quote em {
  font-style: normal;
  background: linear-gradient(90deg, var(--beam-gold), var(--beam-orange));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.conviction__sub {
  margin-top: 24px;
  font-size: .95rem;
  color: var(--muted);
  line-height: 1.7;
  max-width: none;
}

/* ============================================================
   SECTION HEADERS
   ============================================================ */
.section-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
  margin-bottom: 8px;
}
.section-header--left {
  align-items: flex-start;
  text-align: left;
}
.section-header--third {
  align-items: flex-start;
  text-align: left;
  margin-left: 12.5%;
}
.section-header--two-thirds {
  align-items: flex-end;
  text-align: right;
  margin-right: 12.5%;
}
.section-header--right {
  align-items: flex-end;
  text-align: right;
}
.section-header h2 { max-width: 22ch; }
.section-header p  { max-width: 58ch; }

/* Decorative rule under heading */
.section-header__rule {
  display: block;
  width: 48px;
  height: 3px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--beam-gold), var(--beam-orange));
  margin: 4px 0;
}
.section-header--left .section-header__rule { margin: 4px 0; }

@media (max-width: 768px) {
  .section-header--third,
  .section-header--two-thirds { margin-left: 0; }
}

/* ============================================================
   EXPECT CARDS (homepage + about)
   ============================================================ */
.expect__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
  margin-top: 52px;
}
.expect__card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(168,216,240,.1);
  border-radius: var(--r-lg);
  padding: 32px 26px;
  transition: transform var(--t), border-color var(--t), box-shadow var(--t);
}
.expect__card:hover {
  transform: translateY(-5px);
  border-color: rgba(242,201,76,.3);
  box-shadow: 0 12px 40px rgba(242,201,76,.08);
}
.expect__icon { font-size: 2.2rem; margin-bottom: 14px; }
.expect__card h3 {
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: var(--beam-gold);
}
.expect__card p {
  font-size: .92rem;
  color: rgba(245,237,218,.65);
  max-width: none;
}

/* Light-background card variant */
.expect__card--light {
  background: rgba(20,39,78,.05);
  border-color: rgba(20,39,78,.1);
}
.expect__card--light h3 { color: var(--navy); }
.expect__card--light p  { color: var(--text-mid); }
.expect__card--light:hover {
  border-color: rgba(224,117,53,.35);
  box-shadow: 0 12px 40px rgba(224,117,53,.08);
}

/* ============================================================
   AUDIENCE GRID
   ============================================================ */
.audience__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-top: 52px;
  border-radius: var(--r-lg);
  overflow: hidden;
}
.audience__cell {
  background: rgba(255,255,255,.03);
  padding: 48px 32px;
  text-align: center;
  border: 1px solid rgba(168,216,240,.07);
  transition: background var(--t);
}
.audience__cell:hover { background: rgba(168,216,240,.08); }
.audience__icon { font-size: 2.6rem; margin-bottom: 14px; }
.audience__cell h3 {
  font-size: 1.2rem;
  color: var(--beam-gold);
  margin-bottom: 10px;
}
.audience__cell p { font-size: .92rem; color: var(--cream-dim); max-width: none; }

/* ============================================================
   COMMITTEE
   ============================================================ */
.committee__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 28px;
  margin-top: 52px;
}
.committee__card {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.committee__photo {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  border: 2.5px solid transparent;
  background-clip: padding-box;
  box-shadow: 0 0 0 2.5px var(--navy-mid), 0 0 0 4px var(--beam-gold), 0 8px 24px rgba(0,0,0,.25);
  transition: box-shadow var(--t), transform var(--t);
}
.committee__card:hover .committee__photo {
  transform: translateY(-4px);
  box-shadow: 0 0 0 2.5px var(--navy-mid), 0 0 0 4px var(--beam-orange), 0 16px 32px rgba(0,0,0,.3);
}
.committee__initials {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--navy), var(--navy-mid));
  box-shadow: 0 0 0 2.5px var(--navy-mid), 0 0 0 4px rgba(242,201,76,.4), 0 8px 24px rgba(0,0,0,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--beam-gold);
  transition: transform var(--t), box-shadow var(--t);
}
.committee__card:hover .committee__initials { transform: translateY(-4px); }
.committee__name {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: .97rem;
  color: var(--text-dark);
}
.section--stars-light .committee__name { color: var(--text-dark); }
.section--dark .committee__name,
.section--space .committee__name,
.section--navy-mid .committee__name { color: var(--cream); }
.committee__org { font-size: .82rem; color: var(--text-mid); }
.section--dark .committee__org,
.section--space .committee__org,
.section--navy-mid .committee__org { color: var(--muted); }

/* ============================================================
   PHOTO SPLIT
   ============================================================ */
.photo-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 520px;
}
.photo-split__img { overflow: hidden; }
.photo-split__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}
.photo-split__img:hover img { transform: scale(1.04); }
.photo-split__content {
  padding: 72px 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  background: var(--navy);
  color: var(--cream);
}
.photo-split__content h2 { color: var(--cream); max-width: 18ch; }
.photo-split__content p  { color: var(--cream-dim); max-width: none; }
.photo-split--reverse .photo-split__img { order: 2; }
.photo-split--reverse .photo-split__content { order: 1; background: var(--navy-mid); }

/* ============================================================
   PAGE HERO (inner pages)
   ============================================================ */
.page-hero {
  min-height: 380px;
  background: var(--space);
  background-image: url('../images/backgrounds/BlueBG-Stars.jpg');
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
  padding: calc(var(--nav-h) + 16px) 24px 72px;
  color: var(--cream);
  position: relative;
  overflow: hidden;
}
.page-hero--wide {
  align-items: flex-start;
  padding-bottom: 80px;
}
.page-hero--wide .cfp-intro__text p { color: rgba(255,255,255,.75); }

/* Warm beam hint on inner pages */
.page-hero::before {
  content: '';
  position: absolute;
  top: -20%;
  left: 50%;
  transform: translateX(-50%);
  width: 700px;
  height: 80%;
  background: radial-gradient(ellipse 50% 100% at 50% 0%, rgba(242,201,76,.08) 0%, transparent 70%);
  pointer-events: none;
}
.page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(10,22,40,.35), rgba(10,22,40,.72));
}
.page-hero__content {
  position: relative;
  z-index: 1;
  max-width: var(--max-w);
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.page-hero h1 {
  font-family: var(--font-head);
  font-weight: 700;
  color: var(--white);
  max-width: 22ch;
  letter-spacing: -.01em;
}
.page-hero p { color: rgba(245,237,218,.65); font-size: 1.05rem; max-width: 52ch; }

/* ============================================================
   VENUE INTRO
   ============================================================ */
.venue-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.venue-intro__text h2 { color: var(--cream); }
.venue-intro__text p  { color: var(--cream-dim); margin-top: 16px; }
.venue-intro__imgs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 2fr 1fr;
  gap: 8px;
  height: 440px;
}
.venue-intro__img-main { grid-column: 1 / -1; }
.venue-intro__img-main,
.venue-intro__img-secondary { border-radius: var(--r); overflow: hidden; }
.venue-intro__img-main img,
.venue-intro__img-secondary img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; filter: none; }
.venue-intro__img-secondary img.img--sepia { filter: grayscale(0.85) sepia(0.5); }
.venue-intro__img-main img:hover,
.venue-intro__img-secondary img:hover { transform: scale(1.04); }

.paris-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.paris-split__text h2 { color: var(--cream); }
.paris-split__text p  { color: var(--cream-dim); margin-top: 16px; }
.paris-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  height: 400px;
}
.paris-grid div { border-radius: var(--r); overflow: hidden; }
.paris-grid__tall { grid-row: 1 / -1; }
.paris-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; display: block; }
.paris-grid img:hover { transform: scale(1.05); }

/* ============================================================
   GALLERY (venue)
   ============================================================ */
.gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 280px 280px;
  gap: 6px;
  margin-top: 48px;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(168,216,240,.08);
}
.gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.gallery img:hover { transform: scale(1.05); }
.gallery__main { grid-column: 1 / 8; grid-row: 1 / 2; overflow: hidden; }
.gallery__tr   { grid-column: 8 / 13; grid-row: 1 / 2; overflow: hidden; }
.gallery__bl   { grid-column: 1 / 5;  grid-row: 2 / 3; overflow: hidden; }
.gallery__bm   { grid-column: 5 / 9;  grid-row: 2 / 3; overflow: hidden; }
.gallery__br   { grid-column: 9 / 13; grid-row: 2 / 3; overflow: hidden; }
.gallery__credits {
  margin-top: 10px;
  font-size: .75rem;
  color: var(--cream-dim);
  text-align: right;
}
.gallery__credits a { color: var(--cream-dim); text-decoration: underline; }
.gallery__credits a:hover { color: var(--cyan); }

/* ============================================================
   ACCESS CARDS (venue)
   ============================================================ */
.access__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
  margin-top: 44px;
}
.access__card {
  background: rgba(168,216,240,.04);
  border: 1px solid rgba(168,216,240,.1);
  border-radius: var(--r);
  padding: 28px;
  transition: border-color var(--t), background var(--t);
}
.access__card:hover {
  border-color: rgba(242,201,76,.25);
  background: rgba(168,216,240,.07);
}
.access__card h3 {
  color: var(--saucer);
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 14px;
  font-family: var(--font-head);
}
.access__card p, .access__card li { font-size: .93rem; color: var(--cream-dim); max-width: none; }
.access__card ul { display: flex; flex-direction: column; gap: 7px; }
.access__card li::before { content: '→ '; color: var(--beam-gold); }

/* ============================================================
   MAP
   ============================================================ */
.map-wrap {
  position: relative;
  margin-top: 48px;
  /* Gold corner brackets via gradient backgrounds */
  background:
    linear-gradient(var(--beam-gold), var(--beam-gold)) top    left  / 28px 2px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) top    left  / 2px 28px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) top    right / 28px 2px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) top    right / 2px 28px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) bottom left  / 28px 2px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) bottom left  / 2px 28px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) bottom right / 28px 2px no-repeat,
    linear-gradient(var(--beam-gold), var(--beam-gold)) bottom right / 2px 28px no-repeat;
  padding: 8px;
}

.map-embed {
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid rgba(168,216,240,.18);
  box-shadow:
    0 0 0 1px rgba(168,216,240,.04),
    0 0 32px rgba(168,216,240,.18),
    0 0 80px rgba(168,216,240,.07),
    inset 0 0 24px rgba(10,22,40,.6);
  height: 400px;
}
.map-links {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 16px;
}
/* Leaflet popup theme */
.leaflet-popup-content-wrapper {
  background: #0d1f38;
  color: var(--cream);
  border: 1px solid rgba(168,216,240,.25);
  border-radius: 8px;
  box-shadow: 0 4px 24px rgba(10,22,40,.8);
}
.leaflet-popup-tip { background: #0d1f38; }
.leaflet-popup-content { margin: 10px 14px; font-size: .85rem; line-height: 1.5; }
.leaflet-container { font-family: inherit; background: #0a1628; }
.osm-dark { filter: invert(100%) hue-rotate(180deg); }

/* ============================================================
   SPONSORS
   ============================================================ */
.sponsor-tier { margin-top: 64px; }
.sponsor-tier__label {
  font-family: var(--font-head);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: 28px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.sponsor-tier__label::before,
.sponsor-tier__label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(168,216,240,.1);
}
.sponsor-tier--diamond .sponsor-tier__label { color: var(--saucer); }
.sponsor-tier--platinum .sponsor-tier__label { color: rgba(200,220,240,.7); }
.sponsor-tier--gold .sponsor-tier__label { color: var(--beam-gold); }

.sponsor-logos {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  align-items: center;
}
.sponsor-logo {
  background: rgba(10,22,40,.6);
  border: 1px solid rgba(168,216,240,.12);
  border-radius: var(--r);
  padding: 18px 26px;
  transition: background var(--t), transform var(--t), border-color var(--t), box-shadow var(--t);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sponsor-logo:hover {
  background: rgba(20,39,78,.8);
  transform: translateY(-3px);
  border-color: rgba(242,201,76,.25);
  box-shadow: 0 8px 28px rgba(242,201,76,.08);
}
.sponsor-logo img {
  max-height: 44px;
  max-width: 150px;
  width: auto;
  filter: brightness(0) invert(1);
  opacity: .75;
  transition: opacity var(--t);
}
.sponsor-tier--gold .sponsor-logo img { max-height: 36px; max-width: 130px; }
.sponsor-logo:hover img { opacity: 1; }

/* Become a sponsor CTA */
.become-sponsor {
  margin-top: 80px;
  position: relative;
  border-radius: var(--r-lg);
  padding: 60px 44px;
  text-align: center;
  overflow: hidden;
  background: var(--navy-mid);
  border: 1px solid rgba(242,201,76,.18);
}
.become-sponsor::before {
  content: '';
  position: absolute;
  top: -30%;
  left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 300px;
  background: radial-gradient(ellipse, rgba(242,201,76,.10) 0%, transparent 65%);
  pointer-events: none;
}
.become-sponsor h2 { color: var(--cream); margin-bottom: 14px; position: relative; }
.become-sponsor p  {
  color: var(--cream-dim);
  margin: 0 auto 32px;
  position: relative;
}

/* ============================================================
   CONTACT
   ============================================================ */
.contact-layout {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 64px;
  align-items: start;
  margin-top: 52px;
}
.contact-info h3 { font-size: 1.5rem; color: var(--cream); margin-bottom: 16px; }
.contact-info p  { color: var(--cream-dim); max-width: none; }
.contact-info__links { margin-top: 28px; display: flex; flex-direction: column; gap: 12px; }
.contact-info__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--saucer);
  font-family: var(--font-head);
  font-size: .95rem;
  font-weight: 500;
  transition: opacity var(--t);
}
.contact-info__link:hover { opacity: .72; }
.contact-info__link svg { width: 18px; height: 18px; fill: currentColor; flex-shrink: 0; }

.contact-social { margin-top: 28px; display: flex; gap: 12px; }
.contact-social a {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: rgba(168,216,240,.05);
  border: 1px solid rgba(168,216,240,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  transition: background var(--t), color var(--t), border-color var(--t);
}
.contact-social a:hover {
  background: rgba(242,201,76,.15);
  color: var(--beam-gold);
  border-color: rgba(242,201,76,.3);
}
.contact-social svg { width: 17px; height: 17px; fill: currentColor; }

.contact-form { display: flex; flex-direction: column; gap: 18px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-group { display: flex; flex-direction: column; gap: 7px; }
.form-group label {
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .1em;
}
.form-group input,
.form-group textarea {
  background: rgba(10,22,40,.55);
  border: 1px solid rgba(168,216,240,.18);
  border-radius: var(--r);
  padding: 13px 16px;
  color: var(--cream);
  font-family: var(--font-body);
  font-size: .97rem;
  outline: none;
  transition: border-color var(--t), background var(--t), box-shadow var(--t);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(245,237,218,.3); }
.form-group input:focus,
.form-group textarea:focus {
  border-color: rgba(242,201,76,.5);
  background: rgba(10,22,40,.7);
  box-shadow: 0 0 0 3px rgba(242,201,76,.08);
}
.form-group textarea { resize: vertical; min-height: 130px; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--space);
  color: var(--muted);
  padding: 72px 24px 32px;
  border-top: 1px solid rgba(168,216,240,.07);
}
.footer__inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 48px;
  padding-bottom: 48px;
}
.footer__brand img, .footer__brand svg.footer-logo { height: 52px; width: auto; margin-bottom: 14px; display: block; }
.footer__brand p   { font-size: .9rem; max-width: 28ch; line-height: 1.6; }
.footer__nav h4, .footer__contact h4 {
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: rgba(168,216,240,.35);
  margin-bottom: 16px;
}
.footer__nav ul { display: flex; flex-direction: column; gap: 10px; }
.footer__nav a {
  color: var(--muted);
  font-size: .93rem;
  transition: color var(--t);
}
.footer__nav a:hover { color: var(--beam-gold); }
.footer__contact p { font-size: .93rem; line-height: 1.7; }
.footer__contact a { color: var(--saucer); transition: opacity var(--t); }
.footer__contact a:hover { opacity: .7; }
.footer__social { display: flex; gap: 12px; margin-top: 16px; }
.footer__social a { color: var(--muted); transition: color var(--t); display: flex; }
.footer__social a:hover { color: var(--saucer); }
.footer__social svg { width: 17px; height: 17px; fill: currentColor; }
.footer__bottom {
  max-width: var(--max-w);
  margin: 0 auto;
  padding-top: 24px;
  border-top: 1px solid rgba(168,216,240,.07);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: .83rem;
}
.footer__bottom a { color: var(--muted); transition: color var(--t); }
.footer__bottom a:hover { color: var(--saucer); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  :root { --pad: 72px 20px; }

  .nav__links, .nav__social { display: none; }
  .nav__burger { display: flex; }

  .audience__grid { grid-template-columns: 1fr; }

  .venue-intro { grid-template-columns: 1fr; gap: 32px; }
  .venue-intro__imgs { height: 280px; grid-template-rows: 2fr 1fr; }
  .paris-split { grid-template-columns: 1fr; gap: 32px; }
  .paris-grid { grid-template-columns: 1fr 1fr; }

  .photo-split,
  .photo-split--reverse { grid-template-columns: 1fr; min-height: auto; }
  .photo-split__img { height: 300px; }
  .photo-split--reverse .photo-split__img,
  .photo-split--reverse .photo-split__content { order: 0; }
  .photo-split__content { padding: 44px 28px; }

  .gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .gallery__main { grid-column: 1 / -1; grid-row: auto; height: 220px; }
  .gallery__tr, .gallery__bl,
  .gallery__bm, .gallery__br {
    grid-column: auto; grid-row: auto; height: 170px;
  }

  .contact-layout { grid-template-columns: 1fr; gap: 48px; }
  .form-row { grid-template-columns: 1fr; }

  .footer__inner { grid-template-columns: 1fr; gap: 32px; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 600px) {
  :root { --pad: 56px 16px; }

  .hero__logo { height: 220px; width: 220px; }
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__star { opacity: .4; }
  .hero__beam { width: 120%; }

  .committee__grid { grid-template-columns: repeat(2, 1fr); }

  .gallery { grid-template-columns: 1fr; }
  .gallery__main, .gallery__tr,
  .gallery__bl,  .gallery__bm, .gallery__br {
    grid-column: auto; height: 210px;
  }

  .become-sponsor { padding: 44px 24px; }
}

/* ============================================================
   SPACE THEME ENHANCEMENTS
   ============================================================ */

/* ── CSS Starfield ── */
/* Three layers: small/slow · medium/mid · large/fast */
.hero__starfield {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.hero__starfield::before,
.hero__starfield::after,
.hero__starfield span {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 1px; height: 1px;
  background: transparent;
}
/* Small slow stars */
.hero__starfield::before {
  width: 1px; height: 1px;
  box-shadow:
    457px 52px rgba(255,255,255,0.57), 1004px 458px rgba(255,255,255,0.27),
    420px 1386px rgba(255,255,255,0.57), 2234px 179px rgba(255,255,255,0.5),
    131px 62px rgba(255,255,255,0.25), 953px 1035px rgba(255,255,255,0.5),
    2299px 408px rgba(255,255,255,0.56), 2233px 860px rgba(255,255,255,0.31),
    1140px 14px rgba(255,255,255,0.58), 654px 1430px rgba(255,255,255,0.41),
    1139px 319px rgba(255,255,255,0.31), 1379px 210px rgba(255,255,255,0.25),
    397px 736px rgba(255,255,255,0.62), 1084px 89px rgba(255,255,255,0.56),
    2197px 256px rgba(255,255,255,0.69), 1551px 162px rgba(255,255,255,0.48),
    285px 94px rgba(255,255,255,0.53), 1186px 164px rgba(255,255,255,0.63),
    414px 779px rgba(255,255,255,0.34), 1495px 334px rgba(255,255,255,0.39),
    859px 1373px rgba(255,255,255,0.33), 293px 1248px rgba(255,255,255,0.52),
    2188px 1494px rgba(255,255,255,0.32), 1894px 778px rgba(255,255,255,0.33),
    2282px 450px rgba(255,255,255,0.54), 230px 470px rgba(255,255,255,0.61),
    865px 1162px rgba(255,255,255,0.64), 1289px 436px rgba(255,255,255,0.53),
    2300px 1104px rgba(255,255,255,0.33), 2395px 878px rgba(255,255,255,0.65),
    1636px 742px rgba(255,255,255,0.31), 567px 1044px rgba(255,255,255,0.45),
    193px 225px rgba(255,255,255,0.28), 656px 1394px rgba(255,255,255,0.41),
    1918px 1084px rgba(255,255,255,0.33), 2267px 24px rgba(255,255,255,0.54),
    470px 1397px rgba(255,255,255,0.64), 1093px 1575px rgba(255,255,255,0.52),
    1859px 7px rgba(255,255,255,0.68), 1079px 1026px rgba(255,255,255,0.58),
    2080px 218px rgba(255,255,255,0.64), 815px 314px rgba(255,255,255,0.39),
    2173px 2px rgba(255,255,255,0.5), 2002px 40px rgba(255,255,255,0.26),
    987px 1162px rgba(255,255,255,0.67), 516px 263px rgba(255,255,255,0.53),
    1734px 434px rgba(255,255,255,0.66), 1530px 898px rgba(255,255,255,0.65),
    1850px 248px rgba(255,255,255,0.32), 30px 146px rgba(255,255,255,0.55);
  animation: starfield-drift-slow 90s linear infinite;
}
/* Medium stars */
.hero__starfield::after {
  width: 1.5px; height: 1.5px;
  box-shadow:
    537px 1376px rgba(255,255,255,0.72), 1873px 648px rgba(255,255,255,0.86),
    298px 20px rgba(255,255,255,0.63), 2307px 205px rgba(255,255,255,0.44),
    874px 1037px rgba(255,255,255,0.53), 1430px 141px rgba(255,255,255,0.84),
    1514px 584px rgba(255,255,255,0.48), 2226px 1441px rgba(255,255,255,0.55),
    2167px 17px rgba(255,255,255,0.73), 2272px 614px rgba(255,255,255,0.87),
    425px 276px rgba(255,255,255,0.53), 439px 1521px rgba(255,255,255,0.68),
    1116px 578px rgba(255,255,255,0.7), 1405px 417px rgba(255,255,255,0.74),
    1082px 1036px rgba(255,255,255,0.64), 209px 190px rgba(255,255,255,0.72),
    536px 1305px rgba(255,255,255,0.89), 662px 1519px rgba(255,255,255,0.62),
    309px 1416px rgba(255,255,255,0.85), 2235px 74px rgba(255,255,255,0.82),
    523px 86px rgba(255,255,255,0.55), 164px 733px rgba(255,255,255,0.51),
    2294px 833px rgba(255,255,255,0.89), 634px 485px rgba(255,255,255,0.83),
    726px 845px rgba(255,255,255,0.41), 1361px 844px rgba(255,255,255,0.8),
    443px 784px rgba(255,255,255,0.84), 1928px 456px rgba(255,255,255,0.5),
    933px 457px rgba(255,255,255,0.41), 792px 817px rgba(255,255,255,0.56),
    2087px 819px rgba(255,255,255,0.74), 2197px 679px rgba(255,255,255,0.87),
    473px 535px rgba(255,255,255,0.49), 1886px 717px rgba(255,255,255,0.55),
    285px 1584px rgba(255,255,255,0.54), 1017px 547px rgba(255,255,255,0.48),
    1023px 1366px rgba(255,255,255,0.45), 1752px 1149px rgba(255,255,255,0.4);
  animation: starfield-drift-mid 65s linear infinite;
}
/* Large bright stars */
.hero__starfield span {
  display: block;
  width: 2px; height: 2px;
  box-shadow:
    1088px 79px rgba(255,255,255,0.64), 1780px 708px rgba(255,255,255,0.89),
    1285px 894px rgba(255,255,255,0.84), 2095px 237px rgba(255,255,255,0.75),
    2362px 390px rgba(255,255,255,0.7), 1787px 4px rgba(255,255,255,0.81),
    808px 746px rgba(255,255,255,0.77), 1353px 1277px rgba(255,255,255,0.73),
    511px 1475px rgba(255,255,255,0.96), 2078px 634px rgba(255,255,255,0.87),
    1337px 825px rgba(255,255,255,0.88), 2271px 261px rgba(255,255,255,0.68),
    1553px 1388px rgba(255,255,255,0.9), 713px 1261px rgba(255,255,255,0.83),
    2206px 1407px rgba(255,255,255,0.89);
  animation: starfield-drift-fast 40s linear infinite;
}

@keyframes starfield-drift-slow {
  from { transform: translateY(0); }
  to   { transform: translateY(-800px); }
}
@keyframes starfield-drift-mid {
  from { transform: translateY(0); }
  to   { transform: translateY(-800px); }
}
@keyframes starfield-drift-fast {
  from { transform: translateY(0); }
  to   { transform: translateY(-800px); }
}

/* ── Orbit ring around saucer ── */
.hero__orbit {
  position: absolute;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  border: 1px solid rgba(168,216,240,.22);
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  animation: orbit-spin 16s linear infinite;
}
/* Outer dashed ring */
.hero__orbit::before {
  content: '';
  position: absolute;
  inset: -20px;
  border-radius: 50%;
  border: 1px dashed rgba(168,216,240,.08);
}
/* Orbiting gold dot */
.hero__orbit::after {
  content: '';
  position: absolute;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--beam-gold);
  box-shadow: 0 0 20px 6px rgba(242,201,76,.8), 0 0 6px rgba(242,201,76,1);
  top: -7px;
  left: calc(50% - 7px);
}
@keyframes orbit-spin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(360deg); }
}

/* ── Mission data readout (hero date) ── */
.hero__mission-data {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-top: 24px;
}
.hero__mission-label {
  font-family: var(--font-head);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--saucer);
  opacity: .7;
}
.hero__date-main {
  font-family: var(--font-head);
  font-size: clamp(1rem, 2.2vw, 1.35rem);
  font-weight: 700;
  color: var(--beam-gold);
}
.hero__date-venue {
  font-size: clamp(.82rem, 1.5vw, .97rem);
  color: var(--muted);
}

/* ── Scanline shimmer on dark sections ── */
.section--dark,
.section--space,
.section--stars-dark {
  background-image: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 3px,
    rgba(0,0,0,.018) 3px,
    rgba(0,0,0,.018) 4px
  );
  background-blend-mode: overlay;
}

/* ── Space section divider ── */
.space-divider {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(168,216,240,.15) 20%,
    rgba(242,201,76,.3) 50%,
    rgba(168,216,240,.15) 80%,
    transparent 100%);
  position: relative;
}
.space-divider::before {
  content: '◈';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  color: var(--beam-gold);
  font-size: .75rem;
  background: var(--navy);
  padding: 0 12px;
  opacity: .7;
}

/* ── Floating coordinate ticks (decorative) ── */
.hero__coords {
  position: absolute;
  pointer-events: none;
  font-family: monospace;
  font-size: .62rem;
  letter-spacing: .05em;
  opacity: .18;
  color: var(--saucer);
}
.hero__coords--tl { top: 15%; left: 5%; }
.hero__coords--tr { top: 15%; right: 5%; text-align: right; }
.hero__coords--bl { bottom: 20%; left: 5%; }
.hero__coords--br { bottom: 20%; right: 5%; text-align: right; }


@media (max-width: 600px) {
  .hero__orbit { width: 280px; height: 280px; }
  .hero__coords { display: none; }
}

/* ============================================================
   CFP — INTRO
   ============================================================ */
.cfp-intro {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 64px;
  align-items: start;
}
.cfp-intro__text p {
  color: var(--cream-dim);
  line-height: 1.7;
  margin-bottom: 16px;
}
.cfp-intro__text p:last-child { margin-bottom: 0; }
.cfp-intro__cta {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(242,201,76,.15);
  border-radius: 12px;
  padding: 28px 24px;
}
.cfp-intro__deadline {
  font-size: .9rem;
  color: var(--cream-dim);
  text-align: center;
}
.cfp-intro__deadline strong { color: var(--beam-gold); }
.cfp-intro__perk {
  font-size: .85rem;
  color: var(--cream);
  text-align: center;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .cfp-intro { grid-template-columns: 1fr; gap: 32px; }
  .cfp-intro__cta .btn { width: auto !important; align-self: center; }
}

/* ============================================================
   CFP — DATES TIMELINE
   ============================================================ */
.cfp-dates {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  position: relative;
  margin-top: 52px;
}
.cfp-dates::before {
  content: '';
  position: absolute;
  top: 6px;
  left: calc(100% / 6);
  right: calc(100% / 6);
  height: 1px;
  background: linear-gradient(90deg, var(--beam-gold), var(--saucer));
  opacity: .4;
}
.cfp-date { text-align: center; padding: 0 12px; }
.cfp-date__dot {
  width: 13px; height: 13px;
  border-radius: 50%;
  background: var(--beam-gold);
  margin: 0 auto 20px;
  position: relative; z-index: 1;
  box-shadow: 0 0 10px rgba(242,201,76,.5);
}
.cfp-date__when {
  display: block;
  font-family: var(--font-head);
  font-size: 1rem;
  font-weight: 700;
  color: var(--beam-gold);
  margin-bottom: 6px;
}
.cfp-date__label {
  display: block;
  font-size: .82rem;
  color: var(--cream-dim);
  text-transform: uppercase;
  letter-spacing: .08em;
}

/* ============================================================
   CFP — TOPIC PILLS
   ============================================================ */
.topic-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 40px;
}
.topic-tag {
  padding: 8px 18px;
  border: 1px solid rgba(168,216,240,.18);
  border-radius: 100px;
  font-size: .875rem;
  color: var(--cream-dim);
  font-family: var(--font-head);
  font-weight: 500;
  transition: border-color var(--t), color var(--t), background var(--t);
}
.topic-tag:hover {
  border-color: rgba(168,216,240,.45);
  color: var(--cream);
  background: rgba(168,216,240,.06);
}

/* ============================================================
   LEGAL / CoC — PROSE ARTICLE
   ============================================================ */
.legal-article {
  max-width: 760px;
  margin: 0 auto;
  padding: 48px 0;
  line-height: 1.85;
  font-size: 1rem;
  color: var(--cream-dim);
}
.legal-article h2 {
  margin: 44px 0 12px;
  font-size: 1.2rem;
  font-family: var(--font-head);
  font-weight: 700;
  color: var(--cream);
}
.legal-article h2:first-child { margin-top: 0; }
.legal-article h3 {
  margin: 26px 0 10px;
  font-size: .95rem;
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--saucer);
}
.legal-article p  { margin: 0 0 16px; }
.legal-article ul,
.legal-article ol { margin: 0 0 18px 1.25rem; }
.legal-article li { margin: 6px 0; }
.legal-article a  { color: var(--saucer); text-decoration: underline; }
.legal-article a:hover { color: var(--cream); }
.legal-contact {
  background: rgba(168,216,240,.05);
  border: 1px solid rgba(168,216,240,.12);
  padding: 20px 24px;
  border-radius: var(--r);
  margin: 24px 0;
}

@media (max-width: 768px) {
  .cfp-proposal-grid { grid-template-columns: 1fr !important; }
  .cfp-proposal-grid__main { grid-row: auto !important; }
  .cfp-dates { grid-template-columns: 1fr; gap: 32px; }
  .cfp-dates::before { display: none; }
  .cfp-date { text-align: left; display: flex; align-items: center; gap: 16px; }
  .cfp-date__dot { margin: 0; flex-shrink: 0; }
  .legal-article { padding: 32px 0; }
}

/* ── Updates / Mastodon feed ────────────────────────────────────────────── */
.toot-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 48px;
  max-width: 680px;
}
.toot {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(168,216,240,.1);
  border-radius: var(--r-lg);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform var(--t), border-color var(--t), box-shadow var(--t);
}
.toot:hover {
  transform: translateY(-4px);
  border-color: rgba(242,201,76,.3);
  box-shadow: 0 12px 40px rgba(242,201,76,.08);
}
.toot__header {
  display: flex;
  align-items: center;
  gap: 12px;
}
.toot__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  flex-shrink: 0;
}
.toot__author {
  font-weight: 600;
  font-size: .95rem;
  color: var(--cream);
}
.toot__handle {
  font-size: .8rem;
  color: rgba(245,237,218,.45);
  margin-top: 2px;
}
.toot__body {
  font-size: .92rem;
  color: rgba(245,237,218,.75);
  line-height: 1.6;
  flex: 1;
}
.toot__body p { margin: 0 0 .5em; }
.toot__body p:last-child { margin-bottom: 0; }
.toot__body a { color: var(--cyan); text-decoration: none; }
.toot__body a:hover { text-decoration: underline; }
.toot__date {
  font-size: .8rem;
  color: rgba(245,237,218,.35);
  text-decoration: none;
  align-self: flex-end;
  transition: color var(--t);
}
.toot__date:hover { color: var(--beam-gold); }
.toot--placeholder {
  text-align: center;
  color: rgba(245,237,218,.4);
  padding: 48px;
  border: none;
  background: none;
}
.toot--placeholder:hover { transform: none; box-shadow: none; }
.updates-follow {
  margin-top: 48px;
  max-width: 680px;
  border-top: 1px solid rgba(168,216,240,.1);
  padding-top: 32px;
}
.updates-follow h4 {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(245,237,218,.35);
  margin-bottom: 16px;
}
.updates-follow__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.updates-follow__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--cyan);
  font-size: .9rem;
  text-decoration: none;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(168,216,240,.12);
  border-radius: var(--r-md, 8px);
  padding: 8px 14px;
  transition: color var(--t), border-color var(--t);
}
.updates-follow__link:hover {
  color: var(--beam-gold);
  border-color: rgba(242,201,76,.3);
}
.updates-follow__link svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  flex-shrink: 0;
}
