/* falt. – site institucional. Cores e letras do manual da marca (marca/falt-marca.html). */
:root {
  --noite: #0A1A33;
  --noite-2: #12284A;
  --amarelo: #FFC21A;
  --amarelo-2: #FFD24D;
  --aco: #3A5378;
  --cinza: #5B6B82;
  --gelo: #F4F6FA;
  --borda: #E1E6EE;
  --branco: #FFFFFF;
  --zap: #25D366;
  --raio: 22px;
  --sombra: 0 10px 30px rgba(10, 26, 51, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin: 0; background: var(--branco); color: var(--noite); font: 16px/1.6 Inter, system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: Outfit, Inter, sans-serif; line-height: 1.12; margin: 0; letter-spacing: -.02em; }
h2 { font-size: clamp(28px, 4vw, 42px); font-weight: 800; }
h3 { font-size: 20px; font-weight: 800; }
p { margin: 0; }
.am { color: var(--amarelo); }

.cx { width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 16px; }
.cx-estreito { max-width: 820px; }
@media (min-width: 768px) { .cx { padding: 0 28px; } }

/* Logo em texto (igual ao manual: Outfit 800, -0,035em, ponto redondo amarelo) */
.wm { font-family: Outfit, Inter, sans-serif; font-weight: 800; letter-spacing: -.035em; line-height: 1; display: inline-flex; align-items: baseline; white-space: nowrap; text-decoration: none; }
.wm .pt { display: inline-block; width: .19em; height: .19em; margin-left: .045em; border-radius: 50%; background: var(--amarelo); }

/* Botões */
.bt { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 22px; border-radius: 999px; font-weight: 700; font-size: 15.5px; text-decoration: none; text-align: center; transition: transform .15s, background .15s, box-shadow .15s; }
.bt:hover { transform: translateY(-1px); }
.bt-am { background: var(--amarelo); color: var(--noite); box-shadow: 0 6px 18px rgba(255, 194, 26, .35); }
.bt-am:hover { background: var(--amarelo-2); }
.bt-linha { border: 2px solid var(--borda); color: var(--noite); background: var(--branco); }
.bt-linha:hover { border-color: var(--noite); }
.bt-linha-claro { border: 2px solid rgba(255, 255, 255, .28); color: var(--branco); }
.bt-linha-claro:hover { border-color: var(--branco); }
.bt-g { min-height: 56px; font-size: 17px; padding: 14px 28px; }

.selo { display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--aco); margin-bottom: 14px; }
.selo-am { color: var(--amarelo); }

