:root {
  --cardinal: #8c1515;
  --cardinal-dark: #650f0f;
  --shell-background: #081b25;
  --teal: #00414d;
  --teal-deep: #00343d;
  --teal-bright: #0f7588;
  --sand: #f4f1ec;
  --stone: #ebe8e3;
  --ink: #18191b;
  --muted: #57595c;
  --line: #d6d2cc;
  --white: #ffffff;
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
  --width: 1160px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--white);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.62;
}

/* Match the mockup's Tailwind heading reset without a runtime dependency. */
h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
}

a {
  color: inherit;
}

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

button,
summary {
  font: inherit;
}

.site-width {
  width: min(calc(100% - 48px), var(--width));
  margin-inline: auto;
}

.site-width.narrow {
  width: min(calc(100% - 48px), 920px);
}

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 8px;
  left: 8px;
  transform: translateY(-160%);
  padding: 10px 16px;
  background: var(--white);
  color: var(--cardinal);
  font-weight: 700;
}

.skip-link:focus {
  transform: translateY(0);
}



.brand-shell {
  position: relative;
  isolation: isolate;
  background: var(--shell-background);
  color: var(--white);
}


.brand-row {
  padding-block: 34px 32px;
}

.header-navigation {
  border-top: 1px solid rgb(255 255 255 / 12%);
  background: rgb(5 19 27 / 80%);
}

.site-brand {
  display: flex;
  align-items: center;
  width: fit-content;
  color: var(--white);
  text-decoration: none;
}


.lab-word {
  font-family: var(--serif);
  font-size: clamp(52px, 5.5vw, 72px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.05;
}


.desktop-nav {
  display: flex;
  gap: 38px;
  min-height: 68px;
  align-items: end;
}

.desktop-nav a {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 68px;
  padding-block: 18px;
  color: var(--white);
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
}

.desktop-nav a::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  background: transparent;
  content: "";
}

.desktop-nav a:hover::after,
.desktop-nav a.active::after {
  background: #e53e3e;
}

.mobile-nav {
  display: none;
}

.hero {
  position: relative;
  display: grid;
  min-height: 660px;
  align-items: center;
  overflow: hidden;
  background:
    url("/levlab-website/images/cavity.jpg") center 46% / cover no-repeat,
    var(--teal-deep);
  color: var(--white);
}

.hero-overlay,
.project-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgb(0 0 0 / 82%) 0%, rgb(0 0 0 / 58%) 42%, rgb(0 0 0 / 55%) 78%),
    linear-gradient(0deg, rgb(0 52 61 / 35%), transparent 60%);
}

.hero-content {
  position: relative;
  z-index: 1;
  padding-block: 80px;
}

.hero-content h1 {
  max-width: 850px;
  margin: 0 0 24px;
  font-family: var(--serif);
  font-size: clamp(48px, 5.6vw, 82px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.04;
}

.hero-content > p {
  max-width: 720px;
  margin: 0 0 34px;
  font-size: clamp(20px, 2vw, 27px);
  line-height: 1.5;
}

.hero-button,
.text-button {
  display: inline-flex;
  align-items: center;
  min-height: 50px;
  padding: 10px 22px;
  border: 2px solid currentColor;
  border-radius: 28px;
  font-weight: 800;
  text-decoration: none;
}

.hero-button {
  color: var(--white);
}

.hero-button:hover {
  background: var(--white);
  color: var(--shell-background);
}

.text-button {
  margin-top: 12px;
  border-color: var(--cardinal);
  color: var(--cardinal);
}

.text-button:hover {
  background: var(--cardinal);
  color: var(--white);
}

.section {
  padding-block: 56px;
}

.section-soft {
  background: var(--sand);
}

.section-heading {
  max-width: 760px;
  margin-bottom: 38px;
}

.section-heading.centered {
  margin-inline: auto;
  text-align: center;
}

.section-heading h2,
.catalog-heading h2,
.contact-band h2 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(28px, 3.2vw, 42px);
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.section-heading > p {
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 20px;
}

.project-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}

.vertical-postcard {
  display: flex;
  min-width: 0;
  flex-direction: column;
  background: var(--white);
  border-bottom: 5px solid var(--teal-bright);
  box-shadow: 0 4px 16px rgb(38 32 26 / 6%);
}

.postcard-image {
  display: block;
  overflow: hidden;
}

.postcard-image img {
  width: 100%;
  aspect-ratio: 1.45 / 1;
  object-fit: cover;
  transition: transform 180ms ease;
}

.vertical-postcard:hover .postcard-image img {
  transform: scale(1.025);
}

.postcard-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 28px 28px 30px;
}

.postcard-body :is(h2, h3),
.news-card-body :is(h2, h3),
.person-card :is(h2, h3),
.publication-cards h3 {
  margin: 0 0 12px;
  font-family: var(--serif);
  font-size: 29px;
  line-height: 1.18;
}

.postcard-body :is(h2, h3) a,
.publication-cards h3 a {
  text-decoration-color: transparent;
  text-underline-offset: 4px;
}

.postcard-body :is(h2, h3) a:hover,
.publication-cards h3 a:hover {
  text-decoration-color: currentColor;
}

.postcard-body > p {
  margin: 0 0 22px;
  color: var(--muted);
}

