/* Card Engenharia e indústria: versão clara para melhorar contraste e leitura */
html body:not(.admin-body) .about-side--dark {
  color: var(--theme-text, #0B1324) !important;
  background: color-mix(in srgb, var(--theme-surface-strong, #F8FAFC) 94%, transparent) !important;
  border: 1px solid var(--theme-border, rgba(52, 64, 85, .14)) !important;
  box-shadow: var(--theme-shadow-soft) !important;
}

html body:not(.admin-body) .about-side--dark .about-label,
html body:not(.admin-body) .about-side--dark p {
  color: var(--theme-text-soft, #5B6474) !important;
}

html body:not(.admin-body) .about-side--dark h3 {
  color: var(--theme-text, #0B1324) !important;
}

html body:not(.admin-body) .about-side--dark .about-chips span {
  background: color-mix(in srgb, var(--theme-surface-muted, #E7EBF0) 84%, transparent) !important;
  color: var(--theme-text-soft, #344055) !important;
  border: 1px solid color-mix(in srgb, var(--theme-border, rgba(52, 64, 85, .14)) 82%, transparent) !important;
}

html[data-theme="dark"] body:not(.admin-body) .about-side--dark {
  background: color-mix(in srgb, var(--theme-surface-strong, #344055) 92%, transparent) !important;
  border-color: var(--theme-border, rgba(248, 250, 252, .12)) !important;
}

/* Sobre: um único fundo em gradiente para a página inteira. */
html body.about-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 0%, rgba(248, 250, 252, .72), transparent 28rem),
    radial-gradient(circle at 94% 16%, rgba(217, 224, 231, .62), transparent 30rem),
    linear-gradient(135deg, var(--theme-bg-start, #F8FAFC) 0%, var(--theme-bg-mid, #E7EBF0) 56%, var(--theme-bg-end, #D9E0E7) 100%) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

html[data-theme="dark"] body.about-page {
  background:
    radial-gradient(circle at 8% 0%, rgba(248, 250, 252, .05), transparent 30rem),
    radial-gradient(circle at 92% 20%, rgba(231, 235, 240, .08), transparent 32rem),
    linear-gradient(135deg, #263142 0%, #263142 52%, #3D485C 100%) !important;
}

html body.about-page main,
html body.about-page .about-showcase,
html body.about-page .footer {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Mesma largura útil da seção Projetos da Home. */
html body.about-page .about-showcase > .container {
  width: min(1460px, calc(100% - 48px)) !important;
  max-width: 1460px !important;
}

html body.about-page .about-intro,
html body.about-page .about-how,
html body.about-page .about-education,
html body.about-page .about-goals,
html body.about-page .about-next,
html body.about-page .about-bridge,
html body.about-page .about-how__grid,
html body.about-page .about-education-grid,
html body.about-page .about-goals__grid {
  width: 100% !important;
  max-width: none !important;
}

html body.about-page .about-title,
html body.about-page .about-lead,
html body.about-page .about-how__head h2,
html body.about-page .about-how__head > p,
html body.about-page .about-section-head h2,
html body.about-page .about-section-head > p,
html body.about-page .about-goals__head h2 {
  width: 100% !important;
  max-width: none !important;
  text-align: center !important;
}

html body.about-page .about-bridge {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin-top: 32px !important;
}

html body.about-page .about-side {
  min-height: 280px !important;
}

html body.about-page .about-education,
html body.about-page .about-goals {
  background-image: none !important;
}

/* Rodapé da página Sobre. */
html body.about-page .footer {
  min-height: 188px !important;
  padding: 58px 0 !important;
  display: flex !important;
  align-items: center !important;
  border-top: 1px solid color-mix(in srgb, var(--theme-border, rgba(52,64,85,.14)) 82%, transparent) !important;
}

html body.about-page .footer .footer-grid {
  width: min(var(--container, 1180px), calc(100% - 40px)) !important;
  margin-inline: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 36px !important;
}

html body.about-page .footer .footer-grid > p {
  margin: 0 !important;
  color: var(--theme-text-soft, #5B6474) !important;
  font-size: .96rem !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

html body.about-page .footer .socials {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 44px !important;
  margin: 0 !important;
}

html body.about-page .footer .socials a {
  color: var(--theme-text-soft, #344055) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
}

@media (max-width: 980px) {
  html body.about-page .about-bridge {
    grid-template-columns: 1fr !important;
  }

  html body.about-page .about-side {
    min-height: 0 !important;
  }
}

@media (max-width: 720px) {
  html body.about-page .about-showcase > .container {
    width: min(1460px, calc(100% - 28px)) !important;
  }

  html body.about-page .footer {
    min-height: 0 !important;
    padding: 38px 0 !important;
  }

  html body.about-page .footer .footer-grid {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  html body.about-page .footer .footer-grid > p {
    white-space: normal !important;
  }

  html body.about-page .footer .socials {
    gap: 24px !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }
}