.about-page { width: min(1160px, calc(100% - 64px)); margin: 0 auto; padding: 105px 0 24px; }
.about-intro { display: block; }
.about-copy { display: flex; min-height: 260px; max-width: 880px; flex-direction: column; align-items: flex-start; }
.about-copy .eyebrow { color: #aaa; font-size: 10px; }
.about-copy h1 { margin: 24px 0 20px; color: #f3f3f3; font-family: Inter, sans-serif; font-size: clamp(56px, 7vw, 84px); font-weight: 700; letter-spacing: -.085em; line-height: .99; }
.about-copy h1 span { color: #999; }
.about-copy > p { max-width: 560px; margin: 0; color: #b1b1b1; font-size: 15px; line-height: 1.85; }
.about-meta { display: flex; width: min(100%, 560px); justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 22px; border-top: 1px solid rgb(255 255 255 / 13%); color: #888; font-size: 9px; font-weight: 600; letter-spacing: .09em; }
.about-values { margin-top: 104px; }
.about-values > h2 { margin: 0 0 25px; color: #f1f1f1; font-family: Inter, sans-serif; font-size: clamp(27px, 3vw, 38px); font-weight: 650; letter-spacing: -.065em; }
.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgb(255 255 255 / 13%); border-bottom: 1px solid rgb(255 255 255 / 13%); }
.value-card { min-height: 180px; padding: 22px 24px 24px 0; }
.value-card + .value-card { padding-left: 24px; border-left: 1px solid rgb(255 255 255 / 13%); }
.value-card > span { color: #8e8e8e; font-size: 9px; font-weight: 700; letter-spacing: .1em; }
.value-card h3 { margin: 20px 0 9px; color: #ededed; font-family: Inter, sans-serif; font-size: 16px; font-weight: 650; letter-spacing: -.025em; }
.value-card p { max-width: 330px; margin: 0; color: #a5a5a5; font-size: 13px; line-height: 1.7; }
.about-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0 8px; color: #888; font-size: 10px; }
.about-footer a:first-child { color: #eee; font-weight: 800; letter-spacing: .08em; }
.about-footer a:last-child { color: #ccc; }
@media (max-width: 760px) {
  .about-page { width: calc(100% - 40px); padding-top: 90px; }
  .about-intro { display: block; }
  .about-copy h1 { font-size: clamp(47px, 11vw, 68px); }
  .about-copy > p { font-size: 14px; }
  .about-meta { margin-top: 30px; }
  .about-values { margin-top: 66px; }
  .value-card { min-height: 160px; padding-right: 14px; }
  .value-card + .value-card { padding-left: 14px; }
}
@media (max-width: 560px) {
  .about-page { width: calc(100% - 36px); padding-top: 105px; }
  .about-intro { display: block; }
  .about-copy h1 { margin-top: 18px; }
  .about-meta { flex-direction: column; gap: 8px; }
  .about-values { margin-top: 54px; }
  .value-grid { grid-template-columns: 1fr; }
  .value-card, .value-card + .value-card { min-height: auto; padding: 20px 0; border-left: 0; }
  .value-card + .value-card { border-top: 1px solid rgb(255 255 255 / 13%); }
  .value-card h3 { margin-top: 12px; }
}

/* Final mobile header overrides: keep the brand, menu button, and language control separate. */
@media (max-width: 700px) {
  header.site-header { position: fixed !important; z-index: 1000 !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto 42px !important; grid-template-rows: 1fr !important; align-items: center !important; overflow: visible !important; }
  header.site-header .brand { grid-column: 1 !important; grid-row: 1 !important; display: inline-flex !important; visibility: visible !important; opacity: 1 !important; }
  header.site-header .brand-mark { display: grid !important; visibility: visible !important; opacity: 1 !important; }
  header.site-header .brand-mark img { display: block !important; visibility: visible !important; opacity: 1 !important; object-fit: contain !important; }
  header.site-header .nav-toggle { display: inline-grid !important; grid-column: 3 !important; grid-row: 1 !important; place-self: center !important; visibility: visible !important; opacity: 1 !important; }
  header.site-header .language-menu { grid-column: 2 !important; grid-row: 1 !important; justify-self: end !important; }
  header.site-header .main-nav { position: absolute !important; top: calc(100% + 9px) !important; right: 0 !important; left: auto !important; z-index: 1001 !important; display: none !important; grid-column: auto !important; grid-row: auto !important; width: min(290px, calc(100vw - 24px)) !important; flex-direction: column !important; align-items: stretch !important; }
  header.site-header .main-nav.is-open { display: flex !important; }
  header.site-header .main-nav a { display: flex !important; }
}