.arrow-link {
  margin-top: auto;
  color: #006b81;
  font-weight: 800;
  text-decoration: none;
}

.arrow-link:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.about-grid,
.research-intro,
.contact-layout,
.two-column-text {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 72px;
  align-items: start;
}

.two-column-text {
  grid-template-columns: 0.9fr 1.1fr;
}

.lead {
  font-size: 22px;
  line-height: 1.55;
}

.about-grid > div > p.lead,
.about-grid > div > p,
.about-grid ul {
  font-size: 19px;
  line-height: 1.55;
}

.about-grid ul {
  margin: 0 0 20px;
  padding-left: 22px;
  color: var(--muted);
}

.about-grid li {
  margin-bottom: 10px;
}

.callout-box,
.spotlight {
  padding: 36px;
  border-top: 3px solid var(--cardinal);
  background: var(--sand);
  box-shadow: none;
}

.spotlight {
  border-top-color: var(--teal-bright);
}

.callout-box h2,
.spotlight h2,
.address-card h2 {
  margin: 0 0 16px;
  font-family: var(--serif);
  font-size: 33px;
  line-height: 1.15;
}

.spotlight ul {
  margin: 20px 0 0;
  padding-left: 22px;
}

.project-news-list {
  margin: 22px 0;
}

.project-news-list article {
  padding: 16px 0;
  border-top: 1px solid var(--line);
}

.project-news-list article:last-child {
  border-bottom: 1px solid var(--line);
}

.project-news-list p {
  margin: 0 0 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.project-news-list p span {
  color: var(--teal-bright);
}

.project-news-list h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.3;
}

.project-news-empty {
  color: var(--muted);
}

.news-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: none;
  margin-inline: auto;
  gap: 14px;
}

.news-card {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  background: var(--white);
  color: var(--ink);
  box-shadow: 0 2px 10px rgb(38 32 26 / 5%);
}

.news-card-image {
  min-height: 132px;
}

.news-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.news-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 14px 22px;
}

.content-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.content-category {
  padding-left: 10px;
  border-left: 4px solid var(--teal-bright);
  color: var(--ink);
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.news-card-body :is(h2, h3) {
  margin-bottom: 2px;
  font-size: 22px;
  line-height: 1.25;
}

.content-date {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.news-card-body .content-summary {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.45;
}

.section-action {
  margin-top: 34px;
  text-align: center;
}

.supporter-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 32px 24px;
}

.supporter-logo-slot {
  display: flex;
  flex: 0 0 140px;
  align-items: center;
  justify-content: center;
}

.supporter-logo {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 120px;
}

.contact-band {
  padding-block: 50px;
  background: var(--shell-background);
  border-bottom: 1px solid rgb(255 255 255 / 16%);
  color: var(--white);
}

.contact-band-grid {
  display: grid;
  grid-template-columns: 1fr 0.65fr auto;
  gap: 48px;
  align-items: center;
}

.contact-band h2 {
  font-size: 36px;
}

.contact-band p {
  margin-block: 0;
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-block: 18px;
  color: var(--muted);
  font-size: 14px;
}

.breadcrumbs span {
  display: flex;
  gap: 10px;
}

.breadcrumbs a {
  color: var(--cardinal);
}

.page-intro {
  padding-block: 16px 24px;
  background: var(--white);
}

.section-tight {
  padding-block: 48px 0;
}

.group-photo {
  overflow: hidden;
  box-shadow: none;
}

.group-photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.page-intro h1 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(30px, 3vw, 40px);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.page-intro .lead { margin-top: 18px; }
.page-intro:not(.detail-intro) > .site-width { width: min(calc(100% - 48px), var(--width)); }
.page-intro:not(.detail-intro) + .section { padding-top: 28px; }
@media (max-width: 680px) {
  .page-intro:not(.detail-intro) > .site-width { width: calc(100% - 32px); }
}

.page-intro .lead p {
  max-width: 850px;
  margin: 0;
}

.project-hero {
  position: relative;
  display: grid;
  min-height: 520px;
  align-items: end;
  background-position: center;
  background-size: cover;
  color: var(--white);
}

.project-hero-overlay {
  background:
    linear-gradient(90deg, rgb(0 0 0 / 85%) 0%, rgb(0 0 0 / 48%) 58%, transparent),
    linear-gradient(0deg, rgb(0 52 61 / 38%), transparent);
}

.project-hero-content {
  position: relative;
  z-index: 1;
  padding-block: 78px;
}

.project-hero-content h1 {
  max-width: 800px;
  margin: 0 0 18px;
  font-family: var(--serif);
  font-size: clamp(48px, 6vw, 76px);
  line-height: 1.04;
}

.project-hero-content > p {
  max-width: 740px;
  margin: 0;
  font-size: 23px;
}

.accordion-stack {
  width: min(100%, 980px);
  margin-inline: auto;
}

.accordion-stack details {
  border-bottom: 1px solid #b6b1aa;
  background: var(--white);
}

.accordion-stack summary {
  position: relative;
  cursor: pointer;
  list-style: none;
  padding: 23px 62px 23px 26px;
  color: var(--teal-deep);
  font-size: 20px;
  font-weight: 800;
}

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

.accordion-stack summary::after {
  position: absolute;
  top: 50%;
  right: 28px;
  content: "+";
  font-size: 28px;
  transform: translateY(-50%);
}

.accordion-stack details[open] summary::after {
  content: "−";
}

.accordion-stack details > div {
  padding: 0 26px 28px;
  color: var(--muted);
}

.publication-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-bottom: 26px;
}

