/* Página Sobre: topo com o time e a história ano a ano. */

/* Topo */
.ag-about-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 40px 64px; align-items: center; padding-block: 12px 24px; }
.ag-about-hero-text { display: flex; flex-direction: column; gap: 18px; }
.ag-about-hero h1 { font-size: clamp(38px, 4.6vw, 64px); line-height: 1.02; letter-spacing: -0.02em; color: var(--ag-indigo); }
.ag-about-hero-lead { font-size: 23px; line-height: 1.45; color: var(--ag-ink); font-weight: 500; }
.ag-about-hero-text p:not(.ag-about-hero-lead) { font-size: 19px; line-height: 1.65; color: var(--ag-text); max-width: 560px; }
.ag-about-hero .ag-actions { margin-top: 6px; }
.ag-about-hero .ag-btn { min-height: 56px; font-size: 18px; padding: 0 28px; }
.ag-about-hero-photo { display: block; width: 100%; height: auto; aspect-ratio: 1100 / 958; object-fit: cover; border-radius: 32px; box-shadow: 0 24px 48px -28px rgba(22, 22, 46, .5); }

/* História */
.ag-story h2 { color: var(--ag-indigo); }
.ag-story-timeline { margin-top: 16px; }
.ag-story-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 88px; }

.ag-story-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.ag-story-photo { grid-column: 1; grid-row: 1; margin: 0; }
.ag-story-body { grid-column: 2; grid-row: 1; }
.ag-story-row.is-flip .ag-story-photo { grid-column: 2; }
.ag-story-row.is-flip .ag-story-body { grid-column: 1; }

.ag-story-photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 28px; box-shadow: 0 18px 40px -24px rgba(22, 22, 46, .45); }
.ag-story-photo figcaption { margin-top: 10px; font-size: 13px; color: var(--ag-muted); }

.ag-story-year { font-family: var(--ag-font-display); font-weight: 500; font-size: clamp(48px, 5vw, 72px); line-height: 1; letter-spacing: -0.02em; color: var(--ag-indigo); }
.ag-story-body h3 { margin-top: 14px; font-size: 26px; line-height: 1.25; color: var(--ag-ink); }
.ag-story-body > p:not(.ag-story-year) { margin-top: 10px; font-size: 19px; line-height: 1.65; color: var(--ag-text); }
.ag-story-body .ag-link { margin-top: 8px; }

/* Cada ano sobe de leve ao aparecer na tela (só quando o script está ativo). */
.ag-story-timeline.is-ready .ag-story-row { transition: opacity .8s ease, transform .8s ease; }
.ag-story-timeline.is-ready .ag-story-row:not(.is-in) { opacity: 0; transform: translateY(40px); }
@media (prefers-reduced-motion: reduce) {
  .ag-story-timeline.is-ready .ag-story-row:not(.is-in) { opacity: 1; transform: none; }
}

@media (max-width: 900px) {
  .ag-about-hero { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .ag-about-hero-lead { font-size: 20px; }
  .ag-about-hero-text p:not(.ag-about-hero-lead) { font-size: 18px; }
  .ag-about-hero .ag-btn { width: 100%; }
  .ag-about-hero-photo { border-radius: 24px; }

  .ag-story-list { gap: 56px; }
  .ag-story-row, .ag-story-row.is-flip { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .ag-story-photo, .ag-story-row.is-flip .ag-story-photo { grid-column: 1; grid-row: 1; }
  .ag-story-body, .ag-story-row.is-flip .ag-story-body { grid-column: 1; grid-row: 2; }
  .ag-story-photo img { border-radius: 22px; }
  .ag-story-year { font-size: 44px; }
  .ag-story-body h3 { margin-top: 10px; font-size: 23px; }
  .ag-story-body > p:not(.ag-story-year) { font-size: 18px; }
}