/* Serviços — Material 3 escuro com neutros quentes, sem cinzas azulados. */
.site-view--services .serv-side {
  --serv-bg: #14110f;
  --serv-surface: #1b1816;
  --serv-surface-low: #211d1a;
  --serv-surface-mid: #28221f;
  --serv-surface-high: #312925;
  --serv-on: #f7e9df;
  --serv-on-variant: #cdbdb2;
  --serv-muted: #aa9b92;
  --serv-primary: #e7a171;
  --serv-primary-strong: #f3b081;
  --serv-primary-container-soft: #34231a;
  --serv-whatsapp: #198f49;
  --serv-whatsapp-hover: #157c40;

  background: var(--serv-bg) !important;
  color: var(--serv-on) !important;
  border: 0 !important;
  box-shadow: 0 22px 64px rgba(0, 0, 0, .46) !important;
}

.site-view--services .serv-dialog-head {
  background: var(--serv-surface-mid) !important;
  border: 0 !important;
  box-shadow: none !important;
}
.site-view--services .serv-dialog-head h3 { color: var(--serv-on) !important; }
.site-view--services .serv-dialog-head p { color: var(--serv-on-variant) !important; }
.site-view--services .ss-eyebrow { color: var(--serv-primary) !important; }
.site-view--services .serv-dialog-price { color: var(--serv-primary-strong) !important; }

.site-view--services .serv-side-close {
  background: var(--serv-surface-high) !important;
  color: var(--serv-on) !important;
  border: 0 !important;
  box-shadow: none !important;
}
.site-view--services .serv-side-close:hover,
.site-view--services .serv-side-close:active { background: #3a312c !important; }

.site-view--services .serv-dialog-scroll {
  background: var(--serv-bg) !important;
  color: var(--serv-on) !important;
  scrollbar-color: #6d3f27 transparent;
}
.site-view--services .serv-dialog-scroll > p,
.site-view--services .serv-dialog-scroll li { color: var(--serv-on-variant) !important; }

.site-view--services .ss-picked-clear {
  min-height: 46px;
  padding-inline: 20px !important;
  border: 0 !important;
  border-radius: 9999px !important;
  background: var(--serv-surface-high) !important;
  color: var(--serv-primary-strong) !important;
  box-shadow: none !important;
}
.site-view--services .ss-picked-clear:hover,
.site-view--services .ss-picked-clear:active { background: #3a312c !important; }

.site-view--services .serv-dialog-picked-sub {
  padding: 18px 20px !important;
  border: 0 !important;
  border-radius: 24px !important;
  background: var(--serv-primary-container-soft) !important;
  color: var(--serv-on) !important;
  box-shadow: none !important;
}

.site-view--services .serv-dialog-scroll ul {
  display: grid;
  gap: 12px;
  padding-left: 1.25rem;
}
.site-view--services .serv-dialog-scroll li { line-height: 1.43 !important; }
.site-view--services .serv-dialog-scroll li::marker { color: #b9662d !important; }

.site-view--services .serv-card,
.site-view--services .serv-sinal,
.site-view--services .serv-encomenda {
  border: 0 !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, #37251b 0%, #2d2019 100%) !important;
  color: var(--serv-on) !important;
  box-shadow: none !important;
}
.site-view--services .serv-card-lede { color: #fff0e5 !important; }
.site-view--services .serv-card-title { color: var(--serv-on) !important; }
.site-view--services .serv-card-sub,
.site-view--services .serv-card-body,
.site-view--services .serv-card-foot { color: #d7c2b4 !important; }
.site-view--services .serv-card-body { border-top-color: rgba(255,255,255,.09) !important; }
.site-view--services .serv-card-foot svg { color: var(--serv-primary) !important; }

.site-view--services .serv-dialog-footer {
  background: var(--serv-surface-low) !important;
  border: 0 !important;
  box-shadow: 0 -10px 30px rgba(0,0,0,.25) !important;
}
.site-view--services .serv-dialog-footer .btn-primary {
  min-height: 58px;
  border: 0 !important;
  border-radius: 9999px !important;
  background: var(--serv-whatsapp) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.site-view--services .serv-dialog-footer .btn-primary:hover,
.site-view--services .serv-dialog-footer .btn-primary:active {
  background: var(--serv-whatsapp-hover) !important;
  box-shadow: none !important;
}

.site-view--services .serv-hint { color: var(--serv-muted) !important; }
.site-view--services .serv-hint-dot { background: var(--serv-primary) !important; }

/* A tabela de preços usa largura previsível: o preço reserva só o necessário
   e todo o restante fica para nome + observação. Isso evita palavras quebradas
   em uma coluna estreita quando existe espaço vazio no card. */
.site-view--services .serv-table {
  table-layout: fixed !important;
}
.site-view--services .serv-table .name {
  width: auto !important;
  min-width: 0 !important;
  padding-right: 10px !important;
  white-space: normal !important;
}

/* O círculo de seleção é um indicador dentro da célula, não uma camada por
   cima do texto. Alguns overrides mobile antigos o tiravam do fluxo; aqui ele
   ganha uma coluna visual fixa e o nome reserva exatamente esse espaço. */
.site-view--services .serv-row-mark {
  position: static !important;
  inset: auto !important;
  display: inline-flex !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  margin: 3px 10px 0 0 !important;
  vertical-align: top !important;
  box-sizing: border-box !important;
}
.site-view--services .serv-row-text {
  display: inline-block !important;
  width: calc(100% - 36px) !important;
  max-width: none !important;
  min-width: 0 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  vertical-align: top !important;
}
.site-view--services .serv-table .name small {
  max-width: 34rem !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}
.site-view--services .serv-table .price {
  width: 112px !important;
  max-width: 112px !important;
  padding-left: 8px !important;
  text-align: right !important;
  white-space: nowrap !important;
}

@media (max-width: 720px) {
  .site-view--services .serv-table .price {
    width: 96px !important;
    max-width: 96px !important;
    padding-left: 4px !important;
    padding-right: 14px !important;
  }
  .site-view--services .serv-table .name {
    padding-left: 14px !important;
    padding-right: 6px !important;
  }
}

@media (max-width: 420px) {
  .site-view--services .serv-table .price {
    width: 86px !important;
    max-width: 86px !important;
    font-size: 19px !important;
    padding-right: 10px !important;
  }
  .site-view--services .serv-row-text { width: calc(100% - 36px) !important; }
}

@media (max-width: 640px) {
  .site-view--services .serv-side { border-radius: 30px 30px 0 0 !important; }
  .site-view--services .serv-dialog-head { padding: 24px 18px 22px !important; }
  .site-view--services .serv-dialog-scroll { padding-inline: 18px !important; }
  .site-view--services .serv-dialog-picked-sub {
    padding: 16px 18px !important;
    border-radius: 22px !important;
  }
  .site-view--services .serv-card,
  .site-view--services .serv-sinal,
  .site-view--services .serv-encomenda { border-radius: 24px !important; }
}