/* ==========================================================================
   About Us: about-hero (global .page-hero--cover) · about-story · about-values · about-process · about-facts
   ========================================================================== */

/* ---------- Hero ---------- */
.about-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-2); }
@media (max-width: 639.98px) { .about-hero__actions .btn { width: 100%; padding-inline: var(--space-4); white-space: normal; } }

/* ---------- Story ---------- */
.about-story__grid { display: grid; gap: var(--space-8); align-items: center; }
.about-story__img { aspect-ratio: 3 / 2; border-radius: var(--banner-radius); box-shadow: var(--shadow-lg); }
.about-story__content { display: flex; flex-direction: column; gap: var(--space-4); }
.about-story__content h2 { margin-bottom: calc(var(--space-4) * (var(--title-gap-scale) - 1)); }
.about-story__text { display: flex; flex-direction: column; gap: var(--space-4); font-size: var(--text-lg); }
.about-story__sign { font-weight: var(--weight-semibold); color: var(--color-primary); }
@media (min-width: 1024px) { .about-story__grid { grid-template-columns: 1.1fr 1fr; gap: var(--space-12); } }

/* ---------- Values ---------- */
.about-values__title { margin-bottom: calc(var(--space-6) * var(--title-gap-scale)); }
.about-values__grid { display: grid; gap: var(--grid-gap); margin: 0; padding: 0; list-style: none; }
.value-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-6);
  background: var(--color-surface); border: var(--card-border); border-radius: var(--card-radius); box-shadow: var(--card-shadow);
  transition: translate var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard);
}
.value-card:hover { translate: 0 var(--hover-lift); box-shadow: var(--shadow-lg); }
.value-card h3 { font-size: var(--text-lg); }
.value-card p { font-size: var(--text-sm); color: var(--color-text-muted); }
@media (min-width: 640px) { .about-values__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .about-values__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Process ---------- */
.about-process__head { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: calc(var(--space-6) * var(--title-gap-scale)); }
.about-process__grid { display: grid; gap: var(--grid-gap); margin: 0; padding: 0; list-style: none; }
.process-card { display: flex; flex-direction: column; overflow: hidden; background: var(--color-surface); border: var(--card-border); border-radius: var(--card-radius); box-shadow: var(--card-shadow); }
.process-card__img { aspect-ratio: 3 / 2; border-radius: 0; }
.process-card__body { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-5); }
.process-card h3 { font-size: var(--text-lg); }
.process-card p { grid-column: 1 / -1; font-size: var(--text-sm); color: var(--color-text-muted); }
@media (min-width: 640px) { .about-process__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .about-process__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Facts ---------- */
.about-facts .about-facts__grid { /* higher specificity than the ul[role="list"] reset */
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); margin: 0; padding: var(--space-8) var(--space-6); list-style: none;
  background: var(--color-surface-inverse); color: var(--color-text-inverse); border-radius: var(--banner-radius);
}
.stat { display: flex; flex-direction: column; gap: var(--space-1); text-align: center; }
.stat__value { font-size: var(--text-2xl); font-weight: var(--weight-bold); line-height: var(--leading-tight); color: var(--color-accent); }
.stat__label { font-size: var(--text-sm); }
@media (min-width: 1024px) { .about-facts .about-facts__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: var(--space-10); } }