/* Sessão SOBRE (mantém estrutura, imagem primeiro) */
.sec-sobre{
  padding: clamp(72px, 10vh, 100px) 0;
  background:
    radial-gradient(60% 60% at 85% 10%, rgba(16,185,129,.08), transparent 60%),
    linear-gradient(180deg, #fff, #f7fbfa);
  border-top:1px solid var(--gray-200);
}

.sobre-grid{
  display:grid; gap:44px;
  grid-template-columns: .95fr 1.05fr; /* imagem um pouco menor que texto */
  align-items:center;
}
@media (max-width: 1020px){
  .sobre-grid{ grid-template-columns: 1fr; }
}

.kicker{
  display:inline-block;
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  font-size:.78rem; color:var(--green-700);
  background:#eefaf4; border:1px dashed rgba(16,185,129,.35);
  border-radius:999px; padding:.3rem .65rem; margin-bottom:10px;
}

.sec-sobre h2{
  font-size: clamp(24px, 3.6vw, 36px);
  margin:0 0 10px 0;
}
.sec-sobre .accent{
  background: linear-gradient(90deg, var(--green-500), var(--green-neon));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.lead{
  color:var(--gray-700);
  font-size: clamp(16px, 2.1vw, 18px);
  margin:0 0 16px 0;
}

.sobre-pontos{
  list-style:none; margin:18px 0 0 0; padding:0;
  display:grid; gap:10px;
}
.sobre-pontos li{
  display:flex; align-items:center; gap:.6rem;
  background:#fff;
  border:1px solid var(--gray-200);
  border-radius:12px; padding:.65rem .8rem;
  box-shadow: 0 4px 14px rgba(0,0,0,.04);
}
.sobre-pontos .ico{
  display:grid; place-items:center;
  width:32px; height:32px; border-radius:8px;
  color:var(--white);
  background: linear-gradient(135deg, var(--green-500), var(--green-700));
}

.sobre-metricas{
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:10px;
  margin-top:16px;
}
@media (max-width: 560px){
  .sobre-metricas{ grid-template-columns: 1fr 1fr; }
}
.m-card{
  background: #0d0f12; /* fica bonito no light e dark; ajustado por vars */
  color: var(--white);
  border-radius: 14px;
  padding: 14px;
  text-align:center;
  border:1px solid rgba(255,255,255,.06);
  box-shadow: var(--shadow);
}
html[data-theme="light"] .m-card{ background: var(--black); color: var(--white); }
.m-card strong{ display:block; font-size:1.35rem; line-height:1.1; }
.m-card span{ font-size:.85rem; color: #c9d2d8; }

.sobre-cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; }

/* Mídia (foto) */
.sobre-media{ margin:0; position:relative; }
.sobre-media img{
  width:80%; height:auto; display:block;
  margin: 0 auto;
  border-radius:16px;
  box-shadow: var(--shadow);
  border:1px solid var(--gray-200);
}
.sobre-media::after{
  content:"";
  position:absolute; inset:auto  -10px -10px auto;
  width:46%; height:42px;
  border-radius:12px;
  filter: blur(16px); opacity:.35; pointer-events:none;
}
.sobre-media figcaption{
  margin-top:8px; font-size:.85rem; color:var(--gray-700);
  text-align:center;
}

/* Dark mode nativo (usa variáveis globais já definidas em inicio.css) */
@media (prefers-color-scheme: dark){
  .sec-sobre{
    background: linear-gradient(180deg, #0b0d10, #0e1318);
    border-top:1px solid rgba(255,255,255,.06);
  }
  .sobre-pontos li{
    background:#12171c;
    border:1px solid rgba(255,255,255,.06);
    color: var(--white);
  }
  .sobre-media img{ border-color: rgba(255,255,255,.08); }
  .sobre-media figcaption{ color: var(--gray-700); }
}
