.page-about{
  --about-kiwi:#8BC34A;
  --about-kiwi-soft:#AED581;
  --about-yellow:#FFEB3B;
  --about-orange:#FF9800;
  --about-cream:#FFF8E1;
  --about-pale:#F0F4C3;
  --about-deep:#1B5E20;
  --about-ink:#0D3B0F;
  --about-ink-text:#2D2A26;
  --about-white:#FFFFFF;
  --about-shadow-md:8px 8px 0 rgba(45,42,38,.85);
  --about-shadow-sm:4px 4px 0 rgba(45,42,38,.7);
  --about-border-w:3px;
  --about-font-display:Impact,"Arial Black",sans-serif;
  --about-font-body:"Inter",system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  --about-font-mono:"Roboto Mono",SFMono-Regular,Consolas,"Liberation Mono","Courier New",monospace;
  background:var(--about-deep);
  font-family:var(--about-font-body);
  color:var(--about-white);
  line-height:1.6;
  overflow-x:hidden;
}

.page-about .breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  font-size:.875rem;
  margin-bottom:1.25rem;
}

.page-about .crumb{
  color:rgba(255,255,255,.82);
}

.page-about .crumb a{
  color:var(--about-yellow);
  text-decoration:none;
  font-weight:600;
}

.page-about .crumb a:hover{
  text-decoration:underline;
}

.page-about .crumb[aria-current="page"]{
  color:var(--about-kiwi-soft);
}

.page-about .about-hero{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  padding:2.5rem 1.25rem 3rem;
  background:
    linear-gradient(135deg, rgba(13,59,15,.92) 0%, rgba(27,94,32,.96) 60%, rgba(13,59,15,.94) 100%),
    repeating-linear-gradient(45deg, transparent, transparent 12px, rgba(139,195,74,.08) 12px, rgba(139,195,74,.08) 24px);
  position:relative;
}

.page-about .about-hero::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:8px;
  background:linear-gradient(90deg, var(--about-kiwi) 0%, var(--about-yellow) 50%, var(--about-orange) 100%);
  opacity:.9;
}

.page-about .about-hero__text{
  max-width:960px;
  position:relative;
  z-index:2;
}

.page-about .about-hero__kicker{
  font-family:var(--about-font-mono);
  font-size:.875rem;
  letter-spacing:.14em;
  color:var(--about-kiwi-soft);
  text-transform:uppercase;
  margin:0 0 .75rem;
}

.page-about .about-hero__title{
  font-family:var(--about-font-display);
  font-size:clamp(2rem, 5vw, 3.5rem);
  font-weight:900;
  line-height:1.1;
  color:var(--about-cream);
  margin:0 0 1.25rem;
  text-shadow:4px 4px 0 rgba(0,0,0,.35);
  max-width:14em;
}

.page-about .about-hero__lead{
  font-size:clamp(1rem, 1.8vw, 1.25rem);
  color:rgba(255,248,225,.92);
  max-width:42rem;
  margin:0 0 1.75rem;
}

.page-about .about-hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.page-about .about-hero__tag{
  display:inline-block;
  padding:.375rem .875rem;
  border:2px solid var(--about-kiwi);
  border-radius:999px;
  background:rgba(13,59,15,.65);
  color:var(--about-cream);
  font-size:.875rem;
  font-weight:600;
  letter-spacing:.03em;
}

.page-about .about-hero__visual{
  position:relative;
  min-height:220px;
}

.page-about .about-hero__img{
  width:100%;
  height:auto;
  min-height:160px;
  object-fit:cover;
  border:var(--about-border-w) solid var(--about-ink-text);
  box-shadow:var(--about-shadow-md);
  display:block;
}

.page-about .about-hero__stamp{
  position:absolute;
  right:.5rem;
  bottom:1rem;
  width:88px;
  height:88px;
  background:var(--about-cream);
  border:var(--about-border-w) solid var(--about-ink-text);
  box-shadow:var(--about-shadow-sm);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:rotate(9deg);
  animation:about-stamp-drift 6s ease-in-out infinite alternate;
}

@keyframes about-stamp-drift{
  0%{
    transform:rotate(9deg) translateY(0);
  }
  100%{
    transform:rotate(5deg) translateY(-8px);
  }
}

.page-about .section-block{
  padding:3.5rem 1.25rem;
  max-width:1180px;
  margin:0 auto;
}

.page-about .section-head{
  margin-bottom:2.5rem;
  position:relative;
}

