/* ============================================================
   PRÊMIO BOX — inteligência de retenção para o comércio
   Direção: ficha de sócio / livro de registro encadernado.
   Campo dominante: oxblood. Contraponto: osso. Régua: latão.
   ============================================================ */

 :root{
  /* Paleta oficial Prêmio Box */
  --tinta:        #662D21;
  --oxblood:      #662D21;
  --oxblood-esc:  #662D21;
  --brasa:        #AF3527;
  --brasa-viva:   #E94E3A;
  --osso:         #FFFFFF;
  --osso-claro:   #FFFFFF;
  --latao:        #E94E3A;
  --latao-texto:  #AF3527;
  --latao-claro:  #D8B878; /* dourado de contraste para texto pequeno sobre fundos escuros */
  --fumo:         rgba(102,45,33,.76);
  --fumo-inv:     rgba(255,255,255,.76);
  --linha:        rgba(102,45,33,.16);
  --linha-inv:    rgba(255,255,255,.24);

  /* --- tipo --- */
  --display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --texto:   'Archivo', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* --- ritmo --- */
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --largura: 1180px;
  --secao: clamp(5rem, 11vw, 9rem);
}
*, *::before, *::after{ box-sizing: border-box; }

html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body{
  margin: 0;
  background: var(--osso-claro);
  color: var(--tinta);
  font-family: var(--texto);
  font-size: 17px;
  line-height: 1.6;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img{ max-width: 100%; height: auto; display: block; }
a{ color: inherit; text-decoration: none; }
ul{ margin: 0; padding: 0; list-style: none; }
h1,h2,h3,h4{ margin: 0; font-family: var(--display); font-weight: 600; line-height: 1.05;
             font-variation-settings: 'WONK' 1, 'SOFT' 20; letter-spacing: -.015em; }
p{ margin: 0; }

::selection{ background: var(--brasa); color: var(--osso-claro); }

:focus-visible{
  outline: 2px solid var(--latao-claro);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ------------------------------------------------------------
   utilitários de layout
   ------------------------------------------------------------ */
.wrap{
  width: 100%;
  max-width: var(--largura);
  margin: 0 auto;
  padding-inline: var(--gutter);
}

.faixa{ padding-block: var(--secao); position: relative; }
.faixa--escura{ background: var(--oxblood); color: var(--osso); }
.faixa--tinta{ background: var(--tinta); color: var(--osso); }
.faixa--osso{ background: var(--osso-claro); }
.faixa--papel{ background: var(--osso); }

/* etiqueta (eyebrow) — sempre em latão, sempre versalete largo */
.etiqueta{
  font-family: var(--texto);
  font-size: .69rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--latao-texto);
  display: flex;
  align-items: center;
  gap: .8rem;
}
.etiqueta::after{
  content: '';
  flex: 1;
  height: 1px;
  background: currentColor;
  opacity: .35;
  max-width: 90px;
}
.etiqueta--centro{ justify-content: center; }
.etiqueta--centro::before{
  content: '';
  flex: 1; height: 1px; background: currentColor; opacity: .35; max-width: 90px;
}
.faixa--escura .etiqueta,
.faixa--tinta .etiqueta,
.hero .etiqueta,
.interna .etiqueta{ color: var(--latao-claro); }

/* escala tipográfica */
.d1{ font-size: clamp(2.6rem, 7.2vw, 5.1rem); }
.d2{ font-size: clamp(2rem, 4.6vw, 3.2rem); }
.d3{ font-size: clamp(1.35rem, 2.4vw, 1.75rem); letter-spacing: -.01em; }
.wonk{ font-style: italic; font-variation-settings: 'WONK' 1, 'SOFT' 40; color: var(--latao-claro); }
.lede{
  font-size: clamp(1.02rem, 1.5vw, 1.18rem);
  line-height: 1.62;
  color: var(--fumo);
  max-width: 54ch;
}
.faixa--escura .lede,
.faixa--tinta .lede,
.hero .lede,
.interna .lede{ color: var(--fumo-inv); }

/* ------------------------------------------------------------
   botões
   ------------------------------------------------------------ */
.btn{
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--texto);
  font-size: .87rem; font-weight: 600; letter-spacing: .04em;
  padding: 1.05rem 1.9rem;
  border: 1px solid transparent;
  border-radius: 2px;
  cursor: pointer;
  transition: background .28s ease, color .28s ease, border-color .28s ease, transform .28s ease;
}
.btn:hover{ transform: translateY(-1px); }
.btn:active{ transform: translateY(0); }

