/* Shared gallery variables preserve the established light surfaces. */
.projects-portfolio {
  --result-bg: #f6f4ee;
  --result-surface: #fffefa;
  --result-ink: #17202a;
  --result-muted: #53626b;
  --result-line: #d5d8d3;
  --result-teal: #0d7f7a;
  --result-copper: #b75128;
  --result-screening: #7a6f9b;
  --result-soft: #dcefeb;
  background: var(--result-bg);
  color: var(--result-ink);
}

/* The gallery reuses the study's paper, teal and copper palette and site fonts. */
.projects-portfolio .collection-heading { border-bottom: 1px solid var(--result-line); padding-bottom: 10px; }
.projects-portfolio .portfolio-main { padding-block: 55px 80px; }
.projects-portfolio .portfolio-intro { max-width: 760px; padding-bottom: 42px; }
.projects-portfolio .portfolio-intro h1 { margin-bottom: 20px; }
.projects-portfolio .portfolio-intro > p:not(.eyebrow) { color: var(--result-muted); font-size: 1.07rem; }
.projects-portfolio .portfolio-intro > a { display: inline-block; color: var(--result-teal); font-size: .85rem; margin-top: 18px; }
.projects-portfolio .featured-project { display: grid; grid-template-columns: .82fr 1.18fr; gap: 38px; align-items: center; border-block: 1px solid var(--result-line); padding-block: 42px; }
.projects-portfolio .featured-project + .featured-project { border-top: 0; }
.projects-portfolio .featured-project + .portfolio-grid { margin-top: 28px; }
.projects-portfolio .featured-project-copy h2 { color: var(--result-ink); font-size: clamp(1.8rem, 2.6vw, 2.4rem); line-height: 1.22; margin: 0 0 24px; }
.projects-portfolio .featured-project-copy h2 a { color: inherit; text-decoration: none; }
.projects-portfolio .featured-project-copy h2 a:hover { text-decoration: underline; text-decoration-color: var(--result-teal); }
.projects-portfolio .featured-project-copy > p:not(.eyebrow) { color: var(--result-muted); font-size: .95rem; line-height: 1.85; }
.projects-portfolio .featured-project-copy .eyebrow { margin-bottom: 12px; }
.projects-portfolio .portfolio-link { display: inline-block; color: #075c58; font-weight: 600; font-size: .86rem; margin-top: 23px; padding-block: 9px; }
.projects-portfolio .featured-project-thumbnail { min-width: 0; margin: 0; }
.projects-portfolio .featured-project-thumbnail img { display: block; width: 100%; height: auto; object-fit: contain; }
.projects-portfolio .featured-project .chart-axis, .projects-portfolio .featured-project .chart-row { grid-template-columns: minmax(85px, 125px) minmax(0, 1fr) 66px; gap: 10px; }
.projects-portfolio .portfolio-collection { padding-top: 42px; }
.projects-portfolio .portfolio-priority-list { padding-top: 18px; }
.projects-portfolio .collection-heading { margin-bottom: 27px; }
.projects-portfolio .collection-heading h2 { font-size: 2rem; color: var(--result-ink); margin-bottom: 12px; }
.projects-portfolio .collection-heading p { color: var(--result-muted); font-size: .9rem; }
.projects-portfolio .portfolio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.projects-portfolio .portfolio-card { min-width: 0; border: 1px solid var(--result-line); border-radius: 18px; background: var(--result-surface); overflow: hidden; display: flex; flex-direction: column; }
.projects-portfolio .featured-project, .projects-portfolio .portfolio-card { scroll-margin-top: 100px; }
.projects-portfolio .portfolio-grid > .portfolio-card:only-child { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.projects-portfolio .portfolio-grid > .portfolio-card:only-child .portfolio-preview { border-bottom: 0; border-right: 1px solid var(--result-line); display: flex; flex-direction: column; justify-content: center; }
.projects-portfolio .portfolio-preview { display: grid; place-items: center; min-height: 185px; padding: 0; background: #fff; border-bottom: 1px solid var(--result-line); }
.projects-portfolio .portfolio-preview img { display: block; width: 100%; height: 185px; object-fit: contain; }
.projects-portfolio .portfolio-preview--cover img { object-fit: cover; }
.projects-portfolio .portfolio-preview--placeholder { min-height: 185px; background: #f1f0ec; }
.projects-portfolio .portfolio-card-copy { padding: 25px; display: flex; flex-direction: column; flex: 1; }
.projects-portfolio .portfolio-card-copy h2 { color: var(--result-ink); font-size: 1.55rem; line-height: 1.35; margin: 0 0 17px; overflow-wrap: anywhere; }
.projects-portfolio .portfolio-card-copy h2 a { color: inherit; text-decoration: none; }
.projects-portfolio .portfolio-card-copy h2 a:hover { text-decoration: underline; text-decoration-color: var(--result-teal); }
.projects-portfolio .portfolio-card-copy p { font-size: .9rem; line-height: 1.85; color: var(--result-muted); margin-bottom: 20px; }
.projects-portfolio .portfolio-card-copy .portfolio-link { align-self: flex-start; margin-top: auto; }
@media (max-width: 1050px) {
  .projects-portfolio .featured-project { grid-template-columns: 1fr; gap: 24px; }
  .projects-portfolio .featured-project-copy { max-width: 680px; }
}
@media (max-width: 650px) {
  .projects-portfolio .portfolio-main { padding-top: 35px; }
  .projects-portfolio .portfolio-grid { grid-template-columns: 1fr; gap: 22px; }
  .projects-portfolio .portfolio-grid > .portfolio-card:only-child { grid-template-columns: minmax(0, 1fr); }
  .projects-portfolio .portfolio-grid > .portfolio-card:only-child .portfolio-preview { border-right: 0; border-bottom: 1px solid var(--result-line); }
  .projects-portfolio .featured-project { padding-block: 30px; }
  .projects-portfolio .featured-project .chart-axis, .projects-portfolio .featured-project .chart-row { grid-template-columns: minmax(0, 1fr) 70px; gap: 0 10px; }
  .projects-portfolio .portfolio-preview { padding: 0; }
  .projects-portfolio .portfolio-card-copy { padding: 22px; }
}


/* Compact cards share light surfaces and category accents. */
.projects-portfolio .portfolio-card[data-project-category] { border-top: 3px solid var(--project-accent); }
.projects-portfolio [data-project-category] .portfolio-link,
.projects-portfolio .featured-project-copy .eyebrow { color: var(--project-accent); }
.projects-portfolio [data-project-category] .portfolio-link { text-decoration-color: var(--project-accent); }
.projects-portfolio [data-project-category] h2 a:hover { color: var(--project-accent); text-decoration-color: var(--project-accent); }
.projects-portfolio .portfolio-card[data-project-category]:hover { border-color: var(--project-accent); }
.projects-portfolio .featured-project[data-project-category] { border-top: 2px solid var(--project-accent); }
.projects-portfolio .portfolio-card-copy h2,
.projects-portfolio .featured-project-copy h2 { margin-bottom: 0; }
.projects-portfolio .portfolio-card-copy > .project-tags { margin-bottom: 12px; }
.projects-portfolio .featured-project-copy > .project-tags { margin-bottom: 20px; }
.projects-portfolio .portfolio-workflow-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 22px;
  min-width: 0;
}
.projects-portfolio .workflow-gallery-card { background: var(--result-surface); }
.projects-portfolio .workflow-gallery-card .portfolio-preview {
  height: 185px;
  min-height: 0;
  margin: 0;
  background: #fff;
  border-color: var(--result-line);
}
.projects-portfolio .workflow-gallery-card .portfolio-preview img {
  width: 100%; height: 185px; min-height: 0; object-fit: contain;
}
.projects-portfolio .workflow-gallery-card .portfolio-card-copy { padding: 20px; }
.projects-portfolio .workflow-gallery-card .portfolio-card-copy h2 {
  color: var(--result-ink); font-size: 1.25rem; line-height: 1.32;
}
.projects-portfolio .workflow-gallery-card .portfolio-card-copy p {
  color: var(--result-muted); font-size: .84rem; line-height: 1.7; margin: 0 0 14px;
}
.projects-portfolio .workflow-gallery-card .project-tags { font-size: .71rem; gap: 4px 10px; margin-top: 10px; }
.projects-portfolio .workflow-gallery-card .workflow-project-links { padding-top: 0; gap: 6px 18px; }
.projects-portfolio .workflow-gallery-card .portfolio-link { font-size: .8rem; padding-block: 6px; }
.projects-portfolio .portfolio-tools { padding-top: 52px; margin-top: 46px; border-top: 1px solid var(--result-line); }
.projects-portfolio .portfolio-tools-heading { margin-bottom: 20px; }
.projects-portfolio .portfolio-tools-heading .eyebrow { color: var(--tools-accent); margin-bottom: 6px; }
.projects-portfolio .portfolio-tools-heading h2 { font-size: 1.55rem; }
.projects-portfolio .portfolio-tool-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 300px)); gap: 16px; }
.projects-portfolio .portfolio-tool-card {
  width: min(100%, 300px);
  min-height: 0;
  border: 1px solid var(--result-line);
  border-top: 3px solid var(--tools-accent);
  border-radius: 14px;
  background: var(--result-surface);
  overflow: hidden;
  scroll-margin-top: 100px;
}
.projects-portfolio .portfolio-tool-card:hover { border-color: var(--tools-accent); }
.projects-portfolio .portfolio-tool-card-copy { padding: 19px 21px 12px; }
.projects-portfolio .tool-card-kicker { color: var(--tools-accent); font-size: .7rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.projects-portfolio .portfolio-tool-card h3 { font-size: 1.04rem; line-height: 1.35; margin: 8px 0 9px; }
.projects-portfolio .portfolio-tool-card h3 a { color: var(--result-ink); text-decoration: none; }
.projects-portfolio .portfolio-tool-card h3 a:hover { color: var(--tools-accent); text-decoration: underline; }
.projects-portfolio .portfolio-tool-card-copy > p:not(.tool-card-kicker) { color: var(--result-muted); font-size: .8rem; line-height: 1.55; }
.projects-portfolio .portfolio-tool-card .portfolio-link { color: var(--tools-accent); font-size: .79rem; margin-top: 8px; padding-block: 4px; }
.projects-portfolio .tool-card-preview { margin: 0; padding: 10px 21px 13px; border-top: 1px solid var(--result-line); background: #fafafb; color: #3c6059; font-size: .73rem; line-height: 1.28; overflow: auto; }
.projects-portfolio .tool-card-colours { display: flex; gap: 5px; padding: 13px 21px; border-top: 1px solid var(--result-line); background: #fafafb; }
.projects-portfolio .tool-card-colours span { flex: 1; height: 27px; border-radius: 4px; background: #A66BA9; }
.projects-portfolio .tool-card-colours span:nth-child(2) { background: #6F9FC2; }
.projects-portfolio .tool-card-colours span:nth-child(3) { background: #79BFAE; }
.projects-portfolio .tool-card-colours span:nth-child(4) { background: #E0A15A; }
.projects-portfolio .tool-card-colours span:nth-child(5) { background: #D26A5F; }
@media (max-width: 1100px) {
  .projects-portfolio .portfolio-workflow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .projects-portfolio .portfolio-workflow-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .projects-portfolio .portfolio-tools { margin-top: 36px; padding-top: 36px; }
}

/* Personal utilities retain their own plum theme, separate from research tools. */
.projects-portfolio .personal-toolkit { --tools-accent: #6D5893; }