/* Research page: navy banner, then a light reading area like the Teaching page. Builds on plate.css tokens. */
:root { --lab: var(--paper); --lab-2: #FFFFFF; --lab-ink: var(--ink); --lab-mute: var(--ink-2); --lab-rule: var(--rule); }
body.research { background: var(--lab); color: var(--lab-ink); }

.lab { background: var(--lab); }
.lab a { color: var(--ece-deep); }
.lab h2 { font: 600 1.9rem/1.2 var(--serif); color: var(--ece-navy); margin: 0 0 1.5rem; }
.lab section { padding-block: 4.5rem; border-top: 1px solid var(--lab-rule); }
.lab section:first-child { border-top: 0; padding-top: 3rem; }

/* Themes as full-width rows: the name carries the weight, the detail sits beside it. */
.lab-themes article { position: relative; display: grid; grid-template-columns: minmax(12rem, 1fr) 2fr; gap: 1rem 3rem; padding-block: 2.25rem; border-bottom: 1px solid var(--lab-rule); }
.lab-themes article:first-of-type { padding-top: 0; }
.lab-themes h3 { font: 600 clamp(1.5rem, 2.6vw, 2.1rem)/1.15 var(--serif); margin: 0; color: var(--ece-navy); }
.lab-themes p { margin: 0 0 .9rem; color: var(--lab-ink); font-size: 1.05rem; max-width: 44rem; }
.lab-themes .rel { color: var(--lab-mute); font-size: .95rem; padding-left: .9rem; border-left: 2px solid var(--ece-orange); margin: 0; }

.lab-pubs h3 { font: 600 .95rem var(--sans); color: #C4541A; margin: 2rem 0 .5rem; }
.lab-pubs ol { list-style: none; margin: 0; padding: 0; }
.lab-pubs li { display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; padding-block: .9rem; border-bottom: 1px solid var(--lab-rule); }
.lab-pubs .yr { font: 500 .95rem var(--mono); color: var(--lab-mute); padding-top: .15rem; }
.lab-pubs p { margin: 0; color: var(--lab-mute); max-width: 52rem; }
.lab-pubs a { color: var(--ink); font-weight: 500; text-decoration: none; }
.lab-pubs a:hover { color: var(--ece-deep); }
.lab-pubs a:hover { text-decoration: underline; }
.lab-pubs em { color: var(--lab-ink); }
.lab .more { color: var(--lab-mute); margin: 1.5rem 0 0; }

@media (max-width: 800px) {
  .lab-themes article { grid-template-columns: 1fr; }
}

/* A short orange rule marks each research theme, as the course pages mark chapters. */
.lab-themes h3::before { content: ""; display: block; width: 2.5rem; height: 3px; background: var(--ece-orange); margin-bottom: .9rem; }
.lab-themes article:last-of-type { border-bottom: 0; padding-bottom: 0; }

/* Vision: the lead beside the guiding question; directions as three numbered cards. */
.lv-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 2.5rem; align-items: start; }
.lv-lead { font: 400 clamp(1.2rem, 1.9vw, 1.4rem)/1.6 var(--serif); color: var(--ece-navy); margin: 0; }
.lv-q { margin: 0; padding: 1.5rem 1.6rem; border-radius: 16px; color: #fff; background: linear-gradient(160deg, var(--ece-navy), var(--ece-deep)); box-shadow: 0 20px 40px -26px rgba(12,19,68,.55); }
.lv-q .lv-k { font: 600 .78rem var(--sans); letter-spacing: .08em; text-transform: uppercase; color: #F5A878; margin: 0 0 .7rem; }
.lv-q p:last-child { font: italic 400 1.2rem/1.5 var(--serif); margin: 0; color: #fff; }
.ld-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; counter-reset: none; }
.ld-list li { background: var(--lab-2); border: 1px solid var(--lab-rule); border-radius: 16px; padding: 1.4rem 1.4rem 1.5rem; }
.ld-n { display: block; font: 500 .85rem var(--mono); color: #B8531D; margin-bottom: .6rem; }
.ld-list h3 { font: 600 1.3rem/1.25 var(--serif); color: var(--ece-navy); margin: 0 0 .6rem; }
.ld-list p { margin: 0; color: var(--lab-mute); font-size: .98rem; line-height: 1.6; }
.ld-next { margin: 1.5rem 0 0; color: var(--lab-mute); max-width: 52rem; }
.ld-next strong { color: var(--ink); font-weight: 600; }
@media (max-width: 900px) { .lv-grid, .ld-list { grid-template-columns: minmax(0, 1fr); } }