/* ===== style.css ===== */
/* ============================================
   HUSA SENATE — SHARED STYLES
   Navy: #0A2240 | Red: #C8102E | White: #FFFFFF
   ============================================ */

:root {
  --navy: #0A2240;
  --navy-mid: #0D2D52;
  --navy-light: #1A3A5C;
  --red: #C8102E;
  --red-dark: #A00D25;
  --white: #FFFFFF;
  --off-white: #F8F6F2;
  --cream: #F2EFE8;
  --gray: #8A8A8A;
  --light-gray: #E8E4DC;
  --ink-soft: rgba(10, 34, 64, 0.72);
  --shadow-soft: 0 18px 42px rgba(10, 34, 64, 0.10);
  --shadow-strong: 0 30px 70px rgba(10, 34, 64, 0.18);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --font-display: 'Barlow Condensed', sans-serif;
  --font-serif: 'Playfair Display', serif;
  --font-italic: 'Cormorant Garamond', serif;
  --font-body: 'Barlow', sans-serif;
}

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  background: var(--white);
  color: var(--navy);
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
}

::selection {
  background: rgba(200, 16, 46, 0.18);
  color: var(--navy);
}

/* ============================================
   NAVIGATION
   ============================================ */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: rgba(10, 34, 64, 0.93);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14);
  transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.nav.scrolled {
  background: rgba(10, 34, 64, 0.98);
  border-color: rgba(200, 16, 46, 0.42);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24);
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav-logo img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25));
  transition: transform 0.35s var(--ease-out);
}

.nav-logo:hover img {
  transform: scale(1.06) rotate(-2deg);
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
}

.nav-links a {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.8);
  padding: 8px 14px;
  border-radius: 4px;
  transition: all 0.2s ease;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
}

.nav-links a::after {
  content: '';
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 5px;
  height: 1px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease-out);
}

.nav-links a:hover,
.nav-links a.active {
  color: var(--white);
  background: rgba(200, 16, 46, 0.2);
}

.nav-links a.active {
  color: var(--red);
}

.nav-links a:hover::after,
.nav-links a.active::after {
  transform: scaleX(1);
}

/* Dropdown */
.nav-dropdown {
  position: relative;
}

.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background: rgba(10, 34, 64, 0.97);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(200,16,46,0.3);
  border-radius: 6px;
  min-width: 200px;
  overflow: hidden;
  box-shadow: 0 20px 48px rgba(0,0,0,0.32);
  animation: menuIn 0.22s var(--ease-out);
}

@keyframes menuIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.nav-dropdown:hover .nav-dropdown-menu {
  display: block;
}

.nav-dropdown-menu a {
  display: block;
  padding: 12px 18px;
  font-size: 12px;
  border-radius: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.nav-dropdown-menu a:last-child {
  border-bottom: none;
}

.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
  appearance:none;
  border:0;
  background:transparent;
  border-radius:10px;
  color:var(--white);
  touch-action:manipulation;
  transition:background .2s ease, box-shadow .2s ease;
}

.hamburger:hover,
.hamburger:focus-visible{
  background:rgba(255,255,255,.08);
  box-shadow:0 0 0 1px rgba(255,255,255,.12);
  outline:none;
}

.hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  transition: all 0.3s ease;
}

/* Mobile Nav */
.mobile-menu {
  display: none;
  position: fixed;
  top: 64px;
  left: 0;
  right: 0;
  background: rgba(10, 34, 64, 0.98);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  z-index: 999;
  padding: 20px;
  border-bottom: 2px solid var(--red);
}

.mobile-menu.open {
  display: block;
}

.mobile-menu a {
  display: block;
  color: var(--white);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.mobile-menu a:last-child {
  border-bottom: none;
}

body.mobile-nav-open {
  overflow:hidden;
}

/* ============================================
   FOOTER
   ============================================ */
.footer {
  background:
    linear-gradient(135deg, rgba(10, 34, 64, 0.16), transparent 36%),
    var(--red);
  padding: 50px 60px 30px;
  position: relative;
  overflow: hidden;
}

.footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);
  background-size: 84px 100%;
  opacity: 0.18;
  pointer-events: none;
}

.footer > * {
  position: relative;
  z-index: 1;
}

.footer-inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
  margin-bottom: 24px;
}

.footer-brand h2 {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: 4px;
}

.footer-brand .footer-senate {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 42px;
  color: var(--white);
  line-height: 1;
}

.footer-logo img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.16));
}

.footer-contact {
  text-align: right;
}

.footer-contact h4 {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  margin-bottom: 10px;
}

.footer-contact a,
.footer-contact p {
  display: block;
  color: rgba(255,255,255,0.85);
  font-size: 13px;
  margin-bottom: 6px;
  transition: color 0.2s;
}

.footer-contact a:hover {
  color: var(--white);
}

.footer-social {
  display: flex;
  gap: 14px;
  justify-content: flex-end;
  margin-top: 12px;
}

.footer-social a {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-size: 14px;
  transition: all 0.2s;
  margin-bottom: 0;
}

.footer-social a:hover {
  background: rgba(255,255,255,0.15);
  border-color: var(--white);
  transform: translateY(-2px);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer-bottom p {
  font-size: 12px;
  color: rgba(255,255,255,0.55);
}

.webmaster-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-left:16px;
  padding:10px 16px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.13);
  color:var(--white);
  font-family:var(--font-mono, var(--font-body));
  font-size:14px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 16px 36px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.18);
  transition:background .2s ease, transform .2s ease, border-color .2s ease;
}

.webmaster-link:hover,
.webmaster-link:focus-visible {
  background:rgba(255,255,255,.2);
  border-color:rgba(255,255,255,.42);
  transform:translateY(-2px);
}

/* ============================================
   PAGE HEADER (shared)
   ============================================ */
.page-header {
  padding-top: 64px;
  background: var(--white);
}

/* ============================================
   SECTION DIVIDER
   ============================================ */
.divider {
  width: 50px;
  height: 3px;
  background: var(--red);
  margin: 0 auto 30px;
  transform-origin: center;
  box-shadow: 0 0 0 5px rgba(200, 16, 46, 0.07);
}

.divider-left {
  margin: 0 0 30px;
}

/* ============================================
   PILL BUTTONS
   ============================================ */
.btn-outline {
  display: inline-block;
  border: 2px solid var(--navy);
  border-radius: 50px;
  padding: 12px 28px;
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 16px;
  color: var(--navy);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), background 0.25s ease, color 0.25s ease;
  cursor: pointer;
  position: relative;
}

.btn-outline:hover {
  background: var(--navy);
  color: var(--white);
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}

.btn-solid {
  display: inline-block;
  background: var(--red);
  border-radius: 6px;
  padding: 12px 28px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--white);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), background 0.25s ease, border-color 0.25s ease;
  cursor: pointer;
  border: 2px solid var(--red);
  box-shadow: 0 10px 24px rgba(200, 16, 46, 0.22);
}

.btn-solid:hover {
  background: var(--red-dark);
  border-color: var(--red-dark);
  box-shadow: 0 18px 34px rgba(200, 16, 46, 0.28);
  transform: translateY(-2px);
}

.btn-solid-navy {
  display: inline-block;
  background: var(--navy);
  border-radius: 6px;
  padding: 12px 28px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--white);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), background 0.25s ease;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(10, 34, 64, 0.18);
}

.btn-solid-navy:hover {
  background: var(--navy-mid);
  box-shadow: 0 18px 34px rgba(10, 34, 64, 0.22);
  transform: translateY(-2px);
}

/* ============================================
   SCROLL REVEAL
   ============================================ */
.reveal {
  opacity: 0;
  transform: translateY(36px) scale(0.985);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-36px) scale(0.985);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
}

.reveal-left.visible {
  opacity: 1;
  transform: translateX(0) scale(1);
}

.reveal-right {
  opacity: 0;
  transform: translateX(36px) scale(0.985);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out);
}

.reveal-right.visible {
  opacity: 1;
  transform: translateX(0) scale(1);
}

/* ============================================
   IMAGE PLACEHOLDERS
   ============================================ */
.img-placeholder {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.4);
  font-family: var(--font-body);
  font-size: 13px;
  letter-spacing: 1px;
  text-align: center;
  padding: 20px;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
  .nav-links { display: none; }
  .hamburger { display: flex; }

  .footer-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .footer-contact {
    text-align: center;
  }

  .footer-social {
    justify-content: center;
  }

  .footer-bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .footer {
    padding: 40px 24px 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}

/* Mobile polish overrides */
@media (max-width: 768px) {
  html,
  body {
    width: 100%;
    overflow-x: hidden;
  }

  img {
    height: auto;
  }

  .nav {
    height: 58px;
    padding: 0 18px;
  }

  .nav-logo img {
    width: 36px;
    height: 36px;
  }

  .mobile-menu {
    top: 58px;
    padding: 14px 22px 18px;
    max-height: calc(100vh - 58px);
    overflow-y: auto;
  }

  .mobile-menu a {
    font-size: 14px;
    padding: 13px 0;
  }

  .page-header {
    padding-top: 58px;
  }

  .btn-solid,
  .btn-solid-navy,
  .btn-outline,
  .btn-outline-white {
    width: 100%;
    max-width: 340px;
    text-align: center;
    white-space: normal;
    line-height: 1.25;
  }

  .footer-inner {
    gap: 28px;
  }

  .footer {
    padding: 40px 22px 24px;
  }

  .footer-brand .footer-senate {
    font-size: 36px;
  }

  .footer-logo img {
    width: 76px;
    height: 76px;
  }
}

@media (max-width: 420px) {
  .btn-solid,
  .btn-solid-navy,
  .btn-outline,
  .btn-outline-white {
    max-width: 100%;
    padding: 12px 18px;
    font-size: 12px;
  }
}


/* ===== home.css ===== */
/* ============================================
   HOME PAGE STYLES
   ============================================ */

/* HERO */
.hero {
  min-height: 100vh;
  background:
    linear-gradient(115deg, rgba(10, 34, 64, 0.06) 0 12%, transparent 12% 100%),
    linear-gradient(245deg, rgba(200, 16, 46, 0.08) 0 10%, transparent 10% 100%),
    var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-top: 64px;
  overflow: hidden;
}

.hero-bg-pattern {
  position: absolute;
  inset: 0;
  background-image: 
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 80px,
      rgba(10, 34, 64, 0.03) 80px,
      rgba(10, 34, 64, 0.03) 81px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 80px,
      rgba(10, 34, 64, 0.03) 80px,
      rgba(10, 34, 64, 0.03) 81px
    );
  pointer-events: none;
  mask-image: linear-gradient(to bottom, black, transparent 88%);
}

.hero::before {
  content: '';
  position: absolute;
  top: 64px;
  right: 0;
  width: min(38vw, 520px);
  height: 5px;
  background: var(--red);
  opacity: 0.65;
  transform: skewX(-28deg);
  pointer-events: none;
}

.hero::after {
  content: '';
  position: absolute;
  bottom: 78px;
  left: 0;
  width: min(42vw, 620px);
  height: 2px;
  background: var(--navy);
  opacity: 0.28;
  transform: skewX(-28deg);
  pointer-events: none;
}

.hero-content {
  text-align: center;
  z-index: 1;
  animation: heroFadeIn 1s ease forwards;
  padding: 40px 24px;
}

@keyframes heroFadeIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero-logo-wrap {
  margin-bottom: 36px;
}

.hero-logo {
  width: 220px;
  height: 220px;
  object-fit: contain;
  margin: 0 auto;
  filter: drop-shadow(0 24px 32px rgba(10, 34, 64, 0.16));
}

@keyframes logoFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

.hero-title {
  font-family: var(--font-serif);
  font-size: clamp(52px, 8vw, 96px);
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 16px;
  text-shadow: 0 12px 34px rgba(10, 34, 64, 0.10);
}

.hero-title em {
  font-style: italic;
  color: var(--red);
}

.hero-subtitle {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gray);
  margin-bottom: 40px;
  color: var(--ink-soft);
}

.hero-cta-row {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

.btn-outline-white {
  display: inline-block;
  border: 2px solid var(--navy);
  border-radius: 6px;
  padding: 12px 28px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--navy);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), background 0.25s ease, color 0.25s ease;
}

.btn-outline-white:hover {
  background: var(--navy);
  color: var(--white);
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}

.hero-scroll-hint {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  opacity: 0.4;
  animation: scrollFade 2s ease-in-out infinite;
}

@keyframes scrollFade {
  0%, 100% { opacity: 0.4; transform: translateX(-50%) translateY(0); }
  50% { opacity: 0.7; transform: translateX(-50%) translateY(6px); }
}

.hero-scroll-hint span {
  font-family: var(--font-display);
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--navy);
}

.scroll-line {
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, var(--navy), transparent);
}

/* WHAT IS HUSA SENATE */
.what-section {
  background:
    linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px),
    var(--navy);
  background-size: 34px 34px, auto;
  padding: 100px 60px;
}

.what-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.78fr 1.22fr;
  gap: 56px;
  align-items: center;
}

.section-label {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 16px;
}

.what-text .section-label {
  color: rgba(200, 16, 46, 0.9);
}

.what-heading {
  font-family: var(--font-display);
  font-size: clamp(42px, 5vw, 68px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 24px;
}

.what-heading-highlight {
  display: inline;
  background: var(--red);
  padding: 2px 8px;
  font-style: normal;
}

.what-text p {
  color: rgba(255,255,255,0.78);
  font-size: 16px;
  line-height: 1.75;
}

.what-text .divider-left {
  background: var(--red);
}

.what-image {
  position: relative;
}

.what-image-frame {
  border: 3px solid var(--red);
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 2.11 / 1;
  background: var(--navy-light);
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.3);
  font-size: 13px;
  letter-spacing: 1px;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.32);
  transform: perspective(1200px) rotateY(-3deg);
  transition: transform 0.6s var(--ease-out), box-shadow 0.6s var(--ease-out);
}

