/* About page specific styles for HetBesteHier */

/* Hero */
.about-hero { padding-block: var(--space-14) var(--space-12); background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); }
.about-hero__inner { display: grid; gap: var(--space-8); align-items: center; grid-template-columns: 1.1fr 1fr; }
.about-hero__content .lead { color: var(--color-text-muted); margin-top: var(--space-3); }
.about-hero__actions { display: flex; gap: var(--space-3); margin-top: var(--space-6); flex-wrap: wrap; }
.about-hero__media img { border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }

@media (max-width: 960px) {
  .about-hero__inner { grid-template-columns: 1fr; }
}

/* Generic section */
.section { padding-block: var(--space-12); }
.section__header { margin-bottom: var(--space-6); }
.section__intro { color: var(--color-text-muted); margin-top: var(--space-2); }

/* Timeline */
.timeline { display: grid; gap: var(--space-5); position: relative; }
.timeline__item { display: grid; grid-template-columns: 100px 1fr; gap: var(--space-4); padding: var(--space-4); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); background: var(--color-elevated); }
.timeline__year { font-family: var(--font-serif); font-weight: var(--font-weight-semibold); color: var(--color-primary); }
.timeline__content h3 { margin: 0 0 var(--space-2) 0; font-size: var(--fs-lg); }

@media (max-width: 640px) {
  .timeline__item { grid-template-columns: 1fr; }
}

/* Vision grid */
.vision-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-6); }

/* Team */
.team-grid .card .card__body p { color: var(--color-text-muted); }

/* Culture */
.section--culture .culture__grid { display: grid; gap: var(--space-8); grid-template-columns: 1.1fr 1fr; align-items: center; }
.values { display: grid; gap: var(--space-3); margin-top: var(--space-3); }
.culture__ctas { display: flex; gap: var(--space-3); margin-top: var(--space-5); flex-wrap: wrap; }
.culture__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

@media (max-width: 960px) {
  .section--culture .culture__grid { grid-template-columns: 1fr; }
}

/* Testimonials */
.testimonials-grid blockquote p { color: var(--color-text); font-style: italic; }
.testimonials-grid blockquote footer { margin-top: var(--space-3); color: var(--color-text-muted); }

/* Awards */
.awards { display: grid; gap: var(--space-3); }
.awards li { padding: var(--space-3) var(--space-4); background: var(--color-elevated); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-md); }

/* Sustainability */
.section--sustainability .sustainability__grid { display: grid; gap: var(--space-8); grid-template-columns: 1.1fr 1fr; align-items: center; }
.sust__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

@media (max-width: 960px) {
  .section--sustainability .sustainability__grid { grid-template-columns: 1fr; }
}

/* Contact */
.section--contact .contact-card { display: grid; gap: var(--space-4); }
.section--contact .contact-details { display: grid; gap: var(--space-2); color: var(--color-text-muted); }
.section--contact .contact-ctas { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-2); }

/* Reveal on scroll */
[data-reveal] { opacity: 0; transform: translateY(12px); transition: opacity var(--duration-slow) var(--easing-standard), transform var(--duration-slow) var(--easing-standard); }
[data-reveal].is-visible { opacity: 1; transform: none; }
.timeline__item { opacity: 0; transform: translateY(10px); transition: opacity var(--duration-slow) var(--easing-standard), transform var(--duration-slow) var(--easing-standard); }
.timeline__item.is-visible { opacity: 1; transform: none; }