/* Trunfo Digital — sistema visual — Manual de Marca V1 SET 2026 */

:root{
  --laranja:#FF5C00;
  --laranja-texto:#C93B00;
  --preto:#17150F;
  --branco:#FFFFFF;
  --apoio-fundo:#F3F2F2;
  --apoio-texto:#55504A;
  --regua:2px solid var(--preto);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--branco);
  color:var(--preto);
  font-family:'Archivo',Arial,Helvetica,sans-serif;
  font-weight:400;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}

/* ---------- naipe (diamante) ---------- */
.naipe{
  display:inline-block;
  width:.62em;height:.62em;
  background:var(--laranja);
  transform:rotate(45deg);
  margin:0 .18em;
  flex:none;
}
.naipe.preto{background:var(--preto)}
.naipe.branco{background:var(--branco)}

/* ---------- logotipo ---------- */
.logo{display:inline-flex;align-items:center;text-decoration:none;color:var(--preto)}
.logo .marca{
  font-family:'Archivo',sans-serif;
  font-weight:900;
  font-size:22px;
  letter-spacing:-0.02em;
  display:flex;align-items:center;
}
.logo .marca .naipe{width:14px;height:14px;margin:0 3px}
.logo .sub{
  display:block;
  font-weight:700;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  border-top:2px solid var(--preto);
  padding-top:3px;
  margin-top:2px;
}
.logo.invertida{color:var(--branco)}
.logo.invertida .sub{border-top-color:var(--branco)}

/* ---------- header ---------- */
header.site{
  border-bottom:var(--regua);
  background:var(--branco);
}
header.site .barra{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;
}
nav.principal{display:flex;gap:28px;flex-wrap:wrap}
nav.principal a{
  font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.08em;
  text-decoration:none;padding-bottom:2px;border-bottom:2px solid transparent;
}
nav.principal a:hover{border-bottom-color:var(--laranja)}

/* ---------- kicker / labels ---------- */
.kicker{
  font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--laranja-texto);
  display:flex;align-items:center;gap:8px;
}
.kicker .naipe{width:8px;height:8px}

/* ---------- tipografia display ---------- */
h1,h2,h3{
  font-family:'Archivo',sans-serif;
  font-weight:900;
  letter-spacing:-0.03em;
  margin:0 0 .4em 0;
  line-height:1.05;
}
h1{font-size:clamp(36px,6vw,64px)}
h2{font-size:clamp(26px,4vw,38px)}
h3{font-size:20px}
p{margin:0 0 1em 0}
.lead{font-size:19px;color:var(--apoio-texto)}

/* ---------- réguas ---------- */
.regua{border:none;border-top:var(--regua);margin:48px 0}
.regua-fina{border:none;border-top:1px solid #d9d7d3;margin:24px 0}

/* ---------- seções ---------- */
section{padding:64px 0}
section.escura{background:var(--preto);color:var(--branco)}
section.escura .kicker{color:var(--laranja)}
section.apoio{background:var(--apoio-fundo)}
section.laranja{background:var(--laranja);color:var(--preto)}

/* ---------- botões ---------- */
.botao{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--preto);color:var(--branco);
  font-weight:700;font-size:14px;letter-spacing:.04em;text-transform:uppercase;
  text-decoration:none;
  padding:16px 28px;
  border:2px solid var(--preto);
}
.botao:hover{background:var(--branco);color:var(--preto)}
.botao.laranja{background:var(--laranja);border-color:var(--laranja);color:var(--preto)}
.botao.laranja:hover{background:var(--preto);color:var(--branco);border-color:var(--preto)}
.botao.fantasma{background:transparent;color:var(--branco);border-color:var(--branco)}
.botao.fantasma:hover{background:var(--branco);color:var(--preto)}