.btn--brasa{ background: var(--brasa); color: var(--osso-claro); }
.btn--brasa:hover{ background: #E94E3A; }

.btn--osso{ background: var(--osso-claro); color: var(--tinta); }
.btn--osso:hover{ background: #fff; }

.btn--latao{ background: var(--latao); color: var(--tinta); }
.btn--latao:hover{ background: var(--latao-claro); }

.btn--linha{ background: transparent; color: currentColor; border-color: currentColor; opacity: .8; }
.btn--linha:hover{ opacity: 1; background: rgba(233,78,58,.1); }

.btn--tinta{ background: var(--tinta); color: var(--osso-claro); }
.btn--tinta:hover{ background: #662D21; }

/* CTA de meio de página, entre seções */
.cta-bloco{
  margin-top: clamp(2.6rem, 5vw, 3.6rem);
  padding-top: clamp(2rem, 4vw, 2.6rem);
  border-top: 1px solid var(--linha-inv);
  display: grid;
  gap: 1.4rem 2rem;
  align-items: center;
}
@media (min-width: 720px){
  .cta-bloco{ grid-template-columns: 1fr auto; }
}
.faixa--osso .cta-bloco,
.faixa--papel .cta-bloco{ border-top-color: var(--linha); }
.cta-bloco__texto{
  font-family: var(--display); font-weight: 500;
  font-size: clamp(1.15rem, 2.4vw, 1.55rem); line-height: 1.25;
  font-variation-settings: 'WONK' 1, 'SOFT' 30; letter-spacing: -.01em;
  max-width: 26ch;
}
.cta-bloco__apoio{
  display: block; margin-top: .5rem;
  font-family: var(--texto); font-weight: 400;
  font-size: .82rem; letter-spacing: 0; color: var(--fumo-inv);
}
.faixa--osso .cta-bloco__apoio,
.faixa--papel .cta-bloco__apoio{ color: var(--fumo); }
.cta-bloco .btn{ white-space: nowrap; }

/* ------------------------------------------------------------
   topo
   ------------------------------------------------------------ */
.topo{
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  background: rgba(102,45,33,0);
  border-bottom: 1px solid transparent;
  transition: background .35s ease, border-color .35s ease, backdrop-filter .35s ease;
}
.topo.fixo{
  background: rgba(102,45,33,.94);
  backdrop-filter: blur(12px);
  border-bottom-color: var(--linha-inv);
}
.topo__interno{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  height: 74px;
  max-width: 1380px;
}
.marca{
  display: flex;
  align-items: center;
  gap: .85rem;
  flex: 0 0 auto;
  min-width: max-content;
}
.marca img{ display:block; height:46px; width:auto; max-width:none; flex:0 0 auto; }
.topo__nav{
  display: none;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
  gap: clamp(.7rem, 1.25vw, 1.35rem);
  align-items: center;
}
.topo__nav a{
  font-size: clamp(.68rem, .72vw, .76rem);
  letter-spacing: .075em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--osso);
  opacity: .72;
  transition: opacity .25s ease;
}
.topo__nav a:hover{ opacity: 1; }
@media (min-width: 900px){ .topo__nav{ display: flex; } }

/* ------------------------------------------------------------
   HERO
   ------------------------------------------------------------ */
.hero{
  background: var(--oxblood);
  color: var(--osso);
  position: relative;
  padding-block: clamp(8rem, 15vw, 11rem) clamp(4rem, 8vw, 6.5rem);
  overflow: hidden;
}
/* trama sutil de papel encorpado */
.hero::before{
  content: '';
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(90deg, rgba(233,78,58,.05) 0 1px, transparent 1px 4px),
    radial-gradient(120% 90% at 78% 0%, rgba(175,53,39,.42), transparent 62%);
  pointer-events: none;
}
.hero__grade{
  position: relative;
  display: grid;
  gap: clamp(3rem, 6vw, 4.5rem);
  align-items: center;
}
@media (min-width: 980px){
  .hero__grade{ grid-template-columns: 1.08fr .92fr; }
}

.hero__titulo{ margin-block: 1.7rem 1.5rem; }
.hero__titulo span{ display: block; }
.hero__lede{ max-width: 46ch; }
.hero__acoes{ display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2.2rem; }
.hero__nota{
  margin-top: 1.6rem; font-size: .8rem; letter-spacing: .02em;
  color: var(--fumo-inv);
}

/* --- assinatura: a ficha --- */
.ficha{
  background: var(--osso-claro);
  color: var(--tinta);
  padding: clamp(1.6rem, 3vw, 2.2rem);
  border-radius: 3px;
  box-shadow: 0 30px 70px -30px rgba(102,45,33,.65), 0 2px 0 rgba(233,78,58,.5);
  transform: rotate(-1.15deg);
  position: relative;
  max-width: 430px;
  margin-inline: auto;
}
.ficha::after{
  content: '';
  position: absolute; inset: 7px;
  border: 1px solid rgba(233,78,58,.34);
  border-radius: 2px;
  pointer-events: none;
}
.ficha__topo{
  display: flex; justify-content: space-between; align-items: flex-start;
  padding-bottom: .9rem; border-bottom: 1.5px solid var(--tinta);
}
.ficha__casa{
  font-family: var(--display); font-size: 1.02rem; font-weight: 600;
  line-height: 1.15; letter-spacing: -.01em;
}
.ficha__casa small{
  display: block; font-family: var(--texto); font-size: .58rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: var(--latao-texto); margin-top: .3rem;
}
.ficha__numero{ text-align: right; }
.ficha__numero span{
  display: block; font-size: .55rem; letter-spacing: .18em;
  text-transform: uppercase; color: var(--fumo);
}
.ficha__numero strong{
  font-family: var(--display); font-size: 1.75rem; font-weight: 600;
  font-variant-numeric: tabular-nums; line-height: 1;
}

.ficha__campos{ margin-top: 1.5rem; display: grid; gap: 1.15rem; }
.ficha__par{ display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; }
.campo__rot{
  font-size: .55rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--fumo); display: block; margin-bottom: .5rem;
}
.campo__linha{
  height: 1px; background: var(--linha); position: relative;
  transform-origin: left center;
}
.campo__linha::after{
  content: ''; position: absolute; inset: 0;
  background: var(--tinta); opacity: .55;
  transform: scaleX(0); transform-origin: left center;
  transition: transform 1.1s cubic-bezier(.2,.7,.2,1);
}
.ficha.pronta .campo__linha::after{ transform: scaleX(1); }
.ficha.pronta .campo__linha:nth-of-type(1)::after{ transition-delay: .15s; }

.campo--nome{ position: relative; }
.campo--nome .cursor{
  position: absolute; left: 0; bottom: 4px;
  width: 1.5px; height: 20px; background: var(--brasa);
  opacity: 0;
}
.ficha.pronta .campo--nome .cursor{ animation: pisca 1.15s steps(2) 1.5s infinite; }
@keyframes pisca{ 0%,49%{ opacity: 1 } 50%,100%{ opacity: 0 } }

.ficha__rodape{
  margin-top: 1.7rem; padding-top: .95rem;
  border-top: 1px solid var(--linha);
  display: flex; align-items: center; gap: .55rem;
  font-size: .63rem; letter-spacing: .13em; text-transform: uppercase; color: var(--fumo);
}
.ficha__selo{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--brasa); flex: none;
}

/* ------------------------------------------------------------
   raciocínio (a lógica do negócio, sem número inventado)
   ------------------------------------------------------------ */
.logica__topo{ max-width: 42ch; }
.logica__titulo{ margin-block: 1.4rem 0; }

.logica__grade{
  margin-top: clamp(2.8rem, 6vw, 4rem);
  display: grid; gap: 0;
  border-top: 1px solid var(--linha);
}
@media (min-width: 860px){
  .logica__grade{ grid-template-columns: repeat(3, 1fr); }
}
.passo{
  padding: 2rem 0;
  border-bottom: 1px solid var(--linha);
}
@media (min-width: 860px){
  .passo{ padding: 2.4rem 2.2rem 2.4rem 0; border-bottom: none; border-right: 1px solid var(--linha); }
  .passo:last-child{ border-right: none; padding-right: 0; }
  .passo + .passo{ padding-left: 2.2rem; }
}
.passo__ordem{
  font-family: var(--display); font-size: .85rem; font-weight: 600;
  font-variant-numeric: tabular-nums; color: var(--latao-texto);
  display: block; margin-bottom: 1rem;
}
.passo h3{ font-size: 1.28rem; margin-bottom: .7rem; }
.passo p{ color: var(--fumo); font-size: .95rem; line-height: 1.62; }

/* frase-âncora */
.ancora{
  margin-top: clamp(3rem, 7vw, 4.5rem);
  padding: clamp(2rem, 4vw, 2.8rem) 0 0;
  border-top: 2px solid var(--tinta);
  display: grid; gap: 1.2rem;
}
@media (min-width: 860px){ .ancora{ grid-template-columns: 1fr auto; align-items: end; } }
.ancora p{
  font-family: var(--display); font-size: clamp(1.4rem, 2.9vw, 2.15rem);
  line-height: 1.22; font-weight: 500; max-width: 22ch;
  font-variation-settings: 'WONK' 1, 'SOFT' 30;
}
.ancora span{
  font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--latao-texto);
}

/* ------------------------------------------------------------
   imagem editorial em duotone
   ------------------------------------------------------------ */
/* duotone sobre campo escuro: sombras viram oxblood, luzes viram latão */
.retrato{
  position: relative; overflow: hidden;
  background: var(--oxblood-esc);
  box-shadow: inset 0 0 0 1px rgba(233,78,58,.26);
}
.retrato img{
  width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(1) contrast(1.06) brightness(1.04);
  mix-blend-mode: screen;
  opacity: .66;
}
.retrato::after{
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(210deg, rgba(175,53,39,.26), rgba(102,45,33,.42));
  mix-blend-mode: multiply;
  pointer-events: none;
}

/* duotone sobre campo claro: monocromático quente impresso no papel */
.retrato--claro{ background: var(--osso); box-shadow: inset 0 0 0 1px rgba(233,78,58,.34); }
.retrato--claro img{
  filter: grayscale(1) contrast(1.04) brightness(1.05) sepia(.2);
  mix-blend-mode: multiply;
  opacity: .9;
}
.retrato--claro::after{
  background: linear-gradient(210deg, rgba(233,78,58,.16), rgba(102,45,33,.2));
}

/* bloco imagem + texto */
.dupla{ display: grid; gap: clamp(2rem, 5vw, 3.6rem); align-items: center; }
@media (min-width: 900px){
  .dupla{ grid-template-columns: .92fr 1.08fr; }
  .dupla--invertida .dupla__midia{ order: 2; }
}
.dupla__midia{ aspect-ratio: 4 / 5; border-radius: 2px; }
@media (max-width: 899px){ .dupla__midia{ aspect-ratio: 16 / 11; } }
.dupla__texto h2{ margin-block: 1.35rem 1.2rem; }

