/* ==========================================================
   Massagem em Caraíva · Érika Americano
   Mobile-first · sem dependências · paleta terrosa
   ========================================================== */

/* Fontes hospedadas no próprio site (licença SIL OFL): evitam 2 servidores extras,
   o que no 3G da vila economiza vários segundos, e funcionam no Modo Vila */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400 500; font-display: swap; src: url("../fontes/cormorant-garamond.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fontes/cormorant-garamond-italico.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 300 500; font-display: swap; src: url("../fontes/jost.woff2") format("woff2"); }

:root {
  /* Paleta: areia, argila (cor do logo), folha, rio */
  --areia: #F4EDE3;
  --areia-2: #EBE1D2;
  --areia-3: #DDD0BD;
  --linho: #E9E1D3;
  --argila: #7A5634;
  --argila-escura: #5C3F25;
  --folha: #56624A;
  --folha-escura: #3E4836;
  --rio: #6E8C88;
  --tinta: #2B241E;
  --tinta-suave: #5E544A;
  --branco: #FFFCF7;

  --serif: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans: "Jost", "Avenir Next", "Segoe UI", system-ui, sans-serif;

  --gutter: clamp(1.25rem, 5vw, 4rem);
  --max: 1200px;
  --raio: 2px;
  --raio-foto: 999px 999px 4px 4px; /* arco, eco do emblema */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --topo-h: 64px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--topo-h); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--areia);
  color: var(--tinta);
  font: 300 1.0625rem/1.7 var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.08; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 em, h2 em { font-style: italic; color: var(--argila); }
p { margin: 0 0 1em; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--argila); outline-offset: 3px; }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pular { position: absolute; left: -999px; top: 0; background: var(--tinta); color: var(--areia); padding: .75rem 1rem; z-index: 100; }
.pular:focus { left: 0; }

.sobretitulo {
  font: 500 .75rem/1.4 var(--sans);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--folha);
  margin-bottom: 1.1rem;
}

/* ---------- Botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px; padding: .85rem 1.6rem;
  background: var(--folha-escura); color: var(--branco);
  border: 1px solid var(--folha-escura); border-radius: 999px;
  font: 400 .8125rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase;
  text-decoration: none; transition: background .4s var(--ease), color .4s var(--ease), transform .4s var(--ease);
}
.botao:hover { background: var(--argila-escura); border-color: var(--argila-escura); }
.botao:active { transform: scale(.98); }
.botao--vazado { background: transparent; color: var(--tinta); border-color: currentColor; }
.botao--vazado:hover { background: var(--tinta); color: var(--areia); border-color: var(--tinta); }
.botao--claro { background: var(--areia); color: var(--tinta); border-color: var(--areia); }
.botao--claro:hover { background: var(--branco); border-color: var(--branco); color: var(--tinta); }
.botao--pequeno { min-height: 40px; padding: .6rem 1.1rem; font-size: .75rem; }

.link-seta {
  display: inline-flex; align-items: center; gap: .6rem;
  font: 500 .8125rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase;
  color: var(--argila); text-decoration: none; padding: .5rem 0;
}
.link-seta::after { content: "→"; transition: transform .4s var(--ease); }
.link-seta:hover::after { transform: translateX(5px); }
.link-simples { background: none; border: 0; color: var(--tinta-suave); text-decoration: underline; padding: .75rem; }

/* ---------- Cabeçalho ---------- */
.topo {
  position: fixed; inset: 0 0 auto; z-index: 50;
  height: var(--topo-h);
  display: flex; align-items: center; gap: 1rem;
  padding: 0 var(--gutter);
  color: var(--branco);
  transition: background .5s var(--ease), color .5s var(--ease), box-shadow .5s var(--ease);
}
.topo.is-solido {
  background: rgba(244, 237, 227, .92);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  color: var(--tinta);
  box-shadow: 0 1px 0 rgba(43, 36, 30, .08);
}
.marca { display: flex; align-items: center; gap: .6rem; text-decoration: none; margin-right: auto; }
.marca img { width: 22px; height: auto; transition: filter .5s; filter: brightness(0) invert(1); }
.topo.is-solido .marca img { filter: none; }
.marca__texto { font: 400 1.35rem/1 var(--serif); letter-spacing: .12em; text-transform: uppercase; }
.marca__texto small { display: block; font: 400 .55rem/1 var(--sans); letter-spacing: .32em; margin-bottom: 3px; }

.menu { display: none; }
.topo > .botao { display: none; }
.menu-botao {
  width: 44px; height: 44px; margin-right: -10px;
  background: none; border: 0; color: inherit;
  display: grid; place-content: center; gap: 7px;
}
.menu-botao span:not(.sr) { display: block; width: 24px; height: 1px; background: currentColor; transition: transform .4s var(--ease); }
.menu-botao[aria-expanded="true"] span:nth-child(1) { transform: translateY(4px) rotate(45deg); }
.menu-botao[aria-expanded="true"] span:nth-child(2) { transform: translateY(-4px) rotate(-45deg); }

/* Menu aberto no celular */
.menu.is-aberto {
  display: flex; flex-direction: column; justify-content: center; gap: 1.4rem;
  position: fixed; inset: var(--topo-h) 0 0; padding: 2rem var(--gutter) 6rem;
  background: var(--areia); color: var(--tinta);
  animation: surgir .45s var(--ease);
}
.menu.is-aberto a { font: 400 2rem/1.1 var(--serif); text-decoration: none; }
.menu.is-aberto .menu__destaque { color: var(--argila); font-style: italic; }
.topo.menu-ativo { background: var(--areia); color: var(--tinta); }
.topo.menu-ativo .marca img { filter: none; }

