/*
 * ESTILO: Athenas Livraria
 * Responsavel: Wanjo
 *
 * Direcao: livraria classica a noite. Fundo quase preto, dourado, letra de
 * inscricao em maiusculas (Cinzel) e italico de livro antigo (Cormorant) nos
 * acentos. As fotos dos livros tem fundo branco: elas ficam dentro de "nichos"
 * claros, como um livro iluminado na estante, e se misturam ao nicho.
 * Feito para celular. Cantos retos em tudo; a unica curva e a do seletor de foco.
 */

@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-variavel.woff2") format("woff2");
  font-weight: 400 900;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-italico-500.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-italico-600.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-variavel.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --noite: #0c0a08;
  --noite-2: #15120d;
  --noite-3: #201b13;
  --ouro: #c9a24b;
  --ouro-claro: #ecd597;
  --ouro-fundo: #8a6a26;
  --marfim: #f1e9d8;
  --marfim-2: #b8ad99;
  --fio: rgba(201, 162, 75, 0.32);
  --fio-forte: rgba(201, 162, 75, 0.6);
  --nicho-centro: #fffaea;
  --nicho-borda: #d9c9a2;
  --inscricao: "Cinzel", "Times New Roman", serif;
  --italico: "Cormorant Garamond", Georgia, serif;
  --texto: "Hanken Grotesk", system-ui, sans-serif;
  --barra: 68px;
}

*,
*::before,
*::after { box-sizing: border-box; }
html { background: var(--noite); color-scheme: dark; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 16px; }
body {
  margin: 0;
  font-family: var(--texto);
  font-size: 17px;
  line-height: 1.55;
  color: var(--marfim);
  background: var(--noite);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p, ul, dl, dd, figure, blockquote { margin: 0; }
ul { padding: 0; list-style: none; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--marfim); outline-offset: 3px; border-radius: 2px; }

.envolve { width: 100%; max-width: 560px; margin: 0 auto; padding: 0 22px; }
.icone { width: 1.15em; height: 1.15em; flex: none; }
.pular { position: absolute; left: -999px; top: 8px; z-index: 50; padding: 10px 14px; background: var(--marfim); color: var(--noite); }
.pular:focus { left: 8px; }

