/* Estilos exclusivos da página de Agendamento. */

/* ---------- AGENDAMENTO ---------- */
/* Layout do agendamento: o formulário abre a página, centralizado e com
   largura confortável de leitura. A apresentação e a câmera foram para o fim
   da página — antes ficavam à esquerda e, no celular, empurravam o formulário
   para baixo da dobra. */
.agenda-painel{
  max-width:900px;
  margin:0 auto;
}

/* Os três dados que tiram dúvida na hora de escolher */
.agenda-selos{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 34px;
  max-width:900px;
  margin:0 auto 34px;
  padding-bottom:26px;
  border-bottom:1px solid var(--hairline);
}
.agenda-selos span{
  font-size:0.83rem;
  letter-spacing:0.02em;
  color:var(--muted);
}
.agenda-selos b{
  color:var(--gold-light);
  font-weight:500;
}

.agenda-rodape{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
  margin-top:80px;
  padding-top:60px;
  border-top:1px solid var(--hairline);
}
.agenda-rodape-texto h2{
  font-family:'Cormorant Garamond', serif;
  font-size:clamp(1.5rem, 3vw, 2.05rem);
  color:var(--cream);
  margin-bottom:16px;
}
.agenda-rodape-texto p{
  color:var(--muted);
  margin-bottom:18px;
}
.agenda-rodape-texto .btn{
  margin-top:8px;
}
.agenda-list{
  list-style:none;
  margin:28px 0 34px;
}
.agenda-list li{
  display:flex;
  gap:14px;
  margin-bottom:14px;
  font-size:0.92rem;
  color:var(--cream);
}
.agenda-list li::before{
  content:'—';
  color:var(--gold);
}

/* ---------- ASSISTENTE DE AGENDAMENTO ---------- */
.booking-panel{
  position:relative;
  border:1px solid var(--hairline);
  border-radius:20px;
  background:linear-gradient(180deg, var(--bg-alt), var(--bg-card));
  padding:44px 38px;
  overflow:hidden;
}
.booking-glow{
  position:absolute;
  inset:-40%;
  background:radial-gradient(circle at 85% 0%, rgba(201,162,75,0.12), transparent 55%);
  pointer-events:none;
}
.booking-step{
  position:relative;
  margin-bottom:26px;
}
.booking-label{
  display:block;
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-light);
  margin-bottom:10px;
}
.booking-label em{
  text-transform:none;
  letter-spacing:0.04em;
  color:var(--muted);
  font-style:italic;
}
.booking-select,
.booking-input{
  width:100%;
  background:var(--bg);
  border:1px solid var(--hairline);
  border-radius:10px;
  color:var(--cream);
  font-family:'Jost', sans-serif;
  font-weight:300;
  font-size:0.95rem;
  padding:13px 16px;
  outline:none;
  transition:border-color .3s ease, box-shadow .3s ease;
  color-scheme:dark;
}
.booking-select:focus,
.booking-input:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(201,162,75,0.12);
}
.booking-input::placeholder{
  color:var(--muted);
  opacity:0.6;
}
.booking-hint{
  font-size:0.8rem;
  color:var(--muted);
  margin-top:8px;
}
.booking-hint.warn{
  color:#d98a6a;
}
/* Dropdown customizado: sempre abre para baixo */
.dd{
  position:relative;
}
.dd-toggle{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  text-align:left;
  cursor:pointer;
}
.dd-toggle .placeholder{
  color:var(--muted);
  opacity:0.7;
}
.dd-toggle .chev{
  width:15px; height:15px;
  flex:none;
  color:var(--gold);
  transition:transform .3s ease;
}
.dd.open .chev{
  transform:rotate(180deg);
}
.dd-list{
  position:absolute;
  top:calc(100% + 6px);
  left:0; right:0;
  background:var(--bg-alt);
  border:1px solid var(--hairline);
  border-radius:10px;
  list-style:none;
  max-height:250px;
  overflow-y:auto;
  z-index:20;
  padding:6px;
  margin:0;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
  box-shadow:0 18px 40px rgba(0,0,0,0.45);
}
.dd.open .dd-list{
  opacity:1;
  visibility:visible;
  transform:none;
}
.dd-list li{
  padding:10px 12px;
  border-radius:7px;
  font-size:0.92rem;
  color:var(--cream);
  cursor:pointer;
  transition:background .2s ease, color .2s ease;
}
.dd-list li:hover,
.dd-list li:focus{
  background:rgba(201,162,75,0.12);
  color:var(--gold-light);
}
.dd-list li:focus-visible{
  outline:2px solid var(--gold-light);
  outline-offset:-2px;
}
/* Valor do serviço escolhido — aparece dentro do passo 1 do agendamento */
.svc-info{
  margin-top:14px;
  padding:15px 16px;
  border:1px solid var(--hairline);
  border-radius:10px;
  background:rgba(201,162,75,0.05);
  animation:svcIn .3s ease both;
}
@keyframes svcIn{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}
.svc-single{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
}
.svc-single-lbl,
.svc-choose{
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--muted);
}
.svc-choose{ margin-bottom:10px; }
.svc-single-val{
  font-family:'Cormorant Garamond', serif;
  font-size:1.5rem;
  line-height:1;
  color:var(--gold-light);
}
.svc-opts{
  display:grid;
  gap:8px;
}
.svc-opt{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  text-align:left;
  padding:11px 13px;
  background:var(--bg);
  border:1px solid var(--hairline);
  border-radius:8px;
  color:var(--muted);
  font-family:'Jost', sans-serif;
  font-size:0.85rem;
  cursor:pointer;
  transition:all .25s ease;
}
.svc-opt:hover{
  border-color:var(--gold);
  color:var(--cream);
}
.svc-opt.selected{
  border-color:var(--gold);
  background:rgba(201,162,75,0.12);
  color:var(--cream);
}
.svc-opt .o-name{ line-height:1.35; }
.svc-opt .o-price{
  white-space:nowrap;
  font-size:0.9rem;
  color:var(--gold-light);
}
.svc-opt.selected .o-price{ font-weight:500; }
.svc-consulta{
  font-size:0.88rem;
  color:var(--cream);
}
.svc-note{
  margin-top:10px;
  font-size:0.76rem;
  line-height:1.5;
  color:var(--muted);
}
.svc-link{
  display:inline-block;
  margin-top:10px;
  font-size:0.76rem;
  letter-spacing:0.06em;
  color:var(--gold);
  border-bottom:1px solid rgba(201,162,75,0.35);
  padding-bottom:1px;
  transition:color .25s ease, border-color .25s ease;
}
.svc-link:hover{
  color:var(--gold-light);
  border-color:var(--gold-light);
}
/* Telas estreitas: nome e preço empilhados para não apertar */
@media (max-width:420px){
  .svc-opt{
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
  }
}
@media (prefers-reduced-motion: reduce){
  .svc-info{ animation:none; }
}