@media (min-width: 960px) {
  .menu-botao { display: none; }
  .topo > .botao { display: inline-flex; }
  .topo:not(.is-solido) > .botao { background: transparent; border-color: rgba(255,255,255,.7); }
  .menu { display: flex; gap: 2rem; margin-right: 1.5rem; }
  .menu a { font: 400 .8125rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; opacity: .88; position: relative; padding: .5rem 0; }
  .menu a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
  .menu a:hover::after { transform: scaleX(1); }
}

/* ---------- Hero ---------- */
.hero {
  position: relative; min-height: 100svh;
  display: grid; align-items: end;
  color: var(--branco); isolation: isolate; overflow: hidden;
  background: #8d8a7e;
}
.hero__foto, .hero__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; z-index: -2; }
.hero__foto img { animation: respirar 20s cubic-bezier(.45, 0, .55, 1) infinite alternate; } /* Ken Burns 1.0 → 1.05 */
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  /* a foto tem céu estourado no topo: véu geral + gradiente forte atrás do texto */
  background:
    linear-gradient(180deg, rgba(30,24,18,.5) 0%, rgba(30,24,18,0) 18%),
    linear-gradient(0deg, rgba(30,24,18,.85) 0%, rgba(30,24,18,.55) 45%, rgba(30,24,18,.2) 80%),
    rgba(30,24,18,.15);
}
.hero h1, .hero__lead, .hero .sobretitulo { text-shadow: 0 1px 24px rgba(30,24,18,.35); }
@media (min-width: 768px) {
  .hero::after {
    background:
      linear-gradient(180deg, rgba(30,24,18,.5) 0%, rgba(30,24,18,0) 18%),
      linear-gradient(90deg, rgba(30,24,18,.78) 0%, rgba(30,24,18,.45) 45%, rgba(30,24,18,0) 75%),
      linear-gradient(0deg, rgba(30,24,18,.6) 0%, rgba(30,24,18,0) 30%);
  }
}
.hero__conteudo { padding: 7rem var(--gutter) 2rem; max-width: 46rem; }
.hero .sobretitulo { color: rgba(255,252,247,.85); }
.hero h1 { font-size: clamp(3rem, 12vw, 6.5rem); line-height: .95; margin-bottom: 1.5rem; }
.hero h1 em { color: #F1D9B8; }
.hero__lead { font-size: 1.0625rem; max-width: 32rem; opacity: .92; margin-bottom: 2rem; }
.hero__acoes { display: flex; flex-wrap: wrap; gap: .75rem; }
.hero .botao--vazado { color: var(--branco); }
.hero .botao--vazado:hover { background: var(--branco); color: var(--tinta); border-color: var(--branco); }
.hero__faixa {
  list-style: none; margin: 0; padding: 1.25rem var(--gutter) 1.5rem;
  display: flex; flex-wrap: wrap; gap: .4rem 1.75rem;
  font-size: .8125rem; letter-spacing: .04em; color: rgba(255,252,247,.85);
  border-top: 1px solid rgba(255,252,247,.2);
}
.hero__faixa strong { font-weight: 500; color: var(--branco); }

@media (min-width: 768px) {
  .hero__foto img { object-position: 50% 40%; }
  .hero__conteudo { padding-bottom: 3rem; }
  .hero__faixa { justify-content: space-between; }
}

/* ---------- Seções ---------- */
.secao { padding: clamp(4.5rem, 12vw, 9rem) var(--gutter); max-width: calc(var(--max) + 2 * var(--gutter)); margin: 0 auto; }
.secao h2 { font-size: clamp(2.3rem, 7vw, 4rem); }
.secao__cabeca { max-width: 40rem; margin-bottom: clamp(2.5rem, 6vw, 4rem); }
.secao__cabeca p:last-child { color: var(--tinta-suave); }
.secao__cabeca a { color: var(--argila); }

/* Manifesto */
.manifesto { display: grid; gap: 3rem; align-items: center; }
.manifesto__texto p:not(.sobretitulo) { color: var(--tinta-suave); max-width: 34rem; }
.manifesto__foto { margin: 0; }
.manifesto__foto img { border-radius: var(--raio-foto); aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
@media (min-width: 900px) {
  .manifesto { grid-template-columns: 1.1fr .9fr; gap: 6rem; }
}

/* Método */
.metodo { border-top: 1px solid var(--areia-3); }
.pilares { list-style: none; padding: 0; margin: 0; display: grid; gap: 3rem; }
.pilar img { aspect-ratio: 3 / 4; object-fit: cover; width: 100%; border-radius: var(--raio); margin-bottom: 1.4rem; }
.pilar__num { font: italic 400 1.1rem/1 var(--serif); color: var(--argila); }
.pilar h3 { font-size: 1.9rem; margin: .4rem 0 .6rem; }
.pilar p { color: var(--tinta-suave); font-size: 1rem; }
.tecnicas { list-style: none; padding: 0; margin: 3.5rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.tecnicas li { border: 1px solid var(--areia-3); border-radius: 999px; padding: .45rem 1rem; font-size: .875rem; color: var(--tinta-suave); }
@media (min-width: 760px) {
  .pilares { grid-template-columns: repeat(3, 1fr); gap: 2rem; }
  .pilar:nth-child(2) { margin-top: 4rem; }
}

/* Autoridade */
.autoridade { background: var(--folha-escura); color: var(--areia); padding: clamp(4rem, 10vw, 7rem) var(--gutter); }
.autoridade__grade { max-width: var(--max); margin: 0 auto; display: grid; gap: 2.5rem; }
.autoridade__item { font-size: 1rem; color: rgba(244,237,227,.8); max-width: 20rem; margin: 0; }
.numero { display: block; font: 400 clamp(3.5rem, 10vw, 5.5rem)/1 var(--serif); color: #E6CFA9; margin-bottom: .5rem; }
.autoridade__frase { max-width: var(--max); margin: 3.5rem auto 0; padding-top: 2.5rem; border-top: 1px solid rgba(244,237,227,.18); font: italic 400 clamp(1.5rem, 4vw, 2.2rem)/1.3 var(--serif); }
@media (min-width: 760px) { .autoridade__grade { grid-template-columns: repeat(3, 1fr); } }

/* Rituais */
.filtros { display: flex; gap: .5rem; margin-bottom: 2rem; overflow-x: auto; }
.filtros button {
  background: none; border: 1px solid var(--areia-3); border-radius: 999px;
  padding: .55rem 1.2rem; font-size: .875rem; color: var(--tinta-suave); min-height: 42px;
  transition: all .35s var(--ease);
}
.filtros button[aria-selected="true"] { background: var(--tinta); border-color: var(--tinta); color: var(--areia); }
.cartoes { display: grid; gap: 1.25rem; }
.cartao {
  background: var(--branco); border-radius: var(--raio);
  display: grid; grid-template-columns: 38% 1fr; overflow: hidden;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease), opacity .4s;
}
.cartao img { width: 100%; height: 100%; object-fit: cover; min-height: 100%; }
.cartao__corpo { padding: 1.4rem 1.25rem; display: flex; flex-direction: column; }
.cartao__tag { font: 500 .6875rem/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--folha); margin-bottom: .6rem; }
.cartao h3 { font-size: 1.6rem; margin-bottom: .6rem; }
.cartao__corpo > p:not(.cartao__tag) { font-size: .9375rem; color: var(--tinta-suave); line-height: 1.6; }
.cartao__info { display: flex; gap: 1.5rem; margin: auto 0 .6rem; padding-top: .9rem; border-top: 1px solid var(--areia-2); }
.cartao__info dt { font-size: .6875rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-suave); }
.cartao__info dd { margin: 0; font: 500 1.2rem/1.3 var(--serif); color: var(--tinta); }
.cartao--destaque { background: var(--areia-2); }
.cartao.is-oculto { display: none; }
.cartao.is-sugerido { box-shadow: 0 0 0 2px var(--argila); }
@media (max-width: 519px) {
  .cartao { grid-template-columns: 1fr; }
  .cartao img { aspect-ratio: 16 / 10; height: auto; }
}
@media (min-width: 900px) {
  .cartoes { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .cartao:hover { transform: translateY(-4px); box-shadow: 0 24px 50px -30px rgba(43,36,30,.35); }
  .cartao--destaque { grid-column: 1 / -1; grid-template-columns: 45% 1fr; }
  .cartao--destaque .cartao__corpo { padding: 3rem; justify-content: center; }
  .cartao--destaque h3 { font-size: 2.4rem; }
}
.rituais__rodape { margin-top: 2.5rem; font-size: .9375rem; color: var(--tinta-suave); display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.rituais__rodape a { color: var(--argila); }

/* Quiz */
.quiz { display: grid; gap: 2.5rem; border-top: 1px solid var(--areia-3); }
.quiz__intro p:not(.sobretitulo) { color: var(--tinta-suave); max-width: 30rem; }
.quiz__foto { display: none; margin: 2rem 0 0; }
.quiz__foto img { border-radius: var(--raio-foto); aspect-ratio: 4 / 5; object-fit: cover; max-width: 22rem; }
.quiz__caixa { background: var(--branco); padding: clamp(1.5rem, 5vw, 3rem); border-radius: var(--raio); position: relative; min-height: 28rem; display: flex; flex-direction: column; }
.quiz__progresso { height: 2px; background: var(--areia-2); margin-bottom: 1.25rem; }
.quiz__progresso span { display: block; height: 100%; width: 20%; background: var(--argila); transition: width .6s var(--ease); }
.quiz__passo-rotulo { font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-suave); }
.passo { border: 0; padding: 0; margin: 0 0 1.5rem; animation: surgir .5s var(--ease); }
.passo legend, .legenda-secundaria { font: 400 clamp(1.6rem, 5vw, 2.1rem)/1.15 var(--serif); margin-bottom: 1.4rem; padding: 0; }
.legenda-secundaria { display: block; font-size: 1.5rem; margin-top: 2rem; }
.passo legend small { font: 300 .875rem var(--sans); color: var(--tinta-suave); }
.opcoes { display: grid; gap: .6rem; }
.opcoes label { position: relative; cursor: pointer; }
.opcoes input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.opcoes span {
  display: block; padding: .95rem 1.1rem; border: 1px solid var(--areia-3); border-radius: var(--raio);
  font-size: 1rem; transition: all .3s var(--ease);
}
.opcoes span small { display: block; font-size: .8125rem; color: var(--tinta-suave); }
.opcoes input:checked + span { border-color: var(--folha); background: rgba(86, 98, 74, .08); box-shadow: inset 3px 0 0 var(--folha); }
.opcoes input:focus-visible + span { outline: 2px solid var(--argila); outline-offset: 2px; }
.opcoes label:hover span { border-color: var(--tinta-suave); }
.opcoes--chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.opcoes--chips span { border-radius: 999px; padding: .6rem 1.1rem; font-size: .9375rem; }
.opcoes--chips input:checked + span { box-shadow: none; background: var(--folha-escura); color: var(--branco); }
.campos { display: grid; gap: 1rem; }
.campo { display: grid; gap: .35rem; font-size: .875rem; color: var(--tinta-suave); }
.campo--largo { grid-column: 1 / -1; margin-top: 1.25rem; }
.campos .campo--largo { margin-top: 0; }
.campo input, .campo select, .campo textarea {
  font: 400 1rem var(--sans); color: var(--tinta);
  background: var(--areia); border: 1px solid transparent; border-bottom-color: var(--areia-3);
  border-radius: var(--raio); padding: .8rem .9rem; min-height: 48px; width: 100%;
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--folha); background: var(--branco); }
@media (min-width: 560px) { .campos { grid-template-columns: 1fr 1fr; } }
.aceite { display: flex; gap: .7rem; align-items: flex-start; font-size: .875rem; color: var(--tinta-suave); margin-top: 1.1rem; line-height: 1.5; }
.aceite input { width: 20px; height: 20px; flex: none; margin-top: 1px; accent-color: var(--folha-escura); }
.aceite a { color: var(--argila); }
.quiz__erro { color: #9A3B2A; font-size: .875rem; min-height: 1.3em; margin: 0 0 .5rem; }
.quiz__navegacao { display: flex; justify-content: space-between; gap: .75rem; margin-top: auto; }
.quiz__navegacao [data-quiz-avancar] { margin-left: auto; }
.resultado { animation: surgir .6s var(--ease); outline: none; }
.resultado h3 { font-size: clamp(2rem, 6vw, 2.8rem); color: var(--argila); }
.resultado__meta { font: 500 .8125rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.resultado__alt { font-size: .9375rem; color: var(--tinta-suave); border-top: 1px solid var(--areia-2); padding-top: 1rem; }
.resultado .botao { margin: .5rem 0; }
@media (min-width: 900px) {
  .quiz { grid-template-columns: .8fr 1.2fr; gap: 5rem; align-items: start; }
  .quiz__intro { position: sticky; top: calc(var(--topo-h) + 2rem); }
  .quiz__foto { display: block; }
}

/* Érika */
.erika { display: grid; gap: 3rem; align-items: center; }
.erika__foto { margin: 0; }
.erika__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 25%; border-radius: var(--raio-foto); }
.erika__texto p:not(.sobretitulo) { color: var(--tinta-suave); }
.erika blockquote { margin: 2rem 0; font: italic 400 1.75rem/1.3 var(--serif); color: var(--argila); }
@media (min-width: 900px) { .erika { grid-template-columns: .85fr 1.15fr; gap: 6rem; } }

/* Atmosfera (galeria rolável) */
.atmosfera { padding-bottom: clamp(4rem, 10vw, 7rem); }
.atmosfera__trilho {
  display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory;
  padding: 0 var(--gutter); scrollbar-width: none;
}
.atmosfera__trilho::-webkit-scrollbar { display: none; }
.atmosfera__trilho img { flex: 0 0 auto; width: min(68vw, 320px); aspect-ratio: 3 / 4; object-fit: cover; scroll-snap-align: center; border-radius: var(--raio); }
.atmosfera__trilho img:nth-child(3n+2) { margin-top: 2.5rem; }

/* Depoimentos */
.depoimentos__lista { display: grid; gap: 2rem; }
.depoimento { margin: 0; padding: 2rem; background: var(--branco); }
.depoimento blockquote { margin: 0 0 1rem; font: italic 400 1.4rem/1.4 var(--serif); }
.depoimento figcaption { font-size: .875rem; color: var(--tinta-suave); }
@media (min-width: 760px) { .depoimentos__lista { grid-template-columns: repeat(3, 1fr); } }

/* Como funciona */
.como { border-top: 1px solid var(--areia-3); }
.etapas { list-style: none; padding: 0; margin: 0; display: grid; gap: 2.5rem; counter-reset: etapa; }
.etapas span { font: italic 400 3.5rem/1 var(--serif); color: var(--areia-3); }
.etapas h3 { font-size: 1.8rem; margin: .3rem 0 .5rem; }
.etapas p { color: var(--tinta-suave); max-width: 20rem; }
.etapas a { color: var(--argila); }
@media (min-width: 760px) { .etapas { grid-template-columns: repeat(3, 1fr); } }

/* FAQ */
.faq__lista { max-width: 50rem; border-top: 1px solid var(--areia-3); }
.faq details { border-bottom: 1px solid var(--areia-3); }
.faq summary {
  list-style: none; cursor: pointer; padding: 1.4rem 2.5rem 1.4rem 0; position: relative;
  font: 400 1.35rem/1.3 var(--serif);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); font: 300 1.5rem var(--sans); color: var(--argila); transition: transform .4s var(--ease); }
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq details p { color: var(--tinta-suave); padding-bottom: 1.4rem; max-width: 42rem; animation: surgir .45s var(--ease); }
.faq details a { color: var(--argila); }

/* Formação e CTA final (faixas com foto de fundo) */
.formacao, .final {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(5rem, 14vw, 10rem) var(--gutter);
  color: var(--areia);
}
.formacao__fundo, .final__fundo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.formacao__fundo { object-position: 50% 55%; }
.formacao::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(43,36,30,.88), rgba(43,36,30,.55)); }
.formacao__texto { max-width: 34rem; }
.formacao .sobretitulo { color: #E6CFA9; }
.formacao h2 { font-size: clamp(2.2rem, 6vw, 3.6rem); }
.formacao h2 em, .final h2 em { color: #F1D9B8; }
.formacao p:not(.sobretitulo) { color: rgba(244,237,227,.85); margin-bottom: 2rem; }

.final { text-align: center; min-height: 80svh; display: grid; place-items: center; }
.final__fundo { object-position: 50% 45%; }
.final::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(40,33,26,.5); }
.final h2 { font-size: clamp(3rem, 12vw, 6rem); }
.final p { max-width: 28rem; margin: 0 auto 2rem; color: rgba(244,237,227,.9); }

/* Rodapé */
.rodape {
  background: var(--tinta); color: rgba(244,237,227,.75);
  padding: 4rem var(--gutter) 7rem; display: grid; gap: 2.5rem; font-size: .9375rem;
}
.rodape h2 { font: 500 .75rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--areia); margin-bottom: 1rem; }
.rodape a { text-decoration: none; }
.rodape a:hover { color: var(--areia); }
.rodape__marca { display: flex; gap: 1rem; align-items: center; }
.rodape__marca img { width: 38px; filter: brightness(0) invert(.9); }
.rodape__marca strong { font: 400 1.4rem/1.2 var(--serif); color: var(--areia); }
.rodape__base { grid-column: 1 / -1; border-top: 1px solid rgba(244,237,227,.12); padding-top: 2rem; margin: 0; font-size: .8125rem; }
@media (min-width: 760px) { .rodape { grid-template-columns: 1.4fr 1fr 1fr; padding-bottom: 3rem; } }

