/* =========================================================
   DESVENDANDO O CLAUDINHO — Annie Lemos
   Design system extraído de anniearchanjo.com.br
   Playfair Display (display) + Plus Jakarta Sans (texto)

   ATENÇÃO: a pele atual (creme + terracota + asterisco) está no
   bloco TEMA "CLAUDE CONTENT", lá no fim do arquivo. Ele redefine
   os tokens por escopo de seção, então mexer numa cor aqui em cima
   pode não ter efeito nenhum. Comece por lá.
   ========================================================= */

:root{
  /* superfícies */
  /* A hero é o único trecho escuro que sobrou, e o preto neutro brigava com
     o creme e o terracota do resto: virou tinta marrom, mesma família. */
  --bg:            #1A100B;
  --bg-2:          #20140D;
  --surface:       #261A12;
  --surface-2:     #33231A;
  /* superfícies coloridas sólidas (sem rgba, sem stroke) */
  --box-green:     #331708;
  --box-green-2:   #4A2413;
  --box-red:       #2B1216;
  --box-red-2:     #3B1B21;
  --hair:          rgba(255,228,208,.11);
  --hair-strong:   rgba(255,228,208,.2);
  --tint:          rgba(255,255,255,.063);

  /* texto */
  --white:         #FFFFFF;
  --text:          #F0E5DC;
  --muted:         #CFBDB0;
  /* o --dim era um cinza AZULADO (#9BA1AA), o que mais destoava na hero */
  --dim:           #A89283;
  --faint:         #8C7566;

  /* acento (violeta do glow do site) */
  --violet:        #6B4BA8;
  --violet-soft:   rgba(126, 90, 200, .28);

  /* tipografia */
  --display: "Playfair Display", Georgia, serif;
  --sans:    "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;

  /* forma */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;

  --maxw: 1240px;
  --pad: 40px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top:32px; }

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }

::selection{ background:rgba(255,255,255,.85); color:#0F0F0F; }

/* equilíbrio de texto GLOBAL: linhas balanceadas e zero viúvas em todo
   o funil (progressive enhancement: navegador antigo simplesmente ignora).
   Obs.: em blocos muito longos (>6 linhas) o navegador desativa o balance
   sozinho, então parágrafos grandes não são afetados. */
/* parágrafos e listas: "pretty" mata viúva em bloco de QUALQUER tamanho
   (o balance é ignorado pelo navegador acima de 6 linhas) */
:where(p, li, dd, summary, blockquote){
  text-wrap:pretty;
}
/* todo o resto com texto (inclusive spans e divs usados como bloco):
   linhas balanceadas */
:where(h1, h2, h3, h4, h5, h6, figcaption, label, legend, dt, span, div, em, strong, small, a, th, td){
  text-wrap:balance;
}
/* curtos e multilinhas que se beneficiam mais de balance que de pretty */
:where(.chips li, .tickets__label, .pos-hero__note, .consequencia, .manifesto){
  text-wrap:balance;
}

/* ─────────────  FAIXA DE QUALIFICAÇÃO (topo da LP)  ───────────── */

.alertbar{
  position:relative; z-index:21;
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
  font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  text-align:center; padding:10px 18px;
}
/* a topbar é absoluta: com a faixa presente, tudo desce a altura dela */
.alertbar ~ .topbar{ top:38px; }
.alertbar ~ .hero{ padding-top:150px; }

/* ─────────────  BACKGROUND AMBIENTE  ───────────── */

.bg-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  max-width:var(--maxw); margin:0 auto;
  display:flex; justify-content:space-between;
  padding:0 var(--pad);
}
.bg-grid span{ width:1px; background:linear-gradient(180deg,transparent,rgba(255,255,255,.055) 12%,rgba(255,255,255,.055) 88%,transparent); }

.bg-glow{
  position:fixed; z-index:0; pointer-events:none;
  width:60vw; height:60vw; max-width:820px; max-height:820px;
  border-radius:50%; filter:blur(120px); opacity:.5;
}
.bg-glow--tr{ top:-22vw; right:-18vw; background:radial-gradient(circle, var(--violet-soft) 0%, transparent 68%); }
.bg-glow--bl{ bottom:-26vw; left:-20vw; background:radial-gradient(circle, rgba(90,70,150,.22) 0%, transparent 68%); }

.bg-noise{
  position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ─────────────  LAYOUT  ───────────── */

.wrap{ position:relative; z-index:2; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }
.wrap--narrow{ max-width:860px; }

.section{ position:relative; z-index:2; padding:130px 0; }
.section--tight{ padding:90px 0; }

/* ─────────────  TIPOGRAFIA  ───────────── */

.h1{
  font-family:var(--display);
  font-weight:200;
  font-size:clamp(46px, 6.6vw, 88px);
  line-height:1.04;
  letter-spacing:-.015em;
  color:var(--white);
  margin:0 0 26px;
}

/* headline substituída pelo logo do workshop — abre o hero */
.h1--logo{ margin-bottom:26px; }
.h1--logo img{
  width:100%; max-width:208px; height:auto;
  /* o SVG é branco puro: o leve dim evita brilho excessivo sobre o fundo #0F0F0F */
  opacity:.97;
}

.h2{
  font-family:var(--display);
  font-weight:200;
  font-size:clamp(32px, 4.2vw, 56px);
  line-height:1.12;
  letter-spacing:-.01em;
  color:var(--white);
  margin:0 0 28px;
}
.h2--sm{ font-size:clamp(28px, 3.2vw, 42px); }
.h2 em{ font-style:italic; font-weight:300; }

h3{ font-family:var(--sans); font-weight:600; letter-spacing:-.01em; color:var(--white); margin:0 0 10px; font-size:19px; }


.lead{ font-size:17px; line-height:1.75; color:var(--muted); margin:0 0 34px; max-width:56ch; }
.lead strong{ color:var(--white); font-weight:600; }

.body{ font-size:16px; line-height:1.8; color:var(--muted); margin:0 0 20px; }
.body strong{ color:var(--white); font-weight:600; }


.section__lead{ font-size:17px; color:var(--muted); max-width:60ch; margin:0 0 56px; }


/* ─────────────  BRAND LOCKUP  ───────────── */

.brand{ display:inline-flex; flex-direction:column; gap:6px; }
.brand__name{
  font-family:var(--display); font-weight:300;
  font-size:16px; letter-spacing:.42em; color:var(--white);
}
.brand__sub{
  font-size:9.5px; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:var(--dim); padding-top:6px; border-top:1px solid var(--hair);
}
/* o lockup da Annie sobrou só no rodapé — a página não tem menu:
   sem link de saída, o único caminho é a conversão */

/* ─────────────  BOTÕES  ───────────── */

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:linear-gradient(60deg,#C25E3D 0%,#DA7756 100%);
  color:#2A130B;
  font-family:var(--sans); font-size:15px; font-weight:700; letter-spacing:-.005em;
  padding:16px 30px; border-radius:var(--r-sm); border:0; cursor:pointer;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease, filter .25s ease;
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 0 0 1px rgba(218,119,86,.35), 0 12px 34px -10px rgba(201,100,66,.55);
}
.btn:hover{ transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 1px 0 rgba(255,255,255,.45) inset, 0 0 0 1px rgba(218,119,86,.5), 0 18px 44px -10px rgba(201,100,66,.7); }
.btn:active{ transform:translateY(0); }
.btn--sm{ padding:11px 20px; font-size:13.5px; }
.btn--lg{ padding:19px 18px; font-size:15.5px; width:100%; white-space:nowrap; }


/* ─────────────  PILL  ───────────── */

.pill{
  display:inline-flex; align-items:center; gap:9px;
  font-size:11.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); background:var(--surface); border-radius:100px;
  padding:8px 16px; margin:0 0 28px;
}
.pill strong{ color:var(--white); }
.pill{ flex-wrap:wrap; row-gap:4px; }
.pill__seg{ white-space:nowrap; }
.pill__sep{ color:var(--faint); }
.seg-short{ display:none; }
.pill__dot{
  width:6px; height:6px; border-radius:50%; background:#FFB08A;
  box-shadow:0 0 0 3px rgba(255,176,138,.16);
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.35} }

/* ─────────────  HERO  ───────────── */

.hero{ position:relative; z-index:2; padding:104px 0 90px; }

/* headline e subheadline separadas: antes era um parágrafo único e o hero
   virava um bloco de texto sem hierarquia de leitura */
.hero__headline{
  font-family:var(--sans);
  font-size:clamp(21px, 2.1vw, 27px);
  line-height:1.35;
  font-weight:600;
  letter-spacing:-.015em;
  color:var(--white);
  margin:0 0 18px;
  max-width:22ch;
}
.hero__headline em{
  font-family:var(--display); font-style:italic; font-weight:300;
  font-size:1.12em; letter-spacing:-.01em;
}
.hero__sub{
  font-size:16px; line-height:1.75; color:var(--muted);
  margin:0 0 34px; max-width:52ch;
}

.hero__cta{ display:flex; align-items:center; gap:28px; flex-wrap:wrap; margin-bottom:0; }

.hero__meta{
  display:flex; gap:0; border-top:1px solid var(--hair); padding-top:24px; max-width:520px;
}
.hero__meta li{ flex:1; display:flex; flex-direction:column; gap:4px; padding-right:22px; }
.hero__meta li + li{ border-left:1px solid var(--hair); padding-left:22px; }
.hero__meta span{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); font-weight:600; }
.hero__meta strong{ font-size:14.5px; font-weight:600; color:var(--white); }

/* retrato */
.portrait{
  margin:0; position:relative; overflow:hidden;
  border-radius:var(--r-md);
  background:var(--surface);
  aspect-ratio:4/5;
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9);
}
.portrait img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.05); }
.portrait::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(26,16,11,0) 45%, rgba(26,16,11,.55) 100%);
}
.portrait__tag{
  position:absolute; left:-26px; bottom:38px; z-index:3;
  display:flex; flex-direction:column; gap:2px;
  background:#1C1C1C; border-radius:var(--r-md);
  padding:16px 22px; box-shadow:0 24px 50px -22px rgba(0,0,0,1);
}
.portrait__tag strong{ font-family:var(--display); font-weight:300; font-size:22px; color:var(--white); }
.portrait__tag span{ font-size:12px; color:var(--muted); letter-spacing:.04em; }

/* ─────────────  ESTEIRAS INCLINADAS  ───────────── */

.belt{
  position:relative; z-index:2; overflow:hidden;
  padding:52px 0 44px;
}
/* na LP, as esteiras sobem por cima do fim do hero pra cobrir a borda
   cortada da foto da Annie */
.belt--hero{ z-index:3; margin-top:-92px; }
.marquee{ overflow:hidden; }
.marquee__track{ display:flex; align-items:center; gap:34px; width:max-content; animation:slide 30s linear infinite; }
.marquee__track--reverse{ animation-direction:reverse; }
.marquee__track i{ font-size:10px; font-style:normal; }
@keyframes slide{ to{ transform:translateX(-50%); } }

/* faixa verde: gira levemente e sangra pra fora da viewport */
.marquee--green{
  transform:rotate(-2.2deg) scale(1.06);
  background:linear-gradient(60deg,#C25E3D 0%,#DA7756 100%);
  box-shadow:0 18px 50px -20px rgba(201,100,66,.5);
}
.marquee--green .marquee__track{ padding:13px 0; }
.marquee--green span{
  font-family:var(--sans); font-weight:800; font-size:14px; letter-spacing:.14em;
  color:#2A130B; white-space:nowrap;
}
.marquee--green i{ color:rgba(42,19,11,.55); }

/* faixa escura cruzando na direção oposta */
.marquee--dark{
  transform:rotate(1.4deg) scale(1.06);
  margin-top:-6px;
  background:var(--surface);
  border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
}
.marquee--dark .marquee__track{ padding:12px 0; }
.marquee--dark span{
  font-family:var(--display); font-style:italic; font-weight:300;
  font-size:18px; color:var(--muted); white-space:nowrap;
}
.marquee--dark i{ color:var(--faint); }

/* ─────────────  MARCA-TEXTO  ───────────── */

.hl{
  background:linear-gradient(104deg,
    rgba(218,119,86,0) 0%, rgba(218,119,86,.38) 4%,
    rgba(218,119,86,.30) 96%, rgba(218,119,86,0) 100%);
  box-decoration-break:clone; -webkit-box-decoration-break:clone;
  padding:.02em .14em; border-radius:3px;
}

/* ─────────────  PLAYER DE AULA (asset do bloco 2)  ───────────── */

.player{ margin:0; }
.player__screen{
  position:relative; overflow:hidden;
  border-radius:var(--r-lg); background:#000;
  box-shadow:0 44px 90px -38px rgba(0,0,0,1);
  transform:rotate(-1.2deg);
  transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.player:hover .player__screen{ transform:rotate(0) scale(1.015); }
.player__screen img{ width:100%; height:auto; display:block; }
.player__screen::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.45) 100%);
}
.player__live{
  position:absolute; top:14px; left:14px; z-index:2;
  background:#E4344A; color:#FFF;
  font-size:11.5px; font-weight:800; letter-spacing:.14em;
  padding:6px 12px; border-radius:100px;
  animation:pulse 2.4s ease-in-out infinite;
}
.player__play{
  position:absolute; top:50%; left:50%; z-index:2;
  transform:translate(-50%,-50%);
  width:72px; height:72px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
  box-shadow:0 0 0 10px rgba(218,119,86,.18), 0 22px 50px -12px rgba(201,100,66,.7);
}
.player__play svg{ margin-left:4px; }
.player__bar{
  position:absolute; left:16px; right:78px; bottom:18px; z-index:2;
  height:4px; border-radius:100px; background:rgba(255,255,255,.28);
}
.player__elapsed{
  display:block; width:62%; height:100%; border-radius:100px;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  position:relative;
}
.player__elapsed::after{
  content:""; position:absolute; right:-5px; top:50%; transform:translateY(-50%);
  width:11px; height:11px; border-radius:50%; background:#FFF;
}
.player__time{
  position:absolute; right:16px; bottom:11px; z-index:2;
  font-size:11px; font-weight:600; color:#FFF; letter-spacing:.04em;
}

/* ─────────────  LEQUE DE MOLDURAS (bloco 3)  ───────────── */

.fan{
  position:relative; display:flex; justify-content:center; align-items:center;
}
.fan .polaroid{ max-width:200px; }
.fan__1{ transform:rotate(-7deg) translate(26px, 12px); z-index:1; }
.fan__2{ transform:rotate(1.5deg) translateY(-10px); z-index:2; max-width:216px !important; }
.fan__3{ transform:rotate(7deg) translate(-26px, 14px); z-index:1; }
.fan .polaroid:hover{ transform:rotate(0) scale(1.06); z-index:4; }

/* ─────────────  BIG IDEA: texto + player  ───────────── */

.bigidea{
  display:grid; grid-template-columns:1.1fr .9fr; gap:64px;
  align-items:center; margin-bottom:72px;
}


/* multiplicador: copy + cards à esquerda, polaroid à direita */
.multi{ display:grid; grid-template-columns:1.15fr .85fr; gap:64px; align-items:center; }
.multi .section__lead{ margin-bottom:40px; }
.cards--2col{ grid-template-columns:repeat(2,1fr); }

/* ícone de linha nos cards de desejo */
.card__ico{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; margin-bottom:18px;
  background:var(--box-green); border-radius:50%;
  color:#DA7756;
}

/* ─────────────  FAIXA DE AUTORIDADE  ───────────── */

.authority{ display:flex; gap:0; margin:36px 0 30px; border-top:1px solid var(--hair); padding-top:26px; }
.authority div{ flex:1; display:flex; flex-direction:column; gap:4px; padding-right:20px; }
.authority div + div{ border-left:1px solid var(--hair); padding-left:20px; }
.authority strong{ font-family:var(--display); font-weight:200; font-size:32px; color:var(--white); line-height:1; }
.authority span{ font-size:11.5px; color:var(--dim); line-height:1.4; }


/* ─────────────  GARANTIA (selo giratório)  ───────────── */

.guarantee{
  display:grid; grid-template-columns:340px 1fr; gap:56px; align-items:center;
  border-radius:var(--r-lg);
  background:var(--box-green);
  padding:60px 56px;
  box-shadow:0 40px 90px -40px rgba(46,20,12,.9);
}
.guarantee .hl{
  background:linear-gradient(104deg, rgba(218,119,86,0) 0%, rgba(218,119,86,.45) 4%, rgba(218,119,86,.35) 96%, rgba(218,119,86,0) 100%);
}
.seal{ position:relative; display:flex; justify-content:center; }
.seal::before{
  content:""; position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  width:120%; height:120%; border-radius:50%;
  background:radial-gradient(circle, rgba(218,119,86,.22), transparent 65%);
  filter:blur(30px);
}
.seal svg{ position:relative; width:100%; max-width:330px; height:auto; }
.seal__spin{
  transform-origin:150px 150px;
  animation:seal-spin 26s linear infinite;
}
@keyframes seal-spin{ to{ transform:rotate(360deg); } }
.guarantee__copy .h2{ margin-bottom:20px; }
.guarantee__copy p{
  margin:0 0 16px; max-width:52ch;
  font-size:16px; line-height:1.8; color:#F3DCCE;
}
.guarantee__copy p strong{ color:var(--white); font-weight:600; }
.guarantee__note{ font-size:13.5px !important; color:#D3A48B !important; margin-bottom:0 !important; }

/* ─────────────  CARDS  ───────────── */

.cards{ display:grid; gap:20px; }

.card{
  background:var(--surface);
  border-radius:var(--r-md); padding:34px 30px 32px;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), background .35s ease;
}
.card:hover{ transform:translateY(-4px); background:var(--surface-2); }
.card p{ margin:0; font-size:14.5px; line-height:1.72; color:var(--muted); }
.card--mini{ padding:28px 26px; }
.card--mini h3{ font-size:16.5px; }
.card--mini p{ font-size:13.8px; }
.card--mini strong{ color:var(--white); }

/* ─────────────  MÓDULOS (aulas com thumbnail)  ───────────── */

.modules{ display:flex; flex-direction:column; border-top:1px solid var(--hair); }
.module{
  display:grid; grid-template-columns:320px 1fr; gap:34px;
  padding:44px 0; border-bottom:1px solid var(--hair);
  transition:background .35s ease;
}
.module:hover{ background:rgba(255,255,255,.016); }