/* lista de critérios */
.criterios{ margin-top: 2rem; display: grid; gap: 0; }
.criterio{
  padding: 1.15rem 0;
  border-top: 1px solid var(--linha-inv);
  display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: baseline;
}
.criterio:last-child{ border-bottom: 1px solid var(--linha-inv); }
.criterio__mark{ color: var(--latao-claro); font-size: .85rem; line-height: 1.5; }
.criterio strong{ display: block; font-weight: 600; font-size: 1rem; margin-bottom: .2rem; }
.criterio p{ font-size: .92rem; line-height: 1.58; color: var(--fumo-inv); }

/* variação clara dos critérios */
.faixa--papel .criterio,
.faixa--osso .criterio{ border-color: var(--linha); }
.faixa--papel .criterio__mark,
.faixa--osso .criterio__mark{ color: var(--latao-texto); }
.faixa--papel .criterio p,
.faixa--osso .criterio p{ color: var(--fumo); }

.beneficios{
  margin-top: clamp(3rem, 6vw, 4.2rem);
  display: grid; gap: 1px;
  background: var(--linha-inv);
  border: 1px solid var(--linha-inv);
}
@media (min-width: 760px){ .beneficios{ grid-template-columns: repeat(2, 1fr); } }
.beneficio{
  background: var(--oxblood);
  padding: clamp(1.7rem, 3.4vw, 2.4rem);
}
.beneficio h3{ font-size: 1.2rem; margin-bottom: .65rem; }
.beneficio p{ font-size: .93rem; line-height: 1.6; color: var(--fumo-inv); }
.beneficio__rot{
  font-size: .58rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--latao-claro); display: block; margin-bottom: 1rem;
}

/* ------------------------------------------------------------
   cadastro da loja
   ------------------------------------------------------------ */
.form{
  background: var(--osso-claro);
  color: var(--tinta);
  padding: clamp(1.8rem, 4vw, 2.6rem);
  border-radius: 3px;
  box-shadow: 0 24px 60px -28px rgba(102,45,33,.55);
}
.form__cabeca{ padding-bottom: 1.4rem; margin-bottom: 1.7rem; border-bottom: 1.5px solid var(--tinta); }
.form__cabeca h3{ font-size: 1.4rem; }
.form__cabeca p{ font-size: .86rem; color: var(--fumo); margin-top: .4rem; }

.campo{ margin-bottom: 1.3rem; }
.campo > label{
  display: block; font-size: .6rem; letter-spacing: .18em;
  text-transform: uppercase; color: var(--fumo); margin-bottom: .55rem;
}
.campo input, .campo select{
  width: 100%;
  font-family: var(--texto); font-size: 1rem; color: var(--tinta);
  background: transparent;
  border: none; border-bottom: 1px solid var(--linha);
  border-radius: 0;
  padding: .6rem 0;
  transition: border-color .25s ease;
}
.campo input::placeholder{ color: rgba(102,45,33,.5); }
.campo input:focus, .campo select:focus{
  outline: none; border-bottom-color: var(--brasa);
}
.campo select{ appearance: none; cursor: pointer; }
.campo__seta{ position: relative; }
.campo__seta::after{
  content: '▾'; position: absolute; right: 2px; bottom: .55rem;
  color: var(--latao-texto); pointer-events: none; font-size: .8rem;
}
.campo__erro{ display: none; font-size: .78rem; color: var(--brasa); margin-top: .45rem; }
.campo__erro ul{ list-style: none; margin: 0; padding: 0; }
.form__erro{ font-size: .78rem; color: var(--brasa); margin: 0 0 1rem; }
.campo.erro input, .campo.erro select{ border-bottom-color: var(--brasa); }
.campo.erro .campo__erro{ display: block; }

/* honeypot */
.armadilha{ position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form .btn{ width: 100%; justify-content: center; margin-top: .6rem; }
.form__micro{ font-size: .76rem; color: var(--fumo); margin-top: 1.1rem; line-height: 1.55; }


/* ------------------------------------------------------------
   rodapé
   ------------------------------------------------------------ */
.rodape{
  background: var(--tinta); color: var(--osso);
  padding-block: clamp(3.5rem, 7vw, 5rem) 2rem;
  border-top: 1px solid var(--linha-inv);
}
.rodape__grade{ display: grid; gap: 2.5rem; }
@media (min-width: 800px){ .rodape__grade{ grid-template-columns: 1.4fr 1fr 1fr; } }
.rodape__marca img{ display:block; height:46px; width:auto; max-width:none; margin-bottom:1.2rem; }
.rodape__marca p{ font-size: .9rem; color: var(--fumo-inv); max-width: 34ch; line-height: 1.6; }
.rodape h4{
  font-family: var(--texto); font-size: .6rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: var(--latao-claro);
  margin-bottom: 1.1rem;
}
.rodape li{ margin-bottom: .65rem; }
.rodape li a{ font-size: .9rem; color: var(--fumo-inv); transition: color .25s ease; }
.rodape li a:hover{ color: var(--osso); }
.rodape__fim{
  margin-top: clamp(2.5rem, 5vw, 3.5rem); padding-top: 1.6rem;
  border-top: 1px solid var(--linha-inv);
  display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; justify-content: space-between;
  font-size: .75rem; color: var(--fumo-inv);
}

/* ------------------------------------------------------------
   FAQ — accordion nativo (<details>), sem JS e sem ícone externo
   ------------------------------------------------------------ */
.faq{ margin-top: clamp(2.4rem, 5vw, 3.4rem); border-top: 1px solid var(--linha); }
.faq details{ border-bottom: 1px solid var(--linha); }

.faq summary{
  list-style: none;
  cursor: pointer;
  padding: 1.35rem 2.4rem 1.35rem 0;
  position: relative;
  font-family: var(--texto);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--tinta);
  transition: color .22s ease;
}
.faq summary::-webkit-details-marker{ display: none; }
.faq summary:hover{ color: var(--brasa); }

/* cruz que vira traço quando aberto */
.faq summary::before,
.faq summary::after{
  content: '';
  position: absolute;
  right: 2px;
  top: 50%;
  background: var(--latao-texto);
  transition: transform .3s cubic-bezier(.2,.7,.2,1), opacity .3s ease;
}
.faq summary::before{ width: 13px; height: 1.5px; transform: translateY(-50%); }
.faq summary::after{ width: 1.5px; height: 13px; right: 7.75px; transform: translateY(-50%); }
.faq details[open] summary::after{ transform: translateY(-50%) rotate(90deg); opacity: 0; }
.faq details[open] summary{ color: var(--brasa); }

.faq__resposta{
  padding: 0 2.4rem 1.5rem 0;
  font-size: .95rem;
  line-height: 1.68;
  color: var(--fumo);
  max-width: 62ch;
}
.faq__resposta p + p{ margin-top: .9rem; }
.faq__resposta a{ color: var(--brasa); border-bottom: 1px solid rgba(175,53,39,.3); }

@media (prefers-reduced-motion: no-preference){
  .faq details[open] .faq__resposta{ animation: abre .34s ease; }
  @keyframes abre{ from{ opacity: 0; transform: translateY(-5px) } to{ opacity: 1; transform: none } }
}

/* ------------------------------------------------------------
   canais de contato
   ------------------------------------------------------------ */
.canais{
  margin-top: clamp(2.2rem, 5vw, 3rem);
  display: grid; gap: 1px;
  background: var(--linha-inv);
  border: 1px solid var(--linha-inv);
}
@media (min-width: 720px){ .canais{ grid-template-columns: repeat(2, 1fr); } }

