.page-about{
  --about-margin:20px;
  --about-track-left:14px;
  background:var(--color-cream);
  color:var(--color-primary);
  overflow-x:hidden;
}
.page-about .breadcrumb{
  max-width:1240px;
  margin:0 auto;
  padding:22px var(--about-margin) 0;
  font-size:13px;
  letter-spacing:.04em;
  color:var(--color-grey);
}
.page-about .breadcrumb a{
  color:var(--color-grey);
  text-decoration:none;
  transition:color var(--transition);
}
.page-about .breadcrumb a:hover{color:var(--color-accent)}
.page-about .breadcrumb__sep{margin:0 10px;color:var(--color-grey)}

.page-about__section-head{
  max-width:780px;
  margin-bottom:42px;
}
.page-about__section-head .eyebrow{
  display:inline-block;
  padding:6px 14px;
  border:1px solid rgba(198,249,31,.55);
  background:rgba(198,249,31,.18);
  border-radius:999px;
  color:var(--color-primary);
  font-family:var(--font-data);
  font-size:12px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.page-about__section-head h2{
  margin:14px 0 10px;
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(27px,4vw,40px);
  line-height:1.2;
  letter-spacing:.01em;
  color:var(--color-primary);
}
.page-about__section-desc{
  margin:0;
  color:var(--color-grey);
  font-size:16px;
  line-height:1.8;
}

.page-about__hero{
  position:relative;
  overflow:hidden;
  margin:26px var(--about-margin) 0;
  padding:52px 20px 56px;
  background:
    radial-gradient(circle at 80% 8%,rgba(198,249,31,.14),transparent 34%),
    radial-gradient(circle at 10% 95%,rgba(255,107,0,.20),transparent 30%),
    linear-gradient(140deg,var(--color-primary) 0%,#131f45 52%,var(--color-primary) 100%);
  color:var(--color-cream);
  box-shadow:var(--shadow-pill);
  border-radius:calc(var(--radius-lg) + 4px);
}
.page-about__hero-ring{
  position:absolute;
  top:14px;
  right:-120px;
  width:480px;
  height:200px;
  opacity:.7;
  pointer-events:none;
  z-index:0;
}
.page-about__hero-inner{
  position:relative;
  z-index:1;
  display:grid;
  gap:34px;
}
.page-about__hero-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 16px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(198,249,31,.4);
  border-radius:999px;
  color:var(--color-accent);
  font-family:var(--font-data);
  font-size:12px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.page-about__hero h1{
  margin:24px 0 18px;
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(32px,6vw,54px);
  line-height:1.14;
  letter-spacing:.01em;
  text-wrap:balance;
}
.page-about__hero-copy p{
  margin:0 0 16px;
  color:rgba(244,241,234,.78);
  font-size:16px;
  line-height:1.85;
  max-width:62ch;
}
.page-about__hero-copy .text-lead{
  color:var(--color-accent);
  font-family:var(--font-data);
  font-size:18px;
  letter-spacing:.02em;
  line-height:1.6;
}
.page-about__mission{
  display:flex;
  align-items:center;
  gap:16px;
  margin:26px 0;
  padding:16px 20px;
  border-radius:18px;
  background:rgba(198,249,31,.12);
  border:1px solid rgba(198,249,31,.3);
}
.page-about__mission-glyph{
  font-size:30px;
  line-height:1;
  color:var(--color-hot);
}
.page-about__mission-text{
  display:grid;
  gap:4px;
}
.page-about__mission-text strong{
  font-family:var(--font-head);
  font-size:19px;
  letter-spacing:.05em;
  color:#fff;
}
.page-about__mission-text span{
  color:rgba(244,241,234,.72);
  font-size:13px;
  line-height:1.6;
}
.page-about__hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:26px;
}
.page-about__hero-figure{
  position:relative;
  margin:0;
  padding:10px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius-lg);
}
.page-about__hero-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:calc(var(--radius-lg) - 4px);
  object-fit:cover;
}
.page-about__hero-figure figcaption{
  padding:12px 4px 4px;
  color:rgba(244,241,234,.6);
  font-family:var(--font-data);
  font-size:12px;
  line-height:1.6;
  text-align:center;
}