.module__thumb{
  position:relative; margin:0; align-self:start;
  border-radius:var(--r-md); overflow:hidden;
  box-shadow:0 26px 60px -28px rgba(0,0,0,.95);
  transform:rotate(-1.2deg);
  transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.module:nth-child(even) .module__thumb{ transform:rotate(1.2deg); }
.module:hover .module__thumb{ transform:rotate(0) scale(1.02); }
.module__thumb img{ width:100%; height:auto; display:block; }
.module__thumb span{
  position:absolute; top:10px; left:10px;
  font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:#2A130B; background:linear-gradient(60deg,#C25E3D,#DA7756);
  padding:5px 10px; border-radius:100px;
}
.module h3{ font-family:var(--display); font-weight:300; font-size:clamp(23px,2.4vw,30px); margin-bottom:14px; }
.module p{ margin:0 0 22px; font-size:15.5px; line-height:1.78; color:var(--muted); max-width:64ch; }

.ticks{ display:flex; flex-direction:column; gap:10px; }
.ticks li{
  position:relative; padding-left:26px; font-size:14px; color:var(--dim); line-height:1.6;
}
.ticks li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:12px; height:7px; border-left:1.5px solid #DA7756; border-bottom:1.5px solid #DA7756;
  transform:rotate(-45deg);
}

/* emoji nos títulos dos painéis */
.panel__emoji{ font-size:20px; line-height:1; }

/* ─────────────  PARA QUEM  ───────────── */