.canal{
  background: var(--oxblood);
  padding: clamp(1.6rem, 3.2vw, 2.2rem);
  display: block;
  transition: background .25s ease;
}
a.canal:hover{ background: var(--oxblood-esc); }
.canal__rot{
  font-size: .58rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--latao-claro); display: block; margin-bottom: .9rem;
}
.canal h3{ font-size: 1.15rem; margin-bottom: .5rem; }
.canal p{ font-size: .9rem; line-height: 1.58; color: var(--fumo-inv); }
.canal__end{
  display: inline-flex; align-items: center; gap: .45rem;
  margin-top: 1rem; font-size: .88rem; font-weight: 500;
  color: var(--latao-claro);
  border-bottom: 1px solid rgba(233,78,58,.35);
  padding-bottom: 2px;
}

/* ------------------------------------------------------------
   páginas internas (legal / suporte)
   ------------------------------------------------------------ */
.interna{ padding-block: clamp(7.5rem, 13vw, 10rem) clamp(4rem, 8vw, 6rem); background: var(--oxblood); color: var(--osso); }
.interna h1{ margin-block: 1.4rem .9rem; }
.interna .lede{ color: var(--fumo-inv); }

.texto-legal{ max-width: 700px; }
.texto-legal h2{ font-size: 1.35rem; margin-block: 2.6rem 1rem; }
.texto-legal h2:first-child{ margin-top: 0; }
.texto-legal p{ margin-bottom: 1.1rem; color: var(--fumo); line-height: 1.7; }
.texto-legal ul{ margin-bottom: 1.4rem; display: grid; gap: .7rem; }
.texto-legal li{
  padding-left: 1.3rem; position: relative; color: var(--fumo); line-height: 1.65;
}
.texto-legal li::before{
  content: ''; position: absolute; left: 0; top: .68em;
  width: 6px; height: 1px; background: var(--latao);
}
.texto-legal a{ color: var(--brasa); border-bottom: 1px solid rgba(175,53,39,.3); }
.texto-legal .atualizado{
  font-size: .74rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--latao-texto); margin-bottom: 2.6rem;
}
.texto-legal h3{
  font-family: var(--display); font-size: 1.05rem; font-weight: 600;
  color: var(--tinta); margin-block: 1.7rem .5rem; letter-spacing: -.01em;
}
.texto-legal ol{ margin: 0 0 1.4rem 0; padding: 0; list-style: none; counter-reset: item; display: grid; gap: .7rem; }
.texto-legal ol > li{
  padding-left: 2rem; position: relative; color: var(--fumo); line-height: 1.65;
  counter-increment: item;
}
.texto-legal ol > li::before{
  content: counter(item); position: absolute; left: 0; top: 0;
  font-family: var(--display); font-size: .8rem; font-weight: 600;
  color: var(--latao-texto); background: none; width: auto; height: auto;
}

/* tabela de dados (campo claro) */
.tabela-dados{ margin: 1.8rem 0; overflow-x: auto; }
.tabela-dados table{ width: 100%; border-collapse: collapse; font-size: .86rem; min-width: 560px; }
.tabela-dados th{
  background: var(--oxblood); color: var(--osso-claro);
  text-align: left; padding: .8rem .9rem;
  font-family: var(--texto); font-size: .68rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
}
.tabela-dados td{
  padding: .8rem .9rem; border-bottom: 1px solid var(--linha);
  color: var(--fumo); line-height: 1.55; vertical-align: top;
}
.tabela-dados tr:nth-child(even) td{ background: rgba(233,78,58,.06); }
.tabela-dados td strong{ color: var(--tinta); }

/* box de observação e de dados da empresa */
.nota-legal{
  background: var(--osso); border-left: 3px solid var(--latao);
  padding: 1.1rem 1.3rem; margin: 1.6rem 0; border-radius: 2px;
}
.nota-legal p{ margin: 0; color: var(--fumo); font-size: .92rem; line-height: 1.6; }
.nota-legal--empresa{ border-left-color: var(--brasa); }
.nota-legal--empresa p{ line-height: 1.9; }

/* ------------------------------------------------------------
   revelação em scroll
   ------------------------------------------------------------ */
/* O conteúdo permanece visível mesmo sem JavaScript ou ao restaurar o cache do Turbo. */
.rev{ opacity: 1; transform: none; }
.rev.vis{ animation: revela .85s cubic-bezier(.2,.7,.2,1); }
.rev[data-atraso="1"]{ animation-delay: .1s; }
.rev[data-atraso="2"]{ animation-delay: .2s; }
.rev[data-atraso="3"]{ animation-delay: .3s; }
@keyframes revela{ from{ transform: translateY(22px); } to{ transform: none; } }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .rev, .rev.vis{ opacity: 1; transform: none; animation: none; }
  .ficha{ transform: none; }
}

/* ============================================================
   HOME — posicionamento de retenção e inteligência da freguesia
   ============================================================ */

.topo__nav .topo__cta{
  opacity: 1;
  background: var(--brasa);
  color: var(--osso-claro);
  padding: .72rem .95rem;
  border-radius: 2px;
  letter-spacing: .06em;
}
.topo__nav .topo__cta:hover{ background: #E94E3A; }
@media (min-width: 900px) and (max-width: 1320px){
  .topo__interno{ gap: 1rem; }
  .topo__nav{ gap: clamp(.55rem, 1.05vw, .95rem); }
  .topo__nav a{
    font-size: .68rem;
    letter-spacing: .055em;
  }
  .topo__nav .topo__cta{ padding: .65rem .8rem; }
}

.hero--produto{ min-height: 760px; display:flex; align-items:center; }
.hero__grade--produto{ grid-template-columns: 1fr; }
@media (min-width: 980px){
  .hero__grade--produto{ grid-template-columns: 1.12fr .88fr; }
}
.hero__titulo--produto{ max-width: 13ch; }
.hero__titulo--produto .wonk{ display:inline; }
.hero__selos{
  margin-top: 1.8rem;
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  max-width: 720px;
}
.hero__selos span{
  display:inline-flex;
  align-items:center;
  min-height: 34px;
  padding:.48rem .72rem;
  border:1px solid var(--linha-inv);
  background:rgba(102,45,33,.18);
  color:var(--fumo-inv);
  font-size:.72rem;
  line-height:1.3;
  letter-spacing:.02em;
}

.hero__painel{ position:relative; }
.painel-demo{
  position:relative;
  max-width:460px;
  margin-inline:auto;
  padding:clamp(1.5rem,3vw,2.2rem);
  color:var(--tinta);
  background:var(--osso-claro);
  border:1px solid rgba(233,78,58,.55);
  border-radius:4px;
  box-shadow:0 32px 80px -34px rgba(102,45,33,.8);
}
.painel-demo::before{
  content:'';
  position:absolute;
  inset:9px;
  border:1px solid rgba(233,78,58,.25);
  pointer-events:none;
}
.painel-demo__topo,
.painel-demo__cliente,
.painel-demo__acao,
.painel-demo__aproximacao{
  position:relative;
  z-index:1;
}
.painel-demo__topo{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  padding-bottom:1.1rem;
  border-bottom:1px solid var(--linha);
}
.painel-demo__rotulo{
  font-size:.58rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--fumo);
}
.painel-demo__status{
  font-size:.65rem;
  font-weight:600;
  padding:.38rem .55rem;
  color:var(--brasa);
  border:1px solid rgba(175,53,39,.28);
  background:rgba(175,53,39,.06);
}
.painel-demo__cliente{
  display:flex;
  align-items:center;
  gap:.9rem;
  padding:1.4rem 0 1.1rem;
}
.painel-demo__avatar{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:var(--osso-claro);
  background:var(--oxblood);
  font-family:var(--display);
  font-weight:600;
}
.painel-demo__cliente strong{ display:block; font-family:var(--display); font-size:1.1rem; }
.painel-demo__cliente div span{ display:block; color:var(--fumo); font-size:.75rem; margin-top:.15rem; }
.painel-demo__resumo{
  position:relative;
  z-index:1;
  margin:0 0 1rem;
  padding:1rem 1.05rem;
  background:rgba(233,78,58,.08);
  border-left:3px solid var(--latao);
  color:var(--fumo);
  font-size:.82rem;
  line-height:1.55;
}
.painel-demo__resumo strong{ color:var(--tinta); font-weight:600; }
.painel-demo__ritmo{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--linha);
  border:1px solid var(--linha);
}
.painel-demo__ritmo div{ background:var(--osso); padding:1rem; }
.painel-demo__ritmo span{ display:block; font-size:.66rem; color:var(--fumo); margin-bottom:.25rem; }
.painel-demo__ritmo strong{ font-family:var(--display); font-size:1.45rem; }
.painel-demo__linha{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.7rem;
  align-items:center;
  padding:1.2rem .25rem;
}
.painel-demo__linha::before{
  content:'';
  position:absolute;
  left:7%; right:7%; top:50%;
  height:1px;
  background:var(--linha);
}
.painel-demo__linha i{
  position:relative;
  z-index:1;
  justify-self:center;
  width:9px; height:9px;
  border-radius:50%;
  background:var(--latao);
  box-shadow:0 0 0 5px var(--osso-claro);
}
.painel-demo__linha i.atraso{ background:var(--brasa); transform:translateX(55%); }
.painel-demo__acao,
.painel-demo__aproximacao{
  display:flex;
  gap:.85rem;
  align-items:center;
  padding:1rem 0;
  border-top:1px solid var(--linha);
}
.painel-demo__acao strong,
.painel-demo__aproximacao strong{ display:block; font-size:.86rem; }
.painel-demo__acao div span,
.painel-demo__aproximacao div span{ display:block; margin-top:.2rem; color:var(--fumo); font-size:.72rem; line-height:1.4; }
.painel-demo__nota{
  position:relative;
  z-index:1;
  display:block;
  margin-top:.75rem;
  padding-top:.8rem;
  border-top:1px solid var(--linha);
  color:var(--fumo);
  font-size:.62rem;
  line-height:1.45;
}
.painel-demo__icone{
  flex:none;
  display:grid;
  place-items:center;
  width:34px; height:34px;
  border:1px solid rgba(175,53,39,.3);
  color:var(--brasa);
  font-size:1.1rem;
}
.aproximacao-sinal{ width:34px; height:34px; position:relative; flex:none; transform:rotate(-12deg); }
.aproximacao-sinal i{ position:absolute; border:2px solid var(--latao-texto); border-left-color:transparent; border-bottom-color:transparent; border-radius:50%; transform:rotate(45deg); }
.aproximacao-sinal i:nth-child(1){ width:10px;height:10px;left:2px;bottom:2px; }
.aproximacao-sinal i:nth-child(2){ width:18px;height:18px;left:5px;bottom:5px; }
.aproximacao-sinal i:nth-child(3){ width:26px;height:26px;left:8px;bottom:8px; }