/* Barra fixa no celular */
.barra-movel {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: grid; grid-template-columns: 1fr 1.4fr; gap: .5rem;
  padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
  background: rgba(244,237,227,.94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 -1px 0 rgba(43,36,30,.08);
  transform: translateY(110%); transition: transform .5s var(--ease);
}
.barra-movel.is-visivel { transform: none; }
.barra-movel a {
  min-height: 48px; display: grid; place-items: center; border-radius: 999px;
  font: 500 .75rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
}
.barra-movel__secundario { border: 1px solid var(--tinta); }
.barra-movel__principal { background: var(--folha-escura); color: var(--branco); }
@media (min-width: 960px) { .barra-movel { display: none; } }

/* ---------- Microinterações ---------- */
/* Visível por padrão; o JS só esconde (para animar) o que está abaixo da primeira tela */
.revelar { transition: opacity 1s var(--ease), transform 1s var(--ease); }
.revelar.pre-revelar { opacity: 0; transform: translateY(24px); }

@keyframes surgir { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes respirar { from { transform: scale(1); } to { transform: scale(1.05); } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .revelar.pre-revelar { opacity: 1; transform: none; }
}

/* ==========================================================
   v3 · Diagnóstico das Marés, Concierge, Caderno, Som, Modo Vila
   ========================================================== */

/* ---------- Cabeçalho: selo de Modo Vila e topo seguro ---------- */
.topo { top: env(safe-area-inset-top, 0px); }
.sinal {
  font: 500 .6875rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase;
  padding: .45rem .7rem; border-radius: 999px; background: var(--argila); color: var(--branco);
}

/* ---------- Diagnóstico das Marés ---------- */
.mares__progresso { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; gap: .5rem; }
.mares__progresso li { flex: 1; height: 6px; border-radius: 999px; background: var(--areia-2); position: relative; overflow: hidden; }
.mares__progresso li::after {
  content: ""; position: absolute; inset: 0; background: var(--folha);
  transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease);
}
.mares__progresso li.is-feito::after { transform: scaleX(1); }
.opcoes--elementos { grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); }
.opcoes--elementos span { display: grid; justify-items: start; gap: .35rem; padding: 1.1rem; }
.opcoes--elementos svg { width: 34px; height: 34px; fill: none; stroke: var(--argila); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .5s var(--ease); }
.opcoes--elementos label:hover svg, .opcoes--elementos input:checked + span svg { transform: translateY(-2px) scale(1.06); }
.opcoes--elementos input:checked + span svg { stroke: var(--folha-escura); }
.mares__nome { font: italic 400 clamp(2.4rem, 8vw, 3.4rem)/1 var(--serif); color: var(--argila); margin-bottom: .6rem; }
.mares__poema { font: 400 1.25rem/1.45 var(--serif); color: var(--tinta); max-width: 30rem; margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--areia-2); }
.mares .resultado h3 { font-size: clamp(1.8rem, 5vw, 2.3rem); color: var(--tinta); }
.reserva { margin: 1.5rem 0 1rem; border: 1px solid var(--areia-3); border-radius: var(--raio); padding: 0 1rem; }
.reserva summary { cursor: pointer; padding: 1rem 0; font-size: .9375rem; color: var(--tinta); }
.reserva summary small { color: var(--tinta-suave); }
.reserva[open] { padding-bottom: 1rem; }
.reserva .campos { margin-bottom: .5rem; }