/* ---------------------------------------------------------------- LETRAS */
.titulo {
  font-family: var(--inscricao);
  font-weight: 600;
  font-size: 27px;
  line-height: 1.16;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  text-wrap: balance;
}
.titulo--maior { font-size: clamp(33px, 9.6vw, 44px); line-height: 1.08; font-weight: 700; }
.titulo--menor { font-size: 21px; line-height: 1.22; letter-spacing: 0.04em; }
.ouro {
  color: var(--ouro);
  background: linear-gradient(180deg, #f6e6b4 0%, #d6b25a 48%, #a8802f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.sobrelinha {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--inscricao);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ouro);
}
.sobrelinha::after { content: ""; flex: 1; height: 1px; background: var(--fio); }
.manuscrito { font-family: var(--italico); font-style: italic; font-weight: 500; font-size: 27px; line-height: 1.15; color: var(--marfim); text-wrap: balance; }

/* Filete com losango: o ornamento dos cartazes da livraria. */
.filete { position: relative; height: 9px; margin: 26px auto; max-width: 240px; }
.filete::before { content: ""; position: absolute; left: 0; right: 0; top: 4px; height: 1px; background: linear-gradient(90deg, transparent, var(--fio-forte) 22%, var(--fio-forte) 78%, transparent); }
.filete::after { content: ""; position: absolute; left: 50%; top: 0; width: 9px; height: 9px; margin-left: -4.5px; background: var(--ouro); transform: rotate(45deg); box-shadow: 0 0 0 4px var(--noite); }

/* ---------------------------------------------------------------- MARCA */
.topo { padding: 22px 0 6px; }
.marca { text-align: center; }
.marca a { display: inline-flex; flex-direction: column; align-items: center; gap: 5px; text-decoration: none; }
.marca__nome {
  font-family: var(--inscricao);
  font-weight: 700;
  font-size: 23px;
  letter-spacing: 0.3em;
  margin-right: -0.3em;
  text-transform: uppercase;
  background: linear-gradient(180deg, #f6e6b4, #c9a24b 60%, #9c772b);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.marca__sub { display: flex; align-items: center; gap: 9px; font-family: var(--inscricao); font-size: 9.5px; letter-spacing: 0.46em; margin-right: -0.46em; text-transform: uppercase; color: var(--ouro); }
.marca__sub::before,
.marca__sub::after { content: ""; width: 20px; height: 1px; background: var(--fio-forte); }
.marca__sub::after { margin-left: -0.46em; }

/* Identidade do header: monograma e assinatura editorial. */
.topo--premium {
  --marca-ouro: #d2b77e;
  --marca-ouro-suave: #b7a17a;
  position: relative;
  padding: 22px 0 20px;
  background: #080808;
}
.topo--premium::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: min(280px, calc(100% - 64px));
  height: 1px;
  transform: translateX(-50%);
  background: rgba(210, 183, 126, .13);
}
.topo--premium .marca a {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  text-align: center;
  color: var(--marca-ouro);
}
.topo--premium .marca__simbolo {
  display: block;
  flex: none;
  width: 64px;
  height: auto;
  overflow: visible;
}
.topo--premium .marca__assinatura {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}
.topo--premium .marca__nome {
  display: block;
  font-family: var(--inscricao);
  font-size: clamp(28px, 7.2vw, 34px);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: .2em;
  margin-right: -.2em;
  white-space: nowrap;
  font-kerning: normal;
  background: none;
  color: var(--marca-ouro);
  -webkit-text-fill-color: currentColor;
}
.topo--premium .marca__sub {
  display: block;
  font-family: var(--inscricao);
  font-size: 9px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .42em;
  margin-right: -.42em;
  color: var(--marca-ouro-suave);
}
.topo--premium .marca__sub::before,
.topo--premium .marca__sub::after { content: none; }
.topo--premium .marca a:focus-visible {
  outline: 1px solid var(--marca-ouro);
  outline-offset: 8px;
  border-radius: 0;
}
@media (min-width: 768px) {
  .topo--premium { padding: 24px 0; }
  .topo--premium .marca a { gap: 12px; }
  .topo--premium .marca__simbolo { width: 72px; }
  .topo--premium .marca__assinatura { gap: 8px; }
  .topo--premium .marca__nome { font-size: 36px; letter-spacing: .22em; margin-right: -.22em; }
  .topo--premium .marca__sub { font-size: 10px; }
}
/* ---------------------------------------------------------------- BOTOES */
.botao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 56px;
  padding: 14px 26px;
  border: 0;
  font-family: var(--inscricao);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  color: #1b1405;
  background: linear-gradient(180deg, #f3dfa2 0%, #d2ac50 46%, #a9812f 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 10px 26px rgba(0, 0, 0, 0.5);
  cursor: pointer;
  transition: transform 0.16s ease, filter 0.16s ease;
}
.botao:active { transform: translateY(1px) scale(0.99); filter: brightness(0.94); }
.botao--largo { display: flex; width: 100%; }
.botao--parado { color: var(--marfim-2); background: var(--noite-3); box-shadow: inset 0 0 0 1px var(--fio); cursor: not-allowed; }
.botao--contorno { color: var(--ouro-claro); background: transparent; box-shadow: inset 0 0 0 1px var(--fio-forte); }
.botao--barra { min-height: 46px; padding: 10px 20px; font-size: 13px; }

/* ---------------------------------------------------------------- NICHO */
/* A foto tem fundo branco. Com "multiply", o branco vira a luz do nicho. */
.nicho {
  position: relative;
  background: radial-gradient(118% 92% at 50% 34%, var(--nicho-centro) 0%, #f3e7c8 52%, var(--nicho-borda) 100%);
  box-shadow: 0 0 0 1px var(--fio-forte), 0 0 0 7px var(--noite), 0 0 0 8px var(--fio), 0 30px 60px rgba(0, 0, 0, 0.65);
  overflow: hidden;
}
.nicho img { width: 100%; mix-blend-mode: multiply; }
.nicho--capa { padding: 10px 12px 6px; align-self: start; }
.nicho--verso { width: 100%; max-width: 380px; margin: 28px auto 0; padding: 0; background: none; box-shadow: none; }
.nicho--verso img {
  mix-blend-mode: normal;
  /* O recorte segue o contorno do produto sem deixar residuos nas bordas. */
  clip-path: polygon(8.9% 9%, 9.4% 8.1%, 71.9% 5.8%, 89.8% 6.7%, 91.7% 7.5%, 91.9% 87.5%, 72% 94.3%, 8.8% 87.5%);
}
.nicho--compra { margin: 0 auto 24px; max-width: 300px; padding: 12px 20px 6px; }

/* ---------------------------------------------------------------- ABERTURA */
.abertura { padding: 30px 0 40px; }
.abertura__categoria { font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: .08em; text-align: center; color: #d2b77e; }
.abertura .titulo {
  margin: 16px auto 0;
  font-family: var(--inscricao);
  font-style: normal;
  font-weight: 400;
  font-size: clamp(27px, 7.7vw, 38px);
  line-height: 1.3;
  letter-spacing: .015em;
  text-align: center;
  text-transform: none;
  text-wrap: balance;
  color: var(--marfim);
}
.abertura .titulo span { display: block; }
.abertura .titulo span + span { color: #d2b77e; }
.abertura__subtitulo { margin: 18px auto 0; max-width: 34ch; font-size: 15px; line-height: 1.7; text-align: center; text-wrap: balance; color: var(--marfim-2); }
.abertura .nicho--abertura {
  max-width: 440px;
  margin: 10px auto 8px;
  padding: 0;
  background: none;
  box-shadow: none;
}
.abertura .nicho--abertura img {
  width: 120%;
  max-width: none;
  margin-left: -10%;
  mix-blend-mode: normal;
  /* O recorte acompanha o contorno do box e exclui pixels externos. */
  clip-path: polygon(16.4% 11.2%, 32.8% 7%, 81.8% 11.7%, 82.7% 12.6%, 82.7% 85.8%, 32.9% 91%, 16% 81.5%);
}
.abertura .fatos { margin-top: 22px; border-color: rgba(210, 183, 126, .18); border-bottom: 0; }
.abertura .fatos li { padding: 16px 4px 0; gap: 4px; }
.abertura .fatos li + li { border-left: 0; }
.abertura .fatos strong { font-family: inherit; font-size: 16px; font-weight: 500; letter-spacing: 0; color: var(--marfim); }
.abertura .fatos span { font-size: 12px; }
.abertura__texto { max-width: 44ch; margin: 0 auto; font-size: 14px; line-height: 1.7; text-align: center; color: var(--marfim-2); }
.fatos { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 26px; border-top: 1px solid var(--fio); border-bottom: 1px solid var(--fio); }
.fatos li { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 16px 4px; text-align: center; }
.fatos li + li { border-left: 1px solid var(--fio); }
.fatos .icone { width: 22px; height: 22px; color: var(--ouro); margin-bottom: 4px; }
.fatos strong { font-family: var(--inscricao); font-size: 19px; font-weight: 700; letter-spacing: 0.03em; color: var(--ouro-claro); white-space: nowrap; }
.fatos span { font-size: 13px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- SECOES */
.secao { padding: 54px 0; }
.secao--faixa { background: var(--noite-2); border-top: 1px solid var(--fio); border-bottom: 1px solid var(--fio); }
.secao__apoio { margin-top: 12px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- ESTANTE */
/* Seis lombadas, como no box. Cada uma e um botao de opcao: funciona sem script. */
.estante__grupo { margin-top: 30px; }
.estante__opcao { position: absolute; opacity: 0; pointer-events: none; }
.estante__lombadas { display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px; align-items: end; padding: 14px 4px 0; }
.lombada {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 222px;
  background: linear-gradient(90deg, #e9dfc6 0%, #fbf5e4 22%, #fffaea 60%, #e4d8b9 100%);
  border-bottom: 34px solid var(--cor);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.5);
  cursor: pointer;
  transition: transform 0.28s cubic-bezier(0.2, 0.9, 0.3, 1.2), box-shadow 0.28s ease;
}
.lombada::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 7px; background: var(--cor); }
.lombada__nome {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--inscricao);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--cor);
}
.estante__tabua { height: 12px; margin: 0 -6px; background: linear-gradient(180deg, #e7cc86, #b08a39 40%, #5f4717); box-shadow: 0 16px 26px rgba(0, 0, 0, 0.7); }
.estante__fichas { margin-top: 34px; }
.ficha { display: none; grid-template-columns: 40% 1fr; gap: 20px; align-items: start; animation: surge 0.4s ease both; }
.ficha__area { display: inline-block; padding: 4px 10px; font-family: var(--inscricao); font-size: 11px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #fffaea; background: var(--cor); }
.ficha__nome { margin-top: 12px; font-family: var(--inscricao); font-size: 22px; font-weight: 700; line-height: 1.14; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ouro-claro); }
.ficha__linha { margin: 6px 0 12px; font-family: var(--italico); font-style: italic; font-size: 19px; line-height: 1.2; color: var(--ouro); }
.ficha__texto > p:last-child { font-size: 16px; color: var(--marfim); }
@keyframes surge { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---------------------------------------------------------------- CONTEUDO */
.pontos { margin-top: 26px; display: grid; gap: 22px; }
.pontos li { position: relative; padding-left: 28px; }
.pontos li::before { content: ""; position: absolute; left: 4px; top: 8px; width: 9px; height: 9px; background: var(--ouro); transform: rotate(45deg); }
.pontos h3 { font-family: var(--inscricao); font-size: 17px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ouro-claro); }
.pontos p { margin-top: 4px; color: var(--marfim-2); }
.mais { margin-top: 34px; border-top: 1px solid var(--fio); border-bottom: 1px solid var(--fio); }
.mais summary,
.duvidas summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; list-style: none; }
.mais summary::-webkit-details-marker,
.duvidas summary::-webkit-details-marker { display: none; }
.mais summary { font-family: var(--inscricao); font-size: 13.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ouro); }
.mais summary .icone,
.duvidas summary .icone { color: var(--ouro); transition: transform 0.2s ease; }
details[open] > summary .icone { transform: rotate(180deg); }
.mais p { padding-bottom: 16px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- FORMATO */
.medida { display: flex; justify-content: center; margin: 34px 0 30px; }
.medida__livro {
  position: relative;
  width: 118px; /* 10,7 cm */
  height: 165px; /* 15 cm, na mesma escala */
  background: radial-gradient(120% 90% at 40% 30%, var(--nicho-centro), var(--nicho-borda));
  box-shadow: 0 0 0 1px var(--fio-forte), 14px 18px 30px rgba(0, 0, 0, 0.6);
}
.medida__alt,
.medida__larg { position: absolute; font-family: var(--inscricao); font-size: 13px; font-weight: 600; letter-spacing: 0.08em; color: var(--ouro-claro); white-space: nowrap; }
.medida__alt { left: calc(100% + 26px); top: 50%; transform: translateY(-50%); }
.medida__alt::before { content: ""; position: absolute; right: calc(100% + 8px); top: -72px; width: 1px; height: 165px; background: var(--fio-forte); }
.medida__larg { top: calc(100% + 18px); left: 50%; transform: translateX(-50%); }
.medida__larg::before { content: ""; position: absolute; bottom: calc(100% + 6px); left: 50%; width: 118px; height: 1px; margin-left: -59px; background: var(--fio-forte); }
.lista-ok { display: grid; gap: 12px; margin-top: 44px; }
.lista-ok li { display: flex; gap: 12px; align-items: flex-start; }
.lista-ok .icone { color: var(--ouro); margin-top: 4px; }

/* ---------------------------------------------------------------- COMPRA */
.compra { background: radial-gradient(90% 40% at 50% 0%, rgba(201, 162, 75, 0.16), transparent 72%); }
.moldura { position: relative; padding: 30px 22px 28px; background: var(--noite-2); box-shadow: 0 0 0 1px var(--fio-forte), 0 0 0 6px var(--noite), 0 0 0 7px var(--fio); }
.moldura .titulo { margin-top: 12px; color: var(--marfim); }
.compra__nota { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 15px; color: var(--marfim-2); }
.compra__nota strong { font-family: var(--inscricao); font-size: 18px; color: var(--ouro-claro); }
.compra__nota a { text-underline-offset: 3px; }
.preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-top: 18px; }
.preco__de { flex-basis: 100%; font-size: 15px; color: var(--marfim-2); }
.preco__valor { font-family: var(--inscricao); font-size: 42px; font-weight: 700; line-height: 1; letter-spacing: 0.01em; color: var(--ouro-claro); }
.preco__selo { padding: 4px 9px; font-size: 13px; font-weight: 700; color: #1b1405; background: var(--ouro); }
.preco__cond { flex-basis: 100%; font-size: 15px; color: var(--marfim-2); }
.compra__aviso { margin-top: 18px; font-family: var(--italico); font-style: italic; font-size: 21px; color: var(--marfim-2); }
.moldura .botao { margin-top: 20px; }
.compra__garantias { display: grid; gap: 8px; margin-top: 16px; font-size: 15px; color: var(--marfim-2); }
.compra__garantias li { display: flex; gap: 10px; align-items: center; }
.compra__garantias .icone { color: var(--ouro); }
.compra__subtitulo { font-family: var(--inscricao); font-size: 13px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ouro); }
.compra__volumes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin-top: 14px; font-size: 15.5px; }
.compra__volumes li { display: flex; align-items: center; gap: 9px; }
.compra__volumes li::before { content: ""; flex: none; width: 6px; height: 20px; background: var(--cor); box-shadow: 0 0 0 1px rgba(255, 250, 234, 0.35); }

/* ---------------------------------------------------------------- AVALIACOES */
.avaliacoes { margin-top: 46px; }
.avaliacoes__topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.avaliacoes__topo .titulo { color: var(--ouro-claro); }
.avaliacoes__nota { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; color: var(--marfim-2); font-size: 14px; }
.avaliacoes__nota .estrelas { align-self: center; }
.avaliacoes__nota strong { font-family: var(--inscricao); font-size: 24px; color: var(--ouro-claro); }
.estrelas { position: relative; display: inline-flex; color: rgba(201, 162, 75, 0.28); }
.estrelas .icone { width: 16px; height: 16px; }
.estrelas__cheias { position: absolute; inset: 0; display: flex; width: calc(var(--nota) / 5 * 100%); overflow: hidden; color: var(--ouro); }
.avaliacoes__lista {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 82%;
  gap: 14px;
  margin: 20px -22px 0;
  padding: 4px 22px 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.avaliacoes__lista::-webkit-scrollbar { display: none; }
.avaliacao { display: flex; flex-direction: column; gap: 12px; padding: 20px 18px; background: var(--noite-2); box-shadow: inset 0 0 0 1px var(--fio); scroll-snap-align: start; }
.secao--faixa .avaliacao { background: var(--noite); }
.avaliacao__texto { font-family: var(--italico); font-style: italic; font-size: 20px; line-height: 1.3; color: var(--marfim); }
.avaliacao__quem { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; font-size: 13px; letter-spacing: 0.04em; color: var(--marfim-2); }
.avaliacoes__origem { margin-top: 6px; font-size: 13px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- PARA QUEM */
.quem { display: grid; gap: 0; margin-top: 24px; }
.quem li { display: flex; gap: 18px; align-items: flex-start; padding: 20px 0; border-bottom: 1px solid var(--fio); }
.quem .icone { width: 30px; height: 30px; color: var(--ouro); margin-top: 2px; }
.quem h3 { font-family: var(--inscricao); font-size: 16px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ouro-claro); }
.quem p { margin-top: 4px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- FICHA */
.tabela { margin-top: 22px; }
.tabela div { display: grid; grid-template-columns: 38% 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--fio); }
.tabela dt { font-family: var(--inscricao); font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ouro); padding-top: 3px; }
.tabela dd { color: var(--marfim); }

/* ---------------------------------------------------------------- DUVIDAS */
.duvidas { margin-top: 18px; border-top: 1px solid var(--fio); }
.duvidas details { border-bottom: 1px solid var(--fio); }
.duvidas summary { font-weight: 600; font-size: 17px; color: var(--marfim); }
.duvidas p { padding: 0 0 18px; color: var(--marfim-2); }

/* ---------------------------------------------------------------- FECHO */
.fecho { text-align: center; background: radial-gradient(90% 60% at 50% 100%, rgba(201, 162, 75, 0.18), transparent 70%); }
.citacao { margin-bottom: 40px; }
.citacao__aspas { width: 40px; height: 40px; color: var(--ouro); }
.citacao blockquote p { margin-top: 10px; font-family: var(--italico); font-style: italic; font-weight: 500; font-size: 27px; line-height: 1.22; color: var(--marfim); text-wrap: balance; }
.citacao figcaption { margin-top: 16px; font-family: var(--inscricao); font-size: 11.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ouro); }
.fecho__preco { margin-top: 18px; font-family: var(--inscricao); font-size: 30px; font-weight: 700; color: var(--ouro-claro); }
.fecho__preco span { display: block; font-family: var(--texto); font-size: 15px; font-weight: 400; color: var(--marfim-2); }
.fecho .botao { margin-top: 24px; }

/* ---------------------------------------------------------------- RODAPE */
.rodape { padding: 46px 0; text-align: center; background: #070605; border-top: 1px solid var(--fio); }
.rodape__assinatura { margin-top: 14px; font-family: var(--italico); font-style: italic; font-size: 21px; color: var(--marfim-2); }
.rodape__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 22px; font-size: 15px; }
.rodape__links a { text-decoration: none; border-bottom: 1px solid var(--fio); padding: 11px 0; display: inline-block; }
.rodape__contatos { display: grid; gap: 12px; justify-items: center; margin-top: 24px; font-size: 15px; }
.rodape__contatos a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 0; text-decoration: none; color: var(--ouro-claro); }
.rodape__nota { margin-top: 22px; font-size: 13px; line-height: 1.5; color: var(--marfim-2); text-wrap: balance; }
.rodape__empresa { margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(201, 162, 75, .18); font-size: 13px; line-height: 1.8; }
.rodape__cnpj { margin-bottom: 8px; font-weight: 500; color: var(--ouro-claro); font-variant-numeric: tabular-nums; }
.rodape__endereco { font-style: normal; color: var(--marfim-2); }
.rodape__endereco span { display: block; }

/* ---------------------------------------------------------------- BARRA FIXA */
.barra {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: var(--barra);
  padding: 10px 18px calc(10px + env(safe-area-inset-bottom));
  background: rgba(12, 10, 8, 0.96);
  border-top: 1px solid var(--fio-forte);
  transition: transform 0.3s ease;
}
.barra__texto { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.barra__texto strong { font-family: var(--inscricao); font-size: 12.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--marfim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.barra__texto span { font-size: 14px; color: var(--ouro-claro); }
.js .barra[data-oculta] { transform: translateY(110%); }

/* Nas paginas com barra fixa, o rodape deixa espaco para ela. */
.rodape:has(+ .barra) { padding-bottom: calc(var(--barra) + 40px); }

/* ---------------------------------------------------------------- POLITICAS */
.politica { padding: 20px 0 60px; }
.voltar { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 14px; font-size: 15px; text-decoration: none; color: var(--ouro-claro); }
.politica__resumo { margin-top: 14px; font-family: var(--italico); font-style: italic; font-size: 23px; line-height: 1.25; color: var(--marfim); }
.politica__data { margin-top: 12px; font-size: 13px; letter-spacing: 0.06em; color: var(--marfim-2); }
.politica section { margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--fio); }
.politica section h2 { font-family: var(--inscricao); font-size: 16px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ouro-claro); }
.politica section p { margin-top: 12px; color: var(--marfim); }
.politica section ul { margin-top: 12px; display: grid; gap: 10px; }
.politica section li { position: relative; padding-left: 22px; color: var(--marfim); }
.politica section li::before { content: ""; position: absolute; left: 3px; top: 9px; width: 7px; height: 7px; background: var(--ouro); transform: rotate(45deg); }
.politica__empresa { margin-top: 34px; font-size: 14px; color: var(--marfim-2); }
.politica .botao { margin-top: 26px; }

/* ---------------------------------------------------------------- MOVIMENTO */
.entra { animation: entra 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
.entra--2 { animation-delay: 0.08s; }
.entra--3 { animation-delay: 0.18s; }
.entra--4 { animation-delay: 0.3s; }
@keyframes entra { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.js .revela { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1); }
.js .revela.visto { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .entra, .ficha { animation: none; }
  .js .revela { opacity: 1; transform: none; transition: none; }
  .lombada, .barra, .botao { transition: none; }
}

/* ---------------------------------------------------------------- SO CELULAR */
/* Regra do projeto: no computador o site publico mostra tela branca. */
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  html.so-celular,
  html.so-celular body { background: #ffffff; }
  html.so-celular body > :not(.topo--premium) { display: none !important; }
}

.junto { white-space: nowrap; }

.abertura__continuar { margin-top: 28px; text-align: center; font-size: 12px; line-height: 1.6; color: var(--marfim-2); }
.abertura__continuar span { display: block; margin-top: 5px; font-size: 18px; color: #d2b77e; }