.what-image:hover .what-image-frame {
  transform: perspective(1200px) rotateY(0deg) translateY(-6px);
  box-shadow: 0 36px 86px rgba(0, 0, 0, 0.38);
}

.what-image-frame picture,
.what-image-frame img {
  width: 100%;
  height: 100%;
}

.what-image-frame picture,
.charter-photo picture {
  display: block;
}

.what-image-frame img {
  object-fit: cover;
  object-position: center center;
}

.what-image-badge {
  position: absolute;
  bottom: -16px;
  right: -16px;
  background: var(--red);
  color: var(--white);
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 10px 20px;
  border-radius: 6px;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
}

/* STATS STRIP */
.stats-strip {
  background: var(--off-white);
  padding: 60px 60px;
  border-top: 3px solid var(--red);
}

.stats-inner {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 20px;
}

.stat {
  text-align: center;
  transition: transform 0.35s var(--ease-out);
}

.stat:hover {
  transform: translateY(-4px);
}

.stat-num {
  font-family: var(--font-display);
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
}

.stat-label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--red);
  margin-top: 6px;
}

.stat-divider {
  width: 1px;
  height: 60px;
  background: rgba(10, 34, 64, 0.15);
}

/* EXPLORE SECTION */
.explore-section {
  padding: 100px 60px;
  background: var(--white);
}

.explore-header {
  text-align: center;
  margin-bottom: 60px;
}

.explore-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 20px;
}

.explore-header h2 em {
  font-style: italic;
  color: var(--red);
}

.explore-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.explore-card {
  display: block;
  border: 1.5px solid var(--light-gray);
  border-radius: 8px;
  padding: 36px 28px;
  transition: transform 0.42s var(--ease-out), box-shadow 0.42s var(--ease-out), border-color 0.3s ease;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
}

.explore-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--red);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.explore-card:hover::before {
  transform: scaleX(1);
}

.explore-card:hover {
  border-color: transparent;
  box-shadow: var(--shadow-strong);
  transform: translateY(-8px);
}

.explore-card-icon {
  font-size: 28px;
  margin-bottom: 16px;
}

.explore-card h3 {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--navy);
  margin-bottom: 10px;
}

.explore-card p {
  font-size: 14px;
  line-height: 1.6;
  color: #555;
}

.explore-arrow {
  display: inline-block;
  margin-top: 20px;
  font-size: 20px;
  color: var(--red);
  transition: transform 0.2s ease;
}

.explore-card:hover .explore-arrow {
  transform: translateX(6px);
}

/* last row center if only 2 items in last row */
.explore-grid .explore-card:nth-child(4) {
  grid-column: 1 / 2;
}

.explore-grid .explore-card:nth-child(5) {
  grid-column: 2 / 3;
}

/* RESPONSIVE HOME */
@media (max-width: 900px) {
  .what-inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .what-section {
    padding: 60px 24px;
  }

  .stats-inner {
    flex-wrap: wrap;
    gap: 32px;
  }

  .stat-divider { display: none; }

  .explore-section {
    padding: 60px 24px;
  }

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

  .explore-grid .explore-card:nth-child(4),
  .explore-grid .explore-card:nth-child(5) {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  .hero-logo {
    width: 160px;
    height: 160px;
  }

  .stats-strip {
    padding: 40px 24px;
  }

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

/* Mobile polish overrides */
@media (max-width: 600px) {
  .hero {
    min-height: auto;
    padding: 104px 18px 76px;
  }

  .hero-content {
    padding: 0;
  }

  .hero-logo {
    width: min(46vw, 150px);
    height: min(46vw, 150px);
  }

  .hero-title {
    font-size: clamp(46px, 16vw, 64px);
  }

  .hero-subtitle {
    font-size: 12px;
    line-height: 1.45;
    letter-spacing: 2.4px;
  }

  .hero-cta-row {
    flex-direction: column;
    align-items: center;
  }

  .what-section {
    padding: 56px 18px;
  }

  .what-inner {
    gap: 34px;
    padding: 0;
  }

  .what-heading {
    font-size: clamp(36px, 13vw, 48px);
  }

  .what-image-frame {
    min-height: 0;
    aspect-ratio: auto;
    transform: none;
  }

  .what-image-frame img {
    height: auto;
    object-fit: contain;
  }

  .what-image-badge {
    right: 12px;
    bottom: -14px;
  }

  .stats-strip {
    padding: 42px 18px;
  }

  .stats-inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 18px;
  }

  .explore-section {
    padding: 56px 18px;
  }

  .explore-card {
    padding: 28px 22px;
  }
}


/* ===== about.css ===== */
/* ============================================
   ABOUT PAGE STYLES
   ============================================ */

/* ABOUT HERO */
.about-hero {
  padding: 80px 60px 60px;
  background:
    linear-gradient(120deg, rgba(10, 34, 64, 0.05) 0 18%, transparent 18%),
    var(--white);
  text-align: center;
  border-bottom: 1px solid var(--light-gray);
}

.about-hero .section-label {
  margin-bottom: 12px;
}

.about-title {
  font-family: var(--font-serif);
  font-size: clamp(52px, 8vw, 96px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
  line-height: 1;
}

.about-title em {
  font-style: italic;
  color: var(--red);
}

.about-tagline {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 22px;
  color: var(--red);
  font-weight: 600;
}

/* CHARTER */
.charter-section {
  background: var(--navy);
  padding: 80px 60px;
  text-align: center;
}

.charter-inner {
  max-width: 980px;
  margin: 0 auto;
}

.charter-badge {
  display: inline-block;
  background: var(--red);
  color: var(--white);
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 4px;
  margin-bottom: 16px;
}

.charter-subtitle {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 18px;
  color: rgba(255,255,255,0.7);
  margin-bottom: 32px;
}

.charter-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px);
  gap: 34px;
  align-items: center;
  margin-bottom: 40px;
}

.charter-quote {
  font-family: var(--font-serif);
  font-size: clamp(16px, 2.2vw, 20px);
  font-weight: 400;
  line-height: 1.8;
  color: var(--white);
  font-style: italic;
  border-left: 4px solid var(--red);
  padding-left: 28px;
  text-align: left;
  margin-bottom: 0;
}

.charter-photo {
  position: relative;
  margin: 0;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  overflow: hidden;
  box-shadow: 0 22px 48px -30px rgba(0,0,0,.8);
}

.charter-photo img {
  display: block;
  width: 100%;
  height: clamp(300px, 28vw, 360px);
  object-fit: cover;
  object-position: center 56%;
}

.charter-photo figcaption {
  padding: 11px 12px;
  border-top: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.78);
  font-family: var(--font-mono, var(--font-body));
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.charter-section .divider {
  background: var(--red);
}

/* THREE BRANCHES */
.branches-section {
  padding: 100px 60px;
  background: var(--white);
}

.branches-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.branches-header {
  text-align: center;
  margin-bottom: 60px;
}

.branches-intro {
  font-family: var(--font-serif);
  font-size: clamp(24px, 3vw, 36px);
  color: var(--navy);
  margin-bottom: 8px;
}

.branches-heading {
  font-family: var(--font-serif);
  font-size: clamp(32px, 5vw, 60px);
  font-weight: 900;
  color: var(--navy);
  margin-bottom: 24px;
}

.branches-heading em {
  font-style: italic;
  color: var(--red);
}

.branches-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  gap: 24px;
  align-items: start;
  margin-bottom: 60px;
}

.branch-card {
  border: 2px solid var(--navy);
  border-radius: 60px;
  padding: 40px 28px;
  text-align: center;
  position: relative;
  transition: transform 0.42s var(--ease-out), box-shadow 0.42s var(--ease-out), border-color 0.3s ease, background 0.3s ease;
}

.branch-card:hover {
  box-shadow: var(--shadow-strong);
  transform: translateY(-8px);
}

.branch-center {
  border-color: var(--red);
  background: rgba(200,16,46,0.02);
  transform: translateY(-10px);
}

.branch-center:hover {
  transform: translateY(-14px);
}

.branch-type {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 26px;
  color: var(--navy);
  margin-bottom: 6px;
}

.branch-name {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 14px;
}

.branch-card p {
  font-size: 14px;
  line-height: 1.65;
  color: #555;
}

.branch-you {
  margin-top: 14px;
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 13px;
  color: var(--red);
  font-weight: 600;
}

.branches-closing {
  text-align: center;
  font-family: var(--font-serif);
  font-size: clamp(15px, 2vw, 18px);
  line-height: 1.75;
  color: var(--navy);
  max-width: 720px;
  margin: 0 auto;
}

/* SENATE STRUCTURE */
.structure-section {
  padding: 100px 60px;
  background: var(--navy);
}

.structure-header {
  text-align: center;
  margin-bottom: 60px;
}

.structure-header h2 {
  font-family: var(--font-display);
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 20px;
}

.structure-header h2 em {
  font-style: italic;
  color: var(--red);
  font-family: var(--font-italic);
  text-transform: none;
}

.structure-header .section-label {
  color: rgba(200,16,46,0.9);
}

.structure-header .divider {
  background: var(--red);
}

.structure-grid {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.structure-card {
  background: var(--white);
  border-radius: 8px;
  padding: 36px 28px;
  border-top: 4px solid var(--red);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
  transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
}

.structure-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 64px rgba(0, 0, 0, 0.24);
}

.structure-card-title {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 20px;
}

.structure-card ul {
  list-style: none;
  padding: 0;
}

.structure-card ul li {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--navy);
  padding: 8px 0;
  border-bottom: 1px solid var(--light-gray);
  line-height: 1.4;
}

.structure-card ul li:last-child {
  border-bottom: none;
}

.structure-card ul li strong {
  color: var(--red);
}

/* SENATORS */
.senators-section {
  padding: 100px 60px;
  background: var(--off-white);
}

.senators-inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.senators-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 20px;
}

.senators-header h2 em {
  font-style: italic;
  color: var(--red);
}

.senators-header p {
  font-size: 15px;
  color: #666;
  margin-top: 12px;
}

.senators-buttons {
  display: flex;
  gap: 24px;
  justify-content: center;
  margin-top: 48px;
  flex-wrap: wrap;
}

.senator-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--navy);
  border-radius: 60px;
  padding: 32px 48px;
  min-width: 270px;
  transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out), background 0.3s ease, border-color 0.3s ease;
  text-decoration: none;
  color: inherit;
}

.senator-btn:hover {
  background: var(--navy);
  border-color: var(--navy);
  transform: translateY(-6px);
  box-shadow: var(--shadow-strong);
}

.senator-btn:hover .senator-btn-script {
  color: var(--white);
}

.senator-btn:hover .senator-btn-sub {
  color: rgba(255,255,255,0.7);
}

.senator-btn-script {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 28px;
  line-height: 1.1;
  text-align: center;
  color: var(--red);
  margin-bottom: 8px;
  transition: color 0.3s;
}

.senator-btn-sub {
  font-size: 12px;
  line-height: 1.35;
  text-align: center;
  color: #777;
  letter-spacing: 0.5px;
  transition: color 0.3s;
}

/* RESPONSIVE ABOUT */
@media (max-width: 900px) {
  .about-hero { padding: 60px 24px 40px; }
  .charter-section { padding: 60px 24px; }
  .charter-body { grid-template-columns: 1fr; }
  .charter-photo { max-width: 320px; margin: 0 auto; }
  .charter-photo img {
    height: auto;
    aspect-ratio: 4 / 5;
  }
  .charter-quote { padding-left: 18px; }
  .branches-section { padding: 60px 24px; }
  .branches-grid { grid-template-columns: 1fr; }
  .branch-center { transform: none; }
  .branch-center:hover { transform: translateY(-4px); }
  .structure-section { padding: 60px 24px; }
  .structure-grid { grid-template-columns: 1fr; }
  .senators-section { padding: 60px 24px; }
  .senators-buttons { flex-direction: column; align-items: center; }
}

/* Mobile polish overrides */
@media (max-width: 600px) {
  .about-hero,
  .charter-section,
  .branches-section,
  .structure-section,
  .senators-section {
    padding-left: 18px;
    padding-right: 18px;
  }

  .about-title {
    font-size: clamp(44px, 15vw, 64px);
  }

  .about-tagline {
    font-size: 19px;
  }

  .charter-quote {
    font-size: 15px;
    line-height: 1.7;
    padding-left: 16px;
  }

  .branches-grid,
  .structure-grid {
    gap: 18px;
  }

  .branch-card {
    border-radius: 24px;
    padding: 30px 22px;
  }

  .branch-center,
  .branch-center:hover {
    transform: none;
  }

  .structure-card {
    padding: 28px 22px;
  }

  .senator-btn {
    width: 100%;
    min-width: 0;
    padding: 28px 22px;
    border-radius: 28px;
  }
}


/* ===== calendar.css ===== */
/* ============================================
   CALENDAR PAGE STYLES
   ============================================ */

.cal-hero {
  padding: 80px 60px 60px;
  background:
    linear-gradient(120deg, rgba(10, 34, 64, 0.05) 0 18%, transparent 18%),
    var(--white);
  text-align: center;
  border-bottom: 1px solid var(--light-gray);
}

.cal-hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(48px, 7vw, 80px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
  line-height: 1;
}

.cal-hero h1 em {
  font-style: italic;
  color: var(--red);
}

.cal-hero p {
  font-size: 16px;
  color: #666;
  margin-top: 12px;
}

/* EMBED SECTION */
.cal-embed-section {
  padding: 80px 60px;
  background: var(--off-white);
}

.cal-embed-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.cal-embed-header {
  text-align: center;
  margin-bottom: 48px;
}

.cal-embed-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
}

.cal-embed-header h2 em {
  font-style: italic;
  color: var(--red);
}

.cal-embed-header p {
  font-size: 15px;
  color: #666;
  max-width: 600px;
  margin: 0 auto;
}

