/* Fontes de licença aberta (OFL), servidas pelo próprio site: nada de Google Fonts (LGPD e velocidade). */
@font-face { font-family: "Cormorant Garamond"; font-weight: 500; font-style: normal; font-display: swap; src: url('fontes/cormorant-garamond-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: "Cormorant Garamond"; font-weight: 500; font-style: italic; font-display: swap; src: url('fontes/cormorant-garamond-latin-500-italic.woff2') format('woff2'); }
@font-face { font-family: "Cormorant Garamond"; font-weight: 600; font-style: normal; font-display: swap; src: url('fontes/cormorant-garamond-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: "DM Sans"; font-weight: 400; font-display: swap; src: url('fontes/dm-sans-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: "DM Sans"; font-weight: 500; font-display: swap; src: url('fontes/dm-sans-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: "DM Sans"; font-weight: 700; font-display: swap; src: url('fontes/dm-sans-latin-700-normal.woff2') format('woff2'); }

/* Identidade grafite e cobre da Lummie Barbearia; estrutura da página inspirada no layout do Lovable. */
:root {
  color-scheme: light;
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: "DM Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --fundo: #faf8f6;
  --cartao: #fdfdfd;
  --tinta: #1f1d1b;
  --tinta-suave: #6d6864;
  --terracota: #a65d2e;
  --terracota-escuro: #84461f;
  --blush: #ede8e3;
  --areia: #f1eeea;
  --pessego: #ece7e1;
  --rosa: #efe9e3;
  --linha: #e5dfd9;
  --escuro: #242220;
  --escuro-texto: #f4f2ef;
  --escuro-suave: #ccc5bf;
  --acento-claro: #e3a26a;
  --sombra: 0 22px 65px -24px #35312e4d;
  --sombra-leve: 0 8px 28px #35312e17;
  /* nomes antigos, usados pelas páginas de termos e privacidade */
  --ink: var(--tinta); --ink-soft: #44403c; --clay: var(--terracota); --clay-dark: var(--terracota-escuro);
  --paper: var(--fundo); --muted-text: var(--tinta-suave);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { margin: 0; background: var(--fundo); color: var(--tinta); font-family: var(--sans); font-size: 15px; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; text-decoration: none; }
button, a, input { -webkit-tap-highlight-color: transparent; }
::selection { background: #d8d0c8; color: var(--tinta); }
em { font-family: var(--serif); font-style: italic; font-weight: 500; }
.i { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
/* folha de ícones (símbolos SVG): fora do fluxo, sem estilo inline por causa da CSP */
.icones { position: absolute; }
.container { width: min(1160px, calc(100% - 64px)); margin: 0 auto; }
.espaco { padding: 100px 0; }
.so-pc { display: inline; }
.pular { position: absolute; left: -9999px; top: 8px; z-index: 99; padding: 10px 16px; border-radius: 6px; background: var(--tinta); color: #ffffff; }
.pular:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--terracota-escuro); outline-offset: 3px; }

/* marca: emblema + nome */
.marca { display: inline-flex; align-items: center; gap: 10px; color: var(--tinta); }
.marca__selo { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; background: url('img/luma-emblema-192.webp') center / 100% no-repeat; }
.marca__nome { font-family: var(--serif); font-size: 32px; font-weight: 500; line-height: 1; letter-spacing: -.03em; }
.marca--pequena .marca__selo { width: 32px; height: 32px; flex-basis: 32px; }
.marca--pequena .marca__nome { font-size: 25px; }

/* botões */
.cta { height: 52px; display: inline-flex; align-items: center; gap: 12px; padding: 0 26px; border-radius: 999px; background: var(--terracota); color: #fcfbfa; font-size: 14px; font-weight: 700; box-shadow: 0 10px 24px -10px #a15d2f73; transition: transform .25s, background .25s; white-space: nowrap; }
.cta:hover { background: var(--terracota-escuro); transform: translateY(-2px); }
.cta .i { width: 18px; height: 18px; }
.cta--claro { background: var(--acento-claro); color: var(--escuro); box-shadow: none; }
.cta--claro:hover { background: #e7e0d9; }
.cta--largo { width: 100%; justify-content: space-between; }
.botao-contorno { height: 52px; display: inline-flex; align-items: center; gap: 10px; padding: 0 23px; border: 1px solid #d0c9c2; border-radius: 999px; background: transparent; color: var(--tinta); font-size: 13px; font-weight: 700; transition: border-color .2s, background .2s; }
.botao-contorno:hover { border-color: var(--terracota); background: #faf9f7; }
.botao-contorno .i { width: 17px; height: 17px; color: var(--terracota-escuro); }
.link-texto { display: inline-flex; align-items: center; gap: 9px; color: var(--terracota-escuro); font-size: 13px; font-weight: 700; }
.link-texto:hover { color: var(--tinta); }
.link-texto .i { width: 15px; height: 15px; }

/* cabeçalho fixo com desfoque */
.topo { position: sticky; top: 0; z-index: 40; background: #faf8f6f0; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid var(--linha); }
.topo__dentro { height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.topo__nav { display: flex; gap: 32px; font-size: 13px; color: var(--tinta-suave); }
.topo__nav a:hover { color: var(--terracota-escuro); }
.topo__acoes { display: flex; align-items: center; gap: 18px; }
.topo__entrar { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; }
.topo__entrar:hover { color: var(--terracota-escuro); }
.topo__entrar .i { width: 15px; height: 15px; }
.cta--topo { height: 42px; padding: 0 18px; font-size: 12px; }
.cta--topo .i { width: 15px; height: 15px; }
.topo__menu { display: none; width: 40px; height: 40px; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--tinta); cursor: pointer; }
.topo__menu .i { width: 22px; height: 22px; }
.topo__menu .i--fechar, .topo__menu[aria-expanded="true"] .i--abrir { display: none; }
.topo__menu[aria-expanded="true"] .i--fechar { display: block; }
.menu-celular { display: flex; flex-direction: column; padding: 4px 20px 18px; border-top: 1px solid var(--linha); background: var(--fundo); }
.menu-celular[hidden] { display: none; }
.menu-celular a { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; font-size: 15px; border-bottom: 1px solid var(--linha); }
.menu-celular a:last-child { border-bottom: 0; }
.menu-celular .i { width: 16px; height: 16px; color: var(--terracota-escuro); }

/* topo da página */
.hero { padding-top: 64px; background: linear-gradient(180deg, var(--areia) 0%, var(--areia) 82%, var(--fundo) 100%); }
.hero__texto { text-align: center; }
.pilula { display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border: 1px solid var(--linha); border-radius: 30px; background: var(--fundo); font-size: 10px; font-weight: 700; letter-spacing: .12em; color: var(--tinta-suave); }
.pilula__ponto { width: 6px; height: 6px; border-radius: 50%; background: var(--terracota); }
.hero h1 { position: relative; display: table; margin: 22px auto 0; font-size: 68px; font-weight: 500; line-height: 1.07; letter-spacing: -.02em; }
.hero h1 em { color: var(--terracota-escuro); font-size: 1.14em; }
.hero__brilho { position: absolute; right: -56px; top: 64px; color: var(--terracota); transform: rotate(10deg); }
.hero__brilho .i { width: 36px; height: 36px; stroke-width: 1.1; }
.hero__texto > p { max-width: 660px; margin: 24px auto 0; color: var(--tinta-suave); font-size: 16px; line-height: 1.8; }
.hero__acoes { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero__notas { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; margin-top: 20px; color: var(--tinta-suave); font-size: 12px; }
.hero__notas span { display: inline-flex; align-items: center; gap: 6px; }
.hero__notas .i { width: 14px; height: 14px; color: var(--terracota-escuro); }

/* demonstração com telas reais */
.demo { position: relative; max-width: 1020px; margin: 48px auto 0; scroll-margin-top: 110px; animation: subir .8s .12s both; }
.demo__janela { overflow: hidden; border: 1px solid var(--linha); border-radius: 12px; background: var(--cartao); box-shadow: var(--sombra); }
.demo__barra { height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 15px; border-bottom: 1px solid var(--linha); background: #f4f1ee; color: var(--tinta-suave); font-size: 11px; }
.demo__bolinhas { display: flex; gap: 6px; }
.demo__bolinhas i { width: 8px; height: 8px; border-radius: 50%; background: #dad4cd; }
.demo__selo { font-size: 10px; }
.demo__abas { display: none; gap: 6px; padding: 10px 12px 0; border-bottom: 1px solid var(--linha); background: var(--cartao); }
.js .demo__abas { display: flex; }
.demo__abas button { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--tinta-suave); font: 500 13px var(--sans); cursor: pointer; }
.demo__abas button .i { width: 15px; height: 15px; }
.demo__abas button[aria-selected="true"] { border-bottom-color: var(--terracota); color: var(--terracota-escuro); font-weight: 700; }
.demo__abas button:hover { color: var(--tinta); }
.demo__tela { margin: 0; aspect-ratio: 1600 / 852; overflow: hidden; }
.demo__tela[hidden] { display: none; }
.demo__tela img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.demo__celular { position: absolute; right: -44px; bottom: -36px; width: 172px; padding: 7px; border-radius: 30px; background: var(--escuro); box-shadow: var(--sombra); }
.demo__celular img { display: block; width: 100%; height: auto; border-radius: 23px; }
.demo__entalhe { position: absolute; top: 7px; left: 50%; width: 64px; height: 16px; border-radius: 0 0 10px 10px; background: var(--escuro); transform: translateX(-50%); z-index: 1; }
.demo__aviso { position: absolute; left: -30px; bottom: 34px; display: flex; align-items: center; gap: 11px; padding: 14px 18px; border: 1px solid var(--linha); border-radius: 10px; background: var(--cartao); box-shadow: var(--sombra-leve); font-size: 12px; font-weight: 700; }
.demo__aviso small { display: block; margin-top: 3px; color: var(--tinta-suave); font-size: 11px; font-weight: 400; }
.demo__aviso-icone { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--blush); color: var(--terracota-escuro); }
.demo__aviso-icone .i { width: 17px; height: 17px; }

.publico { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 34px; padding: 70px 0 34px; }
.publico > span { color: var(--tinta-suave); font-size: 12px; }
.publico > div { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 30px; font-size: 13px; font-weight: 700; }
.publico > div span { display: inline-flex; align-items: center; gap: 8px; }
.publico .i { width: 16px; height: 16px; color: var(--terracota-escuro); }

/* títulos de seção */
.rotulo { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 20px; color: var(--terracota-escuro); font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.rotulo .i { width: 15px; height: 15px; }
h2 { font-size: 44px; font-weight: 500; line-height: 1.14; letter-spacing: -.02em; }
h2 em { color: var(--terracota-escuro); font-size: 1.12em; }
.titulo-secao { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.titulo-secao > p { max-width: 420px; padding-bottom: 6px; color: var(--tinta-suave); font-size: 14px; line-height: 1.9; }

/* recursos */
.recursos__grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 46px 34px; margin-top: 60px; }
.recurso__icone { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 10px; color: var(--terracota-escuro); }
.recurso__icone .i { width: 20px; height: 20px; stroke-width: 1.6; }
.tom-0 { background: var(--blush); } .tom-1 { background: var(--pessego); } .tom-2 { background: var(--rosa); }
.recurso h3 { font-size: 16px; font-weight: 700; line-height: 1.45; }
.recurso p { margin-top: 10px; color: var(--tinta-suave); font-size: 13px; line-height: 1.85; }
.recurso strong { color: var(--tinta); font-weight: 500; }

/* WhatsApp */
.whats { background: var(--blush); }
.whats__grade { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.whats__texto > p { max-width: 440px; margin-top: 22px; color: var(--tinta-suave); font-size: 14px; line-height: 1.9; }
.whats__texto strong { color: var(--tinta); }
.beneficios { display: flex; flex-direction: column; gap: 15px; margin: 27px 0 30px; padding: 0; list-style: none; }
.beneficios li { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.beneficios li > span { width: 19px; height: 19px; display: grid; place-items: center; flex-shrink: 0; border: 1px solid var(--terracota-escuro); border-radius: 50%; color: var(--terracota-escuro); }
.beneficios .i { width: 11px; height: 11px; stroke-width: 2.4; }
.whats__texto .link-texto { display: flex; width: fit-content; margin-top: 18px; }
.palco { position: relative; display: flex; flex-direction: column; align-items: center; padding: 26px 0 0; }
.palco__nota { position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: 5px; color: var(--terracota-escuro); font-family: var(--serif); font-size: 22px; font-style: italic; transform: rotate(6deg); }
.palco__nota .i { width: 16px; height: 16px; }
.fone { position: relative; width: 310px; overflow: hidden; border: 7px solid var(--escuro); border-radius: 38px; background: #efece9; box-shadow: var(--sombra); }
.fone__entalhe { position: absolute; top: 0; left: 50%; z-index: 2; width: 105px; height: 21px; border-radius: 0 0 14px 14px; background: var(--escuro); transform: translateX(-50%); }
.fone__topo { display: flex; align-items: center; gap: 9px; padding: 34px 14px 14px; background: var(--terracota-escuro); color: #fcfbfa; }
.fone__topo strong { font-size: 12px; }
.fone__topo small { display: block; margin-top: 2px; font-size: 10px; opacity: .8; }
.fone__avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--acento-claro); color: var(--terracota-escuro); font-size: 11px; font-weight: 700; }
.chat { position: relative; height: 400px; display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 14px 12px; overflow-y: auto; list-style: none; font-size: 11.5px; line-height: 1.55; scroll-behavior: smooth; }
.chat__msg { position: relative; align-self: flex-start; max-width: 88%; padding: 9px 11px 7px; border-radius: 0 9px 9px 9px; background: #fdfdfd; box-shadow: 0 1px 1px #dcd7d1; }
.chat__msg--cliente { align-self: flex-end; border-radius: 9px 0 9px 9px; background: #e6e0d9; }
.chat__msg time { display: block; margin-top: 3px; color: #918c87; font-size: 9px; text-align: right; }
.chat__aviso { align-self: center; padding: 3px 10px; border-radius: 6px; background: #fdfdfdcc; color: var(--tinta-suave); font-size: 10px; font-style: italic; }
.chat--animar > li { display: none; }
.chat--animar > li.chat--vista { display: block; animation: subir .35s ease both; }
.fone__campo { display: flex; justify-content: space-between; align-items: center; margin: 0 10px 13px; padding: 11px 14px; border-radius: 20px; background: #fdfdfd; color: var(--tinta-suave); font-size: 11px; }
.fone__campo .i { width: 17px; height: 17px; color: var(--terracota-escuro); }
.palco__aviso { position: absolute; left: -10px; bottom: 70px; display: flex; align-items: center; gap: 12px; padding: 15px 17px; border: 1px solid var(--linha); border-radius: 10px; background: var(--cartao); box-shadow: var(--sombra-leve); font-size: 12px; font-weight: 700; }
.palco__aviso > span { padding: 9px; border-radius: 8px; background: var(--blush); color: var(--terracota-escuro); }
.palco__aviso .i { display: block; width: 18px; height: 18px; color: var(--terracota-escuro); }
.palco__aviso small { display: block; margin-top: 3px; color: var(--tinta-suave); font-size: 11px; font-weight: 400; }
.palco__legenda { margin-top: 12px; color: var(--tinta-suave); font-size: 10px; }

/* faixa com foto */
.cuidado { position: relative; min-height: 470px; overflow: hidden; background: var(--escuro); color: var(--escuro-texto); }
.cuidado > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.cuidado__veu { position: absolute; inset: 0; background: linear-gradient(90deg, #1a1816f2 0%, #1a1816cc 40%, #1a181614 78%); }
.cuidado__texto { position: relative; padding: 76px 0; }
.cuidado .rotulo, .cuidado h2 em { color: var(--acento-claro); }
.cuidado__texto p { margin: 20px 0 28px; color: var(--escuro-suave); font-size: 14px; line-height: 1.9; }

/* calculadora de faltas */
.conta__grade { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.conta__grade > div > p { max-width: 440px; margin-top: 22px; color: var(--tinta-suave); font-size: 14px; line-height: 1.9; }
.calc { display: grid; gap: 16px; padding: 30px; border: 1px solid var(--linha); border-radius: 12px; background: var(--cartao); box-shadow: var(--sombra); }
.calc label { display: grid; gap: 7px; font-size: 13px; font-weight: 500; }
.calc input { height: 46px; padding: 0 14px; border: 1px solid #dad4ce; border-radius: 8px; background: var(--fundo); color: var(--tinta); font: 500 16px var(--sans); }
.calc input:focus { border-color: var(--terracota); outline: 2px solid #a65d2e33; }
.calc__resultado { margin-top: 6px; padding: 18px 20px; border-radius: 10px; background: var(--blush); }
.calc__resultado span { font-size: 12px; color: var(--tinta-suave); }
.calc__resultado strong { display: block; margin: 4px 0 6px; color: var(--terracota-escuro); font-family: var(--serif); font-size: 44px; font-weight: 600; line-height: 1.1; }
.calc__resultado small { display: block; color: var(--tinta); font-size: 12px; line-height: 1.7; }

/* preço */
.preco { border-top: 1px solid var(--linha); }
.preco__grade { display: grid; grid-template-columns: 1fr 440px; gap: 100px; align-items: center; max-width: 1020px; }
.preco__texto > p { margin-top: 23px; color: var(--tinta-suave); font-size: 14px; line-height: 1.9; }
.garantias { display: flex; flex-direction: column; gap: 17px; margin-top: 34px; font-size: 13px; }
.garantias span { display: flex; align-items: center; gap: 11px; }
.garantias .i { width: 18px; height: 18px; color: var(--terracota-escuro); }
.cartao-preco { padding: 32px; border: 1px solid var(--linha); border-radius: 14px; background: var(--cartao); box-shadow: var(--sombra); }
.cartao-preco__topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }
.etiqueta { padding: 6px 10px; border-radius: 6px; background: var(--blush); color: var(--terracota-escuro); font-size: 9px; font-weight: 700; letter-spacing: .08em; }
.ciclos-site { display: none; gap: 4px; margin: -6px 0 22px; padding: 4px; border-radius: 999px; background: var(--areia); }
.js .ciclos-site { display: flex; }
.ciclos-site button { flex: 1; height: 36px; padding: 0 8px; border: 0; border-radius: 999px; background: none; color: var(--tinta-suave); font: 700 12px var(--sans); cursor: pointer; white-space: nowrap; }
.ciclos-site button span { color: var(--terracota-escuro); font-weight: 700; }
.ciclos-site button[aria-pressed="true"] { background: var(--cartao); color: var(--tinta); box-shadow: 0 2px 8px #35312e24; }
.valor__ciclo { margin-top: 4px; color: var(--terracota-escuro); font-size: 13px; font-weight: 700; }
.fundador__selo { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; background: var(--pessego); color: var(--terracota-escuro); font-size: 11px; font-weight: 700; }
.fundador__selo .i { width: 13px; height: 13px; }
.preco-de { margin-top: 18px; color: var(--tinta-suave); font-size: 13px; }
.valor { margin-top: 4px; font-size: 52px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; white-space: nowrap; }
.valor span { margin-left: 6px; color: var(--tinta-suave); font-size: 14px; font-weight: 400; letter-spacing: 0; }
.valor__nota { margin-top: 8px; color: var(--tinta-suave); font-size: 12px; line-height: 1.7; }
.valor__nota strong { color: var(--tinta); }
.cartao-preco ul { display: flex; flex-direction: column; gap: 14px; margin: 25px 0; padding: 24px 0 0; border-top: 1px solid var(--linha); list-style: none; }
.cartao-preco li { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.5; }
.cartao-preco li .i { width: 16px; height: 16px; margin-top: 2px; color: var(--terracota-escuro); stroke-width: 2.2; }
.cartao-preco > small { display: block; margin-top: 14px; color: var(--tinta-suave); font-size: 11px; text-align: center; }

/* em breve */
.breve { background: var(--areia); }
.breve__grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 50px; }
.breve__item { padding: 24px; border: 1px dashed #d0c9c2; border-radius: 12px; background: #fdfdfdaa; }
.breve__item h3 { margin-top: 14px; font-size: 16px; font-weight: 700; }
.breve__item p { margin-top: 8px; color: var(--tinta-suave); font-size: 13px; line-height: 1.8; }
.selo-breve { display: inline-block; padding: 4px 10px; border-radius: 999px; background: var(--pessego); color: var(--terracota-escuro); font-size: 10px; font-weight: 700; letter-spacing: .06em; }

/* dúvidas */
.duvidas__grade { display: grid; grid-template-columns: 1fr 1.35fr; gap: 90px; }
.duvidas__grade > div:first-child > p { margin: 20px 0 16px; color: var(--tinta-suave); font-size: 14px; }
.duvidas__lista details { border-bottom: 1px solid var(--linha); }
.duvidas__lista details:first-child { border-top: 1px solid var(--linha); }
.duvidas__lista summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 23px 0; cursor: pointer; font-size: 14px; font-weight: 700; list-style: none; }
.duvidas__lista summary::-webkit-details-marker { display: none; }
.duvidas__lista summary .i { width: 17px; height: 17px; color: var(--tinta-suave); transition: transform .25s; }
.duvidas__lista details[open] summary .i { transform: rotate(180deg); }
.duvidas__lista p { padding: 0 30px 23px 0; color: var(--tinta-suave); font-size: 13px; line-height: 1.9; animation: subir .25s ease; }
.duvidas__lista p a { color: var(--terracota-escuro); text-decoration: underline; text-underline-offset: 3px; }

/* chamada final e rodapé */
.final { padding: 80px 0; background: var(--escuro); color: var(--escuro-texto); text-align: center; }
.final .rotulo, .final h2 em { color: var(--acento-claro); }
.final h2 { font-size: 48px; }
.final p { margin: 22px auto 28px; color: var(--escuro-suave); font-size: 14px; }
.final__nota { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 17px; color: var(--escuro-suave); font-size: 11px; }
.final__nota .i { width: 15px; height: 15px; }
.rodape { padding: 36px 0 26px; }
.rodape__topo { display: flex; align-items: center; gap: 26px; }
.rodape__topo > span { color: var(--tinta-suave); font-size: 12px; }
.rodape__cta { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; color: var(--terracota-escuro); font-size: 13px; font-weight: 700; }
.rodape__cta .i { width: 16px; height: 16px; }
.rodape__base { display: flex; justify-content: space-between; gap: 16px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--linha); color: var(--tinta-suave); font-size: 11px; }
.rodape__base nav { display: flex; flex-wrap: wrap; gap: 18px; }
.rodape__base a:hover { color: var(--terracota-escuro); }

/* aparece ao rolar: só com o script ligado e sem "reduzir movimento" (sem script, tudo à vista) */
.anima .reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s ease; }
.anima .reveal.visivel { opacity: 1; transform: none; }
@keyframes subir { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (min-width: 1500px) { .hero h1 { font-size: 72px; } .demo { max-width: 1060px; } }
@media (max-width: 1100px) { .demo__celular { right: -10px; width: 140px; } .demo__aviso { left: -8px; } }
@media (max-width: 1000px) {
  .container { width: calc(100% - 48px); }
  .topo__nav { gap: 20px; }
  .recursos__grade { grid-template-columns: repeat(2, 1fr); gap: 36px; }
  .whats__grade, .conta__grade { gap: 40px; }
  .preco__grade { grid-template-columns: 1fr 400px; gap: 50px; }
  .duvidas__grade { gap: 45px; }
  .breve__grade { grid-template-columns: repeat(2, 1fr); }
  .titulo-secao > p { max-width: 320px; }
  .hero__brilho { right: -40px; } .hero__brilho .i { width: 28px; height: 28px; }
}
@media (max-width: 860px) { .topo__nav { display: none; } .topo__menu { display: inline-flex; } }
@media (max-width: 767px) {
  .container { width: calc(100% - 40px); }
  .espaco { padding: 64px 0; }
  .so-pc { display: none; }
  .topo__dentro { height: 68px; }
  .marca__selo { width: 36px; height: 36px; flex-basis: 36px; }
  .marca__nome { font-size: 27px; }
  .topo__entrar { display: none; }
  .topo__acoes { gap: 8px; }
  .cta--topo { height: 36px; padding: 0 13px; font-size: 11px; }
  .hero { padding-top: 40px; }
  .pilula { font-size: 9px; letter-spacing: .1em; }
  .hero h1 { font-size: 44px; line-height: 1.08; }
  .hero__brilho { right: -26px; top: 42px; } .hero__brilho .i { width: 20px; height: 20px; }
  .hero__texto > p { font-size: 14px; }
  .cta, .botao-contorno { height: 48px; padding: 0 20px; font-size: 13px; }
  .hero__notas { gap: 14px; font-size: 11px; }
  .demo { margin-top: 36px; }
  .demo__barra { height: 30px; padding: 0 10px; font-size: 10px; }
  .demo__selo { display: none; }
  .demo__abas { gap: 2px; padding: 6px 6px 0; overflow-x: auto; }
  .demo__abas button { height: 34px; padding: 0 10px; font-size: 12px; white-space: nowrap; }
  .demo__celular, .demo__aviso { display: none; }
  .publico { flex-direction: column; gap: 14px; padding: 44px 0 26px; }
  .publico > div { gap: 12px 18px; font-size: 12px; }
  h2 { font-size: 34px; }
  .titulo-secao { display: block; }
  .titulo-secao > p { max-width: none; margin-top: 18px; font-size: 13px; }
  .recursos__grade { margin-top: 36px; gap: 30px 20px; }
  .recurso__icone { width: 36px; height: 36px; margin-bottom: 14px; }
  .recurso h3 { font-size: 14px; }
  .recurso p { font-size: 12px; line-height: 1.8; }
  .whats__grade, .conta__grade, .preco__grade, .duvidas__grade { grid-template-columns: 1fr; gap: 36px; }
  .palco { max-width: 400px; width: 100%; margin: 0 auto; }
  .palco__nota { right: 4px; font-size: 18px; }
  .fone { width: 290px; }
  .palco__aviso { left: 0; bottom: 64px; padding: 12px; font-size: 11px; }
  .cuidado { min-height: 460px; }
  .cuidado > img { object-position: 65% center; }
  .cuidado__veu { background: linear-gradient(90deg, #1a1816eb, #1a1816a6 65%, #1a18165c); }
  .cuidado__texto { padding: 60px 0; }
  .cuidado h2 { font-size: 32px; }
  .calc { padding: 22px; }
  .cartao-preco { width: 100%; max-width: 440px; margin: 0 auto; padding: 26px; }
  .valor { font-size: 44px; }
  .breve__grade { grid-template-columns: 1fr; margin-top: 34px; }
  .duvidas__lista summary { padding: 20px 0; font-size: 13px; }
  .final { padding: 60px 0; }
  .final h2 { font-size: 34px; }
  .final p { max-width: 300px; }
  .rodape__topo { flex-wrap: wrap; gap: 12px; }
  .rodape__base { flex-direction: column; }
}
@media (max-width: 420px) { .recursos__grade { grid-template-columns: 1fr; } .hero__brilho { display: none; } }
@media (max-width: 370px) {
  .container { width: calc(100% - 32px); }
  .hero h1 { font-size: 38px; }
  .hero__acoes { flex-direction: column; align-items: stretch; }
  .hero__acoes > a { justify-content: center; }
  .valor { font-size: 40px; }
  .fone { width: 270px; }
  .palco__aviso { display: none; }
  .rodape__topo > span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .demo, .duvidas__lista p, .chat--animar > li.chat--vista { animation: none; }
  .cta { transition: none; } .cta:hover { transform: none; }
}

/* Páginas de documento (privacidade, termos) */
.eyebrow { display: inline-block; color: var(--terracota-escuro); font-size: 10px; font-weight: 700; letter-spacing: .19em; line-height: 1.6; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--tinta); }
.brand__seal { display: block; width: 52px; height: 52px; flex: 0 0 52px; overflow: hidden; border-radius: 50%; background: url('img/luma-emblema-192.webp') center / 100% no-repeat; }
.brand__wordmark { display: flex; flex-direction: column; gap: 1px; }
.brand__wordmark > span { font-family: var(--serif); font-size: 34px; line-height: .92; letter-spacing: -.045em; }
.brand__wordmark small { font-size: 7px; letter-spacing: .19em; }
.pagina-documento { background: var(--fundo); }
.documento-topo { width: min(820px, calc(100% - 32px)); margin: 0 auto; padding: 28px 0 8px; }
.documento { width: min(820px, calc(100% - 32px)); margin: 0 auto; padding: 16px 0 72px; color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.documento h1 { font-family: var(--serif); font-size: clamp(38px, 6vw, 54px); font-weight: 500; letter-spacing: -.03em; margin: 8px 0 14px; color: var(--tinta); }
.documento h2 { font-family: var(--serif); font-size: 26px; font-weight: 500; letter-spacing: -.02em; margin: 36px 0 10px; color: var(--tinta); }
.documento h3 { font-family: var(--sans); font-size: 15px; font-weight: 700; margin: 18px 0 6px; color: var(--tinta); }
.documento p { margin: 0 0 14px; }
.documento ul { padding-left: 22px; }
.documento li { margin-bottom: 8px; }
.documento a { color: var(--terracota-escuro); text-decoration: underline; text-underline-offset: 3px; }
.documento-resumo { padding: 16px 18px; border-radius: 12px; background: var(--blush); color: var(--tinta); }
.documento-aviso { display: block; width: fit-content; margin: 0 0 18px; padding: 6px 12px; border-radius: 999px; background: #efece8; color: #6f6963; font-size: 12px; font-weight: 600; }
.documento-volta { margin-top: 40px; padding-top: 20px; border-top: 1px solid #e4e0db; }

/* Lummie Barbearia: títulos sem serifa, firmes; o destaque é a cor cobre, não o itálico */
:root { --serif: var(--sans); }
h1, h2 { font-weight: 700 !important; letter-spacing: -.035em; }
em { font-style: normal; font-weight: 700; }
.hero h1 em, h2 em { font-size: 1em; }
.marca__nome, .brand__wordmark > span { font-weight: 700; letter-spacing: -.04em; font-size: 26px; }
.palco__nota { font-style: normal; font-weight: 700; font-size: 17px; }
.calc__resultado strong { font-weight: 700; }

/* topo e abertura escuros (grafite), o resto da página claro */
.topo { background: #151413f2; border-bottom-color: #2c2a27; }
.topo .marca, .topo__entrar, .topo__menu { color: var(--escuro-texto); }
.topo__nav { color: var(--escuro-suave); }
.topo__nav a:hover, .topo__entrar:hover { color: var(--acento-claro); }
.menu-celular { background: #151413; border-top-color: #2c2a27; color: var(--escuro-texto); }
.menu-celular a { border-bottom-color: #2c2a27; }
.menu-celular .i { color: var(--acento-claro); }
.hero { background: linear-gradient(180deg, #151413 0%, #1d1b19 62%, var(--fundo) 62%, var(--fundo) 100%); color: var(--escuro-texto); }
.hero h1 em, .hero__brilho { color: var(--acento-claro); }
.hero__texto > p, .hero__notas { color: var(--escuro-suave); }
.hero__notas .i { color: var(--acento-claro); }
.pilula { background: #24221f; border-color: #3a3632; color: var(--escuro-suave); }
.hero .botao-contorno { color: var(--escuro-texto); border-color: #4a4540; }
.hero .botao-contorno:hover { background: #24221f; border-color: var(--acento-claro); }
.hero .botao-contorno .i { color: var(--acento-claro); }
.hero .publico { color: var(--tinta); }
.cuidado { background: repeating-linear-gradient(135deg, #1d1b19 0 22px, #211f1c 22px 44px); }
.cuidado__veu { background: linear-gradient(90deg, #151413f2 0%, #151413b3 55%, #15141300 100%); }
.documento-aviso { display: block; width: fit-content; margin: 0 0 18px; padding: 6px 12px; border-radius: 999px; background: #f3ebe4; color: #6b564b; font-size: 12px; font-weight: 600; }
.documento-volta { margin-top: 40px; padding-top: 20px; border-top: 1px solid #eaded6; }

/* Indique e ganhe (home e indique.html) */
.indique { border-top: 1px solid var(--linha); }
.indique__grade { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: start; }
.indique__grade p { margin-top: 20px; color: var(--tinta-suave); font-size: 14px; line-height: 1.9; }
.indique__grade .link-texto { margin-top: 22px; }
.indique-passos { display: grid; gap: 28px; margin: 0; padding: 0; list-style: none; counter-reset: passo; }
.indique-passos li { display: grid; grid-template-columns: 52px 1fr; column-gap: 12px; counter-increment: passo; }
.indique-passos li::before { content: counter(passo); grid-row: span 2; color: var(--terracota-medio); font-family: var(--serif); font-size: 40px; font-variant-numeric: lining-nums; line-height: 1; }
.indique-passos h3 { font-size: 16px; font-weight: 700; }
.indique-passos p { margin-top: 6px; }
.indique-abre h1 { font-size: 56px; font-weight: 500; line-height: 1.1; letter-spacing: -.02em; }
.indique-abre h1 em { color: var(--terracota-medio); font-size: 1.1em; }
.indique-abre p { max-width: 620px; margin-top: 24px; color: var(--tinta-suave); font-size: 15px; line-height: 1.9; }
.indique-abre__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.indique-chega { display: grid; gap: 22px; margin: 0; }
.indique-chega div { padding-bottom: 22px; border-bottom: 1px solid var(--linha); }
.indique-chega dt { font-size: 15px; font-weight: 700; }
.indique-chega dd { margin: 6px 0 0; color: var(--tinta-suave); font-size: 14px; line-height: 1.8; }
.indique-regulamento { border-top: 1px solid var(--linha); }
.indique-regulamento .documento { padding-top: 0; padding-bottom: 0; }
.indique-regulamento ol { display: grid; gap: 14px; margin-top: 22px; padding-left: 20px; font-size: 14px; line-height: 1.8; }
@media (max-width: 860px) {
  .indique__grade { grid-template-columns: 1fr; gap: 40px; }
  .indique-abre h1 { font-size: 40px; }
}