.page-about .section-head--row{
  display:grid;
  grid-template-columns:1fr;
  gap:.5rem 2rem;
  align-items:end;
}

.page-about .section-head--row .section-note{
  margin:0;
}

.page-about .section-kicker{
  font-family:var(--about-font-mono);
  font-size:.8125rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--about-orange);
  margin:0 0 .5rem;
  font-weight:700;
}

.page-about .section-title{
  font-family:var(--about-font-display);
  font-size:clamp(1.5rem, 3.5vw, 2.5rem);
  font-weight:800;
  line-height:1.2;
  color:var(--about-cream);
  margin:0 0 .75rem;
}

.page-about .section-note{
  color:rgba(255,248,225,.75);
  font-size:1rem;
  margin:0;
}

.page-about .panel{
  border:var(--about-border-w) solid var(--about-ink-text);
  box-shadow:var(--about-shadow-md);
}

.page-about .panel--pale{
  background:var(--about-cream);
  color:var(--about-ink-text);
}

.page-about .panel--dark{
  background:var(--about-ink);
  color:var(--about-cream);
}

.page-about .exhibit-label{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--about-font-mono);
  font-size:.8125rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:.375rem .875rem;
  border:2px solid currentColor;
  box-shadow:3px 3px 0 rgba(0,0,0,.35);
  margin-bottom:1rem;
}

.page-about .panel--pale .exhibit-label{
  color:var(--about-orange);
}

.page-about .panel--dark .exhibit-label{
  color:var(--about-yellow);
}

.page-about .about-origin{
  background:var(--about-deep);
}

.page-about .about-origin__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.75rem;
}

.page-about .about-origin__panel{
  padding:1.75rem;
  position:relative;
}

.page-about .about-origin__panel--dark{
  background:var(--about-ink);
}

.page-about .about-origin__heading{
  font-family:var(--about-font-display);
  font-size:clamp(1.25rem, 2.2vw, 1.75rem);
  font-weight:700;
  line-height:1.3;
  margin:0 0 1rem;
}

.page-about .about-origin__text{
  margin:0 0 1rem;
  font-size:1rem;
}

.page-about .about-origin__panel--dark .about-origin__text{
  color:rgba(255,248,225,.9);
}

.page-about .about-origin__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.875rem;
}

.page-about .about-origin__item{
  display:flex;
  gap:.75rem;
  align-items:flex-start;
  background:rgba(139,195,74,.12);
  border-left:4px solid var(--about-kiwi);
  padding:.75rem 1rem;
  color:rgba(255,248,225,.94);
  font-size:.9375rem;
}

.page-about .about-origin__item-icon{
  color:var(--about-yellow);
  font-size:.8125rem;
  line-height:1.6;
  flex-shrink:0;
}

.page-about .about-milestones{
  background:var(--about-pale);
  color:var(--about-ink-text);
  max-width:none;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.page-about .about-milestones .section-kicker{
  color:var(--about-orange);
}

.page-about .about-milestones .section-title{
  color:var(--about-deep);
}

.page-about .about-milestones .section-note{
  color:rgba(45,42,38,.7);
}

.page-about .about-milestones__content{
  position:relative;
}

.page-about .about-milestones__img{
  width:100%;
  height:auto;
  object-fit:cover;
  border:var(--about-border-w) solid var(--about-ink-text);
  box-shadow:var(--about-shadow-sm);
  margin-bottom:2rem;
  display:block;
}

.page-about .about-milestones__track{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  position:relative;
}

.page-about .about-milestones__track::before{
  content:"";
  position:absolute;
  left:10px;
  top:8px;
  bottom:8px;
  width:3px;
  background:repeating-linear-gradient(to bottom, var(--about-kiwi) 0 8px, transparent 8px 16px);
}

.page-about .about-milestones__item{
  position:relative;
  padding-left:2rem;
}

.page-about .about-milestones__year{
  font-family:var(--about-font-mono);
  font-weight:700;
  font-size:1.125rem;
  color:var(--about-deep);
  margin-bottom:.5rem;
  display:flex;
  align-items:center;
  gap:.625rem;
}

.page-about .about-milestones__year-dot{
  width:16px;
  height:16px;
  background:var(--about-yellow);
  border:2px solid var(--about-ink-text);
  box-shadow:0 0 0 4px var(--about-kiwi);
  border-radius:50%;
  flex-shrink:0;
}

.page-about .about-milestones__card{
  padding:1.25rem;
  background:var(--about-cream);
  box-shadow:var(--about-shadow-sm);
}

.page-about .about-milestones__card-title{
  font-family:var(--about-font-display);
  font-size:1.125rem;
  font-weight:700;
  margin:0 0 .5rem;
  color:var(--about-deep);
}

.page-about .about-milestones__card-text{
  font-size:.9375rem;
  margin:0;
  color:rgba(45,42,38,.82);
}

.page-about .about-team{
  background:var(--about-deep);
}

.page-about .about-team__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.75rem;
}

