/* Project media component — authentic images, sensible boundaries.
   Project content defines mediaLayout: cover | wide | logo | typography.
   This module owns image fitting across Home and Work; avoid category-based image CSS. */

.work-grid > .work-card:nth-child(n){
  min-height:0;
  height:auto;
  align-self:stretch;
  padding:clamp(19px,1.4vw,27px);
  overflow:hidden;
}

.work-grid .work-art{
  display:grid;
  place-items:center;
  position:relative;
  isolation:isolate;
  width:100%;
  height:clamp(235px,17vw,312px);
  min-height:0;
  flex:0 0 auto;
  margin:20px 0 24px;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:linear-gradient(135deg,#16192a,#0a0c13 85%);
}

.work-grid .work-art > .real-project-image{
  display:block;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  max-width:none;
  max-height:none;
  object-position:center;
  object-fit:cover;
  background:transparent;
  filter:none;
  transition:transform .28s var(--ease);
}

.work-grid .work-art.media-cover > .real-project-image{object-fit:cover;}
.work-grid .work-art.media-wide{
  background:radial-gradient(ellipse at 65% 45%,#303061,#14142b 56%,#0c0d17);
}
.work-grid .work-art.media-wide > .real-project-image{
  object-fit:contain;
  object-position:center;
}

/* Square image assets are logos, not photographic card backgrounds. */
.work-grid .work-art.media-logo{
  background:
    radial-gradient(circle at 50% 48%,rgba(108,119,221,.15),transparent 54%),
    linear-gradient(145deg,#111521,#0b0c12 75%);
}
.work-grid .work-art.media-logo > .real-project-image{
  position:relative;
  inset:auto;
  flex:none;
  width:auto;
  height:auto;
  max-width:min(52%,240px);
  max-height:80%;
  object-fit:contain;
  box-shadow:0 12px 38px rgba(0,0,0,.2);
}
.work-grid .work-art.media-logo > .work-brand-mark{display:none;}
.work-grid .work-art.media-wide > .work-brand-mark{
  bottom:14px;
  right:14px;
  width:55px;
  height:55px;
  max-width:none;
  object-fit:contain;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.65));
}
.work-grid .work-art.media-cover > .work-brand-mark{
  bottom:14px;
  right:14px;
  max-width:min(34%,230px);
  height:60px;
  object-fit:contain;
}
.work-grid .work-art::after{
  background:linear-gradient(180deg,transparent 75%,rgba(5,6,12,.26) 100%);
}
.work-grid .work-art.media-logo::after,
.work-grid .work-art.media-typography::after,
.work-grid .work-art.media-wide::after{display:none;}
.work-grid .work-art .work-coordinate{z-index:5;left:16px;bottom:12px;text-shadow:0 1px 6px rgba(0,0,0,.85);}
.work-grid .work-art.media-logo .work-coordinate,
.work-grid .work-art.media-typography .work-coordinate{color:#777e9a;}

.work-grid .work-card-body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
}
.work-grid .work-card-body > p{
  flex:1 1 auto;
  min-height:0;
  margin-bottom:15px;
  line-height:1.75;
}
.work-grid .work-card-body > .card-action{
  margin-top:auto;
  flex:none;
}
.work-grid .work-card h2{
  margin-top:8px;
  margin-bottom:10px;
}
.work-grid .work-card-header{min-height:27px;}

/* Featured cards also honor the source media classification. */
.featured-grid .featured-emblem.media-wide{
  background:radial-gradient(ellipse at center,#29294a,#0c0c17 75%);
}
.featured-grid .featured-emblem.media-wide > .real-project-image{
  object-fit:contain;
  object-position:center;
}
.featured-grid .featured-emblem.media-logo > .real-project-image{
  object-fit:contain;
  width:auto;
  height:auto;
  max-width:min(60%,260px);
  max-height:85%;
  inset:auto;
  position:relative;
}
.featured-grid .featured-emblem.media-typography .project-wordmark,
.work-grid .work-art.media-typography .project-wordmark{
  position:relative;
  z-index:3;
  max-width:100%;
  word-break:normal;
}
@media(max-width:1140px){
  .work-grid .work-art{height:clamp(210px,24vw,285px);}
  .work-grid .work-art.media-logo > .real-project-image{max-width:min(55%,205px);}
}
@media(max-width:700px){
  .work-grid > .work-card:nth-child(n){padding:20px;min-height:0;}
  .work-grid .work-art{
    height:clamp(200px,55vw,295px);
    margin:16px 0 20px;
  }
  .work-grid .work-art.media-logo > .real-project-image{
    max-width:min(54%,190px);
    max-height:76%;
  }
  .work-grid .work-card-body > p{font-size:14px;}
  .work-grid .work-card h2{font-size:clamp(26px,6vw,32px);}
}
@media(max-width:440px){
  .work-grid .work-art{height:215px;}
  .work-grid .work-art.media-logo > .real-project-image{max-width:160px;}
  .featured-grid .featured-emblem.media-wide > .real-project-image{object-fit:contain;}
}
@media(prefers-reduced-motion:reduce){
  .work-grid .work-art > .real-project-image{transition:none;}
}