/* ---------- Concierge ---------- */
.concierge { border-top: 1px solid var(--areia-3); }
.concierge__abas { display: flex; gap: .5rem; overflow-x: auto; margin-bottom: 1.75rem; padding-bottom: 2px; scrollbar-width: none; }
.concierge__abas::-webkit-scrollbar { display: none; }
.concierge__abas button {
  flex: none; background: none; border: 1px solid var(--areia-3); border-radius: 999px;
  padding: .6rem 1.15rem; min-height: 44px; font-size: .9375rem; color: var(--tinta-suave); transition: all .35s var(--ease);
}
.concierge__abas button[aria-selected="true"] { background: var(--folha-escura); border-color: var(--folha-escura); color: var(--branco); }
.concierge__grade { display: grid; gap: 1.5rem; }
.painel { display: grid; gap: 1.5rem; background: var(--branco); border-radius: var(--raio); overflow: hidden; animation: surgir .5s var(--ease); }
.painel img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.painel > div { padding: 0 1.4rem 1.6rem; }
.painel h3 { font-size: clamp(1.7rem, 4.5vw, 2.2rem); }
.painel p { color: var(--tinta-suave); }
.painel__lista { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; gap: .45rem; font-size: .9375rem; }
.painel__lista li { display: flex; gap: .6rem; }
.painel__lista li::before { content: "~"; color: var(--argila); font-family: var(--serif); }
.levo { background: var(--linho); border-radius: var(--raio); padding: 1.75rem 1.4rem; }
.levo h3 { font-size: 1.5rem; margin-bottom: 1.2rem; }
.levo ul { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; gap: .9rem; }
.levo li { display: flex; align-items: center; gap: .85rem; font-size: .9375rem; }
.levo svg { flex: none; width: 30px; height: 30px; fill: none; stroke: var(--argila); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.levo p { font: italic 400 1.15rem/1.4 var(--serif); color: var(--argila); margin: 0; }
@media (min-width: 900px) {
  .concierge__grade { grid-template-columns: 1fr 19rem; align-items: start; }
  .painel { grid-template-columns: 1fr 1.1fr; align-items: center; gap: 0; }
  .painel img { aspect-ratio: 4 / 5; height: 100%; }
  .painel > div { padding: 2.5rem; }
}

/* ---------- Caderno: chamada na home e listagem ---------- */
.artigos { display: grid; gap: 2.5rem; margin-bottom: 2.5rem; }
.artigo-cartao { display: grid; gap: 1rem; text-decoration: none; color: inherit; }
.artigo-cartao__foto { overflow: hidden; border-radius: var(--raio); aspect-ratio: 4 / 5; }
.artigo-cartao__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.artigo-cartao:hover .artigo-cartao__foto img { transform: scale(1.04); }
.artigo-cartao__texto { display: grid; gap: .6rem; align-content: start; }
.artigo-cartao h2, .artigo-cartao h3 { font-size: 1.65rem; margin: 0; transition: color .3s; }
.artigo-cartao:hover h2, .artigo-cartao:hover h3 { color: var(--argila); }
.artigo-cartao p { color: var(--tinta-suave); font-size: .9375rem; margin: 0; }
.artigo-meta { display: flex; flex-wrap: wrap; gap: .3rem .9rem; font: 400 .75rem/1.4 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-suave); }
.artigo-meta .cat { color: var(--folha); font-weight: 500; }
@media (min-width: 760px) {
  .artigos { grid-template-columns: repeat(3, 1fr); gap: 2rem; }
  /* Listagem assimétrica: destaque largo, depois duas colunas desencontradas */
  .artigos--lista { grid-template-columns: repeat(2, 1fr); gap: 3rem 2.5rem; }
  .artigos--lista .artigo-cartao--destaque { grid-column: 1 / -1; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 3rem; }
  .artigos--lista .artigo-cartao--destaque .artigo-cartao__foto { aspect-ratio: 4 / 3; }
  .artigos--lista .artigo-cartao--destaque h2 { font-size: clamp(2.2rem, 3.6vw, 3rem); }
  .artigos--lista .artigo-cartao:not(.artigo-cartao--destaque):nth-child(odd) { margin-top: 5rem; }
}