/* Câmera SVG preenchendo a coluna de texto do agendamento */
.agenda-logo{
  margin-top:0;
  position:relative;
  display:flex;
  justify-content:center;
}
.agenda-logo .lens{
  width:min(340px, 82%);
}

/* ---------- AGENDAMENTO EM ETAPAS ---------- */
.bk-progresso{ position:relative; margin-bottom:30px; }
.bk-barra{
  height:2px; background:var(--hairline); border-radius:2px; overflow:hidden;
}
.bk-barra i{
  display:block; height:100%; width:20%;
  background:linear-gradient(90deg, var(--gold), var(--gold-light));
  transition:width .5s cubic-bezier(.16,.84,.44,1);
}
.bk-passo{
  margin-top:10px; font-size:0.72rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--muted);
}
.bk-passo span:last-child{ color:var(--gold-light); }
.bk-etapa{ position:relative; animation:bkEntra .45s cubic-bezier(.16,.84,.44,1) both; }
@keyframes bkEntra{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

/* Etapa 1 — tipo de atendimento */
.bk-tipos{ display:grid; gap:10px; }
.bk-tipo{
  display:flex; align-items:center; gap:14px;
  width:100%; text-align:left; cursor:pointer;
  background:var(--bg); border:1px solid var(--hairline); border-radius:12px;
  padding:16px 18px; color:var(--cream);
  transition:border-color .3s ease, background .3s ease, transform .3s ease;
}
/* Ícone de traço fino, na moldura arredondada — o mesmo desenho das linhas
   douradas do site. Ganha vida quando o cartão é escolhido. */
.bk-tipo-icone{
  flex:0 0 auto;
  display:grid; place-items:center;
  width:44px; height:44px;
  border:1px solid var(--hairline);
  border-radius:11px;
  color:var(--gold);
  background:rgba(201,162,75,0.04);
  transition:border-color .3s ease, background .3s ease, color .3s ease;
}
.bk-tipo-icone svg{ width:26px; height:26px; }
.bk-tipo-txt{ min-width:0; }
@media (hover:hover) and (pointer:fine){
  .bk-tipo:hover .bk-tipo-icone{ border-color:rgba(201,162,75,0.5); }
}
.bk-tipo strong{ display:block; font-family:'Cormorant Garamond', serif; font-size:1.15rem; }
.bk-tipo em{ display:block; margin-top:2px; font-style:normal; font-size:0.82rem; color:var(--muted); }
/* O :hover só vale em ponteiro fino. Em tela de toque — e em alguns
   navegadores logo depois do clique — o estado de hover fica grudado no
   cartão, que parecia selecionado para sempre. */
@media (hover:hover) and (pointer:fine){
  .bk-tipo:hover{ border-color:rgba(201,162,75,0.5); background:rgba(201,162,75,0.07); transform:translateX(3px); }
}
/* O cartão escolhido não recebe realce próprio: o único indicador visual é o
   hover. Assim nenhum cartão fica com aparência de "aceso" ao voltar para
   esta etapa. A escolha continua registrada para leitores de tela pelo
   aria-checked, e aparece por extenso na etapa seguinte e na revisão. */

/* Etapa 2 — serviços e pacotes */
.bk-servicos{ display:grid; gap:8px; align-content:start; }
/* Com duas colunas e número ímpar de sessões, o último cartão ficava sozinho
   encostado à esquerda. Aqui ele atravessa as duas colunas e se centraliza. */
@media (min-width:760px){
  .bk-servicos > .bk-servico:last-child:nth-child(odd){
    grid-column:1 / -1;
    width:calc(50% - 4px);
    justify-self:center;
  }
}
.bk-servico{
  display:grid; grid-template-columns:1fr auto; gap:2px 14px; align-items:baseline;
  width:100%; text-align:left; cursor:pointer;
  background:var(--bg); border:1px solid var(--hairline); border-radius:12px;
  padding:14px 18px; color:var(--cream);
  transition:border-color .3s ease, background .3s ease;
}
.bk-servico-nome{ font-family:'Cormorant Garamond', serif; font-size:1.08rem; }
.bk-servico-preco{ grid-row:1; grid-column:2; color:var(--gold-light); font-size:0.86rem; text-align:right; }
.bk-servico-meta{ grid-column:1 / -1; font-size:0.76rem; color:var(--muted); letter-spacing:0.04em; }
.bk-servico:hover{ border-color:rgba(201,162,75,0.45); }
.bk-servico.selecionado{ border-color:var(--gold); background:rgba(201,162,75,0.07); }

.bk-pacote{
  display:block; width:100%; text-align:left; cursor:pointer; margin-top:8px;
  background:var(--bg); border:1px solid var(--hairline); border-radius:12px;
  padding:14px 18px; color:var(--cream);
  transition:border-color .3s ease, background .3s ease;
}
.bk-pacote-topo{ display:flex; justify-content:space-between; gap:14px; align-items:baseline; }
.bk-pacote-topo span{ font-family:'Cormorant Garamond', serif; font-size:1.05rem; }
.bk-pacote-topo b{ color:var(--gold-light); font-size:0.86rem; font-weight:500; white-space:nowrap; }
.bk-pacote ul{ list-style:none; margin:10px 0 0; }
.bk-pacote li{
  position:relative; padding-left:16px; margin-bottom:5px;
  font-size:0.8rem; color:var(--muted); line-height:1.5;
}
.bk-pacote li::before{ content:'—'; position:absolute; left:0; color:var(--gold); opacity:0.7; }
.bk-pacote:hover{ border-color:rgba(201,162,75,0.45); }
.bk-pacote.selecionado{ border-color:var(--gold); background:rgba(201,162,75,0.07); }

/* Etapa 3 — calendário */
.bk-cal{ border:1px solid var(--hairline); border-radius:14px; padding:16px; background:var(--bg); }
.bk-cal-topo{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.bk-cal-topo strong{
  font-family:'Cormorant Garamond', serif; font-size:1.15rem;
  color:var(--cream); text-transform:capitalize;
}
.bk-cal-nav{
  width:32px; height:32px; display:grid; place-items:center; cursor:pointer;
  border:1px solid var(--hairline); border-radius:8px; color:var(--gold);
  background:transparent; transition:border-color .3s ease, opacity .3s ease;
}
.bk-cal-nav svg{ width:16px; height:16px; }
.bk-cal-nav:hover:not(:disabled){ border-color:var(--gold); }
.bk-cal-nav:disabled{ opacity:0.25; cursor:default; }
.bk-cal-sem, .bk-cal-dias{ display:grid; grid-template-columns:repeat(7, 1fr); gap:4px; }
.bk-cal-sem span{
  text-align:center; font-size:0.68rem; letter-spacing:0.1em;
  color:var(--muted); padding-bottom:6px;
}
.bk-dia{
  aspect-ratio:1; display:grid; place-items:center; cursor:pointer;
  background:transparent; border:1px solid transparent; border-radius:9px;
  color:var(--cream); font-family:'Jost', sans-serif; font-size:0.88rem;
  transition:border-color .25s ease, background .25s ease, color .25s ease;
}
.bk-dia.vazio{ cursor:default; }
.bk-dia:not(:disabled){ border-color:rgba(201,162,75,0.28); }
.bk-dia:not(:disabled):hover{ border-color:var(--gold); background:rgba(201,162,75,0.1); }
.bk-dia.indisponivel{ color:var(--muted); opacity:0.35; cursor:default; }
.bk-dia.selecionado{ background:var(--gold); border-color:var(--gold); color:#141109; font-weight:500; }
.bk-legenda{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-top:14px; font-size:0.74rem; color:var(--muted);
}
.bk-legenda i{
  width:11px; height:11px; border-radius:4px; display:inline-block; margin-left:6px;
}
.bk-legenda i.livre{ border:1px solid rgba(201,162,75,0.5); }
.bk-legenda i.cheio{ border:1px solid var(--hairline); opacity:0.4; background:var(--hairline); }
.bk-legenda i:first-child{ margin-left:0; }

/* Etapa 5 — revisão */

/* ---------- AGENDAMENTO: AVISO E TELA FINAL ---------- */
/* Quando a ponte com a Google Agenda não responde, o texto muda de cor para
   o cliente perceber que aqueles horários não foram conferidos. */
.booking-hint.aviso{
  color:#d9a441;
}

.bk-final{
  text-align:center;
  padding:18px 4px 6px;
  animation:bkFinalEntra .5s ease both;
}
@keyframes bkFinalEntra{
  from{ opacity:0; transform:translateY(12px); }
  to{ opacity:1; transform:none; }
}
.bk-final:focus{ outline:none; }
.bk-final-icone{
  color:var(--gold);
  margin-bottom:18px;
}
.bk-final-icone svg{
  width:58px; height:58px;
  stroke-linecap:round; stroke-linejoin:round;
}
.bk-final h3{
  font-family:'Cormorant Garamond', serif;
  font-size:clamp(1.5rem, 3vw, 2rem);
  color:var(--cream);
  margin-bottom:12px;
}
.bk-final p{
  color:var(--muted);
  max-width:44ch;
  margin:0 auto 26px;
  line-height:1.65;
}
.bk-final strong{ color:var(--cream); }
.bk-final-acoes{
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
}
@media (prefers-reduced-motion: reduce){
  .bk-final{ animation:none; }
}

/* ---------- AGENDAMENTO: CARD COMPACTO E DE ALTURA ESTÁVEL ----------
   Três problemas resolvidos aqui:
   1. O calendário ocupava o painel inteiro. Com aspect-ratio:1 em .bk-dia e
      824px de largura útil, cada dia virava um quadrado de 109px e só a grade
      passava de 670px de altura. Agora a célula tem altura fixa e o calendário
      tem largura máxima própria.
   2. O card mudava de tamanho a cada etapa (a de data tinha 74 elementos,
      a de revisão tinha 4). O .bk-corpo fixa a altura do miolo, então a
      moldura, a barra de progresso e os botões não pulam mais.
   3. Nas etapas de lista, duas colunas encurtam a altura pela metade. */

.booking-panel{
  /* Você pediu para encostar o painel no conteúdo. O vertical é o que manda
     na ALTURA, então caiu bastante; o horizontal caiu menos, para o texto
     não encostar na moldura.
     ↩ Para voltar ao anterior: padding:44px 38px; */
  padding:18px 28px;
  border-radius:20px;
}
@media (max-width:820px){
  /* Precisa vir DEPOIS da regra acima: a versão original ficava numa media
     query mais cedo no arquivo e era anulada por ela — no celular o painel
     continuava com o espaçamento do desktop. */
  .booking-panel{ padding:14px 16px; }
}

/* O miolo acompanha o conteúdo de cada etapa: sem altura mínima não sobra
   área vazia embaixo dos cartões. O flex serve só para a confirmação final
   poder ocupar e centralizar o espaço. */
/* display:block de propósito. Enquanto isto era um flex column com
   .bk-etapa em flex:1 1 auto, qualquer altura no container (inclusive a
   inline que a animação usa) ESTICAVA a etapa e abria uma faixa vazia
   embaixo do conteúdo. Em bloco, o miolo nunca fica maior que o conteúdo. */
.bk-corpo{
  display:block;
  transition:height .4s cubic-bezier(.22,.61,.36,1);
}
@media (prefers-reduced-motion: reduce){
  .bk-corpo{ transition:none; }
}
/* a confirmação já é centralizada pelo text-align do próprio .bk-final */
.bk-corpo > .bk-final{ padding:8px 0 0; }

/* ---- calendário compacto ---- */
.bk-cal{
  max-width:330px;
  padding:14px;
  border-radius:12px;
}
.bk-dia{
  aspect-ratio:auto;
  height:34px;
  font-size:0.82rem;
  border-radius:8px;
}
.bk-cal-dias{ gap:3px; }
.bk-cal-sem span{ font-size:0.68rem; }

/* ---- etapa de data: calendário e horários lado a lado ---- */
@media (min-width:760px){
  .bk-etapa[data-etapa="4"]:not([hidden]){
    display:grid;
    grid-template-columns:330px 1fr;
    gap:30px;
    align-items:start;
  }
  .bk-etapa[data-etapa="4"] > .booking-label,
  .bk-etapa[data-etapa="4"] > #bkCombinarHint{
    grid-column:1 / -1;
  }
  #bkHorarioBloco > .booking-label{
    margin-top:0 !important;
  }
  .slot-grid{ grid-template-columns:repeat(3, 1fr); }

  /* Só a lista de serviços vai a duas colunas — são 8 itens. Os 4 tipos de
     atendimento ficam melhor empilhados, um por linha. */
  .bk-servicos{
    grid-template-columns:repeat(2, 1fr);
  }
}

@media (max-width:759px){
  .bk-cal{ max-width:none; }
}

/* ---------- AGENDAMENTO · REFINAMENTO PREMIUM ---------- */
.booking-panel{
  overflow:hidden;
  border-color:rgba(201,162,75,.16);
  border-radius:24px;
  background:
    radial-gradient(circle at 8% 0%,rgba(201,162,75,.07),transparent 30%),
    linear-gradient(180deg,rgba(23,20,15,.96),rgba(14,13,11,.98));
  box-shadow:0 28px 78px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.012);
}
.booking-panel::before{
  content:'';
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(230,200,120,.58),transparent);
  pointer-events:none;
}
.bk-progresso{margin-bottom:26px;}
.bk-barra{background:rgba(201,162,75,.13);}
.bk-passo{letter-spacing:.04em;}
.bk-etapa > .booking-label{
  margin-bottom:18px;
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:1.34rem;
  font-weight:500;
  letter-spacing:.01em;
  text-transform:none;
}
.bk-tipo,.bk-servico,.bk-pacote{
  border-color:rgba(201,162,75,.13);
  background:linear-gradient(145deg,rgba(255,255,255,.014),rgba(201,162,75,.012));
  box-shadow:inset 0 1px rgba(255,255,255,.012);
}
.bk-tipo:hover,.bk-servico:hover,.bk-pacote:hover{
  border-color:rgba(201,162,75,.42);
  background:linear-gradient(145deg,rgba(201,162,75,.055),rgba(255,255,255,.012));
}
.bk-tipo.selecionado,.bk-servico.selecionado,.bk-pacote.selecionado{
  border-color:rgba(230,200,120,.7);
  background:linear-gradient(145deg,rgba(201,162,75,.095),rgba(201,162,75,.025));
  box-shadow:0 0 0 1px rgba(201,162,75,.05),inset 0 1px rgba(255,255,255,.02);
}
.bk-tipo strong,.bk-servico strong,.bk-pacote-topo span{
  font-family:'Cormorant Garamond',serif;
  font-size:1.08rem;
  font-weight:500;
  letter-spacing:.01em;
}
.bk-pacote{padding:17px 20px;}
.bk-pacote ul{margin-top:12px;}
.bk-cal{
  border-color:rgba(201,162,75,.14);
  background:rgba(10,9,8,.38);
  box-shadow:inset 0 1px rgba(255,255,255,.012);
}
.booking-input,.booking-select,.slot{
  border-color:rgba(201,162,75,.14);
  background:rgba(10,9,8,.42);
}
.bk-nav{
  margin-top:26px;
  padding-top:20px;
  border-top:1px solid rgba(201,162,75,.1);
}
.rev-topo{
  border-color:rgba(201,162,75,.22);
  background:linear-gradient(145deg,rgba(201,162,75,.065),rgba(255,255,255,.012));
}
.booking-hint.aviso{
  margin-top:12px;
  padding:12px 14px;
  border:1px solid rgba(217,164,65,.22);
  border-radius:10px;
  background:rgba(217,164,65,.055);
  line-height:1.55;
}
@media(max-width:600px){
  .booking-panel{border-radius:20px;}
  .bk-etapa > .booking-label{font-size:1.22rem;}
  .bk-tipo,.bk-servico,.bk-pacote{border-radius:13px;}
}

