.about-page { background: var(--bone); color: var(--ink); }
.about-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.about-page h1, .about-page h2, .about-page p { margin: 0; }
.about-page h1, .about-page h2 { text-wrap: balance; letter-spacing: -.035em; }
.about-page h1 { max-width: 16ch; font-size: var(--type-hero); line-height: 1.06; }
.about-page h2 { font-size: var(--type-display); line-height: 1.08; }
.about-page p { font-size: 18px; line-height: 1.5; letter-spacing: -.015em; }
.about-page .section-label { margin: 0; font: var(--type-label); letter-spacing: var(--tracking-label); }
.about-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.about-meta > p:last-child { font: var(--type-label); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-muted-text); }
.about-hero { padding: clamp(132px, 12vw, 144px) 0 64px; }
.about-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(300px, .95fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.about-hero__copy { display: grid; justify-items: start; gap: 24px; }
.about-hero__intro { max-width: 42ch; font-size: clamp(19px, 1.6vw, 23px) !important; line-height: 1.35 !important; }
.about-hero__detail { max-width: 48ch; color: var(--color-muted-text); }
.about-hero__image { aspect-ratio: 4 / 3; margin: 0; overflow: hidden; border-radius: var(--radius-lg); background: var(--color-muted-plum); }
.about-hero__image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.about-story { padding: var(--space-section) 0; border-top: 1px solid var(--color-border-subtle); }
.about-story__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(32px, 7vw, 120px); }
.about-story__heading { display: grid; align-content: start; gap: 24px; }
.about-kicker { font: var(--type-label) !important; letter-spacing: var(--tracking-label) !important; text-transform: uppercase; color: var(--color-muted-text); }
.about-story h2 { max-width: 13ch; }
.about-prose { display: grid; gap: 20px; max-width: 61ch; }
.about-prose p { color: var(--color-muted-text); }
.about-principles { padding:  0 0 var(--space-section); }
.about-principles__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.about-principles__list li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 16px; padding: 28px 24px 32px 0; }
.about-principles__list li + li { padding-left: 24px; border-left: 1px solid var(--color-border); }
.about-principles__list img { width: 24px; height: 24px; object-fit: contain; }
.about-page .about-principles__list h2 { font-size: clamp(22px, 2vw, 29px); line-height: 1.08; }
.about-principles__list p { margin-top: 16px; color: var(--color-muted-text); font-size: 16px; line-height: 1.45; }
.about-products { padding: var(--space-section) 0; background: var(--color-surface-dim); }
.about-products__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .86fr); gap: clamp(36px, 9vw, 128px); align-items: center; }
.about-products__copy { display: grid; justify-items: start; gap: 24px; }
.about-products__copy h2 { max-width: 17ch; }
.about-products__copy > p:not(.section-label) { max-width: 52ch; color: var(--color-muted-text); }
.about-products__links { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 4px !important; font: var(--type-label) !important; text-transform: uppercase; }
.about-products__links a:not(.lp-action) { color: var(--ink); border-bottom: 1px solid currentColor; padding-bottom: 6px; text-decoration: none; }
.about-product-visual { width: min(100%, 410px); margin: 0; justify-self: end; overflow: hidden; border-radius: var(--radius-lg); background: var(--ink); }
.about-product-visual a { display: block; color: var(--color-white); text-decoration: none; }
.about-product-visual img { display: block; width: 100%; height: auto; object-fit: cover; object-position: center; }
.about-product-visual figcaption { display: grid; gap: 8px 16px; padding: 18px 20px 20px; font: var(--type-label); }
.about-product-visual figcaption > span:first-child { grid-column: 1 / -1; color: var(--orchid); text-transform: uppercase; }
.about-product-visual figcaption a { font: 400 18px/1.25 var(--font-sans); letter-spacing: -.015em; }
.about-product-visual figcaption a:not(.lp-action) span { margin-left: 8px; }
.about-cta { padding: var(--space-section) 0; background: var(--ink); color: var(--color-white); }
.about-cta .section-label { --label-background: #ffffff1a; --label-color: #fff; --label-marker: var(--label-marker-inverse); }
.about-cta h2 { max-width: 17ch; margin-top: 28px; }
.about-cta > .about-shell > p:not(.section-label) { max-width: 48ch; margin-top: 24px; color: #ffffffbf; }
.about-cta .reference-button { margin-top: 32px; }
@media (max-width: 960px) {
  .about-principles__list { grid-template-columns: 1fr; }
  .about-principles__list li, .about-principles__list li + li { padding: 24px 0; border-left: 0; }
  .about-principles__list li + li { border-top: 1px solid var(--color-border); }
}
@media (max-width: 760px) {
  .about-shell { width: min(100% - 48px, 560px); }
  .about-hero { padding-top: 120px; padding-bottom: 40px; }
  .about-hero__grid, .about-story__grid, .about-products__grid { grid-template-columns: 1fr; }
  .about-hero__grid { gap: 32px; }
  .about-hero__image { aspect-ratio: 3 / 2; }
  .about-page h1 { font-size: var(--type-hero); }
  .about-page h2 { font-size: var(--type-section); }
  .about-story { padding: var(--space-section) 0; }
  .about-story__grid { gap: 20px; }
  .about-principles { padding-bottom: 40px; }
  .about-page .about-principles__list h2 { font-size: clamp(22px, 6.7vw, 26px); }
  .about-products { padding: var(--space-section) 0; }
  .about-product-visual { justify-self: start; }
  .about-cta { padding: var(--space-section) 0; }
}
@media (max-width: 359px) {
  .about-shell { width: calc(100% - 32px); }
  .about-page h1 { font-size: 35px; }
  .about-cta .reference-button .btn_label { padding-left: 12px; }
}

.about-products__links a:not(.lp-action):hover, .about-product-visual a:not(.lp-action):hover { text-decoration: underline; text-underline-offset: 4px; }
.about-product-visual a:focus-visible { outline: 3px solid var(--color-orchid); outline-offset: -4px; }
@media (min-width: 761px) and (max-width: 960px) {
  .about-hero__grid, .about-products__grid { gap: 32px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .about-page h1 { font-size: 42px; }
  .about-page h2 { font-size: 36px; }
  .about-story__grid { gap: 40px; }
  .about-hero__image { aspect-ratio: 4 / 5; }
}

.about-cta .reference-button { --button-text-background: var(--color-orchid); --button-text-color: var(--color-ink); --button-text-background-hover: var(--color-white); --button-text-color-hover: var(--color-ink); }
@media (max-width: 359px) { .about-cta .reference-button .btn_icon { flex-basis: 44px; width: 44px; } }