.page-about__milestones{
  padding:66px 0 76px;
}
.page-about__milestones-inner,
.page-about__stats-inner,
.page-about__credential-inner{
  width:min(1240px,100% - 40px);
  margin-inline:auto;
}
.page-about__timeline{
  position:relative;
  list-style:none;
  max-width:980px;
  margin:0 auto;
  padding:12px 0 36px;
}
.page-about__timeline::before{
  content:'';
  position:absolute;
  left:var(--about-track-left);
  top:28px;
  bottom:30px;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--color-accent) 0%,var(--color-primary) 58%,var(--color-hot) 100%);
  transform:skewX(-9deg);
  opacity:.8;
}
.page-about__timeline-item{
  position:relative;
  margin:0 0 40px;
  padding:0 18px 0 48px;
}
.page-about__timeline-item:last-child{margin-bottom:0}
.page-about__timeline-item::before{
  content:'';
  position:absolute;
  top:30px;
  left:7px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--color-accent);
  border:4px solid var(--color-primary);
  box-shadow:0 0 0 5px rgba(198,249,31,.16);
  z-index:2;
}
.page-about__timeline-item::after{
  content:'';
  position:absolute;
  top:47px;
  left:25px;
  width:23px;
  height:2px;
  background:var(--color-primary);
  opacity:.72;
}
.page-about__timeline-card{
  position:relative;
  padding:22px 24px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(10,17,40,.08);
  border-left:4px solid var(--color-accent);
  border-radius:16px;
  box-shadow:var(--shadow-card);
  transition:transform var(--transition),box-shadow var(--transition);
}
.page-about__timeline-card:hover{
  transform:translateY(-4px) rotate(-.4deg);
  box-shadow:0 14px 28px rgba(10,17,40,.12);
}
.page-about__timeline-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}
.page-about__timeline-year{
  padding:4px 12px;
  background:var(--color-cream);
  border:1px solid var(--color-sand);
  border-radius:999px;
  font-family:var(--font-data);
  font-weight:700;
  font-size:13px;
  letter-spacing:.06em;
  color:var(--color-primary);
}
.page-about__timeline-card h3{
  margin:0 0 10px;
  color:var(--color-primary);
  font-family:var(--font-head);
  font-size:19px;
  font-weight:800;
  letter-spacing:.01em;
}
.page-about__timeline-card p{
  margin:0;
  color:var(--color-grey);
  font-size:15px;
  line-height:1.8;
}

.page-about__stats{
  position:relative;
  padding:84px 0 64px;
  background:var(--color-primary);
  clip-path:polygon(0 2.8%,100% 0,100% 100%,0 100%);
  color:var(--color-cream);
}
.page-about__stats .page-about__section-head .eyebrow{
  background:rgba(198,249,31,.14);
  border-color:rgba(198,249,31,.4);
  color:var(--color-accent);
}
.page-about__stats .page-about__section-head h2{color:var(--color-cream)}
.page-about__stats .page-about__section-desc{color:rgba(244,241,234,.7)}
.page-about__stats-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:0 auto 42px;
}
.page-about__stat{
  position:relative;
  overflow:hidden;
  padding:24px 18px 20px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  text-align:center;
  transition:transform var(--transition),border-color var(--transition);
}
.page-about__stat::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:linear-gradient(90deg,var(--color-accent),var(--color-hot));
  opacity:.85;
}
.page-about__stat:hover{
  transform:translateY(-3px);
  border-color:rgba(198,249,31,.3);
}
.page-about__stat-value{
  display:block;
  font-family:var(--font-data);
  font-weight:800;
  font-size:clamp(28px,4vw,44px);
  letter-spacing:-.02em;
  color:var(--color-accent);
  line-height:1.1;
}
.page-about__stat-unit{
  margin-left:3px;
  color:var(--color-hot);
  font-size:16px;
  font-weight:700;
}
.page-about__stat-label{
  display:block;
  margin-top:8px;
  font-size:14px;
  font-weight:600;
  color:rgba(244,241,234,.85);
}
.page-about__stat-detail{
  display:block;
  margin-top:10px;
  padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.14);
  color:rgba(244,241,234,.56);
  font-size:12px;
  line-height:1.6;
}
.page-about__stats-figure{
  margin:0 auto 16px;
  max-width:760px;
}
.page-about__stats-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,.12);
}
.page-about__stats-caption{
  padding:12px 0 0;
  color:rgba(244,241,234,.6);
  font-family:var(--font-data);
  font-size:12px;
  text-align:center;
}
.page-about__stats-note{
  max-width:980px;
  margin:22px 0 0;
  padding:20px 22px 22px;
  border-left:3px solid var(--color-accent);
  border-radius:0 16px 16px 0;
  background:rgba(255,255,255,.04);
  color:rgba(244,241,234,.72);
  font-size:15px;
  line-height:1.9;
}

