/* Dobem Tech · landing pages de campanha (comum a todas)
   Celular primeiro. Sem framework, sem build.
   Marca: azul #0098DA, azul de texto #0077B6, fundo escuro #0B1622, fundo claro #F4F6F9.
   Fontes: Geist (texto) e Geist Mono (etiquetas). */
:root {
  --curva: cubic-bezier(0.22, 1, 0.36, 1); /* curva base de movimento (revisão de design, 30/10/2026) */
  --icone-mina: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 46'%3E%3Ccircle cx='40' cy='12' r='10' fill='%23FBBF24' opacity='.35'/%3E%3Cpath d='M40 14V7' stroke='%2364748B' stroke-width='3'/%3E%3Ccircle cx='40' cy='7' r='4' fill='%23F59E0B'/%3E%3Cpath fill='%23334155' stroke='%231E293B' stroke-width='2' d='M14 40A26 24 0 0 1 66 40Z'/%3E%3Crect x='9' y='37' width='62' height='7' rx='3.5' fill='%23475569'/%3E%3Ccircle cx='27' cy='30' r='2' fill='%2394A3B8'/%3E%3Ccircle cx='40' cy='25' r='2' fill='%2394A3B8'/%3E%3Ccircle cx='53' cy='30' r='2' fill='%2394A3B8'/%3E%3C/svg%3E");
  --ink: #0B1622;
  --ink-2: #111F2E;
  --terra-funda: #2B1E15;  /* subsolo: bloco das minas */
  --brand: #0098DA;
  --brand-light: #4FC3F7;
  --link: #0077B6;
  --link-hover: #005A8C;
  --ground: #F4F6F9;
  --surface: #FFFFFF;
  --line: #DDE3EA;
  --text: #0B1622;
  --muted: #4A5B6B;
  --on-dark: #E7EEF4;
  --on-dark-muted: #B8C7D3;
  --ok: #065F46;
  --radius: 16px;
  /* Sistema (29/10/2026): letras em 13 · 15 · 17 · 20 · 24 · 30 px (títulos em clamp); arredondamentos em
     8 (detalhes), 12 (etiquetas e campos), 16 (cartões), 24 (painéis) e pílula; uma sombra só para cartões */
  --sombra: 0 8px 24px rgba(11,22,34,0.08);
  --max: 1080px;
  --font: "Geist", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  /* Cores das fases do Processo Dobem: claras (fundo escuro) e escuras (texto em fundo claro) */
  --f1: #FBBF24; --f1-text: #92400E; --f1-bg: #FEF3C7;   /* Idealiza · âmbar */
  --f2: #4FC3F7; --f2-text: #075985; --f2-bg: #E0F2FE;   /* Desenvolve · azul */
  --f3: #A78BFA; --f3-text: #5B21B6; --f3-bg: #EDE9FE;   /* Disponibiliza · violeta */
  --f4: #34D399; --f4-text: #065F46; --f4-bg: #D1FAE5;   /* Mantém · verde */
  --f5: #FB7185; --f5-text: #9F1239; --f5-bg: #FFE4E6;   /* Aprimora · coral */
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; font-family: var(--font); font-size: 17px; line-height: 1.6; color: var(--text); background: var(--ground); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { margin: 0; line-height: 1.12; text-wrap: balance; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
a { color: var(--link); }
a:hover { color: var(--link-hover); }
:focus-visible { outline: 3px solid var(--brand-light); outline-offset: 3px; border-radius: 8px; }
[hidden] { display: none !important; }

.container { width: 100%; max-width: var(--max); margin: 0 auto; padding-inline: 20px; }
.container--narrow { max-width: 760px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 12px; border-radius: 8px; z-index: 100; }
.skip:focus { left: 8px; }
.label { font-size: 13px; color: var(--link); letter-spacing: 0.02em; }
.section--dark .label, .hero .label { color: var(--brand-light); }
.h2 { font-size: clamp(28px, 6vw, 44px); letter-spacing: -0.025em; font-weight: 800; }
.lead { font-size: clamp(17px, 2.4vw, 20px); color: var(--muted); }
p { text-wrap: pretty; }
.stackv { display: flex; flex-direction: column; gap: 32px; }
.head { display: flex; flex-direction: column; gap: 12px; }

/* Botões */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 24px; border-radius: 12px; font: 700 17px var(--font); text-decoration: none; cursor: pointer; border: 0; transition: transform .3s var(--curva), background .3s var(--curva); text-align: center; }
.btn:hover { transform: translateY(-1px); }
.btn:active, .historia__mais:active, .minas__mais:active, .historia-modal__fechar:active { transform: translateY(1px); }
.btn[disabled], .btn[aria-busy="true"] { opacity: .7; cursor: progress; transform: none; }
.btn--primary { background: var(--brand); color: #04121C; }
.btn--primary:hover { background: #22A8E3; color: #04121C; }
.btn--outline { border: 1px solid rgba(255,255,255,0.3); color: #fff; background: transparent; font-weight: 600; }
.btn--outline:hover { background: rgba(255,255,255,0.08); color: #fff; }
.btn--whats { background: #fff; color: var(--ink); border: 1px solid var(--line); font-weight: 600; }
.btn--whats:hover { color: var(--ink); background: #E9F7EF; }
/* Botão de compra: verde, em pílula, com a seta num círculo escuro (estilo da página do VTSD) */
.btn--comprar { background: #16A34A; color: #fff; border-radius: 999px; min-height: 64px; min-width: min(320px, 100%); padding: 0 9px 0 28px; justify-content: space-between; gap: 18px; font-size: 20px; font-weight: 800; letter-spacing: -0.01em; box-shadow: 0 4px 0 #15803D, 0 14px 30px rgba(22,163,74,0.32); }
.btn--comprar:hover { background: #19B352; color: #fff; }
.btn--comprar::after { content: "↗"; flex: none; width: 46px; height: 46px; border-radius: 50%; background: #1F2933; color: #fff; display: grid; place-items: center; font-size: 24px; font-weight: 700; }
.btn--comprar[aria-busy="true"] { justify-content: center; }
.btn--comprar[aria-busy="true"]::after { display: none; }
.btn--block { width: 100%; }
.btn svg { flex: none; }
.spinner { width: 18px; height: 18px; border: 3px solid rgba(4,18,28,.25); border-top-color: #04121C; border-radius: 50%; animation: gira .8s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }
.actions { display: flex; flex-direction: column; gap: 12px; }
.erro-checkout { background: #FEF3F2; color: #7A271A; border: 1px solid #FECDCA; border-radius: 12px; padding: 14px 16px; font-size: 15px; display: flex; flex-direction: column; gap: 10px; }

/* Barra do topo */
.topbar { background: var(--ink); }
.topbar .container { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 700; }
.brand img { border-radius: 8px; }
.brand b { color: var(--brand-light); }
.topbar__cta { font-size: 15px; min-height: 42px; padding: 0 16px; }
@media (max-width: 480px) { .topbar__cta { font-size: 13px; padding: 0 12px; } }

/* Topo (hero) */
.hero { background: var(--ink); color: var(--on-dark); padding: 24px 0 56px; background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px); background-size: 28px 28px; }
.hero__grid { display: grid; gap: 28px; }
.hero__text { display: flex; flex-direction: column; gap: 16px; }
.hero h1 { font-size: clamp(40px, 11vw, 76px); letter-spacing: -0.035em; font-weight: 800; color: #fff; }
.hero__tagline { font-size: clamp(20px, 4.6vw, 26px); font-weight: 700; color: #fff; line-height: 1.3; }
.hero__sub { color: var(--on-dark-muted); font-size: 20px; }
.hero__nota { font-size: 15px; color: var(--on-dark-muted); }
.hero__nota strong { color: #fff; }

/* Vídeo: miniatura, troca pelo player no clique */
.video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: #000 center / cover no-repeat; border: 1px solid rgba(255,255,255,0.12); }
.video__play { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(4,18,28,0.25); cursor: pointer; display: flex; align-items: center; justify-content: center; color: #fff; font: 600 15px var(--font); }
.video__play:hover { background: rgba(4,18,28,0.1); }
.video__play span { display: inline-flex; align-items: center; gap: 10px; background: var(--brand); color: #04121C; padding: 14px 20px; border-radius: 999px; font-weight: 700; }
.video__thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-vaga { position: relative; aspect-ratio: 16 / 9; }
/* Mini player no canto depois do play (landing.js, flutuar) */
.video__fechar { display: none; }
/* WhatsApp flutuante no canto; sobe quando o vídeo flutua no mesmo canto */
.whats-flutuante { position: fixed; z-index: 55; right: 16px; bottom: 16px; width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff; display: grid; place-items: center; box-shadow: 0 10px 28px rgba(0,0,0,0.30); cursor: pointer; transition: transform .5s var(--curva); }
.whats-flutuante:hover { transform: scale(1.06); color: #fff; }
.whats-flutuante:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
body.com-cookies .whats-flutuante { bottom: 190px; }
body.com-video-flutuante .whats-flutuante { bottom: calc(min(360px, 60vw) * 0.5625 + 40px); }
@media (prefers-reduced-motion: reduce) { .whats-flutuante { transition: none; } }
.video--flutuante { position: fixed; z-index: 60; right: 16px; bottom: 16px; width: min(360px, 60vw); border: 2px solid var(--brand); box-shadow: 0 18px 50px rgba(0,0,0,0.55); animation: video-entra 0.25s ease-out; }
.video--flutuante .video__fechar { display: flex; align-items: center; justify-content: center; position: absolute; z-index: 5; top: 6px; right: 6px; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(4,18,28,0.85); color: #fff; font: 400 24px/1 var(--font); cursor: pointer; }
@keyframes video-entra { from { opacity: 0; transform: translateY(16px); } }
@media (prefers-reduced-motion: reduce) { .video--flutuante { animation: none; } }
.video--vazio { display: flex; align-items: center; justify-content: center; padding: 24px; text-align: center; color: var(--on-dark-muted); background: var(--ink-2); font-size: 15px; }

/* Topo em formato de vídeo de vendas: título-promessa, vídeo grande no centro, botão logo abaixo */
.hero--vsl { background-image: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(0,152,218,0.22), transparent 70%), radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px); background-size: auto, 28px 28px; }
.hero__vsl { display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
.hero--vsl { position: relative; overflow: hidden; }
/* Topo no estilo "título que grita" (30/10/2026, referência Claude 5X): caixa alta, grande, um subtítulo só */
.hero--vsl h1 { font-size: clamp(28px, 5.6vw, 56px); line-height: 0.98; letter-spacing: -0.03em; text-transform: uppercase; max-width: 22ch; text-wrap: balance; margin-top: 22px; }
.h1__alerta { color: var(--f1); }
/* Tarja do Lote Fundador: faixa no alto do topo, com o preço em reais (sem percentual, decisão de 29/10) */
.tarja { position: relative; z-index: 2; display: block; margin: -24px 0 24px; padding: 10px 16px; background: var(--f1); color: #1F1300; text-align: center; text-decoration: none; font: 600 15px/1.35 var(--font); text-wrap: balance; }
.tarja strong { font-weight: 800; }
.tarja:hover { background: #FCD34D; }
.tarja:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }
@media (min-width: 720px) { .tarja { font-size: 17px; } }
@media (min-width: 980px) { .tarja { margin-top: -40px; } }
.hero--vsl .hero__sub { max-width: 58ch; font-size: clamp(17px, 2.2vw, 20px); text-wrap: pretty; color: #E6EEF4; }
/* Logo do Método Mapa da Mina: pequena, direto no fundo, como assinatura da página */
.hero__marca { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.hero__logo { width: clamp(190px, 20vw, 250px); height: auto; }
.hero__assinatura { font-size: 13px; color: var(--on-dark-muted); }
/* Palco do vídeo: título da mentoria e convite presos ao vídeo, num cartão só */
.hero__palco { width: 100%; max-width: 900px; margin-top: 40px; padding: 8px; border-radius: calc(var(--radius) + 8px); background: var(--brand); box-shadow: 0 30px 90px rgba(0,152,218,0.35); text-align: left; }
.hero__palco-topo { display: flex; flex-direction: column; gap: 6px; padding: 10px 10px 14px; }
@media (min-width: 720px) {
  .hero__palco-topo { padding: 14px 14px 16px; }
  /* Vídeo mais largo que o texto, como na página de referência: sai do container, centralizado */
  .hero__palco { width: min(1200px, 100vw - 64px); max-width: none; flex: none; }
}
/* No cartão azul da marca, o texto vai em azul-escuro (contraste) e o nome da mentoria em branco */
.hero__assista { font: 600 15px var(--font); color: #04121C; }
.hero__assista::before { content: "▶ "; }
.hero--vsl .actions { width: 100%; max-width: 900px; margin-top: 8px; }

/* Faixa temporária de pendências (pré-lançamento) */
.pendencias { background: #FEF3C7; color: #78350F; border-bottom: 2px dashed #D97706; font-size: 15px; padding-block: 10px; }

/* Campo Minado: logo do método, frases do topo e faixas */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero--vsl h1 mark { background: none; color: var(--f4); }
.hero__nome { font-size: clamp(17px, 3.4vw, 22px); font-weight: 700; letter-spacing: -0.01em; color: #04121C; line-height: 1.25; }
.hero__nome b { color: #fff; }
.hero__faixa { font-size: 15px; color: #04121C; }
.hero__palco .video { border-radius: var(--radius); }
.autoridade { font-size: 15px; color: var(--on-dark-muted); max-width: 70ch; border-top: 1px solid rgba(255,255,255,0.12); padding-top: 14px; margin-top: 6px; }
.transicao { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 600; color: var(--link); }
.transicao::before { content: ""; flex: none; width: 20px; height: 24px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M3 1.5v21' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M4 2h13l-4 4.5 4 4.5H4z'/%3E%3C/svg%3E") no-repeat center / contain; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M3 1.5v21' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M4 2h13l-4 4.5 4 4.5H4z'/%3E%3C/svg%3E") no-repeat center / contain; }
.section--campo .transicao, .section--dark .transicao { color: var(--f4); }
.stackv--curto { gap: 12px; }
.nota { font-size: 15px; color: var(--muted); }

/* Tabelas (rolagem horizontal no celular) */
.tabela-rola { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabela { width: 100%; min-width: 520px; border-collapse: collapse; background: var(--surface); border-radius: 12px; overflow: hidden; font-size: 17px; }
.tabela th, .tabela td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tabela th { background: var(--ink); color: #fff; font-size: 15px; }
.tabela__total td { font-weight: 700; background: var(--ground); }

/* Campo minado */
.section--campo { background: radial-gradient(circle at 6% 12%, rgba(255,255,255,0.05) 0 3px, transparent 4px), radial-gradient(circle at 94% 30%, rgba(255,255,255,0.04) 0 4px, transparent 5px), radial-gradient(circle at 3% 64%, rgba(255,255,255,0.04) 0 2px, transparent 3px), radial-gradient(circle at 97% 88%, rgba(255,255,255,0.05) 0 3px, transparent 4px), var(--terra-funda); color: var(--on-dark); }
.section--campo .h2, .section--campo h3 { color: #fff; }
.section--campo .lead { color: var(--on-dark-muted); }
.section--campo .lead strong { color: #fff; }
/* Campo minado em camadas: a pessoa desce pelo terreno, em terra clara e contínua (um degradê só, camadas separadas por uma linha fina). As cenas da dor são o
   texto mais forte; cada mina é uma cena ilustrada, com a explosão (caso real ou exemplo) à vista */
.campo { background: radial-gradient(circle at 6% 14%, rgba(255,255,255,0.06) 0 3px, transparent 4px), radial-gradient(circle at 94% 38%, rgba(255,255,255,0.05) 0 4px, transparent 5px), radial-gradient(circle at 4% 70%, rgba(0,0,0,0.10) 0 2px, transparent 3px), radial-gradient(circle at 96% 88%, rgba(255,255,255,0.05) 0 3px, transparent 4px), radial-gradient(circle at 50% 50%, rgba(0,0,0,0.08) 0 2px, transparent 3px), linear-gradient(180deg, #6B4A2E 0, #7A5636 50%, #8B6542 100%); color: #FFF7EC; }
.campo .h2, .campo h3, .campo h4 { color: #fff; }
.campo .lead { color: #FFF7EC; }
.campo .transicao { color: #FDE68A; }
.campo__abertura { padding-block: 64px 40px; }
.campo__euforia { font-size: clamp(20px, 3.4vw, 24px); line-height: 1.45; color: #fff; }
.camada { padding: 40px 0; border-top: 1px solid rgba(255,255,255,0.14); }
.camada__head { display: flex; flex-direction: column; gap: 6px; }
.camada__head h3 { font-size: clamp(24px, 4.6vw, 32px); letter-spacing: -0.02em; }
.camada__head p { color: #FFF7EC; }
.dor-cenas { list-style: none; display: grid; gap: 14px; }
.dor-cena { font-size: clamp(18px, 2.6vw, 20px); line-height: 1.5; color: #FFF7EC; }
.dor-cena strong { display: block; color: #fff; font-size: clamp(20px, 3vw, 24px); margin-bottom: 4px; }
.minas-cenas { list-style: none; display: grid; gap: 16px; }
.mina-cena { background: #FBF6EC; border: 1px solid rgba(0,0,0,0.12); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.mina-cena__arte { display: block; width: 100%; height: auto; aspect-ratio: 5 / 3; }
.mina-cena__texto { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; }
.mina-cena .mina__num { color: #B45309; }
.mina-cena h4 { font-size: 20px; line-height: 1.25; margin: 0; color: var(--text); }
.mina-cena__oque { color: var(--muted); font-size: 15px; }
.mina-cena__explosao { font-size: 15px; color: var(--text); background: #FFF3DC; border: 1px solid #F5D9A6; border-radius: 10px; padding: 10px 12px; }
.mina-cena__explosao b { display: block; color: #92400E; font-size: 13px; margin-bottom: 2px; }
.mina-cena__porque summary { cursor: pointer; font-weight: 600; color: var(--link); font-size: 15px; list-style: none; }
.mina-cena__porque summary::-webkit-details-marker { display: none; }
.mina-cena__porque summary::after { content: " +"; }
.mina-cena__porque[open] summary::after { content: " −"; }
.mina-cena__porque p { font-size: 15px; color: var(--muted); margin-top: 10px; }
.mina-cena__porque b { display: block; color: var(--text); font-size: 13px; margin-bottom: 2px; }
.campo__fecho { padding-block: 8px 72px; }
.camada:not(.camada--completa) .mina-cena--extra { display: none; }
.minas__mais { align-self: center; font: 600 17px var(--font); color: #FDE68A; background: transparent; border: 1.5px solid rgba(253,230,138,0.6); border-radius: 999px; padding: 10px 22px; cursor: pointer; }
.minas__mais:hover { border-color: #FDE68A; }
/* A virada: a terra clareia até o papel e a pessoa vê o mapa pela primeira vez */
.virada { background: linear-gradient(180deg, #8B6542 0, #C9AC86 110px, #F1E4CC 210px, #FBF3E2 280px); padding: 240px 0 64px; }
.virada__texto { text-align: center; align-items: center; }
.virada .h2 { text-wrap: balance; }
.virada__pergunta { font-size: clamp(20px, 3.4vw, 24px); font-weight: 600; color: var(--text); text-wrap: balance; }
.virada .lead { max-width: 58ch; }
.virada__mapa { font-size: clamp(44px, 10vw, 80px); font-weight: 800; letter-spacing: -0.04em; line-height: 1; color: #0077B6; }
.virada__arte { margin-top: 32px; }
.virada__arte svg { display: block; width: 100%; max-width: 880px; height: auto; margin-inline: auto; filter: drop-shadow(0 12px 28px rgba(43,30,21,0.18)); }
@media (max-width: 719px) {
  .mina-cena__arte { aspect-ratio: 2 / 1; object-fit: cover; object-position: 50% 100%; }
  .dor-cena { font-size: 17px; }
}
@media (min-width: 720px) {
  .minas-cenas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
  .camada--3 .minas-cenas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.minas-grupo { display: flex; flex-direction: column; gap: 10px; }
.minas-grupo h3 { font-size: 24px; }
.minas-grupo__apoio { color: var(--on-dark-muted); font-size: 17px; }
.mina h4 { margin: 0; font-size: 20px; line-height: 1.2; color: var(--text); }
.mina__oque b { color: var(--text); }
.fecho--escuro { color: #fff; }

/* Quem conduz, kit, conta e oferta */
.mentor__assina { color: var(--muted); }
.mentor__formacao { color: var(--muted); font-size: 15px; }
.mentor__lado { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.mentor__linkedin { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--link); }
.mentor__linkedin:hover { text-decoration: underline; }
.mentor__lead { font-size: 18px; line-height: 28px; text-wrap: pretty; }
/* Quem conduz (30/10/2026): autoridade primeiro, três casos com número e duas partes curtas */
.quem-conduz { display: flex; flex-direction: column; gap: 32px; }
.casos { list-style: none; display: grid; gap: 16px; }
.caso { display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--line); border-radius: 16px; padding: 20px; background: var(--surface); }
.caso__num { font-size: 24px; line-height: 32px; font-weight: 700; color: var(--link); }
.caso h4 { font-size: 18px; line-height: 28px; }
.caso p:last-child { color: var(--muted); font-size: 16px; text-wrap: pretty; }
.quem-conduz__parte { display: flex; flex-direction: column; gap: 12px; }
.quem-conduz__parte h3 { font-size: 24px; line-height: 32px; }
.quem-conduz__titulo { font-size: 24px; line-height: 32px; }
.empreende { list-style: none; display: grid; gap: 16px; }
.empreende li { color: var(--muted); text-wrap: pretty; }
.empreende li strong { color: var(--text); }
.quem-conduz .historia__mais { align-self: flex-start; justify-self: start; }
.quem-conduz__rodape { display: flex; flex-direction: column; gap: 16px; }
/* A história completa em capítulos abre num modal */
.historia-modal { width: min(1040px, calc(100vw - 32px)); max-height: calc(100vh - 32px); margin: auto; padding: 0; border: 0; border-radius: 24px; background: var(--surface); color: var(--text); box-shadow: var(--sombra); }
.historia-modal::backdrop { background: rgba(11,22,34,0.72); }
.historia-modal__topo { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 24px; background: var(--surface); border-bottom: 1px solid var(--line); }
.historia-modal__topo h3 { font-size: 20px; }
.historia-modal__fechar { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--text); font: 600 24px/1 var(--font); cursor: pointer; }
.historia-modal__fechar:hover { border-color: var(--link); }
.historia-modal .historia-caixa { padding: 24px; }
.historia-modal .fecho { margin-top: 8px; }
@media (min-width: 860px) { .historia-modal .historia-caixa { padding: 32px 40px; } }
@media (min-width: 960px) {
  /* dentro do modal, a história ocupa a largura do modal, sem a caixa larga da página */
  .historia-modal .historia-caixa { width: auto; margin-left: 0; transform: none; }
  .historia-modal .capitulo { column-gap: 40px; }
}
@media (min-width: 860px) {
  .quem-conduz { width: min(1240px, calc(100vw - 96px)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
  .casos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* título à esquerda, texto à direita, como no painel "O que você vai aprender": sem sobra no lado direito */
  .quem-conduz__parte { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); column-gap: 48px; row-gap: 12px; align-items: start; }
  .quem-conduz__parte > h3 { grid-column: 1; }
  .quem-conduz__parte > :not(h3) { grid-column: 2; }
  .quem-conduz__rodape { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); column-gap: 48px; }
  .quem-conduz__rodape > * { grid-column: 2; }
}
.jornada p { margin-top: 6px; color: var(--text); }
.jornada em { font-style: normal; font-weight: 700; color: var(--link); }
.container--oferta { max-width: 860px; }
.kit { background: var(--ink); color: var(--on-dark); border-radius: 24px; padding: 24px 20px; display: flex; flex-direction: column; gap: 14px; }
.kit h3 { font-size: clamp(22px, 5vw, 30px); color: #fff; }
.kit__selo { align-self: flex-start; font: 600 13px var(--font); background: var(--f4); color: #04121C; border-radius: 999px; padding: 4px 12px; }
.kit .nota { color: var(--on-dark-muted); }
.kit .tabela { color: var(--text); }
.conta { display: flex; flex-direction: column; gap: 12px; }
.conta h3 { font-size: 24px; }
.conta__fecho { font-size: 20px; }
.oferta h2 { font-size: clamp(24px, 5vw, 32px); }
.cta-bloco { display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
.final__lote { font-weight: 700; color: #fff; }
/* Chamada final: texto e botões lado a lado à esquerda, ilustração do mapa à direita */
.final__grade { display: grid; gap: 32px; align-items: center; }
.final__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.final__acoes .btn--outline { min-height: 64px; border-radius: 999px; padding: 0 26px; }
.final__ilustra { margin: 0; order: -1; justify-self: center; width: min(300px, 80%); }
.final__ilustra img, .final__ilustra .mapa-vivo { width: 100%; height: auto; display: block; border-radius: 24px; box-shadow: 0 24px 60px rgba(0,0,0,0.35); }
/* O mapa final ganha vida uma vez, quando aparece: o pontilhado é traçado do início ao produto no ar (31/10/2026) */
.mapa-vivo__mascara { stroke-dasharray: var(--len, 2000); stroke-dashoffset: var(--len, 2000); transition: stroke-dashoffset 4s cubic-bezier(0.4, 0, 0.6, 1); }
.mapa-vivo__ponto { offset-path: path("M60 250C140 250 150 170 220 170S300 90 380 110S470 230 540 200S640 80 740 90"); offset-distance: 0%; offset-rotate: 0deg; opacity: 0; transition: offset-distance 4s cubic-bezier(0.4, 0, 0.6, 1), opacity .3s; }
.mapa-vivo__chegada { transform-origin: 740px 90px; transform-box: view-box; }
.final__ilustra.mapa-vivo--tracando .mapa-vivo__mascara { stroke-dashoffset: 0; }
.final__ilustra.mapa-vivo--tracando .mapa-vivo__ponto { offset-distance: 100%; opacity: 1; }
.final__ilustra.mapa-vivo--tracando .mapa-vivo__chegada { animation: mapa-chega .6s var(--curva) 3.9s 1 both; }
@keyframes mapa-chega { 50% { transform: scale(1.3); } }
@media (prefers-reduced-motion: reduce) { .mapa-vivo__mascara { stroke-dashoffset: 0 !important; transition: none; } .mapa-vivo__ponto { display: none; } .final__ilustra.mapa-vivo--tracando .mapa-vivo__chegada { animation: none; } }
@media (min-width: 960px) {
  .final__grade { grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.7fr); column-gap: 48px; }
  .final__ilustra { order: 0; width: 100%; }
  .final__acoes { flex-wrap: nowrap; }
  .final__acoes .btn { white-space: nowrap; }
  .final__acoes .btn--comprar { min-width: 0; }
}

/* Prova e garantia embaixo dos botões de compra */
.prova { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 15px; color: var(--on-dark-muted); }
.prova__item::before { content: "✓"; margin-right: 6px; color: var(--f4); font-weight: 800; }
.prova strong { color: #fff; }
.hero--vsl .prova, .cta-faixa .prova { justify-content: center; }
.section .prova { color: var(--muted); }
.section .prova strong { color: var(--text); }
.section--dark .prova { color: var(--on-dark-muted); }
.section--dark .prova strong { color: #fff; }
.oferta .prova { justify-content: center; color: var(--muted); }
.oferta .prova__item::before { color: var(--ok); }

/* Seções */
.section { padding-block: 64px; }
.section--white { background: var(--surface); border-block: 1px solid var(--line); }
.section--dark { background: var(--ink); color: var(--on-dark); }
.section--dark .lead { color: var(--on-dark-muted); }
.section--dark .h2 { color: #fff; }

/* Faixa de ação entre seções */
.cta-faixa { background: var(--ink); color: var(--on-dark); padding-block: 32px; }
.cta-faixa .container { display: flex; flex-direction: column; gap: 14px; }
.cta-faixa p { font-size: 20px; font-weight: 600; color: #fff; }
.cta-faixa__acao { display: flex; flex-direction: column; gap: 10px; }
.cta-faixa .prova { font-size: 15px; font-weight: 400; color: var(--on-dark-muted); }

/* Lista da dor */
/* Bloco "A oportunidade": o gramado feliz que a IA vende. Promessa (o convite) e prova (os números) na mesma superfície */
.convite__abertura { display: grid; gap: 24px; align-items: center; }
.convite__arte { width: 100%; max-width: 380px; justify-self: center; }
.convite__arte svg { display: block; width: 100%; height: auto; }
.convite__pausa { text-align: center; font-size: clamp(44px, 11vw, 88px); font-weight: 800; letter-spacing: -0.04em; line-height: 1; padding-block: 12px; color: var(--ink); }
.convite__pausa::after { content: ""; display: block; width: 72px; height: 6px; margin: 18px auto 0; border-radius: 8px; background: var(--f1); }
.convite__motivos { display: flex; flex-direction: column; gap: 18px; }
.convite__motivos h3 { font-size: clamp(22px, 4.4vw, 30px); letter-spacing: -0.02em; text-align: center; text-wrap: balance; }
.motivos { list-style: none; display: grid; gap: 14px; }
.motivo { background: var(--surface); border: 1px solid #BBF7D0; border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 12px; box-shadow: var(--sombra); }
.motivo__icone { width: 44px; height: 44px; border-radius: 12px; background: #DCFCE7; color: #15803D; display: grid; place-items: center; flex: none; }
.motivo__icone svg { width: 24px; height: 24px; }
.motivo p { font-size: 17px; color: var(--muted); }
.motivo strong { display: block; font-size: 20px; line-height: 1.3; color: var(--text); margin-bottom: 4px; }
.motivo--dev { border-style: dashed; border-color: #4ADE80; background: #F0FDF4; }
.convite__janela { background: linear-gradient(135deg, var(--f1), #F59E0B); color: var(--ink); border-radius: var(--radius); padding: 24px 22px; font-size: 20px; text-align: center; box-shadow: var(--sombra); text-wrap: pretty; }
.convite__janela strong { display: block; font-size: clamp(24px, 5vw, 32px); letter-spacing: -0.02em; line-height: 1.15; margin-bottom: 6px; }
@media (max-width: 719px) {
  .motivo { flex-direction: row; align-items: flex-start; padding: 14px 16px; gap: 14px; }
  .motivo__icone { width: 36px; height: 36px; }
  .motivo__icone svg { width: 20px; height: 20px; }
  .motivo p { font-size: 15px; }
  .motivo strong { font-size: 17px; }
}
@media (min-width: 720px) {
  .motivos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .motivo--dev { grid-column: 1 / -1; flex-direction: row; align-items: center; }
  .motivo--dev strong { display: inline; }
}
@media (min-width: 960px) {
  .convite__abertura { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 48px; }
  .convite__arte { order: 2; max-width: 440px; }
  .motivos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* O gramado: a grama nasce logo abaixo do vídeo e o verde dela se funde com o fundo; a terra só aparece na ponte */
.gramado { padding-top: 76px; }
.gramado__prova { margin-top: 56px; }
.gramado__intro { text-align: center; font-size: 20px; font-weight: 600; color: var(--text); max-width: 46ch; margin-inline: auto; text-wrap: balance; }
.gramado { position: relative; --grama-1: #FAFDFB; --grama-2: #EFF8F1;
  background:
    linear-gradient(180deg, #2FBF6B 0, rgba(47,191,107,0.55) 36px, rgba(47,191,107,0.18) 96px, transparent 170px),
    linear-gradient(180deg, var(--grama-2) 0, var(--grama-1) calc(100% - 520px)); }
/* Grama nascendo por cima do fim do topo escuro */
.gramado::before { content: ""; position: absolute; left: 0; right: 0; top: -26px; height: 28px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath fill='%231F9D55' d='M0 40V26C3 20 5 12 6 4C7 14 9 22 12 28C15 18 18 10 22 0C23 12 24 22 27 29C30 20 34 14 38 8C38 18 39 24 42 30C45 22 47 14 50 6C51 16 53 24 56 30C59 20 62 12 66 2C67 14 68 22 71 29C74 22 78 16 82 10C82 20 83 26 86 31C89 22 92 14 95 5C96 16 98 24 101 30C104 20 108 12 112 4C112 16 114 24 117 29L120 26V40Z'/%3E%3Cpath fill='%232FBF6B' d='M0 40V34C4 30 6 24 8 16C9 24 11 30 14 34C17 28 20 22 24 14C25 24 27 30 30 35C33 30 36 26 40 20C40 28 42 32 45 35C48 30 51 24 54 16C55 24 57 30 60 34C63 28 66 22 70 15C71 24 73 30 76 35C79 30 82 26 86 20C86 28 88 32 91 35C94 30 97 24 100 17C101 25 103 30 106 34C109 28 113 22 116 16C116 26 118 32 120 34V40Z'/%3E%3C/svg%3E") 37px bottom / 173px 24px repeat-x, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath fill='%231F9D55' d='M0 40V26C3 20 5 12 6 4C7 14 9 22 12 28C15 18 18 10 22 0C23 12 24 22 27 29C30 20 34 14 38 8C38 18 39 24 42 30C45 22 47 14 50 6C51 16 53 24 56 30C59 20 62 12 66 2C67 14 68 22 71 29C74 22 78 16 82 10C82 20 83 26 86 31C89 22 92 14 95 5C96 16 98 24 101 30C104 20 108 12 112 4C112 16 114 24 117 29L120 26V40Z'/%3E%3Cpath fill='%232FBF6B' d='M0 40V34C4 30 6 24 8 16C9 24 11 30 14 34C17 28 20 22 24 14C25 24 27 30 30 35C33 30 36 26 40 20C40 28 42 32 45 35C48 30 51 24 54 16C55 24 57 30 60 34C63 28 66 22 70 15C71 24 73 30 76 35C79 30 82 26 86 20C86 28 88 32 91 35C94 30 97 24 100 17C101 25 103 30 106 34C109 28 113 22 116 16C116 26 118 32 120 34V40Z'/%3E%3C/svg%3E") 0 bottom / 120px 28px repeat-x; transform-origin: bottom; }
.gramado--viva::before { animation: grama-balanca 2.4s ease-in-out 1; }
@keyframes grama-balanca { 30% { transform: skewX(-3deg); } 70% { transform: skewX(2deg); } }
@media (prefers-reduced-motion: reduce) { .gramado::before { animation: none; } }
.gramado .lead strong { color: var(--text); }
.gramado__grupo { display: flex; flex-direction: column; gap: 14px; }
.gramado__grupo h3 { font-size: clamp(20px, 4vw, 24px); color: var(--f4-text); display: flex; align-items: flex-end; gap: 8px; }
.gramado__grupo h3::before { content: ""; flex: none; width: 22px; height: 16px; margin-bottom: 4px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 16'%3E%3Cpath fill='%2334D399' d='M1 16C3 11 4 6 4 0C6 6 7 11 7 16ZM7 16C9 10 12 5 17 2C14 7 12 11 12 16ZM12 16C14 12 17 9 21 8C18 11 17 13 16 16Z'/%3E%3C/svg%3E") no-repeat center / contain; }
/* Placar: os números em gráficos (validados com a skill dataviz). Barras finas com ponta arredondada, um verde só
   (#15803D) para o dado em destaque e cinza (#64748B) para o de comparação; valores em cor de texto, todos escritos */
.placar { display: grid; gap: 18px; }
.placar__painel { background: var(--surface); border-radius: 24px; padding: 22px 20px; box-shadow: var(--sombra); display: flex; flex-direction: column; gap: 6px; }
.placar__painel h3 { font-size: clamp(20px, 4vw, 24px); color: var(--f4-text); display: flex; align-items: flex-end; gap: 8px; }
.placar__painel h3::before { content: ""; flex: none; width: 22px; height: 16px; margin-bottom: 4px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 16'%3E%3Cpath fill='%2334D399' d='M1 16C3 11 4 6 4 0C6 6 7 11 7 16ZM7 16C9 10 12 5 17 2C14 7 12 11 12 16ZM12 16C14 12 17 9 21 8C18 11 17 13 16 16Z'/%3E%3C/svg%3E") no-repeat center / contain; }
.placar__graficos { display: grid; }
.grafico { margin: 0; padding: 14px 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.grafico:first-child { border-top: 0; }
.grafico__titulo { font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--text); text-wrap: pretty; }
.grafico__legenda { font-size: 15px; color: var(--muted); }
.medidor { display: flex; align-items: center; gap: 12px; }
.medidor__trilho, .barra__trilho { flex: 1; height: 14px; background: #DCFCE7; border-radius: 4px; overflow: hidden; }
.medidor__fill, .barra__fill { display: block; height: 100%; width: var(--v); background: #15803D; border-radius: 0 4px 4px 0; }
.medidor__valor { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; color: var(--text); min-width: 3ch; }
.barras { display: grid; gap: 8px; }
.barra { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.barra__nome { font-size: 15px; color: var(--muted); }
.barra__trilho { background: transparent; }
.barra__fill { background: #64748B; }
.barra--destaque .barra__fill { background: #15803D; }
.barra__valor { font-size: 17px; font-weight: 700; color: var(--text); white-space: nowrap; }
.barra--destaque .barra__nome { color: var(--text); font-weight: 600; }
.icones { display: flex; gap: 8px; }
.icones--dez { flex-wrap: wrap; gap: 6px; max-width: 320px; }
.icones--dez .icones__item { width: 26px; height: 26px; }
/* Colunas: crescimento no tempo, da esquerda para a direita; a mais recente em destaque */
.colunas { display: flex; align-items: flex-end; gap: 28px; padding-top: 26px; border-bottom: 1px solid var(--line); }
.coluna { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.coluna__area { height: 120px; width: 56px; display: flex; align-items: flex-end; }
.coluna__barra { position: relative; display: block; width: 100%; height: var(--v); background: #64748B; border-radius: 4px 4px 0 0; }
.coluna--destaque .coluna__barra { background: #15803D; }
.coluna__valor { position: absolute; left: 50%; bottom: calc(100% + 4px); transform: translateX(-50%); white-space: nowrap; font-size: 15px; font-weight: 700; color: var(--text); }
.coluna__nome { font-size: 13px; color: var(--muted); padding-bottom: 6px; }
.coluna--destaque .coluna__nome { color: var(--text); font-weight: 600; }
/* Rosca: partes de um todo (90/5/3, e os 2% que a fonte não detalha), com a legenda ao lado */
.rosca { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.rosca svg { width: 130px; height: 130px; flex: none; }
.rosca__legenda { list-style: none; display: grid; gap: 6px; font-size: 15px; color: var(--muted); flex: 1; min-width: 160px; }
.rosca__legenda li { display: flex; align-items: baseline; gap: 6px; }
.rosca__legenda span { flex: none; width: 10px; height: 10px; border-radius: 2px; transform: translateY(1px); }
.rosca__legenda b { color: var(--text); }
.icones__item { width: 34px; height: 34px; fill: #CBD5E1; }
.icones__item--destaque { fill: #15803D; }
@media (min-width: 720px) {
  .placar__painel { padding: 26px 28px; }
  .placar__graficos { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); column-gap: 32px; }
  .grafico:first-child { border-top: 1px solid var(--line); }
  .placar__graficos .grafico { border-top: 1px solid var(--line); }
}
.gramado__destaque, .convite__destaque { text-align: center; font-size: clamp(28px, 6.4vw, 48px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; text-wrap: balance; }
.gramado__destaque span, .convite__destaque span { background: linear-gradient(transparent 58%, var(--f1) 58%); padding-inline: 4px; }
.gramado__fontes { text-align: center; font-size: 13px; color: var(--muted); }
/* Ponte = a terra mais funda: escurece até o escuro das minas, com uma mina enterrada no caminho */
.gramado__ponte { margin-top: 64px; color: #FFF7EC; padding: 190px 0 48px; text-align: center; position: relative;
  background:
    radial-gradient(circle at 12% 34px, rgba(139,101,66,0.18) 0 3px, transparent 4px),
    radial-gradient(circle at 80% 26px, rgba(139,101,66,0.16) 0 4px, transparent 5px),
    radial-gradient(circle at 30% 74px, rgba(139,101,66,0.12) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 88px, rgba(139,101,66,0.12) 0 3px, transparent 4px),
    linear-gradient(180deg, var(--grama-1) 0, #CFDCB9 46px, #A9906A 96px, #7A5636 150px, #6B4A2E 200px); }
.gramado__mina { position: absolute; left: 50%; top: 40px; transform: translateX(-50%); width: 168px; height: 100px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 48'%3E%3Ccircle cx='40' cy='12' r='10' fill='%23FBBF24' opacity='.28'/%3E%3Cpath d='M40 14V7' stroke='%2394A3B8' stroke-width='3'/%3E%3Ccircle cx='40' cy='7' r='4' fill='%23FBBF24'/%3E%3Cpath fill='%23334155' stroke='%2364748B' stroke-width='2' d='M14 40A26 24 0 0 1 66 40Z'/%3E%3Crect x='9' y='37' width='62' height='7' rx='3.5' fill='%23475569'/%3E%3Ccircle cx='27' cy='30' r='2' fill='%2394A3B8'/%3E%3Ccircle cx='40' cy='25' r='2' fill='%2394A3B8'/%3E%3Ccircle cx='53' cy='30' r='2' fill='%2394A3B8'/%3E%3Cpath fill='%234A3019' d='M0 48C12 40 24 41 40 43C56 41 68 40 80 48Z'/%3E%3C/svg%3E") no-repeat center / contain; filter: drop-shadow(0 0 10px rgba(251,191,36,0.25)); }
.gramado__ponte p { font-size: clamp(17px, 2.6vw, 20px); }
.gramado__ponte strong { color: #FDE68A; }
.gramado__ponte::after { content: "↓"; position: absolute; left: 50%; bottom: -22px; transform: translateX(-50%); width: 44px; height: 44px; border-radius: 50%; background: #6B4A2E; color: #FDE68A; display: grid; place-items: center; font-size: 24px; font-weight: 800; border: 2px solid #F59E0B; }
/* Bloco "O método": o mapa, em fundo escuro; as 5 fases nas cores do Processo Dobem */
.metodo .lead strong { color: #fff; }
.metodo__porque { list-style: none; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.metodo__porque li { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 6px; }
.metodo__porque h3 { font-size: 20px; color: #fff; }
.metodo__porque p { color: var(--on-dark-muted); font-size: 17px; }
.metodo__fases { display: flex; flex-direction: column; gap: 16px; }
.metodo__fases > h3 { font-size: clamp(20px, 4vw, 24px); color: #fff; }
.fases { list-style: none; display: grid; gap: 14px; }
.fase { --c: var(--f1); position: relative; background: var(--surface); color: var(--text); border-top: 6px solid var(--c); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.fase.f2 { --c: var(--f2); } .fase.f3 { --c: var(--f3); } .fase.f4 { --c: var(--f4); } .fase.f5 { --c: var(--f5); }
.fase__num { width: 36px; height: 36px; border-radius: 50%; background: var(--c); color: #04121C; display: grid; place-items: center; font-weight: 800; font-size: 17px; }
.fase h4 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -0.01em; }
.fase p { color: var(--muted); font-size: 15px; }
.fase__enc { align-self: flex-start; font-size: 13px; font-weight: 600; background: var(--c); color: #04121C; border-radius: 999px; padding: 2px 10px; }
.fases__ciclo { align-self: center; text-align: center; font-size: 15px; color: var(--f4); border: 1px dashed rgba(52,211,153,0.6); border-radius: 999px; padding: 8px 16px; }
.fases__ciclo::before { content: "↺ "; font-size: 17px; }
@media (min-width: 960px) {
  .fases { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 22px; }
  .fase:not(:last-child)::after { content: "→"; position: absolute; right: -19px; top: 26px; color: var(--on-dark-muted); font-size: 20px; font-weight: 800; }
}
.dores { list-style: none; display: grid; gap: 12px; }
.dores strong { display: block; }
.fecho { font-size: 20px; font-weight: 700; }

/* Para quem é / não é */
.paraquem { display: grid; gap: 16px; }
.paraquem__col { border-radius: var(--radius); padding: 22px 20px; display: flex; flex-direction: column; gap: 14px; border: 1px solid var(--line); background: var(--ground); }
.paraquem__col h3 { font-size: 20px; }
.paraquem__col ul { list-style: none; display: grid; gap: 10px; }
.paraquem__col li { padding-left: 30px; position: relative; }
.paraquem__col li::before { position: absolute; left: 0; top: 0; font-weight: 800; }
.paraquem__col--sim { border-top: 4px solid var(--ok); }
.paraquem__col--sim li::before { content: "✓"; color: var(--ok); }
.paraquem__col--nao { border-top: 4px solid #B42318; }
.paraquem__col--nao li::before { content: "✕"; color: #B42318; }

/* Minas: cards com acordeão */
.minas { list-style: none; display: grid; gap: 12px; counter-reset: mina; }
.mina { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.mina summary { list-style: none; cursor: pointer; padding: 18px 48px 18px 18px; position: relative; display: flex; flex-direction: column; gap: 6px; }
.mina summary::-webkit-details-marker { display: none; }
.mina summary::after { content: "+"; position: absolute; right: 18px; top: 16px; font: 500 24px var(--font); color: var(--link); }
.mina[open] summary::after { content: "–"; }
.mina__num { font-family: var(--mono); font-size: 13px; font-weight: 600; color: #B42318; display: inline-flex; align-items: center; gap: 8px; }
.mina__num::before { content: ""; width: 34px; height: 20px; flex: none; background: var(--icone-mina) no-repeat center / contain; }
.mina h3 { font-size: 20px; letter-spacing: -0.01em; }
.mina__oque { color: var(--muted); }
.mina__corpo { padding: 0 18px 18px; display: flex; flex-direction: column; gap: 12px; }
.mina__corpo p { color: var(--text); }
.mina__corpo b { display: block; font-size: 13px; font-weight: 600; color: var(--link); margin-bottom: 2px; }
.mina__corpo .evita { background: var(--f4-bg); border-radius: 12px; padding: 12px 14px; }
.mina__corpo .evita b { color: var(--f4-text); }
.mina__tag { display: inline-block; font-size: 13px; border-radius: 999px; padding: 2px 8px; background: #F2F4F7; color: var(--muted); }

/* Processo Dobem: 5 etapas */
.etapas { list-style: none; display: grid; gap: 12px; }
.etapa { border-radius: var(--radius); padding: 18px; background: rgba(var(--rgb), 0.1); border: 1px solid rgba(var(--rgb), 0.35); display: flex; flex-direction: column; gap: 6px; }
.etapa__num { font-size: 13px; color: rgb(var(--rgb)); }
.etapa h3 { font-size: 24px; color: #fff; }
.etapa p { color: var(--on-dark-muted); }
.f1 { --rgb: 251,191,36; } .f2 { --rgb: 79,195,247; } .f3 { --rgb: 167,139,250; } .f4 { --rgb: 52,211,153; } .f5 { --rgb: 251,113,133; }

/* Como funciona */
.blocos { list-style: none; display: grid; gap: 12px; }
.blocos li { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
/* Jornada em forma de caminho: cartões nas cores das fases, um levando ao outro por setas pontilhadas */
.trilha { list-style: none; display: flex; flex-direction: column; gap: 56px; max-width: 860px; width: 100%; margin-inline: auto; }
.passo { --c: var(--f1); --c-bg: var(--f1-bg); --c-txt: var(--f1-text); position: relative; background: var(--surface); border: 1px solid var(--line); border-top: 6px solid var(--c); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--sombra); }
.passo.f2 { --c: var(--f2); --c-bg: var(--f2-bg); --c-txt: var(--f2-text); }
.passo.f3 { --c: var(--f3); --c-bg: var(--f3-bg); --c-txt: var(--f3-text); }
.passo.f5 { --c: var(--f5); --c-bg: var(--f5-bg); --c-txt: var(--f5-text); }
.passo__topo { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.passo__num { width: 40px; height: 40px; border-radius: 50%; background: var(--c); color: #04121C; display: grid; place-items: center; font-weight: 800; font-size: 20px; }
.passo__enc { font-size: 13px; font-weight: 600; color: var(--muted); }
.passo__fase { margin-left: auto; font-size: 13px; font-weight: 700; color: var(--c-txt); background: var(--c-bg); border-radius: 999px; padding: 3px 12px; }
.passo h3 { font-size: clamp(22px, 4.4vw, 26px); letter-spacing: -0.015em; }
.passo p { color: var(--text); }
.passo b { font-weight: 700; color: var(--c-txt); }
.passo__minas { position: relative; padding-left: 40px; font-size: 15px; }
.passo__minas::before { content: ""; position: absolute; left: 0; top: 3px; width: 30px; height: 18px; background: var(--icone-mina) no-repeat center / contain; }
.passo__leva { background: var(--c-bg); border-radius: 12px; padding: 12px 14px; font-size: 15px; }
/* Seta pontilhada até o próximo encontro: a linha sai do cartão e a ponta fica no topo do próximo */
.passo:not(:last-child)::after { content: ""; position: absolute; left: calc(50% - 1px); top: calc(100% + 6px); height: 40px; border-left: 2px dashed #94A3B8; }
.passo + .passo .passo__topo::before { content: ""; position: absolute; left: calc(50% - 7px); top: -16px; border: 7px solid transparent; border-top: 9px solid #94A3B8; border-bottom: 0; }
@media (min-width: 960px) {
  /* No computador, os cartões alternam de lado e a seta faz a curva de um para o outro */
  .trilha { gap: 72px; }
  .passo { width: 72%; }
  .passo:nth-child(even) { align-self: flex-end; }
  .passo:not(:last-child)::after { left: calc(50% - 1px); height: 30px; width: calc(100% * 0.39 + 2px); border-bottom: 2px dashed #94A3B8; border-bottom-left-radius: 20px; }
  .passo:nth-child(even):not(:last-child)::after { left: auto; right: calc(50% - 1px); border-left: 0; border-right: 2px dashed #94A3B8; border-bottom-left-radius: 0; border-bottom-right-radius: 20px; }
  .passo:not(:last-child)::before { content: ""; position: absolute; left: calc(50% + 100% * 0.39 - 1px); top: calc(100% + 34px); height: 28px; border-left: 2px dashed #94A3B8; }
  .passo:nth-child(even):not(:last-child)::before { left: auto; right: calc(50% + 100% * 0.39 - 1px); border-left: 0; border-right: 2px dashed #94A3B8; }
}
/* "O que você vai aprender": os subtemas em etiquetas, nas cores das fases */
.aprende { display: grid; gap: 24px; align-items: start; margin-top: 16px; }
.aprende__titulo { font-size: clamp(30px, 6vw, 42px); font-weight: 800; letter-spacing: -0.025em; line-height: 1.08; }
.aprende__head { display: flex; flex-direction: column; gap: 12px; cursor: pointer; list-style: none; }
.aprende__head::-webkit-details-marker { display: none; }
.aprende__abrir { align-self: flex-start; font-weight: 600; color: var(--link); }
.aprende__abrir::after { content: " +"; }
.aprende[open] .aprende__abrir::after { content: " −"; }
.aprende[open] .aprende__abrir { display: none; }
.aprende__head p { color: var(--muted); font-size: 20px; }
.aprende__painel { background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 22px; display: flex; flex-direction: column; gap: 18px; box-shadow: var(--sombra); }
.aprende__grupo { --c-bg: var(--f1-bg); --c-txt: var(--f1-text); display: flex; flex-direction: column; gap: 8px; }
.aprende__grupo.f2 { --c-bg: var(--f2-bg); --c-txt: var(--f2-text); }
.aprende__grupo.f3 { --c-bg: var(--f3-bg); --c-txt: var(--f3-text); }
.aprende__grupo.f5 { --c-bg: var(--f5-bg); --c-txt: var(--f5-text); }
.aprende__enc { font-size: 13px; font-weight: 600; color: var(--c-txt); }
.temas { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px; }
.temas li { display: flex; flex-direction: column; gap: 2px; background: var(--c-bg); color: var(--c-txt); border-radius: 12px; padding: 8px 12px; }
.temas__termo { font-weight: 600; font-size: 15px; }
.temas__trad { font-size: 14px; line-height: 20px; color: var(--muted); text-wrap: pretty; }
@media (min-width: 960px) {
  .aprende[open] { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); column-gap: 48px; }
  /* fechado, o painel some: o título ocupa a linha toda, sem a coluna da direita vazia */
  .aprende:not([open]) .aprende__head p { max-width: 60ch; }
  .aprende__head { position: sticky; top: 24px; }
}
/* Transformação: dois cartões, sem e com o Mapa da Mina */
.compara { display: grid; gap: 20px; }
.compara__cartao { --c: #DC2626; --c-bg: #FEE2E2; background: var(--surface); border: 1px solid var(--line); border-radius: 24px; padding: 26px 24px; display: flex; flex-direction: column; gap: 14px; box-shadow: var(--sombra); }
.compara__cartao--com { --c: #059669; --c-bg: #D1FAE5; }
.compara__icone { width: 48px; height: 48px; border-radius: 12px; background: var(--c); color: #fff; display: grid; place-items: center; }
.compara__cartao h3 { font-size: clamp(24px, 4.4vw, 30px); letter-spacing: -0.02em; line-height: 1.15; }
.compara__cartao h3 span { color: var(--c); }
.compara__cartao ul { list-style: none; display: flex; flex-direction: column; }
.compara__cartao li { position: relative; padding: 14px 0 14px 46px; border-bottom: 1px solid var(--line); color: var(--text); }
.compara__cartao li:last-child { border-bottom: 0; padding-bottom: 0; }
.compara__cartao li::before { content: "✕"; position: absolute; left: 0; top: 12px; width: 32px; height: 32px; border-radius: 8px; background: var(--c-bg); color: var(--c); display: grid; place-items: center; font-weight: 800; font-size: 15px; }
.compara__cartao--com li::before { content: "✓"; }
@media (min-width: 860px) { .compara { grid-template-columns: 1fr 1fr; gap: 28px; } }
.encontros { list-style: none; display: grid; gap: 10px; counter-reset: enc; }
.encontros li { border-left: 4px solid var(--c); background: var(--surface); border-radius: 0 14px 14px 0; padding: 14px 16px; display: grid; gap: 2px; }
.encontros .quando { font-size: 13px; color: var(--muted); }
.encontros li.f1 { --c: var(--f1-text); } .encontros li.f2 { --c: var(--f2-text); } .encontros li.f3 { --c: var(--f3-text); } .encontros li.f4 { --c: var(--f4-text); } .encontros li.f5 { --c: var(--f5-text); }
.faixas { list-style: none; display: grid; gap: 8px; font-size: 17px; }
.faixas li { display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: space-between; border-bottom: 1px dashed var(--line); padding-bottom: 8px; }
.faixas span { color: var(--muted); }

/* Quem conduz */
.mentor { display: grid; gap: 24px; align-items: start; }
/* História do fundador em capítulos, numa linha do tempo (o caminho no mapa) */
.historia-caixa { width: 100%; margin-inline: auto; display: flex; flex-direction: column; gap: 20px; }
.historia { list-style: none; position: relative; display: flex; flex-direction: column; gap: 36px; padding-left: 28px; }
.historia::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; border-left: 2px dashed #C7D2DC; }
.historia:not(.historia--completa) .capitulo--extra { display: none; }
.section--white .capitulo::before { box-shadow: 0 0 0 4px var(--surface); }
.historia__mais { align-self: center; font: 600 17px var(--font); color: var(--link); background: var(--surface); border: 2px solid var(--line); border-radius: 999px; padding: 10px 22px; cursor: pointer; }
.historia__mais:hover { border-color: var(--link); }
.capitulo { position: relative; display: flex; flex-direction: column; gap: 12px; }
.capitulo::before { content: ""; position: absolute; left: -28px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--f1); box-shadow: 0 0 0 4px var(--ground); }
.capitulo__etiqueta { font-size: 13px; font-weight: 600; color: var(--link); }
.capitulo h3 { font-size: clamp(22px, 4.6vw, 28px); letter-spacing: -0.015em; }
.capitulo__frase { font-size: clamp(20px, 4.2vw, 26px); font-weight: 800; line-height: 1.25; letter-spacing: -0.01em; color: var(--text); margin: 4px 0; }
.capitulo__frase span { box-decoration-break: clone; -webkit-box-decoration-break: clone; padding-inline: 2px; }
/* Capítulo em 2 colunas: texto e colagem (foto, polaroide e marcos em cartões) */
.capitulo__texto { display: flex; flex-direction: column; gap: 12px; }
.capitulo__frase { background: #FFF7E0; border-radius: 14px; padding: 14px 18px; }
/* No celular, a colagem (foto e marcos) repete o texto do capítulo: fica só no desktop */
.capitulo__visual { display: none; position: relative; padding: 8px 0 0; }
.capitulo__foto { margin: 0; border: 8px solid #fff; border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--surface); box-shadow: var(--sombra); transform: rotate(-1.5deg); position: relative; }
.capitulo:nth-child(even) .capitulo__foto { transform: rotate(1.5deg); }
.capitulo__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.capitulo__rotulo { position: absolute; left: 10px; top: 10px; background: #fff; color: var(--text); font-size: 13px; font-weight: 600; border-radius: 999px; padding: 4px 10px 4px 8px; box-shadow: var(--sombra); }
.capitulo__rotulo::before { content: "●"; color: var(--f1); margin-right: 6px; font-size: 10px; }
.capitulo__polaroide { display: none; position: absolute; left: -10px; top: 270px; background: #fff; padding: 10px 14px 16px; font-weight: 600; font-size: 15px; color: var(--text); border-radius: 8px; box-shadow: var(--sombra); transform: rotate(-5deg); }
.capitulo__visual .marcos { margin-top: 20px; }
.capitulo__visual .marcos li { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px 8px 42px; position: relative; font-size: 15px; font-weight: 600; color: var(--text); box-shadow: var(--sombra); }
.capitulo__visual .marcos li::before { content: "★"; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%; background: #FEF3C7; color: #B45309; display: grid; place-items: center; font-size: 13px; }
@media (min-width: 960px) {
  /* o topo de "Quem conduz" acompanha a largura da história, para tudo partir da mesma margem */
  .mentor-largo { width: min(1240px, calc(100vw - 96px)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
  .historia-caixa { width: min(1240px, calc(100vw - 96px)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
  .capitulo { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 64px; align-items: start; }
  .capitulo__visual { display: block; min-height: 420px; padding-top: 12px; position: sticky; top: 24px; }
  .capitulo__foto { width: 82%; }
  .capitulo:nth-child(even) .capitulo__foto { margin-left: auto; }
  .capitulo__visual .marcos { position: absolute; right: -8px; top: 46%; width: 50%; margin: 0; gap: 10px; flex-direction: column; flex-wrap: nowrap; }
  .capitulo:nth-child(even) .capitulo__visual .marcos { right: auto; left: -8px; }
  .capitulo__polaroide { display: block; }
  .capitulo:nth-child(even) .capitulo__polaroide { left: auto; right: -10px; transform: rotate(5deg); }
}
/* Faixa "Empresas em que eu já atuei": cartões com o nome em texto (sem logo), rolando sozinhos */
.empresas { display: flex; flex-direction: column; gap: 20px; margin-top: 24px; }
.empresas__head { text-align: center; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.empresas__titulo { font-size: clamp(28px, 5.4vw, 40px); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; }
.empresas__head p { color: var(--muted); max-width: 52ch; }
.empresas__faixa { display: flex; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.empresas__trilho { list-style: none; display: flex; gap: 14px; padding: 6px 7px 14px; flex: none; animation: empresas-rola 60s linear infinite; }
/* A faixa volta a rolar sozinha (30/10/2026, pedido do fundador); para no toque ou com o mouse em cima; sem movimento, vira rolagem manual */
.empresas__faixa:hover .empresas__trilho, .empresas__faixa:focus-within .empresas__trilho { animation-play-state: paused; }
@keyframes empresas-rola { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .empresas__faixa { overflow-x: auto; scrollbar-width: thin; }
  .empresas__trilho { animation: none; }
  .empresas__trilho[aria-hidden] { display: none; }
}
.empresa { --c: var(--f1); --c-txt: #04121C; flex: none; scroll-snap-align: start; width: 210px; min-height: 230px; border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 8px; background: var(--c); color: var(--c-txt); box-shadow: var(--sombra); }
.empresa.f2 { --c: var(--brand); } .empresa.f3 { --c: #7C3AED; --c-txt: #fff; } .empresa.f4 { --c: #059669; --c-txt: #fff; } .empresa.f5 { --c: #E11D48; --c-txt: #fff; }
.empresa strong { font-size: 24px; line-height: 1.1; letter-spacing: -0.02em; margin-top: auto; }
.empresa__setor { font-size: 13px; font-weight: 600; opacity: 0.85; }
.empresa__fez { font-size: 15px; line-height: 1.35; opacity: 0.92; }
.empresas__nota { text-align: center; font-size: 13px; color: var(--muted); }
.marcos { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.marcos li { background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; font-size: 15px; color: var(--muted); }
.mentor__foto { width: 160px; height: 160px; border-radius: 24px; background: linear-gradient(135deg, var(--brand), var(--ink)); color: #fff; display: flex; align-items: center; justify-content: center; font: 800 48px var(--font); overflow: hidden; }
.mentor__foto img { width: 100%; height: 100%; object-fit: cover; }
.mentor__texto { display: flex; flex-direction: column; gap: 14px; }

/* Oferta */
.oferta { background: var(--surface); border: 2px solid var(--brand); border-radius: 24px; padding: 24px 20px; display: flex; flex-direction: column; gap: 18px; color: var(--text); }
/* Oferta: cartão da mentoria (preço e "Confirmar minha vaga" primeiro no celular) e bônus em bloco separado */
#oferta-cartao { scroll-margin-top: 16px; }
.oferta__topo { display: flex; flex-direction: column; gap: 10px; }
.oferta__grade { display: grid; gap: 22px; }
.oferta__compra { display: flex; flex-direction: column; gap: 14px; background: var(--ground); border-radius: 16px; padding: 20px; }
.oferta__seguro { text-align: center; font-size: 13px; color: var(--muted); }
.oferta__inclui { display: flex; flex-direction: column; gap: 12px; }
.oferta__inclui h3 { font-size: 20px; }
.recebe--compacta { gap: 8px; }
.recebe--compacta li { font-size: 17px; }
.oferta__ver-bonus { font-weight: 600; color: var(--link); }
.bonus { display: flex; flex-direction: column; gap: 22px; }
.bonus__extras { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.bonus__extra { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.bonus__extra .kit__selo { align-self: flex-start; }
.bonus__extra h3 { font-size: 20px; }
.bonus__extra p { color: var(--muted); }
@media (min-width: 860px) {
  .oferta__grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; column-gap: 28px; }
}
/* Seção da oferta em fundo escuro, como o topo: cartão com borda azul e brilho, para a oferta se destacar */
.section--oferta { background: radial-gradient(ellipse 70% 45% at 50% 0%, rgba(0,152,218,0.24), transparent 70%), radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px), var(--ink); background-size: auto, 28px 28px, auto; color: var(--on-dark); }
.section--oferta .transicao { color: var(--f4); }
.section--oferta .oferta { background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)); border: 2px solid var(--brand); box-shadow: 0 30px 90px rgba(0,152,218,0.30); color: var(--on-dark); }
.section--oferta .oferta h2, .section--oferta .oferta h3 { color: #fff; }
.section--oferta .oferta__topo p { color: var(--on-dark-muted); }
.section--oferta .oferta__compra { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.10); }
.section--oferta .preco__valor { color: #fff; }
.preco__valor [data-preco-atual] { white-space: nowrap; }
.section--oferta .container--oferta { max-width: 1040px; }
.section--oferta .oferta h2 { font-size: clamp(26px, 5vw, 38px); }
@media (min-width: 860px) { .section--oferta .oferta { padding: 36px 36px; } .section--oferta .oferta__grade { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); column-gap: 36px; } }
.section--oferta .preco__de, .section--oferta .preco__pag, .section--oferta .oferta__seguro { color: var(--on-dark-muted); }
.section--oferta .preco__de strong { color: var(--f1); }
.section--oferta .preco__lote { color: var(--f1); }
.section--oferta .recebe li { color: var(--on-dark); }
.section--oferta .recebe strong { color: #fff; }
.section--oferta .recebe li::before { color: var(--f4); }
.section--oferta .oferta__ver-bonus { color: var(--brand-light); }
.section--oferta .oferta .prova { color: var(--on-dark-muted); }
.section--oferta .oferta .prova strong { color: #fff; }
.section--oferta .oferta .prova__item::before { color: var(--f4); }
.section--oferta .contador { background: rgba(255,255,255,0.08); }
.oferta__selo { align-self: flex-start; font-size: 13px; background: var(--ink); color: #fff; border-radius: 999px; padding: 4px 12px; }
.preco { display: flex; flex-direction: column; gap: 4px; }
.preco__de { color: var(--muted); font-size: 17px; }
.preco__valor { font-size: clamp(44px, 12vw, 64px); font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.preco__pag { color: var(--muted); font-size: 17px; }
.contadores { display: grid; gap: 8px; }
.contador { display: flex; align-items: center; gap: 10px; background: var(--ground); border-radius: 12px; padding: 10px 14px; font-size: 17px; }
.contador strong { font: 700 24px var(--mono); color: var(--link); min-width: 2.2ch; text-align: right; }
.recebe { list-style: none; display: grid; gap: 8px; }
.recebe li { padding-left: 28px; position: relative; }
.recebe li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--ok); font-weight: 800; }
.valor { font-size: 15px; color: var(--muted); }

/* Garantia */
.garantia { display: flex; flex-direction: column; gap: 12px; border: 1px dashed var(--f4-text); background: var(--f4-bg); border-radius: var(--radius); padding: 22px 20px; }
.garantia h2 { font-size: 24px; color: var(--f4-text); }

/* Perguntas frequentes */
.faq { display: grid; gap: 10px; }
.faq details { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.faq summary { cursor: pointer; padding: 16px 44px 16px 18px; font-weight: 700; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 18px; top: 14px; font: 500 24px var(--font); color: var(--link); }
.faq details[open] summary::after { content: "–"; }
.faq details > div { padding: 0 18px 16px; color: var(--muted); }

/* Chamada final */
.final { text-align: left; }
.final .h2 { color: #fff; }

/* Rodapé */
.rodape { background: var(--ink); color: var(--on-dark-muted); font-size: 15px; padding-block: 28px 96px; border-top: 1px solid rgba(255,255,255,0.08); }
.rodape a { color: var(--brand-light); }
/* Rodapé: marca do método, recursos, WhatsApp e voltar ao topo */
.rodape { background: radial-gradient(ellipse 60% 120% at 85% 0%, rgba(0,152,218,0.22), transparent 70%), var(--ink); padding-top: 48px; }
.rodape__grade { display: grid; gap: 28px; }
.rodape__marca { display: flex; flex-direction: column; gap: 8px; }
.rodape__logo { width: 190px; height: auto; }
.rodape__links { display: flex; flex-direction: column; gap: 8px; }
.rodape__links a { color: var(--on-dark); text-decoration: none; font-weight: 500; }
.rodape__links a:hover { color: #fff; text-decoration: underline; }
.rodape__titulo { color: var(--brand-light); font-weight: 600; font-size: 15px; }
.rodape__acoes { display: flex; align-items: center; gap: 12px; }
.rodape__whats { background: #25D366; color: #052E16 !important; border-radius: 999px; padding: 12px 22px; font-weight: 700; text-decoration: none; }
.rodape__whats::after { content: " ↗"; }
.rodape__topo { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.06); color: #fff; font-size: 20px; cursor: pointer; }
.rodape__topo:hover { background: rgba(255,255,255,0.14); }
.rodape__direitos { font-size: 13px; border-top: 1px solid rgba(255,255,255,0.08); padding-top: 16px; }
@media (min-width: 860px) {
  .rodape__grade { grid-template-columns: 1.4fr 1fr auto; align-items: start; column-gap: 48px; }
  .rodape__direitos { grid-column: 1 / -1; }
}
/* Formulário de lead (dialog montado pelo landing.js) */
.form-lead { overflow-x: hidden; border: 0; padding: 0; border-radius: 24px; width: min(440px, calc(100vw - 32px)); max-height: calc(100vh - 32px); box-shadow: 0 30px 80px rgba(0,0,0,0.35); }
.form-lead::backdrop { background: rgba(11,22,34,0.72); backdrop-filter: blur(3px); }
.lead__form { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 26px 22px 22px; }
.lead__fechar { position: absolute; top: 10px; right: 12px; width: 36px; height: 36px; border: 0; background: none; font-size: 24px; color: var(--muted); cursor: pointer; }
.lead__passo { align-self: flex-start; font-size: 13px; font-weight: 600; color: var(--f1-text); background: var(--f1-bg); border-radius: 999px; padding: 4px 12px; }
.lead__titulo { font-size: 24px; letter-spacing: -0.02em; }
.lead__sub { color: var(--muted); font-size: 15px; }
.lead__campo { display: flex; flex-direction: column; gap: 4px; font-size: 15px; font-weight: 600; }
.lead__campo input { width: 100%; min-width: 0; box-sizing: border-box; font: inherit; font-weight: 400; font-size: 17px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #F8FAFC; }
.lead__campo input:focus { outline: 2px solid var(--brand); outline-offset: 1px; background: #fff; }
.lead__erro { color: #B42318; font-size: 15px; font-weight: 600; }
.lead__dica { color: #B42318; font-size: 14px; font-weight: 600; }
.lead__campo input[aria-invalid="true"] { border-color: #B42318; background: #FEF3F2; }
.lead__nota { font-size: 13px; color: var(--muted); text-align: center; }


/* Aviso de cookies */
.cookies { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; background: var(--ink); color: var(--on-dark); border: 1px solid rgba(255,255,255,0.15); border-radius: 16px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.cookies a { color: var(--brand-light); }
.cookies__acoes { display: flex; gap: 8px; }
.cookies .btn { min-height: 40px; font-size: 15px; padding: 0 14px; }

/* Telas maiores */
@media (min-width: 720px) {
  .container { padding-inline: 28px; }
  .section { padding-block: 88px; }
  .actions { flex-direction: row; flex-wrap: wrap; }
  .hero--vsl .actions { justify-content: center; }
  .cta-faixa__acao { align-items: center; flex: none; }
  .cta-bloco { align-items: center; }
  .cta-bloco .prova { justify-content: center; }
  .cta-bloco--esq { align-items: flex-start; }
  .cta-bloco--esq .prova { justify-content: flex-start; }
  .kit { padding: 36px; }
  .paraquem { grid-template-columns: 1fr 1fr; }
  .minas, .blocos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mina { align-self: start; }
  .etapas { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .mentor { grid-template-columns: 200px 1fr; }
  .mentor__foto { width: 200px; height: 200px; }
  .oferta { padding: 36px; }
  .cta-faixa .container { flex-direction: row; align-items: center; justify-content: space-between; }
  .cookies { left: auto; max-width: 420px; }
}
@media (min-width: 980px) {
  .hero { padding: 40px 0 88px; }
  .hero__grid { grid-template-columns: 1.05fr 1fr; align-items: center; gap: 48px; }
  .oferta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
}

/* Página de obrigado: os próximos passos depois do pagamento */
.obrigado { display: flex; flex-direction: column; gap: 18px; text-align: center; align-items: center; }
.obrigado__passos { text-align: left; display: grid; gap: 12px; padding-left: 22px; max-width: 52ch; }
.obrigado__passos li::marker { font-weight: 800; color: var(--link); }
.obrigado__nota { font-size: 15px; color: var(--muted); max-width: 52ch; }

/* Revisão de design da página toda (29/10/2026). Escopo: a landing da mentoria (body.pagina-mapa).
   1. O método e a jornada (praticamente uma coisa só) ficam com o fundo do topo; os outros blocos mantêm o fundo
      próprio, e a transformação ganha um fundo de destaque claro, no verde do gramado.
   2. Cartões sem sombra, só com borda fina.
   3. Uma cor de destaque: o verde do "com o mapa"; o "sem" fica neutro; a garantia sem caixa verde; a oferta sem brilho.
   5. Menos frases de efeito: sem o grifo amarelo no "Então crie" e sem a segunda cor no título do topo. */
/* O método e a jornada com o mesmo fundo do topo (o vídeo), lidos como um bloco só: o brilho azul fica no alto do
   método, e a grade de pontos continua pela jornada */
.pagina-mapa .metodo, .pagina-mapa .jornada { background-color: var(--ink); background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px); background-size: 28px 28px; border-block: 0; }
.pagina-mapa .metodo { background-image: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(0,152,218,0.22), transparent 70%), radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px); background-size: auto, 28px 28px; }
/* a jornada em fundo escuro: os cartões continuam claros, com o texto escuro */
.pagina-mapa .jornada .aprende__titulo, .pagina-mapa .jornada .stackv--curto > h3 { color: #fff; }
.pagina-mapa .jornada .aprende__head p { color: var(--on-dark-muted); }
.pagina-mapa .jornada .aprende__abrir { color: var(--brand-light); }
.pagina-mapa .jornada .blocos li { color: var(--text); }
.pagina-mapa .jornada .passo:not(:last-child)::after, .pagina-mapa .jornada .passo:not(:last-child)::before { border-color: rgba(255,255,255,0.35); }
/* a transformação, o destaque claro: o resultado de atravessar com o mapa, no verde do gramado */
.pagina-mapa .transforma { background: linear-gradient(180deg, #E7F5EA 0, #F7FCF8 100%); }
.pagina-mapa .compara__cartao { --c: #64748B; --c-bg: #EEF0F3; }
.pagina-mapa .compara__cartao--com { --c: #15803D; --c-bg: #DCFCE7; }
.pagina-mapa .paraquem__col--nao { border-top-color: #94A3B8; }
.pagina-mapa .paraquem__col--nao li::before { color: #64748B; }
.pagina-mapa .garantia { background: transparent; border: 1px solid var(--line); }
.pagina-mapa .garantia h2 { color: var(--text); }
.pagina-mapa .section--oferta .oferta { box-shadow: none; }
.pagina-mapa .convite__destaque span { background: none; padding-inline: 0; }
.pagina-mapa .hero--vsl h1 mark { color: inherit; }
/* 4. a chamada final fecha com o mesmo mapa da virada, agora com a trilha completa */
.pagina-mapa .final__ilustra { width: min(460px, 100%); }
.pagina-mapa .final__ilustra img { border-radius: 12px; box-shadow: none; }
.pagina-mapa .hero--vsl .hero__sub { font-size: clamp(17px, 2.2vw, 19px); }
.pagina-mapa :is(.passo, .compara__cartao, .paraquem__col, .aprende__painel, .bonus__extra, .faq details, .capitulo__foto, .capitulo__rotulo, .capitulo__visual .marcos li, .capitulo__polaroide) { box-shadow: none; }
.pagina-mapa .jornada .passo, .pagina-mapa .jornada .aprende__painel { color: var(--text); }
/* Bônus (29/10/2026): primeiro a lista clara dos quatro, depois o detalhe de cada um (o que é, a vantagem, quando recebe) */
.bonus__lista { list-style: none; display: grid; gap: 12px; }
.bonus__item { display: grid; grid-template-columns: 120px 1fr; column-gap: 14px; align-items: center; height: 100%; text-decoration: none; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 10px; overflow: hidden; }
.bonus__arte { width: 100%; height: auto; aspect-ratio: 5 / 3; border-radius: 10px; display: block; }
.bonus__texto { display: flex; flex-direction: column; gap: 2px; }
.bonus__texto > span:not(.bonus__selo) { font-size: 15px; color: var(--muted); }
.bonus__item:hover { border-color: #15803D; }
.bonus__item strong { font-size: 17px; line-height: 1.3; }

.bonus__selo { justify-self: start; align-self: start; font-size: 13px; font-weight: 600; color: #92400E; background: #FEF3C7; border-radius: 999px; padding: 2px 10px; vertical-align: middle; }
.bonus__item .bonus__selo { margin-top: 6px; }
.bonus__detalhe { display: flex; flex-direction: column; gap: 12px; padding-top: 28px; border-top: 1px solid var(--line); scroll-margin-top: 16px; }
.bonus__detalhe h3 { font-size: clamp(22px, 4.4vw, 28px); letter-spacing: -0.02em; line-height: 1.2; }
.bonus__detalhe h3 .bonus__selo { font-size: 13px; letter-spacing: 0; position: relative; top: -3px; }
.bonus__chamada { font-size: 20px; font-weight: 700; color: var(--text); }
.bonus__detalhe .nota { color: var(--muted); }
.bonus__quando { font-size: 15px; font-weight: 600; color: #166534; }
@media (min-width: 720px) {
  .bonus__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Kit Bootstrap de Infraestrutura em bloco próprio (29/10/2026): o que vem no kit, depois por que vale a pena */
.bonus__ver { align-self: flex-start; font-weight: 600; color: var(--link); }
.kit-bloco { scroll-margin-top: 16px; }
.kit-bloco__parte { display: flex; flex-direction: column; gap: 14px; }
.kit-bloco__parte h3 { font-size: clamp(22px, 4.4vw, 28px); letter-spacing: -0.02em; }
.kit-itens { list-style: none; display: grid; gap: 10px; }
.kit-itens li { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1px solid var(--line); border-left: 3px solid #15803D; border-radius: 0 12px 12px 0; background: var(--surface); }
.kit-itens strong { font-size: 17px; }
.kit-itens span { font-size: 15px; color: var(--muted); }
@media (min-width: 720px) {
  .kit-itens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Preço das próximas turmas (R$ 3.500), acima do preço da Turma Fundadora: sem riscar, porque nunca foi praticado */
.preco__proximas { font-size: 15px; color: var(--on-dark-muted); }
.preco__proximas strong { color: #fff; }
.preco__fundadora { font-size: 15px; font-weight: 600; color: var(--f4); margin-top: 6px; }
.preco__fundadora strong { color: #fff; }
.preco__lote { font-size: 17px; font-weight: 600; margin-top: 10px; }
/* Bônus, segunda versão (29/10/2026): cartões com a ilustração do equipamento; no desktop, a ilustração em cima */
.bonus__detalhe > p { max-width: 68ch; }
@media (min-width: 720px) {
  .bonus__item { grid-template-columns: 1fr; row-gap: 12px; padding: 12px 12px 16px; align-items: start; }
  .bonus__texto { padding-inline: 6px; }
}
@media (min-width: 960px) {
  .bonus__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* Lista do kit agrupada por função para o negócio: sem um cartão por item */
.kit-grupos { display: grid; gap: 18px; }
.kit-grupo { display: flex; flex-direction: column; gap: 6px; border-top: 2px solid #15803D; padding-top: 10px; }
.kit-grupo h4 { margin: 0; font-size: 17px; color: var(--f4-text); }
.kit-grupo ul { list-style: none; display: grid; gap: 6px; }
.kit-grupo li { font-size: 15px; color: var(--muted); }
.kit-grupo li strong { color: var(--text); }
.kit-bloco__nota { margin-top: 16px; font-size: 14px; color: var(--muted); }
@media (min-width: 720px) {
  .kit-grupos { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
}
/* Conversão (29/10/2026): barra fixa de compra no celular, entre o botão do topo e a oferta */
.cta-fixa { display: none; }
@media (max-width: 719px) {
  .cta-fixa { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 54; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(11,22,34,0.94); border-top: 1px solid rgba(255,255,255,0.12); transform: translateY(110%); transition: transform 0.5s var(--curva); }
  .cta-fixa--visivel { transform: none; }
  .cta-fixa .btn { min-height: 52px; }
  body.com-cta-fixa .whats-flutuante { transform: translateY(-72px); }
  body.com-cta-fixa .whats-flutuante:hover { transform: translateY(-72px) scale(1.06); }
  body.com-cookies .cta-fixa { display: none; }
}
@media (prefers-reduced-motion: reduce) { .cta-fixa { transition: none; } }
/* a autoridade agora vem antes do vídeo: sem a linha de cima, centralizada */
.hero--vsl .autoridade { border-top: 0; padding-top: 0; margin-top: 0; text-align: center; margin-inline: auto; }
/* Página 404 do site: o mapa e o caminho de volta */
.nao-encontrada { min-height: 100vh; display: grid; align-items: center; }
.nao-encontrada__corpo { align-items: center; text-align: center; gap: 20px; }
.nao-encontrada__mapa { width: min(520px, 100%); height: auto; border-radius: 12px; }
.nao-encontrada h1 { font-size: clamp(30px, 6vw, 48px); }
/* Topo: o WhatsApp vira link de texto embaixo do botão, para a compra ficar como a única ação principal */
.hero__whats { color: var(--on-dark-muted); font-size: 16px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.hero__whats:hover { color: #fff; }
.hero__whats:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; border-radius: 4px; }
/* Player de VSL (landing.js, modoVsl; config.js, video.vsl): sem os controles do YouTube, com avisos próprios */
.vsl iframe { pointer-events: none; }
.vsl .video__thumb { z-index: 1; }
.vsl--tocou .video__thumb { display: none; }
.vsl__camada { position: absolute; inset: 0; z-index: 2; cursor: pointer; }
.vsl__camada:focus-visible { outline: 3px solid var(--brand-light); outline-offset: -3px; border-radius: var(--radius); }
.vsl[data-vsl="pausado"] .vsl__camada, .vsl[data-vsl="fim"] .vsl__camada, .vsl[data-vsl="retomar"]::before { background: rgba(4,18,28,0.5); }
.vsl[data-vsl="retomar"]::before { content: ""; position: absolute; inset: 0; z-index: 2; }
.vsl__aviso { position: absolute; z-index: 3; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(340px, calc(100% - 32px)); display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px 20px; border-radius: 16px; background: rgba(4,18,28,0.88); color: #fff; text-align: center; pointer-events: none; }
.vsl__aviso strong { font-size: 18px; line-height: 1.25; }
.vsl__aviso > span:not(.vsl__icone):not(.vsl__botoes) { font-size: 15px; color: var(--on-dark-muted); }
.vsl[data-vsl="retomar"] .vsl__aviso { pointer-events: auto; }
.vsl__icone { position: relative; width: 56px; height: 56px; margin-bottom: 8px; border-radius: 50%; background: var(--brand-light); color: #04121C; display: grid; place-items: center; }
.vsl__icone--pulso::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--brand-light); animation: vsl-pulso 1.6s cubic-bezier(0.22, 1, 0.36, 1) infinite; }
@keyframes vsl-pulso { from { transform: scale(1); opacity: 0.8; } to { transform: scale(1.7); opacity: 0; } }
.vsl__botoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 10px; }
.vsl__botao { font: 600 15px var(--font); border-radius: 999px; padding: 10px 16px; cursor: pointer; border: 2px solid var(--brand-light); background: var(--brand-light); color: #04121C; }
.vsl__botao--outro { background: transparent; color: #fff; }
.vsl__botao:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.vsl__barra { position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; height: 5px; background: rgba(255,255,255,0.18); pointer-events: none; }
.vsl__barra span { display: block; height: 100%; background: var(--brand-light); transform: scaleX(0); transform-origin: left; transition: transform 0.25s linear; }
@media (max-width: 479px) {
  .vsl__aviso { padding: 12px 14px; gap: 2px; }
  .vsl__aviso strong { font-size: 16px; }
  .vsl__icone { width: 44px; height: 44px; margin-bottom: 4px; }
  .vsl__botao { font-size: 14px; padding: 8px 12px; }
}
/* A parte de venda fica no HTML (SEO) e só some com JavaScript ligado; o landing.js tira a classe ao liberar */
@media (scripting: enabled) {
  .vsl-bloqueado [data-vsl-revela], .vsl-bloqueado .cta-fixa { display: none !important; }
}
.vsl-revelando [data-vsl-revela] { animation: vsl-aparece 0.7s cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes vsl-aparece { from { opacity: 0; transform: translateY(32px); } }
@keyframes vsl-aparece-suave { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .vsl-revelando [data-vsl-revela] { animation-name: vsl-aparece-suave; }
  .vsl__icone--pulso::after { animation: none; }
  .vsl__barra span { transition: none; }
}
/* Topo (29/10/2026, como na página do VTSD): uma linha só, fora da moldura azul, chamando para o vídeo; a moldura fica só em volta dele */
.hero__convite { margin-top: 12px; font-size: clamp(17px, 2.6vw, 20px); font-weight: 600; color: #fff; text-wrap: balance; }
.hero--vsl .hero__palco { margin-top: 28px; }
/* Oferta enxuta (29/10/2026): o cartão do preço só com a escada, o preço grande, o botão e uma linha de segurança;
   no computador, a lista à esquerda e o preço à direita; a garantia numa faixa logo abaixo */
.section--oferta .oferta__compra { text-align: center; padding: 28px 20px 22px; gap: 16px; }
.section--oferta .preco { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.section--oferta .preco__proximas, .section--oferta .preco__fundadora { font-size: 15px; font-weight: 400; color: var(--on-dark-muted); margin: 0; }
.section--oferta .preco__fundadora strong, .section--oferta .preco__proximas strong { color: var(--on-dark); font-weight: 600; }
.section--oferta .preco__lote { font-size: 15px; font-weight: 600; margin-top: 12px; text-wrap: balance; }
.section--oferta .preco__valor { font-size: clamp(56px, 16vw, 80px); margin: 4px 0; }
.section--oferta .preco__pag, .section--oferta .preco__de { font-size: 15px; }
.section--oferta .preco__de { text-wrap: balance; }
.section--oferta .preco [data-cfg] { white-space: nowrap; }
.section--oferta .oferta__compra .prova { justify-content: center; }
.section--oferta .oferta__inclui .recebe { gap: 0; }
.section--oferta .oferta__inclui .recebe li { padding: 10px 0 10px 26px; font-size: 15px; border-bottom: 1px solid rgba(255,255,255,0.10); }
.section--oferta .oferta__inclui .recebe li::before { top: 10px; }
@media (min-width: 860px) {
  /* as duas colunas com a mesma altura: o cartão acompanha a lista, com o conteúdo centralizado */
  .section--oferta .oferta__grade { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); align-items: stretch; }
  .section--oferta .oferta__compra { justify-content: center; }
  .section--oferta .oferta__inclui { order: -1; }
}
.garantia-faixa { display: flex; align-items: center; gap: 16px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.10); border-radius: 24px; padding: 20px; color: var(--on-dark); }
.garantia-faixa__selo { flex: none; width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--f4); color: var(--f4); display: grid; place-items: center; font-weight: 800; font-size: 17px; }
.garantia-faixa__texto { display: flex; flex-direction: column; gap: 4px; }
.garantia-faixa h3 { font-size: 20px; color: #fff; }
.garantia-faixa p { font-size: 15px; color: var(--on-dark-muted); text-wrap: pretty; }
@media (min-width: 720px) { .garantia-faixa { padding: 24px 32px; gap: 24px; } .garantia-faixa__selo { width: 72px; height: 72px; font-size: 20px; } }
@media (max-width: 479px) { .garantia-faixa { flex-direction: column; align-items: flex-start; gap: 12px; } .garantia-faixa__selo { width: 56px; height: 56px; font-size: 15px; } }