/* Topo */
.topo { position: sticky; top: 0; z-index: 50; background: rgba(10, 26, 51, .96); backdrop-filter: blur(8px); color: var(--branco); }
.topo-in { display: flex; align-items: center; justify-content: space-between; height: 66px; }
.topo-logo { font-size: 32px; color: var(--branco); }
.menu { display: flex; align-items: center; gap: 26px; }
.menu a { text-decoration: none; font-weight: 600; font-size: 15px; color: #C9D3E3; }
.menu a:hover { color: var(--branco); }
.menu a.menu-cta { color: var(--noite); min-height: 42px; padding: 9px 18px; font-size: 14.5px; }
.menu-bt { display: none; width: 44px; height: 44px; border: 0; background: transparent; border-radius: 12px; cursor: pointer; padding: 11px 10px; flex-direction: column; justify-content: space-between; }
.menu-bt span { display: block; height: 2.5px; border-radius: 2px; background: var(--branco); transition: transform .2s, opacity .2s; }
.menu-bt[aria-expanded="true"] span:nth-child(1) { transform: translateY(8.5px) rotate(45deg); }
.menu-bt[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-bt[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8.5px) rotate(-45deg); }

@media (max-width: 960px) {
  .menu-bt { display: flex; }
  .menu { position: fixed; inset: 66px 0 auto 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--noite); padding: 8px 16px 20px; border-top: 1px solid rgba(255, 255, 255, .08); box-shadow: 0 20px 30px rgba(0, 0, 0, .25); transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s; }
  .menu.aberto { transform: none; opacity: 1; visibility: visible; }
  .menu a { padding: 14px 4px; font-size: 17px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .menu a.menu-cta { margin-top: 14px; border: 0; min-height: 50px; font-size: 16px; }
}

/* Abertura */
.hero { background: var(--noite); color: var(--branco); overflow: hidden; position: relative; }
.hero::before { content: ""; position: absolute; width: 620px; height: 620px; right: -160px; top: -120px; border-radius: 50%; background: radial-gradient(circle, rgba(58, 83, 120, .55), rgba(10, 26, 51, 0) 70%); pointer-events: none; }
.hero-in { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; padding-top: 72px; padding-bottom: 88px; }
.hero .selo { color: var(--amarelo); }
.hero h1 { font-size: clamp(40px, 6.4vw, 72px); font-weight: 800; letter-spacing: -.035em; }
.lead { font-size: clamp(17px, 1.6vw, 19px); color: #C9D3E3; margin-top: 20px; max-width: 560px; }
.hero-bts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero .bt-linha { background: transparent; color: var(--branco); border-color: rgba(255, 255, 255, .28); }
.hero .bt-linha:hover { border-color: var(--branco); }
.hero-pts { list-style: none; padding: 0; margin: 28px 0 0; display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 14.5px; color: #C9D3E3; font-weight: 500; }
.hero-pts li::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--amarelo); margin-right: 8px; vertical-align: 1px; }

.hero-vis { position: relative; display: flex; justify-content: center; }
.celular { width: 300px; max-width: 100%; background: #ECE5DD; border-radius: 34px; border: 9px solid #1B2F52; box-shadow: 0 30px 60px rgba(0, 0, 0, .35); overflow: hidden; color: #111; }
.cel-topo { display: flex; align-items: center; gap: 10px; background: #075E54; color: #fff; padding: 12px 14px; }
.cel-topo b { display: block; font-size: 14.5px; line-height: 1.2; }
.cel-topo small { font-size: 12px; opacity: .85; }
.cel-av { width: 34px; height: 34px; border-radius: 50%; background: var(--amarelo); color: var(--noite); font: 800 16px Outfit, sans-serif; display: flex; align-items: center; justify-content: center; }
.cel-msgs { height: 380px; padding: 14px 10px; display: flex; flex-direction: column; gap: 8px; overflow: hidden; justify-content: flex-end; }
.msg { max-width: 82%; padding: 7px 10px 6px; border-radius: 10px; font-size: 13.5px; line-height: 1.4; box-shadow: 0 1px 1px rgba(0, 0, 0, .08); animation: entra .3s ease-out; }
.msg small { display: block; text-align: right; font-size: 10.5px; color: #667; margin-top: 2px; }
.msg.cli { align-self: flex-start; background: #fff; border-top-left-radius: 2px; }
.msg.bot { align-self: flex-end; background: #DCF8C6; border-top-right-radius: 2px; }
@keyframes entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.cartao-flut { position: absolute; background: var(--branco); color: var(--noite); border-radius: 16px; padding: 10px 14px; box-shadow: 0 14px 30px rgba(0, 0, 0, .25); font-size: 14px; line-height: 1.3; }
.cartao-flut b { display: block; }
.cartao-flut small { color: var(--cinza); font-size: 12.5px; }
.cartao-flut::before { content: ""; position: absolute; left: -5px; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--amarelo); }
.cf1 { left: -6px; top: 70px; }
.cf2 { right: -8px; bottom: 60px; }

@media (max-width: 860px) {
  .hero-in { grid-template-columns: 1fr; padding-top: 44px; padding-bottom: 56px; gap: 40px; }
  .hero-bts .bt { flex: 1 1 100%; }
  .cf1 { left: 0; top: 40px; }
  .cf2 { right: 0; bottom: 30px; }
}
@media (max-width: 380px) { .cartao-flut { display: none; } }

/* Seções */
.sec { padding: 88px 0; }
.sec-gelo { background: var(--gelo); }
.sec-noite { background: var(--noite); color: var(--branco); }
.sec-tit { max-width: 680px; margin-bottom: 40px; }
.sec-tit > p:not(.selo) { color: var(--cinza); font-size: 17.5px; margin-top: 14px; }
@media (max-width: 760px) { .sec { padding: 60px 0; } .sec-tit { margin-bottom: 28px; } }

.grade { display: grid; gap: 16px; }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .g3, .g4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .g3, .g4 { grid-template-columns: 1fr; } }

.card { background: var(--branco); border: 1px solid var(--borda); border-radius: var(--raio); padding: 26px; transition: box-shadow .2s, transform .2s; }
.card:hover { box-shadow: var(--sombra); transform: translateY(-2px); }
.card h3 { margin: 18px 0 8px; }
.card p { color: var(--cinza); font-size: 15.5px; }
.ic { width: 50px; height: 50px; border-radius: 15px; background: var(--noite); display: flex; align-items: center; justify-content: center; }
.ic svg { width: 26px; height: 26px; fill: none; stroke: var(--amarelo); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Ramos de negócio */
.ramo { background: var(--branco); border-radius: var(--raio); padding: 22px; border: 1px solid var(--borda); }
.ramo h3 { font-size: 18px; display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ramo h3 .em { font-size: 22px; line-height: 1; }
.ramo ul { margin: 0; padding: 0; list-style: none; color: var(--cinza); font-size: 14.5px; }
.ramo li { padding: 4px 0 4px 16px; position: relative; }
.ramo li::before { content: ""; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--amarelo); }
.ramo-outro { background: var(--noite); color: var(--branco); border-color: var(--noite); display: flex; flex-direction: column; justify-content: space-between; gap: 16px; }
.ramo-outro p { color: #C9D3E3; font-size: 15px; }
.ramo-outro .bt { min-height: 44px; font-size: 14.5px; }

/* WhatsApp */
.zap-in { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.lead-claro { color: #C9D3E3; font-size: 18px; margin: 18px 0 28px; }
.zap-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.zap-lista li { background: var(--noite-2); border: 1px solid rgba(255, 255, 255, .07); border-radius: 18px; padding: 16px 18px 16px 52px; position: relative; }
.zap-lista li::before { content: "✓"; position: absolute; left: 16px; top: 15px; width: 24px; height: 24px; border-radius: 50%; background: var(--amarelo); color: var(--noite); font-weight: 800; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.zap-lista b { display: block; font-size: 16px; }
.zap-lista span { color: #AEBBD0; font-size: 14.5px; }
@media (max-width: 860px) { .zap-in { grid-template-columns: 1fr; gap: 32px; } .zap-in .bt { width: 100%; } }

/* Passos */
.passos { list-style: none; margin: 0; padding: 0; }
.passos li { background: var(--gelo); border-radius: var(--raio); padding: 24px; }
.passos .num { display: inline-flex; width: 40px; height: 40px; border-radius: 50%; background: var(--noite); color: var(--amarelo); font: 800 18px Outfit, sans-serif; align-items: center; justify-content: center; margin-bottom: 16px; }
.passos h3 { margin-bottom: 8px; }
.passos p { color: var(--cinza); font-size: 15px; }

/* Dúvidas */
.faq { display: grid; gap: 10px; }
.faq details { background: var(--branco); border: 1px solid var(--borda); border-radius: 18px; padding: 0 20px; }
.faq summary { cursor: pointer; list-style: none; font-weight: 700; padding: 18px 30px 18px 0; position: relative; font-size: 16.5px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 24px; font-weight: 500; color: var(--aco); }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--cinza); padding-bottom: 18px; }

/* Contato */
.contato { background: var(--noite); color: var(--branco); border-radius: 30px; padding: 48px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 32px; align-items: center; }
.contato p { color: #C9D3E3; margin-top: 14px; font-size: 17px; }
.contato-bts { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 860px) { .contato { grid-template-columns: 1fr; padding: 32px 22px; border-radius: 24px; } }

/* Rodapé */
.rodape { background: var(--gelo); padding: 44px 0 90px; color: var(--cinza); font-size: 14.5px; }
.rodape-in { display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; }
.rodape-logo { font-size: 34px; color: var(--noite); }
@media (max-width: 760px) { .rodape-in { grid-template-columns: 1fr; gap: 12px; } }

/* Botão flutuante do WhatsApp */
.zap-flut { position: fixed; right: 18px; bottom: 18px; z-index: 40; width: 58px; height: 58px; border-radius: 50%; background: var(--zap); display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px rgba(0, 0, 0, .25); transition: transform .15s; }
.zap-flut:hover { transform: scale(1.06); }
.zap-flut svg { width: 32px; height: 32px; fill: #fff; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}
