/* ======================================================================
   Versão para clínicas: verde neon e branco neon sobre o preto da marca.
   Carregado por último: só troca cores e acrescenta os brilhos.
   ====================================================================== */

[data-tema="verde"] {
  --fundo: #000000;
  --campo: #03180F;
  --campo-2: #062818;
  --linha: rgba(140, 255, 196, .14);
  --linha-forte: rgba(140, 255, 196, .34);
  --sinal: #3DFF9A;
  --sinal-forte: #00C46A;
  --sobre-sinal: #00160B;
  --texto: #F5FFF9;
  --texto-2: #A3BDAF;
  --claro: #F1FBF5;
  --tinta: #03180F;
  --tinta-2: #3B5247;
  --cromo-tinta-escura: #0A5E35;
  --cromo-tinta-media: #3DFF9A;
  --cromo-reflexo: rgba(61, 255, 154, .6);
  --neon-verde: 0 0 10px rgba(61, 255, 154, .55), 0 0 28px rgba(61, 255, 154, .28);
  --neon-branco: 0 0 10px rgba(255, 255, 255, .5), 0 0 30px rgba(255, 255, 255, .18);
}

/* ---------- Tipografia: Sora (sem serifa moderna) nos títulos e números, Geist no texto ---------- */
:root {
  --display: "Sora", "Geist", system-ui, sans-serif;
  --t-hero: clamp(2.4rem, .9rem + 3.6vw, 4.4rem);
  --t-xl: clamp(2rem, 1.1rem + 3vw, 3.6rem);
}
.hero-titulo, .titulo, .final-titulo, .ferr-titulo {
  font-family: var(--display);
  font-weight: 600;
  font-variation-settings: normal;
  letter-spacing: -.045em;
  line-height: 1.04;
}
.titulo { max-width: 17em; }
.numeros-lista dd, .extrato-etapas strong, .ficha-principal strong, .vaz-resumo strong, .vaz-mesa strong,
.vaz-num, .quiz-nota, .relatorio-metricas dd, .ficha-linhas dd, .campo-entrada input, .campo-faixa output,
.saz-pico strong, .entregas-resultado li, .sobre blockquote p, .diario-coluna p, .funil-num, .entregas-num {
  font-family: var(--display);
  font-weight: 500;
  font-variation-settings: normal;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.funil-faixa h3, .dif-lista h3, .relatorio-titulo, .quiz-pergunta, .faq summary, .plano-titulo,
.ferramentas-titulo, .ferramentas-lista strong, .plano-fases h4, .entregas-lista h3 {
  font-family: var(--display);
  font-weight: 600;
  letter-spacing: -.025em;
}
.dif-lista h3, .entregas-lista h3 { font-size: 1.25rem; line-height: 1.2; }
.faq summary { font-size: 1.15rem; font-weight: 500; }
.ferramentas-lista strong { font-size: 1.2rem; line-height: 1.2; }
/* a última linha do título acende em verde */
.hero-titulo .linha:last-child > span {
  background: linear-gradient(90deg, #ffffff 0%, var(--sinal) 85%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.sobre blockquote p { font-weight: 400; letter-spacing: -.035em; }
.faixa-trilho span { font-weight: 600; letter-spacing: -.04em; }
.faixa-trilho span:nth-child(even) { font-weight: 300; }
.rodape-assinatura { font-weight: 700; letter-spacing: -.06em; }

/* ---------- Selo do topo: tubo de neon verde ---------- */
.hero-selo {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 26px; padding: 8px 18px 8px 14px;
  border: 1px solid var(--sinal); border-radius: 999px;
  color: var(--sinal); font-size: .9375rem; font-weight: 500; letter-spacing: .01em;
  box-shadow: var(--neon-verde), inset 0 0 12px rgba(61, 255, 154, .18);
  text-shadow: 0 0 8px rgba(61, 255, 154, .6);
}
.hero-selo::before {
  content: ""; width: 8px; height: 8px; border-radius: 50%;
  background: var(--sinal); box-shadow: var(--neon-verde);
}
.js .hero-selo { opacity: 0; }
.pronto .hero-selo { opacity: 1; transition: opacity .9s .3s; }

/* ---------- Título com brilho branco ---------- */
.hero-titulo { filter: drop-shadow(0 0 14px rgba(255, 255, 255, .14)); }
.hero-titulo .linha > span {
  background: linear-gradient(180deg, #ffffff 30%, #d8ffe9 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- Botões com brilho ---------- */
.botao, .botao:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 0 0 1px rgba(61, 255, 154, .6), 0 0 26px rgba(61, 255, 154, .45);
}
.botao-linha, .botao-linha:hover {
  border-color: rgba(255, 255, 255, .55);
  box-shadow: inset 0 0 10px rgba(255, 255, 255, .08), 0 0 16px rgba(255, 255, 255, .16);
}
.botao-linha:hover { border-color: #ffffff; }

/* ---------- Números e destaques acesos ---------- */
.numeros-lista dd { text-shadow: var(--neon-branco); }
.extrato-roas strong, .ficha-principal strong, .vaz-resumo div + div strong,
.vaz-mesa strong, .quiz-nota, .saz-mes.pico span { text-shadow: var(--neon-verde); }
.saz-mes.pico i { box-shadow: var(--neon-verde); }
.vaz-hoje { box-shadow: 0 0 14px rgba(61, 255, 154, .45); }
input[type="range"]::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--sinal), 0 0 12px rgba(61, 255, 154, .7); }

/* ---------- Faixa das especialidades: neon verde e branco ---------- */
.faixa-nichos {
  border-top-color: rgba(61, 255, 154, .45); border-bottom-color: rgba(61, 255, 154, .45);
  box-shadow: 0 -1px 18px -6px rgba(61, 255, 154, .5), 0 1px 18px -6px rgba(61, 255, 154, .5);
}
.faixa-trilho span { text-shadow: 0 0 14px rgba(255, 255, 255, .35); }
.faixa-trilho span:nth-child(even) {
  -webkit-text-stroke: 1px rgba(61, 255, 154, .9);
  text-shadow: 0 0 16px rgba(61, 255, 154, .45);
}
.faixa-trilho svg { filter: drop-shadow(0 0 6px rgba(61, 255, 154, .8)); }

/* ---------- Palco do logo com anéis de neon ---------- */
.hero-cromo { --chao: 89%; }
.cromo-3d { -webkit-mask-image: none; mask-image: none; }
.palco-anel { border-color: rgba(61, 255, 154, var(--a, .14)); box-shadow: 0 0 14px rgba(61, 255, 154, calc(var(--a, .14) * 2)); }
.palco-anel-2 { border-color: rgba(255, 255, 255, .14); box-shadow: 0 0 14px rgba(255, 255, 255, .12); }

/* ---------- Painéis: borda que acende no canto ---------- */
.extrato { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 0 0 1px rgba(61, 255, 154, .12), 0 0 40px -14px rgba(61, 255, 154, .4); }
.ficha, .vaz-painel { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 0 50px -20px rgba(61, 255, 154, .55); }

/* ---------- Funil do método: última faixa acesa ---------- */
.funil-etapa:nth-child(4) .funil-faixa { box-shadow: 0 0 30px rgba(61, 255, 154, .45); }

/* ---------- Seção clara (sobre) em branco esverdeado ---------- */
.sobre { background: radial-gradient(80% 90% at 85% 10%, #ffffff, var(--claro) 60%); }

/* ---------- Rodapé: assinatura em branco neon ---------- */
.rodape-assinatura {
  background: linear-gradient(180deg, #ffffff 0%, #d9ffe9 38%, rgba(61, 255, 154, .55) 70%, rgba(0, 0, 0, 0) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 22px rgba(61, 255, 154, .25));
}

@media (prefers-reduced-motion: reduce) {
  .js .hero-selo { opacity: 1; }
}
@media print {
  .hero-selo, .numeros-lista dd, .faixa-trilho span { text-shadow: none; box-shadow: none; }
}

/* ---------- Ferramentas no topo: botão em destaque (chave no celular) ---------- */
.botao-ferramentas {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  min-height: 42px; padding: 0 18px 0 14px; border-radius: 999px;
  color: var(--sinal); font-size: .9375rem; font-weight: 600; text-decoration: none;
  border: 1px solid rgba(61, 255, 154, .75);
  background: #000;
  box-shadow: var(--neon-verde), inset 0 0 14px rgba(61, 255, 154, .2);
  text-shadow: 0 0 8px rgba(61, 255, 154, .5);
  transition: background .3s, color .3s, transform .3s var(--curva);
}
.botao-ferramentas svg { width: 18px; height: 18px; fill: currentColor; filter: drop-shadow(0 0 4px rgba(61, 255, 154, .8)); transform-origin: 50% 50%; }
/* continua preto com contorno verde; no hover só o contorno acende e a chave "aperta" */
.botao-ferramentas:hover, .botao-ferramentas:focus-visible, .botao-ferramentas[aria-current="page"] {
  background: #000;
  border-color: var(--sinal);
  box-shadow: 0 0 0 1px var(--sinal), 0 0 14px rgba(61, 255, 154, .7), 0 0 34px rgba(61, 255, 154, .3);
}
@keyframes chave-aperta {
  0% { transform: rotate(0); }
  30% { transform: rotate(-50deg); }
  55% { transform: rotate(-20deg); }
  80% { transform: rotate(-45deg); }
  100% { transform: rotate(-35deg); }
}
.botao-ferramentas:hover svg, .botao-ferramentas:focus-visible svg { animation: chave-aperta .7s var(--curva) forwards; }
/* gesto pequeno e só no hover: continua mesmo com "reduzir movimento" ligado no sistema */
@media (prefers-reduced-motion: reduce) {
  .botao-ferramentas:hover svg, .botao-ferramentas:focus-visible svg { animation: chave-aperta .7s ease forwards !important; }
}
@media (max-width: 600px) {
  .botao-ferramentas { width: 44px; height: 44px; min-height: 0; padding: 0; justify-content: center; }
  .botao-ferramentas span { display: none; }
  .botao-ferramentas svg { width: 20px; height: 20px; }
}

/* ---------- Página de ferramentas ---------- */
.ferr-abertura {
  position: relative; isolation: isolate;
  max-width: var(--largura); margin: 0 auto;
  padding: clamp(130px, 14vw, 180px) var(--margem) 0;
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 48px; align-items: center;
}
.ferr-abertura::before {
  content: ""; position: absolute; z-index: -1; inset: -120px -20vw -160px;
  background:
    radial-gradient(40% 50% at 78% 45%, rgba(61, 255, 154, .2), transparent 70%),
    linear-gradient(rgba(140, 255, 196, .06) 1px, transparent 1px) 0 0 / 56px 56px,
    linear-gradient(90deg, rgba(140, 255, 196, .06) 1px, transparent 1px) 0 0 / 56px 56px;
  -webkit-mask-image: radial-gradient(60% 60% at 60% 45%, #000, transparent 85%);
  mask-image: radial-gradient(60% 60% at 60% 45%, #000, transparent 85%);
  pointer-events: none;
}
.ferr-titulo { font-size: var(--t-hero); max-width: 12em; text-wrap: balance; color: #fff; }
.ferr-titulo span {
  background: linear-gradient(90deg, #ffffff 0%, var(--sinal) 80%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.ferr-abertura .hero-acoes { margin-top: 36px; }
.js .pagina-ferramentas .hero-selo { opacity: 1; }

/* painel ilustrativo com resultados das ferramentas */
.ferr-painel { position: relative; height: 440px; }
.ferr-mini {
  position: absolute; display: flex; flex-direction: column; gap: 6px;
  padding: 20px 22px; border-radius: 20px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .015)), rgba(3, 24, 15, .7);
  border: 1px solid rgba(61, 255, 154, .25);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px -30px #000, 0 0 40px -16px rgba(61, 255, 154, .5);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  animation: ferr-flutua 7s ease-in-out infinite;
}
.ferr-mini span { font-size: .8125rem; color: var(--texto-2); }
.ferr-mini strong { font-family: var(--display); font-weight: 600; font-size: 2.2rem; letter-spacing: -.04em; line-height: 1; color: #fff; }
.ferr-mini strong small { font-size: .5em; color: var(--texto-2); font-weight: 400; }
.ferr-mini small { font-size: .75rem; color: var(--texto-2); }
.ferr-mini-1 { left: 0; top: 0; width: 54%; }
.ferr-mini-1 strong { color: var(--sinal); text-shadow: var(--neon-verde); }
.ferr-mini-2 { right: 0; top: 50px; width: 46%; animation-delay: -2s; }
.ferr-mini-3 { left: 3%; top: 190px; width: 54%; animation-delay: -4s; z-index: 2; }
.ferr-mini-3 strong { font-size: 1.5rem; }
.ferr-mini-4 { right: 2%; top: 290px; width: 37%; animation-delay: -1s; }
.ferr-barras { display: grid; gap: 6px; margin-top: 8px; }
.ferr-barras i { display: block; height: 8px; width: var(--h); border-radius: 99px; background: linear-gradient(90deg, var(--sinal-forte), var(--sinal)); box-shadow: 0 0 10px rgba(61, 255, 154, .5); }
.ferr-meses { display: flex; align-items: end; gap: 6px; height: 60px; margin-top: 8px; }
.ferr-meses i { flex: 1; height: var(--h); border-radius: 6px 6px 2px 2px; background: rgba(61, 255, 154, .18); }
.ferr-meses i.pico { background: var(--sinal); box-shadow: 0 0 12px rgba(61, 255, 154, .7); }
@keyframes ferr-flutua { 50% { transform: translateY(-10px); } }

/* cartões das quatro ferramentas */
.pagina-ferramentas .ferramentas { padding-top: clamp(64px, 7vw, 96px); }
.pagina-ferramentas .ferramentas-lista { gap: 14px; }
.pagina-ferramentas .ferramentas-lista a { gap: 10px; padding: 24px 24px 56px; min-height: 220px; }
.ferr-card-topo { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.ferr-card-topo em { font-style: normal; font-family: var(--display); font-size: .875rem; color: var(--texto-2); }
.ferr-icone {
  display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px;
  background: rgba(61, 255, 154, .08); border: 1px solid rgba(61, 255, 154, .4);
  box-shadow: 0 0 18px -4px rgba(61, 255, 154, .6);
}
.ferr-icone svg { width: 22px; height: 22px; fill: var(--sinal); filter: drop-shadow(0 0 4px rgba(61, 255, 154, .8)); }
.ferr-seta {
  position: absolute; left: 24px; bottom: 20px; font-style: normal; color: var(--sinal);
  transition: transform .5s var(--curva);
}
.ferramentas-lista a:hover .ferr-seta { transform: translateX(8px); }
.ferramentas-lista a:hover .ferr-icone { background: var(--sinal); }
.ferramentas-lista a:hover .ferr-icone svg { fill: var(--sobre-sinal); filter: none; }

/* etiqueta "Ferramenta 1 de 4" acima de cada título */
.ferr-etiqueta {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 18px;
  font-size: .8125rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2);
}
.ferr-etiqueta span {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  font-family: var(--display); font-weight: 600; letter-spacing: 0; color: var(--sinal);
  border: 1px solid rgba(61, 255, 154, .6); box-shadow: var(--neon-verde);
}
/* cada ferramenta ganha um brilho de fundo próprio */
.pagina-ferramentas .secao { position: relative; isolation: isolate; }
.pagina-ferramentas .secao::before {
  content: ""; position: absolute; z-index: -1; top: 20%; width: 60vw; height: 60%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(61, 255, 154, .09), transparent);
}
.pagina-ferramentas .secao:nth-of-type(odd)::before { right: -20vw; }
.pagina-ferramentas .secao:nth-of-type(even)::before { left: -20vw; }

@media (max-width: 900px) {
  .ferr-abertura { grid-template-columns: 1fr; }
  .ferr-painel { height: 400px; max-width: 460px; }
}
@media (prefers-reduced-motion: reduce) {
  .ferr-mini { animation: none; }
}

/* ---------- Entregas numeradas ---------- */
.entregas-num { display: block; margin-bottom: 14px; font-size: 1.1rem; color: var(--sinal); text-shadow: 0 0 10px rgba(61, 255, 154, .5); }

/* ---------- Sobre: retrato com cenário de neon ---------- */
.sobre-foto { align-self: center; padding: clamp(48px, 6vw, 88px) var(--margem); }
.retrato {
  position: relative; isolation: isolate; overflow: hidden;
  width: min(100%, 480px); aspect-ratio: 4 / 5.4; margin: 0;
  border-radius: 28px;
  background:
    radial-gradient(60% 45% at 58% 30%, rgba(61, 255, 154, .42), transparent 70%),
    radial-gradient(90% 60% at 10% 100%, rgba(0, 196, 106, .35), transparent 70%),
    linear-gradient(160deg, #062818 0%, #021009 55%, #000 100%);
  box-shadow: 0 40px 80px -30px rgba(3, 24, 15, .6), 0 0 0 1px rgba(61, 255, 154, .25), 0 0 60px -10px rgba(61, 255, 154, .35);
}
.retrato-grade {
  position: absolute; inset: 0; z-index: -1;
  background-image:
    linear-gradient(rgba(140, 255, 196, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 255, 196, .09) 1px, transparent 1px);
  background-size: 36px 36px;
  -webkit-mask-image: radial-gradient(75% 65% at 50% 40%, #000, transparent 85%);
  mask-image: radial-gradient(75% 65% at 50% 40%, #000, transparent 85%);
}
.retrato-a {
  position: absolute; z-index: -1; width: 112%; left: 2%; top: 4%;
  fill: none; stroke: rgba(61, 255, 154, .85); stroke-width: 1.2;
  filter: drop-shadow(0 0 6px rgba(61, 255, 154, .9)) drop-shadow(0 0 22px rgba(61, 255, 154, .45));
  opacity: .55;
}
.retrato-luz {
  position: absolute; z-index: -1; inset: -30%;
  background: conic-gradient(from 200deg at 55% 45%, transparent 0 40%, rgba(61, 255, 154, .14) 48%, transparent 56% 100%);
  animation: retrato-gira 16s linear infinite;
}
@keyframes retrato-gira { to { transform: rotate(360deg); } }
.retrato img {
  position: absolute; left: 50%; top: -5%; width: 90%; height: auto; max-width: none;
  transform: translateX(-50%);
  mix-blend-mode: normal;
  filter: drop-shadow(0 0 1px rgba(61, 255, 154, .9)) drop-shadow(-10px -4px 26px rgba(61, 255, 154, .35)) drop-shadow(14px 0 30px rgba(255, 255, 255, .12));
}
.retrato::after {
  content: ""; position: absolute; inset: auto 0 0 0; height: 34%;
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .92));
  pointer-events: none;
}
.retrato-nome {
  position: absolute; z-index: 2; left: 20px; right: 20px; bottom: 20px;
  display: flex; flex-direction: column; gap: 2px;
  padding: 14px 18px; border-radius: 16px;
  background: rgba(3, 24, 15, .55); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(61, 255, 154, .3);
  color: #F5FFF9;
}
.retrato-nome strong { font-family: var(--display); font-weight: 400; font-size: 1.6rem; line-height: 1; }
.retrato-nome span { font-size: .8125rem; color: var(--sinal); letter-spacing: .02em; }
@media (max-width: 900px) {
  .sobre-foto { padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .retrato-luz { animation: none; }
}

/* ---------- Ajustes de tamanho para a Sora ---------- */
.funil-faixa h3 { font-size: clamp(1.05rem, .9rem + .5vw, 1.3rem); line-height: 1.2; }
.diario-coluna p { font-size: 1.15rem; line-height: 1.4; font-weight: 400; letter-spacing: -.02em; }
.relatorio-titulo { font-size: 1.3rem; }
.diferenciais .titulo { max-width: 20em; }

/* ---------- Quadro "O que a sua clínica deve esperar": sem vão no meio ---------- */
.entregas-resultado { align-self: start; justify-content: flex-start; gap: 20px; }
@media (min-width: 901px) {
  .entregas-resultado { position: sticky; top: 110px; }
}
.pagina-ferramentas main { overflow-x: clip; }
.numeros-lista dd { font-size: clamp(2rem, 1rem + 2.4vw, 3.25rem); white-space: nowrap; }
.ferr-mini-2 strong { color: var(--sinal); text-shadow: var(--neon-verde); }
.ferr-crescer { display: flex; align-items: end; gap: 6px; height: 56px; margin-top: 8px; }
.ferr-crescer i { flex: 1; height: var(--h); border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, rgba(61, 255, 154, .55), rgba(61, 255, 154, .12)); }
.ferr-crescer i.pico { background: var(--sinal); box-shadow: 0 0 14px rgba(61, 255, 154, .7); }

/* ---------- Faixa só com o "A" da marca (sem nomes de serviços) ---------- */
.faixa-so-a span { padding-right: clamp(28px, 3vw, 44px); font-size: 1rem; gap: 0; -webkit-text-stroke: 0 !important; text-shadow: none; }
.faixa-so-a svg { width: 18px; }
.faixa-nichos:has(.faixa-so-a) { padding: 12px 0; margin-top: clamp(40px, 5vw, 64px); }
.faixa-so-a span:nth-child(even) svg {
  fill: none; stroke: var(--sinal); stroke-width: 9;
  filter: drop-shadow(0 0 5px rgba(61, 255, 154, .7));
}
.faixa-so-a span:nth-child(3n) svg { fill: #fff; stroke: none; filter: drop-shadow(0 0 8px rgba(255, 255, 255, .6)); }

/* ---------- Números da agência menores, sem encostar ---------- */
.numeros-lista dd { font-size: clamp(1.75rem, .8rem + 1.7vw, 2.6rem); font-weight: 500; letter-spacing: -.035em; }
