/* Live QA refinements — August 14, 2026 */

/* Preserve the restrained modernist system while reducing under-filled modules. */
.pillar { min-height: 220px; padding: clamp(24px, 3.2vw, 44px); }
.workflow-item { min-height: 138px; padding: 26px; }
.process-step { min-height: 205px; padding: 24px; }
.tech-number { min-height: 195px; padding: clamp(24px, 3.2vw, 42px); }
.tech-step { min-height: 150px; padding: 24px; }
.tech-flow { margin-top: 40px; }
.case-system-visual { max-height: 660px; overflow: hidden; }
.case-system-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

/* Real founder imagery should never carry the old placeholder label. */
.founder-media-image::after,
.founder-photo::after { display: none !important; content: none !important; }

/* Preserve the complete founder portrait at its natural aspect ratio. */
.founder-media-image,
.founder-photo {
  aspect-ratio: auto !important;
  overflow: visible;
  background: transparent;
}
.founder-media-image img,
.founder-photo img {
  display: block;
  width: 100%;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* Box alignment system: repeated modules should scan on shared baselines. */
.pillar,
.tech-number,
.tech-step { justify-content: space-between; }

/* Keep all Workflow process titles on one horizontal baseline. */
.process-step {
  display: grid;
  grid-template-rows: auto 1fr;
  align-items: start;
}
.process-step > div {
  align-self: start;
  margin-top: 48px;
  display: grid;
  grid-template-rows: auto 1fr;
}
.process-step h3 { margin: 0; }
.process-step p { margin-top: 14px; }

/* Well Versed card: use the wider WV_01 key art so the title stays intact. */
.project:has(a[href="/well-versed"]) .project-media {
  background: #087cc3 url('/assets/WV_01.jpg') center center / cover no-repeat;
}
.project:has(a[href="/well-versed"]) .project-media .project-image {
  opacity: 0;
}

@media (max-width: 900px) {
  .pillar { min-height: 200px; }
  .workflow-item { min-height: 125px; }
  .process-step { min-height: 180px; }
  .process-step > div { margin-top: 36px; }
  .tech-number { min-height: 175px; }
  .tech-step { min-height: 135px; }
}

/* Mobile Experience QA: preserve complete artwork and normalize metric columns. */
@media (max-width: 620px) {
  .case-hero-media {
    aspect-ratio: auto;
    background: #eaeae6;
  }
  .case-hero-media img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
  }

  /* Case-study metrics: every cell uses the same internal origin. */
  .case-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .case-stat,
  .case-stat:nth-child(1),
  .case-stat:nth-child(2),
  .case-stat:nth-child(3),
  .case-stat:nth-child(4) {
    box-sizing: border-box;
    min-width: 0;
    padding: 22px 16px !important;
    margin: 0 !important;
    text-align: left !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
  }
  .case-stat strong,
  .case-stat span {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    text-align: left !important;
  }

  /* Experience index cards: keep logos/title treatments fully visible. */
  .experience-grid .project-media {
    aspect-ratio: 16 / 10 !important;
    background-color: #eaeae6;
  }
  .experience-grid .project-media .project-image {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center !important;
  }

  .experience-grid .project:has(a[href="/well-versed"]) .project-media {
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
  }
}