/* About: open, expressive purpose statements and a connected milestone timeline. */
body[data-layout="about"] { background:#081628; }
.about-skip { position:fixed; top:-80px; left:24px; z-index:100; padding:12px 18px; color:#10233d; background:#fff; }
.about-skip:focus { top:16px; }
body[data-layout="about"] :is(.about-hero,.about-purpose,.about-journey,.about-values,.about-invitation) :is(h1,h2,h3) { position:static; height:auto; margin:0; font-family:"Inter",system-ui,sans-serif; font-weight:400; letter-spacing:-.05em; line-height:1.1; text-wrap:balance; }
.about-hero { color:#f0f5fc; background:#081628; overflow:hidden; }
.about-hero__stage { position:relative; isolation:isolate; display:flex; align-items:center; min-height:clamp(680px,87svh,960px); }
.about-hero__layout { position:relative; z-index:2; padding-block:155px 90px; }
.about-hero__copy { width:46%; }
body[data-layout="about"] .about-hero h1 { font-size:clamp(62px,7.1vw,108px); line-height:1.01; letter-spacing:-.065em; }
.about-hero h1 em { color:#aacafa; }
.about-hero__copy>p { margin-top:34px; max-width:40ch; font-size:17px; line-height:1.75; color:#becfe5; }
.about-hero__copy>.about-link { margin-top:26px; }
.about-hero__art { position:absolute; z-index:0; inset:0 -8% 0 auto; width:78%; display:flex; align-items:center; margin:0; pointer-events:none; }
.about-hero__art img { width:100%; height:auto; mask-image:linear-gradient(90deg,transparent,#000 20%,#000 94%,transparent),linear-gradient(0deg,transparent,#000 14%,#000 86%,transparent); mask-composite:intersect; }
.about-hero__stage::after { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,#081628 0%,#081628f5 29%,#08162894 43%,transparent 67%); }
.about-link { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; min-height:44px; color:inherit; font-size:13px; line-height:1.5; border-bottom:1px solid currentColor; text-wrap:pretty; }
.about-link>span { flex:none; font-size:21px; transition:transform .25s ease; }
.about-link:hover>span { transform:translate(3px,-3px); }
.about-hero .about-link:hover>span { transform:translateY(3px); }
.about-facts { position:relative; border-top:1px solid #7295c039; background:#0d2138; }
.about-facts__layout { display:grid; grid-template-columns:.75fr 1fr 1.25fr; }
.about-facts__layout>div { min-width:0; padding:25px 30px 29px 0; display:flex; flex-direction:column; gap:8px; }
.about-facts__layout>div+div { padding-left:40px; border-left:1px solid #7295c039; }
.about-facts dt { color:#9bb4d5; font-size:12px; line-height:1.5; }
.about-facts dd { color:#ecf3ff; font-size:clamp(20px,2vw,30px); line-height:1.25; letter-spacing:-.04em; }
.about-purpose,.about-journey,.about-values { padding-block:86px; scroll-margin-top:100px; }
.about-section-heading { display:flex; align-items:end; justify-content:space-between; gap:35px; margin-bottom:46px; }
body[data-layout="about"] :is(.about-section-heading,.about-values)>h2 { font-size:clamp(40px,4.6vw,70px); }
.about-section-heading>.about-link { flex-shrink:0; }
.about-purpose { padding-block:112px 105px; background:linear-gradient(155deg,#f5f7fa 10%,#e5eef8 75%,#dce8f5); color:#142d4b; }
.about-purpose__flow { display:grid; grid-template-columns:minmax(0,1fr); gap:70px; }
.about-mission,.about-vision { min-width:0; padding:0; border:0; background:none; }
.about-mission,.about-vision { display:grid; grid-template-columns:1fr 2fr; gap:25px 8%; align-items:start; }
body[data-layout="about"] :is(.about-mission,.about-vision)>h2 { font-size:clamp(40px,4.8vw,72px); letter-spacing:-.06em; line-height:1.04; }
.about-mission>h2,.about-vision>h2 { grid-row:1/3; }
.about-mission>p,.about-vision>p { font-size:clamp(24px,2.25vw,34px); line-height:1.45; letter-spacing:-.035em; text-wrap:pretty; }
.about-mission>p { max-width:35ch; }
.about-mission>p>span,.about-vision>p>span { display:block; }
.about-mission>p em,.about-vision>p em { display:block; color:#376fad; font-size:clamp(52px,6.4vw,96px); line-height:1.04; letter-spacing:-.065em; margin-block:26px; }
.about-mission>p>span:last-child,.about-vision>p>span:last-child { max-width:37ch; font-size:clamp(18px,1.6vw,24px); line-height:1.65; letter-spacing:-.015em; color:#526d8b; }
.about-purpose .about-link { justify-self:start; color:#356199; }
.about-mission>.about-link,.about-vision>.about-link { grid-column:2; }
.about-vision { padding-top:70px; border-top:1px solid #809bbb40; }
.about-vision>p { font-size:clamp(24px,2vw,30px); }
.about-vision>p em { font-size:clamp(47px,4.9vw,74px); }
.about-journey { padding-block:100px 110px; background:#081628; color:#eaf2fd; }
.about-journey h2 em { color:#a3c5f8; }
.about-journey .about-section-heading>.about-link { color:#bdd5f4; }
.about-timeline { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:72px; }
.about-timeline li { position:relative; min-width:0; display:grid; grid-template-rows:auto 30px 1fr; gap:25px; align-content:start; }
.about-timeline time { display:block; padding-right:24px; font-size:clamp(28px,2.9vw,44px); line-height:1.2; color:#a5c5ee; letter-spacing:-.05em; }
.about-timeline time span { display:inline-block; font-size:.75em; padding-left:6px; }
.about-timeline__marker { display:block; height:30px; position:relative; }
.about-timeline__marker::before { content:""; position:absolute; height:2px; inset:14px 0 auto; background:linear-gradient(90deg,#79abef,#3975c5); }
.about-timeline__marker::after { content:""; position:absolute; width:14px; height:14px; left:0; top:8px; border:2px solid #b5d6ff; border-radius:50%; background:#6fa8ef; box-shadow:0 0 0 7px #1b3d6570; }
.about-timeline li:last-child .about-timeline__marker::before { background:none; border-top:2px dashed #6d9cd777; }
.about-timeline li:last-child .about-timeline__marker::after { background:#081628; box-shadow:0 0 0 7px #214c8270,0 0 32px #5b9dff50; }
.about-timeline__story { padding-right:30px; }
body[data-layout="about"] .about-timeline h3 { font-size:clamp(23px,2vw,30px); line-height:1.25; }
.about-timeline p { max-width:32ch; font-size:14px; line-height:1.8; color:#a9bfdc; margin-top:18px; }
.about-timeline li:last-child h3 { color:#b8d5ff; }
.about-values { background:#e3ecf6; color:#142d4b; }
.about-values__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:48px; border-top:1px solid #9ab0ca99; }
.about-values__grid article { min-width:0; display:flex; flex-direction:column; padding:33px 36px 6px 0; }
.about-values__grid article+article { border-left:1px solid #9ab0ca99; padding-left:36px; }
.about-values__grid article:last-child { padding-right:0; }
.about-value__number { color:#a0b9d8; font-size:clamp(64px,6.9vw,104px); line-height:1; letter-spacing:-.08em; font-weight:300; margin-bottom:46px; }
body[data-layout="about"] .about-values__grid h3 { font-size:clamp(27px,2.6vw,39px); line-height:1.2; letter-spacing:-.04em; }
.about-values__grid p { color:#506b8c; font-size:15px; line-height:1.8; margin-top:20px; max-width:38ch; }
.about-invitation { padding:68px 0 78px; color:#142d4b; background:#e3ecf6; }
.about-invitation__layout { display:grid; grid-template-columns:1.3fr .7fr; gap:8%; align-items:center; padding-top:55px; position:relative; }
.about-invitation__layout::before { content:""; height:1px; background:#9ab0ca99; position:absolute; top:0; left:var(--gutter); right:var(--gutter); }
body[data-layout="about"] .about-invitation h2 { font-size:clamp(42px,4.9vw,74px); max-width:17ch; }
.about-invitation h2 em { color:#4777b1; }
.about-invitation__actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:20px 28px; }
.about-invitation .btn { background:#173b64; color:#fff; }
.about-invitation .btn:hover { background:#28588e; color:#fff; }
.about-invitation .about-link { color:#315f99; }
body[data-layout="about"] .closeband { padding-top:60px; }
body[data-layout="about"] .closeband .tagband { flex-direction:row; flex-wrap:wrap; gap:10px; align-items:center; }
body[data-layout="about"] .closeband .tagband span { font-family:inherit; font-size:15px; text-transform:none; letter-spacing:0; }
@media(min-width:1800px) {
  .about-hero__art { width:72%; right:-4%; }
}
@media(max-width:1100px) {
  .about-hero__copy { width:49%; }
  body[data-layout="about"] .about-hero h1 { font-size:clamp(59px,7.8vw,86px); }
  .about-hero__copy>p { font-size:16px; }
  .about-facts__layout>div+div { padding-left:26px; }
  .about-purpose__flow { gap:60px; }
  .about-mission,.about-vision { grid-template-columns:.7fr 1.3fr; gap:24px 6%; }
  .about-vision { padding-top:60px; }
  .about-timeline time { padding-right:15px; font-size:29px; }
  .about-timeline__story { padding-right:24px; }
  .about-values__grid article { padding-right:24px; }
  .about-values__grid article+article { padding-left:24px; }
}
@media(max-width:800px) {
  .about-hero__stage { display:block; min-height:0; }
  .about-hero__layout { padding-block:126px 24px; }
  .about-hero__copy { width:100%; }
  body[data-layout="about"] .about-hero h1 { font-size:clamp(62px,11vw,88px); }
  .about-hero__copy>p { margin-top:26px; max-width:51ch; }
  .about-hero__art { position:relative; inset:auto; width:100%; }
  .about-hero__art img { mask-image:linear-gradient(0deg,#000 86%,transparent); mask-composite:add; }
  .about-hero__stage::after { display:none; }
  .about-facts__layout { grid-template-columns:.6fr 1fr 1.3fr; }
  .about-facts__layout>div { padding:22px 20px 25px 0; }
  .about-facts__layout>div+div { padding-left:20px; }
  .about-facts dd { font-size:20px; }
  .about-purpose,.about-journey,.about-values { padding-block:60px; }
  .about-section-heading { align-items:start; flex-direction:column; gap:22px; margin-bottom:32px; }
  .about-purpose__flow { grid-template-columns:minmax(0,1fr); gap:52px; }
  .about-mission,.about-vision { grid-template-columns:minmax(0,1fr); gap:27px; }
  .about-mission>h2,.about-vision>h2 { grid-row:auto; }
  .about-mission>.about-link,.about-vision>.about-link { grid-column:auto; }
  .about-mission>p,.about-vision>p { max-width:34ch; font-size:27px; }
  .about-mission>p em,.about-vision>p em { font-size:clamp(54px,9vw,72px); margin-block:23px; }
  .about-mission>p>span:last-child,.about-vision>p>span:last-child { font-size:19px; }
  .about-vision { padding-top:52px; }
  .about-timeline { grid-template-columns:minmax(0,1fr); margin-top:48px; }
  .about-timeline li { grid-template-columns:38px minmax(0,1fr); grid-template-rows:auto 1fr; gap:18px 22px; padding:0 0 48px; }
  .about-timeline time { grid-column:2; padding:0; font-size:34px; }
  .about-timeline__marker { position:absolute; top:0; bottom:0; left:0; width:30px; height:auto; }
  .about-timeline__marker::before { inset:15px auto -15px 7px; width:2px; height:auto; background:linear-gradient(#79abef,#3975c5); }
  .about-timeline__marker::after { top:13px; }
  .about-timeline li:last-child { padding-bottom:0; }
  .about-timeline li:last-child .about-timeline__marker::before { bottom:0; background:none; border-top:0; border-left:2px dashed #6d9cd777; }
  .about-timeline__story { grid-column:2; padding:0; }
  .about-timeline p { max-width:53ch; margin-top:13px; font-size:15px; }
  .about-values__grid { grid-template-columns:minmax(0,1fr); margin-top:32px; }
  .about-values__grid article { display:grid; grid-template-columns:70px 1fr; gap:12px 24px; padding:28px 0; }
  .about-values__grid article+article { padding-left:0; border-left:0; border-top:1px solid #9ab0ca99; }
  .about-value__number { grid-row:1/3; font-size:58px; margin:0; }
  .about-values__grid p { grid-column:2; margin:0; max-width:55ch; }
  .about-invitation { padding:0 0 62px; }
  .about-invitation__layout { grid-template-columns:minmax(0,1fr); gap:30px; padding-top:45px; }
  .about-invitation__actions { justify-content:flex-start; }
}
@media(max-width:480px) {
  .about-hero__layout { padding-top:113px; }
  body[data-layout="about"] .about-hero h1 { font-size:clamp(49px,12.8vw,62px); }
  .about-hero__copy>p { font-size:15px; }
  .about-facts__layout { grid-template-columns:minmax(0,1fr); }
  .about-facts__layout>div,.about-facts__layout>div+div { display:grid; grid-template-columns:.75fr 1.25fr; align-items:center; gap:18px; padding:16px 0; border-left:0; }
  .about-facts__layout>div+div { border-top:1px solid #7295c039; }
  .about-facts dd { font-size:19px; }
  body[data-layout="about"] :is(.about-section-heading,.about-values)>h2 { font-size:38px; }
  body[data-layout="about"] :is(.about-mission,.about-vision)>h2 { font-size:40px; }
  .about-mission>p,.about-vision>p { font-size:23px; }
  .about-mission>p em,.about-vision>p em { font-size:clamp(43px,11.8vw,56px); }
  .about-mission>p>span:last-child,.about-vision>p>span:last-child { font-size:18px; }
  .about-timeline li { grid-template-columns:22px minmax(0,1fr); gap:15px 15px; }
  .about-timeline time { font-size:29px; }
  .about-values__grid article { grid-template-columns:48px 1fr; gap:14px 18px; }
  .about-value__number { font-size:44px; }
  .about-values__grid p { font-size:14px; }
  body[data-layout="about"] .about-values__grid h3 { font-size:27px; }
  body[data-layout="about"] .about-invitation h2 { font-size:40px; }
}
@media(prefers-reduced-motion:reduce) {
  .about-link>span { transition:none; transform:none !important; }
}
@media print {
  .about-skip,.about-link,.about-invitation__actions { display:none; }
  .about-hero__stage { min-height:0; }
  .about-hero__layout { padding-block:35px; }
  .about-hero__copy { width:100%; }
  .about-hero__art,.about-hero__stage::after { display:none; }
  .about-purpose__flow { display:block; }
  .about-mission,.about-vision { margin-bottom:35px; break-inside:avoid; }
  .about-timeline li,.about-values__grid article { break-inside:avoid; }
}
