/*
 * funcionalidades-v2.css: só o que é da página Funcionalidades v2 (rodada 10, 13/10/2026). O comum está em assets/css/v2.css
 * (incluindo a seção 24, a moldura .tela-pc). Texto em _spec/04-COPY/funcionalidades-v2.md.
 * Estrutura: 1 gates; 2 herói; 3 índice das áreas preso ao topo; 4 as dez áreas (cabeça, tela, lista de itens em <details>);
 * 5 as telas de computador desta página (estáticas, claras, com dados do elenco fictício); 6 movimento (uma ação por tela);
 * 7 implantado com você e fechamento.
 * Nota para o v2.css: nada genérico foi preciso. O que a moldura .tela-pc não cobre (automação em linha no celular, lateral
 * recolhida no herói) está aqui, com seletor da página.
 */

/* ============================================================ */
/* 1. Gates: o que a spec marca [G-023], [G-P7] e [G-PLANO]       */
/*    Mecanismo único em assets/css/v2.css (seção 0b): data-gate="v023|qr|planos" e data-sem-gate. */
/* ============================================================ */
.pagina--funcionalidades-v2 h1 > span, .pagina--funcionalidades-v2 .heroi__apoio > span{ display: inline; }


/* ============================================================ */
/* 2. Herói: oferta à esquerda, tela de Conversas à direita        */
/* ============================================================ */
.pagina--funcionalidades-v2 .heroi{ display: block; min-height: 0; background: var(--papel); }
.heroi__grade{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(2rem, 4vw, 3rem);
  align-items: center;
  padding-block: calc(var(--cabecalho-h) + 2rem) clamp(2.5rem, 5vw, 4.5rem);
}
.pagina--funcionalidades-v2 .heroi h1{ font-size: clamp(2.125rem, 1.35rem + 2.1vw, 3rem); line-height: 1.07; max-inline-size: 17ch; }
.pagina--funcionalidades-v2 .heroi__apoio{ margin-block-start: 1.4rem; max-inline-size: 38ch; font-size: clamp(1rem, .95rem + .25vw, 1.125rem); }
.pagina--funcionalidades-v2 .heroi__linha{ margin-block-start: .9rem; max-inline-size: 38ch; font-size: var(--t-pequeno); line-height: 1.5; color: var(--suave); }
.pagina--funcionalidades-v2 .heroi__acoes{ margin-block-start: 1.75rem; }
.pagina--funcionalidades-v2 .heroi__micro{ margin-block-start: .6rem; }
.pagina--funcionalidades-v2 .heroi__nota{ margin-block-start: 1.5rem; max-inline-size: 38ch; }
.heroi__tela{ margin: 0; min-inline-size: 0; }
@media (min-width: 1100px){
  .heroi__grade{ grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); column-gap: clamp(2rem, 3.5vw, 3.5rem); }
}
@media (max-width: 700px){
  .heroi__grade{ padding-block: calc(var(--cabecalho-h) + 1.5rem) 2rem; }
  .pagina--funcionalidades-v2 .heroi h1{ max-inline-size: none; }
}
@media (max-width: 380px){
  .pagina--funcionalidades-v2 .heroi__acoes .botao{ white-space: normal; text-align: center; max-inline-size: 100%; padding-block: .6rem; }
}


