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

:root {
  --black: #101010;
  --white: #ffffff;
  --green: #00E47C;
  --cement: #B3B3B3;
  --blue-pill: #6ED6FF;
  --yellow-pill: #ffe900;

  --blue: #6ED6FF;
  --yellow: #FFE900;
  --purple: #E485FF;
  --gray-dark: #676767;
  --green-dark: #166534;
  --blue-dark: #1E40AF;
  --red-dark: #880000;
  --purple-dark: #410053;

  --page-edge: 80px;
  /* 12-col grid */
  --cols: 12;
  --gutter: 24px;

  /* master width from Figma */
  --frame-max: 1440px;
  --frame: min(var(--frame-max), calc(100vw - (2 * var(--page-edge))));
  --col: calc((var(--frame) - (11 * var(--gutter))) / 12);

  --section-left: clamp(320px, 30vw, 420px);
  --section-gap: 24px;

  --card-arrow-width: 60px;
  
  --line: rgba(179,179,179,.75);

  --text-strong: #ffffff;
  --text-mid: rgba(255,255,255,0.92);
  --text-dim: rgba(255,255,255,0.82);
  --line-dim: rgba(255,255,255,0.42);
}

html, body { 
  height: 100%; 
  width: 100%;
}

body {
  font-family: 'Outfit', sans-serif;
  background: #000 url("/img/keen-bg.png") center top / 100% auto repeat-y;
  color: var(--white);
  min-height: 100%;
  overflow-x: hidden;
  width: 100%;
}

body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.28);
  pointer-events: none;
  z-index: -1;
}

body.clean-background {
  background: #050505;
}

body.clean-background::after {
  display: none;
}

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

.founder-card h2,
.research-meta h2,
.contact-page h1 {
  margin: 0;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.045em;
}

/* ── MINIMAL TEMP──  */

.minimal-hero {
  min-height: calc(100vh - 200px);
}

/* ── NAV ── */

.site-nav {
  height: 80px;
  border-bottom: 1.5px solid rgba(255,255,255,.66);
}

nav {
  display: flex;
  align-items: center;
  height: 80px;
}

.nav-inner {
  max-width: var(--frame);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
}

.logo { 
  display: flex; 
  align-items: center; 
  width: 430px; 
  text-decoration: none; 
}

.logo img { 
  width: 125px; 
  height: auto; 
  display: block; 
}

.nav-links {
  display: flex;
  align-items: center;
}

.nav-link {
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.2px;
  color: var(--text-mid);
  text-decoration: none;
  padding: 0 20px;
  height: 79px;
  display: flex;
  align-items: center;
  transition: color 0.2s, background 0.2s;
}

.nav-link.is-active {
  color: var(--black);
  border-bottom-color: var(--white);
}

.nav-link.active-green { background: var(--green); }
.nav-link.active-blue { background: var(--blue); }
.nav-link.active-purple { background: var(--purple); }
.nav-link.active-yellow { background: var(--yellow); }

.nav-status {
  display: flex;
  align-items: center;
  gap: 10px;
}

.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 6px var(--green);
  animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 6px var(--green); }
  50% { opacity: 0.6; box-shadow: 0 0 14px var(--green); }
}

.status-label {
  font-size: 14px;
  letter-spacing: 0.2px;
  color: var(--white);
}

/* ── disable mobile-menu by default ── */
.mobile-menu { 
  display: none; 
  background: none; 
  border: 0; 
  padding: 0; 
}

.mobile-menu span { 
  display: block; 
  width: 34px; 
  height: 3px; 
  background: #fff; 
  margin: 6px 0; 
}

/* ── HERO ── */

.hero {
  position: relative;

  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);

  max-width: var(--frame);
  margin: 0 auto;
  padding: 52px 0 28px;
}

/* Animated scanline / grid background */
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 39px,
      rgba(255,255,255,0.015) 39px,
      rgba(255,255,255,0.015) 40px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 39px,
      rgba(255,255,255,0.025) 39px,
      rgba(255,255,255,0.025) 40px
    );
  z-index: 0;
  pointer-events: none;
}

