/* Bespoke About page styling */

.page-about .about-hero {
  position: relative;
  min-height: 90vh;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-16);
  align-items: center;
  padding: 12vh 5vw 6vh;
}

.about-hero-inner { max-width: 880px; }
.about-hero-title { letter-spacing: -0.03em; }
.about-hero-sub { margin-top: var(--space-4); color: rgba(245,240,232,.85); }

.hero-art {
  align-self: center;
  justify-self: end;
  width: 100%;
  max-width: 600px;
  filter: drop-shadow(0 30px 50px rgba(0,0,0,.35));
}
.hero-art img { width: 100%; border-radius: 12px; opacity: .95; }
.hero-art img.hero-abstract { animation: slowRotate 60s linear infinite; transform-origin: 50% 50%; }
@keyframes slowRotate { to { transform: rotate(360deg); } }

.founders-section .container { max-width: 1200px; margin: 0 auto; padding: var(--space-20) var(--space-6); }
.founders-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--space-8); }
.founder-card {
  background: linear-gradient(135deg, rgba(240,231,216,.08), rgba(240,231,216,.03));
  border: 1px solid rgba(240,231,216,.18);
  border-radius: var(--space-4);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  padding: var(--space-10);
}
.founder-meta { margin-bottom: var(--space-4); }
.founder-name { font-family: var(--font-display); font-size: var(--text-3xl); font-weight: 300; letter-spacing: -0.02em; color: var(--accent); }
.founder-role { color: var(--text-tertiary); text-transform: uppercase; letter-spacing: .08em; font-size: var(--text-sm); }
.founder-bio { color: rgba(245,240,232,.9); }
.founder-links a { color: var(--digital); text-decoration: none; font-weight: 600; }

.principles-section .container { max-width: 1200px; margin: 0 auto; padding: var(--space-24) var(--space-6); }
.principles-title { text-align: center; margin-bottom: var(--space-12); }
.principles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-8); }
.principle-card {
  background: rgba(240,231,216,.05);
  border: 1px solid rgba(240,231,216,.14);
  border-radius: var(--space-3);
  padding: var(--space-8);
}
.principle-card h3 { color: var(--accent); margin-bottom: var(--space-2); }
.principle-card p { color: var(--text-secondary); }

.timeline-section .container { max-width: 1100px; margin: 0 auto; padding: var(--space-24) var(--space-6); }
.timeline-title { text-align: center; margin-bottom: var(--space-12); }
.timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-8); counter-reset: step; }
.timeline li { list-style: none; background: rgba(240,231,216,.05); border: 1px solid rgba(240,231,216,.12); border-radius: var(--space-3); padding: var(--space-8); }
.timeline .t-badge { display: inline-block; padding: 4px 10px; border: 1px solid rgba(240,231,216,.25); border-radius: 999px; color: var(--text-tertiary); font-size: var(--text-sm); letter-spacing: .08em; margin-bottom: var(--space-3); }
.timeline h4 { color: var(--accent); margin-bottom: var(--space-2); }
.timeline p { color: var(--text-secondary); }

@media (max-width: 980px) {
  .page-about .about-hero { grid-template-columns: 1fr; }
  .hero-art { justify-self: start; max-width: 520px; }
}