/* ---------- Páginas internas (Caderno) ---------- */
.pagina-interna main { padding-top: var(--topo-h); }
.caderno-topo { padding: clamp(3.5rem, 9vw, 6rem) var(--gutter) 2rem; max-width: calc(var(--max) + 2 * var(--gutter)); margin: 0 auto; }
.caderno-topo h1 { font-size: clamp(3rem, 11vw, 6rem); line-height: .95; margin-bottom: 1rem; }
.caderno-topo h1 em { font-style: italic; color: var(--argila); }
.caderno-topo > p:last-child { color: var(--tinta-suave); max-width: 34rem; font-size: 1.0625rem; }
.cat-filtros { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0 var(--gutter); max-width: calc(var(--max) + 2 * var(--gutter)); margin: 0 auto 2.5rem; }
.cat-filtros button {
  background: none; border: 0; border-bottom: 1px solid transparent; padding: .4rem .2rem; margin-right: 1rem;
  font: 400 .9375rem var(--sans); color: var(--tinta-suave); min-height: 40px; transition: all .3s var(--ease);
}
.cat-filtros button:hover { color: var(--tinta); }
.cat-filtros button[aria-pressed="true"] { color: var(--tinta); border-bottom-color: var(--argila); }
.caderno-lista { padding: 0 var(--gutter) clamp(4rem, 10vw, 7rem); max-width: calc(var(--max) + 2 * var(--gutter)); margin: 0 auto; }
.caderno-vazio { color: var(--tinta-suave); font-style: italic; }

