/* =========================================================
   SEÇÃO SOBRE / ABOUT — CENTRALIZAÇÃO E RESPONSIVIDADE
   Cole este bloco no FINAL de src/styles/responsive-fix.css
========================================================= */

.about-section {
  overflow: hidden;
}

.about-container {
  width: min(100% - 48px, 980px);
  margin-inline: auto;
}

.about-section .section-header {
  text-align: center;
}

.about-card {
  width: 100%;
  margin-inline: auto;
}

.about-card p {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.75;
}

/* Tablet */
@media (min-width: 641px) and (max-width: 980px) {
  .about-section {
    padding-block: 88px;
  }

  .about-container {
    width: min(100% - 56px, 760px);
  }

  .about-section .section-header {
    margin-bottom: 36px;
  }

  .about-card {
    padding: 30px;
  }

  .about-card p {
    font-size: 1rem;
    text-align: left;
  }
}

/* Celular */
@media (max-width: 640px) {
  .about-section {
    padding-block: 72px;
  }

  .about-container {
    width: min(100% - 32px, 560px);
  }

  .about-section .section-header {
    margin-bottom: 30px;
    text-align: center;
  }

  .about-section .section-title {
    font-size: clamp(2rem, 9vw, 2.6rem);
    line-height: 1.15;
  }

  .about-section .section-subtitle {
    max-width: 290px;
    margin-inline: auto;
    font-size: 0.92rem;
    line-height: 1.55;
  }

  .about-card {
    padding: 24px 20px;
    border-radius: 18px;
    text-align: center;
  }

  .about-card p {
    font-size: 0.96rem;
    line-height: 1.72;
    text-align: center;
  }
}

/* Telas muito pequenas */
@media (max-width: 380px) {
  .about-container {
    width: calc(100% - 24px);
  }

  .about-card {
    padding: 21px 16px;
  }

  .about-card p {
    font-size: 0.91rem;
  }
}