.fortwo{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.panel{
  border-radius:var(--r-md); padding:38px 34px;
  background:var(--surface);
}
.panel--before{ background:#161616; }
.panel--after{ background:var(--box-green); }
.panel h3{ display:flex; align-items:center; gap:12px; font-size:17px; margin-bottom:24px; }
/* itens em pílula com bolinha numerada, como na referência */
.panel ul{ display:flex; flex-direction:column; gap:10px; counter-reset:pitem; }
.panel li{
  counter-increment:pitem;
  display:flex; align-items:center; gap:12px;
  font-size:14px; line-height:1.5; color:var(--muted);
  background:var(--surface-2); border-radius:100px;
  padding:10px 18px 10px 10px;
}
.panel--after li{ background:var(--box-green-2); color:#F7E6DC; }
.panel li::before{
  content:counter(pitem, decimal-leading-zero);
  flex:0 0 26px; height:26px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:10px; font-weight:800; letter-spacing:.04em;
  background:#2E2E2E; color:var(--dim);
}
.panel--after li::before{
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
}
/* ── modo VERSUS: verde contra vermelho, ícones preenchidos ── */
.fortwo--vs{ position:relative; gap:8px; }
.fortwo--vs::after{
  content:"VS";
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) rotate(-6deg);
  width:76px; height:76px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-style:italic; font-weight:500; font-size:26px;
  color:var(--white); background:#0F0F0F;
  background:#232323;
  box-shadow:0 0 0 8px var(--bg), 0 20px 44px -12px rgba(0,0,0,1);
  z-index:3;
}

.panel--yes{ background:var(--box-green); }
.panel--yes h3{ color:#FFB08A; }
.panel--yes li{ background:var(--box-green-2); color:#F7E6DC; }
.panel--yes li::before{
  content:"✓"; font-size:13px;
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
}

.panel--no{ background:var(--box-red); }
.panel--no h3{ color:#FF8A93; }
.panel--no li{ background:var(--box-red-2); color:#F2D7DA; }
.panel--no li::before{
  content:"✕"; font-size:12px;
  background:linear-gradient(60deg,#D93A4A,#FF6B77); color:#FFF;
}

/* ─────────────  OFERTA  ───────────── */

.offer{
  position:relative; max-width:648px; margin:34px auto 0;
  border:2px solid transparent; border-radius:var(--r-lg);
  /* borda em gradiente verde→violeta: o box mais vivo da página inteira */
  background:
    linear-gradient(180deg,#1F1F1F,#141414) padding-box,
    linear-gradient(130deg,#C25E3D 0%,#DA7756 45%,#8C6EDC 100%) border-box;
  padding:52px 42px 38px;
  box-shadow:
    0 0 110px -30px rgba(218,119,86,.5),
    0 30px 70px -30px rgba(140,110,220,.35),
    0 60px 120px -50px rgba(0,0,0,1);
}
.offer__glow{
  position:absolute; top:-120px; left:50%; transform:translateX(-50%);
  width:460px; height:260px; border-radius:50%;
  background:radial-gradient(circle, rgba(218,119,86,.28), transparent 70%);
  filter:blur(60px); pointer-events:none;
}
.offer__head{ position:relative; text-align:center; padding-bottom:26px; border-bottom:1px solid var(--hair); }
.offer__logo{
  display:block; margin:4px auto 20px;
  width:min(230px, 70%); height:auto; opacity:.97;
}
.offer__bar{
  display:inline-flex; align-items:center; justify-content:center; gap:9px; flex-wrap:wrap;
  font-size:11.5px; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  color:var(--muted); background:#262626; border-radius:100px;
  padding:9px 18px; max-width:100%;
}
.offer__bar strong{ color:var(--white); }
.offer__bar [data-fill]{ color:var(--white); font-weight:700; }


.offer__price{ text-align:center; padding:26px 0 24px; }
.offer__from{ display:block; font-size:13px; color:var(--dim); margin-bottom:6px; }
.offer__from s{ color:var(--faint); }
.offer__value{ display:flex; align-items:center; justify-content:center; gap:12px; }
.offer__pre{
  display:flex; flex-direction:column; align-items:flex-end; gap:5px;
}
.offer__pre em{ font-style:normal; font-weight:800; font-size:30px; color:var(--white); line-height:1; }
.offer__pre i{ font-style:normal; font-weight:700; font-size:27px; color:var(--white); line-height:1; }
.offer__value strong{
  font-family:var(--sans); font-weight:600;
  font-size:clamp(88px, 8vw, 118px); color:var(--white);
  line-height:.92; letter-spacing:-.02em;
}
.offer__value sup{
  align-self:center; margin-top:-30px;
  font-size:32px; font-weight:800; color:var(--white); line-height:1;
}
.offer__parcel{
  display:block; margin-top:10px; font-size:20px; font-weight:700; color:#DA7756;
}
.offer__cash{ display:block; margin-top:5px; font-size:13.5px; color:var(--dim); }
.offer__cash strong{ color:var(--white); font-weight:600; }


.dates{
  display:grid; grid-template-columns:repeat(4,1fr); gap:10px;
  max-width:820px; margin:52px auto 0;
}
.dates div{ background:var(--surface); border-radius:var(--r-md); padding:22px 20px; display:flex; flex-direction:column; gap:5px; }
.dates span{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--faint); font-weight:600; }
.dates strong{ font-size:14px; color:var(--white); font-weight:600; }

/* ─────────────  BLOCO DE AUTORIDADE (Annie)  ───────────── */

.authority-block{
  display:grid; grid-template-columns:1.2fr .8fr; gap:72px; align-items:center;
}
.authority-block .portrait--authority{ order:2; }
.portrait--authority{ max-width:420px; width:100%; position:relative; }
.portrait--authority::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:#B55535; mix-blend-mode:color; opacity:.26;
  border-radius:var(--r-md); pointer-events:none;
}

/* ─────────────  POLAROIDS  ───────────── */

.polaroid{
  margin:0; background:#F6F4EF; padding:10px 10px 14px;
  border-radius:3px;
  box-shadow:0 24px 50px -18px rgba(0,0,0,.9);
  max-width:230px;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), z-index 0s;
}
.polaroid img{ width:100%; height:auto; display:block; }
.polaroid:hover{ transform:rotate(0) scale(1.02); }

/* ─────────────  FAQ  ───────────── */

.faq{ border-top:1px solid var(--hair); }
.faq details{ border-bottom:1px solid var(--hair); }
.faq summary{
  list-style:none; cursor:pointer; padding:24px 44px 24px 0; position:relative;
  font-size:16px; font-weight:500; color:var(--white); transition:color .25s ease;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; position:absolute; right:6px; top:50%; width:11px; height:11px;
  border-right:1.5px solid var(--dim); border-bottom:1.5px solid var(--dim);
  transform:translateY(-70%) rotate(45deg); transition:transform .3s ease, border-color .3s ease;
}
.faq details[open] summary::after{ transform:translateY(-30%) rotate(-135deg); border-color:var(--white); }
.faq summary:hover{ color:var(--muted); }
.faq p{ margin:0; padding:0 40px 26px 0; font-size:14.8px; line-height:1.8; color:var(--muted); }
.faq p strong{ color:var(--white); }

/* ─────────────  CTA FINAL  ───────────── */

.final{
  position:relative; z-index:2; padding:130px 0;
  border-top:1px solid var(--hair);
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent 60%);
}
.final__inner{ text-align:center; max-width:760px; margin:0 auto; }
.final .lead{ margin:0 auto 40px; }
.final__cta{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.final__cta .btn{ width:auto; min-width:300px; }
.final__date{ font-size:13px; color:var(--dim); }
.final__date strong{ color:var(--white); font-weight:600; }

/* ─────────────  FOOTER  ───────────── */

.footer{ position:relative; z-index:2; border-top:1px solid var(--hair); padding:52px 0 60px; }
.footer__inner{ display:flex; flex-direction:column; align-items:center; gap:24px; text-align:center; }
.footer__legal{ margin:0; font-size:12.5px; line-height:1.9; color:var(--dim); max-width:60ch; }

/* ─────────────  STICKY CTA (mobile)  ───────────── */



/* ─────────────  REVEAL  ───────────── */

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}


/* ─────────────  BARRA DE INGRESSOS (hero)  ───────────── */

.tickets{ width:100%; max-width:420px; margin-top:16px; }
.tickets--offer{ max-width:none; margin-top:16px; }
.tickets--offer .tickets__last{
  display:inline-block; margin-left:6px; padding:3px 9px; border-radius:99px;
  background:var(--box-red); color:#F08A9B;
  font-size:10px; font-weight:800; letter-spacing:.08em; white-space:nowrap;
  animation:pulse 2.4s ease-in-out infinite;
}
.tickets__label{ text-align:center; font-size:12.5px; }
.tickets__bar{
  height:8px; border-radius:100px; background:#262626; overflow:hidden;
}
.tickets__fill{
  display:block; width:0; height:100%; border-radius:100px;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  box-shadow:0 0 14px rgba(218,119,86,.5);
  transition:width 2.2s cubic-bezier(.14,.86,.22,1);
}
.tickets__last{
  display:inline-block; margin-left:6px; padding:3px 9px; border-radius:99px;
  background:var(--box-red); color:#F08A9B;
  font-size:10px; font-weight:800; letter-spacing:.08em; white-space:nowrap;
  animation:pulse 2.4s ease-in-out infinite;
}
.tickets__label{
  margin:10px 0 0; font-size:13.5px; color:#C9CDD2;
}
.tickets__label s{ color:var(--dim); }
.tickets__label strong{ color:var(--white); font-weight:700; }
.tickets__pct{ font-size:15px; }

.section{ overflow:hidden; }
.section > .wrap{ position:relative; }

/* ─────────────  CHIPS DO HERO (B1)  ───────────── */

.chips{ display:flex; flex-wrap:wrap; gap:8px; margin:26px 0 34px; }
.chips li{
  font-size:12px; font-weight:600; letter-spacing:.04em;
  color:#FFB08A; background:var(--box-green);
  border-radius:100px; padding:7px 14px;
}

/* ─────────────  MANIFESTO (B2)  ───────────── */

#manifesto{
  min-height:78vh; display:flex; align-items:center;
}
.manifesto{
  margin:0 auto; max-width:32ch; text-align:center;
  font-family:var(--display); font-weight:200;
  font-size:clamp(34px, 4.4vw, 62px); line-height:1.2;
  color:var(--white);
}
.manifesto em{ font-style:italic; font-weight:300; }
.manifesto__kicker{
  display:block; margin-bottom:18px;
  font-family:var(--sans); font-size:11.5px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--faint);
}

/* ─────────────  DADOS (B4)  ───────────── */

.cards--dados{ align-items:stretch; }
.cards--dados .card p{ font-size:15px; }
.card__fonte{ display:block; margin-top:10px; font-size:11.5px; color:var(--faint); }

.gimmick{
  background:var(--surface); border-radius:var(--r-md);
  padding:30px 34px;
}
.gimmick__a{ margin:0; font-size:15px; line-height:1.75; color:var(--muted); }
.gimmick__a strong{ color:var(--white); }

.consequencia{
  margin:44px 0 0; text-align:center;
  font-family:var(--display); font-style:italic; font-weight:300;
  font-size:clamp(19px, 2.2vw, 26px); color:var(--muted);
}

.metafora{
  margin:0 auto; max-width:30ch; text-align:center;
  font-family:var(--display); font-weight:300;
  font-size:clamp(20px, 2.3vw, 29px); line-height:1.55;
  color:var(--muted);
}
.metafora strong{ color:var(--white); font-weight:400; }

/* ─────────────  MITO vs VERDADE (B6)  ───────────── */

.mito{ position:relative; margin-top:52px; display:flex; flex-direction:column; gap:16px; }
.mito::after{
  content:"↓"; position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:18px; font-weight:700; color:#2A130B;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  box-shadow:0 0 0 7px var(--bg); z-index:2;
}
.mito__row{
  display:flex; align-items:center; gap:22px;
  border-radius:var(--r-md); padding:28px 34px;
}
.mito__row--mito{ background:var(--box-red); }
.mito__row--verdade{ background:var(--box-green); }
.mito__label{
  flex:0 0 auto; font-size:11.5px; font-weight:800; letter-spacing:.18em;
  text-transform:uppercase; padding:6px 12px; border-radius:100px;
}
.mito__row--mito .mito__label{ background:var(--box-red-2); color:#FF8A93; }
.mito__row--verdade .mito__label{ background:var(--box-green-2); color:#FFB08A; }
.mito__row p{
  margin:0; font-family:var(--display); font-weight:300;
  font-size:clamp(20px, 2.3vw, 28px); line-height:1.4; color:var(--white);
}
.mito__row--mito p{ color:#E8C7CB; text-decoration:line-through; text-decoration-color:rgba(255,138,147,.6); text-decoration-thickness:1px; }


/* ─────────────  PILHA DE ANCORAGEM (B11)  ───────────── */

.stack{ max-width:640px; margin:0 auto 56px; }
.stack__row{
  display:flex; align-items:baseline; justify-content:space-between; gap:18px;
  padding:14px 4px; border-bottom:1px solid var(--hair);
}
.stack__row p{ margin:0; font-size:15px; color:var(--muted); }
.stack__row span{ font-size:14px; color:var(--dim); white-space:nowrap; }
.stack__row s{ text-decoration-color:rgba(193,98,47,.75); text-decoration-thickness:1.5px; }
.stack__total{
  display:flex; align-items:baseline; justify-content:space-between; gap:18px;
  padding:18px 4px 6px;
}
.stack__total p{ margin:0; font-size:15px; font-weight:700; color:var(--white); }
.stack__total span{
  font-family:var(--display); font-weight:300; font-size:26px; color:var(--white);
  text-decoration:line-through; text-decoration-color:rgba(218,119,86,.7); text-decoration-thickness:2px;
}
.stack__note{ margin:14px 0 0; font-size:13.5px; color:var(--dim); text-align:right; }

/* ─────────────  POR QUE TÃO BARATO (B13)  ───────────── */

.cheap{
  background:var(--surface); border-radius:var(--r-lg);
  padding:48px 52px;
}
.cheap .h2{ margin-bottom:28px; }
.cheap__grid{
  display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:22px;
}
.cheap__item{
  background:var(--surface-2); border-radius:var(--r-md);
  padding:26px 26px 24px;
}
.cheap__num{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:30px; margin-bottom:14px;
  font-size:12px; font-weight:800;
  color:#2A130B; background:linear-gradient(60deg,#C25E3D,#DA7756);
  border-radius:50%;
}
.cheap__item h3{ font-size:16.5px; margin-bottom:8px; }
.cheap__item p{ margin:0; font-size:14.5px; line-height:1.7; color:var(--muted); }
.cheap__item p strong{ color:var(--white); font-weight:600; }

/* manifesto: símbolo em stroke se desenhando e girando, marca d'água viva */
#manifesto{ position:relative; overflow:hidden; background:var(--bg); }
.manifesto__mark{
  position:absolute; left:50%; top:50%; z-index:0;
  width:min(560px,80vw); height:auto; opacity:.07;
  transform:translate(-50%,-50%);
  animation:markSpin 90s linear infinite;
}
.manifesto__mark path{
  stroke-dasharray:240; stroke-dashoffset:240;
  animation:markDraw 7s ease-in-out infinite;
}
.manifesto__mark .m2{ animation-delay:.9s; }
.manifesto__mark .m3{ animation-delay:1.8s; }
.manifesto__mark .m4{ animation-delay:2.7s; }
@keyframes markDraw{
  0%{ stroke-dashoffset:240; }
  38%{ stroke-dashoffset:0; }
  72%{ stroke-dashoffset:0; }
  100%{ stroke-dashoffset:-240; }
}
@keyframes markSpin{
  from{ transform:translate(-50%,-50%) rotate(0deg); }
  to{ transform:translate(-50%,-50%) rotate(360deg); }
}
#manifesto .wrap{ position:relative; z-index:1; }
.manifesto__star{
  position:absolute; z-index:0; color:#DA7756; opacity:.14;
  font-size:17px; line-height:1; pointer-events:none;
}
.manifesto__star--a{
  left:16%; top:24%;
  animation:starFloat 14s ease-in-out infinite alternate,
            starTwinkle 9s ease-in-out infinite;
}
.manifesto__star--b{
  right:14%; bottom:20%; font-size:13px;
  animation:starFloat 18s ease-in-out infinite alternate-reverse,
            starTwinkle 11s ease-in-out 3s infinite;
}
@keyframes starFloat{
  from{ transform:translateY(-8px); }
  to{ transform:translateY(10px); }
}
@keyframes starTwinkle{
  0%,86%,100%{ opacity:.14; }
  90%{ opacity:.42; }
  94%{ opacity:.08; }
}
@media (prefers-reduced-motion: reduce){
  .manifesto__mark, .manifesto__mark path, .manifesto__star{ animation:none; }
  .manifesto__mark path{ stroke-dashoffset:0; }
}

/* mockup do ingresso (recorte com alpha, avif + png) */
.mockup-ticket{ display:block; margin:26px auto 0; max-width:780px; }
.mockup-ticket img{
  width:100%; height:auto; display:block;
  filter:drop-shadow(0 34px 60px rgba(0,0,0,.55));
}
.pos-hero__ticket .mockup-ticket{ margin:0; max-width:560px; }
.cred-ticket--img{
  position:relative; display:block; width:min(560px,100%);
  margin:12px auto 40px; background:none; box-shadow:none; transform:none;
}
.cred-ticket--img img{
  width:100%; height:auto; display:block;
  filter:drop-shadow(0 26px 44px rgba(0,0,0,.5));
}

/* ingresso do bloco de preço (variante do ticket das páginas de pós-venda) */
.ticket--cheap{
  max-width:640px; margin:10px auto 0;
  background:var(--surface-2);
  transform:rotate(-1.2deg);
  box-shadow:0 34px 70px -30px rgba(0,0,0,.8);
}
.ticket--cheap::before,
.ticket--cheap::after{ background:var(--surface); }
.ticket--cheap .ticket__main{ padding:26px 30px 28px; gap:20px; }
.ticket--cheap .ticket__main > img{ width:132px; }
.ticket__price{ font-size:25px; font-weight:800; letter-spacing:-.01em; color:#DA7756; }


/* ─────────────  PÓS-VENDA (/obrigado)  ───────────── */

.topbar--static{ position:static; }

/* primeira dobra: copy + CTA do grupo à esquerda, ingresso à direita */
.pos-hero{ padding-top:88px; padding-bottom:36px; }
.pos-hero__grid{
  display:grid; grid-template-columns:1.02fr .98fr;
  gap:64px; align-items:center;
}
.pos-hero__copy .pill{ margin-bottom:26px; }
.pos-title{
  font-family:var(--display); font-weight:200;
  font-size:clamp(44px,4.8vw,68px); line-height:1.06;
  color:var(--white); margin-bottom:20px;
}
.pos-sub{
  font-size:16.5px; line-height:1.7; color:var(--muted);
  max-width:460px; margin-bottom:28px;
}
.pos-sub strong{ color:var(--white); font-weight:600; }
.pos-hero__cta{ width:auto; padding-left:34px; padding-right:34px; }
.pos-hero__note{ margin-top:12px; font-size:12.5px; color:var(--faint); }

.pos-hero__ticket{ display:flex; justify-content:center; }
.ticket{
  position:relative; display:flex; width:100%; max-width:520px;
  background:var(--surface-2); border-radius:20px;
  transform:rotate(2.2deg);
  box-shadow:0 44px 90px -32px rgba(0,0,0,.85);
}
.ticket__main{
  flex:1; padding:34px 34px 38px; display:flex; flex-direction:column; gap:26px;
}
.ticket__main > img{ width:158px; height:auto; }
.ticket__rows{ display:flex; flex-direction:column; gap:16px; }
.ticket__rows div{ display:flex; flex-direction:column; gap:5px; }
.ticket__rows span{
  font-size:10.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--faint);
}
.ticket__rows strong{ font-size:16px; font-weight:600; color:var(--white); white-space:nowrap; }
.ticket__stub{
  flex:0 0 150px; border-left:2px dashed rgba(255,255,255,.16);
  border-radius:0 20px 20px 0; background:var(--box-green);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
}
.ticket__stub .ok{
  width:46px; height:46px; border-radius:50%;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  display:flex; align-items:center; justify-content:center;
}
.ticket__stub em{
  font-style:normal; font-size:11px; font-weight:800;
  letter-spacing:.2em; color:#F0B49B;
}
.ticket__stub--pend{ background:var(--surface); }
.ticket__stub--pend .ok--pend{
  background:var(--surface-2); font-size:19px;
}
.ticket__stub--pend em{ color:var(--faint); }
.ticket::before,
.ticket::after{
  content:""; position:absolute; width:22px; height:22px;
  border-radius:50%; background:var(--bg); right:141px;
}
.ticket::before{ top:-11px; }
.ticket::after{ bottom:-11px; }

.belt--pos{ padding:44px 0 38px; }

/* passos em grid */
.pos-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:36px; }
.pos-step{
  display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  background:var(--surface); border-radius:var(--r-lg); padding:30px 28px 28px;
}
.pos-step--main{ background:var(--box-green); }
.pos-step__num{
  display:flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%;
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
  font-size:15px; font-weight:800;
}
.pos-step h3{ font-family:var(--sans); font-size:18px; font-weight:700; color:var(--white); margin-top:4px; }
.pos-step p{ font-size:14.5px; line-height:1.65; color:var(--muted); margin:0; }
.pos-step--main p{ color:#EED9CD; }
.pos-step p strong{ color:var(--white); font-weight:600; }
.pos-step .btn{ margin-top:auto; }
.pos-step .pos-ghostbtn{ margin-top:auto; }
.pos-step .btn{ padding:14px 22px; font-size:14px; }
.pos-ghostbtn{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13.5px; font-weight:700; color:#F0B49B; text-decoration:none;
  border:1px solid #6B3A28; border-radius:999px; padding:11px 20px;
  transition:background .2s ease;
}
.pos-ghostbtn:hover{ background:var(--box-green); }

/* timeline do dia na faixa clara */
.pos-tl{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:40px; }
.pos-tl figure{
  margin:0; background:#FFFFFF; border-radius:var(--r-md);
  padding:10px 10px 16px;
  box-shadow:0 18px 44px -22px rgba(30,28,20,.25);
}
.pos-tl img{ width:100%; height:auto; display:block; border-radius:10px; }
.pos-tl figcaption{ padding:12px 6px 0; }
.pos-tl .hora{ font-size:11px; font-weight:800; letter-spacing:.1em; color:#A34D2E; }
.pos-tl h3{ font-size:14px; font-weight:600; line-height:1.35; margin-top:4px; }
.pos-tl-note{ margin-top:18px; text-align:center; font-size:13.5px; line-height:1.7; }
.section--paper .pos-tl-note{ color:#7D7A6F; }

.pos-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.pos-grid--3{ grid-template-columns:repeat(3,1fr); }
.pos-card{ background:var(--surface); border-radius:var(--r-lg); padding:30px 28px; }
.pos-card .ico{
  display:flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%;
  background:var(--box-green); font-size:21px; margin-bottom:16px;
}
.pos-card h3{ font-size:16.5px; margin-bottom:8px; color:var(--white); }
.pos-card p{ margin:0; font-size:14px; line-height:1.65; color:var(--muted); }

/* lembretes em cards dentro do box verde */
.pos-remind{ background:var(--box-green); border-radius:var(--r-lg); padding:44px 48px; }
.pos-remind .h2{ margin-bottom:24px; }
.pos-remind ul{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px;
}
.pos-remind li{
  display:flex; flex-direction:column; gap:6px;
  background:var(--box-green-2); border-radius:16px; padding:24px 24px 26px;
  font-size:14px; line-height:1.65; color:#EED9CD;
}
.pos-remind__ico{ font-size:22px; margin-bottom:2px; }
.pos-remind li strong{ color:var(--white); font-size:15.5px; }
.pos-remind a{ color:#DA7756; font-weight:700; }

/* /evento: acesso à sala com player ao vivo */
.pos-access{
  display:grid; grid-template-columns:1.02fr .98fr; gap:56px; align-items:center;
  background:var(--box-green); border-radius:var(--r-lg); padding:48px 52px;
}
.pos-access__txt h2{
  font-family:var(--sans); font-size:24px; font-weight:700;
  color:var(--white); margin-bottom:12px;
}
.pos-access__txt p{ margin:0; font-size:15px; line-height:1.7; color:#EED9CD; }
.pos-access__txt p strong{ color:var(--white); font-weight:700; }
.pos-access__txt .btn--lg{
  width:auto; padding-left:34px; padding-right:34px; margin-top:24px;
}
.pos-access__txt .pos-hero__note{ margin-top:10px; }

/* /evento: cronograma hora a hora */
.pos-sched{ list-style:none; margin:34px 0 0; padding:0; }
.pos-sched li{
  display:flex; gap:26px; align-items:baseline;
  padding:15px 4px; border-bottom:1px solid rgba(22,22,19,.1);
}
.pos-sched li:last-child{ border-bottom:0; }
.pos-sched strong{
  flex-shrink:0; width:64px;
  font-size:13.5px; font-weight:800; letter-spacing:.06em; color:#A34D2E;
}
.pos-sched span{ font-size:15px; line-height:1.65; color:#55544D; }

/* /evento: boas práticas com ícones + leque de molduras */
.pos-max{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:64px; align-items:center;
}
.pos-tips{
  list-style:none; margin:30px 0 0; padding:0;
  display:grid; gap:10px;
}
.pos-tips li{
  display:flex; align-items:center; gap:16px;
  background:var(--surface); border-radius:14px; padding:14px 18px;
  font-size:14.5px; line-height:1.5; color:var(--text);
}
.pos-tips .tip-ico{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:var(--box-green); font-size:17px;
}

.pos-end{ text-align:center; }
.pos-pol{ margin:0 auto 40px; transform:rotate(2.2deg); }
.pos-end__msg{
  font-family:var(--display); font-weight:200;
  font-size:clamp(30px,4.6vw,46px); line-height:1.3; color:var(--white);
  max-width:660px; margin:0 auto; text-wrap:balance;
}
.pos-end__msg em{ font-style:italic; }

@media (max-width:900px){
  .pos-hero{ padding-top:32px; }
  .pos-hero__grid{ grid-template-columns:1fr; gap:44px; }
  .pos-title{ font-size:clamp(40px,11vw,52px); }
  .pos-hero__cta{ width:100%; }
  .ticket{ transform:rotate(1.6deg); }
  .ticket__stub{ flex-basis:104px; }
  .ticket::before, .ticket::after{ right:95px; }
  .pos-steps{ grid-template-columns:1fr; }
  .pos-step .btn{ width:100%; }
  .pos-tl{ grid-template-columns:1fr 1fr; }
  .pos-grid, .pos-grid--3{ grid-template-columns:1fr; }
  .pos-remind{ padding:30px 22px; }
  .pos-remind ul{ grid-template-columns:1fr; }
  .pos-hero{ padding-top:40px; }
  .verdict{ padding:16px 16px 18px; gap:10px; }
  .verdict__ico{ width:36px; height:36px; }
  .verdict__ico svg{ width:16px; height:16px; }
  .verdict__txt strong{ font-size:19px; }
  .verdict__txt span{ font-size:11.5px; }
  .pos-access{ grid-template-columns:1fr; padding:26px 22px 30px; gap:28px; }
  .pos-access__txt .btn--lg{ width:100%; }
  .pos-sched li{ gap:16px; }
  .pos-max{ grid-template-columns:1fr; gap:52px; }
  .pos-max .fan{ margin-top:8px; }
}

/* ─────────────  CREDENCIAMENTO (/credenciamento)  ───────────── */

.cred-body{ min-height:100svh; display:flex; flex-direction:column; }

.cred-top{ padding:22px 0; }
.cred-top__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }
.cred-top__inner > img{ width:104px; height:auto; }
.cred-top__progress{ display:flex; align-items:center; gap:14px; }
.cred-top__progress span#cred-count{
  font-size:12px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--dim); white-space:nowrap;
}
.cred-top__track{
  width:180px; height:5px; border-radius:99px; background:var(--surface-2); overflow:hidden;
}
.cred-top__track span{
  display:block; height:100%; width:0;
  background:linear-gradient(60deg,#C25E3D,#DA7756); border-radius:99px;
  transition:width .4s cubic-bezier(.2,.7,.3,1);
}

.cred-main{
  flex:1; display:flex; align-items:center; justify-content:center;
  padding:24px 20px 40px; position:relative; z-index:2;
}
.cred-stage{ width:min(640px,100%); }

.cred-screen{
  display:flex; flex-direction:column; align-items:flex-start;
  opacity:1; transform:translateY(0);
  transition:opacity .24s ease, transform .24s cubic-bezier(.2,.7,.3,1);
}
.cred-screen.is-entering{ opacity:0; transform:translateY(22px); }
.cred-screen.is-entering-back{ opacity:0; transform:translateY(-22px); }
@media (prefers-reduced-motion: reduce){
  .cred-screen{ transition:none; }
}

.cred-title{
  font-family:var(--display); font-weight:200;
  font-size:clamp(34px,4.6vw,52px); line-height:1.14;
  color:var(--white); margin:20px 0 16px; text-wrap:balance;
}
.cred-sub{
  font-size:16.5px; line-height:1.7; color:var(--muted);
  max-width:540px; margin-bottom:28px;
}
.cred-sub strong{ color:var(--white); font-weight:600; }
.cred-resume{
  font-size:13px; font-weight:700; color:#F0B49B; margin:-14px 0 22px;
}
.cred-cta{ width:auto; padding-left:34px; padding-right:34px; }

.cred-q{
  font-family:var(--display); font-weight:300;
  font-size:clamp(26px,3.4vw,38px); line-height:1.24;
  color:var(--white); margin-bottom:10px; text-wrap:balance;
}
.cred-apoio{ font-size:14.5px; line-height:1.65; color:var(--dim); margin-bottom:26px; }
.cred-q + .cred-ops, .cred-q + .cred-valor, .cred-q + .cred-texto{ margin-top:20px; }

.cred-ops{ width:100%; display:flex; flex-direction:column; gap:9px; }
.cred-op{
  display:flex; align-items:center; gap:16px; width:100%;
  background:var(--surface); border:0; border-radius:14px;
  padding:15px 18px; cursor:pointer; text-align:left;
  font-family:var(--sans); font-size:15px; font-weight:500; color:var(--text);
  transition:background .15s ease, transform .15s ease;
}
.cred-op:hover{ background:var(--surface-2); }
.cred-op__letra{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:9px;
  background:var(--box-green); color:#F0B49B;
  font-size:12.5px; font-weight:800;
}
.cred-op__txt{ flex:1; line-height:1.45; }
.cred-op__check{ opacity:0; font-weight:800; color:#DA7756; transition:opacity .15s ease; }
.cred-op.is-on{ background:var(--box-green); color:#FDF1E7; }
.cred-op.is-on .cred-op__letra{ background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B; }
.cred-op.is-on .cred-op__check{ opacity:1; }

.cred-outra{
  width:100%; margin-top:2px; padding:13px 16px;
  font-family:var(--sans); font-size:15px; color:var(--white);
  background:#101010; border:1px solid #2B2B2B; border-radius:12px; outline:none;
}
.cred-outra:focus{ border-color:#C96442; }

.cred-confirm{ margin-top:24px; }

/* badge de pular: canto superior direito da pergunta, com despedida */
.cred-skiprow{ width:100%; display:flex; justify-content:flex-end; margin-bottom:10px; }
.cred-skipbadge{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--surface); border:0; border-radius:999px;
  padding:9px 16px; cursor:pointer;
  font-family:var(--sans); font-size:12.5px; font-weight:700;
  letter-spacing:.02em; color:var(--dim);
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.cred-skipbadge .e{ font-size:15px; line-height:1; }
.cred-skipbadge:hover{
  background:var(--box-green); color:#F0B49B;
  animation:credWiggle .45s ease-in-out;
}
@keyframes credWiggle{
  0%,100%{ transform:rotate(0); }
  25%{ transform:rotate(-3.5deg) scale(1.04); }
  75%{ transform:rotate(3.5deg) scale(1.04); }
}
.cred-skipbadge.is-bye{
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
  transform:scale(1.08); animation:none;
}
@media (prefers-reduced-motion: reduce){
  .cred-skipbadge:hover{ animation:none; }
}

.cred-valor{
  font-family:var(--display); font-weight:300;
  font-size:clamp(38px,5vw,56px); color:var(--white); margin:8px 0 18px;
}
.cred-range{
  width:100%; appearance:none; -webkit-appearance:none; height:6px; border-radius:99px;
  background:linear-gradient(to right, #DA7756 var(--pct,50%), var(--surface-2) var(--pct,50%));
  outline:none;
}
.cred-range::-webkit-slider-thumb{
  appearance:none; -webkit-appearance:none;
  width:28px; height:28px; border-radius:50%; border:0;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  box-shadow:0 0 0 5px rgba(218,119,86,.18), 0 6px 18px rgba(0,0,0,.5);
  cursor:grab;
}
.cred-range::-moz-range-thumb{
  width:28px; height:28px; border-radius:50%; border:0;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  box-shadow:0 0 0 5px rgba(218,119,86,.18), 0 6px 18px rgba(0,0,0,.5);
  cursor:grab;
}
.cred-range__labels{
  width:100%; display:flex; justify-content:space-between;
  margin-top:10px; font-size:12px; font-weight:700; color:var(--faint);
}

.cred-texto{
  width:100%; padding:16px; resize:vertical; min-height:120px;
  font-family:var(--sans); font-size:15px; line-height:1.6; color:var(--white);
  background:#101010; border:1px solid #2B2B2B; border-radius:14px; outline:none;
}
.cred-texto:focus{ border-color:#C96442; }

.cred-label{
  display:block; width:100%; margin-bottom:14px;
  font-size:12.5px; font-weight:600; color:var(--dim);
}
.cred-input{
  display:block; width:100%; margin-top:6px; padding:13px 14px;
  font-family:var(--sans); font-size:15px; font-weight:500; color:var(--white);
  background:#101010; border:1px solid #2B2B2B; border-radius:12px; outline:none;
  transition:border-color .2s ease;
}
.cred-input::placeholder{ color:var(--faint); }
.cred-input:focus{ border-color:#C96442; }
.cred-lgpd{
  display:flex; gap:12px; align-items:flex-start;
  margin:8px 0 4px; font-size:12.5px; line-height:1.6; color:var(--dim);
  cursor:pointer;
}
.cred-lgpd input{ margin-top:3px; accent-color:#C25E3D; width:16px; height:16px; flex-shrink:0; }
.cred-erro{ margin:10px 0 0; font-size:13px; color:#F08A9B; }
.cred-screen .cred-cta{ margin-top:22px; }

.cred-screen--final{ align-items:center; text-align:center; }
.cred-ticket{ position:relative; margin:12px auto 40px; transform:rotate(-1.6deg); }
.cred-stamp{
  position:absolute; top:50%; left:50%; z-index:3;
  transform:translate(-50%,-50%) rotate(-8deg) scale(1);
  padding:10px 22px; border:3px solid #DA7756; border-radius:12px;
  font-family:var(--sans); font-size:22px; font-weight:800; letter-spacing:.08em;
  color:#DA7756; background:rgba(26,14,10,.72); white-space:nowrap;
  animation:stampIn .34s cubic-bezier(.2,1.4,.4,1) both;
}
@keyframes stampIn{
  from{ transform:translate(-50%,-50%) rotate(-8deg) scale(1.7); opacity:0; }
  to{ transform:translate(-50%,-50%) rotate(-8deg) scale(1); opacity:1; }
}
.cred-screen--final .cred-sub{ margin-left:auto; margin-right:auto; }
.cred-alert{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  width:100%; max-width:560px; margin:6px auto 0;
  background:var(--box-green); border-radius:var(--r-lg);
  padding:30px 32px 26px; text-align:center;
}
.cred-alert strong{
  font-size:19px; font-weight:800; color:var(--white); letter-spacing:-.01em;
}
.cred-alert p{
  margin:0; font-size:14.5px; line-height:1.65; color:#EED9CD;
}
.cred-alert p b{ color:var(--white); font-weight:700; }
.cred-alert .cred-cta{ margin-top:10px; width:100%; }
.cred-alert__note{ font-size:12px; color:#C79B84; }
.cred-cta--pulse{ animation:credPulse 1.8s ease-in-out infinite; }
@keyframes credPulse{
  0%,100%{ transform:scale(1); box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 0 0 1px rgba(218,119,86,.35), 0 12px 34px -10px rgba(201,100,66,.55); }
  50%{ transform:scale(1.025); box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 0 0 1px rgba(218,119,86,.6), 0 16px 44px -8px rgba(201,100,66,.75); }
}
@media (prefers-reduced-motion: reduce){
  .cred-cta--pulse{ animation:none; }
}
.cred-nota{ margin-top:22px; font-size:13px; color:var(--faint); }
.cred-nota a{ color:#DA7756; font-weight:700; }

.cred-foot{ padding:18px 0 26px; }
.cred-foot__inner{ display:flex; align-items:center; justify-content:space-between; }
.cred-back{
  background:none; border:0; cursor:pointer;
  font-family:var(--sans); font-size:13.5px; font-weight:700; color:var(--faint);
}
.cred-back:hover{ color:var(--dim); }
.cred-hint{ font-size:12px; color:var(--faint); }

@media (max-width:900px){
  .cred-top__track{ width:96px; }
  .cred-cta{ width:100%; }
  .cred-stamp{ font-size:17px; padding:8px 16px; }
  .cred-ticket{ width:100%; }
}

/* ─────────────  PRÉ-CHECKOUT  ───────────── */

.precheck{
  position:fixed; inset:0; z-index:90;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
.precheck[hidden]{ display:none; }
.precheck__back{
  position:absolute; inset:0;
  background:rgba(20,12,9,.78); backdrop-filter:blur(5px);
}
.precheck__card{
  position:relative; width:min(430px,100%);
  background:var(--surface); border-radius:var(--r-lg);
  padding:34px 30px 26px;
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.precheck__x{
  position:absolute; top:14px; right:14px;
  width:34px; height:34px; border:0; border-radius:50%;
  background:var(--surface-2); color:var(--dim);
  font-size:14px; line-height:1; cursor:pointer;
}
.precheck__x:hover{ color:var(--white); }
.precheck__kicker{
  margin:0 0 4px; font-size:11px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:#DA7756;
}
.precheck__title{
  font-family:var(--display); font-weight:300;
  font-size:30px; margin:0 0 20px; color:var(--white);
}
.precheck label{
  display:block; margin:0 0 14px;
  font-size:12.5px; font-weight:600; color:var(--dim);
}
.precheck input{
  display:block; width:100%; margin-top:6px;
  padding:13px 14px;
  font-family:var(--sans); font-size:15px; font-weight:500;
  color:var(--white); background:#101010;
  border:1px solid #2B2B2B; border-radius:12px; outline:none;
  transition:border-color .2s ease;
}
.precheck input::placeholder{ color:var(--faint); }
.precheck input:focus{ border-color:#C96442; }
.precheck__err{
  display:none; margin:-4px 0 12px;
  font-size:12.5px; color:#F08A9B;
}
.precheck__err.is-on{ display:block; }
.precheck .btn--lg{ margin-top:4px; }
.precheck .btn--lg:disabled{ filter:saturate(.4) brightness(.8); cursor:wait; }
.precheck__note{
  margin:14px 0 0; font-size:12px; line-height:1.6;
  color:var(--faint); text-align:center;
}

/* ═════════════ LAYOUT F2F ═════════════ */

/* ─────────────  TOPBAR (sem links)  ───────────── */

.topbar{ position:absolute; top:0; left:0; right:0; z-index:20; }
.topbar__inner{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.topbar__brand{ display:flex; align-items:center; gap:12px; }
.topbar__brand img{ width:92px; height:auto; opacity:.97; }
.topbar__prof{ display:flex; align-items:center; gap:12px; }
.topbar__prof-txt{ display:flex; flex-direction:column; text-align:right; line-height:1.3; }
.topbar__prof-txt strong{ font-size:13px; font-weight:600; color:var(--white); }
.topbar__prof-txt span{ font-size:10.5px; color:var(--dim); }
.topbar__prof > img{
  width:38px; height:38px; border-radius:50%; object-fit:cover;
  filter:grayscale(1);
}

/* ─────────────  HERO CINEMATOGRÁFICO  ───────────── */

.hero--cine{ position:relative; overflow:hidden; padding:150px 0 110px; }
.hero--cine .hero__copy{ position:relative; z-index:3; max-width:640px; }
.hero--cine .h1--logo{ display:none; }
.hero--cine .hero__headline{
  font-family:var(--display); font-weight:200; letter-spacing:-.015em;
  font-size:clamp(28px, 3.3vw, 47px); line-height:1.22;
  max-width:26ch;
}
.hero--cine .hero__headline em{
  font-size:1em; color:inherit;
}
.hero--cine .hero__headline .hl{
  padding:.02em .1em;
}
/* destaques: bg verde no prazo, itálico na promessa, itálico verde na ferramenta */
.hero--cine .hero__headline em.hl-green{ color:#FFB08A; }

.hero__bg{
  position:absolute; top:0; right:0; bottom:0; margin:0;
  width:52%; z-index:1; pointer-events:none;
}
.hero__bg picture, .hero__bg img{
  width:100%; height:100%; object-fit:cover; object-position:top center;
  filter:grayscale(1) contrast(1.05);
}
/* duotone verde: camada de cor sobre o p&b */
.hero__bg::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:#B55535; mix-blend-mode:color; opacity:.26;
  pointer-events:none;
}
.hero__bg::after{ z-index:2; }
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, var(--bg) 0%, rgba(26,16,11,.55) 34%, rgba(26,16,11,0) 70%),
    linear-gradient(180deg, rgba(26,16,11,.5) 0%, rgba(26,16,11,0) 26%, rgba(26,16,11,0) 62%, var(--bg) 100%);
}
.hero__bg .portrait__tag{ position:absolute; left:auto; right:34px; bottom:158px; z-index:3; pointer-events:auto; }

/* ─────────────  CTA FLUTUANTE (desktop + mobile)  ───────────── */

.sticky-cta{
  position:fixed; z-index:70;
  display:flex; left:50%; right:auto; bottom:18px;
  transform:translate(-50%,140%);
  width:auto; max-width:calc(100vw - 32px);
  align-items:center; gap:24px;
  background:#2C2C2C; border-radius:100px;
  padding:10px 26px 10px 10px;
  box-shadow:0 24px 60px -18px rgba(0,0,0,1), 0 0 0 1px rgba(255,255,255,.07), 0 0 46px -14px rgba(218,119,86,.35);
  transition:transform .4s cubic-bezier(.2,.7,.3,1);
}
.sticky-cta.is-on{ transform:translate(-50%,0); }
.sticky-cta__btn{ border-radius:100px; white-space:nowrap; padding:14px 26px; }
.btn__dot{
  width:11px; height:11px; border-radius:50%;
  background:#2A130B;
  box-shadow:0 0 0 3px rgba(42,19,11,.25);
}
.sticky-cta__progress{ display:flex; flex-direction:column; gap:6px; min-width:250px; }
.sticky-cta__track{
  height:7px; border-radius:100px; background:#161616; overflow:hidden;
}
.sticky-cta__fill{
  display:block; width:0; height:100%; border-radius:100px;
  background:linear-gradient(60deg,#C25E3D,#DA7756);
  transition:width 2.2s cubic-bezier(.14,.86,.22,1);
}
.sticky-cta__progress p{ margin:0; font-size:12.5px; color:#C9CDD2; white-space:nowrap; }
.sticky-cta__progress strong{ color:var(--white); }

/* ─────────────  FAIXAS CLARAS (papel)  ───────────── */

.section--paper{ background:#F2F0EA; }
.section--paper .h2,
.section--paper h3{ color:#161613; }
.section--paper .h2 em{ color:#161613; }
.section--paper .body,
.section--paper .section__lead,
.section--paper p{ color:#55544D; }
.section--paper .consequencia{ color:#3B3A34; }
.section--paper .card{ background:#FFFFFF; box-shadow:0 18px 44px -22px rgba(30,28,20,.25); }
.section--paper .card p{ color:#55544D; }
.section--paper .card p strong{ color:#161613; }
.section--paper .card__fonte{ color:#98958A; }
.section--paper .hl{
  background:linear-gradient(104deg, rgba(194,94,61,0) 0%, rgba(194,94,61,.30) 4%, rgba(194,94,61,.22) 96%, rgba(194,94,61,0) 100%);
}

/* ─────────────  CARD-DESTAQUE COM BARRAS (dados)  ───────────── */

.feature{
  display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:center;
  background:linear-gradient(135deg,#3A1B0E 0%,#48220F 55%,#2E1509 100%);
  border-radius:var(--r-lg); padding:44px 48px; margin-bottom:22px;
  box-shadow:0 34px 80px -34px rgba(46,20,12,.8);
}
.feature__copy h3{ color:#FFFFFF; margin-bottom:12px; }
.feature__copy p{ margin:0; font-size:15px; line-height:1.75; color:#F3DCCE; }
.feature__copy p strong{ color:#FFFFFF; }
.feature__verdict{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.verdict{
  display:flex; flex-direction:column; align-items:flex-start; gap:14px;
  border-radius:16px; padding:20px 22px;
}
.verdict__ico{
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%;
}
.verdict__txt{ display:flex; flex-direction:column; gap:2px; }
.verdict__txt strong{ font-size:23px; font-weight:800; letter-spacing:-.01em; white-space:nowrap; }
.verdict__txt span{ font-size:13px; line-height:1.5; }
.verdict--down{ background:#2B1216; }
.verdict--down .verdict__ico{ background:#3B1B21; color:#F08A9B; }
.verdict--down .verdict__txt strong{ color:#FFFFFF; }
.verdict--down .verdict__txt span{ color:#E0ADB6; }
.verdict--up{ background:linear-gradient(60deg,#C25E3D,#DA7756); }
.verdict--up .verdict__ico{ background:#2A130B; color:#DA7756; }
.verdict--up .verdict__txt strong{ color:#2A130B; }
.verdict--up .verdict__txt span{ color:#3A1C10; font-weight:800; }

/* chat do Claudinho */
.chat{ display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.chat__me{
  align-self:flex-end; max-width:88%;
  margin:0; padding:12px 18px;
  background:linear-gradient(60deg,#C25E3D,#DA7756); color:#2A130B;
  font-size:14.5px; font-weight:600; line-height:1.5;
  border-radius:16px 16px 4px 16px;
}
.chat__ia{
  align-self:flex-start; max-width:92%;
  padding:14px 18px; background:#EFEDE6;
  border-radius:16px 16px 16px 4px;
}
.chat__who{
  display:block; margin-bottom:6px;
  font-size:11px; font-weight:800; letter-spacing:.06em; color:#9C4A2C;
}
.chat__ia p{ margin:0; font-size:14.5px; line-height:1.6; color:#3B3A34; }
.section--paper .gimmick .gimmick__a{ margin:0; font-size:14px; line-height:1.65; }

/* dados: gimmick vira card branco na faixa clara */
.section--paper .gimmick{ background:#FFFFFF; box-shadow:0 18px 44px -22px rgba(30,28,20,.25); }
.section--paper .gimmick__a{ color:#55544D; }
.section--paper .gimmick__a strong{ color:#161613; }

/* ─────────────  PROGRAMA NA FAIXA CLARA  ───────────── */

.section--paper .modules{ border-top:0; gap:18px; }
.section--paper .module{
  background:#FFFFFF; border-radius:var(--r-lg); border-bottom:0;
  padding:34px 36px; box-shadow:0 18px 44px -22px rgba(30,28,20,.22);
  grid-template-columns:88px 300px 1fr;
}
.module__hora{
  font-family:var(--display); font-weight:300;
  font-size:26px; color:#9C4A2C; padding-top:4px;
  border-right:1px solid #E4E1D6; margin-right:6px;
}
/* selo do bloco da manhã, ancorado no canto superior direito do card */
.module--badged{ position:relative; }
.module__badge{
  position:absolute; top:18px; right:20px; z-index:2;
  font-size:12px; font-weight:600; line-height:1;
  color:#A34D2E; background:#FBEADE;
  border-radius:100px; padding:8px 14px;
  white-space:nowrap;
}

/* pausa do almoço no meio da timeline */
.module-break{
  display:flex; justify-content:center; padding:8px 0;
}
.module-break p{
  margin:0; font-size:15px; color:#55544D;
}
.module-break p strong{
  font-family:var(--display); font-weight:400; font-size:19px; color:#9C4A2C;
}
.module-break p span{ margin:0 10px; color:#B5B1A4; }

.timeline__end{
  margin-top:26px; display:flex; flex-direction:column; gap:6px;
  text-align:center;
}
.timeline__end p{ margin:0; font-size:16px; color:#161613 !important; }
.timeline__end p strong{ font-family:var(--display); font-weight:400; font-size:20px; color:#9C4A2C; }
.timeline__end span{ font-size:13.5px; color:#6F6C61; }
.section--paper .module:hover{ background:#FFFFFF; }
.section--paper .ticks li{ color:#55544D; }

/* ─────────────  PREÇO EM 3 COLUNAS  ───────────── */

.pricegrid{
  display:grid; grid-template-columns:.91fr 1.23fr .91fr; gap:44px;
  align-items:center; margin-bottom:52px;
}
.pricegrid .stack{ margin:0; }
.pricegrid .offer{ margin:0; max-width:none; }

/* bullets fora do box: checklist respirando ao lado da oferta */
.offer-bullets{ display:flex; flex-direction:column; gap:16px; }
.offer-bullets li{
  position:relative; padding-left:30px;
  font-size:15px; line-height:1.6; color:var(--muted);
}
.offer-bullets li::before{
  content:""; position:absolute; left:2px; top:.5em;
  width:13px; height:8px;
  border-left:2px solid #DA7756; border-bottom:2px solid #DA7756;
  transform:rotate(-45deg);
}

/* ─────────────  RESPONSIVO  ───────────── */

@media (max-width:1100px){
  .module{ grid-template-columns:240px 1fr; gap:28px; }
  .section--paper .module{ grid-template-columns:70px 220px 1fr; }
  .module__hora{ font-size:21px; }
}

@media (max-width:900px){
  :root{ --pad:24px; }
      .hero__bg .portrait__tag{ padding:10px 14px; }
  .hero__bg .portrait__tag strong{ font-size:16px; }
    .fortwo{ grid-template-columns:1fr; }
  .dates{ grid-template-columns:repeat(2,1fr); }
  .authority-block{ grid-template-columns:1fr; gap:40px; }
  .topbar__prof-txt{ display:none; }
  .topbar__brand img{ width:76px; }
  .hero--cine{ padding:120px 0 60px; }
  .hero__bg{ position:relative; width:100%; height:340px; margin-top:36px; }
  .hero__bg::after{ background:linear-gradient(180deg, rgba(26,16,11,0) 55%, var(--bg) 100%); }
  .hero__bg .portrait__tag{ right:16px; bottom:16px; }
  .feature{ grid-template-columns:1fr; gap:28px; padding:32px 26px; }
  .pricegrid{ grid-template-columns:1fr; gap:32px; }
  .pricegrid .stack{ order:1; }
  .pricegrid .offer{ order:2; }
  .offer-bullets{ order:3; }
  .sticky-cta{ left:12px; right:12px; transform:translateY(140%); max-width:none; gap:14px; padding-right:16px; }
  .sticky-cta.is-on{ transform:translateY(0); }
  .sticky-cta__btn{ padding:13px 18px; font-size:12.5px; }
  .sticky-cta__progress{ min-width:0; flex:1; }
  .sticky-cta__progress p{ font-size:10.5px; white-space:normal; line-height:1.35; }
  .authority-block .portrait--authority{ order:-1; max-width:320px; margin:0 auto; }
  .guarantee{ grid-template-columns:1fr; gap:32px; padding:40px 26px; text-align:center; }
  .cheap__grid{ grid-template-columns:1fr; }
  .cards--dados{ grid-template-columns:1fr; }
  #manifesto{ min-height:56vh; }
  .mito__row{ flex-direction:column; align-items:flex-start; gap:12px; padding:20px 22px; }
  .cheap{ padding:36px 24px; }
  .stack__total span{ font-size:22px; }
  .guarantee__copy p{ margin-left:auto; margin-right:auto; }
  .seal svg{ max-width:230px; }
  .multi{ grid-template-columns:1fr; gap:40px; }
  .multi .fan{ order:-1; }
  .fan .polaroid{ max-width:150px; }
  .fan__2{ max-width:164px !important; }
  .bigidea{ grid-template-columns:1fr; gap:40px; }
  .bigidea .player{ order:-1; }
  .fortwo--vs::after{ display:none; }
  /* blocos mais colados no mobile — os 130px de desktop viram respiro exagerado */
  .section{ padding:56px 0; }
  .section--tight{ padding:44px 0; }
  .final{ padding:64px 0; }
  .hero{ padding:56px 0 48px; }
  .alertbar{ font-size:10px; letter-spacing:.05em; padding:8px 14px; line-height:1.5; }
  .alertbar ~ .topbar{ top:54px; }
  .alertbar ~ .hero{ padding-top:118px; }
    .bg-grid span:nth-child(2),.bg-grid span:nth-child(4){ display:none; }
}

@media (max-width:640px){
  .cards--2col{ grid-template-columns:1fr; }
  .module{ grid-template-columns:1fr; gap:18px; }
  .section--paper .module{ grid-template-columns:1fr; padding:26px 22px; }
  .module__hora{ border-right:0; border-bottom:1px solid #E4E1D6; padding:0 0 8px; margin:0 0 4px; }
  .module__badge{ position:static; display:inline-block; margin-bottom:10px; white-space:normal; line-height:1.4; }
  .module__thumb{ max-width:420px; }
  .belt{ padding:40px 0 34px; }
  .belt--hero{ margin-top:-44px; }
  .hero__cta{ flex-direction:column; align-items:flex-start; gap:20px; }
  .hero__cta .btn{ width:100%; }
  /* as três informações continuam lado a lado no mobile.
     Sem nowrap de propósito: com horário longo ("20h às 22h · Brasília")
     num Android de 360px a soma estoura a largura e a página ganha
     scroll horizontal. Deixando quebrar, a coluna só fica mais alta. */
  .hero__meta{ flex-direction:row; gap:0; }
  .hero__meta li{ padding-right:10px; min-width:0; }
  .hero__meta li + li{ padding-left:10px; }
  .hero__meta span{ font-size:10.5px; letter-spacing:.1em; }
  .pill{ font-size:10px; letter-spacing:.02em; padding:7px 12px; gap:6px; }
  .seg-long{ display:none; }
  .seg-short{ display:inline; }
  .pill__dot{ width:5px; height:5px; }
  .offer__bar{ font-size:10px; letter-spacing:.02em; gap:6px; padding:8px 12px; }
  .hero__meta strong{ font-size:12.5px; overflow-wrap:anywhere; }
  .authority{ gap:0; }
  .authority div{ padding-right:12px; }
  .authority div + div{ padding-left:12px; }
  .authority strong{ font-size:24px; }
  .authority span{ font-size:11px; }
  .guarantee{ padding:38px 22px 34px; }
  .offer{ padding:34px 24px 30px; }
  .offer__value strong{ font-size:88px; }
  .final__cta .btn{ width:100%; min-width:0; }
  .footer{ padding-bottom:120px; }
}

/* ─────────────  CLIENTES (esteira de prova, trazida da LP da imersão)  ───────────── */

.clientes{ position:relative; z-index:2; margin-top:38px; overflow:hidden; }
.clientes::before,
.clientes::after{
  content:""; position:absolute; top:0; bottom:0; width:14%; z-index:3; pointer-events:none;
}
.clientes::before{ left:0; background:linear-gradient(90deg, var(--bg), transparent); }
.clientes::after{ right:0; background:linear-gradient(270deg, var(--bg), transparent); }
.clientes__track{
  display:flex; gap:16px; width:max-content;
  animation:clientesSlide 46s linear infinite;
}
.clientes:hover .clientes__track{ animation-play-state:paused; }
@keyframes clientesSlide{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .clientes__track{ animation:none; }
  .clientes{ overflow-x:auto; }
}
.cliente{
  flex:0 0 268px; margin:0;
  background:var(--surface); border-radius:20px; overflow:hidden;
  display:flex; flex-direction:column;
}
.cliente__foto{
  width:100%; height:300px; object-fit:cover; object-position:50% 22%; display:block;
}
.cliente__ig{ padding:12px; background:var(--surface); }
.cliente__ig img{ width:100%; height:auto; display:block; border-radius:12px; }
@media (max-width:900px){
  .cliente{ flex-basis:212px; }
  .cliente__foto{ height:236px; }
}

/* =========================================================
   TEMA "CLAUDE CONTENT" — pele clara sobre o mesmo esqueleto
   Referência: millenanbg.com.br/claude-content-o-treinamento
   DNA mantido: Playfair 200 itálico, hero cinematográfico escuro,
   alternância de faixas, grão, esteiras, glow.
   O que muda: base creme no lugar do preto, terracota no lugar
   do verde neon e o asterisco do Claude como motivo.
   ========================================================= */

:root{
  --cream:      #FCF7EB;   /* base clara */
  --cream-2:    #FFFBF3;   /* cartões e superfícies claras */
  --sand:       #F2E4CD;   /* faixa de ritmo */
  --clay:       #C1622F;   /* terracota assinatura */
  --clay-soft:  #DA7756;   /* laranja Claude */
  --clay-deep:  #7E3C27;   /* marrom dos blocos escuros */
  --clay-ink:   #3A1B0E;   /* marrom mais profundo */
  --brown:      #2A1A12;   /* títulos no claro */
  --brown-2:    #5C392A;   /* corpo no claro */
}

/* ─────────  SEÇÕES CLARAS: os tokens são redefinidos por escopo,
             então todo componente herda a pele nova sem reescrita  ───────── */

.section:not(.section--paper):not(.section--dark),
.footer{
  --bg:          var(--cream);
  --bg-2:        var(--cream-2);
  --surface:     #FFFFFF;
  --surface-2:   #F7EDDE;
  --hair:        rgba(92,57,42,.14);
  --hair-strong: rgba(92,57,42,.26);
  --tint:        rgba(92,57,42,.05);
  --white:       var(--brown);
  --text:        #4A3527;
  --muted:       #6B5344;
  --dim:         #8A6E5E;
  --faint:       #A08872;
  --box-green:   #F6E3D6;
  --box-green-2: #EFD8C6;
  --box-red:     #F7E2E2;
  --box-red-2:   #F0CFD1;
  background:var(--cream);
  color:var(--text);
}

.section--paper{
  --bg:          var(--sand);
  --bg-2:        #F7EDDE;
  --surface:     #FFFDF8;
  --surface-2:   #F7EDDE;
  --hair:        rgba(92,57,42,.16);
  --hair-strong: rgba(92,57,42,.28);
  --tint:        rgba(92,57,42,.06);
  --white:       var(--brown);
  --text:        #4A3527;
  --muted:       #6B5344;
  --dim:         #8A6E5E;
  --faint:       #A08872;
  --box-green:   #F6E3D6;
  --box-green-2: #EFD8C6;
  background:var(--sand);
  color:var(--text);
}

/* o grão do DNA continua sobre as faixas claras (o overlay global fica
   embaixo do z-index das seções, então cada faixa carrega o seu) */
.section:not(.hero)::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  opacity:.5; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");
}
.section--dark::after{ mix-blend-mode:screen; opacity:.35; }

/* textos que estavam fixos na regra antiga das faixas claras */
.section--paper .h2,
.section--paper h3,
.section--paper .h2 em,
.section--paper .card p strong,
.section--paper .gimmick__a strong{ color:var(--brown); }
.section--paper .body,
.section--paper .section__lead,
.section--paper p,
.section--paper .card p,
.section--paper .gimmick__a,
.section--paper .ticks li{ color:var(--brown-2); }
.section--paper .consequencia{ color:var(--brown); }
.section--paper .card,
.section--paper .gimmick,
.section--paper .module:hover{ background:#FFFDF8; box-shadow:0 18px 44px -22px rgba(92,57,42,.28); }
.section--paper .card__fonte{ color:#9C8674; }

/* marca-texto: no claro pede tinta mais presente que no escuro */
.section:not(.section--dark) .hl,
.section--paper .hl{
  background:linear-gradient(104deg, rgba(218,119,86,0) 0%, rgba(218,119,86,.42) 4%, rgba(218,119,86,.34) 96%, rgba(218,119,86,0) 100%);
}
.section:not(.section--dark) .h2 em.hl,
.section:not(.section--dark) em.hl{ color:var(--brown); }
.section:not(.section--dark) .hl-green{ color:var(--clay); font-style:italic; }

/* cartões: no claro a sombra substitui o contraste de superfície */
.section:not(.section--dark) .card,
.section:not(.section--dark) .gimmick{
  background:#FFFFFF;
  box-shadow:0 18px 44px -24px rgba(92,57,42,.3);
}
.section:not(.section--dark) .card:hover{ background:#FFFFFF; box-shadow:0 26px 56px -26px rgba(92,57,42,.4); }

/* painéis (para quem / versus) */
.section:not(.section--dark) .panel--before{ background:#F0E6D6; }
.section:not(.section--dark) .panel--after li,
.section:not(.section--dark) .panel--yes li{ color:var(--brown-2); }
.section:not(.section--dark) .panel--yes h3{ color:#A8461F; }
.section:not(.section--dark) .panel--no h3{ color:#A9414B; }
.section:not(.section--dark) .panel--no li{ color:#6B4046; }
.section:not(.section--dark) .panel li::before{ background:#E6D6C2; color:#7A5F4C; }
.section:not(.section--dark) .panel--after li::before,
.section:not(.section--dark) .panel--yes li::before{
  background:linear-gradient(60deg,var(--clay),var(--clay-soft)); color:#FFF6EE;
}
.fortwo--vs::after{
  color:#FBEFE2 !important; background:var(--clay-deep) !important;
  box-shadow:0 0 0 8px var(--cream), 0 20px 44px -12px rgba(92,57,42,.5) !important;
}

/* mito x verdade */
.section:not(.section--dark) .mito__row--mito{ background:#F7E2E2; color:#6B4046; }
.section:not(.section--dark) .mito__row--verdade{ background:#F6E3D6; color:var(--brown-2); }
.section:not(.section--dark) .mito__label{ color:var(--clay); }

/* pilha de ancoragem e números */
.section:not(.section--dark) .stack__row,
.section:not(.section--dark) .stack__total{ border-color:var(--hair); }

.section:not(.section--dark) .metafora{ background:#F6E3D6; color:var(--brown-2); }

/* faixa de topo e esteiras na cor da referência */
.alertbar{ background:var(--clay); color:#FFF6EC; }
.marquee--green{ background:var(--clay); color:#FFF6EC; }
.marquee--dark{ background:var(--clay-ink); color:#F3DCCE; }

/* ─────────  BLOCOS ESCUROS PROPOSITAIS (ritmo do DNA)  ───────── */

.section--dark{
  /* o --bg local também precisa mudar: regras por id (#manifesto) leem o token */
  --bg:          var(--clay-deep);
  --bg-2:        #8E4830;
  --surface:     #8E4830;
  --hair:        rgba(255,255,255,.14);
  --hair-strong: rgba(255,255,255,.24);
  --white:       #FFF6EC;
  --text:        #F3DCCE;
  --muted:       #EDCDB8;
  --dim:         #E0B79E;
  --faint:       #D3A48B;
  background:var(--clay-deep);
  color:#FBEFE2;
}
.section--dark .manifesto,
.section--dark .h2,
.section--dark h3{ color:#FFF6EC; }
.section--dark .manifesto__kicker{ color:#EDBFA6; }
.section--dark .hl{
  background:linear-gradient(104deg, rgba(255,176,138,0) 0%, rgba(255,176,138,.34) 4%, rgba(255,176,138,.26) 96%, rgba(255,176,138,0) 100%);
}
.final{ background:var(--clay-deep); color:#FBEFE2; }
.final .h2, .final h2{ color:#FFF6EC; }
.final__date{ color:#E8C3AC; }

/* garantia e oferta seguem escuras dentro da página clara: são as duas
   âncoras de peso, como o bloco marrom da referência */
.guarantee{ background:var(--clay-deep); color:#FBEFE2; }
.guarantee .h2, .guarantee h3{ color:#FFF6EC; }
.guarantee__copy p{ color:#F3DCCE; }
.guarantee__copy p strong{ color:#FFF6EC; }
.guarantee__note{ color:#E0B79E !important; }
.offer{
  background:
    linear-gradient(180deg,#4A2413,#331708) padding-box,
    linear-gradient(130deg,var(--clay) 0%,var(--clay-soft) 45%,#8C6EDC 100%) border-box;
  color:#FBEFE2;
  box-shadow:
    0 0 110px -30px rgba(218,119,86,.42),
    0 30px 70px -30px rgba(140,110,220,.28),
    0 60px 120px -50px rgba(92,57,42,.55);
}
.offer .offer__pre,
.offer strong,
.offer .h2{ color:#FFF6EC; }
.offer__from, .offer__cash, .offer__parcel{ color:#E8C3AC; }
.offer__head{ border-color:rgba(255,255,255,.16); }

/* rodapé claro */
.footer{ background:var(--cream); border-top:1px solid rgba(92,57,42,.16); }
.footer__legal{ color:#8A6E5E; }

/* ─────────  ASTERISCO DO CLAUDE (motivo da referência)  ───────── */

.ast{
  display:inline-block; width:1em; height:1em; vertical-align:-.12em;
  background:currentColor;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
}

/* substitui o ✦ das esteiras */
.marquee i{ font-size:0 !important; }
.marquee i::before{
  content:""; display:inline-block; width:.62em; height:.62em;
  font-size:15px; background:currentColor; opacity:.85;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
}

/* bullets das listas do hero e do programa */
.chips li{ position:relative; }

/* marca d'água gigante atrás do hero, como na referência */
.hero::after{
  content:""; position:absolute; z-index:0; pointer-events:none;
  right:26%; top:6%; width:min(52vw,720px); aspect-ratio:1;
  background:var(--clay-soft); opacity:.05;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
  animation:ast-turn 90s linear infinite;
}
@keyframes ast-turn{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .hero::after{ animation:none; } }


/* estrelas do manifesto viram asteriscos */
.manifesto__star{ font-size:0 !important; }
.manifesto__star::before{
  content:""; display:block; width:18px; height:18px;
  background:currentColor;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
}

/* ─────────  GRADE DE FUNDO  ─────────
   As faixas claras têm fundo sólido e tapavam a grade fixa do body. Ela volta
   por cima delas, em marrom, com multiply: sobre o creme escurece e aparece;
   sobre o hero escuro o multiply zera, e por isso o hero ganha a sua própria
   grade (clara) logo abaixo. */
/* a grade fixa do body não serve mais: com fundo sólido nas faixas ela ou
   fica escondida atrás, ou passa por cima das fotos. Cada seção desenha a sua,
   entre o fundo e o conteúdo (o .wrap já sobe em z-index 2). As posições são
   proporcionais ao container, então acompanham o mesmo eixo do layout. */
.bg-grid, .bg-glow, .bg-noise{ opacity:0; }

.section::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:repeating-linear-gradient(90deg,
    transparent 0 3.22%,
    var(--linha) 3.22% calc(3.22% + 1px),
    transparent calc(3.22% + 1px) 26.61%);
  background-size:min(100%, var(--maxw)) 100%;
  background-position:center top;
  background-repeat:no-repeat;
}
.section:not(.section--paper):not(.section--dark),
.section--paper{ --linha:rgba(92,57,42,.16); }
.section--dark{ --linha:rgba(255,255,255,.10); }

.bg-grid--hero{
  position:absolute; inset:0; z-index:1;
  mix-blend-mode:normal; max-width:var(--maxw); margin:0 auto;
}
.bg-grid--hero span{
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.07) 10%,rgba(255,255,255,.07) 90%,transparent);
}

/* seleção de texto na pele nova */
::selection{ background:var(--clay-soft); color:#2A130B; }

/* ─────────  ÂNCORAS ESCURAS DENTRO DAS FAIXAS CLARAS  ─────────
   feature, oferta e garantia continuam escuras de propósito (é o bloco
   marrom da referência). Elas precisam do escopo de tokens escuro, senão
   herdam o token claro da seção e o texto some no próprio fundo. */

.feature, .offer, .guarantee, .mockup-ticket{
  --white:       #FFF6EC;
  --text:        #F3DCCE;
  --muted:       #EDCDB8;
  --dim:         #E0B79E;
  --faint:       #D3A48B;
  --hair:        rgba(255,255,255,.16);
  --hair-strong: rgba(255,255,255,.28);
  --surface:     #8E4830;
  --surface-2:   #A2553A;
  color:var(--text);
}

/* as regras genéricas da faixa clara empatam em especificidade com as do
   componente, então aqui a disputa é resolvida com seletor mais longo */
.section--paper .feature__copy h3,
.section--paper .feature h3,
.section:not(.section--dark) .offer .h2{ color:#FFF6EC; }
.section--paper .feature__copy p,
.section--paper .feature p{ color:#F3DCCE; }
.section--paper .feature__copy p strong,
.section--paper .feature p strong{ color:#FFF6EC; }

/* pílula de data dentro do card de oferta */
.offer .pill{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18); }
.offer .pill__seg{ color:#F3DCCE; }
.offer .pill__seg strong{ color:#FFF6EC; }
.offer .pill__sep{ color:#C08C72; }

/* lista de entregas ao lado da oferta segue na faixa clara */
.section:not(.section--dark) .ticks li{ color:#5C392A; }
.section:not(.section--dark) .ticks li::before{ color:var(--clay); }

/* rodapé: o cinza herdado ficava abaixo do mínimo de contraste */
.footer__legal{ color:#6B5344; }

/* CTA flutuante: cinza-chumbo destoava da pele nova, vai pro marrom da marca */
.sticky-cta{
  background:var(--clay-deep);
  box-shadow:
    0 24px 60px -18px rgba(58,27,14,.55),
    0 0 0 1px rgba(255,255,255,.10),
    0 0 46px -14px rgba(218,119,86,.4);
}
.sticky-cta__progress p{ color:#F3DCCE; }
.sticky-cta__progress strong{ color:#FFF6EC; }

/* topbar das páginas pós-venda: elas não têm hero escuro atrás, então o
   logo branco e o nome sumiam no creme */
.topbar--static .topbar__brand img{ filter:brightness(0) saturate(0); opacity:.9; }
.topbar--static .topbar__prof-txt strong{ color:var(--brown); }
.topbar--static .topbar__prof-txt span{ color:#6E5748; }
.topbar--static .topbar__prof img{ border-color:rgba(92,57,42,.2); }

/* ─────────  CORREÇÕES DE LEGIBILIDADE NA PELE CLARA  ─────────
   Componentes desenhados para o fundo preto traziam texto claro. Na faixa
   creme eles sumiam no próprio fundo. */

/* mito x verdade: o texto do mito era rosa-claro sobre rosa-claro */
.section:not(.section--dark) .mito__row p{ color:var(--brown); }
.section:not(.section--dark) .mito__row--mito p{
  color:#8C5560;
  text-decoration-color:rgba(140,85,96,.55);
}
.section:not(.section--dark) .mito__row--mito .mito__label{ background:#F0CFD1; color:#A9414B; }
.section:not(.section--dark) .mito__row--verdade .mito__label{ background:#EFD8C6; color:#A8461F; }

/* garantia: card escuro dentro de faixa clara, o marca-texto tinha que voltar
   a ser o claro (a regra da faixa clara o tinha capturado) */
.guarantee .hl{
  background:linear-gradient(104deg, rgba(255,176,138,0) 0%, rgba(255,176,138,.34) 4%, rgba(255,176,138,.26) 96%, rgba(255,176,138,0) 100%);
  color:#FFF6EC;
}
.guarantee .h2 em{ color:#FFF6EC; }

/* "ao vivo": o vermelho puro brigava com o terracota, foi só esquentado */
.player__live{ background:#D8433A; }

/* a grade fica densa demais na tela estreita: 5 colunas viram 3 */
@media (max-width:900px){
  .section::before{
    background-image:repeating-linear-gradient(90deg,
      transparent 0 3.22%,
      var(--linha) 3.22% calc(3.22% + 1px),
      transparent calc(3.22% + 1px) 48.39%);
  }
}

/* o rodapé não é .section e ficava sem grade, cortando a linha no fim da página */
.footer{ position:relative; --linha:rgba(92,57,42,.16); }
.footer::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:repeating-linear-gradient(90deg,
    transparent 0 3.22%,
    var(--linha) 3.22% calc(3.22% + 1px),
    transparent calc(3.22% + 1px) 26.61%);
  background-size:min(100%, var(--maxw)) 100%;
  background-position:center top;
  background-repeat:no-repeat;
}

/* o em.hl das faixas claras é um seletor longo e vencia dentro das âncoras
   escuras: aqui a cor do texto marcado volta pro claro nelas */
.section :is(.guarantee, .offer, .feature) .h2 em.hl,
.section :is(.guarantee, .offer, .feature) em.hl{ color:#FFF6EC; }

/* ─────────  AJUSTE FINO DE CONTRASTE  ─────────
   Os tons apagados vieram do tema escuro, onde cinza claro sobre preto rende
   muito. Sobre o creme eles caíam abaixo do mínimo de leitura (4.5:1 para
   texto pequeno). Escurecidos aqui, na origem, em vez de caso a caso. */

.section:not(.section--paper):not(.section--dark),
.section--paper,
.footer{
  --dim:   #6E5748;
  --faint: #7F6553;
}
.section--paper .card__fonte,
.section:not(.section--dark) .card__fonte{ color:#7D6857; }

/* faixa do topo e esteira: o terracota puro não sustentava nem texto branco
   nem texto escuro, então cada uma foi para o lado que dá leitura */
.alertbar{ background:#B85B2C; color:#FFFFFF; }
.marquee--green{ background:#C96A38; color:#2A130B; }

/* badge "ao vivo" do player */
.player__live{ background:#C9322B; }

/* balão do chat: fica dentro da faixa clara, cuja regra de <p> vencia */
.section--paper .card p.chat__me,
.section--paper .chat__me,
.chat__me{ color:#241009; }

/* fecho do cronograma: sobrou um cinza esverdeado do tema antigo */
.timeline__end span{ color:#6B5344; }

/* rótulos mito/verdade */
.section:not(.section--dark) .mito__row--mito .mito__label{ color:#8E2F3A; }
.section:not(.section--dark) .mito__row--verdade .mito__label{ color:#8C3A17; }

/* card de resultado do bloco de dados */
.verdict--up .verdict__txt span{ color:#2A130B; }

/* textos de apoio dentro dos blocos escuros */
.guarantee__note{ color:#EDC9B4 !important; }
.final .lead, .final__date{ color:#EFCFB9; }
.offer__from, .offer__cash{ color:#F0D3C0; }
.offer .tickets__label{ color:#F0D3C0; }

/* ─────────  PÁGINAS PÓS-VENDA NA PELE CLARA  ─────────
   /evento e /voce-ta-dentro usam .section, então acompanharam o creme. Os
   componentes pos-* traziam texto claro de quando o fundo era preto. */

.section:not(.section--dark) :is(.pos-remind, .pos-access, .pos-step--main){
  --white:#2A1A12;
  --muted:#5C392A;
}
.section:not(.section--dark) .pos-remind li,
.section:not(.section--dark) .pos-access__txt p,
.section:not(.section--dark) .pos-step--main p{ color:#5C392A; }
.section:not(.section--dark) .pos-remind li strong,
.section:not(.section--dark) .pos-access__txt h2,
.section:not(.section--dark) .pos-access__txt p strong{ color:#2A1A12; }
.section:not(.section--dark) .pos-remind a{ color:#8E4021; }

/* logo do rodapé: SVG branco, sumia no creme */
.footer__brand img{ filter:brightness(0) saturate(0); opacity:.75; }

/* ─────────  HERO: acerto de cor  ─────────
   Diagnóstico do print: a foto tinha grayscale com uma camada de cor a 26%,
   o que não é duotone, é cinza levemente sujo. E os componentes da hero (pill,
   chips, tag, metadados) vinham de neutros frios que não pertenciam à paleta.
   Aqui a foto ganha duotone de verdade e os apoios ficam quentes. */

/* foto: mais contraste no p&b e camada de cor com força de duotone */
.hero__bg picture, .hero__bg img{
  filter:grayscale(1) contrast(1.18) brightness(1.02);
}
.hero__bg::before{
  background:linear-gradient(150deg, #7E3C27 0%, #C1622F 55%, #E0906A 100%);
  mix-blend-mode:color; opacity:.62;
}
/* segunda camada: aquece as luzes sem lavar as sombras */
.hero__bg picture::after{ content:none; }
.hero--cine .hero__bg{ isolation:isolate; }

/* pílula de data: era cinza neutro sobre fundo quente */
.hero .pill{
  background:rgba(255,214,186,.09);
  box-shadow:inset 0 0 0 1px rgba(255,214,186,.14);
  color:#E4CDBD;
}
.hero .pill strong{ color:#FFF3E9; }
.hero .pill__sep{ color:#9E7F6D; }

/* chips: o marrom quase preto virava mancha; agora é vidro quente */
.chips li{
  color:#F5C4A6;
  background:rgba(218,119,86,.13);
  box-shadow:inset 0 0 0 1px rgba(218,119,86,.28);
}

/* tag sobre a foto */
.portrait__tag{ background:rgba(32,20,13,.86); backdrop-filter:blur(6px); }

/* marca-texto da headline: sobre a tinta escura, um laranja translúcido vira
   marrom sujo. Aqui ele é sólido e claro, como caneta marca-texto de verdade,
   com o texto escurecendo para manter a leitura. */
.hero--cine .hero__headline .hl{
  background:linear-gradient(100deg, #E08A63 0%, #D4764F 100%);
  color:#2A130B;
  padding:.04em .16em; border-radius:3px;
}

/* a esteira e o botão usam a mesma rampa: três laranjas quase iguais lidos
   lado a lado pareciam descuido */
.marquee--green{ background:#C96A38; }

/* ─────────  TREINAMENTO GRAVADO (página da raiz)  ─────────
   O produto da raiz não tem data nem vagas, então a barra de ingressos do
   hero e da oferta deu lugar a uma linha de preço simples. */

.hero__price{
  margin:0; font-size:14.5px; line-height:1.5; color:var(--muted);
}
.hero__price s{ color:var(--dim); }
.hero__price strong{ color:var(--white); font-weight:700; }
.hero__price span{
  display:block; margin-top:3px;
  font-size:11.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:#F5C4A6;
}
.offer__after{
  margin:14px 0 0; text-align:center; font-size:13.5px; line-height:1.6;
}
.offer__after s{ opacity:.75; }
.offer__after strong{ font-weight:700; }

/* "Módulo 00" é mais largo que "10h00": a coluna da esquerda acompanha */
.module__hora{ font-size:19px; letter-spacing:-.01em; white-space:nowrap; }

/* sem barra de progresso no CTA fixo: sobrou só a linha de texto */
.sticky-cta__progress{ justify-content:center; }

/* ─────────  BLOCOS DE OFERTA DO TREINAMENTO GRAVADO  ─────────
   Estrutura tirada da referência: prova do produto em uso, bônus com valor
   ancorado e um fecho que lista tudo ao lado do preço. */

/* selo de segurança sob os CTAs */
.pagseguro{
  display:flex; align-items:center; gap:7px;
  margin:14px 0 0; font-size:12px; line-height:1.5; color:var(--dim);
}
.pagseguro svg{ flex:0 0 auto; color:var(--clay-soft); }
.hero__selo{ margin-top:2px; }

/* o produto em uso, no lugar do player estático */
.prova-uso{ margin:0; position:relative; }
.prova-uso img{
  width:100%; height:auto; display:block;
  border-radius:var(--r-lg);
  box-shadow:0 40px 90px -42px rgba(58,27,14,.6);
}
.prova-uso figcaption{
  margin-top:14px; text-align:center;
  font-size:13px; line-height:1.6; color:var(--muted);
}

/* ─────────  BÔNUS  ───────── */
.bonuses{
  display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:44px;
}
.bonus-card{
  background:#FFFFFF; border-radius:var(--r-lg); overflow:hidden;
  box-shadow:0 22px 50px -26px rgba(92,57,42,.34);
  display:flex; flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease;
}
.bonus-card:hover{ transform:translateY(-5px); box-shadow:0 32px 66px -28px rgba(92,57,42,.44); }
.bonus-card__img{ margin:0; }
.bonus-card__img img{ width:100%; height:auto; display:block; }
.bonus-card__body{ padding:26px 28px 28px; }
.bonus-card__tag{
  display:inline-block; margin-bottom:12px;
  font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:#FFFFFF; background:#A8461F; border-radius:100px; padding:5px 12px;
}
.bonus-card h3{ font-size:19px; margin-bottom:8px; }
.bonus-card p{ margin:0 0 16px; font-size:14.5px; line-height:1.7; }
.bonus-card__valor{
  display:inline-block; font-size:13px; color:var(--dim);
}
.bonus-card__valor b{
  margin-left:6px; color:#A8461F; font-weight:800;
  text-transform:uppercase; letter-spacing:.08em; font-size:11.5px;
}
.bonus-soma{
  margin:34px auto 0; max-width:52ch; text-align:center;
  font-family:var(--display); font-weight:300; font-size:clamp(19px, 2vw, 25px);
  line-height:1.5; color:var(--brown);
}
.bonus-soma s{ color:var(--dim); }
.bonus-soma strong{ font-family:var(--sans); font-weight:700; font-size:.82em; }

/* ─────────  TUDO QUE VOCÊ RECEBE  ───────── */
.recebe{ display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center; }
.recebe__lista .h2{ margin-bottom:24px; }
.recebe__lista ul{ display:flex; flex-direction:column; }
.recebe__lista li{
  display:flex; gap:14px; align-items:flex-start;
  padding:15px 0; border-top:1px solid rgba(92,57,42,.14);
  font-size:15px; line-height:1.6; color:var(--brown-2);
}
.recebe__lista li span{ flex:0 0 auto; font-size:18px; line-height:1.3; }
.recebe__lista li strong{ color:var(--brown); font-weight:700; }

.recebe__cta{
  text-align:center; border-radius:var(--r-lg); padding:44px 38px 38px;
  background:#FFFDF8; box-shadow:0 30px 70px -32px rgba(92,57,42,.4);
}
.recebe__logo{ width:190px; height:auto; margin:0 auto 26px; filter:brightness(0) saturate(0); opacity:.88; }
.recebe__de{ margin:0; font-size:13.5px; color:var(--dim); }
.recebe__preco{
  margin:2px 0 0; font-family:var(--sans); font-weight:700;
  font-size:clamp(58px, 6vw, 76px); line-height:1; color:var(--brown);
  letter-spacing:-.03em;
}
.recebe__preco span{ font-size:.42em; font-weight:600; vertical-align:.5em; margin-right:4px; }
.recebe__parcela{ margin:6px 0 24px; font-size:15px; font-weight:600; color:#A8461F; }
.recebe__cta .btn{ width:100%; }
.recebe__cta .pagseguro{ justify-content:center; text-align:center; }

@media (max-width:900px){
  .bonuses{ grid-template-columns:1fr; gap:18px; }
  .recebe{ grid-template-columns:1fr; gap:36px; }
  .recebe__cta{ padding:34px 24px 30px; }
  .pagseguro{ font-size:11.5px; }
}

/* =========================================================
   ARQUITETURA DA REFERÊNCIA (raiz)
   A raiz foi refeita bloco a bloco no formato da v3 da referência:
   hero claro e centrado, grade 3x3 de módulos, card-mecanismo com o
   produto ao lado, bônus, fecho de oferta e captura no fim.
   A pele continua sendo a nossa.
   ========================================================= */

/* o asterisco como bullet, do jeito que a referência usa */
.ast{
  display:inline-block; width:1em; height:1em; vertical-align:-.13em;
  background:currentColor;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
}
.ast--g{ width:30px; height:30px; color:var(--clay); margin-bottom:18px; display:block; }
.btn .ast{ width:.9em; height:.9em; margin-right:.1em; }
.h2 .ast{ width:.62em; height:.62em; color:var(--clay); margin-right:.24em; vertical-align:.02em; }

/* ─────────  HERO  ───────── */
.hero-ref{
  padding:96px 0 74px; text-align:center; overflow:hidden;
  --bg:var(--cream); --white:var(--brown); --text:#4A3527; --muted:#6B5344;
  --dim:#6E5748; --hair:rgba(92,57,42,.14);
  background:var(--cream); color:var(--text);
}
.hero-ref__ast{
  position:absolute; z-index:0; pointer-events:none;
  right:-6%; top:-12%; width:min(60vw,760px); aspect-ratio:1;
  background:var(--clay-soft); opacity:.09;
  -webkit-mask:url("assets/asterisco.svg") center/contain no-repeat;
          mask:url("assets/asterisco.svg") center/contain no-repeat;
  animation:ast-turn 120s linear infinite;
}
.hero-ref__inner{ display:flex; flex-direction:column; align-items:center; }
.hero-ref__logo{
  width:min(310px,62vw); height:auto; margin-bottom:34px;
  filter:brightness(0) saturate(0); opacity:.92;
}
.hero-ref__h1{
  margin:0 0 20px; max-width:23ch;
  font-family:var(--sans); font-weight:800; letter-spacing:-.022em;
  font-size:clamp(28px, 3.4vw, 45px); line-height:1.12; color:var(--brown);
  /* o balance esticava a linha e soltava a pontuação do fim da frase */
  text-wrap:pretty;
}
.hero-ref__h1 em{ display:block; font-style:normal; color:var(--clay); }
.hero-ref__sub{
  margin:0 0 34px; max-width:44ch;
  font-size:clamp(16px, 1.5vw, 19px); line-height:1.6; color:var(--brown-2);
}
.hero-ref__cta{ display:flex; flex-direction:column; align-items:center; }
.hero-ref__cta .btn{ min-width:340px; }
.hero-ref__cta .pagseguro{ justify-content:center; }

/* ─────────  CARD-MECANISMO  ───────── */
.cardão{
  display:grid; grid-template-columns:1.02fr .98fr; gap:44px; align-items:center;
  background:#FFFDF8; border-radius:26px; padding:56px 56px 52px;
  box-shadow:0 34px 80px -40px rgba(92,57,42,.4);
}
.cardão__copy .h2{ margin-bottom:12px; }
.cardão__lead{
  margin:0 0 20px; font-size:clamp(17px,1.7vw,21px); line-height:1.5;
  font-weight:600; color:var(--clay);
}
.cardão__copy .body{ margin-bottom:16px; }
.cardão__copy .btn{ margin-top:12px; }
.cardão__img{ margin:0; }
.cardão__img img{ width:100%; height:auto; display:block; border-radius:18px; }

/* ─────────  MALHA DE MÓDULOS (3 colunas, como a referência)  ───────── */
.malha{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px;
}
.malha__card{
  background:#FFFDF8; border-radius:20px; padding:30px 28px 32px;
  box-shadow:0 18px 44px -26px rgba(92,57,42,.3);
  display:flex; flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease;
}
.malha__card:hover{ transform:translateY(-4px); box-shadow:0 28px 60px -28px rgba(92,57,42,.4); }
.malha__card h3{
  font-family:var(--sans); font-size:17px; font-weight:700; letter-spacing:-.01em;
  color:var(--clay); margin-bottom:10px;
}
.malha__card p{ margin:0; font-size:14.5px; line-height:1.72; color:var(--brown-2); }
.malha__card p b{ color:var(--brown); font-weight:700; }
.malha__card--destaque{
  background:linear-gradient(140deg,#48200F,#7E3C27);
  align-items:center; justify-content:center; text-align:center;
}
.malha__card--destaque p{
  font-family:var(--display); font-weight:300; font-size:21px; line-height:1.45; color:#FFF6EC;
}

/* ─────────  SOBRE  ───────── */
.sobre{ display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:center; }
.sobre__foto{ margin:0; }
.sobre__foto img{
  width:100%; height:auto; display:block; border-radius:20px;
  box-shadow:0 34px 74px -38px rgba(92,57,42,.55);
}
.sobre__copy p{ margin:0 0 14px; font-size:16px; line-height:1.75; color:var(--brown-2); }
.sobre__copy p strong{ color:var(--brown); font-weight:700; }
.sobre__copy .h2{ margin-bottom:20px; }

/* ─────────  CAPTURA  ───────── */
.captura{
  max-width:520px; margin:34px auto 0; background:#FFFDF8; border-radius:20px;
  padding:34px 32px 30px; box-shadow:0 26px 60px -30px rgba(92,57,42,.38);
  display:flex; flex-direction:column; gap:14px;
}
.captura label{
  display:flex; flex-direction:column; gap:7px;
  font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim);
}
.captura input{
  font:inherit; font-size:15px; letter-spacing:0; text-transform:none; font-weight:500;
  color:var(--brown); background:#FFFFFF; border:1px solid rgba(92,57,42,.2);
  border-radius:10px; padding:13px 15px;
}
.captura input:focus{ outline:2px solid var(--clay-soft); outline-offset:1px; border-color:transparent; }
.captura__err{ margin:0; font-size:13px; color:#A9414B; min-height:0; display:none; }
.captura__err.is-on{ display:block; }
.captura .pagseguro{ justify-content:center; margin-top:4px; }

@media (max-width:900px){
  .cardão{ grid-template-columns:1fr; gap:32px; padding:36px 26px 34px; }
  .cardão__img{ order:-1; max-width:340px; margin:0 auto; }
  .malha{ grid-template-columns:1fr; }
  .sobre{ grid-template-columns:1fr; gap:32px; }
  .sobre__foto{ max-width:380px; margin:0 auto; }
  .hero-ref{ padding:70px 0 56px; }
  .hero-ref__cta .btn{ min-width:0; width:100%; }
}

/* =========================================================
   ARQUITETURA "LOW TICKET" (raiz)
   Sequência, ritmo e tipos de bloco replicados de
   meuprimeirolow.com.br. A pele continua sendo a nossa.
   ========================================================= */

/* kicker: a pílula escura que a referência põe antes de cada headline */
.kicker{
  display:inline-block; margin-bottom:18px;
  font-size:13.5px; font-weight:700; letter-spacing:.01em;
  color:#FBEFE2; background:var(--clay-deep);
  border-radius:100px; padding:9px 22px;
}
.section--dark .kicker{ background:rgba(255,255,255,.14); }

/* ─────────  HERO  ───────── */
.low-hero{
  padding:44px 0 78px; text-align:center;
  --bg:var(--cream); --white:var(--brown); --text:#4A3527; --muted:#6B5344;
  --dim:#6E5748; --hair:rgba(92,57,42,.14);
  background:var(--cream); color:var(--text);
}
.low-hero__inner{ display:flex; flex-direction:column; align-items:center; }
.low-hero__logo{
  width:min(240px,54vw); height:auto; margin-bottom:34px;
  filter:brightness(0) saturate(0); opacity:.92;
}
.low-h1{
  margin:0 0 22px; max-width:20ch;
  font-family:var(--sans); font-weight:800; letter-spacing:-.022em;
  font-size:clamp(29px, 3.6vw, 46px); line-height:1.14; color:var(--brown);
  text-wrap:pretty;
}
.low-h1 em{ font-style:normal; color:var(--clay); }
.low-check{
  margin:0 0 34px; display:inline-flex; align-items:center; gap:8px;
  font-size:15px; font-weight:600; color:var(--brown);
  background:#FFFDF8; border-radius:100px; padding:11px 22px;
  box-shadow:0 10px 26px -14px rgba(92,57,42,.4), inset 0 0 0 1px rgba(92,57,42,.1);
}
.low-hero__fone{ margin:0 0 34px; max-width:330px; }
.low-hero__fone img{ width:100%; height:auto; display:block; }
.low-cta{ display:flex; flex-direction:column; align-items:center; }
.low-cta .btn{ min-width:340px; }
.low-cta .pagseguro{ justify-content:center; }

/* ─────────  DOR  ───────── */
.dor-img{ margin:26px auto 0; max-width:760px; }
.dor-img img{
  width:100%; height:auto; display:block; border-radius:var(--r-lg);
  box-shadow:0 34px 74px -40px rgba(92,57,42,.5);
}

/* ─────────  AVISO (bloco escuro)  ───────── */
.aviso-ico{ display:block; font-size:40px; line-height:1; margin-bottom:20px; }
.aviso-txt{
  margin:0 auto 22px; max-width:54ch;
  font-family:var(--display); font-weight:300;
  font-size:clamp(21px,2.4vw,30px); line-height:1.4; color:#FFF6EC;
}
.aviso-vira{
  margin:0 auto; max-width:56ch; font-size:16.5px; line-height:1.75; color:#F3DCCE;
}
.aviso-vira strong{ color:#FFB08A; font-weight:700; }

/* ─────────  GANHOS  ───────── */
.ganhos{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:40px; }
.ganho{
  display:flex; gap:14px; align-items:flex-start;
  background:#FFFFFF; border-radius:var(--r-lg); padding:26px 26px 28px;
  box-shadow:0 18px 44px -26px rgba(92,57,42,.3);
}
.ganho span{ flex:0 0 auto; color:var(--clay); font-size:22px; line-height:1.1; }
.ganho p{ margin:0; font-size:15.5px; line-height:1.65; color:var(--brown-2); }
.ganho p strong{ color:var(--brown); font-weight:700; }

/* ─────────  ENTREGÁVEIS  ───────── */
.entregas{ display:flex; flex-direction:column; gap:20px; margin-top:44px; }
.entrega{
  display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:0;
  background:#FFFDF8; border-radius:22px; overflow:hidden;
  box-shadow:0 20px 48px -28px rgba(92,57,42,.32);
}
.entrega--inv .entrega__img{ order:2; }
.entrega__img{ margin:0; background:linear-gradient(140deg,#48200F,#7E3C27); height:100%; display:flex; align-items:center; }
.entrega__img img{ width:100%; height:auto; display:block; }
.entrega__copy{ padding:34px 38px; }
.entrega__copy h3{ font-family:var(--sans); font-weight:700; font-size:21px; letter-spacing:-.01em; margin-bottom:10px; }
.entrega__copy p{ margin:0; font-size:15px; line-height:1.72; }

.entregas--tri{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.entrega-mini{
  background:#FFFDF8; border-radius:20px; overflow:hidden;
  box-shadow:0 18px 44px -26px rgba(92,57,42,.3);
}
.entrega-mini figure{ margin:0; background:linear-gradient(140deg,#48200F,#7E3C27); }
.entrega-mini img{ width:100%; height:auto; display:block; }
.entrega-mini h3{ font-family:var(--sans); font-weight:700; font-size:17px; margin:22px 24px 8px; }
.entrega-mini p{ margin:0 24px 26px; font-size:14px; line-height:1.65; }

/* ─────────  PARA QUEM  ───────── */
.paraquem{ max-width:640px; margin:36px auto 0; display:flex; flex-direction:column; gap:2px; }
.paraquem li{
  display:flex; gap:13px; align-items:flex-start;
  padding:15px 0; border-bottom:1px solid rgba(255,255,255,.13);
  font-size:16px; line-height:1.6; color:#F3DCCE;
}
.paraquem li::before{ content:"✓"; color:#FFB08A; font-weight:800; flex:0 0 auto; }
.paraquem li strong{ color:#FFF6EC; font-weight:700; }

/* ─────────  RECAPITULAÇÃO + OFERTA  ───────── */
.recap{
  max-width:640px; margin:0 auto; background:#FFFDF8; border-radius:22px;
  padding:38px 40px 34px; box-shadow:0 24px 56px -30px rgba(92,57,42,.34);
  text-align:center;
}
.recap .h2{ margin-bottom:24px; }
.recap ul{ display:flex; flex-direction:column; text-align:left; }
.recap li{
  display:flex; align-items:center; gap:14px; justify-content:space-between;
  padding:12px 0; border-top:1px solid rgba(92,57,42,.13);
  font-size:15.5px; color:var(--brown-2);
}
.recap li span{ display:flex; align-items:center; gap:9px; }
.recap li .ast{ width:.72em; height:.72em; color:var(--clay); }
.recap li s{ color:#A9414B; font-weight:600; white-space:nowrap; }
.recap__total{
  margin:20px auto 0; width:max-content; max-width:100%;
  background:#FFFDF8; border-radius:100px; padding:11px 26px;
  font-size:15.5px; font-weight:600; color:var(--brown);
  box-shadow:inset 0 0 0 1px rgba(92,57,42,.14);
}
.recap__total s{ color:#A9414B; }

.low-offer{
  max-width:460px; margin:34px auto 0; text-align:center;
  background:#FFFDF8; border-radius:22px; padding:38px 34px 34px;
  box-shadow:0 30px 70px -32px rgba(92,57,42,.42);
}
.low-offer__logo{ width:190px; height:auto; margin:0 auto 22px; filter:brightness(0) saturate(0); opacity:.9; }
.low-offer__parc{
  margin:0; padding-top:20px; border-top:1px solid rgba(92,57,42,.14);
  font-size:clamp(30px,3.4vw,40px); font-weight:800; letter-spacing:-.02em; color:var(--clay);
}
.low-offer__parc strong{ font-weight:800; }
.low-offer__vista{ margin:2px 0 22px; font-size:16px; color:var(--brown-2); }
.low-offer .btn{ width:100%; }
.low-offer .pagseguro{ justify-content:center; }

/* ─────────  PASSOS  ───────── */
.passos{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:40px; }
.passo{
  background:#FFFFFF; border-radius:var(--r-lg); padding:30px 26px 28px; text-align:center;
  box-shadow:0 18px 44px -26px rgba(92,57,42,.3);
}
.passo__ico{ display:inline-flex; color:var(--clay); margin-bottom:14px; }
.passo h3{ font-family:var(--sans); font-weight:700; font-size:17px; margin-bottom:8px; }
.passo p{ margin:0; font-size:14.5px; line-height:1.65; }

/* ─────────  DUAS ESCOLHAS  ───────── */
.escolhas{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:40px; }
.escolha{
  background:#FFFDF8; border-radius:var(--r-lg); padding:30px 28px 30px; text-align:center;
  --white:var(--brown); --text:#4A3527;
}
.escolha__tag{
  display:inline-block; margin-bottom:14px;
  font-size:12px; font-weight:800; letter-spacing:.08em;
  border-radius:100px; padding:6px 16px;
}
.escolha__tag--1{ background:#E6DACB; color:#6B5344; }
.escolha__tag--2{ background:#A8461F; color:#FFFFFF; }
.escolha h3{ font-family:var(--sans); font-weight:800; font-size:21px; color:var(--brown); margin-bottom:10px; }
.escolha p{ margin:0; font-size:15px; line-height:1.7; color:var(--brown-2); }
.escolha--boa{ box-shadow:0 0 0 2px var(--clay), 0 24px 54px -28px rgba(58,27,14,.6); }
.escolhas__fecho{ margin-top:40px; text-align:center; }
.escolhas__frase{
  margin:0 auto 24px; max-width:26ch;
  font-family:var(--display); font-weight:300; font-size:clamp(23px,2.6vw,33px);
  line-height:1.32; color:#FFF6EC;
}
.escolhas__frase em{ font-style:italic; }

/* ─────────  SOBRE  ───────── */
.sobre{ display:grid; grid-template-columns:.82fr 1.18fr; gap:54px; align-items:center; }
.sobre__foto{ margin:0; }
.sobre__foto img{ width:100%; height:auto; display:block; border-radius:20px; box-shadow:0 34px 74px -38px rgba(92,57,42,.55); }
.sobre__copy .h2{ margin-bottom:20px; }
.sobre__copy .h2 em{ color:var(--clay); }
.sobre__copy p{ margin:0 0 14px; font-size:16px; line-height:1.75; }

@media (max-width:900px){
  .ganhos, .escolhas{ grid-template-columns:1fr; }
  .entrega{ grid-template-columns:1fr; }
  .entrega--inv .entrega__img{ order:0; }
  .entregas--tri, .passos{ grid-template-columns:1fr; }
  .sobre{ grid-template-columns:1fr; gap:30px; }
  .sobre__foto{ max-width:360px; margin:0 auto; }
  .low-cta .btn{ min-width:0; width:100%; }
  .recap{ padding:28px 22px 26px; }
  .recap li{ font-size:14.5px; gap:10px; }
}

/* ─────────  AJUSTES DE PROPORÇÃO DA ARQUITETURA LOW  ───────── */

/* a imagem do entregável tem alturas diferentes por asset: fixar a moldura
   e recortar mantém as três linhas com o mesmo ritmo */
.entrega__img{ align-self:stretch; }
.entrega__img img{ height:100%; object-fit:cover; object-position:center; max-height:340px; }
.entrega__copy{ padding:38px 40px; }

/* os três mini-cards precisam fechar na mesma altura */
.entregas--tri{ align-items:stretch; }
.entrega-mini{ display:flex; flex-direction:column; }
.entrega-mini figure{ aspect-ratio:16/10; overflow:hidden; }
.entrega-mini img{ height:100%; object-fit:cover; }
.entrega-mini p{ margin-top:auto; padding-bottom:26px; margin-bottom:0; }

/* o título da recapitulação quebrava em quatro linhas dentro do card */
.recap .h2{ max-width:26ch; margin-left:auto; margin-right:auto; }

/* o mockup do hero carregava o próprio palco: recorta o excesso */
.low-hero__fone{ max-width:300px; }

/* o CTA do fecho herdava a largura do bloco e virava uma faixa */
.escolhas__fecho .btn{ width:auto; min-width:340px; }
@media (max-width:900px){ .escolhas__fecho .btn{ min-width:0; width:100%; } }

/* =========================================================
   MELHORIAS DA COMPARAÇÃO BLOCO A BLOCO COM A REFERÊNCIA
   ========================================================= */

/* 1 · HERO
   Lá o aparelho é grande e sangra pra fora da seção; aqui ele vinha pequeno
   e ainda carregava o próprio fundo. Agora flutua, maior, e o corte inferior
   fica por conta do overflow da seção. */
.low-hero{ overflow:hidden; padding-bottom:0; }
.low-hero__fone{
  max-width:400px; margin:6px auto -70px; position:relative; z-index:1;
}
.low-hero__fone img{ filter:drop-shadow(0 40px 60px rgba(58,27,14,.28)); }
.low-hero .low-cta{
  position:relative; z-index:3;
  background:linear-gradient(180deg, rgba(252,247,235,0) 0%, var(--cream) 24%);
  width:100%; padding:56px 0 46px; margin-top:-40px;
}
/* a headline cabia em três linhas lá e estourava pra quatro aqui */
.low-h1{ font-size:clamp(27px, 3.1vw, 40px); max-width:22ch; }

/* 2 · DOR
   A arte agora tem alvo e fundo transparente: sai a moldura que a isolava. */
.dor-img{ max-width:840px; }
.dor-img img{ box-shadow:none; border-radius:0; }

/* 3 · AVISO
   Lá é um card claro sobre o bloco escuro, com o ícone sobreposto no topo.
   Texto escuro sobre claro lê muito melhor que claro sobre marrom. */
.aviso-card{
  position:relative; max-width:660px; margin:34px auto 0;
  background:#FFFDF8; border-radius:22px; padding:52px 44px 40px; text-align:center;
  box-shadow:0 34px 70px -34px rgba(20,10,5,.7);
}
.aviso-ico{
  position:absolute; top:-32px; left:50%; transform:translateX(-50%);
  width:64px; height:64px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:29px; line-height:1;
  background:linear-gradient(60deg,#C1622F,#DA7756);
  box-shadow:0 14px 30px -12px rgba(20,10,5,.7);
}
.aviso-txt{
  margin:0 auto 18px; max-width:44ch;
  font-family:var(--sans); font-weight:700; letter-spacing:-.015em;
  font-size:clamp(19px,2vw,24px); line-height:1.36; color:var(--brown);
}
.aviso-txt strong{ color:var(--clay); }
.aviso-vira{
  margin:0 auto; max-width:48ch; font-size:15.5px; line-height:1.7; color:var(--brown-2);
}
.aviso-vira strong{ color:var(--brown); font-weight:700; }

/* 4 · GANHOS
   Lá são quatro cards quadrados com ícone grande e frase curta, escaneáveis.
   Aqui eram cards largos com parágrafo: virou o formato deles. */
.ganhos{ grid-template-columns:repeat(4,1fr); gap:16px; }
.ganho{
  flex-direction:column; align-items:center; text-align:center;
  padding:30px 22px 28px; gap:0;
}
.ganho__ico{
  display:flex; align-items:center; justify-content:center;
  width:56px; height:56px; border-radius:16px; margin-bottom:16px;
  color:var(--clay); background:#F7E7DC;
}
.ganho p{
  font-size:15px; line-height:1.45; font-weight:700; color:var(--brown);
}

/* 5 · PARA QUEM
   Lá a lista mora num card destacado do fundo e o título fica dentro dele. */
.paraquem-card{
  background:rgba(255,255,255,.07); border-radius:22px; padding:40px 44px 34px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.paraquem-card .h2{ margin-bottom:8px; color:#FFF6EC; }
.paraquem{ margin:0; max-width:none; }
.paraquem li{ padding:12px 0; font-size:15.5px; }
.paraquem li:last-child{ border-bottom:0; }

/* 6 · PASSOS: o ícone deles é maior e mais presente */
.passo__ico{
  width:56px; height:56px; border-radius:16px; margin-bottom:16px;
  align-items:center; justify-content:center; background:#F7E7DC;
}
.passo__ico svg{ width:28px; height:28px; }

@media (max-width:900px){
  .ganhos{ grid-template-columns:1fr 1fr; }
  .ganho p{ font-size:14px; }
  .aviso-card{ padding:46px 24px 32px; }
  .paraquem-card{ padding:30px 22px 26px; }
  .low-hero__fone{ max-width:280px; margin-bottom:-50px; }
}
@media (max-width:520px){
  .ganhos{ grid-template-columns:1fr; }
}

/* o .low-cta virou faixa de largura total pra fazer o degradê sobre o
   aparelho; o botão dentro dela precisa voltar ao tamanho próprio */
.low-hero .low-cta .btn{ width:auto; min-width:340px; max-width:min(440px, 90vw); }
.low-hero .low-cta{ padding-top:76px; margin-top:-64px; }
@media (max-width:900px){
  .low-hero .low-cta .btn{ min-width:0; width:100%; }
  .low-hero .low-cta{ padding-top:60px; }
}

/* o balance abria um vão antes do trecho em negrito nos itens curtos */
.paraquem li{ text-wrap:pretty; }

/* ─────────  CTA EM VERDE  ─────────
   Pedido do Pablo, no espírito da referência: o botão sai da cor de marca e
   assume o verde de compra, que é o único elemento verde da página inteira.
   Texto branco: sobre esse verde ele rende mais que o marrom. */
:root{
  /* verde fechado o bastante pro texto branco passar em 4.5:1 e pra não
     brigar com o terracota da página */
  --cta:        #176B3B;
  --cta-claro:  #1E8449;
  --cta-escuro: #125630;
}
.btn{
  background:linear-gradient(60deg, var(--cta) 0%, var(--cta-claro) 100%);
  color:#FFFFFF;
  box-shadow:
    0 1px 0 rgba(255,255,255,.28) inset,
    0 0 0 1px rgba(18,86,48,.45),
    0 12px 34px -10px rgba(18,86,48,.5);
}
.btn:hover{
  box-shadow:
    0 1px 0 rgba(255,255,255,.36) inset,
    0 0 0 1px rgba(18,86,48,.6),
    0 18px 44px -10px rgba(18,86,48,.65);
}
/* o asterisco dentro do botão herda currentColor e acompanha o branco */
.btn .ast{ background:currentColor; }
/* a bolinha do CTA fixo também era terracota */
.btn__dot{ background:#FFFFFF; }

/* o fecho das escolhas agora aponta pro botão do bloco seguinte */
.escolhas__nota{
  margin:0 auto; max-width:44ch; font-size:15.5px; line-height:1.6; color:#F3DCCE;
}
/* o hero termina no mockup, sem CTA: o corte inferior sai */
.low-hero{ padding-bottom:0; }
.low-hero__fone{ margin-bottom:-40px; }

/* ─────────  ENTREGÁVEL NO PADRÃO EXATO DA REFERÊNCIA  ─────────
   Medido no original: card 972x308, com a imagem ocupando 41% e o texto 59%,
   e o elemento flutuante centrado NA DIVISA das duas metades (metade sobre a
   cor, metade sobre o claro). Antes o flutuante vinha dentro da imagem, o que
   nunca ia cair no lugar certo. */
.entrega{
  position:relative;
  grid-template-columns:41% 59%;
  border-radius:24px;
}
.entrega--inv{ grid-template-columns:59% 41%; }
.entrega__img{ aspect-ratio:400/308; max-height:none; }
.entrega__img img{ max-height:none; height:100%; }

.entrega__flut{
  position:absolute; z-index:4; top:50%; left:41%;
  transform:translate(-50%,-50%);
  width:118px; height:118px; border-radius:30px; background:#FFFDF8;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 26px 46px -16px rgba(42,20,8,.42);
}
.entrega--inv .entrega__flut{ left:59%; }

@media (max-width:900px){
  .entrega, .entrega--inv{ grid-template-columns:1fr; }
  .entrega__flut{ left:50%; top:auto; bottom:auto; top:calc(41vw); width:92px; height:92px; border-radius:24px; }
  .entrega__flut svg{ width:48px; height:48px; }
}

/* o texto precisa começar depois do card flutuante, como no original */
.entrega__copy{ padding:38px 44px 38px 92px; }
.entrega--inv .entrega__copy{ padding:38px 92px 38px 44px; }
@media (max-width:900px){
  .entrega__copy, .entrega--inv .entrega__copy{ padding:64px 26px 30px; }
}

/* tipografia do card no peso da referência: título grande e bold, texto médio */
.entrega__copy h3{
  font-size:clamp(21px, 2.1vw, 27px); font-weight:800; line-height:1.14;
  letter-spacing:-.018em; color:var(--brown); margin-bottom:12px;
}
.entrega__copy p{ font-size:16px; line-height:1.6; }
.entrega-mini h3{ font-size:18.5px; font-weight:800; letter-spacing:-.012em; }
.entrega-mini p{ font-size:14.5px; line-height:1.6; }

/* o card flutuante estava passando por cima do objeto do mockup: recuar um
   pouco pra dentro do lado claro resolve sem perder a sobreposição */
.entrega__flut{ left:calc(41% + 16px); }
.entrega--inv .entrega__flut{ left:calc(59% - 16px); }

/* ─────────  BLOCOS DA BIBLIOTECA DE CRIATIVOS  ───────── */

/* pílulas de promessa sob a headline do hero */
.selos{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:6px 0 30px; }
.selos li{
  font-size:13.5px; font-weight:700; color:var(--brown);
  background:#FFFDF8; border-radius:100px; padding:10px 20px;
  box-shadow:0 10px 24px -14px rgba(92,57,42,.4), inset 0 0 0 1px rgba(92,57,42,.1);
}

/* o "se a sua resposta for sim" */
.pergunta__sim{
  margin:26px auto 0; max-width:44ch; font-size:17px; line-height:1.6; color:var(--brown-2);
  background:#FFFDF8; border-radius:16px; padding:20px 26px;
  box-shadow:0 16px 40px -22px rgba(92,57,42,.36);
}
.pergunta__sim strong{ color:var(--cta); font-weight:800; }

/* os 3 passos */
.passos3{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px; }
.passo3{
  background:#FFFDF8; border-radius:20px; padding:34px 30px 32px; position:relative;
  box-shadow:0 20px 48px -28px rgba(92,57,42,.34);
}
.passo3__n{
  display:flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:16px; margin-bottom:18px;
  font-size:23px; font-weight:800; color:#FFF6EC;
  background:linear-gradient(60deg,var(--clay),var(--clay-soft));
}
.passo3 h3{ font-family:var(--sans); font-weight:800; font-size:20px; letter-spacing:-.015em; margin-bottom:10px; }
.passo3 p{ margin:0; font-size:15px; line-height:1.65; }

/* os 4 bônus, em lista larga */
.bonus4{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:44px; }
.bonus4__item{
  display:flex; gap:18px; align-items:flex-start;
  background:#FFFFFF; border-radius:20px; padding:28px 30px 30px;
  box-shadow:0 20px 48px -28px rgba(92,57,42,.32);
}
.bonus4__ico{ flex:0 0 auto; font-size:30px; line-height:1.1; }
.bonus4__item h3{ font-family:var(--sans); font-weight:800; font-size:18.5px; letter-spacing:-.012em; margin-bottom:8px; }
.bonus4__item p{ margin:0; font-size:14.5px; line-height:1.65; }

@media (max-width:900px){
  .passos3, .bonus4{ grid-template-columns:1fr; }
  .selos li{ font-size:12.5px; padding:9px 16px; }
}

/* ═════════  ALINHAMENTO COM A BIBLIOTECA DE CRIATIVOS  ═════════
   Comparação bloco a bloco: o que muda em relação ao que estava. */

/* 1 · HERO: as promessas moram numa cápsula só, com divisores verticais */
.capsula{
  display:inline-flex; align-items:center; gap:0; flex-wrap:wrap; justify-content:center;
  background:#FFFDF8; border-radius:100px; padding:14px 8px; margin:4px 0 32px;
  box-shadow:0 12px 30px -16px rgba(92,57,42,.4), inset 0 0 0 1px rgba(92,57,42,.09);
}
.capsula span{ font-size:15px; font-weight:600; color:var(--brown); padding:0 22px; }
.capsula i{ width:1px; height:20px; background:rgba(92,57,42,.2); display:block; }

/* 2 · PROVA: tag flutuante sobre o card, como as tags de ROI dele */
.cliente{ position:relative; }
.cliente__tag{
  position:absolute; z-index:3; left:50%; top:26px; transform:translateX(-50%);
  white-space:nowrap; font-size:12px; font-weight:800; letter-spacing:.02em;
  color:#7E2E1B; background:#F7DCCD; border-radius:100px; padding:8px 16px;
  box-shadow:0 10px 22px -10px rgba(42,20,8,.5);
}

/* 3 · PASSOS: pílula no topo, ícone grande, título curto e seta entre os cards */
.passos3{
  display:flex; align-items:center; justify-content:center; gap:0; margin-top:44px;
}
.passo3{
  flex:1 1 0; text-align:center; padding:26px 24px 30px;
  background:#FFFDF8; border-radius:18px;
  box-shadow:0 18px 44px -26px rgba(92,57,42,.32);
}
.passo3__pill{
  display:inline-block; margin-bottom:16px;
  font-size:12.5px; font-weight:600; color:var(--brown-2);
  background:#F4E7DA; border-radius:100px; padding:6px 16px;
}
.passo3__ico{ display:block; font-size:40px; line-height:1; margin-bottom:14px; }
.passo3 h3{
  font-family:var(--sans); font-weight:800; font-size:19px; line-height:1.22;
  letter-spacing:-.015em; color:var(--brown); margin:0;
}
.passo3__seta{
  flex:0 0 auto; margin:0 -13px; z-index:2;
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#FFF6EC; background:var(--clay);
  box-shadow:0 10px 22px -10px rgba(42,20,8,.5);
}

/* 4 · TÍTULO EM FAIXA ESCURA, como ele faz nos entregáveis e nos bônus */
.faixa-titulo{
  margin:-90px calc(50% - 50vw) 56px; padding:74px 24px 66px;
  background:var(--clay-deep); text-align:center;
}
.faixa-titulo .h2{ color:#FFF6EC; }
.faixa-titulo .kicker{ background:rgba(255,255,255,.16); }
/* a faixa sangra a largura toda: a seção não pode recortar */
#entregaveis, #bonus{ overflow:hidden; }

@media (max-width:900px){
  .passos3{ flex-direction:column; gap:0; }
  .passo3{ width:100%; }
  .passo3__seta{ margin:-13px 0; transform:rotate(90deg); }
  .capsula{ flex-direction:column; padding:14px 22px; gap:10px; }
  .capsula i{ display:none; }
  .capsula span{ padding:0; }
  .faixa-titulo{ margin-top:-56px; padding:56px 20px 48px; }
}

/* ═════════  MOBILE: alinhado com a referência  ═════════ */
@media (max-width:900px){
  /* no mobile ele centraliza título e texto dos cards */
  .entrega__copy, .entrega--inv .entrega__copy{ text-align:center; padding:28px 24px 30px; }
  .entrega-mini h3, .entrega-mini p{ text-align:center; }
  .entrega__copy h3{ font-size:20px; }
  .entrega__copy p{ font-size:15px; }

  /* a moldura do mockup fica mais alta: o box precisa caber inteiro */
  .entrega__img{ aspect-ratio:16/11; }
  .entrega__img img{ object-fit:cover; object-position:center; }
  .entrega-mini figure{ aspect-ratio:16/11; }
  .entrega-mini img{ object-fit:cover; }

  /* a prova social empilha em duas colunas em vez de cortar no carrossel */
  .clientes__track{ animation:none; display:grid; grid-template-columns:1fr 1fr;
                    gap:10px; width:100%; padding:0 var(--pad); }
  .clientes{ overflow:visible; }
  .clientes::before, .clientes::after{ display:none; }
  .cliente{ flex-basis:auto; }
  .cliente__tag{ font-size:10.5px; padding:6px 12px; top:14px; }
}

/* a lista do carrossel é duplicada pra fazer o loop infinito; virando grade
   no mobile, a segunda cópia apareceria como cliente repetido */
@media (max-width:900px){
  .clientes__track .cliente:nth-child(n+9){ display:none; }
}

/* o check só aparece no mobile, onde a cápsula se quebra em pílulas soltas
   (no desktop a cápsula é contínua e o ícone poluiria) */
.capsula span b{ display:none; }
@media (max-width:900px){
  /* no mobile ele usa pílulas separadas, com check verde, em duas linhas */
  .capsula{
    display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center;
    gap:10px; background:transparent; box-shadow:none; padding:0; margin:2px 0 30px;
  }
  .capsula span{
    display:inline-flex; align-items:center; gap:8px; padding:12px 20px;
    background:#FFFDF8; border-radius:100px; font-size:14.5px; font-weight:700;
    box-shadow:0 10px 24px -14px rgba(92,57,42,.42), inset 0 0 0 1px rgba(92,57,42,.09);
  }
  .capsula span b{ display:inline; font-size:14px; line-height:1; }
  .capsula i{ display:none; }
}

/* os renders vêm com fundo de estúdio cinza claro, como os da referência:
   o container acompanha, senão sobra terracota nas bordas do recorte */
.entrega__img, .entrega-mini figure{ background:#C7C7C7; }

/* ═══════════════════════════════════════════════════════════════
   PROVA SOCIAL
   Selo na hero, depoimentos, prints de conversa e selo nas ofertas.
   Os depoimentos moram dentro de .section--dark, que redefine os
   tokens: as cores dos cards são escritas na mão de propósito,
   senão o card herda o escuro e some.
   ═══════════════════════════════════════════════════════════════ */

/* 1 · SELO DE NOTA NA HERO ---------------------------------------- */
/* a hero é CREME, não escura: texto claro aqui some por completo */
.selo-nota{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:9px; margin:-16px 0 30px;
  font-size:14px; font-weight:600; color:#7A5C4A;
}
.selo-nota b{ color:#2A1A12; font-weight:700; }
.selo-nota i{ width:4px; height:4px; border-radius:50%; background:currentColor; opacity:.5; }
.estrelas{ display:inline-flex; gap:3px; color:#C1622F; }

/* 2 · DEPOIMENTOS -------------------------------------------------- */
.deps-titulo{ text-align:center; margin-bottom:44px; }
.deps-titulo .h2{ color:#FFF6EC; }
.deps{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
  align-items:start;
}
.dep{
  background:#FFFDF8; border-radius:22px; padding:26px 26px 22px;
  box-shadow:0 22px 40px -28px rgba(20,8,3,.65);
  display:flex; flex-direction:column; gap:14px;
}
/* as estrelas são desenhadas em CSS pra não repetir seis vezes o mesmo SVG */
.dep__estrelas{
  display:block; width:88px; height:15px; background:#C1622F;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='15' viewBox='0 0 88 15'%3E%3Cpath d='m7.5 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6L3.1 13.3l1.2-4.9L.5 5.1l5-.4Z'/%3E%3Cpath d='m25.8 0 2 4.7 5 .4L29 8.4l1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m44.1 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m62.4 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6L58 13.3l1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m80.7 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3C/svg%3E") no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='15' viewBox='0 0 88 15'%3E%3Cpath d='m7.5 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6L3.1 13.3l1.2-4.9L.5 5.1l5-.4Z'/%3E%3Cpath d='m25.8 0 2 4.7 5 .4L29 8.4l1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m44.1 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m62.4 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6L58 13.3l1.2-4.9-3.8-3.3 5-.4Z'/%3E%3Cpath d='m80.7 0 2 4.7 5 .4-3.8 3.3 1.2 4.9-4.4-2.6-4.4 2.6 1.2-4.9-3.8-3.3 5-.4Z'/%3E%3C/svg%3E") no-repeat;
}
.dep__txt{ margin:0; font-size:15.5px; line-height:1.55; color:#3B2A20; }
.dep__txt strong{ color:#2A1A12; font-weight:700; }
.dep__pe{
  display:flex; align-items:center; gap:12px; margin-top:auto;
  padding-top:16px; border-top:1px solid rgba(92,57,42,.13);
}
.dep__av{
  flex:0 0 auto; width:44px; height:44px; border-radius:50%;
  object-fit:cover; background:#F3DCCE;
}
.dep__pe > span:last-child{ display:flex; flex-direction:column; gap:1px; }
.dep__nome{ font-size:14.5px; font-weight:700; color:#2A1A12; }
.dep__quem{ font-size:13px; color:#7A5C4A; }

/* 3 · PRINTS DE CONVERSA ------------------------------------------- */
#prints{ overflow:hidden; }
/* stretch, não start: com altura livre os quatro cards ficam desalinhados */
.prints{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch; }
.print{
  margin:0; background:#EDE2D4; border-radius:20px; overflow:hidden;
  box-shadow:0 20px 38px -26px rgba(42,20,8,.5);
  display:flex; flex-direction:column; gap:8px; padding-bottom:16px;
}
.print__topo{
  display:flex; align-items:center; gap:10px; margin-bottom:4px;
  padding:13px 16px; background:#7E3C27; color:#FFF6EC;
  font-size:13.5px; font-weight:700;
}
.print__av{
  width:26px; height:26px; border-radius:50%;
  background:linear-gradient(140deg,#DA7756,#C1622F);
}
.print__msg{
  position:relative; margin:0 16px; padding:11px 14px 20px;
  background:#FFFDF8; border-radius:14px 14px 14px 4px;
  font-size:14px; line-height:1.45; color:#3B2A20;
}
.print__msg--eu{
  margin-left:34px; background:#F3DCCE;
  border-radius:14px 14px 4px 14px;
}
.print__h{
  position:absolute; right:12px; bottom:6px;
  font-size:10.5px; font-weight:600; color:#7E6353;
}

/* 4 · SELO NAS OFERTAS --------------------------------------------- */
/* o card da oferta é CLARO: texto escuro na mão. Escrever em tom claro
   aqui some, mesmo o bloco em volta sendo escuro. */
.selo-oferta{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:9px; margin:16px 0 -4px; font-size:13.5px; color:#7A5C4A;
}
.selo-oferta b{ color:#2A1A12; font-weight:700; }
.selo-oferta__caras{ display:inline-flex; }
.selo-oferta__caras i{
  width:25px; height:25px; border-radius:50%; margin-right:-8px;
  background:linear-gradient(140deg,#DA7756,#C1622F); color:#FFF6EC;
  border:2px solid #FFFDF8;
  display:inline-flex; align-items:center; justify-content:center;
  font-style:normal; font-size:11px; font-weight:800; line-height:1;
}

@media (max-width:900px){
  .selo-nota{ margin:2px 0 26px; font-size:13px; }
  .deps{ grid-template-columns:1fr; gap:14px; }
  .deps-titulo{ margin-bottom:32px; }
  .dep{ padding:22px 22px 18px; }
  /* quatro prints em coluna alongam demais a página: viram duas colunas */
  .prints{ grid-template-columns:1fr 1fr; gap:12px; }
  .print__topo{ padding:11px 13px; font-size:12.5px; }
  .print__msg{ margin:0 12px; font-size:12.5px; padding:9px 11px 19px; }
  .print__msg--eu{ margin-left:22px; }
}
@media (max-width:520px){
  .prints{ grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   PÁGINA DO EVENTO · faixa escura + comparativos em verde e vermelho

   Tudo escopado em body.pg-evento de propósito: o mini-curso usa os
   mesmos componentes (.panel, .verdict, .section--dark) e não deve
   herdar nada daqui.

   Duas decisões que vieram do Pablo:
   1. verde e vermelho estão liberados quando o par é positivo x
      negativo. Fora disso a paleta segue terracota.
   2. os fundos escuros deixam de ser o terracota profundo e passam
      a ser a mesma tinta da hero (#1A100B).
   ═══════════════════════════════════════════════════════════════ */

body.pg-evento{
  --noite:      #1A100B;   /* a tinta da hero */
  --noite-2:    #241812;   /* superfície um degrau acima */
  --verde:      #123D26;   /* fundo do lado positivo */
  --verde-2:    #1A5233;   /* item dentro do positivo */
  --verde-viva: #5FD08D;   /* acento e ícone */
  --vermelho:   #3E1418;   /* fundo do lado negativo */
  --vermelho-2: #551D23;   /* item dentro do negativo */
  --vermelho-vivo:#FF8A93; /* acento e ícone */
}

/* ─── 1 · A FAIXA ESCURA: da metáfora até os sinais ─────────────── */
body.pg-evento .section--noite{
  --bg:          var(--noite);
  --bg-2:        var(--noite-2);
  --surface:     var(--noite-2);
  --surface-2:   #2E1F17;
  --hair:        rgba(255,255,255,.12);
  --hair-strong: rgba(255,255,255,.22);
  --tint:        rgba(255,255,255,.05);
  --white:       #FFF6EC;
  --text:        #EADED4;
  --muted:       #CDBBAE;
  --dim:         #B4A093;
  --faint:       #9C8779;
  background:var(--noite);
  color:#EADED4;
}
body.pg-evento .section--noite .h2{ color:#FFF6EC; }
/* as duas seções são uma faixa só: sem respiro entre elas o corte some */
body.pg-evento #virada{ padding-bottom:24px; }
body.pg-evento #sinais{ padding-top:24px; }

/* a metáfora vinha num cartão claro no tema; aqui ela é texto solto
   sobre a faixa escura, sem caixa em volta */
body.pg-evento .section--noite .metafora{
  background:none; box-shadow:none; padding:0;
  color:#E7D9CE;
}
body.pg-evento .section--noite .metafora strong{ color:#FFF6EC; }

/* ─── 2 · MITO x VERDADE ────────────────────────────────────────── */
body.pg-evento .mito__row--mito{ background:var(--vermelho); color:#F3D2D6; }
body.pg-evento .mito__row--mito .mito__label{
  background:var(--vermelho-2); color:var(--vermelho-vivo);
}
body.pg-evento .mito__row--verdade{ background:var(--verde); color:#D8F0E2; }
body.pg-evento .mito__row--verdade .mito__label{
  background:var(--verde-2); color:var(--verde-viva);
}

/* ─── 3 · SINAIS: aposto que você x não é pra você ──────────────── */
body.pg-evento .panel--yes{ background:var(--verde); }
body.pg-evento .panel--yes h3{ color:var(--verde-viva); }
body.pg-evento .panel--yes li{ background:var(--verde-2); color:#DDF2E5; }
body.pg-evento .panel--yes li::before{
  background:var(--verde-viva); color:#0B2416;
}
body.pg-evento .panel--no{ background:var(--vermelho); }
body.pg-evento .panel--no h3{ color:var(--vermelho-vivo); }
body.pg-evento .panel--no li{ background:var(--vermelho-2); color:#F6DCDF; }
body.pg-evento .panel--no li::before{
  background:var(--vermelho-vivo); color:#3E1418;
}
/* o disco do VS tem anel da cor do fundo: sobre a faixa escura ele
   ficava com halo claro em volta */
body.pg-evento #sinais .fortwo--vs::after{
  background:var(--noite-2);
  box-shadow:0 0 0 8px var(--noite), 0 20px 44px -12px rgba(0,0,0,.9);
}

/* ─── 4 · A CONTA: renda por mês x renda por cliente ────────────── */
/* o par mais importante da página. Vermelho é o que se perde ficando
   no post avulso, verde é o que entra vendendo estratégia. */
body.pg-evento .verdict--down{ background:var(--vermelho); }
body.pg-evento .verdict--down .verdict__ico{
  background:var(--vermelho-2); color:var(--vermelho-vivo);
}
body.pg-evento .verdict--down .verdict__txt strong{ color:#FFE3E6; }
body.pg-evento .verdict--down .verdict__txt span{ color:#E8B9BF; }

body.pg-evento .verdict--up{ background:var(--verde); }
body.pg-evento .verdict--up .verdict__ico{
  background:var(--verde-2); color:var(--verde-viva);
}
body.pg-evento .verdict--up .verdict__txt strong{ color:#DFF6E8; }
body.pg-evento .verdict--up .verdict__txt span{ color:#9FDCBA; font-weight:800; }

/* ─── 5 · FORA O TERRACOTA PROFUNDO DOS FUNDOS ESCUROS ──────────── */
body.pg-evento .feature{
  background:linear-gradient(135deg,#1F1510 0%,#2A1C15 55%,#160E0A 100%);
}
body.pg-evento .section--dark{
  --bg:        var(--noite);
  --bg-2:      var(--noite-2);
  --surface:   var(--noite-2);
  background:var(--noite);
}

/* o marca-texto do tema é laranja translúcido: sobre o verde da linha
   VERDADE ele vira oliva. Aqui ele é sólido, com texto escuro. */
body.pg-evento .mito__row--verdade .hl{
  background:var(--verde-viva); color:#0B2416;
  padding:.04em .18em; border-radius:3px;
}
