/* Página de venda de kit (tráfego pago): uma coluna de leitura, CTA sempre perto, nada que tire a pessoa da página. */

.is-landing { background: var(--paper); }
.is-landing .totop { display: none; }
.lp-top { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.lp-top__in { width: min(100% - 2 * var(--gut), var(--wrap)); margin-inline: auto; height: 64px; display: flex; align-items: center; gap: 16px; }
.lp-top img { height: 30px; width: auto; }
:root[data-theme="dark"] .lp-top img { filter: brightness(0) invert(1); }
.lp-top .secure { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; font-weight: 700; font-size: var(--t-sm); color: var(--leaf); padding: 8px 14px; border-radius: var(--pill); background: color-mix(in srgb, var(--leaf) 12%, var(--paper)); }
.lp-top .secure .i { width: 18px; height: 18px; }
.lp-foot { padding: 40px var(--gut) 120px; text-align: center; font-size: var(--t-sm); color: var(--ink-3); border-top: 1px solid var(--line); }
.lp-foot a { color: var(--ink-2); }

.lp-sec { padding-block: clamp(56px, 8vw, 104px); }
.lp-h2 { font: 800 var(--t-2xl)/1.08 var(--f-display); letter-spacing: -.01em; margin: 0 0 12px; text-wrap: balance; }
.lp-sub { color: var(--ink-2); font-size: var(--t-md); margin: 0 0 36px; max-width: 60ch; }

/* ---------- 1. promessa */
.lp-hero { position: relative; overflow: hidden; padding: clamp(32px, 6vw, 80px) 0 clamp(48px, 7vw, 96px);
  background: radial-gradient(60% 70% at 85% 30%, color-mix(in srgb, var(--grape) 16%, transparent), transparent 70%),
              radial-gradient(50% 60% at 10% 90%, color-mix(in srgb, var(--sun) 18%, transparent), transparent 70%), var(--mist); }
.lp-hero__in { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(24px, 4vw, 56px); align-items: center; }
.lp-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px; padding: 7px 14px 7px 10px; border-radius: var(--pill); font-weight: 800; font-size: var(--t-sm); color: var(--grape); background: color-mix(in srgb, var(--grape) 12%, var(--paper)); }
.lp-eyebrow .i { width: 18px; height: 18px; }
.lp-title { font: 800 var(--t-3xl)/1.02 var(--f-display); letter-spacing: -.02em; margin: 0 0 18px; text-wrap: balance; }
.lp-lede { font-size: var(--t-lg); line-height: 1.5; color: var(--ink-2); margin: 0 0 24px; max-width: 46ch; }
.lp-ticks { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 10px; }
.lp-ticks li { display: flex; align-items: center; gap: 12px; font-size: var(--t-md); }
.lp-ticks .i { flex: none; width: 36px; height: 36px; padding: 8px; border-radius: 12px; color: var(--grape); background: var(--paper); box-shadow: 0 6px 16px -10px rgb(var(--shadow-c) / .5); }
.lp-buy { display: grid; justify-items: start; gap: 12px; }
.lp-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.lp-price s { color: var(--ink-3); font-size: var(--t-lg); }
.lp-price strong { font: 800 clamp(2.4rem, 1.6rem + 3vw, 3.4rem)/1 var(--f-display); color: var(--ink); }
.lp-price small { flex-basis: 100%; color: var(--ink-2); font-size: var(--t-sm); font-weight: 700; }
.lp-cta { min-height: 64px; padding-inline: 32px; font-size: var(--t-lg); background: linear-gradient(135deg, var(--pink), var(--grape)); --fg: #fff; box-shadow: 0 14px 30px -14px color-mix(in srgb, var(--pink) 80%, transparent); }
.lp-cta:hover { box-shadow: 0 18px 34px -12px color-mix(in srgb, var(--pink) 85%, transparent); }
.lp-cta .i { width: 22px; height: 22px; }
.lp-safe { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: var(--t-sm); font-weight: 700; color: var(--ink-2); }
.lp-safe .i { width: 18px; height: 18px; color: var(--leaf); }

/* leque de capas: abre ao carregar e acompanha o mouse */
.lp-fan { position: relative; aspect-ratio: 1 / .92; perspective: 1400px; --mx: 0; --my: 0; }
.lp-fan img { position: absolute; left: 50%; top: 50%; width: 44%; height: auto; border-radius: 10px; box-shadow: 0 24px 40px -22px rgb(var(--shadow-c) / .75);
  --off: calc(var(--n) - (var(--t) - 1) / 2);
  transform: translate(-50%, -50%) translateX(calc(var(--off) * 15%)) translateY(calc(max(var(--off), -1 * var(--off)) * 3%)) rotate(calc(var(--off) * 5deg)) rotateY(calc(var(--mx) * 8deg)) rotateX(calc(var(--my) * -6deg));
  z-index: calc(20 - var(--n)); transition: transform .8s var(--spring); }
.lp-fan:not(.is-open) img { transform: translate(-50%, -50%) rotate(0) scale(.92); }
.lp-fan img:nth-child(n + 8) { display: none; }
.lp-fan__badge { position: absolute; right: 4%; top: 6%; z-index: 30; width: 104px; height: 104px; border-radius: 50%; display: grid; place-content: center; text-align: center; font-weight: 800; font-size: var(--t-xs); line-height: 1.1; text-transform: uppercase; letter-spacing: .04em; color: #fff; background: var(--sun); color: #3d2a00; transform: rotate(10deg); box-shadow: 0 12px 24px -12px rgb(var(--shadow-c) / .6); animation: lp-pop .6s .9s var(--spring) both; }
.lp-fan__badge b { font: 800 2.4rem/1 var(--f-display); }
@keyframes lp-pop { from { transform: rotate(-30deg) scale(0); } }

/* ---------- 2. para quem */
.lp-for__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 28px; }
.lp-for article { padding: 26px; border-radius: var(--r-lg); background: color-mix(in srgb, var(--c) 8%, var(--paper)); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--c) 22%, transparent); }
.lp-for article > span { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 16px; color: #fff; background: var(--c); margin-bottom: 14px; }
.lp-for h3 { font: 800 var(--t-lg)/1.2 var(--f-display); margin: 0 0 8px; }
.lp-for p { margin: 0; color: var(--ink-2); }

/* ---------- 3. o que vem */
.lp-what { background: var(--mist); }
.lp-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; counter-reset: s; }
.lp-step { padding: clamp(18px, 3vw, 28px); border-radius: var(--r-lg); background: var(--paper); box-shadow: 0 10px 30px -24px rgb(var(--shadow-c) / .6); border-top: 6px solid var(--c); }
.lp-step header { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; }
.lp-step__n { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; font: 800 1.3rem/1 var(--f-display); color: #fff; background: var(--c); }
.lp-step h3 { font: 800 var(--t-xl)/1.1 var(--f-display); margin: 0 0 4px; }
.lp-step header p { margin: 0; color: var(--ink-2); }
.lp-items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.lp-items li { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: var(--r-md); background: var(--mist); }
.lp-items img { flex: none; width: 54px; height: auto; border-radius: 6px; box-shadow: 0 6px 12px -8px rgb(var(--shadow-c) / .7); }
.lp-items b { display: block; font-size: var(--t-sm); line-height: 1.25; }
.lp-items small { color: var(--ink-3); font-size: var(--t-xs); }
.lp-bonus { margin-top: 26px; padding: clamp(18px, 3vw, 28px); border-radius: var(--r-lg); background: color-mix(in srgb, var(--sun) 14%, var(--paper)); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--sun) 50%, transparent); }
.lp-bonus h3 { display: flex; align-items: center; gap: 10px; font: 800 var(--t-xl)/1.1 var(--f-display); margin: 0 0 16px; }
.lp-bonus h3 .i { width: 28px; height: 28px; color: color-mix(in srgb, var(--sun) 70%, var(--ink)); }
.lp-items--bonus li { background: var(--paper); }