.publication-cards article {
  padding: 28px;
  border-left: 5px solid var(--teal-bright);
  background: var(--sand);
}

.publication-cards h3 {
  font-size: 24px;
}

.publication-cards p {
  margin: 12px 0 0;
  color: var(--muted);
}

.catalog-heading {
  margin-bottom: 30px;
  padding: 22px 28px;
  background: var(--stone);
  text-align: center;
}

.catalog-heading h2 {
  font-size: 42px;
}

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

.team-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
}

.person-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center top;
}

.person-card-placeholder {
  display: flex;
  width: 100%;
  aspect-ratio: 1 / 1;
  align-items: center;
  justify-content: center;
  background: var(--stone);
}

.person-card-placeholder span {
  color: var(--muted);
  font-family: var(--serif);
  font-size: 54px;
  font-weight: 700;
}

.person-card :is(h2, h3) {
  margin-top: 18px;
  font-size: 27px;
  text-decoration: underline;
  text-decoration-color: #aaa49c;
  text-underline-offset: 5px;
}

.person-role {
  margin: 0 0 10px;
  padding: 3px 0 3px 14px;
  border-left: 4px solid var(--cardinal);
  font-size: 14px;
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.35;
  text-transform: uppercase;
}

.person-card p:last-child {
  margin: 0;
  color: var(--muted);
}

.alumni-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 32px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.alumni-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.35;
}

.alumni-tag {
  flex: none;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 13px;
  font-style: italic;
}

.publication-browser {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 70px;
}

.publications-section {
  padding-top: 54px;
}

.publication-filters {
  display: grid;
  align-content: start;
  gap: 10px;
}

.publication-filters button {
  cursor: pointer;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--white);
  color: var(--cardinal);
  font-weight: 800;
  text-align: left;
}

.publication-filters button:hover,
.publication-filters button.active {
  border-color: var(--cardinal);
  background: var(--cardinal);
  color: var(--white);
}

.timeline {
  position: relative;
  padding-left: 30px;
  border-left: 3px solid var(--teal-bright);
}

