/* =========
   Home (index2.html) layout & cards
   ========= */

/* Hero spacing on home */
.page-shell > main > h1 {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

.page-shell > main > p {
  /* No max-width – let text breathe across the 1200px container */
  margin-bottom: 2rem;
}

/* Selected Work section */
.selected-work {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.selected-work h2 {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

/* Small intro under "Selected Work" */
.selected-work-intro {
  font-size: 1.05rem;
  color: var(--text-muted);
  margin: 0 0 1.75rem;
  /* No max-width here */
}

/* Project grid */
.project-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
}

/* Each project card */
.project-card {
  flex: 1 1 calc(33.333% - 28px);
  min-width: 240px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

/* Image wrapper with fixed aspect ratio */
.project-card .image-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 0.75rem;
  aspect-ratio: 4 / 3;
}

/* Image */
.project-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.35s ease;
}

/* Hover zoom */
.project-card:hover .image-wrap img {
  transform: scale(1.05);
}

/* Card text area */
.project-copy {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Card title */
.project-card h3 {
  font-size: 1rem;
  margin: 0 0 0.35rem;
}

/* Card description */
.project-card p {
  font-size: 0.9rem;
  margin: 0 0 0.35rem;
}

/* Link row at bottom */
.project-card .project-link {
  font-size: 0.85rem;
  margin-top: auto;
}

/* Responsive grid */
@media (max-width: 1024px) {
  .project-card {
    flex: 1 1 calc(50% - 24px);
  }
}

@media (max-width: 640px) {
  .project-card {
    flex: 1 1 100%;
  }
}
