:root {
  --ink: #161616;
  --muted: #626773;
  --paper: #ffffff;
  --soft: #f5f6f8;
  --line: #dddfe5;
  --purple: #32205b;
  --purple-dark: #1d1234;
  --gold: #c7a24b;
  --crimson: #9d1b2b;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--soft);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}
a { color: inherit; }
img { display: block; max-width: 100%; }

.header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px clamp(18px, 5vw, 64px);
  background: rgba(255, 255, 255, .95);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  color: white;
  background: var(--purple);
  border: 2px solid var(--gold);
  font-weight: 900;
}
.brand strong,
.brand small { display: block; }
.brand strong {
  font-size: .92rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.brand small { color: var(--muted); }
.site-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.site-nav a {
  padding: 10px 12px;
  color: var(--muted);
  border-radius: 6px;
  font-weight: 800;
  text-decoration: none;
}
.site-nav a:hover,
body[data-page="rush"] .site-nav a[href="rush.html"],
body[data-page="involvement"] .site-nav a[href="involvement.html"],
body[data-page="alumni"] .site-nav a[href="alumni.html"],
body[data-page="active"] .site-nav a[href="active-brothers.html"] {
  color: var(--ink);
  background: #f2e8ca;
}
.menu-button {
  display: none;
  min-height: 42px;
  padding: 0 14px;
  color: white;
  background: var(--purple);
  border: 0;
  border-radius: 6px;
  font-weight: 900;
}

.hero {
  position: relative;
  min-height: calc(100vh - 79px);
  display: grid;
  align-items: end;
  overflow: hidden;
  color: white;
  background: var(--purple-dark);
}
.hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(18, 18, 18, .72), rgba(18, 18, 18, .28));
}
.hero-copy {
  position: relative;
  z-index: 1;
  max-width: 850px;
  padding: clamp(40px, 8vw, 90px) clamp(18px, 5vw, 64px);
}
.eyebrow {
  margin: 0 0 12px;
  color: var(--gold);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
h1, h2 {
  margin: 0 0 18px;
  font-family: Georgia, "Times New Roman", serif;
  line-height: 1;
}
h1 { font-size: clamp(3.2rem, 9vw, 7rem); }
h2 { font-size: clamp(2.1rem, 5vw, 4rem); }
h3 { margin: 0 0 10px; font-size: 1.25rem; }
p { margin-top: 0; color: var(--muted); }
.hero p,
.page-hero p,
.value-band p { color: rgba(255,255,255,.84); }
.hero-copy > p:not(.eyebrow),
.page-hero > p { font-size: clamp(1.05rem, 2vw, 1.32rem); }

.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  width: fit-content;
  padding: 0 18px;
  border-radius: 6px;
  font-weight: 900;
  text-decoration: none;
}
.gold { color: var(--ink); background: var(--gold); border: 1px solid var(--gold); }
.outline { color: white; border: 1px solid rgba(255,255,255,.45); }
.outline-dark { color: var(--purple); border: 1px solid rgba(50, 32, 91, .32); background: white; }
.disabled { cursor: not-allowed; color: var(--muted); background: var(--line); border: 1px solid var(--line); }

.facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--line);
}
.facts div {
  min-height: 118px;
  padding: 28px clamp(18px, 5vw, 64px);
  background: white;
  border-right: 1px solid var(--line);
}
.facts span,
.card span,
.date-box span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.facts strong { font-size: clamp(1.1rem, 2vw, 1.45rem); }