.cal-embed-frame {
  border: 2px solid var(--navy);
  border-radius: 8px;
  overflow: hidden;
  background: var(--white);
  box-shadow: var(--shadow-soft);
}

/* EVENTS LIST */
.events-section {
  padding: 80px 60px;
  background: var(--white);
}

.events-inner {
  max-width: 800px;
  margin: 0 auto;
}

.events-header {
  text-align: center;
  margin-bottom: 48px;
}

.events-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
}

.events-header h2 em {
  font-style: italic;
  color: var(--red);
}

.events-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.event-item {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 24px 0;
  border-bottom: 1px solid var(--light-gray);
  transition: transform 0.3s var(--ease-out), padding-left 0.3s var(--ease-out), background 0.3s ease;
}

.event-item:hover {
  padding-left: 12px;
  background: rgba(10, 34, 64, 0.025);
  transform: translateX(4px);
}

.event-date {
  text-align: center;
  background: var(--navy);
  border-radius: 8px;
  padding: 10px 8px;
}

.event-month {
  display: block;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  color: rgba(255,255,255,0.6);
  text-transform: uppercase;
}

.event-day {
  display: block;
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 900;
  color: var(--white);
  line-height: 1.2;
}

.event-details h3 {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--navy);
  margin-bottom: 4px;
}

.event-details p {
  font-size: 13px;
  color: #777;
  line-height: 1.5;
}

.event-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  background: rgba(10,34,64,0.08);
  color: var(--navy);
  padding: 5px 12px;
  border-radius: 4px;
  white-space: nowrap;
}

.event-tag-special {
  background: rgba(200,16,46,0.1);
  color: var(--red);
}

.event-tag-week {
  background: var(--navy);
  color: var(--white);
}

.events-note {
  text-align: center;
  margin-top: 36px;
  font-size: 14px;
  color: var(--gray);
  font-style: italic;
}

@media (max-width: 768px) {
  .cal-hero { padding: 60px 24px 40px; }
  .cal-embed-section { padding: 60px 24px; }
  .events-section { padding: 60px 24px; }
  .event-item { grid-template-columns: 70px 1fr; }
  .event-tag { display: none; }
}

/* Mobile polish overrides */
@media (max-width: 560px) {
  .cal-hero,
  .cal-embed-section,
  .events-section {
    padding-left: 18px;
    padding-right: 18px;
  }

  .cal-hero h1 {
    font-size: clamp(42px, 15vw, 60px);
  }

  .cal-embed-frame {
    border-width: 1px;
  }

  .event-item {
    grid-template-columns: 64px 1fr;
    gap: 16px;
    padding: 20px 0;
  }
}


/* ===== legislative.css ===== */
/* ============================================
   LEGISLATIVE CATALOGUE PAGE
   ============================================ */

.leg-hero {
  padding: 80px 60px 60px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px),
    var(--navy);
  background-size: 34px 34px, auto;
  text-align: center;
}

.leg-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(44px, 7vw, 80px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
  line-height: 1.05;
}

.leg-hero h1 em {
  font-style: italic;
  color: var(--red);
  font-family: var(--font-italic);
  text-transform: none;
}

.leg-hero .section-label { color: rgba(200,16,46,0.9); }
.leg-hero .divider { background: var(--red); }

.leg-sub {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 20px;
  color: rgba(255,255,255,0.7);
  margin-top: 16px;
}

/* WHAT IS IT */
.leg-what {
  background: var(--off-white);
  padding: 60px;
}

.leg-what-inner {
  max-width: 800px;
  margin: 0 auto;
}

.leg-definition {
  border: 2px solid var(--navy);
  border-radius: 8px;
  padding: 40px 48px;
  text-align: center;
  background: rgba(255, 255, 255, 0.65);
  box-shadow: var(--shadow-soft);
}

.leg-definition p {
  font-family: var(--font-serif);
  font-size: clamp(16px, 2.2vw, 20px);
  line-height: 1.7;
  color: var(--navy);
  font-weight: 500;
}

/* ACCESS */
.leg-access {
  padding: 80px 60px;
  background: var(--white);
}

.leg-access-inner {
  max-width: 900px;
  margin: 0 auto;
}

.leg-access-header {
  text-align: center;
  margin-bottom: 48px;
}

.leg-access-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
}

.leg-access-header h2 em {
  font-style: italic;
  color: var(--red);
}

.leg-doc-card {
  display: flex;
  align-items: center;
  gap: 28px;
  border: 2px solid var(--light-gray);
  border-radius: 8px;
  padding: 36px;
  transition: transform 0.42s var(--ease-out), box-shadow 0.42s var(--ease-out), border-color 0.3s ease;
}

.leg-doc-card:hover {
  border-color: var(--navy);
  box-shadow: var(--shadow-strong);
  transform: translateY(-6px);
}

.leg-doc-icon {
  font-size: 48px;
  flex-shrink: 0;
}

.leg-doc-info {
  flex: 1;
}

.leg-doc-info h3 {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 8px;
}

.leg-doc-info p {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
}

/* SUBMIT */
.leg-submit {
  padding: 80px 60px;
  background: var(--navy);
}

.leg-submit-inner {
  max-width: 900px;
  margin: 0 auto;
}

.leg-submit-header {
  text-align: center;
  margin-bottom: 60px;
}

.leg-submit-header h2 {
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.leg-submit-header h2 em {
  font-style: italic;
  color: var(--red);
  font-family: var(--font-italic);
  text-transform: none;
}

.leg-submit-header .section-label { color: rgba(200,16,46,0.9); }
.leg-submit-header .divider { background: var(--red); }

.leg-submit-header p {
  color: rgba(255,255,255,0.7);
  font-size: 15px;
  max-width: 600px;
  margin: 0 auto;
}

.leg-submit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.leg-submit-card {
  background: var(--white);
  border-radius: 8px;
  padding: 48px 36px;
  text-align: center;
  border: 2px solid transparent;
  transition: transform 0.42s var(--ease-out), box-shadow 0.42s var(--ease-out), border-color 0.3s ease;
}

.leg-submit-card:hover {
  border-color: var(--red);
  transform: translateY(-8px);
  box-shadow: 0 26px 58px rgba(0, 0, 0, 0.22);
}

.leg-submit-icon {
  font-size: 40px;
  margin-bottom: 16px;
}

.leg-submit-type {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 13px;
  color: var(--gray);
  letter-spacing: 1px;
  margin-bottom: 4px;
}

.leg-submit-name {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 30px;
  color: var(--red);
  margin-bottom: 12px;
}

.leg-submit-card p {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .leg-hero { padding: 60px 24px 40px; }
  .leg-what { padding: 40px 24px; }
  .leg-definition { padding: 28px 24px; }
  .leg-access { padding: 60px 24px; }
  .leg-doc-card { flex-direction: column; text-align: center; }
  .leg-submit { padding: 60px 24px; }
  .leg-submit-grid { grid-template-columns: 1fr; }
}

/* Mobile polish overrides */
@media (max-width: 560px) {
  .leg-hero,
  .leg-what,
  .leg-access,
  .leg-submit {
    padding-left: 18px;
    padding-right: 18px;
  }

  .leg-hero h1 {
    font-size: clamp(40px, 14vw, 58px);
  }

  .leg-definition {
    border-radius: 8px;
    padding: 24px 20px;
  }

  .leg-doc-card,
  .leg-submit-card {
    padding: 28px 22px;
    border-radius: 8px;
  }
}


/* ===== funding.css ===== */
/* ============================================
   FUNDING PAGE
   ============================================ */

.fund-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 60px;
  padding: 80px 60px 80px;
  background:
    linear-gradient(120deg, rgba(10, 34, 64, 0.05) 0 18%, transparent 18%),
    var(--white);
  border-bottom: 1px solid var(--light-gray);
}

.fund-hero-left h1 {
  font-family: var(--font-display);
  font-size: clamp(52px, 8vw, 96px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 12px;
}

.fund-hero-left h1 em {
  color: var(--red);
  font-style: italic;
  font-family: var(--font-italic);
  text-transform: none;
}

.fund-tagline {
  font-family: var(--font-italic);
  font-style: italic;
  font-size: 20px;
  color: var(--red);
  font-weight: 600;
  margin-bottom: 20px;
}

.fund-tagline em {
  font-style: italic;
}

.fund-desc {
  font-size: 15px;
  line-height: 1.75;
  color: #555;
  max-width: 520px;
  margin-bottom: 32px;
}

.fund-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.fund-hero-right {
  flex-shrink: 0;
}

/* the flat crest that used to sit here is now the HUSA seal medallion —
   see BRAND MARKS at the end of this file */

@keyframes fundingMark {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-8px) rotate(-1.5deg); }
}

/* HOW IT WORKS */
.fund-steps {
  padding: 80px 60px;
  background: var(--navy);
}

.fund-steps-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.fund-steps-header {
  text-align: center;
  margin-bottom: 60px;
}

.fund-steps-header h2 {
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.fund-steps-header h2 em {
  font-style: italic;
  color: var(--red);
  font-family: var(--font-italic);
  text-transform: none;
}

.fund-steps-header .section-label { color: rgba(200,16,46,0.9); }
.fund-steps-header .divider { background: var(--red); }

.fund-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.fund-step {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 32px 24px;
  transition: transform 0.4s var(--ease-out), background 0.3s ease, border-color 0.3s ease;
}

.fund-step:hover {
  background: rgba(255,255,255,0.09);
  border-color: var(--red);
  transform: translateY(-7px);
}

.fund-step-num {
  font-family: var(--font-display);
  font-size: 48px;
  font-weight: 900;
  color: var(--red);
  opacity: 0.5;
  line-height: 1;
  margin-bottom: 16px;
}

.fund-step h3 {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--white);
  margin-bottom: 10px;
}

.fund-step p {
  font-size: 13px;
  color: rgba(255,255,255,0.65);
  line-height: 1.65;
}

/* QUICK LINKS */
.fund-links {
  padding: 80px 60px;
  background: var(--off-white);
}

.fund-links-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.fund-links-header {
  text-align: center;
  margin-bottom: 48px;
}

.fund-links-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
}

.fund-links-header h2 em {
  font-style: italic;
  color: var(--red);
}

.fund-links-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.fund-link-card {
  display: flex;
  flex-direction: column;
  border: 1.5px solid var(--light-gray);
  border-radius: 8px;
  padding: 36px 28px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.42s var(--ease-out), box-shadow 0.42s var(--ease-out), border-color 0.3s ease;
  position: relative;
  overflow: hidden;
}

.fund-link-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--red);
  transform: scaleX(0);
  transition: transform 0.3s;
}

.fund-link-card:hover::before { transform: scaleX(1); }

.fund-link-card:hover {
  border-color: transparent;
  box-shadow: var(--shadow-strong);
  transform: translateY(-8px);
}

.fund-link-icon {
  font-size: 36px;
  margin-bottom: 16px;
}

.fund-link-card h3 {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 10px;
}

.fund-link-card p {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  flex: 1;
}

/* CONTACT CTA */
.fund-contact {
  background: var(--red);
  padding: 80px 60px;
}

.fund-contact-inner {
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
}

.fund-contact-inner h2 {
  font-family: var(--font-serif);
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 700;
  color: var(--white);
  margin-bottom: 16px;
}

.fund-contact-inner h2 em {
  font-style: italic;
}

.fund-contact-inner p {
  font-size: 16px;
  color: rgba(255,255,255,0.8);
}

.fund-contact-inner .btn-solid {
  background: var(--white);
  color: var(--red);
  border-color: var(--white);
}

.fund-contact-inner .btn-solid:hover {
  background: transparent;
  color: var(--white);
  border-color: var(--white);
}

@media (max-width: 900px) {
  .fund-hero {
    grid-template-columns: 1fr;
    padding: 60px 24px;
    text-align: center;
  }
  .fund-hero-right { display: none; }
  .fund-buttons { justify-content: center; }
  .fund-desc { margin: 0 auto 32px; }
  .fund-steps { padding: 60px 24px; }
  .fund-steps-grid { grid-template-columns: 1fr 1fr; }
  .fund-links { padding: 60px 24px; }
  .fund-links-grid { grid-template-columns: 1fr; }
  .fund-contact { padding: 60px 24px; }
}

@media (max-width: 600px) {
  .fund-steps-grid { grid-template-columns: 1fr; }
}

/* Mobile polish overrides */
@media (max-width: 600px) {
  .fund-hero {
    padding: 54px 18px;
  }

  .fund-hero-left h1 {
    font-size: clamp(46px, 17vw, 66px);
  }

  .fund-tagline {
    font-size: 18px;
  }

  .fund-buttons {
    flex-direction: column;
    align-items: center;
  }

  .fund-step,
  .fund-link-card {
    padding: 28px 22px;
  }
}


/* ===== resources.css ===== */
/* ============================================
   STUDENT RESOURCES PAGE
   ============================================ */

.res-hero {
  padding: 80px 60px 70px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px),
    var(--navy);
  background-size: 34px 34px, auto;
  text-align: center;
}

.res-hero-content {
  max-width: 860px;
  margin: 0 auto;
}

.res-hero .section-label {
  color: rgba(200, 16, 46, 0.95);
}

.res-hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(44px, 7vw, 82px);
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  margin-bottom: 20px;
}

.res-hero h1 em {
  color: var(--red);
  font-style: italic;
}

.res-hero .divider {
  background: var(--red);
}

.res-hero p {
  color: rgba(255, 255, 255, 0.75);
  font-size: 16px;
  line-height: 1.75;
}

.res-services {
  padding: 90px 60px;
  background: var(--off-white);
}

.res-services-inner {
  max-width: 1160px;
  margin: 0 auto;
}

.res-services-header {
  text-align: center;
  margin-bottom: 54px;
}