/* ============================================================ */
/* 2. Índice das áreas: preso abaixo do cabeçalho                 */
/* ============================================================ */
.pagina--funcionalidades-v2 .areas{ position: relative; }
.indice{
  position: sticky;
  top: var(--cabecalho-h);
  z-index: 40;
  background: var(--papel);
  border-block: 1px solid var(--linha-v2);
}
/* a lista vaza até a borda da janela, para o gesto de arrastar no celular; o envelope mantém o padding que o fio mede */
ul.indice__lista{
  --g: clamp(1.25rem, 5vw, 5.5rem);
  display: flex;
  align-items: stretch;
  gap: 1.75rem;
  list-style: none;
  margin: 0 calc(var(--g) * -1);
  padding: 0 var(--g);
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.indice__lista::-webkit-scrollbar{ display: none; }
.indice__lista li{ flex: none; }
.indice a{
  position: relative;
  display: inline-flex;
  align-items: center;
  min-block-size: 3rem;
  font-size: .875rem;
  line-height: 1.2;
  color: var(--suave);
  white-space: nowrap;
  text-decoration: none;
  border-block-end: 2px solid transparent;
  border-block-start: 2px solid transparent;
  transition: color 200ms var(--ease), border-color 200ms var(--ease);
}
@media (hover: hover) and (pointer: fine){ .indice a:hover{ color: #151A17; } }
.indice a:focus-visible{ outline: 2px solid var(--esm); outline-offset: 2px; border-radius: 3px; box-shadow: none; }
.indice a[aria-current="location"]{ color: var(--esm); font-weight: 500; border-block-end-color: var(--esm); }
/* ponto esmeralda: a luz do fio já passou pelo título da área */
.indice a::before{
  content: "";
  position: absolute;
  left: -.85rem; top: 50%;
  inline-size: 6px; block-size: 6px; margin-block-start: -3px;
  border-radius: 50%;
  background: var(--esm);
  transform: scale(0);
  transition: transform 350ms var(--curva);
}
.indice a.percorrida::before{ transform: scale(1); }
@media (min-width: 1180px){
  .indice__lista{ justify-content: space-between; gap: 1.25rem; overflow: visible; margin-inline: 0; padding-inline: 0; }
  .indice a::before{ left: -.8rem; }
}
@media (max-width: 1179px){
  .indice{ -webkit-mask-image: none; }
  .indice__lista{ -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent); }
}
@media (max-width: 719px){
  .indice a::before{ display: none; }
  .indice__lista{ gap: 1.5rem; }
}
@media (prefers-reduced-motion: reduce){
  .indice a, .indice a::before{ transition: none; }
}



/* contador discreto ao lado do índice (DM Mono, sem animar) e fôlego para as dez áreas */
.indice__envelope{ display: flex; align-items: center; gap: 1.5rem; }
ul.indice__lista{ flex: 1 1 auto; min-inline-size: 0; }
.indice__total{ display: none; flex: none; max-inline-size: none; margin: 0; font-size: .8125rem; color: var(--suave); white-space: nowrap; }
.indice__total .num{ color: var(--esm); }
@media (min-width: 1180px){
  ul.indice__lista{ justify-content: flex-start; gap: 1.25rem; overflow-x: auto; margin-inline: 0; padding-inline: 0; }
  .indice a{ font-size: .8125rem; }
  .indice a::before{ left: -.8rem; }
}
@media (min-width: 1500px){
  ul.indice__lista{ justify-content: space-between; gap: 1.25rem; overflow: visible; }
  .indice__total{ display: block; }
}
@media (max-width: 1179px){
  .indice__envelope{ gap: 0; }
}


/* ============================================================ */
/* 4. As áreas                                                    */
/* ============================================================ */
.area{
  padding-block: var(--secao);
  /* o título cai logo abaixo do cabeçalho e do índice, não depois do respiro da seção */
  scroll-margin-top: calc(var(--cabecalho-h) + 4rem - var(--secao));
}
.area__cab{ display: grid; gap: 1.1rem; }
.area__cab h2{ font-size: clamp(1.875rem, 1.2rem + 1.7vw, 2.9rem); line-height: 1.1; max-inline-size: 22ch; }
.area__apoio{ font-size: clamp(1rem, .95rem + .25vw, 1.125rem); line-height: 1.5; max-inline-size: 52ch; }
.area__tela{ margin: clamp(1.75rem, 3.5vw, 2.75rem) 0 0; min-inline-size: 0; }
.area__tela > .sim__legenda{ margin-block-start: .9rem; max-inline-size: none; }
.area__tela .area__anot{ display: block; margin-block-start: .35rem; }
.pagina--funcionalidades-v2 .tela-pc{ max-inline-size: 68.75rem; margin-inline: 0; }
.pagina--funcionalidades-v2 .area .nota.area__nota{ margin-block-start: 1.25rem; max-inline-size: 70ch; }
.pagina--funcionalidades-v2 .area .itens + .area__nota{ margin-block-start: 1.5rem; }
.area__links{ display: flex; flex-wrap: wrap; gap: .25rem 1.75rem; margin-block-start: 1rem; max-inline-size: none; }
.link-sub{
  display: inline-flex; align-items: center; min-block-size: 2.75rem;
  font-size: var(--t-pequeno); font-weight: 500; color: var(--esm);
  text-decoration: underline; text-underline-offset: .3em; text-decoration-thickness: 1px;
  border-radius: 3px;
}
@media (hover: hover) and (pointer: fine){ .link-sub:hover{ text-decoration-thickness: 2px; } }
.link-sub:focus-visible{ outline: 2px solid var(--esm); outline-offset: 2px; box-shadow: none; }
.area .cta-meio{ margin-block-start: clamp(2rem, 4vw, 3rem); }

/* a lista: rótulo curto, detalhe ao clicar; sem ícone por item; duas colunas no desktop, uma no celular */
ul.itens{
  list-style: none;
  margin: clamp(1.75rem, 3.5vw, 2.75rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: clamp(2rem, 5vw, 4.5rem);
  align-items: stretch;
  border-block-start: 1px solid var(--linha-v2);
  max-inline-size: none;
}
@media (min-width: 760px){ ul.itens{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.itens__li{ border-block-end: 1px solid var(--linha-v2); min-inline-size: 0; }
.item{ min-inline-size: 0; }
.item__sum{
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-block-size: 3.5rem; padding-block: .6rem;
  list-style: none; cursor: pointer;
  font-size: 1.0625rem; line-height: 1.35; font-weight: 500; color: #151A17;
  border-radius: 4px;
}
.item__sum::-webkit-details-marker{ display: none; }
.item__sum::marker{ content: ""; }
.item__rot{ min-inline-size: 0; text-wrap: pretty; }
.item__sum:focus-visible{ outline: 2px solid var(--esm); outline-offset: 2px; box-shadow: none; }
@media (hover: hover) and (pointer: fine){ .item__sum:hover .item__rot{ color: var(--esm); } }
/* indicador de abrir: mais e menos desenhados em CSS (controle, não ícone de item) */
.item__ind{ position: relative; flex: none; inline-size: 1.5rem; block-size: 1.5rem; border: 1px solid var(--linha-v2); border-radius: 50%; background: #fff; transition: background-color 200ms var(--ease), border-color 200ms var(--ease); }
.item__ind::before, .item__ind::after{ content: ""; position: absolute; inset: 50% auto auto 50%; inline-size: .6rem; block-size: 1.5px; margin: -.75px 0 0 -.3rem; background: var(--esm); transition: transform 220ms var(--curva); }
.item__ind::after{ transform: rotate(90deg); }
.item[open] > .item__sum .item__ind{ background: #DCEFE7; border-color: #BFE0D2; }
.item[open] > .item__sum .item__ind::after{ transform: rotate(0deg); }
.item__det{ margin: 0; padding: 0 2.5rem 1.15rem 0; max-inline-size: 52ch; font-size: .9688rem; line-height: 1.6; color: var(--corpo); }
@media (prefers-reduced-motion: no-preference){
  .item[open] > .item__det{ animation: item-abre 260ms var(--curva); }
}
@keyframes item-abre{ from{ opacity: 0; transform: translateY(-4px); } to{ opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce){ .item__ind, .item__ind::before, .item__ind::after{ transition: none; } }


/* ============================================================ */
/* 5. As telas de computador desta página                         */
/*    Estáticas: HTML e CSS, rótulos de 00-FONTES (d), dados do elenco.json. Sempre claras (data-theme="light" no .ar-app). */
/* ============================================================ */
.pagina--funcionalidades-v2 .tela-pc__conteudo > .pc.ar-app{
  flex: 1 1 auto; inline-size: auto; block-size: auto; overflow: clip;
  display: flex; flex-direction: column; gap: 14px;
  padding: 16px 20px 22px;
  font-size: 13px; line-height: 1.45;
}
.pc-tela .tela-pc__janela{ min-block-size: calc(100cqw / 1.75 - 30px); }
.pc .pc-cab{ display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; }
.pc .pc-tit{ font-size: 19px; font-weight: 600; line-height: 1.25; color: var(--text); letter-spacing: 0; }
.pc .pc-desc{ margin-block-start: 2px; font-size: 13px; line-height: 1.4; color: var(--text-muted); }
.pc .pc-acoes{ display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.pc .pc-card{ border: 1px solid var(--border); border-radius: 6px; background: var(--surface); box-shadow: var(--shadow-sm); padding: 14px 16px; min-inline-size: 0; }
.pc .pc-rot{ font-size: 12px; font-weight: 600; line-height: 1.4; text-transform: uppercase; letter-spacing: .025em; color: var(--text-muted); }
.pc .ar-botao{ font-size: 13px; }
.pc .ar-badge{ font-size: 12px; }
.pc-tela .selo-ia{ font-size: 12px; }

/* herói: a moldura com lateral recolhida (cabe a conversa e o Copiloto) */
.pc-tela--hero .tela-pc__janela{ --lat-w: 60px; --lat-rot: none; --lat-tit: none; --lat-just: center; --lat-pad: 0; --lat-marca: 0px; }
.pc-tela--hero .tela-pc__janela{ min-block-size: 0; }
.pc-tela--hero .pc{ padding-block-end: 18px; }

/* -- Conversas (herói): lista, conversa e Copiloto -- */
.pc .cv__av{ font-size: 12px; }
.hv{ flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.1fr) minmax(0, 1fr); border: 1px solid var(--border); border-radius: 6px; background: var(--surface); overflow: hidden; }
.pc .hv-lista{ min-inline-size: 0; display: flex; flex-direction: column; border-inline-end: 1px solid var(--border); background: #FBFCFB; }
.pc .hv-abas{ display: flex; gap: 2px; padding: 6px 8px 0; border-block-end: 1px solid var(--border); background: #fff; }
.pc .hv-aba{ padding: 6px 8px; font-size: 12px; color: var(--text-muted); border-block-end: 2px solid transparent; }
.pc .hv-aba--at{ color: var(--text); font-weight: 600; border-color: var(--primary); }
.pc .hv-busca{ margin: 8px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 12px; color: var(--text-subtle); }
.pc .hv-linhas{ list-style: none; margin: 0; padding: 0; }
.pc .hv-linha{ display: flex; gap: 8px; padding: 10px; border-block-start: 1px solid var(--border); }
.pc .hv-linha--at{ background: #EAF4EF; }
.pc .hv-linha .ar-av{ margin-block-start: 2px; }
.pc .hv-linha__corpo{ flex: 1 1 auto; min-inline-size: 0; }
.pc .hv-linha__topo{ display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
.pc .hv-linha__nome{ font-size: 13px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc .hv-linha__tempo{ flex: none; font-size: 12px; color: var(--text-muted); }
.pc .hv-linha__prev{ margin-block-start: 1px; font-size: 12px; line-height: 1.35; color: var(--text-body); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pc .hv-linha__canal{ display: flex; flex-wrap: wrap; gap: 4px; margin-block-start: 5px; }
.hv .cv{ border-inline-end: 1px solid var(--border); }
.hv .cv__msgs{ min-block-size: 8rem; }
.hv .cv__bolha, .cop .cv__bolha{ font-size: 14px; line-height: 1.5; }
.hv .cv__campo{ min-block-size: 3.75rem; font-size: 13px; }
.hv .cp__sug, .cop .cp__sug{ font-size: 13.5px; line-height: 1.5; }
.hv .cp__corpo{ padding: 12px; gap: 10px; }
.hv .cp__btn{ min-block-size: 2rem; padding-inline: .6rem; }
.hv .cp__evid{ font-size: 12px; }
.hv .cv__nome{ font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hv .cv__barra{ gap: 6px; padding-inline: .7rem; }
.hv .cv__canal{ flex: none; padding-inline: .5rem; }
.hv .cp__tempo{ display: none; }
@container tpc-c (max-width: 620px){
  .hv{ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pc .hv-lista{ display: none; }
}
@container tpc-c (max-width: 470px){
  .hv{ grid-template-columns: minmax(0, 1fr); }
  .hv .cv{ border-inline-end: 0; border-block-end: 1px solid var(--border); }
}

/* -- Agentes IA -- */
.ag{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 14px; align-items: start; }
.pc .ag-agente__topo{ display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin-block-end: 14px; }
.pc .ag-agente__ic{ display: grid; place-items: center; flex: none; inline-size: 36px; block-size: 36px; border-radius: 50%; background: #DCEFE7; color: var(--primary); }
.pc .ag-agente__nome{ font-size: 15px; font-weight: 600; color: var(--text); }
.pc .ag-agente__sub{ font-size: 12px; color: var(--text-muted); }
.pc .ag-agente__topo .ar-badge{ margin-inline-start: auto; }
.pc .ag-modos{ display: flex; margin-block-start: 6px; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.pc .ag-modo{ flex: 1 1 0; padding: 7px 4px; text-align: center; font-size: 12px; line-height: 1.3; color: var(--text-muted); border-inline-start: 1px solid var(--border); background: #fff; }
.pc .ag-modo:first-child{ border-inline-start: 0; }
.pc .ag-modo--at{ background: var(--primary); color: #fff; font-weight: 600; }
.pc .ag-agente__rot2{ margin-block-start: 16px; }
.pc .ag-kpis{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-block-start: 8px; }
.pc .ag-kpi{ padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.pc .ag-kpi__n{ display: block; font-size: 22px; line-height: 1; color: var(--text); }
.pc .ag-kpi__r{ display: block; margin-block-start: 6px; font-size: 12px; line-height: 1.3; color: var(--text-muted); }
.pc .ag-lado{ display: grid; gap: 14px; min-inline-size: 0; }
.pc .ag-cards{ list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pc .ag-card{ position: relative; display: flex; align-items: center; min-block-size: 46px; padding: 8px 28px 8px 10px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 13px; font-weight: 500; line-height: 1.25; color: var(--text); transition: border-color 250ms var(--ease), background-color 250ms var(--ease); }
.pc .ag-card--sel{ border-color: var(--primary); background: #EAF4EF; }
.pc .ag-card__ok{ position: absolute; inset-inline-end: 8px; inset-block-start: 50%; margin-block-start: -7px; color: var(--primary); display: flex; }
.pc .ag-card--zero{ padding-inline-end: 10px; border-style: dashed; border-color: var(--border-strong); color: var(--text-body); }
.pc .ag-card__mais{ display: flex; margin-inline-end: 6px; color: var(--text-muted); }
.pc .ag-momentos{ margin-block-start: 14px; }
.pc .ag-form__txt{ margin-block-start: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 13px; line-height: 1.55; color: var(--text); }
.pc .ag-form__tom{ display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-block-start: 10px; }
.pc .ag-form__rot{ margin-inline-end: 4px; font-size: 12px; font-weight: 600; color: var(--text-muted); }
.pc .ag-tom{ padding: 3px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; font-size: 12px; }
.pc .ag-tom--at{ border-color: var(--primary); background: #DCEFE7; color: var(--primary); font-weight: 600; }
@container tpc-c (max-width: 700px){
  .ag{ grid-template-columns: minmax(0, 1fr); }
}
@container tpc-c (max-width: 430px){
  .pc .ag-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc .ag-kpi__n{ font-size: 20px; }
}

/* -- Copiloto: conversa e painel grande -- */
.cop{ flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); border: 1px solid var(--border); border-radius: 6px; background: var(--surface); overflow: hidden; }
.cop .cv__msgs{ min-block-size: 11rem; }
.pc .cop-cp .cp__corpo{ padding: 16px; gap: 12px; }
.pc .cop-acao{ display: inline-flex; align-items: center; gap: 5px; color: var(--primary); font-weight: 600; }
.cop .cp__btn{ min-block-size: 2.25rem; }
@container tpc-c (max-width: 560px){
  .cop{ grid-template-columns: minmax(0, 1fr); }
  .cop .cv{ border-inline-end: 0; border-block-end: 1px solid var(--border); }
  .cop .cv__msgs{ min-block-size: 9rem; }
}

/* -- Funil: cinco etapas e o painel da negociação -- */
.pc .fn-cab{ align-items: center; }
.pc .fn-chips{ display: flex; flex-wrap: wrap; gap: 8px; }
.pc .fn-chip{ display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-2); font-size: 12px; line-height: 1.3; color: var(--text-body); }
.pc .fn-chip--acc{ background: #F8F1E0; border-color: #E6D5AE; }
.pc .fn-etapas{ list-style: none; margin: 0; padding: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; font-size: 12px; color: var(--text-body); }
.pc .fn-etapas li{ display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.pc .fn-etapas li::before{ content: ""; inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--et); }
.pc .fn-etapas li + li{ margin-inline-start: 6px; padding-inline-start: 12px; position: relative; }
.pc .fn-etapas li + li::after{ content: ""; position: absolute; inset-inline-start: 0; inset-block-start: 50%; inline-size: 6px; block-size: 6px; margin-block-start: -3px; border-inline-end: 1.5px solid var(--border-strong); border-block-start: 1.5px solid var(--border-strong); transform: rotate(45deg) scale(.8); }
.pc .fn-etapas .ar-n{ color: var(--text-muted); }
@container tpc-c (max-width: 700px){ .fn-etapas{ display: none; } }
.fn{ position: relative; min-inline-size: 0; }
.pc .fn-quadro{ overflow-x: auto; scrollbar-width: none; padding-block-end: 2px; }
.pc .fn-quadro::-webkit-scrollbar{ display: none; }
.pc .fn-cols{ list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: 176px; gap: 10px; align-items: start; }
.pc .fn-col{ min-inline-size: 0; }
.pc .fn-col__cab{ padding: 8px 10px; border: 1px solid var(--border); border-block-start: 3px solid var(--et); border-radius: 6px; background: #fff; }
.pc .fn-col__linha{ display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--text); }
.pc .fn-col__ponto{ flex: none; inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--et); }
.pc .fn-col__nome{ min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc .fn-col__n{ margin-inline-start: auto; padding: 0 6px; border-radius: 999px; background: var(--surface-2); font-size: 12px; font-weight: 400; color: var(--text-muted); }
.pc .fn-col__soma{ margin-block-start: 2px; font-size: 12px; color: var(--text-muted); }
.pc .fn-col__corpo{ list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.pc .fn-lead{ position: relative; padding: 9px 10px 8px; border: 1px solid var(--border); border-radius: 6px; background: #fff; transition: border-color 300ms var(--ease); }
.pc .fn-lead--aviso::before, .pc .fn-lead--vence::before{ content: ""; position: absolute; inset-inline-start: 0; inset-block: 10px; inline-size: 3px; border-radius: 0 2px 2px 0; transition: opacity 300ms var(--ease); }
.pc .fn-lead--aviso::before{ background: var(--warning); }
.pc .fn-lead--vence::before{ background: var(--danger); }
.pc .fn-lead__topo{ display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.pc .fn-lead__nome{ min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; color: var(--text); }
.pc .fn-lead__tempo{ flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 12px; color: var(--text-muted); transition: color 300ms var(--ease); }
.pc .fn-lead__proc{ margin-block-start: 1px; font-size: 12px; line-height: 1.35; color: var(--text-body); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc .fn-lead__pe{ display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-block-start: 7px; }
.pc .fn-lead__dono{ display: inline-flex; align-items: center; gap: 5px; min-inline-size: 0; font-size: 12px; color: var(--text-muted); }
.pc .fn-lead__valor{ flex: none; font-size: 12px; color: var(--text); }
.pc .fn-painel{ min-inline-size: 0; margin-block-start: 12px; max-inline-size: 34rem; }
.pc .fn-painel__tit{ font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .025em; color: var(--text-muted); }
.pc .fn-painel__nome{ margin-block-start: 4px; font-size: 16px; font-weight: 600; color: var(--text); }
.pc .fn-painel__sub{ font-size: 13px; color: var(--text-muted); }
.pc .fn-painel__dl{ margin: 10px 0 12px; display: grid; gap: 7px; }
.pc .fn-painel__dl > div{ display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.pc .fn-painel__dl dt{ color: var(--text-muted); }
.pc .fn-painel__dl dd{ margin: 0; text-align: end; color: var(--text); }
.pc .fn-orc{ margin-block-start: 6px; padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.pc .fn-orc__linha{ display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 600; color: var(--text); }
.pc .fn-orc__sub{ margin-block-start: 3px; font-size: 12px; color: var(--text-muted); }
@container tpc-c (min-width: 870px){
  .fn{ display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 14px; align-items: start; }
  .pc .fn-painel{ margin: 0; }
  .pc .fn-quadro{ -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
}
@container tpc-c (max-width: 869px){
  .pc .fn-quadro{ -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
}

/* -- Pacientes: ficha com abas -- */
.pc .pt-cab{ display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; }
.pc .pt-id{ display: flex; align-items: center; gap: 12px; }
.pc .pt-id__nome{ font-size: 19px; font-weight: 600; line-height: 1.25; color: var(--text); }
.pc .pt-id__sub{ display: flex; flex-wrap: wrap; gap: 6px; margin-block-start: 4px; }
.pc .pt-abas{ display: flex; gap: 4px; border-block-end: 1px solid var(--border); }
.pc .pt-aba{ display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 13px; color: var(--text-muted); border-block-end: 2px solid transparent; margin-block-end: -1px; }
.pc .pt-aba--at{ color: var(--text); font-weight: 600; border-color: var(--primary); }
.pc .pt-aba__cad{ display: flex; color: var(--text-subtle); }
.pt{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.pc .pt-col{ display: grid; gap: 14px; min-inline-size: 0; }
.pc .pt-stats{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-block-start: 10px; }
.pc .pt-stat{ padding: 9px 10px; border-radius: 6px; background: var(--surface-2); }
.pc .pt-stat__n{ display: block; font-size: 21px; line-height: 1; color: var(--text); }
.pc .pt-stat__r{ display: block; margin-block-start: 5px; font-size: 12px; color: var(--text-muted); }
.pc .pt-proxima__rot{ margin-block-start: 14px; font-size: 13px; font-weight: 600; color: var(--text); }
.pc .pt-vazio{ margin-block-start: 4px; font-size: 13px; color: var(--text-muted); }
.pc .pt-acao{ display: grid; gap: 3px; margin-block-start: 6px; padding: 9px 10px; border: 1px solid var(--border); border-inline-start: 3px solid var(--primary); border-radius: 6px; background: #fff; }
.pc .pt-acao__tit{ font-size: 13px; font-weight: 600; color: var(--text); }
.pc .pt-acao__meta{ display: flex; gap: 12px; font-size: 12px; color: var(--text-muted); }
.pc .pt-dl{ margin: 10px 0 0; display: grid; gap: 7px; }
.pc .pt-dl > div{ display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.pc .pt-dl dt{ color: var(--text-muted); }
.pc .pt-dl dd{ margin: 0; color: var(--text); }
.pc .pt-pacote__nome{ margin-block-start: 6px; font-size: 15px; font-weight: 600; color: var(--text); }
.pc .pt-pacote__sub{ display: flex; align-items: center; gap: 8px; margin-block-start: 4px; font-size: 12px; color: var(--text-muted); }
.pc .pt-pacote__aviso{ margin-block: 12px; font-size: 13px; line-height: 1.45; color: var(--text-body); }
.pc .pt-pacote .ar-botao{ inline-size: fit-content; }
@container tpc-c (max-width: 640px){
  .pt{ grid-template-columns: minmax(0, 1fr); }
}

/* -- Agenda: três profissionais em colunas -- */
.pc .ag-resumo{ display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.pc .ag-resumo__tx{ font-size: 12px; color: var(--text-muted); }
.gd{ display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 14px; align-items: start; }
.pc .gd-grade{ min-inline-size: 0; overflow-x: auto; border: 1px solid var(--border); border-radius: 6px; background: #fff; scrollbar-width: none; }
.pc .gd-grade::-webkit-scrollbar{ display: none; }
.pc .gd-cab, .pc .gd-corpo{ display: grid; grid-template-columns: 44px repeat(3, minmax(148px, 1fr)); }
.pc .gd-cab{ border-block-end: 1px solid var(--border); background: #FBFCFB; }
.pc .gd-prof{ padding: 8px 8px; border-inline-start: 1px solid var(--border); font-size: 12px; font-weight: 600; line-height: 1.3; color: var(--text); }
.pc .gd-corpo{ --u: 100px; }
.pc .gd-horas{ display: grid; grid-template-rows: repeat(4, var(--u)); }
.pc .gd-horas span{ padding: 4px 6px 0 0; text-align: end; font-size: 12px; color: var(--text-muted); }
.pc .gd-col{ position: relative; block-size: calc(var(--u) * 4); border-inline-start: 1px solid var(--border); background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--u) - 1px), var(--border) calc(var(--u) - 1px), var(--border) var(--u)); }
.pc .ag-ap{ position: absolute; inset-inline: 4px; inset-block-start: calc(var(--top) * var(--u) + 3px); block-size: calc(var(--alt) * var(--u) - 6px); display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 6px 8px; border: 1px solid var(--border); border-inline-start: 3px solid var(--primary); border-radius: 6px; background: #fff; overflow: hidden; }
.pc .ag-ap__pac{ font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--text); }
.pc .ag-ap__proc{ font-size: 12px; line-height: 1.3; color: var(--text-body); }
.pc .ag-ap .ar-badge{ margin-block-start: auto; white-space: normal; }
.pc .ag-ap--pacote{ border-inline-start-color: var(--chart-3); }
.pc .ag-ap--pre{ border-style: dashed; border-color: var(--accent-hover); border-inline-start: 3px dashed var(--accent-hover); background: #FBF7EE; }
.pc .ag-ap--cancela{ transition: opacity 350ms var(--ease); }
.pc .ag-vaga{ position: absolute; inset-inline: 4px; inset-block-start: calc(var(--top) * var(--u) + 3px); block-size: calc(var(--u) - 6px); display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 6px 10px; border: 1px dashed var(--border-strong); border-radius: 6px; background: #F1F4F2; }
.pc .ag-vaga__hora{ font-size: 12px; color: var(--text-muted); }
.pc .ag-vaga__tx{ font-size: 13px; font-weight: 600; color: var(--text-body); }
.pc .gd-encaixe__tit{ margin-block-start: 6px; font-size: 14px; font-weight: 600; color: var(--text); }
.pc .gd-encaixe__sub{ margin-block-start: 1px; font-size: 12px; color: var(--text-muted); }
.pc .gd-encaixe__cand{ display: flex; align-items: flex-start; gap: 10px; margin-block: 12px; padding: 10px; border-radius: 6px; background: var(--surface-2); }
.pc .gd-encaixe__nome{ display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 13px; font-weight: 600; color: var(--text); }
.pc .gd-encaixe__esp{ margin-block-start: 2px; font-size: 12px; line-height: 1.35; color: var(--text-muted); }
@container tpc-c (max-width: 760px){
  .gd{ grid-template-columns: minmax(0, 1fr); }
}

/* -- Automações: fluxo em linha, painel do bloco -- */
.pc .au-cab{ display: grid; gap: 4px; }
.pc .au-voltar{ display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--text-muted); }
.au{ display: grid; grid-template-columns: minmax(0, 1fr) 224px; gap: 14px; align-items: stretch; }
.pc .au-main{ min-inline-size: 0; display: flex; flex-direction: column; gap: 10px; }
.pc .au-quadro{ flex: 1 1 auto; min-block-size: 20rem; min-inline-size: 0; display: flex; align-items: center; overflow-x: auto; padding: 34px 16px; border: 1px solid var(--border); border-radius: 6px; background-color: #FBFCFB; background-image: radial-gradient(circle, #D5DCD8 1px, transparent 1.3px); background-size: 18px 18px; scrollbar-width: none; }
.pc .au-quadro::-webkit-scrollbar{ display: none; }
.pagina--funcionalidades-v2 .au .nos{ flex: 1 1 auto; min-inline-size: 0; flex-direction: row; align-items: stretch; }
.pagina--funcionalidades-v2 .au .tipos{ padding: .6rem .9rem; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 12px; }
.pagina--funcionalidades-v2 .au .tipos__item{ font-size: 12px; }
.pagina--funcionalidades-v2 .au .no{ flex: 1 1 0; min-inline-size: 6.6rem; max-inline-size: 11.5rem; padding: .75rem .8rem .85rem; }
.pagina--funcionalidades-v2 .au .no__txt{ font-size: 13px; line-height: 1.4; }
.pagina--funcionalidades-v2 .au .no__tipo{ font-size: 12px; }
.pagina--funcionalidades-v2 .au .lig{ flex: 0 0 1.2rem; inline-size: auto; block-size: 1px; align-self: center; clip-path: inset(-6px -6px -6px 0); }
.pagina--funcionalidades-v2 .au .lig::after{ right: -1px; left: auto; top: -3px; bottom: auto; border-inline-start: 6px solid #8E9A93; border-inline-end: 0; border-block: 3.5px solid transparent; }
.pagina--funcionalidades-v2 .tela-pc.fluxo--anim .au .lig:not(.on){ clip-path: inset(-6px 100% -6px 0); }
.pagina--funcionalidades-v2 .tela-pc.fluxo--anim .au .no:not(.on){ opacity: 0; transform: translateY(8px); }
.no--sel{ box-shadow: 0 0 0 2px var(--primary), 0 8px 18px -10px rgba(11, 61, 46, .45); }
.no.on--agora{ box-shadow: 0 0 0 2px rgba(11, 61, 46, .55), 0 0 0 7px rgba(11, 61, 46, .1); }
.no--sel.on--agora{ box-shadow: 0 0 0 2px var(--primary), 0 0 0 7px rgba(11, 61, 46, .12); }
.pc .au-painel__tit{ margin-block-start: 6px; font-size: 16px; font-weight: 600; color: var(--text); }
.pc .au-painel__lab{ margin-block-start: 12px; font-size: 12px; font-weight: 600; color: var(--text-muted); }
.pc .au-painel__campo{ display: flex; gap: 8px; margin-block-start: 5px; }
.pc .au-campo{ display: inline-flex; align-items: center; gap: 6px; min-inline-size: 3rem; padding: 7px 11px; border: 1px solid var(--border-strong); border-radius: 6px; background: #fff; font-size: 14px; color: var(--text); }
.pc .au-campo--sel{ flex: 1 1 auto; justify-content: space-between; font-family: var(--font-body); }
.pc .au-painel__dica{ margin-block-start: 12px; font-size: 12px; line-height: 1.45; color: var(--text-muted); }
@container tpc-c (max-width: 700px){
  .au{ grid-template-columns: minmax(0, 1fr); }
  .pc .au-quadro{ padding-inline: 14px; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 30px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 30px), transparent); }
  /* nunca empilha: a linha segue na horizontal e rola dentro da moldura */
  .pagina--funcionalidades-v2 .au .nos{ flex-direction: row; }
  .pagina--funcionalidades-v2 .au .no{ flex: 0 0 9.5rem; max-inline-size: none; }
  .pagina--funcionalidades-v2 .au .lig{ flex: 0 0 1.4rem; inline-size: auto; block-size: 1px; clip-path: inset(-6px -6px -6px 0); }
  .pagina--funcionalidades-v2 .au .lig::after{ right: -1px; left: auto; top: -3px; bottom: auto; border-inline-start: 6px solid #8E9A93; border-inline-end: 0; border-block: 3.5px solid transparent; }
  .pagina--funcionalidades-v2 .tela-pc.fluxo--anim .au .lig:not(.on){ clip-path: inset(-6px 100% -6px 0); }
}

/* -- Campanhas: da resposta ao tratamento -- */
.pc .cm-voltar{ display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--text-muted); }
.cm{ display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 14px; align-items: start; }
.pc .cm-card__tit{ font-size: 15px; font-weight: 600; color: var(--text); }
.pc .cm-funil{ list-style: none; margin: 12px 0 0; padding: 0; }
.pc .cm-linha{ display: grid; grid-template-columns: minmax(7.5rem, 11rem) minmax(0, 1fr) 2rem; align-items: center; gap: 10px; padding-block: 8px; border-block-start: 1px solid var(--border); font-size: 13px; }
.pc .cm-linha:first-child{ border-block-start: 0; }
.pc .cm-linha__rot{ color: var(--text-body); line-height: 1.3; }
.pc .cm-linha__barra{ display: block; block-size: 10px; border-radius: 5px; background: var(--surface-2); overflow: hidden; }
.pc .cm-linha__barra i{ display: block; block-size: 100%; inline-size: var(--w); border-radius: 5px; background: var(--primary); transform-origin: 0 50%; }
.pc .cm-linha__barra--fim{ background: var(--stage-open-3); }
.pc .cm-linha__n{ text-align: end; color: var(--text); }
.pc .cm-lado{ display: grid; gap: 14px; min-inline-size: 0; }
.pc .cm-total__n{ margin-block-start: 6px; font-size: 26px; line-height: 1.1; color: var(--text); }
.pc .cm-total__sub{ margin-block-start: 6px; font-size: 12px; color: var(--text-muted); }
.pc .cm-total__aviso{ margin-block-start: 8px; padding: 7px 9px; border-radius: 6px; background: #F8F1E0; font-size: 12px; line-height: 1.4; color: var(--text); }
.pc .cm-prot__lista{ list-style: none; margin: 8px 0 0; padding: 0; }
.pc .cm-prot__lista li{ display: flex; justify-content: space-between; gap: 10px; padding-block: 7px; border-block-start: 1px solid var(--border); font-size: 13px; color: var(--text-body); }
.pc .cm-prot__lista li:first-child{ border-block-start: 0; }
@container tpc-c (max-width: 680px){
  .cm{ grid-template-columns: minmax(0, 1fr); }
}
@container tpc-c (max-width: 440px){
  .pc .cm-linha{ grid-template-columns: 6.6rem minmax(0, 1fr) 1.8rem; gap: 8px; }
}

/* -- Indicadores: Relatórios, quatro blocos -- */
.pc .rl-periodo{ display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--border-strong); border-radius: 6px; background: #fff; font-size: 13px; color: var(--text-body); }
.rl{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pc .rl-bloco__tit{ font-size: 14px; font-weight: 600; color: var(--text); }
.pc .rl-origem{ list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.pc .rl-linha{ display: grid; grid-template-columns: 4.6rem minmax(0, 1fr) 1.8rem; align-items: center; gap: 8px; font-size: 13px; }
.pc .rl-linha__rot{ color: var(--text-body); }
.pc .rl-linha__barra{ display: block; block-size: 9px; border-radius: 5px; background: var(--surface-2); overflow: hidden; }
.pc .rl-linha__barra i{ display: block; block-size: 100%; inline-size: var(--w); border-radius: 5px; background: var(--c, var(--primary)); transform-origin: 0 50%; }
.pc .rl-linha__n{ text-align: end; color: var(--text); }
.pc .rl-perdas{ display: flex; align-items: center; gap: 14px; margin-block-start: 10px; }
.pc .rl-rosca{ position: relative; flex: none; inline-size: 92px; block-size: 92px; border-radius: 50%; display: grid; place-items: center;
  background: conic-gradient(#A3302B 0 31%, #875B17 31% 58.6%, #C77D78 58.6% 75.9%, #BFE0D2 75.9% 86.2%, #556059 86.2% 93.1%, #8E9A93 93.1% 100%); }
.pc .rl-rosca::before{ content: ""; position: absolute; inset: 15px; border-radius: 50%; background: var(--surface); }
.pc .rl-rosca b{ position: relative; font-size: 16px; font-weight: 400; color: var(--text); }
.pc .rl-perdas__lista{ list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; flex: 1 1 auto; min-inline-size: 0; }
.pc .rl-perda{ display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 7px; font-size: 12.5px; color: var(--text-body); }
.pc .rl-perda__ponto{ inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--c); }
.pc .rl-perda__n{ color: var(--text); }
.pc .rl-closers{ margin-block-start: 10px; }
.pc .rl-closers__cab, .pc .rl-closer{ display: grid; grid-template-columns: minmax(0, 1fr) 3.4rem 4.2rem 7rem; align-items: center; gap: 8px; }
.pc .rl-closers__cab{ padding-block-end: 6px; font-size: 12px; font-weight: 600; color: var(--text-muted); }
.pc .rl-closers__cab span:not(:first-child){ text-align: end; }
.pc .rl-closers ul{ list-style: none; margin: 0; padding: 0; }
.pc .rl-closer{ padding-block: 7px; border-block-start: 1px solid var(--border); font-size: 13px; color: var(--text-body); }
.pc .rl-closer > .ar-n{ text-align: end; }
.pc .rl-closer__nome{ display: flex; align-items: center; gap: 8px; min-inline-size: 0; font-weight: 600; color: var(--text); }
.pc .rl-closer__nome > span:last-child{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc .rl-closer__conv{ display: flex; align-items: center; gap: 6px; justify-content: flex-end; }
.pc .rl-closer__conv .rl-linha__barra{ flex: 1 1 auto; min-inline-size: 1.5rem; }
.pc .rl-nums{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-block-start: 10px; }
.pc .rl-nums > div{ padding: 10px; border-radius: 6px; background: var(--surface-2); }
.pc .rl-nums__n{ display: block; font-size: 22px; line-height: 1; color: var(--text); }
.pc .rl-nums__r{ display: block; margin-block-start: 6px; font-size: 12px; color: var(--text-muted); }
@container tpc-c (max-width: 640px){
  .rl{ grid-template-columns: minmax(0, 1fr); }
}
@container tpc-c (max-width: 440px){
  .pc .rl-perdas{ flex-direction: column; align-items: flex-start; }
  .pc .rl-closers__cab, .pc .rl-closer{ grid-template-columns: minmax(0, 1fr) 2.8rem 3.4rem 3.6rem; gap: 6px; }
  .pc .rl-closer__nome .ar-av{ display: none; }
  .pc .rl-closer__conv .rl-linha__barra{ display: none; }
  .pc .rl-nums{ grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .pc .rl-nums > div{ display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 8px 12px; }
  .pc .rl-nums__r{ margin: 0; }
}

/* -- Configurações: lista lateral, Webhooks e Perfis de acesso -- */
.cf{ display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 14px; align-items: start; }
.pc .cf-nav{ list-style: none; margin: 0; padding: 6px; border: 1px solid var(--border); border-radius: 6px; background: #fff; }
.pc .cf-nav__i{ padding: 8px 10px; border-radius: 5px; font-size: 13px; color: var(--text-body); transition: background-color 250ms var(--ease); }
.pc .cf-nav__i--at{ background: #EAF4EF; color: var(--primary); font-weight: 600; }
.pc .wh-tit{ font-size: 15px; font-weight: 600; color: var(--text); }
.pc .wh-campo{ margin-block-start: 12px; }
.pc .wh-campo__rot{ display: block; font-size: 12px; font-weight: 600; color: var(--text-muted); }
.pc .wh-campo__caixa{ display: block; margin-block-start: 4px; padding: 8px 11px; border: 1px solid var(--border-strong); border-radius: 6px; background: #fff; font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc .wh-evs__rot{ margin-block-start: 14px; }
.pc .wh-evs{ list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(5, auto); gap: 8px 16px; }
.pc .wh-ev{ display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-body); }
.pc .wh-ev__caixa{ display: grid; place-items: center; flex: none; inline-size: 18px; block-size: 18px; border: 1.5px solid var(--border-strong); border-radius: 4px; background: #fff; color: transparent; transition: background-color 250ms var(--ease), border-color 250ms var(--ease), color 250ms var(--ease); }
.pc .wh-ev--on{ color: var(--text); font-weight: 500; }
.pc .wh-ev--on .wh-ev__caixa{ background: var(--primary); border-color: var(--primary); color: #fff; }
.pc .wh-acoes{ display: flex; flex-wrap: wrap; gap: 8px; margin-block-start: 16px; }
.pc .pf-painel__tit{ font-size: 16px; font-weight: 600; color: var(--text); }
.pc .pf-painel__sub{ font-size: 12px; color: var(--text-muted); }
.pc .pf-painel--oculto{ display: none; }
.pc .pf-grupo{ margin-block-start: 14px; }
.pc .pf-perms{ list-style: none; margin: 6px 0 0; padding: 0; }
.pc .pf-perm{ display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-block-start: 1px solid var(--border); font-size: 13px; color: var(--text-body); }
.pc .pf-perm--cpf{ margin-inline: -8px; padding-inline: 8px; border-radius: 4px; background: #EAF4EF; box-shadow: inset 3px 0 0 var(--primary); color: var(--text); font-weight: 600; border-block-start-color: transparent; }
.pc .pf-chave{ position: relative; flex: none; inline-size: 34px; block-size: 20px; border-radius: 10px; background: #C5CDC8; transition: background-color 250ms var(--ease); }
.pc .pf-chave i{ position: absolute; inset: 2px auto auto 2px; inline-size: 16px; block-size: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .25); transition: transform 250ms var(--ease); }
.pc .pf-perm--on .pf-chave{ background: var(--primary); }
.pc .pf-perm--on .pf-chave i{ transform: translateX(14px); }
/* a busca em destaque (Equipe e segurança) */
.pc-tela--busca .ar-topo__busca{ border-color: var(--primary); box-shadow: 0 0 0 3px rgba(11, 61, 46, .16); }
.pc-tela--busca .ar-kbd{ background: var(--primary); border-color: var(--primary); color: #fff; }
@container tpc-c (max-width: 640px){
  .cf{ grid-template-columns: minmax(0, 1fr); }
  .pc .cf-nav{ display: flex; flex-wrap: wrap; gap: 4px; }
  .pc .wh-evs{ grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
}


/* ============================================================ */
/* 6. Movimento: uma ação real por tela. O estado final é o padrão; */
/*    só some o que ainda não chegou enquanto a classe seq-on está ligada (o JS põe e tira). */
/* ============================================================ */
@media (prefers-reduced-motion: no-preference){
  .sq-msg, .sq-cp, .sq-painel, .sq-encaixe, .sq-total, .sq-form, .sq-acao, .sq-vaga{ transition: opacity 450ms var(--curva), transform 450ms var(--curva); }
  .cp__corpo.sq-cp{ transition: opacity 450ms var(--curva), transform 450ms var(--curva); }
  .sq-barra{ transition: transform 800ms var(--curva); }
  .rl-linha:nth-child(2) .sq-barra, .cm-linha:nth-child(2) .sq-barra{ transition-delay: 90ms; }
  .rl-linha:nth-child(3) .sq-barra, .cm-linha:nth-child(3) .sq-barra{ transition-delay: 180ms; }
  .rl-linha:nth-child(4) .sq-barra, .cm-linha:nth-child(4) .sq-barra{ transition-delay: 270ms; }
  .rl-linha:nth-child(5) .sq-barra, .cm-linha:nth-child(5) .sq-barra{ transition-delay: 360ms; }

  /* conversa e Copiloto (herói e área Copiloto) */
  [data-seq].seq-on:not(.p1) .sq-msg{ opacity: 0; transform: translateY(8px); }
  [data-seq].seq-on:not(.p2) .sq-cp{ opacity: 0; transform: translateY(8px); }
  [data-seq].seq-on:not(.p3) .sq-txt{ display: none; }
  [data-seq].seq-on:not(.p3) .cv__txt ~ .cv__ph{ display: block; }
  [data-seq].seq-on.p3 .cv__enviar{ background: var(--esm); color: #fff; box-shadow: 0 0 0 3px rgba(11, 61, 46, .18); }
  [data-seq].seq-on.p3 .sq-usar{ animation: sq-aperta 520ms var(--ease); }
  @keyframes sq-aperta{ 40%{ transform: scale(.95); box-shadow: 0 0 0 4px rgba(11, 61, 46, .22); } }

  /* Agentes IA: o modelo é escolhido e o formulário abre preenchido */
  [data-seq].seq-on:not(.p1) .ag-card--sel{ border-color: var(--border); background: #fff; }
  [data-seq].seq-on:not(.p1) .ag-card--sel .ag-card__ok{ opacity: 0; }
  [data-seq].seq-on:not(.p2) .sq-form{ opacity: 0; transform: translateY(8px); }

  /* Funil: o cartão vence e o painel da negociação abre */
  [data-seq].seq-on:not(.p1) .sq-vence::before{ opacity: 0; }
  [data-seq].seq-on:not(.p1) .sq-vence .fn-lead__tempo{ color: var(--text-muted); }
  [data-seq].seq-on:not(.p2) .sq-painel{ opacity: 0; transform: translateY(8px); }

  /* Pacientes: Nova ação cria o retorno com responsável e prazo */
  [data-seq].seq-on:not(.p1) .sq-acao{ display: none; }
  [data-seq].seq-on.p1 .sq-vazio{ display: none; }
  [data-seq].seq-on.p1 .sq-nova{ animation: sq-aperta 520ms var(--ease); }

  /* Agenda: um cancelamento abre a vaga e o encaixe aparece */
  [data-seq].seq-on:not(.p1) .sq-vaga{ display: none; }
  [data-seq].seq-on.p1 .sq-cancela{ display: none; }
  [data-seq].seq-on:not(.p2) .sq-encaixe{ opacity: 0; transform: translateY(8px); }

  /* Campanhas e Relatórios: as barras se preenchem uma vez */
  [data-seq].seq-on:not(.p1) .sq-barra{ transform: scaleX(0); }
  [data-seq].seq-on:not(.p2) .sq-total{ opacity: 0; transform: translateY(8px); }

  /* Webhooks: as três caixas de evento se marcam */
  [data-seq].seq-on:not(.p1) .wh-ev--s1 .wh-ev__caixa, [data-seq].seq-on:not(.p2) .wh-ev--s2 .wh-ev__caixa, [data-seq].seq-on:not(.p3) .wh-ev--s3 .wh-ev__caixa{ background: #fff; border-color: var(--border-strong); color: transparent; }
  [data-seq].seq-on:not(.p1) .wh-ev--s1, [data-seq].seq-on:not(.p2) .wh-ev--s2, [data-seq].seq-on:not(.p3) .wh-ev--s3{ color: var(--text-body); font-weight: 400; }

  /* Perfis: do perfil Recepção (CPF desligado) para o Gestor, e a chave liga */
  [data-seq].seq-on.p1 .pf-painel:not(.pf-painel--oculto){ display: none; }
  [data-seq].seq-on.p1 .pf-painel--oculto{ display: block; }
  [data-seq].seq-on.p1 .sq-perfil-rec{ background: transparent; color: var(--text-body); font-weight: 400; }
  [data-seq].seq-on.p1 .sq-perfil-gestor{ background: #EAF4EF; color: var(--primary); font-weight: 600; }
  [data-seq].seq-on.p1:not(.p2) .pf-painel--oculto .pf-perm--cpf .pf-chave{ background: #C5CDC8; }
  [data-seq].seq-on.p1:not(.p2) .pf-painel--oculto .pf-perm--cpf .pf-chave i{ transform: none; }
}
@media (prefers-reduced-motion: reduce){
  .sq-msg, .sq-cp, .sq-painel, .sq-encaixe, .sq-total, .sq-form, .sq-acao, .sq-vaga, .sq-barra, .fn-lead, .ag-card, .wh-ev__caixa, .pf-chave, .pf-chave i, .cf-nav__i{ transition: none; }
}


/* ============================================================ */
/* 5. Implantado com você                                         */
/* ============================================================ */
.junto{ padding-block: var(--secao); }
.pagina--funcionalidades-v2 .junto__prazo{ font-size: var(--t-corpo); line-height: 1.6; max-inline-size: 52ch; }
.junto__link{ margin-block-start: .5rem; max-inline-size: none; }