.about-page { background: var(--color-bg); }
.about-page .site-header { position: sticky; }
.about-hero {
  padding: clamp(4.5rem, 10vw, 7.5rem) 0;
  text-align: center;
  background:
    radial-gradient(circle at 10% 20%, rgba(143, 188, 90, .18), transparent 28%),
    radial-gradient(circle at 90% 80%, rgba(212, 169, 71, .14), transparent 25%),
    linear-gradient(135deg, var(--color-bg) 0%, var(--color-bg-alt) 100%);
  border-bottom: 1px solid var(--color-border);
}
.about-kicker {
  display: inline-block;
  margin-bottom: var(--space-md);
  color: var(--color-primary);
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.about-hero h1 { max-width: 760px; margin: 0 auto var(--space-lg); }
.about-lead { max-width: 720px; margin: 0 auto var(--space-xl); color: var(--color-text-light); font-size: var(--text-xl); }
.about-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-md); }
.about-section { padding: clamp(3.5rem, 8vw, 6rem) 0; }
.about-section-alt { background: var(--color-bg-alt); }
.section-heading { max-width: 760px; margin: 0 auto var(--space-2xl); text-align: center; }
.section-heading > p { color: var(--color-text-light); font-size: var(--text-lg); }
.about-grid { display: grid; gap: var(--space-lg); }
.about-grid-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.about-card, .value-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.about-card { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: var(--space-lg); padding: var(--space-lg); }
.about-card img { width: 100%; max-height: 190px; object-fit: contain; }
.about-card p, .value-card p { color: var(--color-text-light); }
.about-card-wide { grid-column: 1 / -1; grid-template-columns: 1fr; text-align: center; }
.about-grid-values { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.value-card { padding: var(--space-lg); }
.value-card h3 { font-size: var(--text-xl); }
.value-card p:last-child { margin-bottom: 0; }
.about-split { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.audience-list { display: grid; gap: var(--space-md); list-style: none; }
.audience-list li { position: relative; padding: var(--space-md) var(--space-md) var(--space-md) 3rem; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.audience-list li::before { content: "✓"; position: absolute; left: var(--space-md); color: var(--color-primary); font-weight: 800; }
.about-section-story { color: var(--color-white); background: var(--color-primary-dark); }
.about-section-story h2, .about-section-story .about-kicker { color: var(--color-white); }
.about-section-story p { color: rgba(255, 255, 255, .84); }
.process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-lg); list-style: none; counter-reset: none; }
.process-list li { display: flex; gap: var(--space-md); padding: var(--space-lg); background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.process-list li > span { display: grid; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; place-items: center; color: var(--color-white); background: var(--color-primary); border-radius: 50%; font-weight: 800; }
.process-list h3 { font-size: var(--text-lg); }
.process-list p { margin-bottom: 0; color: var(--color-text-light); }
.facts-list { overflow: hidden; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.facts-list > div { display: grid; grid-template-columns: minmax(140px, .7fr) minmax(0, 1.3fr); gap: var(--space-lg); padding: var(--space-md) var(--space-lg); border-bottom: 1px solid var(--color-border); }
.facts-list > div:last-child { border-bottom: 0; }
.facts-list dt { color: var(--color-primary-dark); font-weight: 700; }
.facts-list dd { margin: 0; color: var(--color-text-light); }
.faq-list { display: grid; gap: var(--space-md); }
.faq-list article { padding: var(--space-lg); background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.faq-list h3 { font-size: var(--text-xl); }
.faq-list p:last-child { margin-bottom: 0; }
.about-cta { padding: clamp(3.5rem, 8vw, 6rem) 0; text-align: center; background: var(--color-bg-alt); border-top: 1px solid var(--color-border); }
.about-cta p { max-width: 680px; margin: 0 auto var(--space-xl); color: var(--color-text-light); }

@media (max-width: 980px) {
  .about-grid-values, .process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .about-grid-products, .about-split, .about-grid-values, .process-list { grid-template-columns: 1fr; }
  .about-card { grid-template-columns: 110px minmax(0, 1fr); gap: var(--space-md); }
  .about-card-wide { grid-template-columns: 1fr; }
  .facts-list > div { grid-template-columns: 1fr; gap: var(--space-xs); }
  .about-actions { flex-direction: column; }
  .about-actions .btn { width: 100%; }
}