.res-services-header h2 {
  font-family: var(--font-serif);
  font-size: clamp(34px, 5vw, 56px);
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 18px;
}

.res-services-header h2 em {
  color: var(--red);
  font-style: italic;
}

.res-services-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.res-card {
  background: var(--white);
  border: 1px solid var(--light-gray);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
  transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
}

.res-card:hover {
  transform: translateY(-7px);
  box-shadow: var(--shadow-strong);
}

.res-card-header {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px 28px;
  background: var(--navy);
  color: var(--white);
}

.res-card-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--red);
  font-size: 22px;
  flex: 0 0 auto;
}

.res-card h3 {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.res-card-body {
  padding: 28px;
  display: grid;
  gap: 22px;
}

.res-card-row {
  display: grid;
  grid-template-columns: 108px 1fr;
  gap: 18px;
  color: #555;
  font-size: 14px;
  line-height: 1.6;
}

.res-card-label {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--red);
}

.res-card a {
  color: var(--navy);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(200, 16, 46, 0.35);
  text-underline-offset: 3px;
}

.res-card small {
  color: var(--gray);
}

.scholarship-card {
  grid-column: 1 / -1;
}

.scholarship-card:hover {
  transform: none;
  box-shadow: var(--shadow-soft);
}

.scholarship-card .res-card-body {
  gap: 20px;
}

.scholarship-copy {
  max-width: 760px;
  color: #555;
  font-size: 15px;
  line-height: 1.7;
}

.scholarship-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.scholarship-option {
  --scholarship-start: var(--navy);
  --scholarship-end: var(--red);
  position: relative;
  display: flex;
  min-height: 212px;
  flex-direction: column;
  gap: 10px;
  padding: 22px;
  border-radius: 10px;
  border: 1px solid rgba(10,34,64,.12);
  background:
    radial-gradient(105% 90% at 100% 0%, rgba(200,16,46,.08), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,249,246,.96));
  overflow: hidden;
  box-shadow: 0 16px 34px -28px rgba(10,34,64,.45);
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.scholarship-option::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--scholarship-start), var(--scholarship-end));
}

.scholarship-option:hover,
.scholarship-option:focus-within {
  border-color: rgba(10,34,64,.24);
  box-shadow: 0 22px 42px -30px rgba(10,34,64,.62);
}

.scholarship-tag {
  width: max-content;
  padding: 5px 9px;
  border: 1px solid rgba(10,34,64,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  color: var(--scholarship-start);
  font-family: var(--font-mono, var(--font-body));
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.scholarship-option h4 {
  margin: 4px 0 0;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .03em;
  line-height: 1.15;
  text-transform: uppercase;
  color: var(--navy);
}

.scholarship-option p {
  flex: 1;
  margin: 0;
  color: #555;
  font-size: 13.5px;
  line-height: 1.55;
}

.scholarship-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 0 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--scholarship-start), var(--scholarship-end));
  box-shadow: 0 14px 28px -18px rgba(10,34,64,.7);
  color: var(--white) !important;
  font-family: var(--font-mono, var(--font-body));
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-decoration: none !important;
  text-transform: uppercase;
  transition: filter .2s ease, box-shadow .2s ease;
}

.scholarship-button:hover,
.scholarship-button:focus-visible {
  box-shadow: 0 18px 34px -18px rgba(10,34,64,.8);
  filter: saturate(1.08) brightness(1.03);
}

.scholarship-howard {
  --scholarship-start: #0A2240;
  --scholarship-end: #C8102E;
}

.scholarship-tmcf {
  --scholarship-start: #053A70;
  --scholarship-end: #D79A2B;
}

.scholarship-cbcf {
  --scholarship-start: #111827;
  --scholarship-end: #8A1538;
}

@media (max-width: 900px) {
  .res-hero {
    padding: 60px 24px 52px;
  }

  .res-services {
    padding: 60px 24px;
  }

  .res-services-grid {
    grid-template-columns: 1fr;
  }

  .scholarship-actions {
    grid-template-columns: 1fr;
  }

  .scholarship-option {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .res-card-header {
    padding: 22px;
  }

  .res-card-body {
    padding: 22px;
  }

  .res-card-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

/* Mobile polish overrides */
@media (max-width: 560px) {
  .res-hero {
    padding: 54px 18px 46px;
  }

  .res-hero h1 {
    font-size: clamp(42px, 15vw, 60px);
  }

  .res-hero p {
    font-size: 15px;
  }

  .res-services {
    padding: 54px 18px;
  }
}


/* ===== senators.css ===== */
/* ============================================
   SENATOR DIRECTORY PAGES
   ============================================ */

.senator-page {
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(10, 34, 64, 0.035), transparent 260px),
    var(--white);
}

.senator-hero {
  padding: 86px 24px 46px;
  text-align: center;
  border-top: 3px solid var(--navy);
  position: relative;
  overflow: hidden;
}

.senator-hero::before,
.senator-hero::after {
  content: '';
  position: absolute;
  height: 2px;
  background: var(--red);
  opacity: 0.35;
  transform: skewX(-28deg);
}

.senator-hero::before {
  width: 220px;
  top: 42px;
  left: 8%;
}

.senator-hero::after {
  width: 300px;
  right: 7%;
  bottom: 20px;
}

.senator-title {
  font-family: var(--font-italic);
  font-size: clamp(82px, 11vw, 154px);
  font-weight: 300;
  font-style: italic;
  line-height: 0.78;
  color: var(--navy);
  margin-bottom: 22px;
  text-shadow: 0 16px 34px rgba(10, 34, 64, 0.10);
}

.senator-copy {
  max-width: 760px;
  margin: 0 auto;
  font-family: var(--font-serif);
  font-size: clamp(17px, 1.4vw, 24px);
  font-weight: 800;
  line-height: 1.45;
  color: var(--navy);
}

.senator-footer {
  margin-top: 0;
}

@media (max-width: 900px) {
  .senator-hero {
    padding-top: 54px;
  }

  .senator-title {
    line-height: 0.9;
  }

  .senator-copy{
    max-width: 620px;
  }

}

@media (max-width: 560px) {
  .senator-hero {
    padding: 44px 18px 30px;
  }

  .senator-title {
    font-size: clamp(58px, 22vw, 92px);
  }

  .senator-copy{
    font-size: 16px;
  }
}

/* Mobile polish overrides */
@media (max-width: 560px) {
  .senator-hero {
    padding: 44px 18px 28px;
  }

  .senator-copy {
    line-height: 1.55;
  }
}


/* ===== one-page organization ===== */
.site-page {
  scroll-margin-top: 64px;
}
.site-page:not(:first-of-type) {
  border-top: 1px solid rgba(10, 34, 64, 0.08);
}
.site-page > .page-header:first-child {
  margin-top: 0;
}
.nav-links a.active {
  color: var(--white);
}


/* ============================================================
   ✦ PREMIUM ELEVATION LAYER — "THE CHAMBER"
   Civic-tech upgrade for HUSA Senate · navy / red / white / cream
   (appended; overrides base rules by source order)
   ============================================================ */
:root{
  --navy-deep:#071a31;
  --navy-900:#04101f;
  --red-bright:#ff3b56;
  --red-glow:rgba(200,16,46,.55);
  --font-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --radius:14px;
  --radius-lg:22px;
  --hairline:rgba(10,34,64,.10);
  --hairline-on-dark:rgba(255,255,255,.12);
  --glass-light:rgba(255,255,255,.62);
  --glass-dark:rgba(255,255,255,.045);
  --shadow-glass:0 24px 60px -26px rgba(6,22,41,.5);
  --shadow-float:0 50px 100px -36px rgba(6,22,41,.6);
  --grad-red:linear-gradient(135deg,#d2122f 0%,#a00d25 100%);
  --grad-chamber:
    radial-gradient(120% 120% at 82% -10%, rgba(26,58,92,.6) 0%, transparent 55%),
    radial-gradient(100% 100% at 8% 112%, rgba(200,16,46,.22) 0%, transparent 52%),
    linear-gradient(168deg,#0a2240 0%,#071a31 56%,#04101f 100%);
}

/* —— Fine top scroll-progress —— */
.scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:100%;
  transform:scaleX(var(--sp,0));transform-origin:0 50%;
  background:linear-gradient(90deg,var(--red),var(--red-bright));
  box-shadow:0 0 14px var(--red-glow);
  z-index:2000;pointer-events:none;
  transition:transform .12s linear;
}

/* —— Global film grain (very subtle) —— */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:1400;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* —— Glass utilities —— */
.glass{background:var(--glass-light);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);border:1px solid var(--hairline);box-shadow:var(--shadow-glass);}
.glass-dark{background:var(--glass-dark);backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);border:1px solid var(--hairline-on-dark);}

/* —— Mono civic label (site-wide .section-label) —— */
.section-label{
  font-family:var(--font-mono);font-weight:500;font-size:11px;
  letter-spacing:2.5px;text-transform:uppercase;color:var(--red);
  display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;
}
.section-label::before{content:'';width:22px;height:1px;background:currentColor;opacity:.6;}

/* —— Divider refined —— */
.divider{height:2px;width:66px;background:linear-gradient(90deg,transparent,var(--red),transparent);box-shadow:none;}
.divider-left{background:linear-gradient(90deg,var(--red),transparent);}

/* —— Buttons: sheen sweep + premium depth —— */
.btn-solid,.btn-solid-navy,.btn-outline,.btn-outline-white{position:relative;overflow:hidden;border-radius:11px;}
.btn-solid{background:var(--grad-red);border-color:transparent;letter-spacing:2px;
  box-shadow:0 16px 32px -12px var(--red-glow), inset 0 1px 0 rgba(255,255,255,.2);}
.btn-solid:hover{background:var(--grad-red);box-shadow:0 22px 42px -12px var(--red-glow), inset 0 1px 0 rgba(255,255,255,.25);}
.btn-solid::after,.btn-solid-navy::after,.btn-outline-white::after{
  content:'';position:absolute;top:0;left:-160%;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);
  transform:skewX(-18deg);transition:left .75s var(--ease-out);pointer-events:none;}
.btn-solid:hover::after,.btn-solid-navy:hover::after,.btn-outline-white:hover::after{left:170%;}

/* —— Navigation: glass command bar —— */
.nav{
  background:linear-gradient(to bottom, rgba(7,22,41,.9), rgba(7,22,41,.74));
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:0 32px;
}
.nav.scrolled{
  background:linear-gradient(to bottom, rgba(6,18,34,.97), rgba(6,18,34,.88));
  border-color:rgba(200,16,46,.32);
  box-shadow:0 18px 44px -20px rgba(0,0,0,.7);
}
.nav-logo img{filter:drop-shadow(0 4px 14px rgba(0,0,0,.35));}
.nav-links{gap:2px;}

/* Primary nav CTA */
.nav-links a.nav-cta{
  display:inline-flex;align-items:center;gap:8px;margin-left:10px;padding:9px 18px;border-radius:10px;
  background:var(--grad-red);color:#fff;
  font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  box-shadow:0 12px 26px -12px var(--red-glow);overflow:hidden;
  transition:transform .25s var(--ease-spring),box-shadow .25s ease;
}
.nav-links a.nav-cta:hover{background:var(--grad-red);color:#fff;transform:translateY(-2px);box-shadow:0 18px 32px -12px var(--red-glow);}
.nav-links a.nav-cta::after{
  content:'';position:absolute;top:0;left:-160%;right:auto;bottom:auto;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-18deg);transition:left .75s var(--ease-out);
}
.nav-links a.nav-cta:hover::after{left:170%;transform:skewX(-18deg);}

/* Mobile menu CTA */
.mobile-menu .m-cta{color:var(--red)!important;font-weight:700;}

/* —— Reveal: soft focus-in —— */
.reveal{filter:blur(6px);transition:opacity .85s var(--ease-out),transform .85s var(--ease-out),filter .85s var(--ease-out);}
.reveal.visible{filter:blur(0);}

/* === ELEVATION: CORE+NAV END === */

/* ============================================================
   ✦ ICON SYSTEM — line-icons replacing emoji glyphs
   ============================================================ */
.explore-card-icon,
.leg-doc-icon,
.leg-submit-icon,
.fund-link-icon,
.res-card-icon{
  display:inline-flex;align-items:center;justify-content:center;
}
.explore-card-icon{width:30px;height:30px;color:var(--red);}
.leg-doc-icon{width:48px;height:48px;color:var(--navy);}
.leg-submit-icon{width:38px;height:38px;color:var(--red);}
.fund-link-icon{width:32px;height:32px;color:var(--navy);}
.explore-card-icon svg,
.leg-doc-icon svg,
.leg-submit-icon svg,
.fund-link-icon svg,
.res-card-icon svg{width:100%;height:100%;}
.res-card-icon svg{width:22px;height:22px;}

/* ============================================================
   ✦ ELEVATION: HOME
   ============================================================ */
.hero{ padding-top:98px; }
.hero::before{ top:98px; }

.hero-aurora{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hero-aurora::before,
.hero-aurora::after{ content:''; position:absolute; border-radius:50%; filter:blur(70px); }
.hero-aurora::before{
  width:46vw; height:46vw; top:-16%; right:-10%;
  background:radial-gradient(circle, rgba(200,16,46,.16), transparent 70%);
  animation:auroraDrift1 17s ease-in-out infinite;
}
.hero-aurora::after{
  width:38vw; height:38vw; bottom:-18%; left:-8%;
  background:radial-gradient(circle, rgba(10,34,64,.14), transparent 70%);
  animation:auroraDrift2 21s ease-in-out infinite;
}
@keyframes auroraDrift1{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-26px,20px) scale(1.08);} }
@keyframes auroraDrift2{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(22px,-18px) scale(1.06);} }

