/* ============================================================
   SEÇÕES — dores, benefícios, sobre, passos, preços, cases, FAQ
   ============================================================ */

/* ---------- Faixa de dores ---------- */
.pain{
  background:var(--brand-dark);
  color:#EFCEFA;
  padding:52px 0;
}
.pain .wrap{
  display:flex; flex-wrap:wrap; gap:14px 40px;
  align-items:center; justify-content:space-between;
}
.pain-lead{
  font-family:var(--font-display);
  font-size:20px;
  max-width:34ch;
  color:#fff;
}
.pain-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; gap:12px 26px;
}
.pain-list li{
  font-size:14px;
  color:#EFCEFA;
  display:flex; align-items:center; gap:8px;
}
.pain-list li::before{
  content:"×";
  color:var(--accent);
  font-weight:700;
}


/* ---------- Benefícios ---------- */
.grid-3{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:28px;
}
@media (max-width:860px){ .grid-3{ grid-template-columns:1fr; } }
.benefit{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:30px 26px;
}
.benefit-icon{
  width:42px; height:42px;
  border-radius:11px;
  background:var(--accent-tint);
  color:var(--accent-dark);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.benefit h3{
  font-size:18px;
  margin-bottom:9px;
}
.benefit p{
  font-size:14.5px;
  color:var(--ink-soft);
  margin:0;
}

/* ---------- Quem sou eu ---------- */
.about{
  background:var(--brand-tint);
}
.about .wrap{
  display:grid;
  grid-template-columns:0.8fr 1.2fr;
  gap:56px;
  align-items:center;
}
@media (max-width:860px){
  .about .wrap{ grid-template-columns:1fr; gap:32px; }
}
.about-photo{
  aspect-ratio:4/5;
  border-radius:var(--radius-lg);
  background:var(--brand-dark);
  display:flex; align-items:center; justify-content:center;
  position:relative;
  overflow:hidden;
}
.about-photo::before{
  content:"";
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(135deg, rgba(255,255,255,0.045) 0 2px, transparent 2px 22px);
}
.about-initials{
  font-family:var(--font-display);
  font-size:76px;
  font-weight:600;
  color:var(--accent);
  position:relative;
}
/* Foto: cobre todo o quadro sem distorcer. As iniciais "GC" ficam atras,
   como reserva caso a imagem nao carregue. */
.about-photo img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:50% 22%;
  z-index:2;
}
.about-eyebrow{ color:var(--brand-dark); }
.about-eyebrow::before{ background:var(--accent-dark); }
.about h2{ margin-bottom:18px; }
.about-bio{
  font-size:16.5px;
  color:var(--ink-soft);
  margin-bottom:24px;
  max-width:56ch;
}
.about-facts{
  list-style:none; margin:0; padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px 24px;
}
@media (max-width:480px){ .about-facts{ grid-template-columns:1fr; } }
.about-facts li{
  display:flex; align-items:flex-start; gap:10px;
  font-size:14px; color:var(--ink);
}
.about-facts svg{ flex-shrink:0; margin-top:2px; color:var(--brand); }

/* ---------- Como funciona ---------- */
.steps{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
@media (max-width:860px){ .steps{ grid-template-columns:1fr; } }
.step{
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:30px 26px;
}
.step-num{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--accent-dark);
  background:var(--accent-tint);
  display:inline-block;
  padding:2px 9px;
  border-radius:6px;
  margin-bottom:16px;
}
.step h3{ font-size:16.5px; margin-bottom:8px; }
.step p{ font-size:14px; color:var(--ink-soft); margin:0; }

/* ---------- Pricing ---------- */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:22px;
  align-items:stretch;
  max-width:760px;
  margin:0 auto;
}
@media (max-width:620px){ .pricing-grid{ grid-template-columns:1fr; } }

.price-launch{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--ink-faint);
  max-width:760px;
  margin:0 auto 24px;
}
.price-extras{
  max-width:760px;
  margin:24px auto 0;
  text-align:center;
  font-size:13.5px;
  color:var(--ink-soft);
}

.price-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:28px 24px;
  display:flex; flex-direction:column;
  position:relative;
}
.price-card.featured{
  border:2px solid var(--accent);
  background:linear-gradient(180deg, var(--accent-tint) 0%, var(--paper) 140px);
}
.price-badge{
  position:absolute; top:-13px; left:24px;
  background:var(--brand-dark);
  color:#fff;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.04em;
  padding:5px 12px;
  border-radius:999px;
}
.price-name{
  font-family:var(--font-display);
  font-size:19px;
  font-weight:600;
  margin-bottom:6px;
}
.price-value{
  font-family:var(--font-mono);
  font-size:30px;
  font-weight:500;
  color:var(--brand-dark);
  margin-bottom:4px;
}
.price-value span{
  font-size:13px;
  color:var(--ink-faint);
  font-weight:400;
}
.price-desc{
  font-size:13.5px;
  color:var(--ink-soft);
  margin-bottom:20px;
  min-height:34px;
}
.price-list{
  list-style:none; margin:0 0 24px; padding:0;
  flex-grow:1;
}
.price-list li{
  font-size:13.8px;
  color:var(--ink);
  display:flex; align-items:flex-start; gap:8px;
  padding:6px 0;
}
.price-list li svg{ flex-shrink:0; margin-top:3px; color:var(--brand); }

.maint-note{
  margin-top:32px;
  text-align:center;
  font-size:14px;
  color:var(--ink-soft);
  background:var(--bg-alt);
  border-radius:var(--radius-sm);
  padding:16px 20px;
}

/* ---------- Portfólio ---------- */
.case-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
@media (max-width:860px){ .case-grid{ grid-template-columns:1fr; } }
.case-card{
  border:1px dashed var(--line-strong);
  border-radius:var(--radius-md);
  padding:32px 26px;
  background:var(--paper);
  min-height:190px;
  display:flex; flex-direction:column; justify-content:space-between;
}
.case-tag{
  font-family:var(--font-mono);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--ink-faint);
  margin-bottom:14px;
  display:inline-block;
}
.case-card h3{ font-size:18px; margin-bottom:8px; }
.case-card p{ font-size:14px; color:var(--ink-soft); margin:0; }
.case-thumb{
  display:block;
  margin-bottom:18px;
  border-radius:var(--radius-sm);
  overflow:hidden;
}
.case-thumb img{ width:100%; height:auto; }
.case-link{
  display:inline-block;
  margin-top:18px;
  font-size:14px;
  font-weight:600;
  color:var(--brand);
}

/* ---------- FAQ ---------- */
.faq{ max-width:760px; }
details{
  border-bottom:1px solid var(--line);
  padding:20px 0;
}
details summary{
  cursor:pointer;
  list-style:none;
  display:flex; align-items:center; justify-content:space-between;
  font-family:var(--font-display);
  font-size:17px;
  font-weight:500;
  gap:16px;
}
details summary::-webkit-details-marker{ display:none; }
.faq-icon{
  flex-shrink:0;
  width:24px; height:24px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  border:1px solid var(--line-strong);
  color:var(--ink-soft);
  transition:transform 0.2s ease;
}
details[open] .faq-icon{ transform:rotate(45deg); border-color:var(--brand); color:var(--brand); }
details p{
  margin:14px 0 0;
  font-size:15px;
  color:var(--ink-soft);
  max-width:62ch;
}