.hero-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 100%;
  padding-right: 40px;
  margin-left: 0;

  grid-column: 1 / 7;
  max-width: none;
  padding-right: 0;  
}

.hero-content .hero-title {
  line-height: 0.94;
  font-size: clamp(3rem, 6.4vw, 5.4rem);
}

.hero-content, .scoreboard { 
  position: relative; 
  z-index: 1; 
}

.kode-label {
  font-family: 'Kode Mono', monospace;
  font-size: 64px;
  font-weight: 400;
  line-height: 70px;
  text-transform: uppercase;
  color: var(--white);
}

.hero-title {
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 88px;
  line-height: 0.95;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--text-strong);
}

.hero-subtitle {
  font-weight: 300;
  font-size: 32px;
  line-height: 40px;
  max-width: calc(5 * var(--col) + 4 * var(--gutter));
  color: var(--white);
}

/* ── SCOREBOARD ── */

.scoreboard {
  grid-column: 8 / 13;
  align-self: start;

  width: 100%;
  max-width: none;

  justify-self: stretch;
  margin-top: 28px;
  padding-left: 0;

  position: relative;
  top: auto;
  right: auto;
}

.score-row {
  border-bottom: 1px solid var(--cement);
  padding-bottom: 20px;
  margin-bottom: 20px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: center;
  justify-content: space-between;
}

.score-title {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.25;
  color: var(--white);
}

.score-sub {
  font-weight: 500;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text-dim);
  margin-top: 8px;
}

.pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 14px;
  border-radius: 9999px;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
  cursor: pointer;
  flex-shrink: 0;
  transition: opacity 0.2s;
}

.pill:hover { opacity: 0.85; }

.pill-green { background: var(--green); color: var(--green-dark); }
.pill-blue { background: var(--blue-pill); color: var(--blue-dark); }
.pill-yellow { background: var(--yellow-pill); color: var(--red-dark); }

/* ── DIVIDER ── */

.divider {
  height: 1.5px;
  background: var(--line);
  max-width: var(--frame);
  margin: 48px auto 0;
}

/* ── SECTION LAYOUT ── */

.section {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);

  max-width: var(--frame);
  margin: 0 auto;
  padding: 40px 0;
}


.headline-block {
  width: auto;
  border-bottom: 1px solid var(--line);
  padding-bottom: 40px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: 10px;
  grid-column: 1 / 5;
}

.eyebrow {
  font-family: 'Kode Mono', monospace;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 2.75px;
  text-transform: uppercase;
  color: var(--white);
}

.section-title {
  font-weight: 900;
  font-size: 48px;
  line-height: 54px;
  text-transform: uppercase;
  color: var(--white);
}

.section-body {
  font-size: 16px;
  line-height: 24px;
  color: var(--text-mid);
  max-width: 320px;
}

.prose {
  font-size: 16px;
  line-height: 24px;
  max-width: 820px;
  color: var(--white);
}

.prose p + p {
  margin-top: 26px;
}

/* ── PROJECTS ── */

.text-block,
.projects-list {
  width: 100%;
  min-width: 0;
  border-bottom: 1px solid var(--line);
  padding-bottom: 40px;
  align-self: stretch;
  grid-column: 6 / 13;

  display: flex;
  flex-direction: column;
  gap: 20px;
}

.project-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--card-arrow-width);
  align-items: stretch;
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(255,255,255,0.22);
  justify-content: space-between;
  cursor: pointer;
  transition: border-color 0.2s;
}

.project-card:hover { background: rgba(0,0,0,0.65); }

.project-info {
  padding: 28px 40px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}

.project-title {
  font-weight: 700;
  font-size: 20px;
  line-height: 26px;
  text-transform: capitalize;
  color: var(--white);
}

.project-sub {
  font-family: 'Kode Mono', monospace;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: -0.5px;
  color: var(--white);
}

