.projects-page { background: #fefefe; color: #0b1730; }
.projects-page .site-header { background: #fefefe; }
.projects-page :focus-visible { outline: 3px solid #016ff7; outline-offset: 4px; }
.projects-page .project-shell { width: min(calc(100% - 64px), 1180px); margin-inline: auto; }
.projects-page .project-hero { padding: 82px 0 76px; border-bottom: 1px solid #dce4ef; }
.projects-page .project-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 280px); gap: 48px; align-items: center; }
.projects-page .project-hero-grid img { display: block; max-width: 100%; height: auto; justify-self: center; object-fit: contain; }
.projects-page .project-hero-grid img.project-icon { width: 160px; height: 160px; }
.projects-page .project-kicker { margin: 0 0 17px; color: #005bc9; font: 700 .72rem/1.35 ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }
.projects-page h1 { max-width: 960px; margin: 0; color: #06152d; font-size: clamp(2.8rem, 5vw, 4.8rem); line-height: 1.08; }
.projects-page .project-lead { max-width: 760px; margin: 24px 0 0; color: #35465e; font-size: 1.13rem; line-height: 1.7; }
.projects-page .project-actions { display: flex; flex-wrap: wrap; gap: 14px 26px; margin-top: 32px; }
.projects-page .project-actions a { display: inline-flex; align-items: center; min-height: 44px; color: #005bc9; font-weight: 750; text-underline-offset: 4px; }
.projects-page .project-actions .project-primary { padding: 11px 18px; border: 1px solid #016ff7; border-radius: 6px; background: #016ff7; color: #fff; text-decoration: none; }
.projects-page .project-section { padding: 76px 0; border-bottom: 1px solid #dce4ef; }
.projects-page .project-section h2 { max-width: 760px; margin: 0 0 32px; color: #06152d; font-size: clamp(1.9rem, 3vw, 2.7rem); line-height: 1.2; }
.projects-page .project-section p { max-width: 760px; color: #35465e; line-height: 1.75; }
.projects-page .project-list { border-top: 1px solid #cbd6e5; }
.projects-page .project-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, 250px); gap: 40px; align-items: center; padding: 34px 0; border-bottom: 1px solid #dce4ef; }
.projects-page .project-item h3 { margin: 10px 0 12px; font-size: 1.7rem; }
.projects-page .project-item p { margin: 0 0 18px; }
.projects-page .project-item a, .projects-page .project-back { color: #005bc9; font-weight: 750; text-underline-offset: 4px; }
.projects-page .project-item img { display: block; max-width: 100%; max-height: 150px; width: auto; height: auto; justify-self: center; object-fit: contain; }
.projects-page .project-item img.project-icon { width: 96px; height: 96px; }
.projects-page .project-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; border-top: 1px solid #cbd6e5; }
.projects-page .project-facts article { padding-top: 22px; }
.projects-page .project-facts h3 { margin: 0 0 12px; font-size: 1.05rem; color: #06152d; }
.projects-page .project-facts p { margin: 0; }
.projects-page .project-next { background: #f7faff; }
.projects-page .project-next h2 { margin-bottom: 15px; }
.projects-page .project-next a { color: #005bc9; font-weight: 750; text-underline-offset: 4px; }
@media (max-width: 700px) {
  .projects-page .project-shell { width: min(calc(100% - 36px), 1180px); }
  .projects-page .project-hero { padding: 62px 0; }
  .projects-page .project-hero-grid { grid-template-columns: 1fr; gap: 30px; }
  .projects-page .project-hero-grid img { justify-self: start; }
  .projects-page .project-section { padding: 56px 0; }
  .projects-page .project-item { grid-template-columns: 1fr; gap: 20px; }
  .projects-page .project-item img { justify-self: start; }
  .projects-page .project-facts { grid-template-columns: 1fr; gap: 0; }
  .projects-page .project-facts article { padding: 22px 0; border-bottom: 1px solid #dce4ef; }
}