/* ---------- grade de cartas (cursos) ---------- */
.grade-cartas{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:var(--regua);border-left:var(--regua);
}
.carta{
  border-right:var(--regua);border-bottom:var(--regua);
  padding:32px;display:flex;flex-direction:column;gap:14px;
  text-decoration:none;color:var(--preto);
  background:var(--branco);
  transition:background .15s;
}
.carta:hover{background:var(--apoio-fundo)}
.carta .naipe-grande{width:28px;height:28px}
.carta h3{margin-top:8px}
.carta .preco{font-weight:900;font-size:22px;margin-top:auto}
.carta .preco small{font-weight:500;font-size:13px;color:var(--apoio-texto);display:block}

@media (max-width:860px){
  .grade-cartas{grid-template-columns:1fr}
}

/* ---------- lista de tópicos (programa) ---------- */
.lista-topicos{list-style:none;margin:0;padding:0;border-top:1px solid #d9d7d3}
.lista-topicos li{
  padding:16px 0;border-bottom:1px solid #d9d7d3;
  display:flex;gap:12px;align-items:flex-start;font-size:17px;
}
.lista-topicos li .naipe{margin-top:7px}

/* ---------- tabela de lotes ---------- */
.lotes{border-top:var(--regua)}
.lote{
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 0;border-bottom:1px solid #d9d7d3;
  gap:16px;flex-wrap:wrap;
}
.lote .nome{font-weight:700}
.lote.esgotado{opacity:.45;text-decoration:line-through}
.lote .valor{font-weight:900;font-size:20px}
.tag{
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  background:var(--preto);color:var(--branco);padding:4px 10px;
}
.tag.laranja{background:var(--laranja);color:var(--preto)}

/* ---------- faixa CTA fixa ---------- */
.faixa-preco{
  background:var(--preto);color:var(--branco);
  padding:20px 0;border-top:var(--regua);
}
.faixa-preco .linha{
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.de{color:#9a968f;text-decoration:line-through;font-size:14px}
.por{font-size:30px;font-weight:900;color:var(--laranja)}

/* ---------- footer ---------- */
footer.site{
  background:var(--preto);color:var(--branco);
  padding:48px 0 28px;
  margin-top:0;
}
footer.site a{text-decoration:none;color:var(--branco)}
footer.site .colunas{
  display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;
  border-bottom:1px solid #35322b;padding-bottom:28px;margin-bottom:20px;
}
footer.site .contato p{margin:0 0 6px 0;font-size:14px;color:#c9c6bf}
footer.site .rodape-final{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  font-size:12px;color:#8a867e;text-transform:uppercase;letter-spacing:.05em;
}

/* ---------- hero geral ---------- */
.hero{padding:72px 0 56px}
.hero .kicker{margin-bottom:18px}
.hero h1{margin-bottom:20px}

/* ---------- badges topo landing ---------- */
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.badge{
  border:2px solid var(--preto);
  padding:7px 14px;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
}
.badge.solido{background:var(--preto);color:var(--branco)}
.badge.laranja{background:var(--laranja);border-color:var(--laranja);color:var(--preto)}

/* ---------- pills de ferramentas (Claude ponta a ponta) ---------- */
.pills{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}
.pill{
  border:2px solid var(--preto);padding:8px 16px;font-weight:700;font-size:13px;
}
.pill.destaque{background:var(--laranja);border-color:var(--laranja)}

/* ---------- ficha do evento ---------- */
.ficha{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:var(--regua);border-left:var(--regua);
}
.ficha .item{border-right:var(--regua);border-bottom:var(--regua);padding:24px}
.ficha .item .rotulo{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--apoio-texto);margin-bottom:6px}
.ficha .item .valor{font-weight:900;font-size:20px}
@media (max-width:700px){
  .ficha{grid-template-columns:1fr}
}

/* ---------- credenciais (home) ---------- */
.credenciais{display:grid;grid-template-columns:1fr 1fr;gap:48px}
@media (max-width:780px){.credenciais{grid-template-columns:1fr}}
.credenciais ul{list-style:none;margin:0;padding:0}
.credenciais li{padding:10px 0;border-bottom:1px solid #35322b;display:flex;gap:10px}

.container-estreito{max-width:760px}