/* Content additions extend the existing warm-paper / amber visual system. */
.featured-projects { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-8); }
.featured-project { min-width:0; }
.project-thumb { display:block; overflow:hidden; background:var(--bg-warm); border:1px solid var(--border); border-radius:var(--r-md); }
.project-thumb img { width:100%; height:auto; aspect-ratio:8/5; object-fit:cover; transition:transform var(--ease-md); }
.project-thumb:hover img { transform:scale(1.025); }
.project-heading { display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--s-2) var(--s-4); margin:var(--s-5) 0 var(--s-3); }
.project-heading h2 { font-size:clamp(1.6rem,2.5vw,2.2rem); }
.project-heading h3 { font-size:1.35rem; }
.project-status { color:var(--amber-ink); font-size:.8rem; font-weight:600; }
.featured-project p { color:var(--text-2); font-size:.95rem; margin-bottom:var(--s-4); }
.project-capabilities { display:flex; flex-wrap:wrap; gap:var(--s-2); list-style:none; margin:var(--s-4) 0 var(--s-5); }
.project-capabilities li { font-size:.78rem; font-weight:500; color:var(--amber-ink); background:var(--bg-code); border:1px solid var(--border); border-radius:var(--r-sm); padding:3px 8px; }
.showcase-context { color:var(--text-3); font-size:1rem !important; max-width:65ch; }
.showcase-section { padding-top:0; }
.showcase-project { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--s-12); align-items:start; padding:var(--s-12) 0 var(--s-16); border-top:1px solid var(--border-strong); }
.showcase-project:nth-child(even) .showcase-preview { order:2; }
.showcase-preview img { width:100%; height:auto; border:1px solid var(--border); border-radius:var(--r-md); }
.showcase-preview figcaption { font-size:.8rem; color:var(--text-3); margin-top:var(--s-3); max-width:65ch; }
.showcase-copy .project-heading { margin-top:0; }
.showcase-copy p { color:var(--text-2); margin-bottom:var(--s-6); max-width:65ch; }
.showcase-copy .project-description { font-size:1.15rem; line-height:1.6; }
.reading-section { padding-top:0; }
.prose h2 { font-size:1.65rem; margin:var(--s-12) 0 var(--s-5); }
.prose p { margin:0 0 var(--s-5); color:var(--text-2); }
.prose code { font-size:.88em; overflow-wrap:anywhere; }
.prose .code-block { margin:var(--s-5) 0 var(--s-6); }
.prose .code-block pre { white-space:pre-wrap; overflow-wrap:anywhere; }
.prose a { text-decoration:underline; }
.recipe-nav { display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-5); padding:var(--s-6) 0; border-block:1px solid var(--border); }
.recipe-prompt-label { font-weight:600; }
.capability-stories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-8) var(--s-12); }
.capability-story { border-top:1px solid var(--border-strong); padding-top:var(--s-6); }
.capability-story h3 { font-size:1.35rem; margin-bottom:var(--s-3); }
.capability-story p { color:var(--text-2); margin-bottom:var(--s-4); max-width:60ch; }
.measurement-note { max-width:65ch; color:var(--text-3); font-size:.9rem; margin-top:var(--s-5); }
.benchmark-table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.benchmark-table th, .benchmark-table td { padding:var(--s-3) var(--s-4); text-align:right; border-bottom:1px solid var(--border); }
.benchmark-table th:first-child, .benchmark-table td:first-child { text-align:left; }
.benchmark-table th { font-size:.8rem; color:var(--text-3); font-weight:600; }
.benchmark-table .benchmark-ntnt { font-weight:700; color:var(--amber-ink); }
@media (max-width:900px) {
  .featured-projects { gap:var(--s-5); }
  .showcase-project { gap:var(--s-8); }
}
@media (max-width:768px) {
  .featured-projects, .capability-stories { grid-template-columns:1fr; }
  .featured-project { padding-bottom:var(--s-6); border-bottom:1px solid var(--border); }
  .showcase-project { grid-template-columns:1fr; gap:var(--s-6); padding-bottom:var(--s-12); }
  .showcase-project:nth-child(even) .showcase-preview { order:0; }
  .project-heading { gap:var(--s-2) var(--s-3); }
  .showcase-copy .project-description { font-size:1.05rem; }
  .benchmark-table th, .benchmark-table td { padding:var(--s-3) var(--s-2); }
}
@media (prefers-reduced-motion:reduce) { .project-thumb img { transition:none; } .project-thumb:hover img { transform:none; } }
