/* ============================================================
   EXTRA da peça · Landing Mentoria iAPX · Turma 2026
   Carregue DEPOIS de iapx-web.css e iapx-web-light.css.
   Nenhum token é redefinido aqui — só composição de página e
   os dois padrões que o sistema ainda não tinha (ver § OFERTA).
   AGENT_GUIDE §2: alteração de token vive no tema, não na peça.
   ============================================================ */

body { margin: 0; }

/* ── ritmo de seção ──────────────────────────────────────── */
.ln-sec { padding: clamp(3rem, 8vw, 6rem) 0; }
.ln-sec--tight { padding: clamp(2.25rem, 5vw, 3.5rem) 0; }
.ln-head { max-width: 46ch; margin-bottom: var(--iapx-block); }
.ln-head p { margin: 0; }

/* ── topbar fixa ─────────────────────────────────────────── */
.ln-nav {
  position: sticky; top: 0; z-index: 10;
  background: var(--iapx-ink);
  border-bottom: 1px solid var(--iapx-line);
}
.ln-nav .iapx-topbar { padding: .75rem 0; }
.ln-nav-cta {
  font-family: var(--iapx-label); font-weight: 700; font-size: var(--iapx-t-label);
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--iapx-vermilion-hot); text-decoration: none;
  /* alvo de toque de 44px sem engordar a barra: o padding cria a
     área, o box-shadow desenha o sublinhado rente ao texto. */
  display: inline-flex; align-items: center; min-height: 44px;
  padding: 0 .25rem;
  box-shadow: inset 0 -2px 0 transparent;
}
.ln-nav-cta:hover, .ln-nav-cta:focus-visible { box-shadow: inset 0 -2px 0 var(--iapx-vermilion-hot); }

/* ── hero ────────────────────────────────────────────────── */
.ln-hero { padding: clamp(3.5rem, 10vw, 7rem) 0 clamp(3rem, 8vw, 5rem); }
.ln-hero .iapx-eyebrow { margin-bottom: 1.25rem; }
.ln-hero h1 { max-width: 14ch; }
.ln-hero .iapx-lead { max-width: 46ch; margin: 1.5rem 0 0; }
/* meta do hero: chips do sistema (.iapx-tags/.iapx-chip). Sobre laranja o
   chip já é grafite com tinta hot — 5,06:1. O mono a .86 não passava de 3,8:1. */
.ln-hero-meta { margin-top: 2.25rem; padding-top: 1.25rem;
  border-top: 1px solid rgba(26, 21, 18, .28); }

/* ── diagnóstico: lista numerada em duas colunas ─────────── */
.ln-probs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 0 var(--iapx-block); }
.ln-prob { border-top: 1px solid var(--iapx-line); padding: 1.35rem 0; display: flex; gap: 1.1rem; }
.ln-prob b { font-family: var(--iapx-display); font-weight: 400; font-size: 1.6rem;
  color: var(--iapx-vermilion); line-height: .9; min-width: 2.5rem; }
.ln-prob h3 { font-family: var(--iapx-display); font-weight: 400; font-size: 1.2rem;
  letter-spacing: .04em; text-transform: uppercase; margin: 0 0 .35rem; }
.ln-prob p { margin: 0; font-size: var(--iapx-t-small); color: var(--iapx-mute); line-height: 1.65; }

/* ── antes / depois ──────────────────────────────────────── */
.ln-shift { border-top: 2px solid var(--iapx-vermilion); }
.ln-shift-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;
  border-bottom: 1px solid var(--iapx-line); padding: .95rem 0; align-items: start; }
.ln-shift-row > :first-child { color: var(--iapx-mute); }
.ln-shift-row > :last-child { color: var(--iapx-cream); font-weight: 500; }
.ln-shift-key { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;
  font-family: var(--iapx-label); font-weight: 700; font-size: var(--iapx-t-label);
  letter-spacing: .22em; text-transform: uppercase; padding-bottom: .6rem; }
.ln-shift-key > :first-child { color: var(--iapx-mute); }
.ln-shift-key > :last-child { color: var(--iapx-vermilion-ink, var(--iapx-vermilion-hot)); }
.ln-shift-row p { margin: 0; font-size: var(--iapx-t-small); line-height: 1.6; }

