/* Opções de hero + seção 2 para aprovação. Usa os tokens de brizmo.css. */

/* Barra de troca de opções */
.op-barra { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 60; display: flex; gap: 4px; padding: 6px; background: var(--preto); border-radius: 999px; box-shadow: 0 16px 40px -12px rgba(0,0,0,.5); max-width: calc(100% - 32px); overflow-x: auto; }
.op-barra a { color: #cfccdb; text-decoration: none; font: 500 13px/1 var(--f-titulo); padding: 11px 16px; border-radius: 999px; white-space: nowrap; }
.op-barra a:hover { color: #fff; background: rgba(255,255,255,.08); }
.op-barra a[aria-current="page"] { background: #fff; color: var(--preto); }

/* Selos e prova na primeira dobra (comum) */
.prova { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: var(--s-6); padding-top: var(--s-5); border-top: 1px solid var(--linha); }
.prova__num strong { display: block; font: 500 1.35rem/1.1 var(--f-titulo); color: var(--tinta); letter-spacing: -.02em; }
.prova__num span { font-size: 12.5px; color: var(--tinta-3); }
.selo-ms { display: inline-flex; align-items: center; gap: 12px; padding: 10px 16px 10px 12px; background: #fff; border: 1px solid var(--linha); border-radius: 12px; }
.selo-ms svg { width: 26px; height: 26px; }
.selo-ms b { display: block; font: 600 14px/1.2 "Segoe UI", var(--f-texto); color: #505050; }
.selo-ms span { display: block; font-size: 11.5px; color: var(--tinta-3); }
.logos-dobra { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px 36px; align-items: center; padding: var(--s-5) 0; }
.logos-dobra__t { font-size: 13px; color: var(--tinta-3); flex-basis: 100%; }
.logos-dobra .logo-cliente { font-size: 1.05rem; height: auto; }

/* Painel "por que esta opção" */
.porque { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-7); display: grid; grid-template-columns: .8fr 1.2fr; gap: var(--s-7); }
.porque h2 { font-size: var(--t-2xl); }
.porque ul { list-style: none; display: grid; gap: 14px; }
.porque li { display: grid; grid-template-columns: 18px 1fr; gap: 12px; font-size: var(--t-sm); }
.porque li::before { content: ""; width: 12px; height: 12px; margin-top: 6px; background: var(--roxo); border-radius: 0 0 12px 0; }
.porque small { display: block; color: var(--tinta-3); margin-top: 2px; }
.porque .risco { margin-top: var(--s-5); padding: var(--s-4); border-radius: var(--r-sm); background: #fff7e6; font-size: var(--t-sm); color: #6b4b00; }

/* ============ Opção A: B montado com uma peça de foto ============ */
.opA { padding: var(--s-7) 0 0; position: relative; overflow: hidden; }
.opA__grade { display: grid; grid-template-columns: 1.05fr .95fr; gap: var(--s-8); align-items: center; }
.opA h1 { font-size: clamp(2.3rem, 1.4rem + 2.8vw, 3.5rem); }
.opA .lead { margin-bottom: var(--s-6); }
.opA__b { position: relative; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1.15fr; gap: 10px; width: min(520px, 100%); aspect-ratio: 1 / 1.08; margin-left: auto; }
.opA__peca { position: relative; overflow: hidden; }
.opA__peca--tl { border-radius: 100% 0 0 0; }
.opA__peca--tr { border-radius: 0 100% 0 0; background: var(--g-roxo); }
.opA__peca--bl { border-radius: 0; background: var(--preto); color: #fff; padding: 22px; display: flex; flex-direction: column; justify-content: flex-end; }
.opA__peca--br { border-radius: 0 0 100% 0; background: var(--g-roxo-claro); }
.opA__peca img { width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.opA__peca--bl strong { font: 500 2.2rem/1 var(--f-titulo); letter-spacing: -.03em; }
.opA__peca--bl span { font-size: 13px; color: #c9c6d6; margin-top: 6px; }
.opA__furo { position: absolute; background: var(--fundo); }
.opA__selo { position: absolute; left: -48px; top: 54%; z-index: 2; background: #fff; border-radius: 14px; box-shadow: var(--sombra-2); overflow: hidden; width: 210px; }
.opA__selo div { padding: 16px 18px; display: flex; gap: 10px; align-items: center; }
.opA__selo div svg { width: 30px; height: 30px; }
.opA__selo b { font: 600 15px/1.15 "Segoe UI", var(--f-texto); color: #505050; }
.opA__selo b small { display: block; font-weight: 400; font-size: 11px; }
.opA__selo p { margin: 0; background: var(--roxo-700); color: #fff; text-align: center; font: 500 12.5px/1 var(--f-titulo); padding: 10px; }
.opA__mock { position: absolute; right: -24px; bottom: 26px; width: 250px; z-index: 2; }
.opA__mock .janela { font-size: 11.5px; }
.opA__logos { margin-top: var(--s-7); border-top: 1px solid var(--linha); }

.pilares4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-4); }
.pil { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6) var(--s-5); background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); text-decoration: none; color: var(--tinta-2); transition: border-color .25s, box-shadow .25s, transform .25s; }
.pil:hover { border-color: var(--roxo-300); box-shadow: var(--sombra-1); transform: translateY(-2px); color: var(--tinta-2); }
.pil__marca { width: 40px; height: 40px; background: var(--g-roxo); }
.pil h3 { font-size: var(--t-lg); margin: 4px 0 0; }
.pil p { font-size: var(--t-sm); margin: 0; }
.pil ul { list-style: none; display: grid; gap: 6px; font-size: 13.5px; color: var(--tinta-3); border-top: 1px solid var(--linha); padding-top: var(--s-3); margin-top: auto; }
.pil ul li::before { content: "— "; color: var(--roxo-300); }
.pil .link-seta { margin-top: var(--s-2); }
.bases2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); margin-top: var(--s-4); }
.base2 { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); background: var(--preto); color: #cfccdb; text-decoration: none; }
.base2:hover { color: #fff; }
.base2 strong { display: block; color: #fff; font: 500 var(--t-lg)/1.2 var(--f-titulo); margin-bottom: 4px; }
.base2 span { font-size: var(--t-sm); }
.base2 svg { width: 20px; height: 20px; flex: none; color: var(--roxo-300); }

/* ============ Opção B: diagnóstico como produto ============ */
.opB { padding: var(--s-7) 0 var(--s-8); position: relative; overflow: hidden; }
.opB__grade { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-8); align-items: center; position: relative; z-index: 1; }
.opB h1 { font-size: clamp(2.3rem, 1.4rem + 2.8vw, 3.5rem); }
.relatorio { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); box-shadow: var(--sombra-2); overflow: hidden; }
.relatorio__topo { display: flex; justify-content: space-between; align-items: center; padding: 16px 22px; border-bottom: 1px solid var(--linha); }
.relatorio__topo img { width: 84px; }
.relatorio__topo span { font-size: 12px; color: var(--tinta-3); }
.relatorio__corpo { padding: 22px; display: grid; grid-template-columns: 150px 1fr; gap: 24px; }
.nota { text-align: center; }
.nota svg { width: 130px; height: 130px; margin: 0 auto; }
.nota p { font-size: 12.5px; color: var(--tinta-3); margin: 6px 0 0; }
.eixos { display: grid; gap: 12px; align-content: center; }
.eixo { display: grid; gap: 4px; font-size: 13px; }
.eixo div:first-child { display: flex; justify-content: space-between; color: var(--tinta); }
.eixo .barra { margin: 0; height: 8px; }
.prioridades { grid-column: 1 / -1; border-top: 1px solid var(--linha); padding-top: 16px; display: grid; gap: 8px; }
.prioridades h4 { font-size: 13px; margin: 0 0 4px; color: var(--tinta); }
.prioridade { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 13px; padding: 10px 12px; border-radius: 10px; background: #faf9fd; }
.opB__formas .forma { position: absolute; }

.quiz { display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--s-6); align-items: start; }
.quiz__lista { display: grid; gap: 10px; }
.quiz__item { display: flex; gap: 14px; align-items: center; padding: 16px 18px; background: #fff; border: 1.5px solid var(--linha); border-radius: var(--r-md); cursor: pointer; transition: border-color .2s, background .2s; font-size: var(--t-base); color: var(--tinta); }
.quiz__item input { width: 22px; height: 22px; accent-color: var(--roxo); flex: none; }
.quiz__item:has(input:checked) { border-color: var(--roxo); background: var(--roxo-50); }
.quiz__resultado { position: sticky; top: calc(var(--header-h) + 24px); background: var(--g-noite); color: #cfccdb; border-radius: var(--r-lg); padding: var(--s-7) var(--s-6); }
.quiz__resultado h3 { color: #fff; font-size: var(--t-2xl); }
.quiz__resultado .rotulo { font: 500 13px/1 var(--f-titulo); color: var(--roxo-300); margin-bottom: var(--s-4); display: block; }
.quiz__pecas { display: flex; gap: 8px; margin: var(--s-4) 0 var(--s-5); flex-wrap: wrap; }
.quiz__pecas span { font-size: 12.5px; padding: 6px 12px; border-radius: 999px; border: 1px solid #4b4856; color: #8d8a9c; transition: all .25s; }
.quiz__pecas span.on { background: #fff; color: var(--preto); border-color: #fff; }

/* ============ Opção C: imersivo roxo ============ */
.opC { background: radial-gradient(900px 500px at 90% 0%, rgba(255,255,255,.16), transparent 60%), var(--g-roxo); color: #fff; padding: var(--s-8) 0 140px; position: relative; overflow: hidden; }
.opC__grade { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-7); align-items: center; position: relative; z-index: 1; }
.opC h1 { color: #fff; font-size: clamp(2.4rem, 1.4rem + 3vw, 3.8rem); }
.opC .lead { color: rgba(255,255,255,.9); margin-bottom: var(--s-6); }
.opC .sobretitulo { color: #fff; }
.opC .sobretitulo::before { background: #fff; }
.opC .link-sec { color: #fff; }
.opC__foto { position: relative; margin-right: calc(var(--gutter) * -1 - 60px); height: 520px; border-radius: 200px 0 0 24px; overflow: hidden; box-shadow: 0 40px 80px -30px rgba(20,8,70,.6); }
.opC__foto img { width: 100%; height: 100%; object-fit: cover; }
.opC__vidro { position: absolute; left: 24px; bottom: 24px; padding: 16px 20px; border-radius: 16px; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); color: #fff; font-size: 13px; max-width: 280px; }
.opC__vidro strong { display: block; font: 500 1.6rem/1.1 var(--f-titulo); }
.opC__deco { position: absolute; color: #fff; opacity: .07; width: 560px; left: -200px; bottom: -260px; pointer-events: none; }
.opC__faixa { position: relative; z-index: 2; margin-top: -96px; }
.opC__faixa > div { background: #fff; border-radius: var(--r-lg); box-shadow: var(--sombra-2); padding: var(--s-5) var(--s-6); display: grid; grid-template-columns: auto 1fr; gap: var(--s-6); align-items: center; }
.opC__faixa .prova { margin: 0; padding: 0; border: 0; }
.opC__faixa .logos-dobra { padding: 0; border-left: 1px solid var(--linha); padding-left: var(--s-6); }

.personas__abas { display: inline-flex; gap: 6px; padding: 6px; background: #fff; border: 1px solid var(--linha); border-radius: 999px; margin-bottom: var(--s-6); }
.personas__abas button { border: 0; background: none; font: 500 var(--t-sm)/1 var(--f-titulo); color: var(--tinta-2); padding: 13px 20px; border-radius: 999px; cursor: pointer; }
.personas__abas button[aria-selected="true"] { background: var(--preto); color: #fff; }
.persona { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }
.persona[hidden] { display: none; }
.dor { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); display: flex; flex-direction: column; gap: var(--s-3); }
.dor q { font: 500 var(--t-lg)/1.35 var(--f-titulo); color: var(--tinta); quotes: "“" "”"; }
.dor p { font-size: var(--t-sm); margin: 0; }
.dor .link-seta { margin-top: auto; }

/* ============ Opção D: Lattine refinada ============ */
.opD { padding: var(--s-7) 0 0; position: relative; overflow: hidden; }
.opD__topo { text-align: center; max-width: 860px; margin: 0 auto; position: relative; z-index: 2; }
.opD h1 { font-size: clamp(2.4rem, 1.4rem + 3vw, 3.8rem); }
.opD .lead { margin: 0 auto var(--s-6); }
.opD .acoes { justify-content: center; }
.opD .prova { justify-content: center; border: 0; margin-top: var(--s-5); padding-top: 0; }
.opD__rotulo { text-align: center; font-size: 13px; color: var(--tinta-3); margin: var(--s-6) 0 10px; position: relative; z-index: 2; }

.bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--s-4); }
.bento__c { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); display: flex; flex-direction: column; gap: var(--s-3); text-decoration: none; color: var(--tinta-2); overflow: hidden; transition: border-color .25s, box-shadow .25s; }
.bento__c:hover { border-color: var(--roxo-300); box-shadow: var(--sombra-1); color: var(--tinta-2); }
.bento__c h3 { font-size: var(--t-xl); margin: 0; }
.bento__c p { margin: 0; font-size: var(--t-sm); }
.bento__c .janela { margin-top: auto; box-shadow: var(--sombra-1); font-size: 11.5px; }
.bento__c--4 { grid-column: span 4; }
.bento__c--2 { grid-column: span 2; }
.bento__c--3 { grid-column: span 3; }
.bento__c--escuro { background: var(--g-noite); border: 0; color: #cfccdb; }
.bento__c--escuro h3 { color: #fff; }
.bento__c--roxo { background: var(--g-roxo); border: 0; color: rgba(255,255,255,.9); }
.bento__c--roxo h3 { color: #fff; }
.bento__c--roxo .link-seta, .bento__c--escuro .link-seta { color: #fff; }
.bento__lado { display: grid; grid-template-columns: 1fr 1.1fr; gap: var(--s-5); align-items: center; flex: 1; }

/* Índice de opções */
.indice { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
.indice a { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); text-decoration: none; color: var(--tinta-2); transition: border-color .25s, box-shadow .25s; }
.indice a:hover { border-color: var(--roxo-300); box-shadow: var(--sombra-1); color: var(--tinta-2); }
.indice h2 { font-size: var(--t-xl); margin: 0; }
.indice .tag { align-self: flex-start; }
.indice dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: var(--t-sm); margin: 6px 0 0; }
.indice dt { color: var(--tinta-3); }
.indice dd { margin: 0; color: var(--tinta); }

@media (max-width: 1080px) {
  .opA__grade, .opB__grade, .opC__grade, .quiz, .porque { grid-template-columns: 1fr; }
  .opA__b { margin: var(--s-5) auto 0; }
  .pilares4 { grid-template-columns: 1fr 1fr; }
  .opC__foto { margin-right: 0; border-radius: 120px 24px 24px 24px; height: 420px; }
  .opC__faixa > div { grid-template-columns: 1fr; }
  .opC__faixa .logos-dobra { border-left: 0; padding-left: 0; border-top: 1px solid var(--linha); padding-top: var(--s-4); }
  .bento__c--4, .bento__c--2, .bento__c--3 { grid-column: span 6; }
  .quiz__resultado { position: static; }
}
@media (max-width: 720px) {
  .pilares4, .bases2, .persona, .indice { grid-template-columns: 1fr; }
  .opA__selo { left: 0; width: 180px; top: auto; bottom: -20px; }
  .opA__mock { display: none; }
  .relatorio__corpo { grid-template-columns: 1fr; }
  .personas__abas { display: flex; overflow-x: auto; border-radius: var(--r-md); }
  .personas__abas button { flex: none; }
  .bento__lado { grid-template-columns: 1fr; }
  .opC__foto { height: 300px; }
  .porque { padding: var(--s-6) var(--s-5); }
}

/* ===================== Rodada 2: homepage pela dor ===================== */
.h4 { position: relative; overflow: hidden; color: #fff; background: var(--roxo-700); }
.h4 h1 { color: #fff; font-size: clamp(2.6rem, 1.4rem + 3.6vw, 4.5rem); margin-bottom: var(--s-5); max-width: 13ch; }
.h4 .sobretitulo { color: rgba(255,255,255,.9); }
.h4 .sobretitulo::before { background: #fff; }
.h4__linha { font-size: var(--t-xl); line-height: 1.45; color: rgba(255,255,255,.9); max-width: 34ch; margin-bottom: var(--s-6); }
.h4 .link-sec { color: #fff; }
.h4__texto { position: relative; z-index: 2; }
.h4__faixa { position: relative; z-index: 2; display: flex; align-items: center; gap: var(--s-6); flex-wrap: wrap; padding: var(--s-5) 0; border-top: 1px solid rgba(255,255,255,.22); margin-top: var(--s-8); }
.h4__faixa .selo-ms { background: rgba(255,255,255,.95); border: 0; }
.h4__faixa .logo-cliente { color: rgba(255,255,255,.62); font-size: 1.05rem; height: auto; }
.h4__faixa-logos { display: flex; flex-wrap: wrap; gap: 14px 34px; align-items: center; }

/* V1: foto em tela cheia com véu roxo */
.h4--v1 { min-height: 640px; display: flex; flex-direction: column; justify-content: flex-end; padding-top: var(--s-9); }
.h4--v1 .h4__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; }
.h4--v1::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(61,42,156,.96) 0%, rgba(87,55,207,.88) 38%, rgba(125,97,244,.45) 70%, rgba(125,97,244,.15) 100%); }
.h4--v1::after { content: ""; position: absolute; z-index: 1; right: -120px; bottom: -160px; width: 420px; height: 420px; border-radius: 0 0 100% 0; transform: rotate(180deg); background: rgba(255,255,255,.08); }

/* V2: roxo com foto lateral */
.h4--v2 { background: radial-gradient(900px 500px at 90% 0%, rgba(255,255,255,.16), transparent 60%), var(--g-roxo); padding-top: var(--s-8); }
.h4--v2 .h4__grade { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-7); align-items: center; }
.h4__foto { position: relative; z-index: 2; margin-right: calc(var(--gutter) * -1 - 80px); height: 500px; border-radius: 220px 0 0 24px; overflow: hidden; box-shadow: 0 40px 80px -30px rgba(20,8,70,.6); }
.h4__foto img { width: 100%; height: 100%; object-fit: cover; }
.h4__deco { position: absolute; color: #fff; opacity: .07; width: 560px; left: -220px; bottom: -280px; pointer-events: none; }

/* V3: roxo com foto dentro do B */
.h4--v3 { background: radial-gradient(1100px 600px at 80% 20%, rgba(255,255,255,.14), transparent 60%), var(--g-roxo); padding-top: var(--s-8); }
.h4--v3 .h4__grade { display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--s-7); align-items: center; }
.h4__b { width: min(400px, 100%); aspect-ratio: 105 / 139; margin-left: auto; position: relative; z-index: 2; }
.h4__b .bfoto { filter: drop-shadow(0 40px 50px rgba(20, 8, 70, .45)); }
.h4__b .bfoto__img { opacity: 1; }
.h4__b .bfoto__veu { fill: rgba(87,55,207,.06); }

/* Seção: o que você precisa resolver */
.momentos { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }
.momento { position: relative; display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6); min-height: 220px; background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); text-decoration: none; color: var(--tinta-2); transition: background .3s var(--ease), border-color .3s, transform .3s var(--ease), box-shadow .3s; overflow: hidden; }
.momento h3 { font-size: var(--t-xl); margin: 0; }
.momento p { font-size: var(--t-sm); margin: 0; color: var(--tinta-3); }
.momento__seta { margin-top: auto; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--linha-forte); display: grid; place-items: center; transition: all .3s var(--ease); }
.momento__seta svg { width: 18px; height: 18px; color: var(--tinta); }
.momento::after { content: ""; position: absolute; right: -50px; top: -50px; width: 120px; height: 120px; border-radius: 0 0 0 100%; background: var(--roxo-50); transition: transform .4s var(--ease); }
.momento:hover { background: var(--g-roxo); border-color: transparent; transform: translateY(-3px); box-shadow: var(--sombra-2); color: #fff; }
.momento:hover h3 { color: #fff; }
.momento:hover p { color: rgba(255,255,255,.88); }
.momento:hover .momento__seta { background: #fff; border-color: #fff; }
.momento:hover::after { transform: scale(1.6); background: rgba(255,255,255,.1); }

/* Tese: você já paga, está aproveitando? */
.tese { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-8); align-items: center; }
.uso { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); box-shadow: var(--sombra-2); }
.uso__tit { font-family: var(--f-titulo); color: var(--tinta); font-weight: 500; line-height: 1.15; letter-spacing: -0.02em; text-wrap: balance; font-size: var(--t-base); margin: 0 0 4px; }
.uso small { display: block; color: var(--tinta-3); font-size: 12px; margin-bottom: var(--s-4); }
.uso__l { display: grid; grid-template-columns: 130px 1fr 40px; gap: 12px; align-items: center; font-size: 13.5px; padding: 6px 0; color: var(--tinta); }
.uso__l .barra { margin: 0; height: 10px; }
.uso__l b { font-weight: 500; color: var(--tinta-3); text-align: right; }
.uso__l--baixo .barra i { background: var(--roxo-300); }

/* Como a Brizmo ajuda: 6 frentes */
.frentes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linha); border: 1px solid var(--linha); border-radius: var(--r-lg); overflow: hidden; }
.frente { background: #fff; padding: var(--s-6); display: flex; flex-direction: column; gap: var(--s-3); text-decoration: none; color: var(--tinta-2); transition: background .25s; }
.frente:hover { background: var(--roxo-50); color: var(--tinta-2); }
.frente__ico { width: 34px; height: 34px; background: var(--g-roxo); }
.frente h3 { font-size: var(--t-lg); margin: 0; }
.frente p { font-size: var(--t-sm); margin: 0; }
.frente .link-seta { margin-top: auto; padding-top: var(--s-2); }
.frase-marca { font: 500 var(--t-2xl)/1.3 var(--f-titulo); color: var(--tinta); letter-spacing: -.02em; max-width: 30ch; }
.frase-marca span { color: var(--roxo-700); }

/* Jornada horizontal */
.trilha { list-style: none; display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; counter-reset: t; }
.trilha li { position: relative; counter-increment: t; background: #312f36; border-radius: var(--r-md); padding: var(--s-5) var(--s-4); min-height: 150px; display: flex; flex-direction: column; gap: 6px; }
.trilha li::before { content: counter(t, decimal-leading-zero); font: 500 13px/1 var(--f-titulo); color: var(--roxo-300); }
.trilha h3 { font-size: var(--t-base); margin: auto 0 0; color: #fff; }
.trilha p { font-size: 12.5px; margin: 0; color: #a9a6b8; line-height: 1.4; }
.trilha li:last-child { background: var(--g-roxo); }
.trilha li:last-child::before { color: #fff; }
.trilha li:last-child p { color: rgba(255,255,255,.85); }

/* Projetos: problema → projeto → resultado */
.projetos { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
.projeto { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); display: grid; gap: var(--s-4); }
.projeto__topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.projeto__cli { font: 600 1.15rem/1 var(--f-titulo); color: var(--tinta); letter-spacing: -.02em; }
.projeto dl { display: grid; grid-template-columns: 92px 1fr; gap: 10px 16px; margin: 0; font-size: var(--t-sm); }
.projeto dt { font: 500 12.5px/1.5 var(--f-titulo); color: var(--roxo-700); }
.projeto dd { margin: 0; color: var(--tinta-2); }
.projeto__nums { display: flex; gap: var(--s-6); padding-top: var(--s-4); border-top: 1px solid var(--linha); }
.projeto__nums strong { display: block; font: 500 var(--t-xl)/1.1 var(--f-titulo); color: var(--tinta); }
.projeto__nums span { font-size: 12px; color: var(--tinta-3); }

/* Porta da IA */
.porta-ia { position: relative; overflow: hidden; border-radius: var(--r-lg); background: var(--g-noite); color: #cfccdb; padding: var(--s-8); }
.porta-ia h2 { color: #fff; max-width: 18ch; }
.porta-ia .lead { color: #c4c0d4; }
.porta-ia .sobretitulo { color: var(--roxo-300); }
.porta-ia__passos { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: var(--s-6) 0; align-items: center; }
.porta-ia__passos li { padding: 10px 18px; border-radius: 999px; border: 1px solid #55525f; color: #fff; font: 500 var(--t-sm)/1 var(--f-titulo); }
.porta-ia__passos li.seta { border: 0; padding: 0; color: var(--roxo-300); }
.porta-ia .formas .forma { opacity: .9; }

/* Autoridade */
.autoridade { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-8); align-items: center; }
.equipe-slots { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.equipe-slots .slot-oficial { min-height: 120px; display: flex; flex-direction: column; justify-content: flex-end; border-radius: var(--r-md); }
.equipe-slots .slot-oficial:first-child { grid-row: span 2; background: var(--g-roxo-claro); border-color: transparent; color: var(--tinta-2); }

/* Conteúdo para decisores */
.decisoes { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--s-7); list-style: none; }
.decisoes a { display: flex; justify-content: space-between; gap: var(--s-4); align-items: center; padding: var(--s-4) 0; border-bottom: 1px solid var(--linha); text-decoration: none; color: var(--tinta); font: 500 var(--t-base)/1.4 var(--f-titulo); }
.decisoes a:hover { color: var(--roxo-700); }
.decisoes a svg { width: 18px; height: 18px; flex: none; color: var(--roxo); transition: transform .2s; }
.decisoes a:hover svg { transform: translateX(3px); }

/* CTA final enxuto */
.cta5 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-8); background: var(--g-roxo); border-radius: var(--r-lg); padding: var(--s-8); color: #efeaff; position: relative; overflow: hidden; }
.cta5 h2 { color: #fff; }
.cta5 .lead { color: #ece6ff; }
.cta5 > * { position: relative; z-index: 1; }

@media (max-width: 1080px) {
  .h4--v2 .h4__grade, .h4--v3 .h4__grade, .tese, .autoridade, .cta5 { grid-template-columns: 1fr; }
  .h4__foto { margin-right: 0; height: 380px; border-radius: 140px 24px 24px 24px; }
  .h4__b { margin: 0 auto; width: min(320px, 80%); }
  .momentos, .frentes { grid-template-columns: 1fr 1fr; }
  .trilha { grid-template-columns: repeat(4, 1fr); }
  .projetos { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .h4 h1 { font-size: 2.3rem; }
  .h4--v1 { min-height: 0; }
  .h4--v1::before { background: linear-gradient(180deg, rgba(61,42,156,.94) 0%, rgba(87,55,207,.86) 60%, rgba(87,55,207,.7) 100%); }
  .momentos, .frentes, .decisoes, .equipe-slots { grid-template-columns: 1fr; }
  .trilha { grid-template-columns: 1fr 1fr; }
  .porta-ia, .cta5 { padding: var(--s-6) var(--s-5); }
  .projeto dl { grid-template-columns: 1fr; gap: 2px; }
  .projeto dd { margin-bottom: 8px; }
  .uso__l { grid-template-columns: 100px 1fr 34px; }
}

/* ===================== Hero 4: candidato ===================== */
.h4--v4 { min-height: 0; padding-top: var(--s-8); }
.h4--v4 .h4__img { object-position: center 40%; }
.h4--v4::before { background: linear-gradient(90deg, rgba(61,42,156,.97) 0%, rgba(87,55,207,.92) 45%, rgba(125,97,244,.62) 75%, rgba(125,97,244,.35) 100%); }
.h4--v4 h1 { max-width: 16ch; margin-bottom: var(--s-4); }
.h4__ms { display: inline-flex; align-items: center; gap: 12px; background: #fff; border-radius: 14px; padding: 10px 18px 10px 12px; margin-bottom: var(--s-6); box-shadow: 0 16px 40px -16px rgba(20,8,70,.5); }
.h4__ms svg { width: 30px; height: 30px; }
.h4__ms b { display: block; font: 600 15px/1.2 "Segoe UI", var(--f-texto); color: #3b3b3b; }
.h4__ms small { display: block; font-size: 11.5px; color: var(--tinta-3); }
.h4__def { font-size: var(--t-xl); line-height: 1.45; color: rgba(255,255,255,.92); max-width: 40ch; margin-bottom: var(--s-6); }
.busca { max-width: 620px; }
.busca label { display: block; font: 500 var(--t-base)/1.3 var(--f-titulo); color: #fff; margin-bottom: 10px; }
.busca__campo { display: flex; align-items: center; background: #fff; border-radius: 999px; padding: 6px 6px 6px 22px; box-shadow: 0 20px 50px -20px rgba(20,8,70,.6); }
.busca__campo input { flex: 1; min-width: 0; border: 0; outline: 0; font: 400 var(--t-base) var(--f-texto); color: var(--tinta); background: transparent; height: 46px; }
.busca__campo input::placeholder { color: #8b889a; }
.busca__campo button { flex: none; width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--roxo); color: #fff; display: grid; place-items: center; cursor: pointer; transition: background .2s; }
.busca__campo button:hover { background: var(--roxo-700); }
.busca__campo button svg { width: 20px; height: 20px; }
.busca__campo:focus-within { box-shadow: 0 0 0 4px rgba(255,255,255,.35), 0 20px 50px -20px rgba(20,8,70,.6); }
.intencoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--s-4); max-width: 720px; }
.intencao { padding: 10px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.45); color: #fff; text-decoration: none; font: 500 var(--t-sm)/1 var(--f-titulo); background: rgba(255,255,255,.06); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background .2s, color .2s, border-color .2s; }
.intencao:hover { background: #fff; color: var(--roxo-700); border-color: #fff; }
.h4--v4 .h4__faixa { margin-top: var(--s-7); }

.prova4 { display: grid; grid-template-columns: 1.3fr 1fr 1fr; grid-template-rows: auto auto; gap: var(--s-4); }
.prova4__dep { grid-row: span 2; margin: 0; background: var(--g-roxo); color: #fff; border-radius: var(--r-lg); padding: var(--s-7); display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-6); }
.prova4__dep blockquote { margin: 0; font: 400 var(--t-2xl)/1.35 var(--f-titulo); color: #fff; letter-spacing: -.01em; }
.prova4__dep figcaption { display: flex; gap: 12px; align-items: center; font-size: var(--t-sm); color: rgba(255,255,255,.85); }
.prova4__dep figcaption strong { display: block; color: #fff; }
.prova4__dep .avatar { background: rgba(255,255,255,.2); color: #fff; }
.prova4__case { grid-column: span 2; background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); display: flex; flex-direction: column; gap: var(--s-3); align-items: flex-start; }
.prova4__case p { margin: 0; font: 500 var(--t-lg)/1.4 var(--f-titulo); color: var(--tinta); }
.prova4__nums { display: flex; gap: var(--s-7); flex-wrap: wrap; }
.prova4__nums strong { display: block; font: 500 var(--t-2xl)/1.1 var(--f-titulo); color: var(--roxo-700); letter-spacing: -.02em; }
.prova4__nums span { font-size: 12.5px; color: var(--tinta-3); }
.prova4__num { background: #fff; border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--s-6); }
.prova4__num strong { display: block; font: 500 var(--t-3xl)/1 var(--f-titulo); color: var(--tinta); letter-spacing: -.03em; margin-bottom: 6px; }
.prova4__num span { font-size: var(--t-sm); color: var(--tinta-3); }
.prova4__slot { grid-column: 1 / -1; text-align: center; }
@media (max-width: 1080px) {
  .prova4 { grid-template-columns: 1fr 1fr; }
  .prova4__dep { grid-row: auto; grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .h4--v4 h1 { font-size: 2.4rem; }
  .h4__def { font-size: var(--t-lg); }
  .prova4 { grid-template-columns: 1fr; }
  .prova4__case { grid-column: auto; }
  .prova4__dep { padding: var(--s-6) var(--s-5); }
  .prova4__dep blockquote { font-size: var(--t-xl); }
}
.h4__def strong { font-weight: 600; color: #fff; }

/* Ícones oficiais no Hero 4 e nas frentes */
.h4--v4 .wrap { position: relative; }
.intencao { display: inline-flex; align-items: center; gap: 8px; }
.intencao .ms-ico, .intencao svg { width: 18px; height: 18px; }
.eco { position: absolute; right: var(--gutter); top: 0; z-index: 2; width: 340px; padding: var(--s-5); border-radius: var(--r-lg); background: rgba(255,255,255,.94); box-shadow: 0 30px 60px -24px rgba(20,8,70,.55); color: var(--tinta); }
.eco__t { font: 500 var(--t-sm)/1.35 var(--f-titulo); margin: 0 0 var(--s-4); color: var(--tinta); }
.eco ul { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.eco li { display: grid; justify-items: center; gap: 6px; padding: 12px 4px 10px; border-radius: 12px; background: #fff; border: 1px solid var(--linha); font-size: 11px; color: var(--tinta-2); text-align: center; line-height: 1.2; }
.eco .ms-ico { width: 32px; height: 32px; }
.frente__icos { display: flex; gap: 10px; align-items: center; height: 34px; }
.frente__icos .ms-ico { width: 32px; height: 32px; }
@media (max-width: 1180px) { .eco { position: relative; right: auto; top: auto; width: auto; max-width: 520px; margin-top: var(--s-7); } .eco ul { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 720px) { .eco ul { grid-template-columns: repeat(4, 1fr); } }
.h4__ms img { height: 24px; width: auto; }
.h4__ms > span { border-left: 1px solid var(--linha); padding-left: 12px; }
.h4__faixa-logos { gap: 10px 12px; }
.logos-dobra .logo-cliente .logo-img { height: 34px; }
.h4--v4 { padding-bottom: var(--s-8); }

/* ===================== Rodada 3: seções da home ===================== */
/* Você já paga */
.uso__cab { display: flex; align-items: center; gap: 8px; margin-bottom: var(--s-4); }
.uso__m365 { height: 22px; width: auto; }
.uso__365 { font: 600 1.15rem/1 "Segoe UI", var(--f-texto); color: #5e5e5e; margin-left: -2px; }
.uso__cab .tag { margin-left: auto; }
.uso__l { grid-template-columns: 26px 118px 1fr 40px; padding: 7px 0; }
.uso__l .ms-ico { width: 24px; height: 24px; }
.uso__l .barra i { width: 0; transition: width 1.2s var(--ease); background: var(--g-roxo); }
.uso__l--baixo .barra i { background: var(--roxo-300); }
.uso.visivel .barra i { width: var(--w); }
.uso__l:nth-of-type(2) .barra i { transition-delay: .08s; } .uso__l:nth-of-type(3) .barra i { transition-delay: .16s; }
.uso__l:nth-of-type(4) .barra i { transition-delay: .24s; } .uso__l:nth-of-type(5) .barra i { transition-delay: .32s; }
.uso__l:nth-of-type(6) .barra i { transition-delay: .4s; } .uso__l:nth-of-type(7) .barra i { transition-delay: .48s; } .uso__l:nth-of-type(8) .barra i { transition-delay: .56s; }
.uso__nota { margin: var(--s-4) 0 0; padding-top: var(--s-3); border-top: 1px solid var(--linha); font-size: 12.5px; color: var(--tinta-3); }

/* Jornada Brizmo */
.jor { overflow: hidden; }
.jor__trilho { position: relative; margin-top: var(--s-4); }
.jor__linha { position: absolute; left: 0; right: 0; top: 27px; height: 3px; background: #3f3c46; border-radius: 3px; }
.jor__linha i { display: block; height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, #b3a3fb, #7d61f4 60%, #ffd84d); transition: width 2.2s var(--ease); }
.jor.visivel .jor__linha i { width: 100%; }
.jor__etapas { list-style: none; display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; position: relative; }
.jor__ponto { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: var(--s-4); border-radius: 50%; background: #272727; border: 3px solid #4a4752; transition: border-color .4s, background .4s, transform .4s; transition-delay: calc(var(--i) * .28s); }
.jor__ponto span { font: 500 14px/1 var(--f-titulo); color: #a9a6b8; transition: color .4s; transition-delay: calc(var(--i) * .28s); }
.jor.visivel .jor__ponto { border-color: var(--roxo); background: #312a52; }
.jor.visivel .jor__ponto span { color: #fff; }
.jor__card { background: #312f36; border: 1px solid #3f3c46; border-radius: var(--r-md); padding: var(--s-4); min-height: 190px; display: flex; flex-direction: column; gap: 8px; opacity: 0; transform: translateY(16px); transition: opacity .5s var(--ease), transform .5s var(--ease), border-color .25s, background .25s; transition-delay: calc(var(--i) * .28s); }
.jor.visivel .jor__card { opacity: 1; transform: none; }
.jor__card:hover { border-color: var(--roxo-300); background: #38354a; }
.jor__icos { display: flex; gap: 6px; margin-bottom: 4px; }
.jor__icos .ms-ico { width: 30px; height: 30px; }
.jor__card h3 { font-size: var(--t-base); color: #fff; margin: 0; }
.jor__card p { font-size: 12.5px; line-height: 1.45; color: #a9a6b8; margin: 0; }
.jor__etapa--ia .jor__ponto { border-color: #ffd84d; }
.jor.visivel .jor__etapa--ia .jor__ponto { background: var(--g-roxo); border-color: #ffd84d; transform: scale(1.08); }
.jor__etapa--ia .jor__card { background: var(--g-roxo); border-color: transparent; }
.jor__etapa--ia .jor__card p { color: rgba(255,255,255,.88); }

/* Projetos */
.projeto { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.projeto__capa { aspect-ratio: 16 / 7; overflow: hidden; background: var(--roxo-100); }
.projeto__capa img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.projeto:hover .projeto__capa img { transform: scale(1.03); }
.projeto__corpo { padding: var(--s-6); display: grid; gap: var(--s-4); flex: 1; align-content: start; }
.projeto__logo { height: 30px; width: auto; max-width: 140px; object-fit: contain; }
.projeto__dep { margin: 0; padding: var(--s-4); border-radius: var(--r-md); background: var(--roxo-50); }
.projeto__dep blockquote { margin: 0 0 10px; font: 400 var(--t-sm)/1.5 var(--f-titulo); color: var(--tinta); }
.projeto__dep figcaption { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--tinta-3); }
.projeto__dep figcaption strong { display: block; color: var(--tinta); font-size: var(--t-sm); }
.projeto__dep .avatar { width: 40px; height: 40px; font-size: 13px; background: #fff; }
.projetos { grid-template-columns: repeat(3, 1fr); }

/* Jornada IA: seção de fundo inteiro */
.iaj { position: relative; overflow: hidden; padding: var(--s-9) 0; color: #d9d4f5; background: radial-gradient(900px 520px at 85% 0%, rgba(255,216,77,.16), transparent 60%), radial-gradient(1100px 700px at 0% 100%, rgba(125,97,244,.55), transparent 60%), linear-gradient(135deg, #1d1838 0%, #2b1f63 45%, #3d2a9c 100%); }
.iaj__brilho { position: absolute; width: 620px; height: 620px; right: -160px; top: -200px; border-radius: 0 0 0 100%; background: conic-gradient(from 200deg, #50aedd, #7d61f4, #e95826, #f9c129, #50aedd); opacity: .14; filter: blur(30px); animation: iajGira 24s linear infinite; }
@keyframes iajGira { to { transform: rotate(360deg); } }
.iaj .wrap { position: relative; z-index: 1; }
.iaj h2 { color: #fff; font-size: var(--t-4xl); max-width: 14ch; }
.iaj .lead { color: #c9c3ea; }
.iaj__topo { display: grid; grid-template-columns: 1.2fr .8fr; gap: var(--s-8); align-items: end; margin-bottom: var(--s-8); }
.iaj__marca { display: inline-flex; align-items: center; gap: 12px; padding: 8px 16px 8px 8px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); font: 500 var(--t-sm)/1 var(--f-titulo); color: #fff; margin-bottom: var(--s-5); }
.iaj__marca .ms-ico { width: 32px; height: 32px; }
.iaj__principio { padding: var(--s-6); border-radius: var(--r-lg); background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); display: grid; gap: 10px; }
.iaj__principio strong { font: 500 var(--t-xl)/1.2 var(--f-titulo); color: #ffd84d; }
.iaj__principio span { font-size: var(--t-sm); color: #c9c3ea; }
.iaj__acoes { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.iaj .link-sec { color: #fff; }
.iaj__fases { list-style: none; display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; counter-reset: f; position: relative; }
.iaj__fases::before { content: ""; position: absolute; left: 22px; right: 22px; top: 22px; height: 2px; background: repeating-linear-gradient(90deg, rgba(255,255,255,.35) 0 8px, transparent 8px 16px); }
.iaj__fase { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 64px var(--s-4) var(--s-5); border-radius: var(--r-lg); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); transition: background .3s, border-color .3s, transform .3s; opacity: 0; transform: translateY(18px); transition: opacity .5s var(--ease), transform .5s var(--ease), background .3s, border-color .3s; transition-delay: calc(var(--i) * .15s); }
.iaj.visivel .iaj__fase { opacity: 1; transform: none; }
.iaj__fase:hover { background: rgba(255,255,255,.12); border-color: rgba(255,216,77,.6); }
.iaj__n { position: absolute; left: var(--s-4); top: 0; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--roxo-700); font: 600 var(--t-base)/1 var(--f-titulo); box-shadow: 0 10px 24px -8px rgba(0,0,0,.4); }
.iaj__fase { margin-top: 22px; }
.iaj__icos { position: absolute; right: var(--s-4); top: 18px; display: flex; gap: 6px; }
.iaj__icos .ms-ico { width: 34px; height: 34px; }
.iaj__fase h3 { color: #fff; font-size: var(--t-lg); margin: 0; }
.iaj__fase p { font-size: 13px; line-height: 1.5; color: #c9c3ea; margin: 0; }
.iaj__entrega { margin-top: auto; font: 500 12px/1.3 var(--f-titulo); color: #ffd84d; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.14); }
.iaj__produtos { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: var(--s-7); padding-top: var(--s-5); border-top: 1px solid rgba(255,255,255,.14); font-size: var(--t-sm); color: #c9c3ea; }
.iaj__prod { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font: 500 13px/1 var(--f-titulo); }
.iaj__prod .ms-ico { width: 22px; height: 22px; }

@media (max-width: 1080px) {
  .jor__etapas { grid-template-columns: repeat(4, 1fr); row-gap: var(--s-5); }
  .jor__linha { display: none; }
  .projetos { grid-template-columns: 1fr 1fr; }
  .iaj__topo { grid-template-columns: 1fr; align-items: start; gap: var(--s-6); }
  .iaj__fases { grid-template-columns: repeat(3, 1fr); }
  .iaj__fases::before { display: none; }
}
@media (max-width: 720px) {
  .jor__etapas { grid-template-columns: 1fr 1fr; }
  .jor__card { min-height: 0; }
  .projetos { grid-template-columns: 1fr; }
  .iaj { padding: var(--s-8) 0; }
  .iaj__fases { grid-template-columns: 1fr; }
  .uso__l { grid-template-columns: 24px 96px 1fr 36px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .jor__card, .iaj__fase { opacity: 1; transform: none; }
  .uso .barra i { width: var(--w); }
  .jor__linha i { width: 100%; }
  .iaj__brilho { animation: none; }
}
/* Projetos: rótulos acima do texto, cartão mais compacto */
.projeto dl { grid-template-columns: 1fr; gap: 2px; }
.projeto dt { font-size: 12px; margin-top: 10px; }
.projeto dt:first-child { margin-top: 0; }
.projeto dd { font-size: var(--t-sm); line-height: 1.5; }
.projeto__nums { margin-top: auto; }
.projeto__corpo { gap: var(--s-3); }
.projeto__topo { flex-direction: column-reverse; align-items: flex-start; gap: 8px; }
.cta5 > * { min-width: 0; }
@media (max-width: 720px) {
  .cta5 .form { padding: var(--s-5) var(--s-4); }
  .jor__etapas { grid-template-columns: 1fr; row-gap: 12px; }
  .jor__etapa { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: start; }
  .jor__ponto { width: 44px; height: 44px; margin: 6px 0 0; }
  .jor__card { min-height: 0; }
}
.form, .form__duplo > * { min-width: 0; }
.form .btn { white-space: normal; text-align: center; line-height: 1.3; padding-top: 12px; padding-bottom: 12px; }
.intencao--principal { background: #fff; color: var(--roxo-700); border-color: #fff; }
.intencao--principal:hover { background: var(--roxo-50); border-color: var(--roxo-50); color: var(--roxo-800); }