/* About page refinements */

.about-hero .section-hero{
  display:grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 0.9fr);
  gap: clamp(1.2rem, 3vw, 2rem);
  align-items:center;
}
.about-hero .hero-main{ display:grid; gap:.6rem; }
.about-hero .hero-panel{ justify-self: stretch; }

@media (max-width: 880px){
  .about-hero .section-hero{ grid-template-columns: 1fr; }
  .about-hero .hero-panel{ order:-1; }
}

.about-band h3{ margin:.1rem 0 .3rem; }
.about-band .muted{ color: var(--muted); }
.about-band .card{ background: color-mix(in srgb, var(--card), var(--surface) 45%); }
.about-values .card{ border:1px solid color-mix(in srgb, var(--accent), var(--border) 55%); }
.about-values .card:hover{ transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent), var(--border) 40%); }
.about-team .card{ border:1px solid var(--border); box-shadow: var(--shadow-1); }
.about-team .role{ font-weight:700; margin:0 0 .4rem; }

.timeline-band .timeline-grid{
  display:grid; gap:1rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.timeline-card{
  display:grid; grid-template-columns: 90px 1fr; gap:.8rem;
  align-items:start;
}
.timeline-year{
  font-weight:900; font-size: var(--step-2);
  color: var(--accent); letter-spacing:.04em;
}
.timeline-card h3{ margin:0 0 .2rem; }
.timeline-card p{ margin:0; color: var(--muted); }

@media (max-width: 720px){
  .timeline-card{ grid-template-columns:1fr; }
  .timeline-year{ font-size: var(--step-1); }
}