/* Projects — 青碧 seiheki, blue-green (5.2:1 on the paper) */
:root { --page-color: #1d6e6e; }

/* --- 一 Featured: a print spread, the photo misting into the paper ------ */
.featured {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(32px, 6vw, 96px);
  align-items: end;
}
.featured-photo {
  --mist-mask: linear-gradient(to bottom, #000 62%, transparent 100%);
  margin: 0;
  aspect-ratio: 1;
  max-width: 34rem;
}
.featured-content { padding-bottom: clamp(24px, 8vh, 96px); max-width: 28rem; }
.featured-eyebrow { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.featured-title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); line-height: 1.4; margin-bottom: 18px; }
.featured-desc { font-size: 15px; margin-bottom: 16px; }
.featured-tags { font-size: 13px; color: var(--ink-soft); margin-bottom: 26px; }
.featured-tags span:not(:last-child)::after { content: "・"; color: var(--muted); margin: 0 0.3em; }

/* --- 二 Other things: a catalogue list, not a card grid ------------------ */
.projects-section { margin-top: clamp(110px, 18vh, 220px); }
.projects-grid { list-style: none; border-top: 2px solid var(--page-color); max-width: 58rem; }
.project-tile {
  display: grid;
  grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
  gap: clamp(20px, 4vw, 48px);
  padding: 24px 0;
  border-bottom: 1px solid var(--rule);
  align-items: start;
}
.project-tile img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--paper-deep); }
.project-tile h3 { font-size: 1.25rem; margin-bottom: 6px; }
.project-tile p { font-size: 14px; line-height: 1.9; max-width: var(--measure); }
.projects-grid-loading { padding: 20px 0; font-size: 13px; color: var(--muted); }

@media (max-width: 899px) {
  .featured { grid-template-columns: 1fr; gap: 8px; }
  .featured-photo { max-width: none; margin: 0 calc(var(--gutter) * -1); }
  .featured-content { padding-bottom: 0; margin-top: -40px; position: relative; }
  .project-tile { grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr); gap: 16px; }
}