.hero-ticker{
  position:absolute; top:64px; left:0; right:0; height:34px; z-index:2;
  overflow:hidden; background:var(--navy-deep);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.hero-ticker-track{
  display:flex; align-items:center; gap:44px; height:100%;
  white-space:nowrap; width:max-content; padding-left:44px;
  animation:tickerScroll 28s linear infinite;
  font-family:var(--font-italic); font-size:15px; font-style:italic; font-weight:400;
  letter-spacing:.04em; color:rgba(255,255,255,.62);
}
.hero-ticker-track span::before{ content:'·'; color:rgba(242,239,232,.55); margin-right:14px; font-size:18px; vertical-align:-1px; }
@keyframes tickerScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.hero-logo-wrap{ perspective:900px; animation:none; }
.hero-logo{
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .25s var(--ease-out);
}

@media (max-width:768px){
  .hero{ padding-top:92px; }
  .hero::before{ top:92px; }
  .hero-ticker{ top:58px; }
  .hero-ticker-track{ font-size:14px; gap:30px; }
}
@media (max-width:600px){
  .hero-scroll-hint{ display:none; }
}

/* What-section image: glass glow ring */
.what-image-frame{
  box-shadow:var(--shadow-float), 0 0 0 1px rgba(200,16,46,.18);
}
.what-image{ position:relative; }
.what-image::before{
  content:''; position:absolute; inset:-18px; z-index:-1; border-radius:var(--radius-lg);
  background:radial-gradient(circle at 30% 30%, rgba(200,16,46,.18), transparent 60%);
  filter:blur(28px); opacity:.8;
}

/* Stats: glass cards */
.stats-strip{
  background:var(--grad-chamber);
  border-top:none; position:relative; overflow:hidden;
}
.stats-strip::before{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:100% 36px; pointer-events:none;
}
.stat{
  position:relative; z-index:1; padding:18px 26px; border-radius:var(--radius);
  transition:transform .4s var(--ease-spring), background .3s ease;
}
.stat:hover{ background:rgba(255,255,255,.04); transform:translateY(-5px); }
.stat-num{ color:var(--white); text-shadow:0 8px 24px rgba(0,0,0,.3); }
.stat-label{ color:rgba(255,255,255,.55); }
.stat-divider{ background:rgba(255,255,255,.14); }

/* Explore cards: badge icon + tilt-ready */
.explore-card-icon{
  width:52px; height:52px; border-radius:50%;
  background:rgba(200,16,46,.07); border:1px solid rgba(200,16,46,.18);
  margin-bottom:20px; padding:13px;
}
.explore-card{
  transform-style:preserve-3d; will-change:transform;
  border-color:var(--hairline);
}
.explore-card:hover{ border-color:rgba(200,16,46,.3); }

/* ============================================================
   ✦ ELEVATION: ABOUT
   ============================================================ */
.charter-section{ background:var(--grad-chamber); position:relative; overflow:hidden; }
.charter-inner{ position:relative; }
.charter-quote{ position:relative; z-index:1; }
.charter-quote::before{
  content:'"'; position:absolute; top:-64px; left:-12px; z-index:0;
  font-family:var(--font-serif); font-size:160px; font-weight:900;
  color:rgba(200,16,46,.16); line-height:1; pointer-events:none;
}
.charter-badge{
  font-family:var(--font-mono); letter-spacing:2px; border-radius:30px;
  box-shadow:0 14px 30px -10px var(--red-glow);
}

.branch-card{ position:relative; transform-style:preserve-3d; will-change:transform; border-color:rgba(10,34,64,.16); }
.branch-num{
  position:absolute; top:-18px; left:50%; transform:translateX(-50%);
  width:36px; height:36px; border-radius:50%;
  background:var(--white); border:2px solid var(--red); color:var(--red);
  font-family:var(--font-italic); font-style:italic; font-weight:600; font-size:16px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 20px -8px rgba(200,16,46,.4);
}
.branch-center .branch-num{ border-color:var(--navy); color:var(--navy); }

.structure-card{ position:relative; transform-style:preserve-3d; will-change:transform; }
.structure-card-num{
  position:absolute; top:20px; right:24px;
  font-family:var(--font-display); font-size:32px; font-weight:900;
  color:rgba(10,34,64,.08);
}

.senator-btn{ position:relative; overflow:hidden; }
.senator-btn::after{
  content:''; position:absolute; top:0; left:-160%; width:55%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);
  transform:skewX(-18deg); transition:left .75s var(--ease-out); pointer-events:none;
}
.senator-btn:hover::after{ left:170%; }

@media (max-width:600px){
  .charter-quote::before{ font-size:110px; top:-44px; left:-6px; }
}

/* ============================================================
   ✦ ELEVATION: CALENDAR + LEGISLATIVE
   ============================================================ */
.cal-embed-frame{ box-shadow:var(--shadow-float), 0 0 0 1px rgba(10,34,64,.12); border-color:transparent; }

.events-list{ position:relative; }
.events-list::before{
  content:''; position:absolute; left:40px; top:8px; bottom:8px; width:1px;
  background:linear-gradient(to bottom, transparent, var(--hairline) 8%, var(--hairline) 92%, transparent);
}
.event-date{
  position:relative; z-index:1; background:var(--grad-chamber);
  box-shadow:0 12px 24px -10px rgba(10,34,64,.4);
}
.event-item:hover .event-date{ box-shadow:0 16px 30px -10px var(--red-glow); }

.leg-hero{ background:var(--grad-chamber); }
.leg-definition{
  background:var(--glass-light); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%);
  border-color:var(--hairline); box-shadow:var(--shadow-glass);
}
.leg-doc-card{ position:relative; transform-style:preserve-3d; will-change:transform; }
.leg-doc-icon{
  width:64px; height:64px; border-radius:50%; flex-shrink:0;
  background:rgba(10,34,64,.06); border:1px solid rgba(10,34,64,.14); padding:16px;
}
.leg-submit{ background:var(--grad-chamber); }
.leg-submit-card{ position:relative; transform-style:preserve-3d; will-change:transform; }
.leg-submit-icon{
  width:46px; height:46px; border-radius:50%; margin:0 auto 16px;
  background:rgba(200,16,46,.07); border:1px solid rgba(200,16,46,.18); padding:11px;
}

/* ============================================================
   ✦ ELEVATION: FUNDING, RESOURCES, SENATORS, FOOTER
   ============================================================ */

.fund-steps{ background:var(--grad-chamber); }
.fund-step{ position:relative; transform-style:preserve-3d; will-change:transform; }
.fund-step-num{ color:var(--red-bright); }

.fund-link-card{ position:relative; transform-style:preserve-3d; will-change:transform; }
.fund-link-icon{
  width:52px; height:52px; border-radius:50%;
  background:rgba(10,34,64,.06); border:1px solid rgba(10,34,64,.14); padding:13px;
}

.fund-contact{ background:linear-gradient(160deg, var(--red) 0%, var(--red-dark) 100%); position:relative; overflow:hidden; }
.fund-contact::before{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:100% 38px; pointer-events:none;
}
.fund-contact-inner{ position:relative; z-index:1; }

.res-hero{ background:var(--grad-chamber); }
.res-card{ position:relative; transform-style:preserve-3d; will-change:transform; border-color:var(--hairline); }
.res-card-header{ background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%); }
.res-card-icon{ box-shadow:0 10px 22px -8px var(--red-glow); }

