/* ─── DETALHE DO SERVIÇO ────────────────────────── */
.service-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--bg3); border-radius: var(--radius); overflow: hidden; background: var(--white); margin-bottom: 24px; transition: box-shadow 0.25s; }
.service-detail:hover { box-shadow: 0 12px 40px rgba(61,46,34,0.1); }
.service-detail.reverse { direction: rtl; }
.service-detail.reverse > * { direction: ltr; }
.service-detail-img { aspect-ratio: 4/3; overflow: hidden; }
.service-detail-img img { height: 100%; }
.service-detail-body { padding: 48px 44px; display: flex; flex-direction: column; justify-content: center; }
.service-detail-body h3 { margin-bottom: 12px; }
.service-detail-body .divider { margin: 16px 0; }
.service-detail-body p { font-size: 15px; color: var(--mid); line-height: 1.8; margin-bottom: 12px; }

/* ─── PREÇO ─────────────────────────────────────── */
.service-price { display: inline-flex; align-items: baseline; gap: 4px; margin: 20px 0 28px; }
.service-price .from { font-size: 12px; color: var(--mid); letter-spacing: 0.08em; text-transform: uppercase; }
.service-price .value { font-family: 'Cormorant Garamond', serif; font-size: 40px; font-weight: 300; color: var(--dark); }
.service-price .currency { font-size: 20px; font-family: 'Cormorant Garamond', serif; color: var(--mid); align-self: flex-start; margin-top: 8px; }

/* ─── INCLUI ────────────────────────────────────── */
.service-includes { margin: 0 0 28px; padding: 0; list-style: none; }
.service-includes li { font-size: 14px; color: var(--mid); padding: 6px 0; border-bottom: 1px solid var(--bg3); display: flex; gap: 10px; align-items: flex-start; }
.service-includes li svg { color: var(--accent); flex-shrink: 0; margin-top: 3px; }

/* ─── FAQ ───────────────────────────────────────── */
.faq-item { border-bottom: 1px solid var(--bg3); padding: 20px 0; cursor: pointer; }
/* Reset de <button> para .faq-question */
.faq-question {
  display: flex; justify-content: space-between; align-items: center;
  width: 100%; text-align: left;
  font-size: 16px; font-family: 'DM Sans', sans-serif;
  color: var(--dark); font-weight: 400; user-select: none;
  background: none; border: none; padding: 0; cursor: pointer;
  outline: none;
}
.faq-question:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 2px;
}
.faq-icon { width: 28px; height: 28px; border: 1px solid var(--bg3); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--accent); flex-shrink: 0; transition: transform 0.3s, border-color 0.3s; }
.faq-item.open .faq-icon { transform: rotate(45deg); border-color: var(--accent); }
.faq-answer { font-size: 14px; color: var(--mid); line-height: 1.8; max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s; }
.faq-item.open .faq-answer { max-height: 200px; padding-top: 14px; }

/* ─── RESPONSIVO ────────────────────────────────── */
@media (max-width: 900px) {
  .service-detail { grid-template-columns: 1fr; }
  .service-detail.reverse { direction: ltr; }
  .service-detail-img { aspect-ratio: 16/9; }
  .service-detail-body { padding: 32px 28px; }

  .faq-grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
}