/* ── eixos do programa ───────────────────────────────────── */
.ln-axes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 1px; background: var(--iapx-line); border: 1px solid var(--iapx-line); }
.ln-axis { background: var(--iapx-ink); padding: 1.5rem 1.35rem; }
.ln-axis span { font-family: var(--iapx-mono); font-size: .72rem; letter-spacing: .12em;
  color: var(--iapx-vermilion-ink, var(--iapx-vermilion-hot)); }
.ln-axis h3 { font-family: var(--iapx-display); font-weight: 400; font-size: 1.35rem;
  letter-spacing: .04em; text-transform: uppercase; margin: .5rem 0 .5rem; }
.ln-axis p { margin: 0; font-size: var(--iapx-t-small); color: var(--iapx-mute); line-height: 1.6; }

/* ── público ─────────────────────────────────────────────── */
.ln-who { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: var(--iapx-gutter); }

/* ============================================================
   § OFERTA — o padrão que o sistema não tinha
   Duas ofertas de peso idêntico, separadas por critério e não
   por preço. Mesma estrutura, mesma superfície, mesma altura:
   nada aqui empurra para o mais caro. O que muda entre as duas
   colunas é a PERGUNTA no topo, não a ênfase visual.
   ============================================================ */
.ln-offers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 1px; background: var(--iapx-line); border: 1px solid var(--iapx-line); }
.ln-offer { background: var(--iapx-surface); padding: clamp(1.5rem, 3vw, 2.25rem);
  display: flex; flex-direction: column; }
.ln-offer-crit {
  font-family: var(--iapx-label); font-weight: 700; font-size: var(--iapx-t-label);
  letter-spacing: .2em; text-transform: uppercase; color: var(--iapx-vermilion-ink, var(--iapx-vermilion-hot));
  padding-bottom: .9rem; margin-bottom: 1.35rem; border-bottom: 2px solid var(--iapx-vermilion);
}
.ln-offer h3 { font-family: var(--iapx-display); font-weight: 400; font-size: 2rem;
  letter-spacing: .03em; text-transform: uppercase; line-height: .95; margin: 0 0 .5rem; }
.ln-offer-shape { font-family: var(--iapx-mono); font-size: .76rem; letter-spacing: .08em;
  color: var(--iapx-mute); margin: 0 0 1.35rem; }
.ln-offer ul { list-style: none; padding: 0; margin: 0 0 1.75rem; }
.ln-offer li { font-size: var(--iapx-t-small); line-height: 1.6; padding: .6rem 0;
  border-bottom: 1px solid var(--iapx-line); display: flex; gap: .7rem; }
.ln-offer li::before { content: "▸"; color: var(--iapx-accent); flex: none; }
.ln-offer-foot { margin-top: auto; }
.ln-offer-val { font-family: var(--iapx-display); font-weight: 400; font-size: 2.6rem;
  line-height: 1; color: var(--iapx-cream); }
.ln-offer-terms { font-size: var(--iapx-t-small); color: var(--iapx-mute); margin: .35rem 0 1.35rem; }

/* Guia de escolha: o critério vem antes das colunas, não depois. */
.ln-choose { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: var(--iapx-gutter); margin-bottom: var(--iapx-gutter); }

/* ── passos ──────────────────────────────────────────────── */
.ln-step { display: flex; gap: 1.25rem; padding: 1.1rem 0; border-bottom: 1px solid var(--iapx-line); }
.ln-step b { font-family: var(--iapx-display); font-weight: 400; font-size: 1.7rem;
  color: var(--iapx-vermilion); line-height: .9; min-width: 2.5rem; }
.ln-step h3 { font-family: var(--iapx-display); font-weight: 400; font-size: 1.15rem;
  letter-spacing: .04em; text-transform: uppercase; margin: 0 0 .3rem; }
.ln-step p { margin: 0; font-size: var(--iapx-t-small); color: var(--iapx-mute); line-height: 1.6; }

/* ── nota de rodapé e ressalvas ──────────────────────────── */
.ln-fine { font-size: .78rem; line-height: 1.65; color: var(--iapx-mute); max-width: 72ch; }
.ln-fine strong { color: var(--iapx-cream); font-weight: 600; }

/* foco visível: agora vive no tema (iapx-web.css v1.0.2). */

@media (max-width: 640px) {
  .ln-shift-row, .ln-shift-key { grid-template-columns: 1fr; gap: .35rem; }
  .ln-shift-key > :first-child { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important;
      transition-duration: .01ms !important; scroll-behavior: auto !important; }
}