.about-test-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.about-test .about-intro{min-height:430px}.about-test .about-video{max-width:none;height:min(55vw,760px);margin:0;border-radius:0}
.about-test-ac-hero{width:calc(100% - (2 * var(--page-gutter)));max-width:1440px;aspect-ratio:16/9;margin:clamp(72px,8vw,128px) auto 0;position:relative;color:#fff;overflow:hidden;background:#403a35}.about-test-ac-hero__visual{width:100%;height:100%;object-fit:cover;filter:brightness(.58)}.about-test-ac-hero__overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}.about-test-ac-hero__logo{display:block;width:clamp(210px,34vw,500px);height:auto;filter:none}.about-test-ac-hero__overlay p{margin:clamp(10px,1.6vw,22px) 0 0;font:500 clamp(12px,1.25vw,16px)/1.35 var(--font-manrope);letter-spacing:.04em;text-transform:uppercase}
.about-test-ac{padding:clamp(75px,9vw,145px) max(28px,6vw);text-align:center}.about-test-ac>header{max-width:850px;margin:0 auto 60px}.about-test-ac h2,.about-test-closing h2{font:400 clamp(34px,4vw,64px)/1.05 var(--font-ma-clayton);margin:14px 0 24px}.about-test-ac>header>p:last-child{line-height:1.7}
.about-test-ac-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:1400px;margin:auto}.about-test-ac-stats article{height:460px;position:relative;overflow:hidden;color:#fff}.about-test-ac-stats img{width:100%;height:100%;object-fit:cover;filter:brightness(.7)}.about-test-ac-stats strong,.about-test-ac-stats span{position:absolute;left:0;right:0;text-align:center}.about-test-ac-stats strong{top:36px;font:600 clamp(38px,5vw,72px) var(--font-manrope)}.about-test-ac-stats span{top:115px;font-size:18px}
.about-test-closing{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;padding:clamp(75px,9vw,145px) max(28px,6vw);border-top:1px solid #ddd}.about-test-closing>div{max-width:650px}.about-test-closing>div>p:not(.eyebrow){line-height:1.7}.about-test-closing>img{width:100%;height:520px;object-fit:cover}
@media(max-width:850px){.about-test-ac-stats{grid-template-columns:1fr}.about-test-ac-stats article{height:380px}.about-test-closing{grid-template-columns:1fr}.about-test-closing>img{height:380px}.about-test .about-video{height:65vw;min-height:320px}}

@media(max-width:700px){.about-test-ac-hero{width:calc(100% - 32px);aspect-ratio:4/5;margin-top:64px}.about-test-ac-hero__visual{object-position:center}.about-test-ac-hero__logo{width:min(78vw,330px)}}

/* Typography system — about-test is the canonical About structure. */
.about-test {
  --about-h1: clamp(56px, 8vw, 128px);
  --about-h2: clamp(34px, 4vw, 56px);
  --about-caption: 16px;
  --about-sub: 20px;
  --about-body: 16px;
}

.about-test .about-intro-title {
  font-family: var(--font-ma-clayton);
  font-size: var(--about-h1);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.025em;
}

.about-test .about-intro-lede {
  max-width: 900px;
  font-family: var(--font-manrope);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.5;
}

.about-test h2,
.about-test .section-heading,
.about-test-ac h2,
.about-test-closing h2 {
  font-family: var(--font-manrope);
  font-size: var(--about-h2);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.025em;
}

/* Preserve the Anh Ceramics wordmark composition as a brand lockup. */
.about-test .about-test-ac-hero h2 {
  display: flex;
  font-size: inherit;
  letter-spacing: normal;
}

.about-test .eyebrow,
.about-test .about-video-label {
  font-family: var(--font-google-sans-code);
  font-size: var(--about-caption);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.about-test .section-subtext,
.about-test .about-test-ac > header > p:last-child,
.about-test .about-test-closing > div > p:not(.eyebrow) {
  font-family: var(--font-manrope);
  font-size: var(--about-sub);
  font-weight: 500;
  line-height: 1.55;
}

.about-test .about-value-term,
.about-test .about-mission-heading {
  font-family: var(--font-manrope);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
}

.about-test .about-mission-heading {
  font-family: var(--font-manrope);
  font-size: 32px;
  font-weight: 600;
  line-height: 1.25;
}

.about-test .about-value-desc,
.about-test .about-stat-list,
.about-test .about-test-ac-stats span {
  font-family: var(--font-manrope);
  font-size: var(--about-body);
  font-weight: 500;
  line-height: 1.65;
}

.about-test .btn,
.about-test button {
  font-family: var(--font-manrope);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}

.about-test a,
.about-test a:visited,
.about-test a:hover,
.about-test a:focus-visible { text-decoration: none; }

.about-test .about-overview-header .section-subtext,
.about-test .about-mission .section-subtext,
.about-test .about-test-closing > div > p:not(.eyebrow) {
  text-align: justify;
  text-justify: inter-word;
}

@media (max-width: 768px) {
  .about-test { --about-caption: 14px; --about-sub: 18px; }
  .about-test h2,
  .about-test .section-heading,
  .about-test-ac h2,
  .about-test-closing h2 { line-height: 1.08; }
  .about-test .about-intro-lede { font-size: 20px; }
  .about-test .about-mission-heading { font-size: 26px; }
}

/* Final stat-card scale: all three cards use compact 16px text. */
.about-test .about-stat-list,
.about-test .about-stat-list--compact {
  gap: 5px;
  font-family: var(--font-manrope);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
}

.about-test .about-stat-list strong,
.about-test .about-stat-list--compact strong {
  font-size: 16px;
  font-weight: 600;
}

/* Workshop stat cards: rectangular imagery. */
.about-test .about-stat-img-wrap {
  border: 0;
  border-radius: 0;
}

/* Layout alignment based on the approved About references. */
.about-test .about-overview {
  gap: clamp(56px, 7vw, 96px);
  padding: clamp(80px, 9vw, 132px) var(--page-gutter);
  background: #fff;
}

.about-test .about-overview-header { max-width: 760px; }
.about-test .about-overview-header .section-heading { width: 100%; }
.about-test .about-overview-header .section-subtext {
  max-width: 720px;
  margin-inline: auto;
  text-align: center;
}

.about-test .about-stats {
  max-width: 1320px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 2.8vw, 40px);
}

.about-test .about-stat-img-wrap { aspect-ratio: 3 / 4.35; }
.about-test .about-stat-overlay { padding: 80px 24px 24px; }

.about-test .about-values {
  max-width: 1440px;
  padding: clamp(80px, 9vw, 132px) var(--page-gutter);
}

.about-test .about-values-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(60px, 8vw, 130px);
}

.about-test .about-values-col,
.about-test .about-values-list { max-width: none; min-width: 0; }
.about-test .about-values-visual img {
  height: clamp(320px, 30vw, 430px);
  aspect-ratio: auto;
  object-fit: cover;
}
.about-test .about-value-row {
  grid-template-columns: minmax(150px, .85fr) minmax(0, 1.35fr);
  gap: 32px;
  min-height: 86px;
  align-items: start;
  padding: 22px 0;
  border-bottom: 1px solid rgba(30, 34, 43, .55);
}
.about-test .about-value-row:first-child { border-top: 0; }

.about-test .about-value-term {
  font-family: var(--font-manrope);
  font-weight: 600;
}

.about-test .about-banner {
  width: calc(100% - 120px);
  max-width: 1320px;
  min-height: clamp(500px, 52vw, 700px);
  margin: 40px auto;
}
.about-test .about-banner-content { width: min(620px, 70%); }

.about-test .about-mission {
  max-width: 1320px;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: clamp(64px, 9vw, 150px);
  padding: clamp(80px, 9vw, 132px) var(--page-gutter);
}
.about-test .about-mission-content { max-width: 520px; justify-content: center; }
.about-test .about-mission-visual { max-width: 520px; }
.about-test .about-mission-visual img { border-radius: 0; }

.about-test .about-test-ac {
  padding: clamp(90px, 10vw, 150px) var(--page-gutter);
}
.about-test .about-test-ac > header { max-width: 760px; margin-bottom: 72px; }
.about-test .about-test-ac > header > p:last-child {
  font-family: var(--font-manrope);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.55;
}
.about-test .about-test-ac-stats { max-width: 1320px; gap: 36px; }
.about-test .about-test-ac-stats article { height: min(52vw, 620px); }
.about-test .about-test-ac-stats strong { top: 30px; }
.about-test .about-test-ac-stats span { top: 112px; font-size: 28px; font-weight: 500; }

@media (max-width: 900px) {
  .about-test .about-values-grid { grid-template-columns: 1fr; gap: 56px; }
  .about-test .about-mission { flex-direction: column; }
  .about-test .about-mission-content,
  .about-test .about-mission-visual { width: 100%; max-width: none; }
  .about-test .about-banner { width: calc(100% - 40px); }
}

@media (max-width: 700px) {
  .about-test .about-stats { grid-template-columns: 1fr; }
  .about-test .about-stat-img-wrap { aspect-ratio: 4 / 5; }
  .about-test .about-value-row { grid-template-columns: 1fr; gap: 8px; }
  .about-test .about-test-ac-stats { gap: 20px; }
  .about-test .about-test-ac-stats article { height: 460px; }
  .about-test .about-test-ac-stats span { top: 98px; font-size: 22px; }
  .about-test .about-test-ac > header > p:last-child { font-size: 18px; }
}

.about-test .about-stat-list--compact {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0;
}

.about-test .about-stat-list--compact strong {
  font-size: 16px;
  font-weight: 600;
}

/* Lock the page-intro hierarchy after the generic subtext rules. */
.about-test .section-subtext.about-intro-lede {
  max-width: 900px;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.5;
}

.about-test .about-overview-header .section-heading {
  max-width: 720px;
  margin-inline: auto;
  text-wrap: balance;
}

.about-test .about-overview-header .section-subtext {
  text-align: justify;
  text-align-last: center;
  text-justify: inter-word;
}

@media (max-width: 768px) {
  .about-test .section-subtext.about-intro-lede { font-size: 20px; }
  .about-test .about-overview-header .section-subtext {
    text-align: left;
    text-align-last: auto;
  }
}

/* Anh Ceramics lockup: compensate for transparent space inside the logo PNG. */
.about-test .about-test-ac-hero__overlay p {
  margin: clamp(-82px, -5.5vw, -48px) 0 0;
  font: 500 32px/1.25 var(--font-manrope);
  letter-spacing: 0;
  text-transform: none;
}

@media (max-width: 700px) {
  .about-test .about-test-ac-hero__overlay p {
    margin-top: -48px;
    font-size: clamp(20px, 6vw, 26px);
  }
}

/* Canonical About rhythm: all content sections share one vertical and horizontal grid. */
.about-test {
  --about-section-y: clamp(72px, 7.5vw, 112px);
  --about-section-x: clamp(20px, 5vw, 72px);
}

.about-test .about-intro {
  min-height: 0;
  padding: var(--about-section-y) var(--about-section-x);
}

.about-test .about-overview,
.about-test .about-values,
.about-test .about-mission,
.about-test .about-test-ac,
.about-test .about-test-closing {
  padding: var(--about-section-y) var(--about-section-x);
}

.about-test .about-overview,
.about-test .about-values,
.about-test .about-mission,
.about-test .about-test-ac-stats {
  width: 100%;
  box-sizing: border-box;
}

/* Vision & mission: balanced two-column layout without shrinking the copy. */
.about-test .about-mission {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  align-items: center;
  gap: clamp(48px, 7vw, 112px);
}

.about-test .about-mission-content,
.about-test .about-mission-visual {
  width: 100%;
  max-width: 620px;
}

.about-test .about-mission-content {
  justify-self: end;
}

.about-test .about-mission-visual {
  justify-self: start;
}

.about-test .about-mission-visual img {
  width: 100%;
  height: clamp(520px, 48vw, 720px);
  object-fit: cover;
}

.about-test .about-banner {
  margin-block: 0;
}

/* Anh Ceramics brand image intentionally breaks out of the content grid. */
.about-test .about-test-ac-hero {
  width: 100%;
  max-width: none;
  margin: 0;
  aspect-ratio: 16 / 9;
}

@media (max-width: 700px) {
  .about-test {
    --about-section-y: 64px;
    --about-section-x: 20px;
  }

  .about-test .about-test-ac-hero {
    width: 100%;
    margin: 0;
    aspect-ratio: 4 / 5;
  }
}

@media (max-width: 900px) {
  .about-test .about-mission {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .about-test .about-mission-content,
  .about-test .about-mission-visual {
    max-width: none;
    justify-self: stretch;
  }

  .about-test .about-mission-visual img {
    height: auto;
    aspect-ratio: 4 / 3;
  }
}