/* ============================================================
   SECTION: Proyecto destacado — large featured project card
   ============================================================ */

.featured-card {
  position: relative;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  grid-template-areas:
    "body  media"
    "meta  media";
  align-items: start;
  gap: var(--space-2) var(--space-5);
  padding: clamp(1.5rem, 3vw, 3rem);
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(229, 75, 39, 0.12), transparent 55%),
    var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.featured-card__link { position: absolute; inset: 0; z-index: 3; }

.featured-card__body { grid-area: body; align-self: start; }
.featured-card__title {
  margin-top: var(--space-2);
  color: var(--color-accent);
}
.featured-card__tags {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
  margin-top: var(--space-3);
}
.featured-card__meta {
  grid-area: meta;
  align-self: end;
  color: var(--color-text-mute);
  font-size: var(--fs-sm);
}
.featured-card__media {
  grid-area: media;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--color-bg-soft);
}
.featured-card__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.featured-card:hover .featured-card__media img { transform: scale(1.04); }

@media (max-width: 820px) {
  .featured-card {
    grid-template-columns: 1fr;
    grid-template-areas: "media" "body" "meta";
    gap: var(--space-3);
  }
  .featured-card__media { aspect-ratio: 16 / 10; order: -1; }
}