/* Footer */
.footer{
  background:
    radial-gradient(120% 140% at 85% -20%, rgba(10,34,64,.35), transparent 55%),
    linear-gradient(155deg, var(--red) 0%, var(--red-dark) 70%, #7d0a1c 100%);
}
.footer::after{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.footer-logo img{ filter:drop-shadow(0 10px 18px rgba(0,0,0,.16)) drop-shadow(0 0 40px rgba(255,255,255,.12)); }
.footer-social a{
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  background:rgba(255,255,255,.06);
}
.footer-social a:hover{ background:rgba(255,255,255,.18); }

/* ============================================================
   ✦ PRELOADER / INTRO — "The Seal" spinning-logo gate
   ============================================================ */
body.pre-lock{ overflow:hidden; }

.preloader{
  position:fixed; inset:0; z-index:3000;
  display:flex; align-items:center; justify-content:center;
  background:var(--grad-chamber);
  transition:opacity .4s var(--ease-out), visibility .4s var(--ease-out);
}
.preloader::after{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.preloader.done{ opacity:0; visibility:hidden; pointer-events:none; }

.pre-inner{
  position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:30px;
  transition:opacity .95s var(--ease-out), transform .95s var(--ease-out);
}
.preloader.done .pre-inner{ opacity:0; transform:scale(.94) translateY(-8px); }

.pre-emblem{ position:relative; width:160px; height:160px; display:flex; align-items:center; justify-content:center; }
.pre-emblem img{
  width:96px; height:96px; object-fit:contain;
  filter:drop-shadow(0 14px 34px rgba(0,0,0,.5));
  animation:preSpinIn 2.3s var(--ease-out) both;
}

/* continuous spinning orbit ring — the "spin" */
.pre-orbit{ position:absolute; inset:0; width:100%; height:100%; animation:preOrbit 6.4s linear infinite; }
.pre-orbit circle{ fill:none; stroke:rgba(255,255,255,.16); stroke-width:1; stroke-dasharray:3 9; stroke-linecap:round; }
.pre-orbit .sat{ fill:var(--red-bright); stroke:none; filter:drop-shadow(0 0 6px var(--red-glow)); }

/* progress ring that draws itself once */
.pre-ring{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.pre-ring circle{
  fill:none; stroke:var(--red); stroke-width:2; stroke-linecap:round;
  stroke-dasharray:484; stroke-dashoffset:484;
  filter:drop-shadow(0 0 8px var(--red-glow));
  animation:preDraw 3.2s var(--ease-out) .35s both;
}

.pre-word{
  display:flex; gap:.1em; overflow:hidden; padding:.2em 0;
  font-family:var(--font-mono); font-weight:600; font-size:23px;
  letter-spacing:.34em; color:var(--white);
}
.pre-word span{ display:inline-block; transform:translateY(120%); animation:preLetter .9s var(--ease-out) both; }

.pre-tag{
  font-family:var(--font-italic); font-style:italic; font-size:18px;
  color:rgba(255,255,255,.62); letter-spacing:.5px;
  opacity:0; animation:preTag 1.2s var(--ease-out) 2.15s both;
}

@keyframes preSpinIn{
  0%{ transform:rotate(-540deg) scale(.3); opacity:0; }
  55%{ opacity:1; }
  100%{ transform:rotate(0deg) scale(1); opacity:1; }
}
@keyframes preOrbit{ to{ transform:rotate(360deg); } }
@keyframes preDraw{ to{ stroke-dashoffset:0; } }
@keyframes preLetter{ to{ transform:translateY(0); } }
@keyframes preTag{ to{ opacity:1; } }

@media (max-width:600px){
  .pre-emblem{ width:128px; height:128px; }
  .pre-emblem img{ width:74px; height:74px; }
  .pre-word{ font-size:17px; letter-spacing:.26em; }
  .pre-tag{ font-size:15px; }
  .pre-inner{ gap:24px; }
}

@media (prefers-reduced-motion:reduce){
  .preloader{ display:none; }
}

/* ============================================================
   ✦ ELEVATION: HERO FACADE — "The Founders Monument"
   Dark chamber hero · engraved facade · interactive wings
   ============================================================ */

/* —— hero flips to the chamber —— */
.hero{
  background:var(--grad-chamber);
}
.hero::before{ opacity:.4; }
.hero::after{ display:none; }
.hero-bg-pattern{
  background-image:
    repeating-linear-gradient(0deg, transparent, transparent 80px, rgba(255,255,255,.03) 80px, rgba(255,255,255,.03) 81px),
    repeating-linear-gradient(90deg, transparent, transparent 80px, rgba(255,255,255,.03) 80px, rgba(255,255,255,.03) 81px);
  mask-image:linear-gradient(to bottom, black, transparent 78%);
}
.hero-aurora::before{ background:radial-gradient(circle, rgba(200,16,46,.22), transparent 70%); }
.hero-aurora::after{ background:radial-gradient(circle, rgba(26,58,92,.5), transparent 70%); }

.hero-content{
  position:relative;
  z-index:2;
  padding:0 24px;
  max-width:820px;
  text-align:center;
}

/* the nav carries the crest — the spire crowns the hero instead */
.hero-logo-wrap{ display:none; }

.hero-overline{
  max-width:620px;
  margin:0 auto 18px;
  font-family:var(--font-serif);
  font-size:clamp(17px, 2vw, 24px);
  font-weight:400;
  line-height:1.35;
  letter-spacing:.08em;
  color:rgba(242,239,232,.78);
  text-wrap:balance;
}
.hero-overline span{
  display:inline-block;
  color:var(--white);
  font-style:italic;
  letter-spacing:.04em;
}
.hero-title{
  color:var(--white);
  font-size:clamp(46px, 6.8vw, 82px);
  text-shadow:0 18px 60px rgba(0,0,0,.45);
  margin-bottom:16px;
}
.hero-title em{ color:var(--red-bright); }

/* —— the motto, given its own stage —— */
.hero-motto{
  display:flex; align-items:center; justify-content:center;
  gap:20px; margin-bottom:38px;
}
.motto-rule{
  width:clamp(36px, 7vw, 84px); height:1px;
  background:linear-gradient(to right, transparent, rgba(242,239,232,.5));
}
.motto-rule:last-child{
  background:linear-gradient(to left, transparent, rgba(242,239,232,.5));
}
.motto-text{
  font-family:var(--font-italic); font-style:italic;
  font-size:clamp(23px, 3vw, 32px); font-weight:500;
  color:var(--cream); letter-spacing:.02em;
  text-shadow:0 10px 34px rgba(0,0,0,.4);
}
.motto-period{ color:var(--red-bright); font-style:normal; }

/* dark-hero buttons */
.hero .btn-outline-white{
  border-color:rgba(255,255,255,.8); color:var(--white);
  background:rgba(7,26,49,.5);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.hero .btn-outline-white:hover{
  background:var(--white); color:var(--navy);
}
.hero-scroll-hint span{ color:rgba(242,239,232,.8); }
.hero-scroll-hint .scroll-line{ background:linear-gradient(to bottom, rgba(242,239,232,.8), transparent); }

/* —— entrance choreography (gated on preloader dismissal) —— */
body.pre-lock .hero-content{ opacity:0; animation:none; }

@media (prefers-reduced-motion: no-preference){
  body.is-live .hero-content{ animation:heroFadeIn 1.3s var(--ease-out) .25s both; }
}

/* —— responsive —— */
@media (max-width:600px){
  .hero-content{ padding-top:64px; }
  .hero-motto{ gap:12px; margin-bottom:30px; }
  .hero-overline{ font-size:17px; letter-spacing:.05em; max-width:310px; }
}

/* ============================================================
   ✦ SEASONAL LAYER: LATE SUMMER — "Golden Hour"
   Additive August warmth · one sun, upper right · ~5% washes
   Remove this whole section to return to the neutral season.
   ============================================================ */

/* —— site-wide golden veil (≈5%, no blend tricks, predictable on dark + light) —— */
.season-veil{
  position:fixed; inset:0; z-index:1500;
  pointer-events:none;
  background:
    radial-gradient(55% 42% at 82% 6%, rgba(255,186,102,.06), transparent 65%),
    linear-gradient(115deg, rgba(232,168,76,.045) 0%, transparent 44%, rgba(214,120,60,.028) 100%);
}

/* —— warmed ambient: aurora + dusk glow shift a few degrees toward amber —— */
.hero-aurora::before{
  background:radial-gradient(circle, rgba(216,84,44,.20), transparent 70%);
}
.hero-building::before{
  background:radial-gradient(55% 70% at 50% 100%, rgba(226,150,70,.11) 0%, rgba(26,58,92,.18) 44%, transparent 72%);
}

/* —— low-sun light shafts across the hero (repurposes the retired .hero::after) —— */
.hero::after{
  content:''; display:block;
  position:absolute; inset:0;
  width:auto; height:auto; left:0; bottom:0;
  transform:none; opacity:1;
  z-index:0; pointer-events:none;
  background:
    linear-gradient(115deg, transparent 14%, rgba(255,186,102,.05) 22%, transparent 32%),
    linear-gradient(115deg, transparent 40%, rgba(255,186,102,.034) 48%, transparent 58%),
    linear-gradient(115deg, transparent 68%, rgba(232,168,76,.028) 74%, transparent 84%);
  mask-image:linear-gradient(to bottom, black 8%, transparent 88%);
  -webkit-mask-image:linear-gradient(to bottom, black 8%, transparent 88%);
}

/* —— delicate lens flare on the sun line, above the tower, clear of the text —— */
.hero-flare{
  position:absolute; top:23%; right:12%;
  width:190px; height:190px;
  z-index:0; pointer-events:none;
  background:radial-gradient(circle, rgba(255,205,130,.15), rgba(255,186,102,.05) 34%, transparent 62%);
}
.hero-flare::before{
  content:''; position:absolute; top:50%; left:-72%; right:-72%; height:1px;
  background:linear-gradient(to right, transparent, rgba(255,205,130,.32), transparent);
}
.hero-flare::after{
  content:''; position:absolute; top:calc(50% - 10px); left:-14%;
  width:20px; height:20px; border-radius:50%;
  border:1px solid rgba(255,196,120,.12);
}
@media (prefers-reduced-motion: no-preference){
  .hero-flare{ animation:flareBreathe 9s ease-in-out infinite; }
}
@keyframes flareBreathe{
  0%,100%{ opacity:.72; transform:scale(1); }
  50%{ opacity:1; transform:scale(1.045); }
}

/* —— minimal on small screens: keep the warmth, drop the theatrics —— */
@media (max-width:900px){
  .hero-flare{ display:none; }
  .hero::after{ display:none; }
}


/* ============================================================
   ✦ CONSISTENCY PASS — one heading voice, one button set
   Cleanup layer. The site had grown two competing display
   systems (Barlow Condensed caps vs. Playfair) and a set of
   one-off treatments. This section resolves them:
     serif  = every section heading + display numeral
     condensed = UI labels only (card titles, buttons, tags)
     mono   = overlines
     Cormorant = mottos, pull-quotes, captions
   ============================================================ */

/* —— 1. Headings that were condensed caps join the serif system —— */
.what-heading,
.structure-header h2,
.leg-hero h1,
.leg-submit-header h2,
.fund-hero-left h1,
.fund-steps-header h2{
  font-family:var(--font-serif);
  font-weight:700;
  text-transform:none;
  letter-spacing:-.01em;
  line-height:1.06;
}

/* the accent word in every heading reads the same way: red serif italic */
.what-heading em,
.structure-header h2 em,
.leg-hero h1 em,
.leg-submit-header h2 em,
.fund-hero-left h1 em,
.fund-steps-header h2 em{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
  color:var(--red);
}

/* "What is" lost its red slab — the accent is the type, not a box */
.what-heading-highlight{
  display:inline;
  background:none;
  padding:0;
  color:var(--red-bright);
  font-style:italic;
  font-weight:400;
}

/* —— 2. Display numerals follow the headings —— */
.stat-num,
.fund-step-num,
.structure-card-num{
  font-family:var(--font-serif);
  font-weight:700;
}
.stat-num{ letter-spacing:-.02em; }

/* —— 3. Page headers: the hard diagonal wedge was reading as a
      rendering artifact. Replaced with a soft centered wash. —— */
.about-hero,
.cal-hero,
.fund-hero{
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(10,34,64,.05), transparent 62%),
    var(--white);
}

/* —— 4. Grids: no orphan cells, no cards padded out to a
      neighbour's height —— */
.explore-grid{
  grid-template-columns:repeat(6,1fr);
}
.explore-grid .explore-card{ grid-column:span 2; }
.explore-grid .explore-card:nth-child(4){ grid-column:2 / 4; }
.explore-grid .explore-card:nth-child(5){ grid-column:4 / 6; }

.structure-grid,
.res-services-grid,
.fund-links-grid,
.leg-submit-grid{ align-items:start; }

@media (max-width:900px){
  .explore-grid{ grid-template-columns:repeat(2,1fr); }
  .explore-grid .explore-card,
  .explore-grid .explore-card:nth-child(4),
  .explore-grid .explore-card:nth-child(5){ grid-column:span 1; }
}
@media (max-width:600px){
  .explore-grid{ grid-template-columns:1fr; }
  .explore-grid .explore-card,
  .explore-grid .explore-card:nth-child(4),
  .explore-grid .explore-card:nth-child(5){ grid-column:1 / -1; }
}

/* —— 5. Buttons: two variants only. The outline button was a
      pill in Cormorant italic while every other button was a
      condensed cap — same shape, same voice now. —— */
.btn-outline{
  font-family:var(--font-display);
  font-style:normal;
  font-weight:700;
  font-size:13px;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

/* —— 6. Small type that had fallen below a readable contrast —— */
.senator-btn-sub{ color:var(--ink-soft); font-size:13px; letter-spacing:.4px; }
.group-caption{ color:rgba(10,34,64,.62); }
.leg-submit-type{
  font-family:var(--font-mono,'IBM Plex Mono',monospace);
  font-style:normal;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--red);
}

/* —— 7. The senator sections were the one place styled like a
      different website: Cormorant at 154px, Playfair at weight
      900 for body copy, skewed floating rules and a 12px
      off-brand red frame. Brought back into the system. —— */
.senator-hero::before,
.senator-hero::after{ display:none; }

.senator-title{
  font-family:var(--font-serif);
  font-style:normal;
  font-weight:700;
  font-size:clamp(48px,6vw,86px);
  line-height:1;
  letter-spacing:-.01em;
  text-shadow:none;
  margin-bottom:10px;
}
.senator-copy{
  font-family:var(--font-body);
  font-weight:400;
  font-size:17px;
  line-height:1.75;
  color:var(--ink-soft);
  max-width:640px;
}

/* the senator blocks are sections of a one-page site now, not
   standalone pages — the 100vh floor was leaving dead space */
.senator-page{ min-height:0; }

/* hours / qualifiers next to a phone number stay readable */
.res-card-body small{ color:rgba(10,34,64,.55); font-size:12px; }


/* ============================================================
   ✦ BRAND MARKS — the HUSA Senate emblem and the HUSA seal
   Two marks, three placements, each given a surface to sit in
   rather than being dropped on the page:
     · emblem — preloader ring, nav bar, hero crown
     · seal   — Finance Committee medallion
   Lighting stays consistent with the seasonal layer: sun upper
   right, so every mark casts down and to the left.
   ============================================================ */

/* —— nav: the mark is the wordmark here, so it earns the height —— */
.nav-logo img{
  width:46px;
  height:46px;
  filter:drop-shadow(-2px 5px 12px rgba(0,0,0,.45));
}
@media (max-width:600px){
  .nav-logo img{ width:40px; height:40px; }
}

/* —— preloader: the emblem is the thing the ring is drawn around —— */
.preloader .pre-emblem img{
  filter:drop-shadow(-4px 10px 24px rgba(0,0,0,.55));
}

/* —— hero: the emblem crowns the typographic composition ——
   sized against viewport height as well as width so it can never
   push the title, motto and CTAs out of the first screen. */
.hero-logo-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  /* sized to the mark, not to the column, so the halo and ring below
     can be expressed as a percentage of the emblem itself */
  width:max-content;
  margin:0 auto clamp(22px,3.4vh,34px);
}
.hero-logo{
  position:relative;
  z-index:1;
  width:clamp(104px, min(13.5vw, 20vh), 182px);
  height:auto;
  filter:
    drop-shadow(-10px 18px 34px rgba(0,0,0,.55))
    drop-shadow(0 0 46px rgba(255,205,130,.14));
}

/* the halo picks up the hero aurora and the golden-hour flare, so the
   emblem reads as lit by the same source as everything else */
.hero-logo-halo{
  position:absolute;
  top:50%;
  left:50%;
  width:185%;
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,
    rgba(255,205,130,.10) 0%,
    rgba(255,205,130,.06) 26%,
    rgba(200,16,46,.05) 40%,
    transparent 58%);
  pointer-events:none;
}

/* a hairline ring, the same gesture as the preloader orbit */
.hero-logo-wrap::after{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:calc(100% + clamp(18px,2.6vw,34px));
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:1px solid rgba(242,239,232,.12);
  pointer-events:none;
}

@media (max-width:600px){
  .hero-logo-wrap::after{ display:none; }
}

/* —— Finance Committee: the seal set into a medallion ——
   The source render sits on a black field, so it is cropped to the
   circle and given a bezel; the black that remains reads as the
   coin's own rim rather than as a stray box. */
.fund-hero-right{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.fund-seal{
  position:relative;
  width:clamp(230px, 25vw, 336px);
  aspect-ratio:1;
  border-radius:50%;
  margin:0;
  background:#04070c;
  box-shadow:
    -14px 34px 70px -28px rgba(6,22,41,.55),
    0 0 0 1px rgba(10,34,64,.14),
    0 0 0 9px rgba(10,34,64,.045);
  overflow:hidden;
}

.fund-seal-img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:contain;
  display:block;
}

/* inner bezel highlight — catches the same upper-right sun */
.fund-seal::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle at 68% 22%, rgba(255,255,255,.14), transparent 46%);
  mix-blend-mode:screen;
}

.fund-seal-caption{
  margin-top:20px;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(10,34,64,.45);
  text-align:center;
}

@media (prefers-reduced-motion: reduce){
  .fund-seal{ animation:none; }
}

/* the funding hero stacks below 900px — the seal leads instead of
   being hidden, since it is now the section's only image */
@media (max-width:900px){
  .fund-hero-right{ display:flex; order:-1; }
  .fund-seal{ width:min(58vw,240px); }
  .fund-seal-caption{ margin-top:14px; }
}


/* ============================================================
   ✦ SENATE DIRECTORY & FALL CALENDAR
   The 15th Senate's people and dates, as real page content.
   Layout rule for this section: one card per school, content
   height, no forced equal rows — the same discipline as the
   CONSISTENCY PASS above.
   ============================================================ */

/* —— embedded Canva calendar —— */
.canva-embed{
  position:relative;
  width:100%;
  aspect-ratio:16 / 10;
  min-height:420px;
  background:var(--cream);
}
.canva-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
}
.cal-embed-fallback{
  padding:14px 20px;
  background:rgba(10,34,64,.03);
  border-top:1px solid var(--light-gray);
  text-align:center;
  font-size:13px;
  color:var(--ink-soft);
}
.cal-embed-fallback a{
  color:var(--navy);
  border-bottom:1px solid rgba(200,16,46,.4);
}
.cal-embed-fallback a:hover{ color:var(--red); }

@media (max-width:700px){
  .canva-embed{ aspect-ratio:4 / 5; min-height:360px; }
}

/* —— key dates —— */
.events-intro{
  max-width:560px;
  margin:0 auto;
  font-size:15px;
  color:var(--ink-soft);
  line-height:1.7;
}
.events-month{
  margin:52px 0 4px;
  font-family:var(--font-serif);
  font-size:clamp(24px,2.6vw,32px);
  font-weight:700;
  color:var(--navy);
}
.events-month span{
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:400;
  letter-spacing:.2em;
  color:rgba(10,34,64,.4);
  vertical-align:middle;
  margin-left:10px;
}
.events-month:first-of-type{ margin-top:20px; }

.event-details h4{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
  color:var(--navy);
  margin-bottom:4px;
}
.event-day{ letter-spacing:-.02em; }
.event-tag-closed{
  background:transparent;
  color:rgba(10,34,64,.45);
  box-shadow:inset 0 0 0 1px var(--hairline);
}

