﻿/* about */
.page-hero{padding:125px 60px 150px;position:relative;overflow:hidden;background:linear-gradient(180deg,#111 0%,var(--black) 100%)}
.hero-content{position:relative;z-index:2;max-width:680px}

/* WHO WE ARE */
.who-section{display:grid;grid-template-columns:1fr 1fr;gap:0}
.who-visual{position:relative;aspect-ratio:3/2;overflow:hidden;background:#111;min-height:280px}
.who-visual img{width:100%;height:100%;object-fit:cover;display:block}
.who-visual-placeholder{width:100%;height:100%;min-height:480px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#0d1020,#111a00);font-size:120px;opacity:0.06}
.who-content{background:var(--dark);padding:56px 60px;display:flex;flex-direction:column;justify-content:center}
.who-content .section-title{font-size:var(--typ-subheading)}

/* TIMELINE */
.timeline-section{padding:80px 60px;background:var(--black)}
.timeline-header{text-align:center;margin-bottom:60px}
.timeline-header .section-eyebrow{justify-content:center}
.timeline-header .section-eyebrow::before{display:none}
.timeline-header .section-eyebrow::after{content:'';width:28px;height:1px;background:var(--yellow)}
.timeline-title{font-family:var(--font-display);font-size:var(--typ-subheading);font-weight:900;text-transform:uppercase;line-height:0.95}
.timeline-title em{font-style:italic;color:var(--yellow)}
.timeline{position:relative;max-width:860px;margin:0 auto}
.timeline::before{content:'';position:absolute;left:calc(50% - 1px);top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent,rgba(245,195,0,0.35) 0%,rgba(245,195,0,0.35) 80%,transparent)}
.timeline-item{display:grid;grid-template-columns:1fr 120px 1fr;gap:0;margin-bottom:48px;align-items:center}
.timeline-item:last-child{margin-bottom:0}
.timeline-card{background:var(--mid);border:1px solid var(--border);padding:24px 28px;transition:border-color 0.2s}
.timeline-card:hover{border-color:var(--yellow-hover)}
.timeline-center{height:100%;grid-column:2;grid-row:1;display:flex;justify-content:center}
.timeline-item.left .timeline-card{grid-column:1;grid-row:1}
.timeline-item.right .timeline-card{grid-column:3;grid-row:1}

.timeline-dot{width:16px;height:16px;background:var(--yellow);border-radius:50%;flex-shrink:0;position:relative;}
.timeline-dot-inner{
  content:'';
  position:absolute;
  inset:0;
  border-radius:50%;
  background:var(--yellow);
  transform:scale(1);
  opacity:0;
  pointer-events:none;
}
@keyframes timeline-dot-pulse {
  0%{transform:scale(1);opacity:1}
  100%{transform:scale(2);opacity:0}
}

.timeline-year{font-family:var(--font-display);font-size:var(--typ-title);font-weight:700;color:var(--yellow);margin-bottom:15px}
.timeline-event{font-family:var(--font-display);font-size:var(--typ-title);font-weight:900;text-transform:uppercase;margin-bottom:10px;line-height:1.1}
.timeline-desc{font-size:var(--typ-body);font-weight:300;color:var(--text);line-height:1.65}

.reveal{opacity:0;transform:translateY(32px);transition:opacity 0.6s ease,transform 0.6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
@media(max-width:1024px){
  nav{padding:14px 32px}
  .page-hero{padding:100px 32px 48px}
  .who-section{grid-template-columns:1fr}
  .who-content{padding:60px 32px}
  .timeline-section{padding:60px 32px}
  .timeline::before{left:15px}
  .timeline-item{grid-template-columns:32px 1fr;align-items:center}
  .timeline-center{grid-column:1;grid-row:1}
  .timeline-item.left .timeline-card,
  .timeline-item.right .timeline-card{grid-column:2;grid-row:1}
  .finder-strip{padding:40px 32px}
  footer{padding:48px 32px 24px}
  .footer-top{grid-template-columns:1fr 1fr;gap:40px}
}
@media(max-width:768px){
  nav{padding:14px 20px}
  .nav-links{display:none}
  .page-hero{padding:90px 20px 40px}
  .who-content{padding:48px 20px}
  .timeline-section{padding:48px 20px}
  .finder-strip{flex-direction:column;text-align:center;padding:40px 20px}
  footer{padding:40px 20px 24px}
  .footer-top{grid-template-columns:1fr;gap:32px}
  .footer-bottom{flex-direction:column;text-align:center}
}