/* ---------- AGENDAMENTO · CARDS DE SERVIÇO E ALTURA NATURAL ---------- */
/* A etapa acompanha o conteúdo real: nenhuma altura antiga/inline pode abrir
   uma faixa vazia entre o progresso, os cartões e a navegação. */
.booking-panel{
  height:auto !important;
  min-height:0 !important;
}
.bk-corpo{
  height:auto !important;
  min-height:0 !important;
}
.bk-etapa{
  height:auto !important;
  min-height:0 !important;
}
.bk-progresso{ margin-bottom:20px; }
.bk-etapa > .booking-label{ margin-bottom:14px; }
.bk-nav{ margin-top:20px; padding-top:16px; }

/* Cards com fotografia: a capa configurada no painel/Neon entra à esquerda;
   nome, contexto e investimento têm linhas próprias para nunca se sobrepor. */
.bk-servicos{ gap:12px; }
.bk-servico{
  align-items:center;
  gap:0;
  min-width:0;
  padding:11px 13px;
  border-radius:14px;
}
.bk-servico.com-foto{
  grid-template-columns:78px minmax(0,1fr);
  column-gap:14px;
}
.bk-servico-media{
  grid-column:1;
  grid-row:1;
  width:78px;
  height:70px;
  overflow:hidden;
  border:1px solid rgba(201,162,75,.14);
  border-radius:11px;
  background:
    radial-gradient(circle at 30% 20%,rgba(201,162,75,.11),transparent 55%),
    rgba(10,9,8,.55);
}
.bk-servico-foto{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 35%;
  border-radius:0;
  filter:brightness(.78) saturate(.72);
  transition:filter .3s ease, transform .45s cubic-bezier(.16,.84,.44,1);
}
.bk-servico:hover .bk-servico-foto,
.bk-servico.selecionado .bk-servico-foto{
  filter:brightness(.94) saturate(.9);
  transform:scale(1.035);
}
.bk-servico-texto{
  grid-column:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.bk-servico.com-foto .bk-servico-texto{ grid-column:2; }
.bk-servico-linha{
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.bk-servico-nome{
  min-width:0;
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:1.12rem;
  font-weight:500;
  line-height:1.18;
}
.bk-servico-preco{
  grid-row:auto;
  grid-column:auto;
  flex:0 0 auto;
  max-width:48%;
  color:var(--gold-light);
  font-size:.8rem;
  font-weight:500;
  line-height:1.35;
  text-align:right;
  white-space:normal;
}
.bk-servico-meta{
  grid-column:auto;
  color:#887d6b;
  font-size:.7rem;
  line-height:1.35;
  letter-spacing:.035em;
}

@media(max-width:759px){
  .bk-servicos{ grid-template-columns:1fr; }
  .bk-servicos > .bk-servico:last-child:nth-child(odd){
    width:100%;
    grid-column:auto;
  }
}
@media(max-width:520px){
  .bk-servico.com-foto{
    grid-template-columns:70px minmax(0,1fr);
    column-gap:12px;
  }
  .bk-servico-media{ width:70px; height:66px; }
  .bk-servico-linha{
    flex-direction:column;
    gap:3px;
  }
  .bk-servico-preco{
    max-width:none;
    text-align:left;
    font-size:.78rem;
  }
}
@media(prefers-reduced-motion:reduce){
  .bk-servico-foto{ transition:none; }
  .bk-servico:hover .bk-servico-foto,
  .bk-servico.selecionado .bk-servico-foto{ transform:none; }
}

/* ---------- AGENDAMENTO · ETAPAS SEM PADDING GLOBAL ---------- */
/* As etapas internas são <section>; sem este reset elas herdam os 130px
   verticais da regra global de seções e criam grandes vazios no formulário. */
.booking-panel .bk-etapa{
  padding:0 !important;
}

/* ---------- AGENDAMENTO · REVISÃO PREMIUM 2026-09 ---------- */
.bk-etapa[data-etapa="6"] > .booking-label{
  margin-bottom:16px;
}
.rev-premium{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.rev-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:26px;
  align-items:end;
  padding:22px 24px;
  overflow:hidden;
  border:1px solid rgba(201,162,75,.26);
  border-radius:18px;
  background:
    radial-gradient(circle at 8% 0%,rgba(230,200,120,.09),transparent 32%),
    linear-gradient(145deg,rgba(201,162,75,.075),rgba(255,255,255,.01));
}
.rev-hero::before{
  content:'';
  position:absolute;
  top:0;
  left:9%;
  right:9%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(230,200,120,.72),transparent);
}
.rev-hero-copy{min-width:0;}
.rev-eyebrow{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:8px;
  color:var(--gold);
  font-size:.62rem;
  letter-spacing:.19em;
  text-transform:uppercase;
}
.rev-eyebrow i{
  width:24px;
  height:1px;
  background:var(--gold);
  opacity:.72;
}
.rev-servico{
  display:block;
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.65rem,3.2vw,2.15rem);
  font-weight:500;
  line-height:1.02;
}
.rev-pacote{
  display:block;
  margin-top:7px;
  color:#b9aa8d;
  font-size:.78rem;
  line-height:1.45;
}
.rev-valor{
  min-width:155px;
  padding-left:22px;
  border-left:1px solid rgba(201,162,75,.17);
  text-align:right;
}
.rev-valor strong{
  display:block;
  margin-top:2px;
  color:var(--gold-light);
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.55rem,2.8vw,1.95rem);
  font-weight:500;
  line-height:1;
}
.rev-valor small{
  display:block;
  margin-top:6px;
  color:#746a59;
  font-size:.61rem;
  letter-spacing:.07em;
}
.rev-k{
  display:block;
  margin-bottom:3px;
  color:#817662;
  font-size:.59rem;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.rev-v{
  display:block;
  color:var(--cream);
  font-size:.88rem;
  line-height:1.45;
  overflow-wrap:anywhere;
}
.rev-v-destaque{
  font-family:'Cormorant Garamond',serif;
  font-size:1.08rem;
  color:#e9dfca;
}
.rev-section{
  padding:17px 19px 5px;
  border:1px solid rgba(201,162,75,.12);
  border-radius:16px;
  background:rgba(8,7,6,.22);
}
.rev-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:8px;
}
.rev-section-kicker{
  display:block;
  margin-bottom:1px;
  color:#746a59;
  font-size:.58rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.rev-section-head h4{
  margin:0;
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:1.18rem;
  font-weight:500;
}
.rev-section-number{
  color:rgba(201,162,75,.46);
  font-family:'Cormorant Garamond',serif;
  font-size:1.15rem;
  font-style:italic;
}
.rev-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:30px;
}
.rev-detail{
  position:relative;
  display:grid;
  grid-template-columns:8px minmax(0,1fr);
  gap:11px;
  align-items:start;
  min-width:0;
  padding:11px 0 13px;
  border-top:1px solid rgba(201,162,75,.09);
}
.rev-detail-mark{
  width:5px;
  height:5px;
  margin-top:8px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 4px rgba(201,162,75,.055);
}
.rev-detail-wide{grid-column:1 / -1;}
.rev-detail-note .rev-v{
  color:#c8bda8;
  font-style:italic;
}
.rev-inclui{
  padding:0;
  overflow:hidden;
  border:1px solid rgba(201,162,75,.13);
  border-radius:16px;
  background:rgba(8,7,6,.22);
}
.rev-inclui summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:58px;
  padding:13px 18px;
  cursor:pointer;
  list-style:none;
}
.rev-inclui summary::-webkit-details-marker{display:none;}
.rev-inclui summary span{display:flex;flex-direction:column;gap:2px;}
.rev-inclui summary b{
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:1.05rem;
  font-weight:500;
}
.rev-inclui summary small{
  color:#776d5c;
  font-size:.64rem;
  letter-spacing:.05em;
}
.rev-inclui summary i{
  position:relative;
  width:26px;
  height:26px;
  flex:0 0 auto;
  border:1px solid rgba(201,162,75,.2);
  border-radius:50%;
}
.rev-inclui summary i::before,
.rev-inclui summary i::after{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:8px;
  height:1px;
  background:var(--gold);
  transform:translate(-50%,-50%);
  transition:transform .25s ease;
}
.rev-inclui summary i::after{transform:translate(-50%,-50%) rotate(90deg);}
.rev-inclui[open] summary i::after{transform:translate(-50%,-50%) rotate(0deg);}
.rev-inclui ul{
  list-style:none;
  margin:0;
  padding:2px 18px 15px;
  border-top:1px solid rgba(201,162,75,.08);
}
.rev-inclui li{
  position:relative;
  padding:9px 0 0 17px;
  color:#a99e89;
  font-size:.78rem;
  line-height:1.48;
}
.rev-inclui li::before{
  content:'✓';
  position:absolute;
  left:0;
  top:9px;
  color:var(--gold);
  font-size:.68rem;
}
.rev-confirm-note{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:13px;
  align-items:start;
  padding:2px 3px 0;
}
.rev-confirm-icon{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid rgba(201,162,75,.25);
  border-radius:50%;
  background:rgba(201,162,75,.055);
  color:var(--gold-light);
  font-size:.75rem;
}
.rev-confirm-note strong{
  display:block;
  margin-bottom:2px;
  color:var(--cream);
  font-family:'Cormorant Garamond',serif;
  font-size:1rem;
  font-weight:500;
}
.rev-confirm-note p{
  max-width:62ch;
  color:#817765;
  font-size:.72rem;
  line-height:1.5;
}
.bk-etapa[data-etapa="6"] > .booking-hint{
  margin-top:15px;
  padding-top:13px;
  border-top:1px solid rgba(201,162,75,.08);
  color:#776d5c;
  font-size:.7rem;
  line-height:1.5;
}
.bk-etapa[data-etapa="6"] + *{}
.bk-sinal{
  position:relative;
  margin-top:14px;
  padding:13px 16px 13px 42px;
  border:1px solid rgba(201,162,75,.22);
  border-radius:13px;
  background:linear-gradient(90deg,rgba(201,162,75,.075),rgba(201,162,75,.025));
  color:#d7c59a;
  font-size:.76rem;
  line-height:1.5;
}
.bk-sinal::before{
  content:'';
  position:absolute;
  left:18px;
  top:50%;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 5px rgba(201,162,75,.07);
  transform:translateY(-50%);
}
.bk-etapa[data-etapa="6"] ~ .bk-nav{}
#bkPanel:has(.bk-etapa[data-etapa="6"]:not([hidden])) .bk-nav{
  padding-top:18px;
  border-top:1px solid rgba(201,162,75,.1);
}
#bkPanel:has(.bk-etapa[data-etapa="6"]:not([hidden])) #bkEnviar{
  min-width:230px;
}
@media(max-width:620px){
  .rev-hero{grid-template-columns:1fr;gap:16px;padding:19px 18px;}
  .rev-valor{padding:14px 0 0;border-left:0;border-top:1px solid rgba(201,162,75,.12);text-align:left;}
  .rev-grid{grid-template-columns:1fr;}
  .rev-detail-wide{grid-column:auto;}
  .rev-section{padding:15px 16px 4px;}
  .rev-confirm-note{grid-template-columns:30px minmax(0,1fr);}
  #bkPanel:has(.bk-etapa[data-etapa="6"]:not([hidden])) #bkEnviar{min-width:0;}
}