/* Artigo */
.leitura { position: fixed; left: 0; right: 0; top: calc(env(safe-area-inset-top, 0px) + var(--topo-h)); height: 2px; z-index: 49; background: var(--argila); transform: scaleX(0); transform-origin: left; }
.artigo__cabeca { max-width: 46rem; margin: 0 auto; padding: clamp(3rem, 8vw, 5rem) var(--gutter) 2rem; text-align: center; }
.artigo__cabeca .artigo-meta { justify-content: center; margin-bottom: 1.5rem; }
.artigo__cabeca h1 { font-size: clamp(2.4rem, 7vw, 4.2rem); text-wrap: balance; }
.artigo__subtitulo { font: italic 400 clamp(1.25rem, 3vw, 1.5rem)/1.45 var(--serif); color: var(--tinta-suave); text-wrap: balance; margin: 0; }
.artigo__capa { margin: 0 auto 3rem; max-width: 72rem; padding: 0 var(--gutter); }
.artigo__capa img { width: 100%; max-height: 78vh; object-fit: cover; border-radius: var(--raio); }
.prosa { max-width: 38rem; margin: 0 auto; padding: 0 var(--gutter); font: 400 1.125rem/1.8 var(--sans); color: var(--tinta); }
.prosa p, .prosa ul, .prosa ol { margin: 0 0 1.3em; }
.prosa > p:first-child::first-letter { float: left; font: 400 4.4em/.8 var(--serif); color: var(--argila); padding: .08em .12em 0 0; }
.prosa h2 { font-size: clamp(1.8rem, 4.5vw, 2.3rem); margin: 1.8em 0 .5em; }
.prosa h3 { font-size: 1.5rem; margin: 1.6em 0 .4em; }
.prosa a { color: var(--argila); }
.prosa strong { font-weight: 500; }
.prosa ul, .prosa ol { padding-left: 1.3rem; }
.prosa li + li { margin-top: .5em; }
.prosa li::marker { color: var(--argila); }
.prosa blockquote { margin: 2em 0; padding: 0 0 0 1.4rem; border-left: 1px solid var(--argila); font: italic 400 1.6rem/1.4 var(--serif); color: var(--argila); }
.prosa blockquote p { margin: 0; }
.prosa figure { margin: 2.5em -1rem; }
.prosa figure img { width: 100%; border-radius: var(--raio); }
.prosa figcaption { font-size: .8125rem; color: var(--tinta-suave); margin-top: .7rem; text-align: center; letter-spacing: .02em; }
.prosa hr { border: 0; text-align: center; margin: 2.5em 0; }
.prosa hr::after { content: "~"; font: 400 1.6rem var(--serif); color: var(--argila); }
@media (min-width: 900px) { .prosa figure { margin: 3em -6rem; } }
.artigo__compartilhar { max-width: 38rem; margin: 2.5rem auto 0; padding: 0 var(--gutter); }

