/* ============================================================
   JIANOTI · LP — camada de conversão (aditiva sobre forte.css)
   Usada só nas landing pages de campanha (noindex).
   Regra: a página tem UM destino — o CTA. Sem menu, sem links
   que tirem o visitante da página.
============================================================ */

/* === HEADER MINIMALISTA DE LP === */
.f-lpnav{position:static;background:#E9E9E9;border-bottom:1px solid rgba(28,31,36,.07)}
.f-lpnav-inner{max-width:1080px;margin:0 auto;padding:13px 28px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.f-lpnav-brand{display:block;width:210px;height:24px;background:url('../images/logo-versao-2.svg') left center/contain no-repeat;flex-shrink:0}
.f-lpnav-right{display:flex;align-items:center;gap:18px}
.f-lpnav-oab{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:#1C1F24;opacity:.5}
.f-lpnav-cta{padding:11px 20px;font-size:13px}
@media (max-width:640px){
  .f-lpnav-inner{padding:11px 18px;gap:12px}
  .f-lpnav-brand{width:150px;height:18px}
  .f-lpnav-oab{display:none}
  .f-lpnav-cta{padding:10px 16px;font-size:12.5px}
  .f-lpnav-cta .lg{display:none}
}
@media (min-width:641px){.f-lpnav-cta .sm{display:none}}

/* === PROVA SOCIAL INLINE (abaixo do CTA do hero) === */
.f-proof-inline{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:-8px 0 24px;font-size:13px;line-height:1.5;opacity:.9}
.f-proof-inline .f-stars-inline{display:inline-flex;gap:2px}
.f-proof-inline .f-stars-inline svg{width:13px;height:13px;fill:#B08D57}
.f-proof-inline strong{font-weight:600;color:#E9E9E9}
.f-proof-light strong{color:#1C1F24}

/* === SELOS DE CONFIANÇA === */
.f-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.f-badge{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:1px solid rgba(28,31,36,.14);border-radius:999px;font-size:12.5px;font-weight:500;background:#fff}
.f-badge svg{width:14px;height:14px;stroke:#4653B1;stroke-width:2;fill:none;flex-shrink:0}
.f-dark .f-badge,.f-cta-banner .f-badge{background:rgba(233,233,233,.05);border-color:rgba(233,233,233,.18);color:#E9E9E9}
.f-dark .f-badge svg,.f-cta-banner .f-badge svg{stroke:#8B96E8}

/* === FAIXA DE NÚMEROS (3 itens) === */
/* forte.css força 2 colunas abaixo de 880px, o que deixaria um item órfão */
@media (min-width:641px) and (max-width:880px){.f-lp .f-stats-grid{grid-template-columns:repeat(3,1fr)!important}}
@media (max-width:640px){
  .f-lp .f-stats-grid{grid-template-columns:1fr!important;gap:16px}
  .f-lp .f-stat{display:flex;align-items:baseline;justify-content:center;gap:10px;text-align:left}
  .f-lp .f-stat .num{font-size:27px;margin-bottom:0;flex-shrink:0}
  .f-lp .f-stat .label{font-size:10.5px;letter-spacing:.14em}
}

/* === MAPA DA REDE DE ASSOCIADOS === */
.f-mapa{max-width:840px;margin:0 auto;background:#fff;border:1px solid rgba(28,31,36,.09);border-radius:12px;padding:30px;text-align:center}
@media (max-width:640px){.f-mapa{padding:22px 16px}}
.f-mapa .f-eyebrow{margin-bottom:8px}
.f-mapa .f-h3{margin-bottom:18px}
.f-mapa p{font-size:14.5px;line-height:1.65;opacity:.8;max-width:600px;margin:20px auto 0}
.f-mapa p strong{font-weight:600;color:#4653B1;opacity:1}

/* === DIREITOS + SITUAÇÕES EM DUAS COLUNAS === */
.f-two{display:grid;grid-template-columns:1fr 1fr;gap:38px;text-align:left;margin:26px 0 26px;align-items:start}
@media (max-width:760px){.f-two{grid-template-columns:1fr;gap:22px;margin:22px 0}}
.f-minilabel{display:block;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#4653B1;margin-bottom:12px}
.f-two .f-arrow-list{font-size:14.5px;gap:11px}
/* duas colunas em qualquer largura: 6 linhas em vez de 11 */
.f-checks{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
.f-checks li{position:relative;padding-left:20px;font-size:13.5px;line-height:1.35}
@media (max-width:760px){.f-checks li{font-size:13px}}
.f-checks li::before{content:"";position:absolute;left:2px;top:4px;width:10px;height:5px;border-left:2px solid #4653B1;border-bottom:2px solid #4653B1;transform:rotate(-45deg)}
/* o alerta mora dentro da coluna: sem largura máxima nem centralização própria */
.f-two .f-alert-center{margin:20px 0 0;max-width:none;font-size:13.5px}

/* === ALERTA DE PRAZO (centralizado, com ícone) === */
.f-alert-center{display:flex;align-items:flex-start;gap:12px;text-align:left;max-width:560px;margin:26px auto;font-size:14.5px;line-height:1.6}
.f-alert-center svg{width:20px;height:20px;stroke:#4653B1;flex-shrink:0;margin-top:2px}
.f-alert-center strong{display:block;margin-bottom:2px}

/* === HERO: no mobile a foto sai; o espaço vale mais para o CTA === */
@media (max-width:880px){
  .f-lp .f-hero-photo{display:none}
  .f-lp .f-hero-grid{gap:0}
}

/* === MAPA: reserva o espaço antes de montar, para não pular layout === */
.f-mapa-slot{max-width:640px;aspect-ratio:743/665;margin:0 auto}

/* === FORMULÁRIO: nome e WhatsApp lado a lado === */
.f-field-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:540px){.f-field-split{grid-template-columns:1fr}}
.f-opt{font-weight:500;letter-spacing:.04em;text-transform:none;opacity:.55}

/* ============================================================
   MOBILE — alvos de toque, legibilidade e custo de renderização
============================================================ */

/* alvo de toque mínimo de 44px nos botões e links do rodapé */
@media (max-width:880px){
  .f-lpnav-cta{min-height:44px;padding-top:0;padding-bottom:0}
  .f-btn{min-height:44px;padding-top:0;padding-bottom:0;justify-content:center}
  .f-sticky-cta .f-btn{min-height:46px}
  .f-lpfoot a,.f-form p a{display:inline-block;padding:13px 4px}
  .f-faq summary{padding-top:18px;padding-bottom:18px}
}

/* rótulos da faixa de números estavam em 10,5px */
@media (max-width:640px){.f-lp .f-stat .label{font-size:11px}}

/* dobras longas abaixo da linha d'água só são renderizadas ao chegar perto.
   O contain-intrinsic-size reserva a altura para a barra de rolagem não pular. */
@media (max-width:880px){
  .f-lp .f-testimonials{content-visibility:auto;contain-intrinsic-size:auto 1300px}
}

/* === BARRA FIXA DE CTA (mobile) === */
.f-sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:98;display:none;align-items:center;justify-content:space-between;gap:14px;padding:11px 16px calc(11px + env(safe-area-inset-bottom));background:rgba(28,31,36,.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(139,150,232,.25);box-shadow:0 -10px 28px -12px rgba(0,0,0,.5)}
.f-sticky-cta .txt{display:flex;flex-direction:column;line-height:1.25;color:#E9E9E9;min-width:0}
.f-sticky-cta .txt strong{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.f-sticky-cta .txt span{font-size:11.5px;opacity:.65;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.f-sticky-cta .f-btn{padding:13px 20px;font-size:13.5px;flex-shrink:0}
@media (max-width:880px){
  .f-sticky-cta{display:flex}
  body{padding-bottom:74px}
  .f-wa-float{display:none}
}

/* === RODAPÉ MINIMALISTA DE LP === */
.f-lpfoot{background:#15182F;color:#E9E9E9;padding:44px 0 40px;text-align:center}
.f-lpfoot-brand{display:block;width:190px;height:22px;margin:0 auto 18px;background:url('../images/logo-versao-2-clara.svg') center/contain no-repeat}
.f-lpfoot p{font-size:12.5px;line-height:1.75;opacity:.6;max-width:620px;margin:0 auto}
.f-lpfoot p+p{margin-top:8px}
.f-lpfoot a{color:#8B96E8;text-decoration:underline;text-underline-offset:2px}

/* === AJUSTES === */
.f-lp .f-hero{padding:72px 0}
@media (max-width:880px){.f-lp .f-hero{padding:52px 0}}
.f-cta-mini{margin-top:26px}
.f-urgency{color:#4653B1;font-family:'Lora',serif;font-style:italic;font-size:18px;line-height:1.5;margin-bottom:22px}
.f-dark .f-urgency,.f-cta-banner .f-urgency{color:#8B96E8}