/* ---------- AGENDAMENTO · REVISÃO: CHEVRON ÚNICO ---------- */
/* Remove o antigo "+" textual herdado e usa apenas um chevron dentro do
   controle circular, mantendo a leitura limpa do expansor. */
.rev-inclui summary::after{
  content:none !important;
  display:none !important;
}
.rev-inclui summary i{
  transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.rev-inclui summary i::before{
  content:'›';
  width:auto;
  height:auto;
  background:none;
  color:var(--gold-light);
  font-family:'Jost',sans-serif;
  font-size:1.12rem;
  font-weight:300;
  line-height:1;
  transform:translate(-50%,-54%);
}
.rev-inclui summary i::after{
  content:none;
  display:none;
}
.rev-inclui[open] summary i{
  transform:rotate(90deg);
  border-color:rgba(201,162,75,.38);
  background:rgba(201,162,75,.05);
}


/* ---------- AGENDAMENTO MOBILE · CONTENÇÃO E RODAPÉ ---------- */
@media (max-width:620px){
  .booking-panel,
  .bk-corpo,
  .bk-etapa,
  .booking-step,
  .bk-tipos,
  .bk-servicos,
  .bk-pacote,
  .rev-premium,
  .rev-hero,
  .rev-section,
  .rev-inclui,
  .bk-nav{
    min-width:0;
    max-width:100%;
  }

  .booking-label,
  .booking-hint,
  .aviso-privacidade,
  .bk-sinal,
  .bk-passo,
  .bk-tipo strong,
  .bk-tipo em,
  .bk-servico-nome,
  .bk-servico-meta,
  .bk-pacote-topo span,
  .bk-pacote li,
  .svc-consulta,
  .svc-note,
  .rev-servico,
  .rev-pacote,
  .rev-v,
  .rev-inclui li,
  .rev-confirm-note p{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:normal;
  }

  .booking-input,
  .booking-select,
  .dd-toggle,
  .svc-opt{
    min-width:0;
    max-width:100%;
  }
  .dd-toggle{
    white-space:normal;
  }
  .svc-opt .o-name{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .svc-opt .o-price{
    white-space:normal;
  }
  .bk-pacote-topo{
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .bk-pacote-topo b{
    white-space:normal;
  }
  .bk-cal-topo strong{
    min-width:0;
    text-align:center;
    overflow-wrap:anywhere;
  }
  .bk-legenda{
    row-gap:6px;
  }
}

@media (max-width:700px){
  .agenda-rodape{
    grid-template-columns:1fr;
    gap:20px;
    margin-top:46px;
    padding-top:34px;
  }
  .agenda-rodape-texto{
    max-width:520px;
    margin:0 auto;
    text-align:center;
  }
  .agenda-rodape-texto h2{
    margin-bottom:10px;
    font-size:clamp(1.55rem,7vw,1.85rem);
    line-height:1.12;
  }
  .agenda-rodape-texto p{
    margin-bottom:10px;
    font-size:.88rem;
    line-height:1.55;
  }
  .agenda-rodape-texto .btn{
    margin-top:4px;
  }
  .agenda-rodape-cam{
    display:flex;
    justify-content:center;
    margin-top:2px;
  }
  .agenda-logo{
    width:min(420px,100%);
    margin:0 auto;
  }
  .agenda-logo .lens{
    width:min(400px,100%);
    max-width:100%;
  }
}

@media (max-width:420px){
  .agenda-rodape{
    gap:14px;
    margin-top:38px;
    padding-top:28px;
  }
  .agenda-logo{
    width:100%;
  }
  .agenda-logo .lens{
    width:100%;
  }
}


/* ---------- AGENDAMENTO MOBILE · TOM NEUTRO E CTA COMPACTO ---------- */
@media (max-width:700px){
  .booking-panel{
    border-color:rgba(243,236,220,.105) !important;
    background:
      radial-gradient(circle at 8% 0%,rgba(243,236,220,.025),transparent 31%),
      linear-gradient(180deg,rgba(21,20,18,.985),rgba(12,12,11,.995)) !important;
    box-shadow:0 24px 64px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.012) !important;
  }
  .booking-panel::before{
    background:linear-gradient(90deg,transparent,rgba(243,236,220,.24),transparent) !important;
  }
  .booking-glow{
    background:radial-gradient(circle at 85% 0%,rgba(243,236,220,.035),transparent 54%) !important;
  }
  .bk-barra{
    background:rgba(243,236,220,.095) !important;
  }
  .bk-barra i{
    background:linear-gradient(90deg,#9b8557,#b49a62) !important;
  }
  .bk-tipo,
  .bk-servico,
  .bk-pacote,
  .svc-opt{
    border-color:rgba(243,236,220,.105) !important;
    background:rgba(255,255,255,.018) !important;
    box-shadow:inset 0 1px rgba(255,255,255,.012) !important;
  }
  .bk-tipo.selecionado,
  .bk-servico.selecionado,
  .bk-pacote.selecionado,
  .svc-opt.selected{
    border-color:rgba(230,200,120,.40) !important;
    background:rgba(243,236,220,.045) !important;
    box-shadow:none !important;
  }
  .bk-tipo-icone{
    border-color:rgba(243,236,220,.11) !important;
    background:rgba(255,255,255,.018) !important;
  }
  .bk-cal,
  .booking-input,
  .booking-select,
  .slot,
  .svc-info{
    border-color:rgba(243,236,220,.105) !important;
    background:rgba(7,7,7,.32) !important;
    box-shadow:none;
  }
  .rev-hero,
  .rev-section,
  .rev-inclui{
    border-color:rgba(243,236,220,.10) !important;
    background:rgba(255,255,255,.016) !important;
  }
  .rev-hero::before{
    background:linear-gradient(90deg,transparent,rgba(243,236,220,.20),transparent) !important;
  }
  .bk-nav{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .bk-avancar,
  #bkEnviar{
    width:auto !important;
    min-width:0 !important;
    min-height:40px !important;
    margin-left:auto;
    padding:10px 18px !important;
    font-size:.70rem !important;
    letter-spacing:.085em !important;
  }
  #bkPanel:has(.bk-etapa[data-etapa="6"]:not([hidden])) #bkEnviar{
    min-width:0 !important;
  }
}
@media (max-width:420px){
  .bk-avancar,
  #bkEnviar{
    min-height:38px !important;
    padding:9px 16px !important;
    font-size:.68rem !important;
  }
}