/* CTA contextual do artigo */
.convite { max-width: 60rem; margin: clamp(3.5rem, 8vw, 5rem) auto; padding: 0 var(--gutter); }
.convite__caixa { display: grid; background: var(--folha-escura); color: var(--areia); border-radius: var(--raio); overflow: hidden; }
.convite__caixa img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.convite__texto { padding: 2rem 1.6rem; }
.convite .sobretitulo { color: #E6CFA9; }
.convite h2 { font-size: clamp(1.9rem, 5vw, 2.6rem); }
.convite p { color: rgba(244, 237, 227, .85); }
.convite__meta { font: 500 .8125rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--areia) !important; margin-bottom: 1.6rem; }
.convite__acoes { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.convite .link-simples { color: var(--areia); }
@media (min-width: 760px) {
  .convite__caixa { grid-template-columns: .9fr 1.1fr; }
  .convite__caixa img { aspect-ratio: auto; height: 100%; }
  .convite__texto { padding: 3rem; }
}
.continue { max-width: calc(var(--max) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter) clamp(4rem, 10vw, 7rem); }
.continue > h2 { font-size: clamp(1.8rem, 5vw, 2.4rem); margin-bottom: 2rem; }
@media (min-width: 760px) { .continue .artigos { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Soundscape ---------- */
.som {
  position: fixed; z-index: 45; left: max(.75rem, env(safe-area-inset-left, 0px));
  bottom: calc(5.4rem + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: flex-end; gap: .35rem;
}
.som__botao, .som__ajustar {
  display: inline-flex; align-items: center; gap: .6rem; min-height: 44px;
  background: rgba(255, 252, 247, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid var(--areia-3); border-radius: 999px; color: var(--tinta);
  box-shadow: 0 8px 24px -14px rgba(43, 36, 30, .45);
}
.som__botao { padding: 0 1rem 0 .9rem; font: 400 .75rem/1 var(--sans); letter-spacing: .08em; }
.som__rotulo { max-width: 0; overflow: hidden; white-space: nowrap; transition: max-width .6s var(--ease); }
.som__botao:hover .som__rotulo, .som__botao:focus-visible .som__rotulo, .som.is-tocando .som__rotulo { max-width: 10rem; }
.som__ajustar { width: 44px; justify-content: center; padding: 0; }
.som__ajustar svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.som__ondas { display: inline-flex; align-items: center; gap: 3px; height: 16px; }
.som__ondas i { display: block; width: 2px; height: 4px; border-radius: 2px; background: var(--argila); transition: height .4s var(--ease); }
.som.is-tocando .som__ondas i { animation: onda 1.6s ease-in-out infinite; }
.som.is-tocando .som__ondas i:nth-child(2) { animation-delay: -.4s; }
.som.is-tocando .som__ondas i:nth-child(3) { animation-delay: -.8s; }
.som.is-tocando .som__ondas i:nth-child(4) { animation-delay: -1.2s; }
.som.is-convite .som__botao { animation: chamar 3s ease-in-out 2; }
.som__painel {
  position: absolute; left: 0; bottom: calc(100% + .5rem); width: 15rem;
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .7rem .9rem;
  padding: 1.1rem 1.2rem; background: var(--branco); border: 1px solid var(--areia-3); border-radius: 14px;
  box-shadow: 0 18px 40px -20px rgba(43, 36, 30, .45); animation: surgir .35s var(--ease);
}
.som__titulo { grid-column: 1 / -1; margin: 0 0 .2rem; font: italic 400 1.15rem/1 var(--serif); color: var(--argila); }
.som__painel label { font-size: .8125rem; color: var(--tinta-suave); }
.som__painel input[type=range] { width: 100%; accent-color: var(--folha-escura); }
@keyframes onda { 0%, 100% { height: 4px; } 50% { height: 15px; } }
@keyframes chamar { 0%, 100% { box-shadow: 0 0 0 0 rgba(122, 86, 52, .0); } 50% { box-shadow: 0 0 0 6px rgba(122, 86, 52, .15); } }
@media (max-width: 959px) {
  /* no celular fica à direita, longe da faixa de informações do hero */
  .som { left: auto; right: max(.75rem, env(safe-area-inset-right, 0px)); flex-direction: row-reverse; }
  .som__painel { left: auto; right: 0; }
}
@media (min-width: 960px) { .som { bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px)); left: 1.25rem; } }

/* ---------- Modo Vila (sem conexão) ---------- */
.modo-vila {
  position: fixed; z-index: 48; left: .75rem; right: .75rem;
  top: calc(env(safe-area-inset-top, 0px) + var(--topo-h) + .5rem);
  display: flex; flex-wrap: wrap; gap: .25rem 1rem; align-items: center; justify-content: space-between;
  padding: .8rem 1rem; border-radius: 12px; background: var(--tinta); color: var(--areia); font-size: .875rem;
  box-shadow: 0 12px 30px -16px rgba(43, 36, 30, .6); animation: surgir .4s var(--ease);
}
.modo-vila p { margin: 0; }
.modo-vila a { color: #F1D9B8; font-weight: 500; }
@media (min-width: 960px) { .modo-vila { left: auto; max-width: 30rem; right: 1.25rem; } }

/* ==========================================================
   Direção de arte v3 · película, cascata, parallax, brilho
   ========================================================== */

/* Granulação de película analógica (SVG gerado, 0 KB de download) */
body::after {
  content: ""; position: fixed; inset: -50%; z-index: 60; pointer-events: none;
  opacity: .07; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .16 0 0 0 0 .12 0 0 0 1.1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  animation: pelicula 1.2s steps(6) infinite;
}
@media (max-width: 767px) { body::after { animation: none; } } /* poupa bateria no celular */
@keyframes pelicula {
  0% { transform: translate(0, 0); } 20% { transform: translate(-3%, 2%); } 40% { transform: translate(2%, -3%); }
  60% { transform: translate(-2%, -1%); } 80% { transform: translate(3%, 3%); } 100% { transform: translate(0, 0); }
}

/* Revelação em cascata do hero (fade-in-up desacelerado) */
.cascata > *, .cascata h1 > * { animation: subir 1.4s cubic-bezier(.16, 1, .3, 1) both; }
.cascata h1 > * { display: block; }
.cascata .sobretitulo { animation-delay: .15s; }
.cascata h1 { animation: none; }
.cascata h1 > :nth-child(1) { animation-delay: .35s; }
.cascata h1 > :nth-child(2) { animation-delay: .55s; }
.cascata h1 > :nth-child(3) { animation-delay: .8s; }
.cascata .hero__lead { animation-delay: 1.05s; }
.cascata .hero__acoes { animation-delay: 1.25s; }
@keyframes subir { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }

/* Indicador de rolagem: linha vertical que escorre */
.rolar { position: absolute; right: var(--gutter); bottom: 5.5rem; width: 1px; height: 64px; overflow: hidden; background: rgba(255, 252, 247, .25); }
.rolar span { position: absolute; left: 0; top: 0; width: 1px; height: 100%; background: var(--branco); animation: escorrer 2.4s cubic-bezier(.65, 0, .35, 1) infinite; }
@keyframes escorrer { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(100%); } }
@media (max-width: 767px) { .rolar { display: none; } } /* no celular, a faixa de informações ocupa esse espaço */
@media (min-width: 768px) { .rolar { right: auto; left: 50%; bottom: 5rem; } }

/* Parallax: o JS escreve --desloc; fundos ganham 20% de sobra para não mostrar borda */
[data-parallax] { transform: translate3d(0, var(--desloc, 0px), 0); will-change: transform; }
.formacao__fundo, .final__fundo { inset: -10% 0; height: 120%; }

/* Transições orgânicas entre seções: bordas em curva suave, sem cortes secos */
.autoridade, .formacao { border-radius: 50% 50% 0 0 / 2.5rem 2.5rem 0 0; }
.final { border-radius: 0 0 50% 50% / 0 0 2.5rem 2.5rem; margin-bottom: -2.5rem; z-index: 1; }
.rodape { padding-top: calc(4rem + 2.5rem); }

/* Cards: elevação, microbrilho na borda e zoom tátil na foto */
.cartao, .artigo-cartao__foto { position: relative; isolation: isolate; }
.cartao img, .painel img { transition: transform 1.4s cubic-bezier(.16, 1, .3, 1); }
.cartao::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 244, 222, .55) 50%, transparent 65%) border-box;
  -webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  border: 1px solid transparent; background-size: 250% 100%; background-position: 120% 0;
  opacity: 0; transition: opacity .5s, background-position 1.2s cubic-bezier(.16, 1, .3, 1);
}
@media (hover: hover) {
  .cartao:hover::after { opacity: 1; background-position: -20% 0; }
  .cartao:hover img, .painel:hover img { transform: scale(1.06); }
}
.cartao { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  body::after { animation: none; }
  .cascata > *, .cascata h1 > * { animation: none; }
  [data-parallax] { transform: none; }
  .rolar span { animation: none; transform: none; }
}