.page-about .about-team__card{
  padding:1.75rem;
}

.page-about .about-team__card--wide{
  grid-column:1 / -1;
}

.page-about .about-team__heading{
  font-family:var(--about-font-display);
  font-size:clamp(1.25rem, 2.2vw, 1.625rem);
  font-weight:700;
  margin:0 0 1rem;
}

.page-about .about-team__text{
  margin:0 0 .875rem;
  font-size:1rem;
  color:rgba(255,248,225,.92);
}

.page-about .about-team__stat{
  padding:1.5rem;
  display:grid;
  grid-template-columns:1fr;
  gap:.25rem;
  align-content:start;
}

.page-about .about-team__stat-value{
  font-family:var(--about-font-mono);
  font-size:2.25rem;
  font-weight:700;
  color:var(--about-deep);
  margin:0;
  line-height:1.1;
}

.page-about .about-team__stat-caption{
  font-size:.9375rem;
  color:rgba(45,42,38,.72);
  margin:0 0 1.5rem;
}

.page-about .about-team__stat-caption:last-child{
  margin-bottom:0;
}

.page-about .about-team__principle{
  padding:1.5rem;
}

.page-about .about-team__principle-title{
  font-family:var(--about-font-display);
  font-size:1.25rem;
  font-weight:700;
  margin:0 0 .75rem;
}

.page-about .about-team__principle-text{
  font-size:.9375rem;
  margin:0;
  color:rgba(45,42,38,.8);
}

.page-about .about-tech{
  background:
    linear-gradient(rgba(13,59,15,.94), rgba(13,59,15,.94)),
    repeating-linear-gradient(90deg, transparent, transparent 22px, rgba(139,195,74,.08) 22px, rgba(139,195,74,.08) 44px);
}

.page-about .about-tech__layout{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.page-about .about-tech__visual{
  padding:1.25rem;
}

.page-about .about-tech__img{
  width:100%;
  height:auto;
  object-fit:cover;
  border:2px solid var(--about-kiwi);
  display:block;
}

.page-about .about-tech__visual-caption{
  font-family:var(--about-font-mono);
  font-size:.8125rem;
  color:rgba(255,248,225,.7);
  margin:.75rem 0 0;
  letter-spacing:.04em;
}

.page-about .about-tech__list{
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
}

.page-about .about-tech__item{
  padding:1.5rem;
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:1rem;
  align-items:start;
}

.page-about .about-tech__item-no{
  font-family:var(--about-font-mono);
  font-size:1.5rem;
  font-weight:700;
  color:var(--about-orange);
  line-height:1;
  grid-row:1 / span 2;
  padding-top:.25rem;
}

.page-about .about-tech__item-title{
  font-family:var(--about-font-display);
  font-size:1.25rem;
  font-weight:700;
  margin:0 0 .5rem;
}

.page-about .about-tech__item-text{
  margin:0;
  font-size:.9375rem;
  color:rgba(45,42,38,.8);
}

.page-about .about-honors{
  background:var(--about-cream);
  color:var(--about-ink-text);
  max-width:none;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.page-about .about-honors .section-kicker{
  color:var(--about-orange);
}

.page-about .about-honors .section-title{
  color:var(--about-deep);
}

.page-about .about-honors .section-note{
  color:rgba(45,42,38,.7);
}

.page-about .about-honors__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}

.page-about .about-honors__card{
  padding:1.5rem;
  background:var(--about-pale);
  box-shadow:var(--about-shadow-sm);
  border-width:var(--about-border-w);
  transition:transform .2s ease, box-shadow .2s ease;
}

.page-about .about-honors__card:hover{
  transform:translateY(-4px);
  box-shadow:6px 10px 0 rgba(45,42,38,.8);
}

.page-about .about-honors__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  font-size:1.375rem;
  border:2px solid var(--about-ink-text);
  border-radius:50%;
  margin-bottom:1rem;
  background:var(--about-yellow);
  box-shadow:3px 3px 0 rgba(45,42,38,.6);
}

.page-about .about-honors__card--award .about-honors__icon{
  background:var(--about-orange);
  color:var(--about-cream);
}

