/* Page essentials: avoid fetching the home-only stylesheet. */
.intro {
  font-size: 1.1875rem;
  line-height: 1.55;
  max-width: 520px;
  margin-bottom: 12px;
}
.action {
  display: inline-flex;
  align-items: center;
  gap: 25px;
  padding: 12px 17px;
  border-radius: 4px;
  background: var(--orange);
  color: white;
  font-size: .875rem;
  font-weight: 500;
  min-height: 46px;
}
.action:hover {
  background: #974100;
  color: white;
}
@media(max-width:760px) { .intro { font-size:1.0625rem; } }

/* Field Notes composition; shared portfolio tokens, type, navigation and buttons. */
.projects-main { padding-top:60px; padding-bottom:72px; min-height:calc(100svh - 190px); }
.projects-intro { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:40px; padding-bottom:44px; }
.projects-intro h1 { margin:0 0 18px; }
.projects-intro .intro { margin:0; }
.projects-note { display:flex; align-items:center; gap:19px; color:var(--muted); }
.projects-note svg { width:66px; height:66px; flex:none; color:var(--orange); }
.projects-note p { font:italic 1.0625rem/1.5 var(--serif); }
.project-gallery { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:start; gap:28px; border-top:1px solid var(--line); padding-top:35px; }
.project-card { min-width:0; }
.project-featured { grid-row:span 2; }
.project-figure { min-width:0; }
.project-photo { position:relative; padding:12px; background:var(--surface); border:1px solid var(--line); transform:rotate(-.6deg); }
.project-photo::before { content:""; position:absolute; z-index:1; width:88px; height:22px; top:-10px; left:28px; background:rgba(185,80,0,.17); border-inline:1px dashed rgba(185,80,0,.25); transform:rotate(-5deg); pointer-events:none; }
.project-photo img { display:block; width:100%; aspect-ratio:1.12; height:auto; object-fit:cover; object-position:51% center; border-radius:3px; }
.project-figure figcaption { display:flex; justify-content:space-between; gap:16px; align-items:baseline; margin-top:16px; color:var(--muted); font:italic 1.0625rem/1.5 var(--serif); }
.project-number { color:var(--orange); font:500 .8125rem/1.5 var(--sans); }
.project-body { padding-top:25px; }
.project-meta { color:var(--muted); font-size:.75rem; line-height:1.6; letter-spacing:1.3px; text-transform:uppercase; margin-bottom:12px; }
.project-card h2 { margin-bottom:18px; }
.project-summary { color:var(--muted); font-size:1rem; line-height:1.7; }
.project-role { font-size:.875rem; line-height:1.6; color:var(--muted); margin-top:18px; }
.project-role strong { color:var(--ink); font-weight:500; }
.project-card .action { margin-top:24px; }
.project-story { margin-top:27px; border-top:1px solid var(--line); }
.project-story summary { display:flex; justify-content:space-between; align-items:center; gap:15px; min-height:48px; cursor:pointer; list-style:none; color:var(--orange); font-size:.875rem; }
.project-story summary::-webkit-details-marker { display:none; }
.project-story summary::marker { content:""; }
.project-story summary::after { content:"+"; font-size:1.25rem; }
.project-story[open] summary::after { content:"−"; }
.project-story p { font-size:.9375rem; color:var(--muted); line-height:1.75; padding:5px 0 8px; }
/* One entry fills the composition. Further entries form a mixed-size gallery. */
.project-featured:only-child { grid-column:1/-1; grid-row:auto; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:center; gap:46px; }
.project-featured:only-child .project-body { padding-top:0; }
.project-compact { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:22px; align-items:center; padding-bottom:28px; border-bottom:1px solid var(--line); }
.project-compact .project-body { padding:0; }
.project-compact h2 { font-size:1.75rem; letter-spacing:-.6px; margin-bottom:12px; }
.project-compact .project-summary { font-size:.875rem; }
.project-compact .project-meta { letter-spacing:.8px; font-size:.6875rem; }
.project-wide { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:46px; align-items:center; border-block:1px solid var(--line); padding-block:28px; }
.project-wide .project-body { padding:0; }
.project-art { display:grid; place-items:center; overflow:hidden; border:1px solid var(--line); border-radius:3px; background:var(--surface); }
.project-art svg { display:block; width:100%; height:auto; }
.project-compact .project-art { aspect-ratio:4/5; transform:rotate(1.5deg); }
.project-compact:nth-child(3) .project-art { transform:rotate(-1.5deg); }
.project-wide .project-art { aspect-ratio:2.5; }
.project-wide .project-art svg { height:100%; }
.layout-example-note { margin:0 0 26px; padding:14px 18px; border-left:2px solid var(--orange); background:var(--surface); color:var(--muted); font-size:.8125rem; }
@media(max-width:960px) {
  .projects-note { gap:12px; }
  .projects-note svg { width:52px; height:52px; }
  .projects-note p { font-size:1rem; }
  .project-featured:only-child,.project-wide { gap:30px; }
  .project-compact { grid-template-columns:1fr; gap:20px; }
  .project-compact .project-art { aspect-ratio:1.9; transform:none; }
  .project-compact .project-art svg { max-height:160px; }
}
@media(max-width:760px) {
  .projects-main { padding-top:43px; }
  .projects-intro { gap:25px; padding-bottom:35px; }
  .projects-note p { display:none; }
  .projects-note svg { width:60px; height:60px; }
  .project-gallery { grid-template-columns:1fr; gap:32px; }
  .project-featured,.project-wide { grid-row:auto; grid-column:auto; }
  .project-featured:only-child { grid-template-columns:1fr; gap:26px; }
  .project-photo img { aspect-ratio:1.5; }
  .project-compact { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:25px; }
  .project-compact .project-art { aspect-ratio:1; }
  .project-compact .project-art svg { max-height:none; }
  .project-wide { grid-template-columns:1fr; gap:24px; }
}
@media(max-width:580px) {
  .projects-main { padding-top:34px; padding-bottom:48px; }
  .projects-intro { gap:16px; padding-bottom:30px; }
  .projects-note svg { width:48px; height:48px; }
  .project-gallery { padding-top:28px; }
  .project-photo { padding:8px; transform:none; }
  .project-photo img { aspect-ratio:1.25; }
  .project-figure figcaption { font-size:1rem; gap:12px; }
  .project-compact h2 { font-size:1.5rem; }
  .project-compact { gap:20px; }
}
@media(max-width:359px) {
  .projects-note { display:none; }
  .projects-intro,.project-compact { grid-template-columns:1fr; }
  .project-compact .project-art { aspect-ratio:1.6; }
  .project-compact .project-art svg { max-height:155px; }
}
@media print {
  .projects-main { padding-block:20px; }
  .project-photo { transform:none; }
  .project-photo::before,.project-card .action { display:none; }
  .project-card { break-inside:avoid; }
}
