/* About uses the approved brand system; page composition stays isolated. */
body[data-page="about"] main { --company-line: #334248; --company-copy: #c5d1d5; --company-accent: #9de1cd; background: #080f14; }
body[data-page="about"] main :is(h1,h2,h3,p,a,span,figcaption,summary) { letter-spacing: 0; }
body[data-page="about"] main :is(h1,h2,h3) { font-family: "Urbanist",sans-serif; font-weight: 300; color: #edf4f6; margin: 0; }
body[data-page="about"] main h2 { font-size: 48px; line-height: 1.12; }
body[data-page="about"] main h3 { font-size: 27px; line-height: 1.25; font-weight: 400; }
body[data-page="about"] main p { font: 400 18px/1.7 "Urbanist",sans-serif; color: var(--company-copy); margin: 0; }
body[data-page="about"] main .company-kicker { font: 500 13px/1.5 "Urbanist",sans-serif; color: #b0c9c8; margin-bottom: 24px; }
.company-section { padding-block: 96px; scroll-margin-top: 100px; }
.company-hero { position: relative; isolation: isolate; background: #17262d; overflow: hidden; min-height: 640px; display: grid; align-items: center; }
.company-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,rgba(5,12,17,.86),rgba(5,12,17,.52) 44%,rgba(5,12,17,.08) 78%),linear-gradient(0deg,rgba(5,12,17,.45),transparent 35%); }
body[data-page="about"] .company-hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 65% 55%; z-index: -2; filter: none; }
.company-hero-inner { padding-block: 64px; }
body[data-page="about"] .company-hero h1 { font-size: 58px; line-height: 1.08; max-width: 650px; }
.company-hero h1 > span { display: block; font-size: 29px; line-height: 1.4; color: #d0eee3; margin-top: 20px; }
.company-link { display: flex; align-items: center; justify-content: space-between; gap: 28px; width: fit-content; min-height: 48px; border-bottom: 1px solid #688c85; color: #eff7f6; text-decoration: none; font: 500 16px/1.45 "Urbanist",sans-serif; }
.company-link > span { color: var(--company-accent); transition: transform 180ms ease; }
.company-link:hover > span { transform: translate(3px,-3px); }
.company-hero .company-link { margin-top: 30px; }
.company-index { border-bottom: 1px solid var(--company-line); background: #0e181e; }
.company-index > div { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
.company-index a { display: flex; gap: 18px; align-items: center; min-height: 76px; text-decoration: none; font: 400 11px/1.4 "IBM Plex Mono",monospace; color: var(--company-accent); }
.company-index a span { font: 400 15px/1.4 "Urbanist",sans-serif; color: #d8e3e5; }
.company-index a:hover span { color: #a0e7ce; }
.company-story { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.company-prose { display: grid; gap: 22px; }
.company-founder { display: grid; gap: 5px; padding-top: 24px; margin-top: 8px; border-top: 1px solid var(--company-line); }
.company-founder > span { color: #a5c6be; font-size: 13px; }
.company-founder a { color: #edf4f6; font-size: 17px; text-decoration: none; padding-block: 7px; }
.company-founder a span { display: block; color: #a5c6be; font-size: 13px; margin-top: 8px; }
body[data-page="about"] main .company-lead { font-size: 24px; line-height: 1.5; color: #eef4f5; }
.company-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 48px; margin-bottom: 44px; }
.company-section-heading > p { max-width: 35ch; }
.company-business { border-block: 1px solid var(--company-line); background: #0c151a; }
.company-services { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.company-services article { min-width: 0; display: flex; flex-direction: column; align-items: start; }
.company-service-image { display: block; width: 100%; aspect-ratio: 5/4; overflow: hidden; margin-bottom: 24px; border-radius: 4px; }
body[data-page="about"] .company-service-image img { width: 100%; height: 100%; object-fit: cover; filter: none; transition: transform 450ms ease; }
.company-service-image:hover img { transform: scale(1.025); }
.company-number { font: 400 11px/1.5 "IBM Plex Mono",monospace; color: #add7cd; }
body[data-page="about"] .company-services h3 { margin: 12px 0 16px; }
.company-services p { margin-bottom: 24px !important; }
.company-services .company-link { width: 100%; margin-top: auto; border-top: 1px solid var(--company-line); border-bottom: 0; padding-top: 12px; }
.company-media-credit { margin-top: 32px; max-width: 85ch; color: #b7c8ce; }
.company-media-credit summary { cursor: pointer; font-size: 13px; padding-block: 12px; width: fit-content; }
body[data-page="about"] .company-media-credit p { font-size: 14px; }
.company-media-credit a { color: #c8ebdf; text-underline-offset: 4px; }
.company-product { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 80px; }
.company-product-copy > p:not(.company-kicker) { margin-top: 24px !important; max-width: 46ch; }
.company-product-status { margin: 28px 0 18px; border-left: 2px solid #83cbb4; padding-left: 16px; }
.company-product-status > span { display: block; color: #a0e1ca; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
body[data-page="about"] .company-product-status p { font-size: 15px; line-height: 1.65; }
.company-secondary-link { display: block; width: fit-content; min-height: 44px; padding-top: 18px; color: #cad6db; font-size: 15px; text-underline-offset: 5px; }
.company-screens { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; align-items: start; padding: 16px 0 0; }
.company-screens figure { min-width: 0; margin: 0; }
.company-screens figure:last-child { margin-top: 64px; }
body[data-page="about"] .company-screens img { width: 100%; height: auto; display: block; border: 5px solid #26343b; border-radius: 26px; filter: none; box-shadow: 0 16px 40px #0004; }
.company-screens figcaption { font: 400 12px/1.5 "Urbanist",sans-serif; color: #b9ced0; margin-top: 16px; text-align: center; }
.company-standards { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding-top: 72px; border-top: 1px solid var(--company-line); }
.company-standards-intro { max-width: 37ch; margin-top: 24px !important; }
.company-principles article { display: grid; grid-template-columns: 24px 1fr; gap: 22px; padding-block: 24px; border-top: 1px solid var(--company-line); }
.company-principles article:first-child { padding-top: 0; border-top: 0; }
body[data-page="about"] .company-principles h3 { font-size: 23px; margin-bottom: 12px; }
.company-principles .company-number { padding-top: 6px; }
.company-conversation { background: #122027; border-block: 1px solid #31474d; }
.company-conversation-grid { display: grid; grid-template-columns: 88px 1fr auto; gap: 40px; align-items: start; }
body[data-page="about"] .company-conversation .company-conversation-grid > img { display: block; width: 100%; height: auto; filter: brightness(0) invert(1); opacity: 1; }
.company-conversation-grid p:not(.company-kicker) { max-width: 49ch; margin: 24px 0 !important; }
.company-email { align-self: end; color: #cce9e0; font-size: 16px; text-underline-offset: 6px; padding-block: 14px; }
body[data-page="about"] main a:focus-visible, .company-media-credit summary:focus-visible { outline: 2px solid #a0e7ce; outline-offset: 6px; }
@media (min-width: 1800px) { .company-hero { min-height: 720px; } }
@media (max-width: 1000px) {
  .company-story,.company-product,.company-standards { gap: 40px; }
  .company-services { gap: 24px; }
  body[data-page="about"] main h2 { font-size: 40px; }
  .company-section-heading > p { max-width: 29ch; }
  .company-conversation-grid { grid-template-columns: 64px 1fr; gap: 28px; }
  .company-conversation-grid > img { width: 64px; height: 64px; }
  .company-email { grid-column: 2; justify-self: start; }
  .company-screens { gap: 14px; }
}
@media (max-width: 700px) {
  .company-section { padding-block: 56px; }
  .company-hero { min-height: 740px; align-items: start; }
  .company-hero-inner { padding-block: 44px 340px; }
  body[data-page="about"] .company-hero-photo { object-position: 83% center; }
  .company-hero::after { background: linear-gradient(180deg,rgba(5,12,17,.88),rgba(5,12,17,.7) 35%,rgba(5,12,17,.08) 64%,rgba(5,12,17,.25)); }
  body[data-page="about"] .company-hero h1 { font-size: 43px; }
  .company-hero h1 > span { font-size: 23px; margin-top: 18px; }
  .company-hero .company-link { margin-top: 24px; }
  .company-index > div { grid-template-columns: repeat(2,minmax(0,1fr)); padding-block: 10px; }
  .company-index a { min-height: 52px; gap: 12px; }
  .company-index a span { font-size: 14px; }
  .company-story,.company-product,.company-standards { grid-template-columns: 1fr; gap: 30px; }
  body[data-page="about"] main h2 { font-size: 37px; }
  body[data-page="about"] main .company-kicker { margin-bottom: 18px; }
  body[data-page="about"] main .company-lead { font-size: 22px; }
  .company-section-heading { display: grid; gap: 24px; margin-bottom: 32px; }
  .company-section-heading > p { max-width: none; }
  .company-services { grid-template-columns: 1fr; gap: 40px; }
  .company-service-image { aspect-ratio: 3/2; margin-bottom: 20px; }
  .company-screens { max-width: 470px; gap: 16px; margin-inline: auto; }
  .company-screens figure:last-child { margin-top: 40px; }
  body[data-page="about"] .company-screens img { border-width: 3px; border-radius: 20px; }
  .company-standards { padding-top: 48px; }
  .company-conversation-grid { grid-template-columns: 1fr; gap: 24px; }
  .company-conversation-grid > img { width: 54px; height: 54px; }
  .company-email { grid-column: 1; }
}
@media (max-width: 360px) { body[data-page="about"] .company-hero h1 { font-size: 38px; } .company-hero h1 > span { font-size: 21px; } }
@media (prefers-reduced-motion: reduce) { .company-link > span,.company-service-image img { transition: none; } .company-service-image:hover img { transform: none; } }