/* ---------- 4. por dentro */
.lp-peek__rail { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 8px max(var(--gut), calc((100vw - var(--wrap)) / 2)) 24px; scrollbar-width: thin; outline: none; }
.lp-peek__rail figure { flex: none; width: clamp(200px, 26vw, 280px); margin: 0; scroll-snap-align: center; }
.lp-peek__rail figure.is-land { width: clamp(300px, 40vw, 420px); }
.lp-peek__rail img { width: 100%; border-radius: 12px; background: #fff; box-shadow: 0 16px 30px -20px rgb(var(--shadow-c) / .7); transition: transform .4s var(--spring); }
.lp-peek__rail figure:hover img { transform: translateY(-6px) rotate(-1deg); }
.lp-peek__rail figcaption { margin-top: 10px; font-size: var(--t-xs); font-weight: 700; color: var(--ink-3); }

/* ---------- 5. como funciona */
.lp-how__grid { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; counter-reset: c; }
.lp-how__grid li { position: relative; padding: 26px; border-radius: var(--r-lg); box-shadow: inset 0 0 0 1.5px var(--line); }
.lp-how__grid li > span { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 18px; color: var(--blue); background: color-mix(in srgb, var(--blue) 12%, var(--paper)); margin-bottom: 14px; }
.lp-how__grid li::after { counter-increment: c; content: counter(c); position: absolute; right: 20px; top: 12px; font: 800 3.4rem/1 var(--f-display); color: var(--mist-2); }
.lp-how h3 { font: 800 var(--t-lg)/1.2 var(--f-display); margin: 0 0 6px; }
.lp-how p { margin: 0; color: var(--ink-2); }

/* ---------- 6. oferta */
.lp-offer { background: linear-gradient(180deg, var(--paper), var(--mist)); }
.lp-offer__card { display: grid; grid-template-columns: 1.2fr .8fr; border-radius: var(--r-xl); overflow: hidden; background: var(--paper); box-shadow: 0 30px 60px -40px rgb(var(--shadow-c) / .8), inset 0 0 0 1.5px var(--line); }
.lp-offer__list { padding: clamp(22px, 4vw, 44px); }
.lp-offer__list ul { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 2px; }
.lp-offer__list li { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: var(--t-sm); }
.lp-offer__list li .i { width: 18px; height: 18px; color: var(--leaf); }
.lp-offer__list em { font-style: normal; font-size: var(--t-xs); font-weight: 800; text-transform: uppercase; color: color-mix(in srgb, var(--sun) 70%, var(--ink)); background: color-mix(in srgb, var(--sun) 20%, var(--paper)); padding: 2px 7px; border-radius: 6px; margin-left: 4px; }
.lp-offer__list s { color: var(--ink-3); }
.lp-offer__buy { display: grid; align-content: center; justify-items: center; gap: 10px; padding: clamp(26px, 4vw, 44px); text-align: center; color: #fff; background: linear-gradient(160deg, var(--grape), color-mix(in srgb, var(--grape) 60%, var(--pink))); }
.lp-offer__buy p { margin: 0; }
.lp-offer__de s { opacity: .8; }
.lp-offer__por small { display: block; font-weight: 700; opacity: .85; }
.lp-offer__por strong { font: 800 clamp(3.2rem, 2rem + 4vw, 4.6rem)/1 var(--f-display); }
.lp-offer__parc { font-weight: 700; }
.lp-offer__eco { font-size: var(--t-sm); padding: 6px 12px; border-radius: var(--pill); background: rgb(255 255 255 / .16); }
.lp-offer__buy .lp-cta { background: #fff; --fg: var(--grape); margin-top: 8px; box-shadow: 0 14px 30px -14px rgb(0 0 0 / .5); }
.lp-offer__buy .lp-safe { color: rgb(255 255 255 / .9); }
.lp-offer__buy .lp-safe .i { color: #fff; }

/* ---------- 7. garantia */
.lp-guarantee { display: flex; align-items: center; gap: clamp(20px, 4vw, 44px); }
.lp-guarantee p { margin: 0; color: var(--ink-2); font-size: var(--t-md); max-width: 62ch; }
.lp-guarantee__seal { flex: none; position: relative; display: grid; place-content: center; width: 132px; height: 132px; border-radius: 50%; text-align: center; color: var(--leaf); background: color-mix(in srgb, var(--leaf) 10%, var(--paper)); box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--leaf) 40%, transparent); }
.lp-guarantee__seal .i { position: absolute; inset: 10px auto auto 50%; translate: -50% 0; width: 26px; height: 26px; }
.lp-guarantee__seal b { font: 800 3rem/1 var(--f-display); margin-top: 14px; }
.lp-guarantee__seal small { font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: var(--t-xs); }

/* ---------- 8. dúvidas */
.lp-faq { max-width: 820px; }
.lp-q { border-bottom: 1px solid var(--line); }
.lp-q summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; cursor: pointer; list-style: none; font: 700 var(--t-md)/1.35 var(--f-text); }
.lp-q summary::-webkit-details-marker { display: none; }
.lp-q summary .i { flex: none; transition: transform .3s var(--ease); }
.lp-q[open] summary .i { transform: rotate(180deg); }
.lp-q p { margin: 0 0 20px; color: var(--ink-2); line-height: 1.6; }

.lp-last { text-align: center; display: grid; justify-items: center; }
.lp-last .lp-sub { margin-bottom: 24px; }
.lp-more { margin: 18px 0 0; color: var(--ink-3); font-size: var(--t-sm); }

/* barra fixa de compra (aparece quando o botão principal sai da tela) */
.lp-bar { position: fixed; z-index: 40; left: 50%; bottom: max(14px, env(safe-area-inset-bottom)); translate: -50% 0; width: min(100% - 24px, 560px); display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 20px; border-radius: var(--pill); background: var(--ink); color: var(--paper); box-shadow: 0 18px 40px -16px rgb(var(--shadow-c) / .9); transition: transform .45s var(--spring), opacity .3s; }
.lp-bar.is-hidden { transform: translateY(140%); opacity: 0; pointer-events: none; }
.lp-bar span { display: flex; align-items: baseline; gap: 8px; }
.lp-bar s { opacity: .6; font-size: var(--t-sm); }
.lp-bar strong { font: 800 1.6rem/1 var(--f-display); }
.lp-bar .btn { --bg: var(--sun); --fg: #3d2a00; min-height: 48px; }

/* entrada das seções */
.js .lp [data-in] { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js .lp [data-in].is-in { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .lp-hero__in { grid-template-columns: 1fr; }
  .lp-fan { order: -1; width: min(100%, 460px); margin: -8px auto 0; aspect-ratio: 1 / .78; }
  .lp-fan img { width: 40%; }
  .lp-fan__badge { width: 84px; height: 84px; }
  .lp-fan__badge b { font-size: 1.9rem; }
  .lp-for__grid, .lp-how__grid { grid-template-columns: 1fr; }
  .lp-for article, .lp-how__grid li { display: grid; grid-template-columns: 48px 1fr; gap: 2px 14px; padding: 18px; }
  .lp-for article > span, .lp-how__grid li > span { grid-row: span 2; margin: 0; }
  .lp-for h3, .lp-how h3 { align-self: end; }
  .lp-offer__card { grid-template-columns: 1fr; }
  .lp-offer__buy { order: -1; }
  .lp-guarantee { flex-direction: column; text-align: center; }
  .lp-buy { justify-items: stretch; }
  .lp-cta { width: 100%; padding-inline: 18px; font-size: var(--t-md); white-space: normal; }
  .lp-top .secure span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-fan img, .lp-bar, .js .lp [data-in] { transition: none; }
  .lp-fan__badge { animation: none; }
}

/* celular deitado: promessa e capas lado a lado, sem empurrar o preço para fora da tela */
@media (max-width: 960px) and (max-height: 520px) and (orientation: landscape) {
  .lp-top__in { height: 52px; }
  .lp-hero { padding: 16px 0 32px; }
  .lp-hero__in { grid-template-columns: 1.15fr .85fr; gap: 16px; }
  .lp-fan { order: 2; width: 100%; margin: 0; aspect-ratio: 1 / .9; }
  .lp-title { font-size: clamp(1.7rem, 4.6vw, 2.3rem); }
  .lp-lede { font-size: var(--t-md); margin-bottom: 14px; }
  .lp-ticks { margin-bottom: 16px; gap: 6px; }
  .lp-ticks .i { width: 30px; height: 30px; padding: 6px; }
  .lp-cta { min-height: 52px; }
  .lp-bar { bottom: max(8px, env(safe-area-inset-bottom)); padding: 6px 6px 6px 16px; }
}