/* ==========================================================================
   CarroEC - Landing pages de conversão
   Herda os tokens de styles.css. Layout vertical, foco único, CTA repetido.
   ========================================================================== */

/* ---------- Header enxuto: sem navegação, sem vazamento ---------- */
.lp-header{
  position:sticky; top:0; z-index:60; height:66px;
  background:rgba(255,255,255,.9); backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent; transition:border-color .2s ease, box-shadow .2s ease;
}
.lp-header.is-stuck{ border-bottom-color:var(--soft-gray); box-shadow:0 6px 24px rgba(8,39,61,.06); }
.lp-header__inner{ height:66px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.lp-header .logo__img{ height:30px; }

/* ---------- Hero ---------- */
.lp-hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(900px 460px at 82% -14%, rgba(47,128,237,.26), transparent 62%),
    radial-gradient(700px 420px at 6% 110%, rgba(10,175,102,.20), transparent 66%),
    linear-gradient(166deg, var(--navy) 0%, #0A3049 48%, var(--petrol) 100%);
  color:#fff; padding: clamp(52px,6vw,86px) 0 clamp(60px,7vw,96px);
}
.lp-hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(78% 68% at 50% 30%, #000 20%, transparent 78%);
  pointer-events:none;
}
.lp-hero > .container{ position:relative; z-index:1; }
.lp-hero h1{
  color:#fff; font-size:clamp(2.05rem, 1.2rem + 3.1vw, 3.5rem);
  letter-spacing:-.034em; line-height:1.08; max-width:19ch;
}
.lp-hero h1 em{ font-style:normal; color:#7FE3B4; }
.lp-hero__lead{ margin-top:22px; font-size:1.14rem; color:var(--ink-invert); max-width:40ch; }
.lp-hero__grid{ display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(30px,5vw,64px); align-items:center; }
.lp-hero--center{ text-align:center; }
.lp-hero--center h1, .lp-hero--center .lp-hero__lead{ margin-inline:auto; }

/* ---------- Bloco de perda (aversão à perda) ---------- */
.loss{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.loss__card{
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius);
  padding:26px; border-top:3px solid var(--st-red);
  box-shadow:var(--shadow-sm);
}
.loss__card b{ display:block; color:var(--navy); font-size:1.04rem; margin-bottom:9px; letter-spacing:-.015em; }
.loss__card p{ color:var(--muted); font-size:.92rem; }
.loss__tag{
  display:inline-block; margin-bottom:14px; padding:4px 10px; border-radius:7px;
  background:rgba(225,77,77,.08); border:1px solid rgba(225,77,77,.28);
  color:#C43C3C; font-size:.71rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
}

/* ---------- Números grandes / ancoragem ---------- */
.bignum{ font-size:clamp(2.6rem,1.6rem+3.6vw,4.4rem); font-weight:780; letter-spacing:-.045em; line-height:1; }
.anchor{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:stretch; }
.anchor__item{
  border-radius:var(--radius); padding:24px; text-align:center;
  border:1px solid var(--soft-gray); background:#fff;
}
.anchor__item span{ display:block; font-size:.86rem; color:var(--muted); margin-top:10px; line-height:1.45; }
.anchor__item .bignum{ color:var(--muted-soft); }
.anchor__item--win{
  background:linear-gradient(160deg,#fff,#F1FBF6); border-color:rgba(10,175,102,.4);
  box-shadow:0 16px 44px rgba(10,175,102,.14);
}
.anchor__item--win .bignum{ color:var(--emerald); }
.anchor__item--win span{ color:var(--navy); font-weight:560; }

/* ---------- Quiz / calculadora (efeito de auto-geração) ---------- */
.tool-card{
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); overflow:hidden;
}
.tool-card--onhero{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); backdrop-filter:blur(10px); }
.tool-card__hd{ padding:20px 24px 0; }
.tool-card__hd b{ display:block; font-size:1.02rem; color:var(--navy); }
.tool-card--onhero .tool-card__hd b{ color:#fff; }
.tool-card__hd span{ display:block; margin-top:5px; font-size:.86rem; color:var(--muted); }
.tool-card--onhero .tool-card__hd span{ color:var(--ink-invert); }
.tool-card__bd{ padding:20px 24px 24px; display:grid; gap:16px; }

.q{ display:grid; gap:9px; }
.q > label{
  font-size:.76rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
}
.tool-card--onhero .q > label{ color:#9FB6C7; }
.opts{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.opt{
  padding:11px 13px; border-radius:10px; border:1px solid var(--soft-gray); background:#fff;
  font-size:.885rem; color:var(--graphite); text-align:left; font-weight:520;
  transition:border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
}
.opt:hover{ border-color:var(--petrol); }
.opt.is-on{
  border-color:var(--emerald); background:rgba(10,175,102,.09); color:var(--navy); font-weight:640;
  box-shadow:0 0 0 3px rgba(10,175,102,.12);
}
.tool-card--onhero .opt{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.18); color:#DCEAF3; }
.tool-card--onhero .opt:hover{ border-color:rgba(255,255,255,.42); }
.tool-card--onhero .opt.is-on{ background:rgba(10,175,102,.24); border-color:#7FE3B4; color:#fff; }

.num-in{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--soft-gray);
  background:#fff; outline:0; font-family:var(--mono); font-size:1rem; color:var(--navy);
}
.num-in:focus{ border-color:var(--data-blue); box-shadow:0 0 0 3px rgba(47,128,237,.15); }
.tool-card--onhero .num-in{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); color:#fff; }
.tool-card--onhero .num-in:focus{ border-color:#7FE3B4; box-shadow:0 0 0 3px rgba(10,175,102,.2); }

.range-row{ display:flex; align-items:center; gap:14px; }
.range-row input[type=range]{ flex:1; accent-color:var(--emerald); }
.range-val{
  font-family:var(--mono); font-weight:700; font-size:1rem; color:var(--navy);
  min-width:74px; text-align:right;
}
.tool-card--onhero .range-val{ color:#fff; }

/* Resultado */
.result{
  border-radius:var(--radius); padding:22px; margin-top:4px;
  background:var(--ice); border:1px solid var(--soft-gray);
}
.result--alert{ background:rgba(225,77,77,.06); border-color:rgba(225,77,77,.3); }
.result--ok{ background:rgba(10,175,102,.07); border-color:rgba(10,175,102,.32); }
.result__lead{ font-size:.78rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.result__big{ margin:8px 0 6px; font-size:2.4rem; font-weight:780; letter-spacing:-.04em; line-height:1; color:var(--navy); }
.result--alert .result__big{ color:var(--st-red); }
.result__note{ font-size:.9rem; color:var(--muted); line-height:1.55; }
.blind{ display:grid; gap:8px; margin-top:14px; }
.blind__row{
  display:flex; align-items:center; gap:10px; padding:10px 13px; border-radius:10px;
  font-size:.875rem; background:#fff; border:1px solid var(--soft-gray); color:var(--graphite);
}
.blind__row i{ width:8px; height:8px; border-radius:50%; flex:0 0 auto; background:var(--st-red); }
.blind__row.ok i{ background:var(--st-green); }
.blind__row.warn i{ background:var(--st-amber); }

/* ---------- Passos ---------- */
.steps3{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; counter-reset:s; }
.step{
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius);
  padding:26px 24px; position:relative;
}
.step__n{
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  background:var(--navy); color:#fff; font-family:var(--mono); font-weight:700; font-size:.85rem;
  margin-bottom:16px;
}
.step b{ display:block; color:var(--navy); font-size:1.02rem; margin-bottom:6px; letter-spacing:-.015em; }
.step p{ font-size:.9rem; color:var(--muted); }
.step__time{
  margin-top:14px; display:inline-flex; align-items:center; gap:7px;
  font-size:.76rem; font-weight:640; color:var(--emerald);
}

/* ---------- Objeções ---------- */
.obj{ display:grid; gap:12px; max-width:820px; margin-inline:auto; }
.obj__item{
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius);
  padding:22px 24px; display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start;
}
.obj__q{
  grid-column:1 / -1; font-size:1.02rem; font-weight:650; color:var(--navy);
  display:flex; align-items:center; gap:10px;
}
.obj__q::before{
  content:"“"; font-size:2rem; line-height:0; color:var(--soft-gray); margin-top:.35em;
}
.obj__a{ grid-column:1 / -1; font-size:.93rem; color:var(--muted); line-height:1.6; padding-left:26px; }
.obj__a b{ color:var(--navy); font-weight:620; }

/* ---------- Garantia / reversão de risco ---------- */
.guarantee{
  display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center;
  border-radius:var(--radius-lg); padding:clamp(24px,3vw,34px);
  background:linear-gradient(150deg,#fff,#F1FBF6); border:1px solid rgba(10,175,102,.34);
}
.guarantee__ico{
  width:64px; height:64px; border-radius:18px; display:grid; place-items:center; flex:0 0 auto;
  background:rgba(10,175,102,.12); border:1px solid rgba(10,175,102,.3); color:var(--emerald);
}
.guarantee b{ display:block; font-size:1.16rem; color:var(--navy); letter-spacing:-.02em; }
.guarantee p{ margin-top:8px; font-size:.95rem; color:var(--muted); max-width:62ch; }

/* ---------- Oferta / preço ---------- */
.offer{
  max-width:520px; margin-inline:auto; text-align:center;
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); padding:clamp(28px,4vw,42px); position:relative;
}
.offer__tag{
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background:var(--emerald); color:#04231A; font-size:.71rem; font-weight:750;
  letter-spacing:.08em; text-transform:uppercase; padding:6px 14px; border-radius:8px;
  white-space:nowrap;
}
.offer__price{ display:flex; align-items:baseline; justify-content:center; gap:6px; margin:6px 0 4px; }
.offer__price .cur{ font-size:1.3rem; font-weight:640; color:var(--navy); }
.offer__price .val{ font-size:4rem; font-weight:790; letter-spacing:-.05em; color:var(--navy); line-height:1; }
.offer__price .per{ font-size:.95rem; color:var(--muted); }
.offer__compare{ font-size:.87rem; color:var(--muted); margin-bottom:22px; }
.offer__list{ list-style:none; margin:0 0 26px; padding:0; display:grid; gap:10px; text-align:left; }
.offer__list li{ position:relative; padding-left:26px; font-size:.925rem; color:var(--graphite); }
.offer__list li::before{
  content:""; position:absolute; left:0; top:.42em; width:15px; height:15px; border-radius:50%;
  background:rgba(10,175,102,.16); box-shadow:inset 0 0 0 1.6px var(--emerald);
}
.offer__fine{ margin-top:16px; font-size:.78rem; color:var(--muted-soft); }

/* ---------- Prova social: espaço reservado, nunca inventado ---------- */
.proof-slot{
  border:1.5px dashed var(--soft-gray); border-radius:var(--radius); padding:26px;
  background:#FBFCFD; text-align:center;
}
.proof-slot b{ display:block; color:var(--muted); font-size:.9rem; margin-bottom:6px; }
.proof-slot span{ font-size:.83rem; color:var(--muted-soft); }

/* ---------- CTA final ---------- */
.final{
  position:relative; overflow:hidden; border-radius:var(--radius-lg); text-align:center; color:#fff;
  padding:clamp(38px,5vw,66px);
  background:
    radial-gradient(700px 360px at 80% 6%, rgba(10,175,102,.28), transparent 62%),
    radial-gradient(640px 360px at 14% 96%, rgba(47,128,237,.24), transparent 64%),
    linear-gradient(150deg, var(--navy), var(--petrol));
}
.final h2{ color:#fff; max-width:20ch; margin-inline:auto; }
.final p{ margin:18px auto 28px; color:var(--ink-invert); max-width:56ch; font-size:1.05rem; }
.final__fine{ margin-top:18px; font-size:.8rem; color:#9FB6C7; }

.btn--xl{ padding:17px 32px; font-size:1.04rem; border-radius:14px; }

/* ---------- Barra fixa mobile: CTA sempre ao alcance ---------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:70; display:none;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94); backdrop-filter:blur(12px);
  border-top:1px solid var(--soft-gray);
}
.sticky-cta .btn{ width:100%; }

/* ---------- Responsivo ---------- */
@media (max-width:1000px){
  .lp-hero__grid{ grid-template-columns:1fr; }
  .loss,.anchor,.steps3{ grid-template-columns:1fr; }
  .guarantee{ grid-template-columns:1fr; text-align:center; }
  .guarantee__ico{ margin-inline:auto; }
  .guarantee p{ margin-inline:auto; }
}
@media (max-width:720px){
  .opts{ grid-template-columns:1fr; }
  .sticky-cta{ display:block; }
  body.has-sticky{ padding-bottom:82px; }
  .lp-header__inner .btn{ display:none; }
}

/* ==========================================================================
   LP Oficina v2 - domínio grátis, gerador de endereço, empilhamento de valor
   ========================================================================== */

/* ---------- Preço no hero ---------- */
.hero-price{
  display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
  margin-top:26px; padding-top:24px; border-top:1px solid rgba(255,255,255,.15);
}
.hero-price .val{ font-size:2.9rem; font-weight:790; letter-spacing:-.045em; color:#fff; line-height:1; }
.hero-price .per{ font-size:1rem; color:var(--ink-invert); }
.hero-price .day{ font-size:.86rem; color:#9FB6C7; width:100%; margin-top:6px; }

.freebadge{
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(10,175,102,.18); border:1px solid rgba(127,227,180,.5);
  color:#7FE3B4; padding:7px 13px; border-radius:9px;
  font-size:.79rem; font-weight:700; letter-spacing:.02em;
}
.freebadge--solid{
  background:rgba(10,175,102,.1); border-color:rgba(10,175,102,.34); color:#0F8A50;
}

/* ---------- Gerador de endereço (efeito de dotação) ---------- */
.domaincard{
  background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  border:1px solid rgba(255,255,255,.5); overflow:hidden;
}
.domaincard__hd{
  padding:22px 24px 0;
}
.domaincard__hd b{ display:block; font-size:1.06rem; color:var(--navy); letter-spacing:-.018em; }
.domaincard__hd span{ display:block; margin-top:6px; font-size:.875rem; color:var(--muted); }
.domaincard__bd{ padding:20px 24px 24px; }

.domain-field{
  display:flex; align-items:stretch; border:1px solid var(--soft-gray);
  border-radius:12px; overflow:hidden; background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.domain-field:focus-within{ border-color:var(--emerald); box-shadow:0 0 0 3px rgba(10,175,102,.14); }
.domain-field input{
  flex:1; min-width:0; border:0; outline:0; padding:14px 15px;
  font-size:1rem; color:var(--navy); background:transparent;
}
.domain-field input::placeholder{ color:#B9C6D1; }

.domain-preview{
  margin-top:16px; border-radius:12px; overflow:hidden;
  border:1px solid var(--soft-gray); background:#fff;
}
.domain-preview__bar{
  display:flex; align-items:center; gap:10px; padding:9px 12px;
  background:#EDF2F6; border-bottom:1px solid var(--soft-gray);
}
.domain-preview__bar .browser__dots i{ width:8px; height:8px; }
.domain-preview__url{
  flex:1; background:#fff; border:1px solid var(--soft-gray); border-radius:7px;
  padding:7px 12px; font-family:var(--mono); font-size:.86rem; color:var(--navy);
  display:flex; align-items:center; gap:8px; overflow:hidden;
}
.domain-preview__url .lock{ color:var(--emerald); flex:0 0 auto; }
.domain-preview__url .host{ font-weight:700; letter-spacing:-.01em; }
.domain-preview__url .host.is-empty{ color:#B9C6D1; font-weight:500; }
.domain-preview__body{
  padding:16px 14px; display:flex; align-items:center; gap:12px;
  background:linear-gradient(140deg,var(--navy),var(--petrol)); color:#fff;
}
.domain-preview__body .nm{ font-weight:700; font-size:1rem; letter-spacing:-.02em; }
.domain-preview__body .st{ font-size:.78rem; color:rgba(255,255,255,.72); }
.domain-hint{ margin-top:13px; font-size:.79rem; color:var(--muted-soft); line-height:1.5; }

/* ---------- Faixa do que está incluso ---------- */
.incl{
  background:var(--navy); border-top:1px solid rgba(255,255,255,.1);
  padding:20px 0;
}
.incl__grid{ display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; }
.incl__item{
  display:inline-flex; align-items:center; gap:9px;
  font-size:.885rem; color:#DCEAF3; font-weight:520;
}
.incl__item svg{ color:#7FE3B4; flex:0 0 auto; }

/* ---------- Empilhamento de valor ---------- */
.stack{
  max-width:720px; margin-inline:auto;
  background:#fff; border:1px solid var(--soft-gray); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow);
}
.stack__row{
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:15px 24px; border-bottom:1px solid var(--ice); font-size:.94rem;
}
.stack__row span{ color:var(--graphite); }
.stack__row b{ font-family:var(--mono); font-size:.9rem; color:var(--muted); font-weight:600; white-space:nowrap; }
.stack__row--sum{
  background:var(--ice); border-top:1px solid var(--soft-gray); border-bottom:0;
  padding:19px 24px;
}
.stack__row--sum span{ font-weight:700; color:var(--navy); }
.stack__row--sum b{
  font-size:1.06rem; color:var(--muted); text-decoration:line-through;
  text-decoration-color:rgba(225,77,77,.75); text-decoration-thickness:2px;
}
.stack__row--win{
  background:linear-gradient(150deg,#F1FBF6,#E8F7F0);
  border-top:1px solid rgba(10,175,102,.34); border-bottom:0; padding:22px 24px;
}
.stack__row--win span{ font-weight:750; color:var(--navy); font-size:1.02rem; }
.stack__row--win b{ font-size:1.5rem; color:var(--emerald); font-weight:790; letter-spacing:-.03em; }
.stack__note{ margin-top:18px; text-align:center; font-size:.83rem; color:var(--muted-soft); }

/* ---------- Oferta v2 ---------- */
.offer__free{
  display:flex; align-items:center; gap:12px; text-align:left;
  margin:0 0 22px; padding:14px 16px; border-radius:12px;
  background:rgba(10,175,102,.07); border:1px solid rgba(10,175,102,.32);
}
.offer__free svg{ color:var(--emerald); flex:0 0 auto; }
.offer__free b{ display:block; font-size:.92rem; color:var(--navy); }
.offer__free span{ font-size:.815rem; color:var(--muted); }

@media (max-width:1000px){
  .stack__row{ padding:14px 18px; font-size:.9rem; }
}
@media (max-width:720px){
  .incl__grid{ gap:10px 18px; }
  .incl__item{ font-size:.82rem; }
  .hero-price .val{ font-size:2.4rem; }
}

/* ==========================================================================
   LP Motorista v2 - identificação da placa, paridade com a LP de oficina
   ========================================================================== */

/* ---------- Campo de placa dentro do card claro ---------- */
.platecard__field{
  border:3px solid #0A1B2C; border-radius:12px; overflow:hidden; background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.platecard__field:focus-within{ box-shadow:0 0 0 3px rgba(10,175,102,.18); }
.platecard__field .plate__strip{ font-size:.58rem; }
.platecard__field input{
  width:100%; border:0; outline:0; padding:12px 10px 14px;
  font-family:var(--mono); font-size:1.85rem; font-weight:700;
  letter-spacing:.14em; text-align:center; text-transform:uppercase;
  color:#0A1B2C; background:#fff;
}
.platecard__field input::placeholder{ color:#C7D3DC; }

/* ---------- Cartão do veículo identificado (efeito de dotação) ---------- */
.vcard{
  margin-top:16px; border-radius:12px; overflow:hidden;
  border:1px solid var(--soft-gray); background:#fff;
}
.vcard__top{
  display:flex; align-items:center; gap:13px; padding:15px 16px;
  background:linear-gradient(140deg,var(--navy),var(--petrol)); color:#fff;
}
.vcard__ico{
  width:38px; height:38px; border-radius:11px; flex:0 0 auto; display:grid; place-items:center;
  background:rgba(255,255,255,.12);
}
.vcard__nm{ font-weight:700; font-size:1rem; letter-spacing:-.02em; display:block; }
.vcard__nm.is-empty{ color:rgba(255,255,255,.5); font-weight:600; }
.vcard__st{ font-size:.77rem; color:rgba(255,255,255,.72); }
.vcard__rows{ padding:6px 16px 14px; }
.vcard__row{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:9px 0; border-bottom:1px dashed var(--soft-gray); font-size:.86rem; color:var(--muted);
}
.vcard__row:last-child{ border-bottom:0; }
.vcard__row b{ font-family:var(--mono); font-size:.83rem; color:var(--navy); font-weight:600; }
.vcard__row .pend{ color:var(--st-amber); }
.vcard__row .late{ color:var(--st-red); }
.vcard__row .fine{ color:var(--emerald); }

/* ---------- Oferta gratuita ---------- */
.offer__price .val--free{ color:var(--emerald); }
.offer__free--driver{ background:rgba(47,128,237,.06); border-color:rgba(47,128,237,.3); }
.offer__free--driver svg{ color:var(--data-blue); }