.project-arrow {
  background: var(--cement);
  color: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: var(--card-arrow-width);
}

.project-card:hover .project-arrow {
  background: var(--green);
  color: var(--black);
}

/* ── EXPLORE CTA ── */
.explore-bar {
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 0;
  height: 134px;
  cursor: pointer;
  transition: background 0.2s;
  margin: 0 auto;

  max-width: none;
  width: 100%;
  padding-left: var(--page-edge);
  padding-right: var(--page-edge);

  margin: 0 auto;
}

.explore-bar:hover { background: var(--green); }

.explore-eyebrow {
  font-family: 'Kode Mono', monospace;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 2.75px;
  text-transform: uppercase;
  color: var(--black);
  width: 120px;
}

.explore-title {
  font-weight: 900;
  font-size: 48px;
  line-height: 54px;
  text-transform: uppercase;
  color: var(--black);
  flex: 1;
  text-align: center;
}

.explore-arrow {
  font-size: 48px;
  color: var(--black);
  line-height: 1;
  width: 60px;
  text-align: right;
}

/* ── FOOTER ── */
footer {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 40px calc((100vw - var(--frame)) / 2);

  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  align-items: center;
}

.footer-copy {
  grid-column: 1 / 5;
}

.footer-links {
  grid-column: 10 / 13;
  justify-self: end;
  display: flex;
  gap: 40px;
}

.footer-link {
  font-size: 12px;
  font-weight: 400;
  line-height: 12px;
  letter-spacing: -0.2px;
  color: var(--white);
  text-decoration: none;
  text-transform: uppercase;
}

.footer-link:hover { color: var(--green); }

/* ── RESEARCH ── */

.research-hero {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);

  max-width: var(--frame);
  margin: 0 auto;
  padding-bottom: 12px;
}

.research-hero .hero-title {
  font-weight: 800;
  letter-spacing: 0.01em;
}

.research-hero .hero-content {
  grid-column: 1 / 8;
}
.research-list {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 54px;
}

.research-item {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);

  max-width: var(--frame);
  margin: 0 auto;
  padding: 48px 0;

  border-bottom: 1px solid rgba(255,255,255,0.34);
}

.research-topline {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  line-height: 1;
  color: #101010;
  margin-bottom: 0;
}

.badge-green { background: var(--green); color: var(--green-dark); }
.badge-blue { background: var(--blue); color: var(--blue-dark); }
.badge-yellow { background: var(--yellow); color: var(--red-dark); }
.badge-purple { background: var(--purple); color: var(--purple-dark); }

.research-code {
  display: inline-flex;
  align-items: center;
  height: 20px;
  font-family: "Kode Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: 14px;
  color: rgba(255,255,255,0.70);
}

.research-meta {
  grid-column: 1 / 6;
}

.research-meta h2 {
  font-size: 38px;
  line-height: 0.98;
  letter-spacing: 0.01em;
  margin-bottom: 22px;
}

.specs {
  font-family: "Kode Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: 14px;
  line-height: 1.55;
}
.specs {
  margin-top: 12px;
}

.research-actions {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}

.outline-button {
  display: inline-block;
  border: 1px solid var(--cement);
  padding: 12px 16px;
  text-decoration: none;
  text-transform: uppercase;
  font-family: "Kode Mono", monospace;
  letter-spacing: .08em;
  font-size: 14px;
  white-space: nowrap;
}

.research-copy {
  grid-column: 7 / 13;

  margin-top: 0;
  max-width: none;
}

.research-copy p {
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 26px;
}

/* ── TEAM ── */

.team-hero {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  max-width: var(--frame);
  margin: 0 auto;
  padding: 52px 0 64px;
}

.team-hero .hero-content {
  grid-column: 1 / 9;
  max-width: none;
  padding-right: 0;
}

.hero.team-hero .hero-subtitle {
  max-width: 820px;
  font-size: 28px;
  line-height: 38px;
  margin-top: 12px;
}