/* —— directory shell —— */
.dir-section{
  max-width:1180px;
  margin:0 auto;
  padding:20px 24px 100px;
}
.dir-heading{
  font-family:var(--font-serif);
  font-size:clamp(26px,3vw,40px);
  font-weight:700;
  color:var(--navy);
  text-align:center;
  margin:64px 0 32px;
}
.dir-heading em{ font-style:italic; color:var(--red); }
.dir-heading:first-of-type{ margin-top:24px; }

.executive-board-heading{
  position:relative;
  margin-top:76px;
  margin-bottom:14px;
  font-size:clamp(30px,3.35vw,46px);
}

.executive-board-heading::after{
  content:'';
  display:block;
  width:78px;
  height:2px;
  margin:14px auto 0;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(10,34,64,.14), rgba(200,16,46,.9), rgba(10,34,64,.14));
}

.executive-board-copy{
  max-width:660px;
  margin:0 auto 26px;
  color:rgba(10,34,64,.82);
  font-size:clamp(15px,1.25vw,17px);
  font-weight:500;
  line-height:1.68;
  text-align:center;
}

.dir-block {
  margin-top:38px;
}

.dir-block[open] {
  padding-bottom:8px;
}

.dir-summary {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-height:56px;
  cursor:pointer;
  list-style:none;
  user-select:none;
}

.dir-summary::-webkit-details-marker {
  display:none;
}

.dir-summary::after {
  content:'';
  width:12px;
  height:12px;
  border-right:2px solid var(--red);
  border-bottom:2px solid var(--red);
  transform:rotate(45deg) translateY(-2px);
  transition:transform .22s var(--ease-out);
  flex:0 0 auto;
}

.dir-block[open] > .dir-summary::after {
  transform:rotate(225deg) translateY(-2px);
}

.dir-summary:focus-visible {
  outline:3px solid rgba(200,16,46,.28);
  outline-offset:6px;
  border-radius:10px;
}

.dir-summary-meta {
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(10,34,64,.46);
}

.dir-toolbar{ max-width:520px; margin:0 auto 44px; text-align:center; }
.dir-toolbar[hidden]{ display:none; }
.dir-search-label{
  display:block;
  margin-bottom:10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--red);
}
.dir-search{
  width:100%;
  padding:14px 18px;
  font-family:var(--font-body);
  font-size:15px;
  color:var(--navy);
  background:var(--white);
  border:1px solid var(--light-gray);
  border-radius:10px;
  outline:none;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.dir-search:focus{
  border-color:var(--red);
  box-shadow:0 0 0 4px rgba(200,16,46,.10);
}
.dir-status{
  margin-top:10px;
  font-size:13px;
  color:var(--ink-soft);
  min-height:1.2em;
}

.dir-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:22px;
  align-items:start;
}
.dir-grid-narrow{
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  max-width:820px;
  margin:0 auto;
}

.executive-board-grid{
  margin-top:22px;
}

.dir-group{
  background:var(--white);
  border:1px solid var(--light-gray);
  border-radius:10px;
  padding:26px 26px 20px;
  box-shadow:var(--shadow-soft);
}

.executive-board-card{
  border-color:rgba(10,34,64,.16);
  background:linear-gradient(145deg, rgba(255,255,255,.98), rgba(248,246,242,.94));
  box-shadow:0 22px 52px rgba(10,34,64,.13);
}

.executive-board-card .dir-group-head{
  border-bottom-color:rgba(10,34,64,.72);
}

.executive-board-card .dir-group-head h3{
  font-size:16px;
  letter-spacing:.08em;
}

.executive-board-card .dir-name{
  font-weight:700;
}

.executive-board-card .dir-role{
  color:rgba(10,34,64,.68);
  font-weight:700;
}

.executive-board-card .dir-note{
  color:rgba(10,34,64,.82);
  background:rgba(10,34,64,.035);
  border:1px solid rgba(10,34,64,.08);
  border-radius:8px;
  padding:13px 14px;
  font-size:14px;
}

.executive-board-card .dir-note a{
  color:var(--red);
  font-weight:700;
  border-bottom-color:rgba(200,16,46,.55);
}
.dir-group[hidden]{ display:none; }
.dir-group-head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding-bottom:14px;
  margin-bottom:6px;
  border-bottom:2px solid var(--navy);
}
.dir-group-head h3{
  font-family:var(--font-display);
  font-size:15px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--navy);
}
.dir-count{
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--red);
  white-space:nowrap;
}

.dir-list{ list-style:none; }
.dir-group.dir-collapsible.is-collapsed .dir-person:nth-child(n+4):not(.dir-person-chair) {
  display:none;
}

.dir-toggle {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:44px;
  margin-top:8px;
  padding:10px 12px;
  border:1px solid rgba(10,34,64,.12);
  border-radius:8px;
  background:rgba(10,34,64,.035);
  color:var(--navy);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease, color .2s ease;
}

.dir-toggle::after {
  content:'';
  width:8px;
  height:8px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  transition:transform .22s var(--ease-out);
}

.dir-group:not(.is-collapsed) .dir-toggle::after {
  transform:rotate(225deg) translateY(-2px);
}

.dir-toggle:hover,
.dir-toggle:focus-visible {
  background:rgba(200,16,46,.08);
  border-color:rgba(200,16,46,.24);
  color:var(--red);
}

.dir-toggle[hidden] {
  display:none;
}

.dir-group.is-searching .dir-toggle {
  display:none;
}
/* always stacked — a name/email pair that sometimes fits on one line and
   sometimes wraps reads as ragged, so it never sits on one line */
.dir-person{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  padding:11px 0;
  border-bottom:1px solid rgba(10,34,64,.07);
}
.dir-person:last-child{ border-bottom:0; }
.dir-person[hidden]{ display:none; }
.dir-person-stacked{ flex-direction:column; align-items:flex-start; gap:3px; }
.dir-person-featured{
  margin:8px 0;
  padding:14px 16px;
  border:1px solid rgba(200,16,46,.16);
  border-radius:8px;
  background:linear-gradient(135deg, rgba(10,34,64,.04), rgba(200,16,46,.055));
}
.dir-person-chair{
  margin:6px 0;
  padding:13px 14px;
  border:1px solid rgba(10,34,64,.09);
  border-left:3px solid rgba(200,16,46,.45);
  border-radius:8px;
  background:linear-gradient(135deg, rgba(255,255,255,.84), rgba(248,246,242,.72));
}

.dir-name{
  font-size:15px;
  font-weight:500;
  color:var(--navy);
}
.dir-role-pill{
  display:inline-flex;
  min-height:24px;
  align-items:center;
  padding:0 9px;
  border:1px solid rgba(200,16,46,.18);
  border-radius:999px;
  background:rgba(200,16,46,.08);
  color:var(--red);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.dir-email{
  display:inline-block;
  padding:3px 0;
  font-size:12.5px;
  color:var(--ink-soft);
  word-break:break-word;
  transition:color .2s ease;
}
a.dir-email:hover{ color:var(--red); }
.dir-role,
.dir-pending{
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(10,34,64,.45);
}
.dir-person-open .dir-name{ color:rgba(10,34,64,.42); font-style:italic; font-weight:400; }
.dir-person-open a.dir-email{ color:var(--red); }
.dir-note{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(10,34,64,.07);
  font-size:13px;
  line-height:1.6;
  color:var(--ink-soft);
}
.dir-note a{ color:var(--navy); border-bottom:1px solid rgba(200,16,46,.4); }
.dir-note a:hover{ color:var(--red); }

.dir-empty{
  text-align:center;
  padding:56px 20px;
  color:var(--ink-soft);
  font-size:15px;
}
.dir-empty[hidden]{ display:none; }

/* —— open-seats call to action —— */
.dir-cta{
  max-width:760px;
  margin:64px auto 0;
  padding:44px 40px;
  text-align:center;
  background:var(--grad-chamber, var(--navy));
  border-radius:12px;
  box-shadow:var(--shadow-strong);
}
.dir-cta-label{
  display:inline-block;
  margin-bottom:14px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--red-bright);
}
.dir-cta h3{
  font-family:var(--font-serif);
  font-size:clamp(22px,2.4vw,30px);
  font-weight:700;
  color:var(--white);
  margin-bottom:12px;
}
.dir-cta p{
  max-width:520px;
  margin:0 auto 26px;
  font-size:15px;
  line-height:1.75;
  color:rgba(255,255,255,.78);
}

/* —— "start here" routing cards —— */
.route-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
  gap:20px;
  align-items:start;
}
.route-card{
  display:block;
  padding:28px 26px;
  background:var(--white);
  border:1px solid var(--light-gray);
  border-radius:10px;
  box-shadow:var(--shadow-soft);
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out), border-color .3s ease;
}
.route-card:hover{
  transform:translateY(-6px);
  border-color:rgba(200,16,46,.35);
  box-shadow:var(--shadow-strong);
}
.route-tag{
  display:inline-block;
  margin-bottom:14px;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--red);
}
.route-card h3{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--navy);
  margin-bottom:8px;
  line-height:1.25;
}
.route-card p{
  font-size:13.5px;
  line-height:1.65;
  color:var(--ink-soft);
}

/* —— standing committees —— */
/* nine committees — three columns keeps the section balanced */
.cmte-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  align-items:start;
}
@media (max-width:900px){ .cmte-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:480px){ .cmte-grid{ grid-template-columns:1fr; } }
.cmte-card{
  position:relative;
  padding:26px 22px 22px;
  background:var(--off-white);
  border:1px solid var(--light-gray);
  border-radius:10px;
}
.cmte-card-featured{
  border-color:rgba(200,16,46,.28);
  background:
    radial-gradient(110% 90% at 100% 0%, rgba(200,16,46,.09), transparent 58%),
    linear-gradient(180deg, var(--white), var(--off-white));
  box-shadow:0 20px 42px -30px rgba(10,34,64,.55);
}
.cmte-card-featured::before{
  content:'';
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:4px;
  border-radius:10px 10px 0 0;
  background:linear-gradient(90deg, var(--navy), var(--red));
}
.cmte-num{
  font-family:var(--font-serif);
  font-size:26px;
  font-weight:700;
  color:rgba(10,34,64,.12);
  line-height:1;
}
.cmte-card h3{
  margin-top:10px;
  font-family:var(--font-display);
  font-size:16px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--navy);
}
.cmte-chair{
  display:flex;
  flex-wrap:wrap;
  gap:7px 8px;
  align-items:center;
  margin-top:10px;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(10,34,64,.42);
}
.cmte-chair-label{
  display:inline-flex;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(200,16,46,.16);
  background:rgba(200,16,46,.07);
  color:var(--red);
}
.cmte-card-featured .cmte-chair-label{
  background:var(--red);
  color:var(--white);
}
.cmte-chair-name{
  display:inline-block;
  color:var(--navy);
  font-weight:700;
  font-size:11px;
  line-height:1.25;
  text-decoration:none;
  border-bottom:1px solid rgba(200,16,46,.28);
  padding:5px 1px 4px;
  transition:color .2s ease, border-color .2s ease;
}
.cmte-chair-name:hover,
.cmte-chair-name:focus-visible{
  color:var(--red);
  border-bottom-color:var(--red);
}

/* —— directory hero —— */
.senator-hero .section-label{ margin-bottom:14px; }
.senator-title em{ font-style:italic; color:var(--red); }
.senator-copy strong{ color:var(--navy); font-weight:600; }

@media (max-width:600px){
  .dir-section{ padding:12px 16px 72px; }
  .dir-group{ padding:22px 20px 16px; }
  .dir-summary{
    flex-direction:column;
    gap:8px;
    margin:42px 0 22px;
    line-height:1.05;
  }
  .dir-summary::after{
    width:10px;
    height:10px;
  }
  .dir-summary-meta{
    font-size:10px;
    letter-spacing:.12em;
  }
  .dir-cta{ padding:34px 24px; }
  .events-month{ margin-top:40px; }
  .webmaster-link{ margin-left:0; }
}

/* ===== final nav organization ===== */
/* ============================================================
   ✦ NAV — institutional command bar
   Balanced 3-column masthead: seal + wordmark · centered links
   with a tab-underline indicator · one decisive CTA.
   ============================================================ */
.nav {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  height:64px;
  padding:0 clamp(18px, 4vw, 54px);
  background:linear-gradient(to bottom, rgba(6,20,38,.88), rgba(6,20,38,.72));
  border-bottom:1px solid rgba(255,255,255,.09);
  box-shadow:0 18px 40px -24px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);
}

/* —— brand: the seal reads as a mark, the wordmark carries the name —— */
.nav-logo {
  justify-self:start;
  display:inline-flex;
  align-items:center;
  gap:12px;
  width:auto;
  height:auto;
}

.nav-logo img {
  width:40px;
  height:40px;
  flex:none;
}

.nav-logo:hover img {
  transform:none;
}

.nav-wordmark {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  line-height:1;
}

.nav-wordmark-main {
  font-family:var(--font-display);
  font-weight:700;
  font-size:17px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--white);
}

.nav-wordmark-sub {
  font-family:var(--font-mono);
  font-weight:500;
  font-size:8.5px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
}

/* —— centered links: clean labels, tab-underline indicator —— */
.nav-links {
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}

.nav-links a,
.nav-more {
  --nx:15px;
  position:relative;
  appearance:none;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.68);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  height:64px;
  padding:0 var(--nx);
  border-radius:0;
  font-family:var(--font-body);
  font-size:12px;
  font-weight:600;
  letter-spacing:.11em;
  line-height:1;
  text-transform:uppercase;
  cursor:pointer;
  transition:color .2s ease;
}

.nav-links a::after,
.nav-more::after {
  content:'';
  display:block;
  position:absolute;
  left:var(--nx);
  right:var(--nx);
  bottom:14px;
  height:2px;
  border-radius:2px;
  background:var(--red-bright);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .28s var(--ease-out);
}