.secao-cabeca{ max-width:760px; }
.secao-cabeca h2{ margin-block:1.4rem 1.1rem; }
.secao-cabeca--clara .lede{ color:var(--fumo-inv); }

.mudancas{
  margin-top:clamp(2.6rem,5vw,3.6rem);
  display:grid;
  gap:1rem;
}
@media (min-width:800px){ .mudancas{ grid-template-columns:repeat(3,1fr); } }
.mudanca{
  padding:1.5rem;
  border:1px solid var(--linha);
  background:var(--osso);
  display:grid;
  grid-template-columns:1fr auto;
  gap:.35rem 1rem;
  align-items:center;
}
.mudanca__antes,.mudanca__depois{
  font-size:.58rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--fumo);
}
.mudanca strong{ font-family:var(--display); font-size:1.1rem; }
.mudanca__seta{ grid-row:1 / span 4; grid-column:2; color:var(--brasa); font-size:1.2rem; }
.pergunta-chave{
  margin-top:clamp(2rem,5vw,3rem);
  padding:clamp(1.7rem,4vw,2.4rem);
  background:var(--tinta);
  color:var(--osso);
  border-left:4px solid var(--brasa);
}
.pergunta-chave span{ font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--latao-claro); }
.pergunta-chave p{ margin-top:.65rem; font-family:var(--display); font-size:clamp(1.6rem,3vw,2.3rem); line-height:1.2; }
.cta-bloco--claro{ border-top-color:var(--linha); }