.team-hero .hero-content + .hero-content {
  margin-top: 0;
}

.team-hero .hero-title {
  font-size: 84px;
  line-height: 0.92;
  letter-spacing: 0.01em;
}

/* ===== FOUNDERS ===== */

.founders-grid {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  max-width: var(--frame);
  margin: 0 auto;
  padding: 0;
}

.founder-card:nth-child(1) {
  grid-column: 1 / 7;
}

.founder-card:nth-child(2) {
  grid-column: 7 / 13;
}

.founder-card {
  border-bottom: 1px solid var(--line);
  padding-bottom: 48px;
}

.founder-card img {
  width: 100%;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  object-position: center center;
  display: block;
  margin-bottom: 24px;
}

.founder-card:nth-child(1) img {
  object-position: center 16%;
}

.founder-card:nth-child(2) img {
  object-position: center 14%;
}

.founder-card h2 {
  font-size: 34px;
  letter-spacing: 0.01em;
  margin: 12px 0 6px;
}

.founder-card p {
  font-size: 15px;
  line-height: 1.5;
  max-width: 484px;
  color: var(--text-dim);
}

.founder-card .status-badge {
  margin-bottom: 10px;
  display: inline-block;
}


/* ===== TEAM GRID ===== */

.team-grid {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  max-width: var(--frame);
  margin: 0 auto;
  padding: 0 0 54px;
}

.team-member {
  grid-column: span 4;
  padding: 32px 0;
  border-bottom: 1px solid var(--line);
}

.team-member h3 {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1;
  text-transform: uppercase;
}

.team-member p {
  margin: 18px 0 0;
  font-size: 15px;
  line-height: 1.45;
  max-width: 340px;
  color: var(--text-dim);
}

.team-member .status-badge {
  display: inline-block;
  margin-bottom: 10px;
}

/* ── CONTACT ── */

.contact-page {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);

  max-width: var(--frame);
  margin: 0 auto;

  padding: 52px 0 64px;
  min-height: auto;
}

.contact-page > * {
  grid-column: 1 / 8;
}

.contact-page .kode-label {
  margin-bottom: 20px;
}

.contact-page h1 {
  font-size: 96px;
  line-height: 0.92;
  letter-spacing: 0.01em;
  margin: 0 0 48px;
}

.contact-page p {
  max-width: calc(7 * var(--col) + 6 * var(--gutter));
  font-size: 34px;
  line-height: 1.35;
  margin: 0 0 48px;
  font-weight: 300;
  color: var(--text-mid);
}

.contact-page a {
  display: inline-block;

  font-weight: 900;
  color: var(--white);

  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 2px;
}

/* ── LEGAL PAGES ── */

.legal-page {
  padding: 120px 0 80px;
}

.legal-container {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 var(--page-edge);
}

.legal-container h1 {
  font-size: 32px;
  margin-bottom: 24px;
}

.legal-container p,
.legal-container li {
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-mid);
}

.legal-container ul {
  padding-left: 20px;
  margin: 12px 0;
}

.legal-container li {
  margin-bottom: 6px;
}


/* -- ARTICLE -- */

.research-article {
  padding: 96px 0 80px;
}

.article-grid {
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  max-width: var(--frame);
  margin: 0 auto;
}

/* Left rail */
.article-meta {
  grid-column: 1 / 5;
  grid-row: 1 / span 50;
}

.article-content {
  display: contents !important;
}

.article-content > h2,
.article-content > h3,
.article-content > p,
.article-content > .article-image,
.article-content > .callout {
  grid-column: 6 / 13;
}

.article-content > p {
  font-size: 16px;
  line-height: 1.55;
  margin: 0 0 24px;
}

.article-image img {
  width: 100%;
  display: block;
}

.article-wide-image {
  grid-column: 1 / 13 !important;
  margin-top: 32px;
}

.article-wide-image img {
  width: 100%;
  display: block;
}