.section { padding: clamp(56px, 8vw, 100px) clamp(18px, 5vw, 64px); }
.cards {
  display: grid;
  gap: 18px;
  margin-top: 30px;
}
.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card,
.contact,
.date-box {
  display: block;
  padding: 24px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 8px;
  text-decoration: none;
  box-shadow: 0 18px 52px rgba(20, 20, 20, .06);
}
.card:hover,
.contact:hover { border-color: rgba(199, 162, 75, .7); }
.rush-headshot {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
  margin-bottom: 16px;
  border-radius: 6px;
  background: var(--soft);
}
.rush-headshot-wide {
  object-position: center 28%;
}
.contact span {
  display: block;
  color: var(--purple);
  font-weight: 900;
}
.contact strong {
  display: block;
  margin-top: 8px;
  font-size: 1.1rem;
}
.photo-card { overflow: hidden; padding: 0; }
.photo-card div {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  color: white;
  background: linear-gradient(135deg, var(--crimson), var(--purple));
  font-weight: 900;
}
.photo-card span,
.photo-card h3,
.photo-card p { padding-inline: 22px; }
.photo-card span { margin-top: 18px; }
.photo-card p { padding-bottom: 22px; }

.instagram-section h2 {
  max-width: 760px;
}
.instagram-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 30px;
}
.instagram-card {
  padding: 22px;
}
.instagram-card h3 {
  margin-bottom: 18px;
}
.instagram-media {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 540px !important;
  margin: 0 auto !important;
}
.instagram-media > a {
  display: grid;
  place-items: center;
  min-height: 220px;
  padding: 24px;
  color: var(--purple);
  background: var(--soft);
  border: 1px dashed rgba(50, 32, 91, .35);
  border-radius: 8px;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}

.page-hero {
  padding: clamp(70px, 11vw, 130px) clamp(18px, 5vw, 64px);
  color: white;
  background: linear-gradient(120deg, var(--purple-dark), var(--purple));
}
.two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr);
  gap: 24px;
  align-items: stretch;
}
.date-box {
  display: grid;
  place-items: center;
  text-align: center;
}
.date-box strong {
  color: var(--purple);
  font-size: clamp(1.4rem, 3vw, 2.5rem);
  line-height: 1.05;
}
.newsletter-card {
  display: grid;
  align-content: start;
  gap: 14px;
}
.newsletter-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.newsletter-frame {
  display: block;
  width: 100%;
  min-height: 1200px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 52px rgba(20, 20, 20, .06);
}
.pdf-slot {
  display: grid;
  place-items: center;
  min-height: 260px;
  margin: 8px 0 4px;
  color: var(--purple);
  background: linear-gradient(135deg, rgba(199, 162, 75, .16), rgba(50, 32, 91, .08)), var(--soft);
  border: 1px dashed rgba(50, 32, 91, .35);
  border-radius: 8px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pdf-slot.small { min-height: 180px; }
.newsletter-archive { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.archive-card {
  display: grid;
  align-content: start;
  gap: 12px;
}
.archive-card .button {
  margin-top: 4px;
}
.archive-note {
  max-width: 780px;
  padding: 20px 22px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 18px 52px rgba(20, 20, 20, .06);
}
.archive-note p {
  margin: 0;
}
.newsletter-copy {
  max-width: 980px;
  margin: 0 auto;
}
.newsletter-detail-card {
  padding: clamp(28px, 5vw, 52px);
}
.newsletter-detail-card h2 {
  color: var(--purple);
  font-size: clamp(2rem, 4vw, 3.5rem);
}
.newsletter-detail-card ul {
  margin: 0 0 28px;
  padding-left: 22px;
  color: var(--muted);
}
.newsletter-detail-card li + li {
  margin-top: 10px;
}
.value-band {
  padding: clamp(52px, 7vw, 86px) clamp(18px, 5vw, 64px);
  color: white;
  background: var(--purple-dark);
}
footer {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 30px clamp(18px, 5vw, 64px);
  color: white;
  background: #111;
}
footer a {
  color: var(--gold);
  font-weight: 900;
  text-decoration: none;
}

@media (max-width: 980px) {
  .four,
  .two,
  .two-col,
  .newsletter-archive,
  .instagram-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .header { align-items: flex-start; flex-wrap: wrap; }
  .menu-button { display: inline-flex; align-items: center; }
  .site-nav {
    display: none;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 10px 0; }
  footer { align-items: flex-start; flex-direction: column; }
  .facts,
  .four,
  .two,
  .two-col,
  .newsletter-archive,
  .instagram-grid { grid-template-columns: 1fr; }
  .hero { min-height: 78vh; }
}