.fluxo-produto{
  margin-top:clamp(2.8rem,6vw,4.2rem);
  display:grid;
  gap:1px;
  background:var(--linha-inv);
  border:1px solid var(--linha-inv);
}
@media (min-width:760px){ .fluxo-produto{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1060px){ .fluxo-produto{ grid-template-columns:repeat(4,1fr); } }
.fluxo-card{
  position:relative;
  min-height:310px;
  padding:1.7rem;
  background:var(--oxblood);
}
.fluxo-card__numero{ font-size:.58rem; letter-spacing:.18em; color:var(--latao-claro); }
.fluxo-card__icone{
  width:48px; height:48px;
  display:grid; place-items:center;
  margin:2.2rem 0 1.2rem;
  border:1px solid var(--linha-inv);
  color:var(--latao-claro);
  font-family:var(--display);
  font-size:1.4rem;
}
.fluxo-card__icone .material-symbols-outlined{
  font-size:26px;
  line-height:1;
  color:currentColor;
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
}
.fluxo-card h3{ font-size:1.18rem; margin-bottom:.65rem; }
.fluxo-card p{ font-size:.9rem; line-height:1.6; color:var(--fumo-inv); }
.ancora--escura{ border-top-color:var(--latao-claro); }
.ancora--escura span{ color:var(--latao-claro); }

.beneficios--produto{
  grid-template-columns:1fr;
  background:var(--linha);
  border-color:var(--linha);
}
@media (min-width:760px){ .beneficios--produto{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1080px){ .beneficios--produto{ grid-template-columns:repeat(3,1fr); } }
.beneficio--produto{ background:var(--oxblood); color:var(--osso); }
.beneficio--produto h3{ color:var(--osso); }
.beneficio--produto p{ color:var(--fumo-inv); }
.beneficio--produto .beneficio__rot{ color:var(--latao-claro); }

.prova__grade{ display:grid; gap:clamp(2.8rem,6vw,5rem); align-items:center; }
@media (min-width:920px){ .prova__grade{ grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); } }
.prova__texto h2{ margin-block:1.1rem 1rem; color:var(--osso-claro); }
.prova__texto .btn{ margin-top:1.7rem; }
.prova__lista{ margin-top:1.7rem; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem 1rem; }
.prova__lista li{ position:relative; padding:.85rem .9rem .85rem 2rem; border:1px solid var(--linha-inv); border-radius:5px; color:var(--osso-claro); font-size:.84rem; line-height:1.45; }
.prova__lista li::before{ content:'check'; position:absolute; left:.72rem; top:.76rem; font-family:'Material Symbols Outlined'; font-size:1rem; line-height:1; color:var(--brasa-viva); }
.prova__visual{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--linha-inv);
  border:1px solid var(--linha-inv);
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 24px 58px -34px rgba(102,45,33,.75);
}
.grupo{ min-height:190px; padding:clamp(1.4rem,3vw,2rem); display:flex; flex-direction:column; justify-content:center; background:var(--oxblood); text-align:center; color:var(--osso-claro); }
.grupo--tratado{ background:var(--brasa); }
.grupo--controle{ background:var(--oxblood); }
.grupo span,.uplift span{ display:block; font-size:.62rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.grupo span{ color:var(--osso-claro); }
.grupo strong{ display:block; margin:.55rem 0 .18rem; font-family:var(--display); font-size:clamp(2.6rem,5vw,4rem); line-height:1; color:var(--osso-claro); }
.grupo small{ color:var(--fumo-inv); font-size:.78rem; line-height:1.4; }
.uplift{ grid-column:1/-1; padding:1.45rem 1.7rem; background:var(--osso-claro); color:var(--tinta); text-align:center; }
.uplift span{ color:var(--brasa); }
.uplift strong{ display:block; margin:.3rem 0; font-family:var(--display); font-size:2.25rem; color:var(--brasa); }
.uplift small{ display:block; color:var(--fumo); font-size:.72rem; line-height:1.45; }
@media (max-width:620px){ .prova__lista{ grid-template-columns:1fr; } }

.retorno__grade{ display:grid; gap:clamp(2.4rem,6vw,4.5rem); align-items:start; }
@media (min-width:920px){ .retorno__grade{ grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr); } }
.retorno__texto h2{ margin-block:1.4rem 1.1rem; }
.retorno__texto .lede{ max-width:56ch; }
.retorno__formulas{ margin-top:1.5rem; display:grid; gap:1rem; }
.retorno__formula{ padding:1rem 1.1rem; border:1px solid var(--linha); border-radius:8px; background:var(--osso-claro); display:grid; gap:.3rem; }
.retorno__formula small,
.retorno__formula span{ display:block; font-size:.64rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--brasa); }
.retorno__formula strong{ display:block; color:var(--tinta); font-family:var(--display); font-size:clamp(1.02rem,1.45vw,1.18rem); line-height:1.35; }
.retorno__formula p{ margin:.1rem 0 0; color:var(--fumo); font-size:.8rem; line-height:1.55; }
.retorno__calculadoras{ display:grid; gap:1rem; }
.calculadora{ background:var(--osso-claro); border:1px solid var(--linha); box-shadow:0 25px 55px -36px rgba(102,45,33,.45); padding:clamp(1.5rem,4vw,2rem); border-radius:8px; }
.calculadora__cabeca{ margin-bottom:1rem; }
.calculadora__rotulo{ display:block; margin-bottom:.4rem; font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--brasa); }
.calculadora__cabeca h3{ margin:0 0 .35rem; color:var(--tinta); font-family:var(--display); font-size:clamp(1.28rem,2vw,1.72rem); line-height:1.12; }
.calculadora__cabeca p{ margin:0; color:var(--fumo); font-size:.84rem; line-height:1.55; }
.calculadora__campos{ display:grid; gap:1rem; }
@media (min-width:680px){ .calculadora__campos{ grid-template-columns:repeat(3,1fr); } .calculadora__campos--quatro{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.calculadora label{ font-size:.72rem; line-height:1.4; color:var(--fumo); font-weight:600; }
.calculadora input{
  width:100%; margin-top:.45rem; padding:.86rem .95rem;
  border:1px solid var(--linha); border-radius:6px;
  background:#fff; color:var(--tinta);
  font-family:var(--texto); font-size:1rem;
}
.calculadora input:focus{ outline:none; border-color:var(--brasa); box-shadow:0 0 0 3px rgba(175,53,39,.12); }
.calculadora__resultado{
  margin-top:1.2rem;
  display:grid;
  gap:1px;
  background:var(--linha);
  border:1px solid var(--linha);
  border-radius:8px;
  overflow:hidden;
}
@media (min-width:620px){ .calculadora__resultado{ grid-template-columns:1fr 1fr; } }
.calculadora__resultado div{ min-width:0; padding:1.2rem; background:var(--osso); }
.calculadora__resultado span{ display:block; font-size:.64rem; color:var(--brasa); text-transform:uppercase; letter-spacing:.1em; font-weight:600; }
.calculadora__resultado strong{ display:block; margin-top:.35rem; font-family:var(--display); font-size:clamp(1.45rem,2.2vw,2rem); color:var(--oxblood); line-height:1.05; white-space:nowrap; font-variant-numeric:tabular-nums; }
.calculadora__resultado strong.valor-longo{ font-size:clamp(1.2rem,1.8vw,1.55rem); }
.calculadora__resultado strong.valor-muito-longo{ font-size:clamp(1.02rem,1.45vw,1.28rem); }
.calculadora__nota{ margin:1rem 0 0; color:var(--fumo); font-size:.82rem; line-height:1.58; }
.retorno__cta .btn{ width:100%; justify-content:center; }

.segmentos{
  margin-top:clamp(2.4rem,5vw,3.5rem);
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media (min-width:760px){ .segmentos{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.segmento{
  min-width:0;
  padding:clamp(1.45rem,3vw,2rem);
  background:var(--osso-claro);
  border:1px solid var(--linha);
  border-radius:8px;
  box-shadow:0 18px 42px -36px rgba(102,45,33,.45);
}
.segmento__cabeca{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.15rem; }
.segmento__ordem{ display:block; margin-bottom:1.15rem; color:var(--brasa); font-family:var(--texto); font-size:.68rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.segmento__cabeca .segmento__ordem{ margin-bottom:0; }
.segmento__badge{ display:inline-flex; align-items:center; min-height:28px; padding:.35rem .65rem; border-radius:999px; background:var(--brasa-viva); color:var(--osso-claro); font-size:.62rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.segmento h3{ font-size:clamp(1.25rem,1.8vw,1.55rem); margin-bottom:.65rem; }
.segmento p{ color:var(--fumo); font-size:.9rem; line-height:1.65; }
.segmento--destaque{ grid-column:1/-1; padding:clamp(1.7rem,3.5vw,2.4rem); background:var(--tinta); border-color:var(--tinta); box-shadow:0 24px 55px -38px rgba(102,45,33,.75); }
.segmento--destaque .segmento__ordem{ color:var(--brasa-viva); }
.segmento--destaque h3{ color:var(--osso-claro); font-size:clamp(1.7rem,2.8vw,2.35rem); }
.segmento--destaque p{ max-width:72ch; color:var(--osso-claro); font-size:clamp(.95rem,1.2vw,1.05rem); }
.segmento--aberto{ border-style:dashed; background:rgba(255,255,255,.55); }
@media (max-width:759px){ .segmento--destaque{ grid-column:auto; } }

.dupla--contactless{ grid-template-columns:1fr; }
@media (min-width:900px){ .dupla--contactless{ grid-template-columns:.9fr 1.1fr; } }
.contactless__visual{
  min-height:430px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.contactless__visual::before{
  content:'';
  position:absolute;
  width:360px; height:360px;
  border:1px solid var(--linha-inv);
  border-radius:50%;
  box-shadow:0 0 0 55px rgba(233,78,58,.025),0 0 0 110px rgba(233,78,58,.018);
}
.tag-aproximacao{
  position:relative;
  z-index:2;
  width:210px; height:290px;
  padding:1.4rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:var(--osso-claro);
  color:var(--tinta);
  border-radius:8px;
  transform:rotate(-5deg);
  box-shadow:0 25px 60px -25px rgba(102,45,33,.65);
}
.tag-aproximacao::before{ content:''; position:absolute; inset:8px; border:1px solid rgba(233,78,58,.35); border-radius:5px; }
.tag-aproximacao__marca{ position:absolute; top:1.4rem; left:1.4rem; font-family:var(--display); font-size:.9rem; }
.tag-aproximacao__sinal{ position:absolute; top:50%; left:50%; width:78px; height:78px; transform:translate(-50%,-58%); }
.tag-aproximacao__sinal i{ position:absolute; border:4px solid var(--brasa); border-left-color:transparent; border-bottom-color:transparent; border-radius:50%; transform:rotate(45deg); }
.tag-aproximacao__sinal i:nth-child(1){ width:20px;height:20px;left:0;bottom:0; }
.tag-aproximacao__sinal i:nth-child(2){ width:40px;height:40px;left:10px;bottom:10px; }
.tag-aproximacao__sinal i:nth-child(3){ width:60px;height:60px;left:20px;bottom:20px; }
.tag-aproximacao strong{ position:relative; font-family:var(--display); font-size:1.35rem; }
.tag-aproximacao small{ position:relative; color:var(--fumo); }
.celular-aproximacao{
  position:absolute;
  z-index:3;
  width:120px; height:230px;
  right:7%; bottom:5%;
  border:7px solid var(--tinta);
  border-radius:24px;
  background:#662D21;
  transform:rotate(10deg);
  box-shadow:0 24px 40px -18px rgba(102,45,33,.8);
}
.celular-aproximacao span{ position:absolute; inset:12px; border-radius:14px; background:linear-gradient(155deg,#FFFFFF,#E94E3A); }
.celular-aproximacao i{ position:absolute; width:35px; height:5px; border-radius:5px; top:7px; left:50%; transform:translateX(-50%); background:#662D21; }
.contactless__cta{ margin-top:2rem; }

.cadastro__grade{ display:grid; gap:clamp(2.8rem,6vw,4.8rem); align-items:start; }
@media (min-width:940px){ .cadastro__grade{ grid-template-columns:.95fr 1.05fr; } }
.cadastro__texto h2{ margin-block:1.4rem 1.2rem; }
.ancora-legada{ position:absolute; top:0; left:0; width:1px; height:1px; overflow:hidden; }

@media (max-width:620px){
  .hero--produto{ min-height:auto; }
  .hero__titulo--produto{ font-size:clamp(2.45rem,12vw,3.45rem); }
  .hero__acoes .btn{ width:100%; justify-content:center; }
  .hero__selos{ display:grid; grid-template-columns:1fr; }
  .painel-demo__ritmo{ grid-template-columns:1fr; }
  .prova__visual{ grid-template-columns:1fr; }
  .uplift{ grid-column:1; }
  .contactless__visual{ min-height:350px; }
  .tag-aproximacao{ width:175px; height:240px; }
  .celular-aproximacao{ width:100px; height:190px; right:2%; }
}

.secao-centralizada{ max-width:46ch; margin-inline:auto; text-align:center; }
.secao-centralizada h2{ margin-block:1.4rem 1.2rem; }
.secao-centralizada .lede{ margin-inline:auto; }

section[id]{ scroll-margin-top:74px; }

.retorno__formula{
  margin-top:1.5rem;
  padding:1.15rem 1.25rem;
  border:1px solid var(--linha);
  background:var(--osso);
}
.retorno__formula span{ display:block; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:var(--latao-texto); }
.retorno__formula strong{ display:block; margin:.3rem 0 .75rem; font-size:.9rem; line-height:1.45; }
.retorno__formula strong:last-child{ margin-bottom:0; }

/* ------------------------------------------------------------
   Hero: exemplo de leitura do ritmo — versão 2
   ------------------------------------------------------------ */
.painel-demo--v2{
  max-width: 500px;
  padding: clamp(1.35rem, 2.4vw, 2rem);
  background: var(--osso-claro);
  color: var(--tinta);
  border: 1px solid rgba(233,78,58,.58);
  border-radius: 8px;
  box-shadow: 0 28px 70px -30px rgba(102,45,33,.78);
  overflow: hidden;
}
.painel-demo--v2::before{
  inset: 8px;
  border-radius: 5px;
}
.painel-demo--v2 .painel-demo__topo{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--linha);
}
.painel-demo--v2 .painel-demo__rotulo{
  font-size: .62rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--latao-texto);
}
.painel-demo--v2 .painel-demo__status{
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  white-space: nowrap;
  padding: .42rem .62rem;
  border: 1px solid rgba(175,53,39,.28);
  border-radius: 999px;
  background: rgba(175,53,39,.07);
  color: var(--brasa);
  font-size: .66rem;
  font-weight: 600;
  line-height: 1;
}
.painel-demo--v2 .painel-demo__status i{
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}
.painel-demo__identidade{
  position: relative;
  z-index: 1;
  display: grid;
  gap: .8rem;
  padding: 1.35rem 0 1rem;
}
.painel-demo__nome{
  display: block;
  font-family: var(--display);
  font-size: 1.45rem;
  font-weight: 600;
  line-height: 1.05;
}
.painel-demo__perfil{
  display: block;
  margin-top: .22rem;
  color: var(--fumo);
  font-size: .74rem;
}
.painel-demo__identidade p{
  max-width: 42ch;
  color: var(--fumo);
  font-size: .82rem;
  line-height: 1.55;
}
.painel-demo__identidade p strong{
  color: var(--tinta);
  font-weight: 600;
}
.painel-demo__metricas{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .7rem;
  margin-bottom: 1.1rem;
}
.painel-demo__metrica{
  padding: .95rem 1rem;
  border: 1px solid var(--linha);
  border-radius: 4px;
  background: var(--osso);
}
.painel-demo__metrica span{
  display: block;
  margin-bottom: .22rem;
  color: var(--fumo);
  font-size: .64rem;
  line-height: 1.3;
}
.painel-demo__metrica strong{
  display: block;
  font-family: var(--display);
  font-size: 1.5rem;
  line-height: 1.1;
  color: var(--tinta);
}
.painel-demo__metrica--alerta{
  border-color: rgba(175,53,39,.25);
  background: rgba(175,53,39,.055);
}
.painel-demo__metrica--alerta strong{ color: var(--brasa); }
.painel-demo__etapas{
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--linha);
}
.painel-demo__etapas li{
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: .8rem;
  align-items: start;
  padding: .9rem 0;
  border-bottom: 1px solid var(--linha);
}
.painel-demo__numero{
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid rgba(233,78,58,.55);
  color: var(--latao-texto);
  font-family: var(--display);
  font-size: .82rem;
  font-weight: 600;
  line-height: 1;
}
.painel-demo__etapas strong{
  display: block;
  margin-top: .05rem;
  color: var(--tinta);
  font-size: .82rem;
  line-height: 1.35;
}
.painel-demo__etapas div span{
  display: block;
  margin-top: .16rem;
  color: var(--fumo);
  font-size: .71rem;
  line-height: 1.48;
}
.painel-demo--v2 .painel-demo__nota{
  margin: .85rem 0 0;
  padding: 0;
  border: 0;
  color: var(--fumo);
  font-size: .61rem;
  line-height: 1.45;
}
@media (max-width: 620px){
  .painel-demo--v2{ padding: 1.15rem; }
  .painel-demo--v2 .painel-demo__topo{ align-items: flex-start; }
  .painel-demo__metricas{ grid-template-columns: 1fr 1fr; gap: .5rem; }
  .painel-demo__metrica{ padding: .78rem .75rem; }
  .painel-demo__metrica strong{ font-size: 1.25rem; }
}

/* ------------------------------------------------------------
   Aproximação — visual da tag + celular
   ------------------------------------------------------------ */
#contactless{ background:var(--tinta); color:var(--osso-claro); }
#contactless .dupla--contactless{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(3rem,6vw,5rem);
  align-items:center;
}
#contactless .contactless__visual{
  min-height:500px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:visible;
}
#contactless .aproximacao-demo{
  position:relative;
  width:min(100%,500px);
  min-height:430px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#contactless .aproximacao-tag{
  position:absolute;
  left:4%;
  top:12%;
  width:235px;
  height:320px;
  padding:1.2rem;
  display:flex;
  flex-direction:column;
  background:var(--osso-claro);
  color:var(--tinta);
  border:1px solid rgba(255,255,255,.55);
  border-radius:12px;
  box-shadow:0 28px 60px -30px rgba(0,0,0,.55);
  transform:rotate(-4deg);
}
#contactless .aproximacao-tag::after{
  content:'';
  position:absolute;
  inset:9px;
  border:1px solid rgba(175,53,39,.25);
  border-radius:8px;
  pointer-events:none;
}
#contactless .aproximacao-tag__topo{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  font-family:var(--display);
  font-size:.95rem;
  font-weight:600;
}
#contactless .aproximacao-tag__topo .material-symbols-outlined{ font-size:25px; color:var(--brasa); }
#contactless .aproximacao-tag__centro{
  position:relative;
  z-index:1;
  margin:auto 0;
  display:grid;
  justify-items:center;
  text-align:center;
  gap:.45rem;
}
#contactless .aproximacao-tag__centro .material-symbols-outlined{
  font-size:64px;
  color:var(--brasa-viva);
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 48;
}
#contactless .aproximacao-tag__centro strong{
  font-family:var(--display);
  font-size:1.35rem;
  line-height:1.15;
  color:var(--tinta);
}
#contactless .aproximacao-tag__centro small{ font-size:.75rem; color:var(--tinta); }
#contactless .aproximacao-celular{
  position:absolute;
  right:4%;
  bottom:8%;
  width:175px;
  height:330px;
  padding:10px;
  background:var(--tinta);
  border:2px solid rgba(255,255,255,.32);
  border-radius:28px;
  box-shadow:0 28px 60px -28px rgba(0,0,0,.7);
  transform:rotate(6deg);
}
#contactless .aproximacao-celular::before{
  content:'';
  position:absolute;
  top:7px;
  left:50%;
  width:52px;
  height:5px;
  transform:translateX(-50%);
  border-radius:999px;
  background:var(--osso-claro);
  opacity:.35;
}
#contactless .aproximacao-celular__tela{
  height:100%;
  padding:1.1rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:.65rem;
  background:var(--osso-claro);
  border-radius:20px;
  color:var(--tinta);
}
#contactless .aproximacao-celular__tela .material-symbols-outlined{
  font-size:52px;
  color:var(--brasa);
  font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 48;
}
#contactless .aproximacao-celular__tela strong{
  font-family:var(--display);
  font-size:1.15rem;
  line-height:1.1;
  color:var(--tinta);
}
#contactless .aproximacao-celular__tela small{ font-size:.72rem; line-height:1.45; color:var(--tinta); }
#contactless .aproximacao-seta{
  position:absolute;
  z-index:5;
  left:50%;
  top:47%;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:var(--brasa-viva);
  color:var(--osso-claro);
  box-shadow:0 12px 30px -18px rgba(0,0,0,.55);
}
#contactless .aproximacao-seta .material-symbols-outlined{ font-size:26px; }
#contactless .dupla__texto h2{ max-width:16ch; color:var(--osso-claro); }
#contactless .dupla__texto .lede{ max-width:54ch; color:rgba(255,255,255,.78); }
#contactless .criterios{ margin-top:1.8rem; border-top:1px solid rgba(255,255,255,.18); }
#contactless .criterio{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:.8rem;
  padding:1.25rem 0;
  border-bottom:1px solid rgba(255,255,255,.18);
}
#contactless .criterio__mark{ color:var(--brasa-viva); font-size:.72rem; font-weight:600; letter-spacing:.12em; }
#contactless .criterio strong{ display:block; margin-bottom:.25rem; color:var(--osso-claro); font-size:.95rem; }
#contactless .criterio p{ margin:0; color:rgba(255,255,255,.74); font-size:.82rem; line-height:1.5; }
#contactless .contactless__cta{ margin-top:1.6rem; min-width:240px; justify-content:center; }
@media (max-width:920px){
  #contactless .dupla--contactless{ grid-template-columns:1fr; }
  #contactless .contactless__visual{ min-height:430px; order:2; }
  #contactless .dupla__texto{ order:1; }
  #contactless .dupla__texto h2{ max-width:18ch; }
}
@media (max-width:620px){
  #contactless .contactless__visual{ min-height:370px; }
  #contactless .aproximacao-demo{ min-height:350px; }
  #contactless .aproximacao-tag{ left:0; top:8%; width:190px; height:270px; }
  #contactless .aproximacao-tag__centro .material-symbols-outlined{ font-size:52px; }
  #contactless .aproximacao-celular{ right:0; bottom:4%; width:135px; height:260px; }
  #contactless .aproximacao-seta{ width:44px; height:44px; }
  #contactless .contactless__cta{ width:100%; min-width:0; }
}