.nav-links a:hover,
.nav-more:hover,
.nav-more:focus-visible,
.nav-dropdown.open .nav-more,
.nav-more.active {
  color:var(--white);
}

.nav-links a.active,
.nav-more.active {
  color:var(--white);
}

.nav-links a:hover::after,
.nav-more:hover::after,
.nav-dropdown.open .nav-more::after,
.nav-links a.active::after,
.nav-more.active::after {
  transform:scaleX(1);
}

.nav-more-icon {
  font-size:14px;
  line-height:1;
  opacity:.8;
  transform:translateY(-1px);
  transition:transform .25s var(--ease-out);
}

.nav-dropdown.open .nav-more-icon {
  transform:translateY(-1px) rotate(180deg);
}

.nav-dropdown-menu {
  top:calc(100% - 2px);
  left:50%;
  right:auto;
  transform:translateX(-50%);
  min-width:236px;
  padding:8px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(7,20,38,.94);
  box-shadow:0 28px 56px rgba(0,0,0,.4);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  display:block;
}

.nav-dropdown-menu a {
  justify-content:flex-start;
  height:auto;
  min-height:40px;
  width:100%;
  padding:0 14px;
  border-radius:8px;
  font-size:11px;
  letter-spacing:.08em;
}

.nav-dropdown-menu a::after {
  display:none;
}

.nav-dropdown-menu a:hover {
  background:rgba(255,255,255,.06);
  color:var(--white);
}

.nav-dropdown-menu a.active {
  background:rgba(200,16,46,.14);
  color:var(--white);
}

/* —— primary CTA: quiet by default, decisive on hover —— */
.nav-action {
  justify-self:end;
  position:relative;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:0 20px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.04);
  color:var(--white);
  font-family:var(--font-display);
  font-size:13px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  box-shadow:none;
  white-space:nowrap;
  transition:transform .22s var(--ease-out), background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.nav-action::before {
  content:'\2192';
  order:2;
  font-size:14px;
  line-height:1;
  transform:translateX(0);
  transition:transform .22s var(--ease-out);
}

.nav-action:hover,
.nav-action:focus-visible {
  transform:translateY(-1px);
  border-color:transparent;
  background:var(--grad-red);
  box-shadow:0 16px 30px -14px var(--red-glow);
}

.nav-action:hover::before,
.nav-action:focus-visible::before {
  transform:translateX(3px);
}

.hero {
  padding-top:92px;
  /* Slightly deepened chamber gradient — richer navy crown, warmer red
     footing and a soft central lift for more dimension. Scoped here so the
     shared --grad-chamber (used by other sections) stays unchanged. */
  background:
    radial-gradient(128% 128% at 84% -12%, rgba(32,72,112,.72) 0%, transparent 58%),
    radial-gradient(112% 112% at 4% 116%, rgba(200,16,46,.30) 0%, transparent 56%),
    radial-gradient(92% 72% at 50% 44%, rgba(18,48,84,.34) 0%, transparent 72%),
    linear-gradient(168deg,#0b2649 0%,#071a31 55%,#03101f 100%);
}

.hero::before {
  top:92px;
}

.hero-ticker {
  top:64px;
  height:28px;
  background:rgba(7,22,41,.86);
  border-top:1px solid rgba(255,255,255,.045);
  border-bottom:1px solid rgba(255,255,255,.075);
}

.hero-ticker-track {
  gap:36px;
  padding-left:36px;
  font-size:14px;
  line-height:1;
}

.hero-ticker-track span::before {
  margin-right:12px;
  font-size:16px;
}

@media (max-width:980px) {
  .nav {
    grid-template-columns:1fr auto 1fr;
    height:64px;
    padding:0 20px;
    gap:14px;
  }

  .nav-links {
    gap:2px;
  }

  .nav-links a,
  .nav-more {
    --nx:11px;
    font-size:11px;
    letter-spacing:.08em;
  }

  .nav-wordmark-sub {
    display:none;
  }

  .nav-action {
    min-height:40px;
    padding:0 15px;
    font-size:12px;
  }
}

@media (max-width:860px) {
  .nav-action {
    display:none;
  }

  .nav {
    grid-template-columns:1fr auto 1fr;
  }
}

@media (max-width:900px) {
  .reveal-left,
  .reveal-right {
    transform:translateY(24px) scale(.985);
  }

  .reveal-left.visible,
  .reveal-right.visible {
    transform:translateY(0) scale(1);
  }
}

@media (max-width:768px) {
  .nav {
    display:flex;
    justify-content:space-between;
    height:58px;
  }

  .nav-links,
  .nav-action {
    display:none;
  }

  .hamburger {
    display:flex;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    align-items:center;
    justify-content:center;
    padding:0;
  }

  .hamburger:hover,
  .hamburger:focus-visible {
    background:rgba(255,255,255,.045);
    box-shadow:none;
  }

  .mobile-menu {
    top:58px;
    bottom:0;
    min-height:calc(100dvh - 58px);
    padding:18px 22px calc(26px + env(safe-area-inset-bottom));
    border-bottom:0;
    background:
      radial-gradient(110% 70% at 100% 0%, rgba(200,16,46,.16), transparent 52%),
      linear-gradient(180deg, rgba(10,34,64,.99), rgba(7,22,41,.99));
    box-shadow:0 24px 48px rgba(0,0,0,.32);
  }

  .mobile-menu a {
    display:flex;
    align-items:center;
    min-height:48px;
    padding:0 14px;
    border-bottom-color:rgba(255,255,255,.11);
    font-weight:600;
    letter-spacing:.12em;
  }

  .mobile-menu a:hover,
  .mobile-menu a:focus-visible,
  .mobile-menu a.active {
    color:var(--white);
    background:rgba(255,255,255,.055);
    outline:none;
  }

  .mobile-menu a.active {
    box-shadow:inset 3px 0 0 var(--red-bright);
  }

  .hero {
    padding-top:84px;
  }

  .hero::before {
    top:84px;
  }

  .hero-ticker {
    top:58px;
    height:26px;
  }

  .hero-ticker-track {
    gap:26px;
    padding-left:24px;
    font-size:13px;
  }

}

@media (max-width:600px) {
  .hero-content {
    padding-top:46px;
  }

  .hero-title {
    font-size:clamp(44px, 15vw, 64px);
  }

  .hero-cta-row {
    width:100%;
  }

  .hero-cta-row .btn-solid,
  .hero-cta-row .btn-ghost {
    width:100%;
    justify-content:center;
  }
}

/* ===== attached Senate photo fit ===== */
.what-image-frame {
  aspect-ratio: 4 / 5;
  min-height: 0;
}

.what-image-frame {
  max-width: 440px;
  margin-left: auto;
}

.what-image-frame picture,
.what-image-frame img {
  object-fit: cover;
  object-position: center 54%;
}

@media (max-width: 900px) {
  .what-image-frame {
    max-width: 520px;
    margin: 0 auto;
  }

}

@media (max-width: 560px) {
  .what-image-frame {
    aspect-ratio: 3 / 4;
  }

  .scholarship-copy {
    font-size: 14px;
  }

  .scholarship-option {
    padding: 20px;
  }

  .scholarship-button {
    min-height: 46px;
    padding: 0 14px;
  }
}

/* ============================================================
   ✦ INTERACTION & COLOR PASS
   Extends the site's existing hover language — top-bar reveal,
   lift, arrow slide, red border — to the components that were
   still flat, and lets the brand navy/red do more work on hover.
   Transition-only, so it collapses under the global
   prefers-reduced-motion rule; no new hues are introduced.
   ============================================================ */

/* —— Standing Committee cards: a static grid becomes a live one —— */
.cmte-card{
  overflow:hidden;
  transition:transform .38s var(--ease-out), box-shadow .38s var(--ease-out),
             border-color .3s ease, background .3s ease;
}
.cmte-card:not(.cmte-card-featured)::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--navy), var(--red));
  transform:scaleX(0); transform-origin:left;
  transition:transform .34s var(--ease-out);
}
.cmte-card:not(.cmte-card-featured):hover::before{ transform:scaleX(1); }
.cmte-card:hover{
  transform:translateY(-6px);
  border-color:rgba(200,16,46,.3);
  box-shadow:0 26px 50px -28px rgba(10,34,64,.55);
}
.cmte-card:not(.cmte-card-featured):hover{
  background:
    radial-gradient(120% 100% at 100% 0%, rgba(200,16,46,.07), transparent 58%),
    var(--white);
}
.cmte-num{ transition:color .3s ease, transform .35s var(--ease-out); }
.cmte-card:hover .cmte-num{ color:rgba(200,16,46,.85); transform:translateY(-2px); }

/* —— "Start Here" route cards: a clearer, more colorful call —— */
.route-card{ position:relative; overflow:hidden; padding-bottom:46px; }
.route-card::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--navy), var(--red));
  transform:scaleX(0); transform-origin:left;
  transition:transform .34s var(--ease-out);
}
.route-card:hover::before{ transform:scaleX(1); }
.route-card::after{
  content:'\2192';
  position:absolute; right:24px; bottom:20px;
  font-family:var(--font-body); font-size:19px; font-weight:600; color:var(--red);
  opacity:0; transform:translateX(-8px);
  transition:opacity .3s ease, transform .3s var(--ease-out);
}
.route-card:hover::after{ opacity:1; transform:translateX(0); }
.route-card h3{ transition:color .25s ease; }
.route-card:hover h3{ color:var(--red); }

/* —— Directory school cards: quiet lift, warm accent —— */
.dir-group{ transition:border-color .3s ease, box-shadow .35s var(--ease-out); }
.dir-group:hover{
  border-color:rgba(10,34,64,.22);
  box-shadow:0 24px 46px -30px rgba(10,34,64,.42);
}
.dir-group-head h3{ transition:color .25s ease; }
.dir-group:hover .dir-group-head h3{ color:var(--red); }

/* —— Chair rows: the role pill fills on hover —— */
.dir-person-chair{ transition:border-color .3s ease, box-shadow .3s ease; }
.dir-person-chair:hover{
  border-left-color:var(--red);
  box-shadow:0 12px 26px -20px rgba(200,16,46,.55);
}
.dir-role-pill{ transition:background .25s ease, color .25s ease, border-color .25s ease; }
.dir-person-chair:hover .dir-role-pill{
  background:var(--red); color:var(--white); border-color:var(--red);
}

/* —— Stats strip: a small brand accent beneath each figure —— */
.stat-label{ position:relative; margin-top:18px; }
.stat-label::before{
  content:'';
  position:absolute; top:-10px; left:50%; transform:translateX(-50%);
  width:26px; height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--red), var(--red-bright));
}

/* ============================================================
   ✦ DIRECTORY: seat-fill meter, committee↔directory link,
     committee cascade. Reinforces the "20 open" story and
     closes the loop between the two chair views.
   ============================================================ */

/* —— Seat-fill indicator (directory intro) —— */
.seat-meter{ max-width:560px; margin:32px auto 6px; }
.seat-meter-top{
  display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  margin-bottom:11px;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;
}
.seat-meter-label{ color:var(--navy); }
.seat-meter-num{ font-weight:600; color:var(--red); }
.seat-meter-open{ color:rgba(10,34,64,.5); }
.seat-meter-track{
  position:relative; height:8px; border-radius:999px;
  background:rgba(10,34,64,.10); overflow:hidden;
}
.seat-meter-fill{
  position:absolute; inset:0 auto 0 0; width:0; border-radius:999px;
  background:linear-gradient(90deg, var(--navy) 0%, #7a1428 58%, var(--red) 100%);
  box-shadow:0 0 16px -2px var(--red-glow);
  transition:width 1.25s var(--ease-out);
}
.seat-meter.visible .seat-meter-fill{ width:var(--seat-pct, 67%); }

/* —— Committee card → directory chair —— */
.cmte-card-linked{ cursor:pointer; }
.cmte-card-linked::after{
  content:'\2197';                 /* ↗ */
  position:absolute; top:20px; right:20px;
  font-size:16px; line-height:1; color:var(--red);
  opacity:0; transform:translate(-3px, 3px);
  transition:opacity .3s ease, transform .3s var(--ease-out);
}
.cmte-card-linked:hover::after,
.cmte-card-linked:focus-visible::after{ opacity:.85; transform:translate(0, 0); }
.cmte-card-linked:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }

/* the row you land on flashes a red ring, then settles */
.dir-person{ scroll-margin-top:96px; }
.dir-person-flash{ animation:dirFlash 2.1s var(--ease-out); border-radius:8px; }
@keyframes dirFlash{
  0%{   box-shadow:0 0 0 2px var(--red), 0 14px 30px -14px var(--red-glow); }
  70%{  box-shadow:0 0 0 2px rgba(200,16,46,.5), 0 14px 30px -18px rgba(200,16,46,.22); }
  100%{ box-shadow:0 0 0 2px rgba(200,16,46,0), 0 0 0 0 rgba(200,16,46,0); }
}

/* —— Committee grid: a springier, clearer cascade —— */
.cmte-grid .cmte-card.reveal{
  transform:translateY(42px) scale(.955);
  transition:opacity .7s var(--ease-out), transform .7s var(--ease-spring), filter .7s var(--ease-out);
}
.cmte-grid .cmte-card.reveal.visible{ transform:translateY(0) scale(1); }

/* —— Skip to content (keyboard / screen-reader) —— */
.skip-link{
  position:fixed; top:10px; left:10px; z-index:3000;
  transform:translateY(-160%);
  padding:11px 18px; border-radius:8px;
  background:var(--navy); color:var(--white);
  font-family:var(--font-body); font-size:13px; font-weight:600; letter-spacing:.02em;
  text-decoration:none; box-shadow:0 12px 30px rgba(0,0,0,.32);
  transition:transform .2s var(--ease-out);
}
.skip-link:focus{ transform:translateY(0); outline:2px solid var(--red-bright); outline-offset:2px; }