.article-divider {
  grid-column: 1 / 13;
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  margin: 56px 0 32px;
}

.article-divider::before,
.article-divider::after {
  content: "";
  height: 1px;
  background: rgba(255,255,255,.35);
}

.article-divider::before {
  grid-column: 1 / 5;
}

.article-divider::after {
  grid-column: 6 / 13;
}

.media-row {
  grid-column: 1 / 13;
  display: grid;
  grid-template-columns: repeat(12, var(--col));
  column-gap: var(--gutter);
  align-items: center;
}

.media-img {
  grid-column: 1 / 5;
}

.media-img img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.media-text {
  grid-column: 6 / 13;
}

.quote {
  display: grid;
  grid-template-columns: 28px 1fr;
  column-gap: 36px;
  align-items: center;
  margin: 0;
}

.quote::before {
  content: "";
  width: 28px;
  height: 120px;
  background: var(--yellow);
}

.quote p {
  margin: 0;
  font-size: 28px;
  line-height: 1.28;
  font-weight: 300;
}

.callout {
  grid-column: 6 / 13;
  background: #666;
  padding: 32px 40px;
  margin: 0 0 32px;
}

/* =========================================================
   Tablet + Mobile Responsive Layouts
   ========================================================= */

@media (max-width: 1200px) {

  /* Collapse main grids to single column */
  .frame,
  .article-grid,
  .research-row,
  .quote-block {
    grid-template-columns: 1fr !important;
  }

  /* Kill sticky sidebar behavior */
  .article-meta {
    position: static !important;
  }

  /* Fix quote layout (your current issue) */
  .quote-block {
    display: grid;
    gap: 24px;
  }

  .quote-accent {
    width: 60px;
    height: 4px;
  }

}


/* ─────────────────────────────
   MOBILE (≤ 768px)
   Collapse everything to flow
   ───────────────────────────── */
