/* About-page layout only; shared navigation and site styles stay independent. */
.about-page {
  --about-ink: var(--color-text, #1a1f2e);
  --about-muted: var(--color-text-muted, #374151);
  --about-gold: #79591e;
  --about-line: #e5dccb;
  min-width: 0;
}

.about-page > :is(.about-overview, .about-capabilities, .about-advantages, .about-editorial) {
  padding-block: 4rem;
}

.about-page :is(.about-intro, .about-section-heading, .about-editorial-body) {
  max-width: 52rem;
  margin-inline: 0;
  text-align: left;
}

.about-page .about-intro {
  margin-bottom: 2rem;
}

.about-page .about-intro h1 {
  margin: 0 0 1.25rem;
  color: var(--about-ink);
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  line-height: 1.2;
  letter-spacing: -.025em;
  text-wrap: balance;
}

.about-page .about-intro :is(.gold-line, .gold-line-center) {
  width: 4rem;
  margin: 0 0 1.5rem;
  background: linear-gradient(90deg, var(--color-gold, #a07d3a), transparent);
}

.about-page .about-intro > p {
  margin: 0;
  color: var(--about-muted);
  font-size: 1.125rem;
  line-height: 1.8;
}

.about-page .about-company-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 1.5rem;
}

.about-page .about-panel {
  min-width: 0;
  margin: 0;
  padding: 1.75rem;
  border: 1px solid var(--about-line);
  border-radius: 1rem;
  background: #faf8f3;
  text-align: left;
}

.about-page .about-panel h2 {
  margin: 0 0 1rem;
  color: var(--about-ink);
  font-size: 1.375rem;
  line-height: 1.35;
  font-weight: 600;
  text-wrap: pretty;
}

.about-page .about-panel p {
  margin: 0 0 1rem;
  color: var(--about-muted);
  font-size: 1rem;
  line-height: 1.75;
  overflow-wrap: break-word;
}

.about-page .about-panel p:last-child {
  margin-bottom: 0;
}

.about-page .about-panel details {
  margin: 1.25rem 0 0;
  padding: 1rem 1.125rem;
  border: 1px solid var(--about-line);
  border-radius: .75rem;
  background: #fff;
}

.about-page .about-panel summary {
  color: var(--about-ink);
  font-size: 1rem;
  line-height: 1.6;
  cursor: pointer;
}

.about-page .about-panel summary::marker {
  color: var(--about-gold);
}

.about-page .about-panel details ul {
  margin: 1rem 0;
  padding-left: 1.25rem;
  list-style: disc;
  color: var(--about-muted);
  font-size: .9375rem;
  line-height: 1.7;
}

.about-page .about-panel details li + li {
  margin-top: .625rem;
}

.about-page .about-panel details p {
  font-size: .9375rem;
}

.about-page .about-statistics {
  padding-block: 2.75rem;
  background: #fcfbf8;
  border-color: var(--about-line);
}

.about-page .about-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1.75rem 1rem;
}

.about-page .about-stats-grid .stat-item {
  min-width: 0;
  margin: 0;
  text-align: center;
}

.about-page .about-stat-value {
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
  overflow-wrap: break-word;
}

.about-page .about-stats-grid .stat-label {
  margin-top: .625rem;
  color: var(--about-muted);
  font-size: .8125rem;
  line-height: 1.6;
  letter-spacing: .025em;
}

.about-page .about-section-heading {
  margin-bottom: 2rem;
}

.about-page :is(.about-section-heading, .about-advantages-content, .about-editorial-body) > h2,
.about-page .about-advantages-content > div > h2 {
  margin: 0 0 1rem;
  color: var(--about-ink);
  font-size: clamp(1.75rem, 2.5vw, 2rem);
  line-height: 1.3;
  font-weight: 600;
  text-align: left;
  text-wrap: pretty;
}

.about-page .about-section-heading > p {
  max-width: 46rem;
  margin: 0;
  color: var(--about-muted);
  font-size: 1rem;
  line-height: 1.75;
}

.about-page .about-capability-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}

.about-page .about-capability-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  text-decoration: none;
}

.about-page .about-card-image {
  flex: none;
  height: 12rem;
  overflow: hidden;
}

.about-page .about-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-page .about-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.5rem;
}

.about-page .about-card-body :is(h2, h3) {
  margin: 0 0 .75rem;
  font-size: 1.375rem;
  line-height: 1.35;
  font-weight: 600;
  text-wrap: pretty;
}

.about-page .about-card-body > p {
  margin: 0 0 1.25rem;
  color: var(--about-muted);
  font-size: 1rem;
  line-height: 1.7;
}

.about-page .about-card-action {
  margin-top: auto;
  color: var(--about-gold);
  font-size: .9375rem;
  line-height: 1.5;
}

.about-page .about-advantages-content > .mb-16 {
  margin-bottom: 0;
}

.about-page .about-advantage-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}

.about-page .about-advantage-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  min-width: 0;
  padding: 1.5rem;
}

.about-page .about-advantage-card > div:last-child {
  min-width: 0;
}

.about-page .about-advantage-card h3 {
  margin: 0 0 .5rem;
  color: var(--about-ink);
  font-size: 1.125rem;
  line-height: 1.4;
  font-weight: 600;
}

.about-page .about-advantage-card p {
  margin: 0;
  color: var(--about-muted);
  font-size: 1rem;
  line-height: 1.7;
}

.about-page .about-editorial {
  border-color: var(--about-line);
  background: #faf8f3;
}

.about-page .about-editorial-body {
  color: var(--about-muted);
  font-size: 1rem;
  line-height: 1.8;
  overflow-wrap: break-word;
}

.about-page .about-editorial-body > h3 {
  margin: 2rem 0 .875rem;
  color: var(--about-ink);
  font-size: 1.375rem;
  line-height: 1.4;
  font-weight: 600;
  scroll-margin-top: 9rem;
}

.about-page .about-editorial-body > p {
  margin: 0 0 1.125rem;
}

.about-page .about-editorial-body > p:first-child {
  margin-bottom: .75rem;
  color: var(--about-gold);
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .075em;
}

.about-page .about-editorial-body > p:last-child {
  margin: 1.75rem 0 0;
  font-size: .875rem;
}

.about-page .about-editorial-body ul {
  margin: 1rem 0 1.5rem;
  padding-left: 1.5rem;
  list-style: disc;
}

.about-page .about-editorial-body li {
  padding-left: .125rem;
}

.about-page .about-editorial-body li::marker {
  color: var(--about-gold);
}

.about-page :is(.about-panel, .about-editorial-body) a {
  color: var(--about-gold);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

.about-page :is(.about-panel, .about-editorial-body) a:hover {
  color: #513b14;
  text-decoration-thickness: 2px;
}

.about-page :is(a, summary):focus-visible {
  outline: 3px solid #9b762d;
  outline-offset: 4px;
}

@media (min-width: 768px) {
  .about-page .about-stats-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .about-page :is(.about-capability-grid, .about-advantage-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .about-page .about-company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-page .about-stats-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    column-gap: .75rem;
  }

  .about-page .about-capability-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .about-page > :is(.about-overview, .about-capabilities, .about-advantages, .about-editorial) {
    padding-block: 3rem;
  }

  .about-page .about-intro > p {
    font-size: 1rem;
    line-height: 1.75;
  }

  .about-page .about-panel {
    padding: 1.5rem;
  }

  .about-page .about-statistics {
    padding-block: 2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-page .about-capability-card,
  .about-page .about-capability-card img,
  .about-page .about-card-action svg {
    transition: none;
  }
}