/* Digital BX: subpaginas de servicos (site/servicos/). Usa os tokens e secoes do site.css; aqui so o que e proprio. */

/* ---------- topo: texto a esquerda, fotografia vertical a direita ---------- */

.svc-hero { padding-top: 170px; }
.svc-hero-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 64px; align-items: center; max-width: none; }
.svc-eyebrow { margin-bottom: 26px; font-size: 14px; font-weight: 700; color: var(--muted); }
.svc-eyebrow a { color: inherit; text-underline-offset: .2em; }
.svc-hero .lead { margin-top: 32px; }
.svc-hero-foto { justify-self: end; width: min(100%, 420px); }
.svc-hero-foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 35%; border-radius: 18px; }

/* ---------- o que inclui: categorias em grelha, fundo escuro ---------- */

.svc-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 44px 40px; margin-top: 88px; }
.svc-cat h3 { padding-bottom: 14px; border-bottom: 2px solid #f2c9bf; font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.svc-cat ul { display: grid; gap: 10px; margin-top: 18px; }
.svc-cat li { font-size: 16px; line-height: 1.45; color: var(--muted); }

/* ---------- perguntas e chamada final ---------- */

.svc-faq-list { max-width: 820px; margin-top: 64px; }
.svc-faq-list details { border-top: 1px solid rgba(23, 21, 15, .16); }
.svc-faq-list details:last-child { border-bottom: 1px solid rgba(23, 21, 15, .16); }
.svc-faq-list summary {
  display: flex; justify-content: space-between; gap: 24px; padding: 22px 0; cursor: pointer; list-style: none;
  font-size: clamp(18px, 1.6vw, 22px); font-weight: 700;
}
.svc-faq-list summary::-webkit-details-marker { display: none; }
.svc-faq-list summary::after { content: "+"; font-weight: 500; color: var(--red); transition: transform 250ms var(--ease-out); }
.svc-faq-list details[open] summary::after { transform: rotate(45deg); }
.svc-faq-list details p { padding-bottom: 22px; max-width: 40em; font-size: 17px; line-height: 1.55; color: var(--muted); }
.svc-final { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 32px; margin-top: 88px; }
.svc-final p { font-size: clamp(22px, 2.2vw, 30px); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; max-width: 22em; }

@media (max-width: 900px) {
  .svc-hero { padding-top: 150px; }
  .svc-hero-grid { grid-template-columns: 1fr; gap: 48px; }
  .svc-hero-foto { justify-self: start; width: min(100%, 360px); }
  .svc-cats { margin-top: 56px; }
  .svc-faq-list { margin-top: 44px; }
  .svc-final { margin-top: 56px; }
}