/* Shared mobile hierarchy for project cards and case-study introductions. */
@media (max-width: 768px) {
  :root {
    --project-mobile-title: clamp(1.875rem, 7.5vw, 2.5rem);
    --project-mobile-byline: 1rem;
    --project-mobile-tag: 0.9rem;
  }

  .project-hover-overlay {
    padding: 24px 0 2px;
  }

  .horiz-gallery-strip {
    gap: 0;
  }

  .project-wrap + .project-wrap {
    margin-top: 2.5vh;
    padding-top: 2.5vh;
    border-top: 1px solid var(--border);
  }

  .cs-hero .cs-hero-text {
    padding-top: 24px;
  }

  .project-hover-tags,
  .cs-hero .cs-project-tags {
    gap: 8px;
    margin: 0 0 20px;
  }

  .project-hover-tag,
  .cs-tag {
    font-size: var(--project-mobile-tag);
    line-height: 1.25;
    padding: 6px 10px;
  }

  .project-wrap a[href="/therapy-case-study"] .project-hover-tag:last-child {
    display: none;
  }

  .project-hover-title,
  .cs-hero .cs-project-title {
    font-size: var(--project-mobile-title);
    line-height: 1.15;
    margin: 0;
  }

  .project-hover-byline,
  .cs-hero .cs-project-subtitle {
    font-size: var(--project-mobile-byline);
    line-height: 1.5;
    margin: 8px 0 0;
  }

  .cs-hero .cs-project-title {
    font-size: clamp(2.25rem, 9.5vw, 2.875rem);
  }
}