.page-about__tech{
  position:relative;
  padding:74px 0 72px;
  background:linear-gradient(180deg,rgba(107,114,128,.10) 0,transparent 24%),var(--color-cream);
}
.page-about__tech-inner{
  display:grid;
  gap:40px;
  width:min(1240px,100% - 40px);
  margin-inline:auto;
  align-items:center;
}
.page-about__tech-copy .page-about__section-head{margin-bottom:24px}
.page-about__tech-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:16px;
}
.page-about__tech-item{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:16px;
  padding:20px;
  border:1px solid rgba(10,17,40,.07);
  border-radius:18px;
  background:rgba(255,255,255,.62);
  box-shadow:var(--shadow-card);
}
.page-about__tech-index{
  font-family:var(--font-head);
  font-weight:900;
  font-size:24px;
  line-height:1;
  color:var(--color-hot);
}
.page-about__tech-item h3{
  margin:0 0 8px;
  font-family:var(--font-head);
  font-size:17px;
  font-weight:800;
  color:var(--color-primary);
}
.page-about__tech-item p{
  margin:0;
  font-size:14px;
  line-height:1.8;
  color:var(--color-grey);
}
.page-about__tech-figure{
  margin:0;
  padding:10px;
  border-radius:var(--radius-lg);
  background:var(--color-primary);
  box-shadow:var(--shadow-pill);
}
.page-about__tech-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:calc(var(--radius-lg) - 6px);
}
.page-about__tech-caption{
  padding:10px 4px 0;
  font-family:var(--font-data);
  font-size:12px;
  color:rgba(244,241,234,.72);
  text-align:center;
}

.page-about__credential{
  padding:76px 0 72px;
  background:linear-gradient(180deg,transparent,rgba(224,214,198,.34));
}
.page-about__credential-grid{
  display:grid;
  gap:18px;
  margin:0 0 42px;
}
.page-about__credential-card{
  padding:24px 22px;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(10,17,40,.06);
  border-bottom:3px solid var(--color-terra);
  border-radius:18px;
  box-shadow:var(--shadow-card);
}
.page-about__credential-num{
  display:block;
  font-family:var(--font-data);
  font-weight:800;
  font-size:40px;
  line-height:1;
  color:var(--color-primary);
}
.page-about__credential-card h3{
  margin:14px 0 8px;
  font-family:var(--font-head);
  font-size:16px;
  font-weight:800;
  color:var(--color-primary);
}
.page-about__credential-card p{
  margin:0;
  font-size:14px;
  line-height:1.8;
  color:var(--color-grey);
}
.page-about__awards{
  padding:28px 22px;
  background:rgba(10,17,40,.92);
  border-radius:22px;
  color:var(--color-cream);
}
.page-about__awards h3{
  margin:0 0 16px;
  font-family:var(--font-head);
  font-size:18px;
  font-weight:800;
}
.page-about__awards-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about__awards-list li{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  font-size:14px;
  color:rgba(244,241,234,.88);
}
.page-about__awards-tag{
  flex:0 0 auto;
  padding:4px 10px;
  border-radius:999px;
  background:var(--color-accent);
  color:var(--color-primary);
  font-family:var(--font-data);
  font-weight:700;
  font-size:12px;
}
.page-about__awards-note{
  margin:18px 0 0;
  color:rgba(244,241,234,.64);
  font-size:13px;
  line-height:1.8;
}

