.about-page { --about-rule: #aaa8a1; }
.about-hero { padding-top: clamp(40px, 4.4vw, 74px); padding-bottom: 0; scroll-margin-top: 20px; }
.about-label { font-size: 13px; }
.about-hero-grid { display: grid; grid-template-columns: 1.38fr 1fr; gap: clamp(48px, 6vw, 108px); align-items: start; margin-top: 32px; }
.about-intro { padding-top: 5px; }
.about-intro h1 { font-family: "Roboto Condensed Variable", Arial, sans-serif; font-size: clamp(100px, 11.2vw, 181px); font-weight: 900; letter-spacing: -.025em; line-height: .89; }
.about-intro h1 > span { display: block; }
.about-stop { color: var(--accent); }
.about-intro > p { max-width: 590px; margin-top: 37px; font-size: clamp(22px, 1.9vw, 29px); font-weight: 450; line-height: 1.29; letter-spacing: -.025em; }
.about-intro > .about-intro-detail { max-width: 520px; margin-top: 21px; font-size: 18px; line-height: 1.55; letter-spacing: -.012em; color: #55554f; }
.about-text-link { display: inline-block; margin-top: 30px; padding-block: 9px; border-bottom: 1px solid currentColor; font-size: 18px; line-height: 1.4; letter-spacing: -.015em; }
.about-text-link:hover { color: var(--accent); }
.about-poster { background: var(--ink); color: var(--paper); padding: clamp(26px, 2.7vw, 44px); margin-top: 6px; }
.about-poster-top { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 22px; border-bottom: 1px solid #777771; gap: 18px; font-size: 12px; line-height: 1.4; letter-spacing: .02em; }
.about-poster-top > span:first-child { font-size: 17px; font-weight: 650; letter-spacing: -.03em; }
.about-poster-word { padding-top: 18px; padding-bottom: 19px; border-bottom: 1px solid #55554f; }
.about-poster-word > span { display: block; font-family: "Roboto Condensed Variable", Arial, sans-serif; font-size: clamp(54px, 5.3vw, 85px); font-weight: 900; letter-spacing: -.025em; line-height: .88; text-transform: uppercase; color: var(--about-accent); }
.about-poster-word > small { display: block; margin-top: 11px; font-size: 13px; line-height: 1.35; color: #c4c3bc; }
.about-poster-bottom { font-size: 12px; letter-spacing: .025em; line-height: 1.5; padding-top: 22px; }
.about-hero-foot { display: flex; justify-content: space-between; gap: 24px; margin-top: 54px; padding-block: 21px; border-top: 1px solid var(--about-rule); border-bottom: 1px solid var(--about-rule); font-size: 13px; line-height: 1.5; color: #55554f; }
.about-hero-foot a:hover { color: var(--ink); }
.about-hero-foot a { border-bottom: 1px solid currentColor; }
.about-approach, .about-products, .about-guidance { scroll-margin-top: 20px; }
.about-approach, .about-guidance { display: grid; grid-template-columns: .92fr 1fr; gap: clamp(60px, 9.3vw, 153px); padding-block: clamp(78px, 7.3vw, 118px); }
.about-section-intro .eyebrow, .about-products .eyebrow { font-size: 13px; }
.about-section-intro h2, .about-products h2 { font-size: clamp(42px, 4.15vw, 65px); letter-spacing: -.045em; font-weight: 650; line-height: 1.04; margin-top: 25px; }
.about-section-intro > p:last-child { max-width: 430px; margin-top: 25px; font-size: 20px; letter-spacing: -.015em; line-height: 1.45; color: #55554f; }
.about-principles { list-style: none; padding: 0; margin: 0; }
.about-principles li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 24px; padding-block: 28px 30px; border-top: 1px solid var(--about-rule); }
.about-principles li:last-child { border-bottom: 1px solid var(--about-rule); }
.about-principle-number { font-size: 12px; line-height: 1.5; padding-top: 6px; color: #55554f; }
.about-principles h3 { font-size: 27px; font-weight: 550; letter-spacing: -.03em; line-height: 1.13; margin: 0; }
.about-principles li p { max-width: 470px; margin-top: 14px; font-size: 18px; line-height: 1.48; letter-spacing: -.015em; color: #55554f; }
.about-products { border-top: 1px solid var(--about-rule); border-bottom: 1px solid var(--about-rule); padding-block: clamp(68px, 6vw, 96px); }
.about-products-head { display: grid; grid-template-columns: .92fr 1fr; gap: clamp(60px, 9.3vw, 153px); align-items: end; }
.about-products-head > p { max-width: 510px; font-size: 22px; line-height: 1.4; letter-spacing: -.02em; color: #55554f; }
.about-product-families { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(40px, 5.7vw, 88px); margin-top: 52px; }
.about-platform { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; margin-bottom: 19px; }
.about-platform h3 { margin: 0; font-size: 18px; font-weight: 550; letter-spacing: -.015em; }
.about-platform > span { font-size: 12px; text-transform: uppercase; letter-spacing: .09em; color: #55554f; }
.about-product-link { display: block; padding: 29px 26px 30px; min-height: 210px; position: relative; border-top: 1px solid var(--about-rule); }
.about-product-link:last-child { border-bottom: 1px solid var(--about-rule); }
.about-product-link::before { content: ""; position: absolute; left: 0; top: 32px; bottom: 32px; width: 4px; background: var(--about-accent); }
.about-product-link h4 { font-size: clamp(27px, 2.5vw, 39px); font-weight: 570; line-height: 1.12; letter-spacing: -.04em; margin: 0; }
.about-product-link p { font-size: 17px; line-height: 1.45; letter-spacing: -.01em; margin-top: 14px; color: #55554f; }
.about-product-action { display: inline-block; font-size: 15px; line-height: 1.4; margin-top: 23px; border-bottom: 1px solid currentColor; }
.about-product-link:hover { background: color-mix(in srgb, var(--about-accent) 18%, transparent); }
.about-product-link:hover h4 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.about-guidance-links { border-bottom: 1px solid var(--about-rule); }
.about-guidance-links a { display: block; position: relative; padding-block: 25px 28px; padding-right: 82px; border-top: 1px solid var(--about-rule); }
.about-guidance-links h3 { margin: 0; font-size: 28px; font-weight: 550; line-height: 1.2; letter-spacing: -.025em; }
.about-guidance-links p { max-width: 470px; margin-top: 12px; font-size: 17px; line-height: 1.4; color: #55554f; }
.about-guidance-links a > span { position: absolute; right: 0; top: 33px; font-size: 14px; border-bottom: 1px solid currentColor; }
.about-guidance-links a:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
@media (max-width: 1050px) {
  .about-hero-grid { grid-template-columns: 1.08fr 1fr; gap: 40px; }
  .about-intro h1 { font-size: clamp(86px, 11.1vw, 115px); }
  .about-intro > p { margin-top: 27px; font-size: 23px; }
  .about-poster { padding: 25px; }
  .about-poster-top { align-items: start; gap: 15px; }
  .about-poster-top > span:last-child { max-width: 112px; text-align: right; }
  .about-poster-word > span { font-size: clamp(43px, 5.6vw, 60px); }
  .about-poster-word { padding-top: 20px; padding-bottom: 18px; }
  .about-poster-bottom { font-size: 11px; }
  .about-approach, .about-guidance, .about-products-head { gap: 44px; grid-template-columns: .93fr 1fr; }
  .about-section-intro h2, .about-products h2 { font-size: clamp(38px, 4.6vw, 48px); }
  .about-section-intro > p:last-child { font-size: 18px; }
  .about-principles li { grid-template-columns: 22px minmax(0, 1fr); gap: 17px; padding-block: 23px; }
  .about-principles h3 { font-size: 23px; }
  .about-principles li p { font-size: 17px; }
  .about-products-head > p { font-size: 20px; }
  .about-product-families { gap: 36px; }
  .about-product-link { padding-left: 21px; padding-right: 10px; min-height: 225px; }
  .about-product-link h4 { font-size: 29px; }
  .about-guidance-links a { padding-right: 0; }
  .about-guidance-links h3 { font-size: 25px; }
  .about-guidance-links a > span { position: static; display: inline-block; margin-top: 16px; }
}
.about-addon-note { margin: 0; padding: 0 0 24px; font-size: 17px; line-height: 1.5; color: #65655e; }
.about-addon-note a { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 700px) {
  .about-hero { padding-top: 36px; }
  .about-label { font-size: 11px; }
  .about-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 38px; margin-top: 25px; }
  .about-intro { padding-top: 0; }
  .about-intro h1 { font-size: clamp(76px, 23.2vw, 146px); }
  .about-intro > p { margin-top: 26px; font-size: 23px; line-height: 1.32; }
  .about-intro > .about-intro-detail { font-size: 17px; line-height: 1.5; margin-top: 17px; }
  .about-text-link { margin-top: 19px; font-size: 17px; }
  .about-poster { padding: 26px; margin-top: 0; }
  .about-poster-top > span:last-child { max-width: none; font-size: 11px; }
  .about-poster-word { padding-top: 18px; padding-bottom: 17px; }
  .about-poster-word > span { font-size: clamp(48px, 15.4vw, 88px); }
  .about-poster-word > small { font-size: 12px; }
  .about-poster-bottom { font-size: 11px; }
  .about-hero-foot { flex-direction: column; gap: 8px; padding-block: 19px; margin-top: 31px; font-size: 12px; }
  .about-hero-foot a { align-self: start; padding-block: 6px; }
  .about-approach, .about-guidance { display: block; padding-block: 55px; }
  .about-section-intro .eyebrow, .about-products .eyebrow { font-size: 11px; }
  .about-section-intro h2, .about-products h2 { font-size: clamp(37px, 9.8vw, 52px); line-height: 1.08; margin-top: 19px; }
  .about-section-intro > p:last-child { font-size: 18px; line-height: 1.5; margin-top: 22px; }
  .about-principles { margin-top: 34px; }
  .about-principles li { grid-template-columns: 22px minmax(0, 1fr); gap: 16px; padding-block: 25px; }
  .about-principles h3 { font-size: 23px; line-height: 1.2; }
  .about-principles li p { font-size: 17px; margin-top: 12px; }
  .about-products { padding-block: 52px; }
  .about-products-head { display: block; }
  .about-products-head > p { font-size: 19px; margin-top: 24px; line-height: 1.45; }
  .about-product-families { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-top: 36px; }
  .about-platform h3 { font-size: 18px; }
  .about-platform > span { font-size: 11px; }
  .about-product-link { min-height: 0; padding: 25px 16px 27px 21px; }
  .about-product-link h4 { font-size: 30px; }
  .about-product-link p { font-size: 16px; margin-top: 12px; }
  .about-product-action { font-size: 15px; margin-top: 21px; }
  .about-product-link::before { top: 28px; bottom: 28px; }
  .about-guidance-links { margin-top: 32px; }
  .about-guidance-links a { padding-block: 25px; }
  .about-guidance-links h3 { font-size: 25px; }
  .about-guidance-links p { font-size: 16px; }
}