.timeline details {
  position: relative;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.timeline details::before {
  position: absolute;
  top: 24px;
  left: -38px;
  width: 13px;
  height: 13px;
  border: 3px solid var(--teal-bright);
  border-radius: 50%;
  background: var(--white);
  content: "";
}

.timeline summary {
  display: flex;
  cursor: pointer;
  list-style: none;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0 20px;
}

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

.timeline summary span:first-child {
  font-family: var(--serif);
  font-size: 38px;
  font-weight: 700;
}

.timeline summary span:last-child {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.timeline-items {
  padding-bottom: 12px;
}

.timeline-items article {
  padding: 24px 0;
  border-top: 1px solid var(--line);
}

.timeline-items h2 {
  margin: 0 0 8px;
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.3;
}

.timeline-items h2 a {
  text-decoration-color: #aba59c;
  text-underline-offset: 4px;
}

.timeline-items p {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 15px;
}

.venue-link {
  color: var(--cardinal);
  font-size: 15px;
  font-weight: 800;
}

.news-page-list {
  max-width: 1040px;
}

.contact-layout {
  grid-template-columns: 1fr 0.7fr;
  gap: 36px;
}

.address-card {
  padding: 28px;
  border: 1px solid var(--line);
  border-left: 8px solid var(--teal);
}

.address-card h3,
.contact-section .callout-box h3 {
  margin: 0 0 14px;
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.25;
}

.contact-section {
  padding-block: 48px;
}

.contact-section .callout-box {
  padding: 28px;
}

.contact-section .callout-box p:last-child,
.address-card p {
  margin-bottom: 0;
}

.site-footer {
  background: var(--shell-background);
  color: var(--white);
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 0.7fr 1fr;
  gap: 60px;
  padding-block: 58px;
}

.footer-brand {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 20px;
  font-size: 25px;
  font-weight: 700;
}

.footer-brand .lab-word {
  font-size: 40px;
}

.footer-grid h2 {
  margin: 0 0 14px;
  font-size: 18px;
}

.footer-grid > div:nth-child(2) {
  display: flex;
  flex-direction: column;
  align-items: start;
}

.footer-grid p {
  color: rgb(255 255 255 / 78%);
}

.footer-grid a {
  margin-bottom: 6px;
  text-underline-offset: 4px;
}


:focus-visible {
  outline: 3px solid #f7d154;
  outline-offset: 4px;
}

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

  .mobile-nav {
    display: block;
    padding-block: 12px;
  }

  .mobile-nav summary {
    cursor: pointer;
    font-weight: 800;
  }

  .mobile-nav nav {
    display: grid;
    margin-top: 12px;
    border-top: 1px solid rgb(255 255 255 / 28%);
  }

  .mobile-nav nav a {
    padding: 12px 14px;
    border-left: 4px solid transparent;
    border-bottom: 1px solid rgb(255 255 255 / 20%);
    text-decoration: none;
  }

  .mobile-nav nav a[aria-current="page"],
  .mobile-nav nav a:hover {
    border-left-color: #e53e3e;
    background: rgb(255 255 255 / 6%);
  }

  .project-cards,
  .people-grid,
  .team-grid,
  .alumni-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-cards .vertical-postcard:last-child {
    grid-column: 1 / -1;
    width: calc(50% - 15px);
    justify-self: center;
  }

  .about-grid,
  .research-intro,
  .contact-layout,
  .two-column-text,
  .publication-browser {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .publication-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .contact-band-grid {
    grid-template-columns: 1fr 1fr;
  }

  .contact-band-grid .hero-button {
    grid-column: 1 / -1;
    width: fit-content;
  }

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

  .footer-grid > div:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  body {
    font-size: 16px;
  }

  .site-width,
  .site-width.narrow {
    width: min(calc(100% - 32px), var(--width));
  }

  .brand-row {
    padding-block: 28px 26px;
  }



  .lab-word {
    font-size: 48px;
  }


  .hero {
    min-height: 590px;
    background-position: 58% center;
  }

  .hero-overlay {
    background: linear-gradient(90deg, rgb(0 0 0 / 84%), rgb(0 0 0 / 55%));
  }

  .hero-content {
    padding-block: 60px;
  }

  .section {
    padding-block: 40px;
  }

  .project-cards,
  .people-grid,
  .publication-cards,
  .alumni-list,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .publication-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-cards .vertical-postcard:last-child {
    grid-column: auto;
    width: auto;
  }

  .news-card {
    grid-template-columns: 1fr;
  }

  .news-card-image {
    min-height: 0;
  }

  .news-card-image img {
    height: auto;
    aspect-ratio: 2 / 1;
  }

  .news-card-body {
    padding: 20px 22px 22px;
  }

  .contact-band-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .contact-band-grid .hero-button {
    grid-column: auto;
  }

  .project-hero {
    min-height: 500px;
  }

  .project-hero-overlay {
    background: linear-gradient(90deg, rgb(0 0 0 / 80%), rgb(0 0 0 / 42%));
  }

  .timeline {
    margin-left: 7px;
    padding-left: 22px;
  }

  .timeline details::before {
    left: -30px;
  }

  .footer-grid > div:first-child {
    grid-column: auto;
  }
}

/* Static production additions. Shared visual language comes from the approved mockup. */
[hidden] { display: none !important; }
img { height: auto; }
figure { margin: 0; }
button, input { font: inherit; }
a { overflow-wrap: anywhere; }
.prose { font-size: 18px; line-height: 1.7; }
.prose > :first-child { margin-top: 0; }
.prose > :last-child { margin-bottom: 0; }
.prose a, .timeline a { color: var(--cardinal); text-underline-offset: 3px; }
.prose h2, .prose h3 { font-family: var(--serif); line-height: 1.2; }
.prose img { max-width: 100%; margin-block: 20px; }
.prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.prose td, .prose th { padding: 10px; border: 1px solid var(--line); }
.prose video { max-width: 100%; }
.research-summary { max-width: 940px; margin: 0 auto 52px; }
.detail-content { max-width: 900px; margin-inline: auto; }
.story-image { float: right; width: min(40%, 360px); max-height: 420px; object-fit: contain; margin: 0 0 24px 36px !important; }
.detail-content::after { content: ''; display: block; clear: both; }
.news-card.no-image { grid-template-columns: 1fr; }
.news-card-image { max-height: 180px; }
.news-card-body :is(h2, h3) a { text-decoration-color: transparent; }
.news-card-body :is(h2, h3) a:hover { text-decoration-color: currentColor; }
.search-control { max-width: none; margin: 0 auto 30px; }
.search-control label { display: block; font-weight: 700; margin-bottom: 8px; }
.search-control input { width: 100%; border: 1px solid #918c84; border-radius: 3px; padding: 12px 16px; background: white; color: var(--ink); }
.search-control [role=status] { min-height: 1.6em; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.without-filters { display: block; }
.timeline-items article > p { font-size: 17px; line-height: 1.65; color: var(--ink); }
.timeline-items article strong { color: var(--ink); }
.publications-section .page-intro { padding-block: 30px; }
.principal-grid { grid-template-columns: minmax(0, 340px); }
.people-grid .person-card img { max-height: 370px; }
.person-detail { display: grid; grid-template-columns: minmax(180px, 300px) minmax(0, 1fr); gap: 50px; max-width: 1000px; margin-inline: auto; }
.person-detail > img { width: 100%; }
.person-detail .field__label { font-weight: 700; }
.related-projects { max-width: 900px; margin: 30px auto 0; display: flex; gap: 16px; flex-wrap: wrap; }
.legacy-content { max-width: 950px; margin-inline: auto; }
.site-footer a:focus-visible, .brand-shell a:focus-visible { outline-color: #f7d154; }
main :focus-visible { outline-color: #006b81; }
@media(max-width:680px) {
 .person-detail { grid-template-columns: 1fr; gap: 24px; }
 .person-detail > img { max-width: 260px; }
 .story-image { float: none; width: min(100%,420px); margin: 0 auto 24px !important; }
 .news-card-image { max-height: 230px; }
 .timeline-items article > p { font-size: 16px; }
 .supporter-logos { gap: 32px; }
 .supporter-logo-slot { flex-basis: min(140px, calc((100% - 32px) / 2)); }
 .supporter-logo { max-height: 105px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }
.publication-metadata { margin-top: 28px; }
.publication-metadata > div { margin-bottom: 20px; }
.publication-metadata > div > div:first-child { font-weight: 700; }
.compact-intro { padding-block: 16px 24px; }
.research-background { margin-top: 20px; padding-block: 15px; border-block: 1px solid var(--line); }
.research-background summary { cursor: pointer; color: var(--cardinal); font-weight: 700; }
.timeline .publication-title-link { color: inherit; text-decoration: none; }
.timeline .publication-title-link:hover,
.timeline .publication-title-link:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
/* Cached preview thumbnails keep their intrinsic size until full media is available. */
img.preview-image-fallback,
img.intrinsic-source-image {
  width: auto;
  height: auto;
  max-width: 100%;
  aspect-ratio: auto;
}

.news-pagination {
  display: grid;
  justify-items: center;
  gap: 16px;
  margin-top: 42px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.news-pagination[hidden] { display: none; }
.news-pagination-summary {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
}
.news-pagination-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.pagination-link {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 8px 13px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--white);
  color: var(--ink);
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.pagination-link:hover {
  border-color: var(--cardinal);
  color: var(--cardinal);
}
.pagination-link[aria-current="page"] {
  border-color: var(--cardinal);
  background: var(--cardinal);
  color: var(--white);
}
.pagination-link:focus-visible {
  outline: 3px solid var(--teal-bright);
  outline-offset: 3px;
}
.pagination-link[aria-disabled="true"] {
  color: var(--muted);
  background: transparent;
  opacity: 0.55;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Compact People directory and mockup-style Research overview. */
.research-overview-details {
  max-width: 920px;
  margin: 40px auto 0;
}
.research-overview-details > .prose { margin-top: 20px; }
.people-grid:not(.team-grid) {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 38px 28px;
}
.people-grid.principal-grid { grid-template-columns: minmax(0, 260px); }
.people-grid .person-card img,
.person-card-placeholder {
  width: min(100%, 180px);
  aspect-ratio: 1;
  object-fit: cover;
}
.people-grid .person-card :is(h2, h3) {
  margin-top: 14px;
  font-size: 24px;
}
.people-grid .person-card { min-width: 0; font-size: 16px; }
.group-photo { max-width: 880px; margin-inline: auto; }
.group-photo img { aspect-ratio: auto; }
@media (max-width: 960px) {
  .people-grid:not(.team-grid):not(.principal-grid) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .people-grid:not(.team-grid):not(.principal-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 20px;
  }
  .people-grid .person-card :is(h2, h3) { font-size: 22px; }
}

/* Shared profile and contact bodies follow the approved compact page components. */
.contact-section .contact-layout { align-items: start; }
.contact-directions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 26px; }
.jobs-callout { max-width: 720px; margin-inline: auto; }
.profile-layout { grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: 54px; max-width: 900px; }
.profile-summary > img { display: block; width: min(100%, 180px); height: auto; margin-bottom: 22px; }
.profile-summary p { margin: 0 0 14px; }
.profile-summary .person-role { margin-bottom: 14px; }
.profile-context { color: var(--muted); font-size: 16px; }
.profile-contacts { overflow-wrap: anywhere; }
.profile-projects { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 22px; font-size: 16px; }
.profile-content-section { margin: 0 0 38px; }
.profile-content-section > h2 { margin: 0 0 18px; font-family: var(--serif); font-size: 30px; }
.profile-content-section p:empty { display: none; }
.profile-layout.summary-only { display: block; }
.profile-layout.summary-only .profile-summary { max-width: 360px; }
.detail-intro { padding-block: 18px 24px; }
.detail-intro h1 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.18; text-wrap: balance; }
.detail-intro .site-width { max-width: 1100px; }
@media (max-width: 680px) {
  .profile-layout { grid-template-columns: 1fr; gap: 30px; }
  .profile-summary { max-width: 420px; }
  .contact-directions { align-items: flex-start; flex-direction: column; }
  .contact-section .address-card, .contact-section .callout-box { padding: 24px; }
}

/* Readable publication details share the profile/contact spacing scale. */
.publication-facts { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 18px 26px; margin-top: 0; padding-top: 24px; border-top: 1px solid var(--line); }
.publication-facts dt { font-weight: 700; }
.publication-facts dd { margin: 0; }
.publication-facts .metadata-links { list-style: none; padding: 0; margin: 0; }
.publication-facts .metadata-links li { margin: 0 0 8px; }
.publication-facts .metadata-links li:last-child { margin-bottom: 0; }
.detail-content h3 { font-size: clamp(21px, 2.4vw, 27px); line-height: 1.4; }
@media (max-width: 680px) {
  .publication-facts { grid-template-columns: 1fr; gap: 8px; }
  .publication-facts dd { margin-bottom: 18px; }
}

/* Heading links follow the mockup's clean type; prose links retain underlines. */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: none; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h1 a:focus-visible, h2 a:focus-visible, h3 a:focus-visible, h4 a:focus-visible, h5 a:focus-visible, h6 a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.person-card :is(h2, h3) { text-decoration: none; }

/* Every page uses the same compact header and navigation geometry. */
.site-header .brand-shell {
  display: flex;
  align-items: center;
  gap: 40px;
  padding-inline: max(24px, calc((100% - var(--width)) / 2));
}
.site-header .brand-shell::before { display: none; }
.site-header .brand-row { flex: 0 0 auto; width: auto; margin: 0; padding-block: 20px; }
.site-header .lab-word { font-size: 48px; }
.site-header .header-navigation { flex: 1; margin-left: auto; border: 0; background: none; }
.site-header .header-navigation > .site-width { width: auto; margin: 0; }
.site-header .desktop-nav { justify-content: flex-end; align-items: center; gap: 26px; min-height: 88px; }
.site-header .desktop-nav a { min-height: 88px; font-size: 17px; }
.hero { min-height: 500px; }
.hero-content { padding-block: 62px; }
.hero-content h1 { font-size: clamp(38px, 5.3vw, 76px); }
@media (max-width: 960px) {
  .site-header .brand-shell { display: block; padding-inline: 24px; }
  .site-header .brand-row { padding-block: 18px; }
  .site-header .header-navigation { border-top: 1px solid rgb(255 255 255 / 12%); }
}
@media (max-width: 680px) {
  .site-header .brand-shell { padding-inline: 16px; }
  .site-header .lab-word { font-size: 42px; }
  .hero { min-height: 500px; }
  .hero-content { padding-block: 44px; }

}

/* A compact directory: portraits and their names occupy one balanced row. */
.people-directory .directory-photo { padding-block: 0 28px; }
.people-directory .group-photo { max-width: 720px; margin: 0 auto; }
.people-directory .group-photo img { width: 100%; height: auto; aspect-ratio: auto; }
.people-directory .directory-group { padding-block: 38px; }
.people-directory .directory-group > .site-width { max-width: 1100px; }
.people-directory .section-heading { margin-bottom: 26px; }
.people-directory .section-heading h2 { font-size: clamp(28px, 3vw, 36px); }
.people-directory .directory-group .people-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 30px;
}
.people-directory .person-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  min-width: 0;
}
.people-directory .person-card > img,
.people-directory .person-card-placeholder {
  width: 120px;
  height: 120px;
  aspect-ratio: 1;
  object-fit: cover;
}
.people-directory .person-card :is(h2, h3) {
  margin: 2px 0 10px;
  font-size: 23px;
  line-height: 1.18;
}
.people-directory .person-card .person-role {
  padding: 0;
  border: 0;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.45;
}
.people-directory .directory-small-group .people-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.people-directory .directory-principal { padding-block: 30px 38px; }
.people-directory .directory-principal .people-grid { grid-template-columns: 1fr; }
.people-directory .directory-principal .person-card {
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: 30px;
  max-width: 760px;
  margin-inline: auto;
}
.people-directory .directory-principal .person-card > img { width: 160px; height: 160px; }
.people-directory .directory-principal .person-card :is(h2, h3) { font-size: 32px; }
.people-directory .directory-principal .person-role { color: var(--cardinal); font-weight: 700; margin-bottom: 12px; }
.people-directory .directory-principal .person-card p:last-child { max-width: 540px; font-size: 17px; line-height: 1.5; }
.people-directory .alumni-list { gap: 0 30px; }
.people-directory .alumni-list li { padding-block: 11px; }
@media (max-width: 1040px) {
  .people-directory .directory-current .people-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .people-directory .directory-group { padding-block: 30px; }
  .people-directory .directory-photo { padding-bottom: 20px; }
  .people-directory .section-heading { margin-bottom: 22px; }
  .people-directory .directory-group .people-grid,
  .people-directory .directory-small-group .people-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .people-directory .person-card { display: block; }
  .people-directory .person-card :is(h2, h3) { margin-top: 12px; font-size: 22px; }
  .people-directory .person-card > img,
  .people-directory .person-card-placeholder { width: min(100%, 120px); height: auto; aspect-ratio: 1; }
  .people-directory .directory-principal .people-grid { grid-template-columns: 1fr; }
  .people-directory .directory-principal .person-card { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 20px; align-items: start; }
  .people-directory .directory-principal .person-card > img { width: 108px; height: 108px; }
  .people-directory .directory-principal .person-card :is(h2, h3) { margin-top: 0; font-size: 27px; }
  .people-directory .directory-principal .person-card p:last-child { font-size: 15px; }
}

/* Fit the complete CavMat photograph while sharing the project-card hover effect. */
.postcard-image.cavmat-apparatus img { object-fit: contain; background: #fff; }

/* Final presentation review: a consistent reading grid and restrained hierarchy. */
.page-intro + .section { padding-top: 24px; }
.detail-intro > .site-width,
.detail-content,
.legacy-content { width: min(100%, 900px); max-width: 900px; margin-inline: auto; }
.detail-intro > .site-width { width: min(calc(100% - 48px), 900px); }
.page-intro .lead { max-width: 900px; }
.detail-intro .lead { font-size: 15px; color: var(--muted); }
.section-heading { margin-bottom: 28px; }
.section-heading > p { font-size: 18px; }
.postcard-body { padding: 24px; }
.postcard-body :is(h2, h3) { font-size: 27px; }
.news-card-image { background: var(--stone); }
.news-card-image img { height: 100%; object-position: center; }
.news-card-body { padding: 18px 22px; }
.news-card-body :is(h2, h3) { font-size: 23px; }
.news-card { align-items: center; }
.news-card-image { align-self: stretch; height: auto; min-height: 144px; }
.news-card-image img { height: 144px; }
.person-role { padding: 0; border: 0; font-style: normal; font-weight: 400; letter-spacing: 0; text-transform: none; }
.project-heading { padding-block: 24px 32px; background: var(--sand); }
.project-heading-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.project-heading h1 { margin: 0 0 18px; font-family: var(--serif); font-size: clamp(32px, 4vw, 48px); line-height: 1.12; letter-spacing: -.025em; text-wrap: balance; }
.project-heading p { max-width: 620px; margin: 0; color: var(--muted); font-size: 20px; line-height: 1.55; }
.project-heading-image { width: 100%; height: 280px; object-fit: cover; }
.project-heading-image.apparatus-photo { object-fit: contain; background: white; }
.publication-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.publication-cards article { padding: 24px; border-left-width: 3px; background: white; }
.publication-cards h3 { font-size: 22px; line-height: 1.3; }
.people-directory .directory-opening { padding-block: 8px 40px; }
.directory-introduction { display: grid; grid-template-columns: 1.35fr 1fr; gap: 40px; align-items: center; }
.people-directory .directory-introduction .group-photo { max-width: none; width: 100%; }
.people-directory .directory-introduction .directory-principal { padding: 0; }
.people-directory .directory-introduction .person-card { display: block; max-width: 390px; margin: 0; }
.people-directory .directory-introduction .person-card > img { width: 128px; height: 128px; margin-bottom: 20px; }
.people-directory .directory-introduction .person-card :is(h2, h3) { font-size: 30px; }
.people-directory .directory-group > .site-width { max-width: var(--width); }
.contact-layout { grid-template-columns: 1fr 1fr; gap: 32px; }
.contact-section .address-card { border: 1px solid var(--line); border-top: 3px solid var(--cardinal); padding: 28px; }
.contact-section .callout-box { border: 1px solid var(--line); border-top: 3px solid var(--cardinal); }
.contact-section .address-card h2,
.contact-section .callout-box h2 { font-size: 29px; }
.contact-section .jobs-callout { border: 0; padding: 0; background: none; max-width: 760px; }
.contact-band { padding-block: 36px; }
.contact-band h2 { font-size: 30px; }
.footer-grid { padding-block: 38px; gap: 40px; }
.footer-brand { margin-bottom: 12px; }
@media (max-width: 960px) {
  .project-heading-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .project-heading-image { height: 240px; }
  .publication-cards { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; }
  .directory-introduction { grid-template-columns: 1.2fr 1fr; gap: 28px; }
  .people-directory .directory-introduction .person-card > img { width: 100px; height: 100px; margin-bottom: 14px; }
}
@media (max-width: 680px) {
  .detail-intro > .site-width { width: calc(100% - 32px); }
  .project-heading-grid, .directory-introduction { grid-template-columns: 1fr; gap: 24px; }
  .project-heading-image { height: auto; max-height: 280px; aspect-ratio: 4 / 3; }
  .project-heading p { font-size: 18px; }
  .people-directory .directory-introduction .person-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; max-width: none; }
  .people-directory .directory-introduction .person-card > img { width: 96px; height: 96px; margin: 0; }
  .people-directory .directory-introduction .person-card :is(h2, h3) { font-size: 26px; }
  .people-directory .directory-opening { padding-bottom: 30px; }
  .news-card-image { min-height: 0; height: 180px; }
  .news-card-image img { height: 180px; aspect-ratio: auto; }
  .contact-section .address-card, .contact-section .callout-box { padding: 22px; }
  .contact-section .jobs-callout { padding: 0; }
}

/* Compact small-screen controls without sacrificing readable tap targets. */
.people-directory .page-intro + .directory-opening { padding-top: 4px; }
.timeline summary { gap: 16px; }
.timeline summary span:last-child { margin-left: auto; }
.timeline summary::after { content: "+"; flex: none; width: 20px; color: var(--teal); font-size: 24px; text-align: center; }
.timeline details[open] > summary::after { content: "−"; }
@media (max-width: 960px) {
  .site-header .brand-shell { display: grid; grid-template-columns: 1fr auto; position: relative; align-items: center; }
  .site-header .header-navigation { border: 0; }
  .site-header .mobile-nav { padding: 0; }
  .site-header .mobile-nav summary { padding: 12px; }
  .site-header .mobile-nav nav { position: absolute; z-index: 20; top: 100%; left: 0; right: 0; margin: 0; padding: 4px 16px 16px; background: var(--shell-background); box-shadow: 0 8px 18px rgb(0 0 0 / 15%); }
  .publication-browser { gap: 28px; }
  .publication-filters { display: flex; flex-wrap: wrap; gap: 8px; }
  .publication-filters button { padding: 9px 12px; min-height: 42px; font-size: 14px; }
}

/* Publication catalog: quiet horizontal filters and a clear reading column. */
.publication-catalog .search-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 8px 16px; max-width: 620px; margin: 0 0 22px; }
.publication-catalog .search-control label { margin: 0; font-size: 14px; font-weight: 600; }
.publication-catalog .search-control input { grid-column: 1 / -1; grid-row: 2; min-width: 0; min-height: 46px; padding: 11px 14px; border-color: var(--line); border-radius: 4px; font: inherit; font-size: 16px; }
.publication-catalog .search-control [role=status] { grid-column: 2; grid-row: 1; margin: 0; font-size: 13px; }
.publication-catalog .publication-browser { display: block; }
.publication-catalog .publication-filters { display: flex; flex-wrap: wrap; gap: 0 12px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.publication-catalog .publication-filters button { min-height: 44px; margin-bottom: -1px; padding: 10px 12px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--muted); font-size: 15px; font-weight: 600; text-align: center; }
.publication-catalog .publication-filters button:hover { background: var(--sand); color: var(--shell-background); }
.publication-catalog .publication-filters button.active { border-bottom-color: var(--shell-background); background: transparent; color: var(--shell-background); }
.publication-catalog .publication-filters button:focus-visible { outline: 2px solid var(--teal-bright); outline-offset: -3px; }
.publication-catalog .timeline { padding-left: 0; border-left: 0; }
.publication-catalog .timeline details::before { display: none; }
.publication-catalog .timeline summary { padding: 6px 0 16px; }
.publication-catalog .timeline summary span:first-child { font-size: 30px; }
.publication-catalog .timeline summary span:last-child { font-size: 13px; font-weight: 400; }
.publication-catalog .timeline summary::after { color: var(--muted); font-size: 20px; }
.publication-catalog .timeline-items article { padding: 22px 0; }
.publication-catalog .timeline-items article > p { max-width: 960px; }
@media (max-width: 680px) {
  .publication-catalog .publication-filters { gap: 0 4px; margin-bottom: 20px; }
  .publication-catalog .publication-filters button { padding-inline: 10px; font-size: 14px; }
  .publication-catalog .timeline summary span:first-child { font-size: 28px; }
}

/* October 22: simple Research opening, photo-first directory, and minimal footer. */
.research-landing-intro { background: var(--sand); padding-block: 22px 8px; }
.research-landing-intro > .site-width { display: block; text-align: center; }
.research-landing-intro .lead { margin: 18px auto 0; max-width: 760px; font-size: 19px; line-height: 1.6; }
.people-directory .directory-introduction { display: block; }
.people-directory .directory-introduction .group-photo img { width: 100%; height: 360px; object-fit: cover; object-position: 50% 64%; }
.people-directory .directory-introduction .directory-principal { margin-top: 24px; }
.people-directory .directory-introduction .person-card { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 24px; align-items: center; max-width: none; margin: 0; }
.people-directory .directory-introduction .person-card > img { width: 100px; height: 100px; margin: 0; }
.people-directory .directory-introduction .person-card :is(h2, h3) { margin: 0 0 5px; font-size: 28px; }
.people-directory .directory-introduction .person-role { margin-bottom: 6px; }
.people-directory .directory-introduction .person-card p:last-child { max-width: 760px; font-size: 16px; }
.people-grid.team-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 26px; }
.team-grid .person-card :is(h2, h3) { font-size: 22px; }
.footer-grid { display: block; padding-block: 24px; }
.footer-grid > div { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.footer-brand, .footer-grid p { margin: 0; }
.footer-grid p { font-size: 15px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 15px; }
.footer-links a { margin: 0; text-decoration: underline; }
.site-ownership { padding-block: 28px; }
.site-ownership h2 { margin: 0 0 8px; font-size: 22px; }
.site-ownership p { margin: 0; font-size: 16px; overflow-wrap: anywhere; }
@media (max-width: 960px) {
  .people-directory .directory-introduction .group-photo img { height: 300px; }
}
@media (max-width: 680px) {
  .research-landing-intro > .site-width { display: block; }
  .research-landing-intro .lead { margin-top: 14px; font-size: 17px; }
  .people-directory .directory-introduction .group-photo img { height: auto; object-fit: contain; }
  .people-directory .directory-introduction .person-card { grid-template-columns: 80px minmax(0, 1fr); gap: 18px; align-items: start; }
  .people-directory .directory-introduction .person-card > img { width: 80px; height: 80px; }
  .people-directory .directory-introduction .person-card :is(h2, h3) { font-size: 25px; }
  .people-directory .directory-introduction .person-card p:last-child { font-size: 15px; }
  .people-grid.team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 18px; }
  .footer-grid > div { display: block; }
  .footer-brand { margin-bottom: 10px; }
}

/* Archived research stays accessible without competing with active platforms. */
.past-projects { border-top: 1px solid var(--line, #d9d6cf); padding-top: 28px; }
.past-projects h2 { font-family: var(--serif); font-size: 28px; margin: 0 0 22px; }
.past-project-card { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 28px; align-items: center; max-width: 760px; }
.past-project-card img { display: block; width: 180px; height: 135px; object-fit: contain; }
.past-project-card h3 { font-family: var(--serif); margin: 0 0 6px; font-size: 25px; }
.past-project-card h3 a { text-decoration: none; }
.past-project-card p { margin: 0 0 10px; font-size: 16px; }
.project-heading .project-status { font-family: var(--sans); font-size: 14px; text-transform: uppercase; letter-spacing: .1em; color: var(--cardinal, #8c1515); margin: 0 0 10px; }
@media (max-width: 680px) {
  .past-project-card { grid-template-columns: 110px minmax(0, 1fr); gap: 18px; }
  .past-project-card img { width: 110px; height: 83px; }
  .past-project-card h3 { font-size: 23px; }
}