/* ---------- Vale-presente ---------- */
.presente { display: grid; gap: 2.5rem; align-items: center; border-top: 1px solid var(--areia-3); }
.presente__foto { margin: 0; }
.presente__foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--raio-foto); max-width: 26rem; }
.presente__texto p:not(.sobretitulo) { color: var(--tinta-suave); max-width: 34rem; }
.presente__lista { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; gap: .5rem; }
.presente__lista li { display: flex; gap: .7rem; }
.presente__lista li::before { content: "~"; color: var(--argila); font-family: var(--serif); }
@media (min-width: 900px) { .presente { grid-template-columns: .8fr 1.2fr; gap: 5rem; } }

/* ---------- Selo de avaliações do Google ---------- */
.selo-google a { color: inherit; text-decoration: none; }
.selo-google strong { color: #F1D9B8; }

/* ---------- Aviso de cookies ---------- */
.cookies {
  position: fixed; z-index: 55; left: .75rem; right: .75rem; bottom: calc(5.4rem + env(safe-area-inset-bottom, 0px));
  display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; padding: 1rem 1.1rem;
  background: var(--branco); border: 1px solid var(--areia-3); border-radius: 14px; font-size: .875rem;
  box-shadow: 0 18px 40px -20px rgba(43, 36, 30, .5);
}
.cookies p { margin: 0; flex: 1 1 14rem; color: var(--tinta-suave); }
@media (min-width: 960px) { .cookies { left: auto; right: 1.25rem; bottom: 1.25rem; max-width: 32rem; } }

/* ---------- Idiomas ---------- */
.menu__idiomas { display: flex; gap: .9rem; font-size: .75rem; letter-spacing: .12em; }
.menu__idiomas a { opacity: .75; }
.menu.is-aberto .menu__idiomas { margin-top: 1rem; }
.menu.is-aberto .menu__idiomas a { font: 500 .9rem/1 var(--sans); }

.rodape__instalar {
  margin-top: 1rem; background: none; border: 1px solid rgba(244, 237, 227, .35); color: var(--areia);
  border-radius: 999px; padding: .6rem 1rem; font-size: .8125rem; min-height: 40px;
}
.cartao.is-sugerido .cartao__tag::after { content: " · sugerido para você"; color: var(--argila); }