.page-about .about-honors__card--cert .about-honors__icon{
  background:var(--about-kiwi);
}

.page-about .about-honors__card--partner .about-honors__icon{
  background:var(--about-yellow);
}

.page-about .about-honors__title{
  font-family:var(--about-font-display);
  font-size:1.1875rem;
  font-weight:700;
  margin:0 0 .625rem;
  line-height:1.25;
}

.page-about .about-honors__desc{
  font-size:.9375rem;
  margin:0;
  color:rgba(45,42,38,.75);
}

.page-about .about-vision{
  background:
    linear-gradient(160deg, var(--about-ink-green) 0%, var(--about-deep) 45%, var(--about-ink-green) 100%);
  max-width:none;
  padding-left:1.25rem;
  padding-right:1.25rem;
}

.page-about .about-vision__inner{
  max-width:960px;
  margin:0 auto;
  padding:2rem 0;
}

.page-about .about-vision .section-kicker{
  color:var(--about-kiwi-soft);
}

.page-about .about-vision__title{
  font-family:var(--about-font-display);
  font-size:clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight:900;
  line-height:1.15;
  color:var(--about-cream);
  margin:0 0 1.5rem;
  max-width:16em;
}

.page-about .about-vision__text{
  font-size:1.0625rem;
  color:rgba(255,248,225,.9);
  max-width:44rem;
  margin:0 0 1.25rem;
}

.page-about .about-vision__links{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin:2rem 0 1.5rem;
}

.page-about .btn{
  display:inline-block;
  padding:.75rem 1.5rem;
  font-family:var(--about-font-body);
  font-size:1rem;
  font-weight:700;
  text-decoration:none;
  border:3px solid var(--about-ink-text);
  box-shadow:5px 5px 0 rgba(0,0,0,.5);
  transition:transform .15s ease, box-shadow .15s ease;
  cursor:pointer;
}

.page-about .btn:hover{
  transform:translateY(-3px);
  box-shadow:8px 8px 0 rgba(0,0,0,.5);
}

.page-about .btn--primary{
  background:var(--about-kiwi);
  color:var(--about-ink-text);
}

.page-about .btn--outline{
  background:transparent;
  color:var(--about-cream);
  border-color:var(--about-cream);
  box-shadow:5px 5px 0 rgba(255,248,225,.35);
}

.page-about .btn--orange{
  background:var(--about-orange);
  color:var(--about-ink-text);
}

.page-about .about-vision__backlink a{
  color:var(--about-kiwi-soft);
  text-decoration:none;
  font-weight:600;
  border-bottom:2px solid var(--about-kiwi-soft);
  padding-bottom:2px;
}

.page-about .about-vision__backlink a:hover{
  color:var(--about-yellow);
  border-color:var(--about-yellow);
}

.page-about .slash-band{
  height:24px;
  background:repeating-linear-gradient(115deg, var(--about-kiwi), var(--about-kiwi) 22px, var(--about-yellow) 22px, var(--about-yellow) 44px);
  border-top:var(--about-border-w) solid var(--about-ink-text);
  border-bottom:var(--about-border-w) solid var(--about-ink-text);
}

.page-about .slash-band--reverse{
  background:repeating-linear-gradient(115deg, var(--about-yellow), var(--about-yellow) 22px, var(--about-kiwi) 22px, var(--about-kiwi) 44px);
  transform:scaleX(-1);
}