.page-about__cta{
  padding:96px 20px 100px;
  background:var(--color-primary);
  clip-path:polygon(0 0,100% 4%,100% 100%,0 100%);
  color:var(--color-cream);
}
.page-about__cta-inner{
  max-width:760px;
  margin:0 auto;
  text-align:center;
}
.page-about__cta .eyebrow{
  display:inline-block;
  padding:6px 14px;
  border:1px solid rgba(198,249,31,.4);
  border-radius:999px;
  background:rgba(198,249,31,.1);
  color:var(--color-accent);
  font-family:var(--font-data);
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.page-about__cta h2{
  margin:18px 0 12px;
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(30px,5vw,46px);
  letter-spacing:.01em;
}
.page-about__cta p{
  margin:0 0 30px;
  color:rgba(244,241,234,.76);
  line-height:1.8;
}
.page-about__cta-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
}

@media (min-width:768px){
  .page-about{
    --about-margin:32px;
  }
  .page-about .breadcrumb{
    padding-top:28px;
  }
  .page-about__hero{
    padding:72px 48px;
    border-radius:calc(var(--radius-lg) + 10px);
  }
  .page-about__hero-inner{
    grid-template-columns:1.05fr .95fr;
    gap:56px;
    align-items:center;
  }
  .page-about__hero-ring{
    right:-60px;
  }
  .page-about__milestones{
    padding-bottom:96px;
  }
  .page-about__timeline{
    padding-top:24px;
  }
  .page-about__timeline::before{
    left:50%;
    top:24px;
    bottom:34px;
    width:5px;
    transform:translateX(-50%) rotate(3deg);
    opacity:1;
  }
  .page-about__timeline-item{
    width:calc(50% - 72px);
    margin:0 0 36px;
    padding:0;
  }
  .page-about__timeline-item:nth-child(odd){
    margin-right:auto;
  }
  .page-about__timeline-item:nth-child(even){
    margin-left:auto;
    margin-top:96px;
  }
  .page-about__timeline-item::before{
    top:34px;
    left:auto;
    width:20px;
    height:20px;
    border-width:5px;
  }
  .page-about__timeline-item:nth-child(odd)::before{right:-82px}
  .page-about__timeline-item:nth-child(even)::before{left:-82px}
  .page-about__timeline-item::after{
    top:51px;
    left:auto;
    width:38px;
    height:3px;
  }
  .page-about__timeline-item:nth-child(odd)::after{right:-62px}
  .page-about__timeline-item:nth-child(even)::after{left:-62px}
  .page-about__stats-grid{
    grid-template-columns:repeat(3,1fr);
    gap:18px;
  }
  .page-about__stats-note{
    margin-top:30px;
    padding:24px 28px;
    font-size:16px;
  }
  .page-about__tech-inner{
    grid-template-columns:1.08fr .92fr;
    gap:56px;
  }
  .page-about__tech-item{
    padding:22px;
  }
  .page-about__credential-grid{
    grid-template-columns:repeat(3,1fr);
    gap:22px;
  }
  .page-about__awards{
    padding:32px;
  }
  .page-about__awards-list{
    grid-template-columns:repeat(2,1fr);
    gap:14px;
  }
  .page-about__cta{
    padding:110px 20px 120px;
  }
}