/* Homepage work-card styling is the reference for label/value pairs on every page.
   Keep shared changes here; page styles retain their own grids and section layout. */
:root {
  /* Reuse the case-study hero's existing divider for every content separator. */
  --portfolio-divider: 1px dashed rgba(var(--ashu-accent-rgb, var(--accent)), .62);
  --portfolio-detail-font: Inter, sans-serif;
  --portfolio-detail-color: var(--ashu-text, var(--text, #EB6060));
  --portfolio-detail-value-size: clamp(.75rem, .706rem + .1878vw, .875rem);
  --portfolio-detail-label-size: clamp(.625rem, .583rem + .1878vw, .75rem);
  --portfolio-detail-weight: 500;
  --portfolio-detail-leading: 1.2;
  --portfolio-detail-tracking: -.02em;
  --portfolio-detail-label-opacity: .62;
  --portfolio-detail-label-gap: 8px;
  --portfolio-detail-group-gap: 32px;
}

:is(.ashu-hero-meta, .ashu-work-project__facts, .page-shell[data-page="case-study"] .case-hero__context) {
  color: var(--portfolio-detail-color);
  font-family: var(--portfolio-detail-font);
  font-size: var(--portfolio-detail-value-size);
  font-weight: var(--portfolio-detail-weight);
  line-height: var(--portfolio-detail-leading);
  letter-spacing: var(--portfolio-detail-tracking);
  font-variant-numeric: tabular-nums;
  /* The homepage uses browser-default smoothing; forced antialiasing looked lighter on case studies. */
  -webkit-font-smoothing: auto;
}

:is(.ashu-work-project__facts, .page-shell[data-page="case-study"] .case-hero__context) {
  gap: var(--portfolio-detail-group-gap);
}

:is(.ashu-hero-meta, .ashu-work-project__facts, .page-shell[data-page="case-study"] .case-hero__context) > p {
  min-width: 0;
  margin: 0;
  line-height: inherit;
  text-wrap: pretty;
}

:is(.ashu-hero-meta, .ashu-work-project__facts, .page-shell[data-page="case-study"] .case-hero__context) > p > span,
.ashu-work-project__attribution {
  display: block;
  margin-bottom: var(--portfolio-detail-label-gap);
  color: var(--portfolio-detail-color);
  font-family: var(--portfolio-detail-font);
  font-size: var(--portfolio-detail-label-size);
  font-weight: var(--portfolio-detail-weight);
  line-height: var(--portfolio-detail-leading);
  letter-spacing: var(--portfolio-detail-tracking);
  text-transform: uppercase;
  opacity: var(--portfolio-detail-label-opacity);
}

:is(.ashu-work-project__facts, .page-shell[data-page="case-study"] .case-hero__context) strong {
  font-weight: inherit;
  line-height: inherit;
}

@media (max-width: 1023px) {
  :root { --portfolio-detail-group-gap: 16px; }
}