@media (min-width: 720px) {
  .page-about .about-hero{
    grid-template-columns:1.1fr .9fr;
    align-items:center;
    padding:4rem 2.5rem 4.5rem;
  }

  .page-about .about-hero__stamp{
    width:110px;
    height:110px;
    right:1rem;
    bottom:1rem;
  }

  .page-about .about-hero__meta{
    flex-direction:row;
  }

  .page-about .section-block{
    padding:4.5rem 2.5rem;
  }

  .page-about .section-head--row{
    grid-template-columns:1fr auto;
  }

  .page-about .section-note{
    max-width:28rem;
    text-align:right;
  }

  .page-about .about-origin__grid{
    grid-template-columns:1.1fr .9fr;
  }

  .page-about .about-milestones{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }

  .page-about .about-milestones__track{
    grid-template-columns:1fr 1fr;
    column-gap:3rem;
  }

  .page-about .about-milestones__track::before{
    left:auto;
    right:50%;
    transform:translateX(50%);
    background:repeating-linear-gradient(to bottom, var(--about-kiwi) 0 8px, transparent 8px 16px);
  }

  .page-about .about-milestones__item{
    padding-left:0;
  }

  .page-about .about-milestones__item--left{
    padding-right:3rem;
    text-align:right;
  }

  .page-about .about-milestones__item--left .about-milestones__year{
    justify-content:flex-end;
  }

  .page-about .about-milestones__item--right{
    padding-left:3rem;
  }

  .page-about .about-milestones__year-dot{
    position:absolute;
    top:2px;
    background:var(--about-kiwi);
  }

  .page-about .about-milestones__item--left .about-milestones__year-dot{
    right:-1.5rem;
  }

  .page-about .about-milestones__item--right .about-milestones__year-dot{
    left:-1.5rem;
  }

  .page-about .about-milestones__card{
    transition:transform .2s ease, box-shadow .2s ease;
  }

  .page-about .about-milestones__card:hover{
    transform:translateY(-4px);
    box-shadow:var(--about-shadow-md);
  }

  .page-about .about-team__grid{
    grid-template-columns:1fr 1fr;
  }

  .page-about .about-team__card--wide{
    grid-column:1 / -1;
  }

  .page-about .about-team__card--wide{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 2rem;
  }

  .page-about .about-team__card--wide .exhibit-label{
    grid-column:1 / -1;
  }

  .page-about .about-team__card--wide .about-team__heading{
    grid-column:1 / -1;
  }

  .page-about .about-tech__layout{
    grid-template-columns:1fr;
  }

  .page-about .about-tech__visual{
    display:grid;
    grid-template-columns:1fr auto;
    gap:0 1.5rem;
    align-items:center;
  }

  .page-about .about-tech__img{
    grid-column:1 / -1;
  }

  .page-about .about-tech__visual-caption{
    grid-column:1 / -1;
  }

  .page-about .about-tech__list{
    grid-template-columns:1fr 1fr;
  }

  .page-about .about-honors{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }

  .page-about .about-honors__grid{
    grid-template-columns:1fr 1fr;
  }

  .page-about .about-vision{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
}

@media (min-width: 1024px) {
  .page-about .about-hero{
    grid-template-columns:1.1fr .9fr;
    padding:5rem 4rem 5.5rem;
    max-width:1400px;
    margin:0 auto;
  }

  .page-about .about-hero__title{
    font-size:clamp(2.5rem, 4.5vw, 3.75rem);
  }

  .page-about .about-hero__lead{
    font-size:1.25rem;
  }

  .page-about .section-block{
    padding:5.5rem 4rem;
  }

  .page-about .about-milestones{
    padding-left:4rem;
    padding-right:4rem;
  }

  .page-about .about-milestones__track{
    column-gap:4rem;
  }

  .page-about .about-milestones__item--left{
    padding-right:4rem;
  }

  .page-about .about-milestones__item--right{
    padding-left:4rem;
  }

  .page-about .about-milestones__year-dot{
    width:18px;
    height:18px;
  }

  .page-about .about-milestones__item--left .about-milestones__year-dot{
    right:-2rem;
  }

  .page-about .about-milestones__item--right .about-milestones__year-dot{
    left:-2rem;
  }

  .page-about .about-tech__layout{
    grid-template-columns:.9fr 1.1fr;
    gap:2.5rem;
    align-items:start;
  }

  .page-about .about-tech__visual{
    position:sticky;
    top:2rem;
  }

  .page-about .about-honors{
    padding-left:4rem;
    padding-right:4rem;
  }

  .page-about .about-honors__grid{
    grid-template-columns:1fr 1fr;
    gap:2rem;
  }

  .page-about .about-honors__card{
    padding:1.75rem;
  }

  .page-about .about-vision{
    padding-left:4rem;
    padding-right:4rem;
  }
}

.page-about .about-hero,
.page-about .section-block,
.page-about .about-milestones,
.page-about .about-honors,
.page-about .about-team,
.page-about .about-tech,
.page-about .about-vision{
  scroll-margin-top:2rem;
}

.page-about a:focus-visible,
.page-about .btn:focus-visible{
  outline:4px solid var(--about-yellow);
  outline-offset:3px;
}

.page-about .visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0;
}

@media (prefers-reduced-motion: reduce) {
  .page-about .about-hero__stamp{
    animation:none;
  }

  .page-about .about-honors__card:hover{
    transform:none;
    box-shadow:var(--about-shadow-sm);
  }

  .page-about .about-milestones__card:hover{
    transform:none;
    box-shadow:var(--about-shadow-sm);
  }
}

.page-about {
  --about-ink-green: transparent;
}