/* ------------------------------------------------------------
   implantação — composição final da seção de cadastro
   ------------------------------------------------------------ */
#cadastro{
  padding-block:clamp(5rem,8vw,7rem);
  background:#662D21;
  color:#FFFFFF;
}
#cadastro .cadastro__grade{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(390px,.88fr);
  gap:clamp(3rem,6vw,5rem);
  align-items:start;
}
#cadastro .cadastro__texto{ min-width:0; }
#cadastro .etiqueta{ color:#E94E3A; }
#cadastro .cadastro__texto h2{
  max-width:17ch;
  margin:1rem 0 1.1rem;
  color:#FFFFFF;
  font-size:clamp(2.35rem,4.5vw,4rem);
  line-height:1;
}
#cadastro .cadastro__texto .lede{
  max-width:55ch;
  color:rgba(255,255,255,.78);
  font-size:clamp(1rem,1.3vw,1.14rem);
  line-height:1.65;
}
#cadastro .criterios{
  margin-top:1.9rem;
  border-top:1px solid rgba(255,255,255,.18);
}
#cadastro .criterio{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:.9rem;
  padding:1.2rem 0;
  border-bottom:1px solid rgba(255,255,255,.18);
}
#cadastro .criterio__mark{
  color:#E94E3A;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.12em;
}
#cadastro .criterio strong{
  display:block;
  margin-bottom:.25rem;
  color:#FFFFFF;
  font-size:.95rem;
}
#cadastro .criterio p{
  margin:0;
  color:rgba(255,255,255,.74);
  font-size:.82rem;
  line-height:1.5;
}
#cadastro .form{
  width:100%;
  max-width:520px;
  margin-left:auto;
  background:#FFFFFF;
  color:#662D21;
  padding:clamp(1.5rem,3vw,2.1rem);
  border:1px solid rgba(255,255,255,.35);
  border-radius:8px;
  box-shadow:0 28px 60px -34px rgba(0,0,0,.7);
}
#cadastro .form__cabeca{
  padding-bottom:1rem;
  margin-bottom:1.4rem;
  border-bottom:1px solid rgba(102,45,33,.16);
}
#cadastro .form__cabeca h3{ color:#662D21; font-size:1.55rem; line-height:1.1; }
#cadastro .form__cabeca p{ margin-top:.4rem; color:rgba(102,45,33,.76); font-size:.84rem; line-height:1.5; }
#cadastro .campo{ margin-bottom:1.05rem; }
#cadastro .campo > label{
  display:block;
  margin-bottom:.45rem;
  color:#662D21;
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
#cadastro .campo input,
#cadastro .campo select{
  width:100%;
  padding:.8rem .1rem;
  border:0;
  border-bottom:1px solid rgba(102,45,33,.22);
  background:transparent;
  color:#662D21;
  font-family:'Archivo',Arial,sans-serif;
  font-size:.96rem;
}
#cadastro .campo input:focus,
#cadastro .campo select:focus{ outline:none; border-bottom-color:#AF3527; }
#cadastro .form .btn{ width:100%; min-height:54px; justify-content:center; margin-top:.5rem; }
#cadastro .form__micro{ margin-top:1rem; color:rgba(102,45,33,.72); font-size:.74rem; line-height:1.5; }
@media (max-width:940px){
  #cadastro .cadastro__grade{ grid-template-columns:1fr; }
  #cadastro .form{ max-width:680px; margin-left:0; }
  #cadastro .cadastro__texto h2{ max-width:20ch; }
}
@media (max-width:620px){
  #cadastro{ padding-block:4rem; }
  #cadastro .cadastro__texto h2{ font-size:clamp(2rem,11vw,3rem); }
  #cadastro .form{ padding:1.25rem; }
}

@media (max-width:620px){ .marca img{height:42px;} .rodape__marca img{height:44px;} }