@media (max-width: 768px) {

  :root {
    /* desktop = 80px */
    --page-edge: 12px;

    /* desktop = 24px */
    --gutter: 12px;

    /* desktop values become irrelevant on mobile */
    --section-left: 0px;
    --section-gap: 16px;

    /* slightly narrower card arrow */
    --card-arrow-width: 48px;

    /* recalc dependent values */
    --frame: min(var(--frame-max), calc(100vw - (2 * var(--page-edge))));
    --col: calc((var(--frame) - (11 * var(--gutter))) / 12);
  }

  /* ── GLOBAL LAYOUT ── */

  .hero,
  .frame,
  .article-grid,
  .research-row,
  .quote-block,
  .founder-grid,
  .section {
    display: block !important;
  }

  .minimal-hero {
    min-height: 0 !important;
    padding-top: 64px;
    padding-bottom: 260px;
  }

  .minimal-hero .hero-content {
    padding-top: 0;
  }

  .minimal-hero + footer,
  body:has(.minimal-hero) footer {
    margin-top: 0;
  }

  .article-page *,
  .research-page *,
  .hero * {
    position: static !important;
    transform: none !important;
  }

  .section {
    padding: 48px 0px !important;
  }

  /* Reset grid column spans */
  .headline-block,
  .text-block,
  .projects-list {
    grid-column: auto !important;
    width: 100% !important;
  }

  /* kill absolute positioning from desktop */
  .article-page *,
  .research-page *,
  .hero * {
    position: static !important;
    transform: none !important;
  }

  /* ── TYPOGRAPHY ── */

  .hero-content {
    width: 100%;
  }

  .hero-subtitle {
    font-size: 24px !important;
    line-height: 1.25 !important;
    max-width: 320px;
  }

  h1 {
    font-size: 56px !important;
    line-height: 1.05 !important;
  }

  h2 {
    font-size: 28px !important;
  }

  .section-title {
    font-size: 40px !important;
    line-height: 1.05 !important;
  }

  p {
    font-size: 18px !important;
    line-height: 1.5 !important;
  }

  .kode-label {
    font-size: 28px !important;
  }

  /* ── MISSION / SECTION ── */

  .headline-block {
    margin-bottom: 24px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 24px;
  }

  .section-body,
  .prose {
    max-width: 100% !important;
  }

  /* ── PROJECT CARDS ── */

  .project-card {
    grid-template-columns: 1fr !important;
  }

  .project-arrow {
    width: 100%;
    height: 48px;
    min-width: unset;
  }

  /* ── ARTICLE IMAGES ── */

  .article-content img {
    width: 100%;
    height: auto;
    margin: 24px 0;
  }

  /* ── QUOTE BLOCK ── */

  .quote-block {
    display: block !important;
    margin: 32px 0;
  }

  .quote-accent {
    width: 40px;
    height: 4px;
    margin-bottom: 12px;
  }

  .research-topline {
    align-items: center;
  }

  .research-item {
    display: block !important;
  }

  .research-meta,
  .research-copy {
    grid-column: auto !important;
    width: 100% !important;
  }

  .research-meta h2 {
    font-size: 28px !important;
    line-height: 1.05;
  }

  .research-copy {
    margin-top: 24px;
  }

  .research-code {
    height: auto;
  }

  .research-actions {
    flex-direction: column;
    gap: 12px;
  }

  .outline-button {
    width: 100%;
    min-height: 52px;
    text-align: center;
  }

  /* ── RESEARCH LINKS (BUTTONS) ── */

  .research-links {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px;
  }

  .research-links a {
    width: 100%;
  }

  /* ── EXPLORE CTA ── */

  .explore-bar {
    flex-direction: column !important;
    align-items: flex-start !important;

    height: auto !important;
    padding: 32px 20px !important;
    gap: 12px;
  }

  .explore-eyebrow {
    width: auto !important;
  }

  .explore-title {
    text-align: left !important;
    font-size: 36px !important;
    line-height: 1.1 !important;
    width: 100%;
  }

  .explore-arrow {
    width: auto !important;
    text-align: left !important;
    font-size: 32px !important;
  }

  .explore-arrow2 {
    font-size: 48px;
    color: var(--black);
    line-height: 1;
    width: 60px;
    text-align: right;
  }

  /* ── NAV ── */

  .site-nav {
    position: relative;
    height: 64px;
    z-index: 1000;
  }

  .nav-inner {
    height: 64px;
    display: flex;
    align-items: center;
  }
  .brand {
    width: auto !important;
    margin-right: auto;
  }

  .brand img {
    width: 80px !important;
    height: auto;
  }

  /* hide desktop nav */
  .nav-links {
    display: none !important;

    position: absolute;
    top: 100%;
    left: 0;
    right: 0;

    flex-direction: column !important;

    background: #000;
    opacity: 1;

    z-index: 1001;
  }

  /* open state */
  .nav-links.open {
    display: flex !important;
  }

  .nav-link {
    width: 100%;
    height: auto !important;
    padding: 16px 20px !important;
    background: #000;
  }

  .nav-status {
    display: flex !important;
    align-items: center;
    margin-right: 12px;
    position: relative;
    top: 4px;
  }

  .status-label {
    display: none;
  }

  .status-dot {
    width: 10px;
    height: 10px;
  }

  .mobile-menu {
    display: flex;
    flex-direction: column;
    justify-content: center;

    width: 28px;
    height: 28px;
    padding: 0;

    position: relative;
    top: 4px;
  }

  .mobile-menu span {
    width: 22px;
    height: 2px;
    margin: 3px 0;
  }

  /* ── DIVIDERS ── */

  .divider {
    margin: 32px 0 !important;
  }


  /* ── CTA ── */

  .explore-cta {
    padding: 40px 20px !important;
  }

  .explore-cta h2 {
    font-size: 36px !important;
  }

  /* ── FOOTER ── */

  footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;

    padding-left: var(--page-edge);
    padding-right: var(--page-edge);
  }

}