@font-face {
  font-family: "Sora";
  src: url("/assets/fonts/sora.woff2") format("woff2");
  font-weight: 300 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --tinta: #061a4f;
  --escuro: #0a2370;
  --azul-900: #0d2d8f;
  --azul-800: #1140c4;
  --azul-700: #1550e6;
  --azul-600: #1f63ff;
  --azul-500: #2f78ff;
  --azul-400: #4d8dff;
  --azul-300: #7fb0ff;
  --azul-200: #b9d2ff;
  --azul-100: #e8f0ff;
  --ciano: #5ee7ff;
  --gelo: #8fdcff;
  --amarelo: #ffd43b;
  --amarelo-2: #ffb800;
  --amarelo-claro: #fff3b0;
  --verde: #2ee6a6;
  --rosa: #ff5fa2;
  --roxo: #8b5cf6;
  --branco: #ffffff;
  --texto: #f3f7ff;
  --texto-suave: rgba(243, 247, 255, 0.82);
  --texto-apagado: rgba(243, 247, 255, 0.64);
  --borda: rgba(255, 255, 255, 0.16);
  --borda-forte: rgba(255, 255, 255, 0.3);
  --vidro: rgba(255, 255, 255, 0.07);
  --vidro-escuro: rgba(6, 26, 79, 0.55);
  --brilho: 0 0 0 1px rgba(143, 220, 255, 0.25), 0 12px 40px -10px rgba(94, 231, 255, 0.45);
  --brilho-forte: 0 0 0 1px rgba(143, 220, 255, 0.45), 0 0 30px rgba(94, 231, 255, 0.4), 0 20px 60px -20px rgba(94, 231, 255, 0.6);
  --brilho-amarelo: 0 0 0 1px rgba(255, 212, 59, 0.35), 0 12px 36px -8px rgba(255, 184, 0, 0.65);
  --brilho-amarelo-forte: 0 0 0 1px rgba(255, 212, 59, 0.6), 0 0 28px rgba(255, 212, 59, 0.45), 0 18px 50px -14px rgba(255, 184, 0, 0.9);
  --raio: 16px;
  --raio-g: 24px;
  --fonte-titulo: "Sora", "Segoe UI", system-ui, sans-serif;
  --fonte-texto: "Inter", "Segoe UI", system-ui, sans-serif;
  --largura: 1180px;
  --gutter: 16px;
  --altura-topo: 72px;
  --transicao: 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
  color-scheme: dark;
}
@media (min-width: 720px) {
  :root { --gutter: 24px; }
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--fonte-texto);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--texto);
  background-color: var(--azul-900);
  background-image:
    radial-gradient(1100px 600px at 88% -8%, rgba(94, 231, 255, 0.35), transparent 60%),
    radial-gradient(900px 540px at -12% 28%, rgba(139, 92, 246, 0.35), transparent 60%),
    radial-gradient(800px 500px at 50% 110%, rgba(255, 95, 162, 0.18), transparent 60%),
    linear-gradient(180deg, var(--azul-800) 0%, var(--azul-900) 45%, var(--escuro) 100%);
  background-attachment: fixed;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--gelo); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--branco); }
strong { color: var(--branco); font-weight: 600; }
h1, h2, h3, h4 {
  font-family: var(--fonte-titulo);
  color: var(--branco);
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 0 0 0.5em;
  text-wrap: balance;
}
h1 { font-size: clamp(2.1rem, 1.3rem + 3.6vw, 4rem); font-weight: 800; }
h2 { font-size: clamp(1.6rem, 1.1rem + 2.2vw, 2.6rem); font-weight: 700; }
h3 { font-size: clamp(1.15rem, 1rem + 0.7vw, 1.45rem); font-weight: 600; }
h4 { font-size: 1.05rem; font-weight: 600; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.3em; margin: 0 0 1em; }
li + li { margin-top: 0.35em; }
.menu li, .migalhas li, .temas li, .plano__destaques li, .hero__provas li { margin-top: 0; }
code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.92em; background: rgba(255, 255, 255, 0.12); padding: 0.1em 0.4em; border-radius: 6px; color: var(--amarelo-claro); }
hr { border: 0; border-top: 1px solid var(--borda); margin: 2rem 0; }
::selection { background: var(--amarelo); color: var(--tinta); }
:focus-visible { outline: 2px solid var(--amarelo); outline-offset: 3px; border-radius: 6px; }

.visualmente-oculto {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
.pular {
  position: absolute; left: 12px; top: -60px; z-index: 1000;
  background: var(--amarelo); color: var(--tinta); padding: 10px 16px; border-radius: 10px; font-weight: 600; text-decoration: none;
  transition: top 0.2s;
}
.pular:focus { top: 12px; }

.container { width: 100%; max-width: var(--largura); margin-inline: auto; padding-inline: var(--gutter); }
.container--estreito { max-width: 860px; }
.container--largo { max-width: 1320px; }

/* ---------- Cabeçalho ---------- */
.topo {
  position: sticky; top: 0; z-index: 100;
  height: var(--altura-topo);
  background: rgba(13, 45, 143, 0.7);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid transparent;
  transition: border-color var(--transicao), background var(--transicao), box-shadow var(--transicao);
}
.topo--rolado { border-bottom-color: var(--borda); background: rgba(6, 26, 79, 0.85); box-shadow: 0 10px 40px -20px rgba(0, 0, 0, 0.6); }
.topo__linha { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 100%; }
.marca { display: inline-flex; align-items: center; gap: 10px; color: var(--branco); text-decoration: none; font-family: var(--fonte-titulo); font-weight: 700; font-size: 1.15rem; letter-spacing: -0.02em; }
.marca img, .marca svg { width: 38px; height: 38px; flex: none; filter: drop-shadow(0 4px 14px rgba(94, 231, 255, 0.45)); }
.marca span b { color: var(--amarelo); font-weight: 700; }
.menu { display: none; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.menu a:not(.botao) { display: inline-block; white-space: nowrap; padding: 10px 14px; border-radius: 10px; color: var(--texto-suave); text-decoration: none; font-weight: 500; font-size: 0.95rem; transition: background var(--transicao), color var(--transicao); }
.menu a:not(.botao):hover, .menu a:not(.botao)[aria-current="page"] { color: var(--branco); background: rgba(255, 255, 255, 0.1); }
.topo__acoes { display: flex; align-items: center; gap: 8px; }
.topo__acoes .botao { padding: 10px 18px; font-size: 0.95rem; }
.topo__acoes .botao--contorno { display: none; }
.menu-botao {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  border: 1px solid var(--borda-forte); background: rgba(255, 255, 255, 0.08); color: var(--branco); border-radius: 12px; cursor: pointer;
}
.menu-botao svg { width: 22px; height: 22px; }
.menu-botao .icone-fechar { display: none; }
.menu-aberto .menu-botao .icone-menu { display: none; }
.menu-aberto .menu-botao .icone-fechar { display: block; }
@media (min-width: 960px) {
  .menu { display: flex; }
  .menu .menu__cta { display: none; }
  .menu-botao { display: none; }
  .topo__acoes .botao--contorno { display: inline-flex; }
}
@media (min-width: 960px) and (max-width: 1319px) {
  .menu a:not(.botao) { padding: 10px 9px; font-size: 0.9rem; }
  .topo__acoes .botao--contorno { display: none; }
}
@media (min-width: 960px) and (max-width: 1099px) {
  .topo__linha { gap: 8px; }
  .menu a:not(.botao) { padding: 10px 6px; font-size: 0.85rem; }
  .topo__acoes .botao { padding: 9px 14px; }
}
@media (max-width: 479px) {
  .topo__linha { gap: 8px; }
  .topo__acoes { gap: 6px; }
  .topo .marca { font-size: 0.95rem; gap: 6px; min-width: 0; }
  .topo .marca img, .topo .marca svg { width: 28px; height: 28px; }
  .topo__acoes .botao { padding: 8px 12px; font-size: 0.85rem; }
  .menu-botao { width: 40px; height: 40px; }
}
@media (max-width: 959px) {
  .menu-aberto { overflow: hidden; }
  /* sem backdrop-filter no .topo: senão ele vira o bloco de contenção do .menu fixo */
  .menu-aberto .topo { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(6, 26, 79, 0.96); }
  .menu-aberto .menu {
    display: flex; flex-direction: column; align-items: stretch; gap: 6px;
    position: fixed; inset: var(--altura-topo) 0 0 0; z-index: 99;
    padding: 18px var(--gutter) 32px; background: rgba(6, 26, 79, 0.96);
    -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
    overflow-y: auto;
  }
  .menu-aberto .menu a { display: block; font-size: 1.2rem; padding: 14px 16px; border: 1px solid var(--borda); }
  .menu-aberto .menu .menu__cta { margin-top: 10px; }
  .menu-aberto .menu .menu__cta a { display: flex; border: 0; text-align: center; justify-content: center; }
  /* barra de contratação visível (o site.js põe body.com-barra junto com .barra-cta--visivel): um só "Contratar" na tela */
  body.com-barra .topo__acoes > .botao:not(.botao--contorno) { display: none; }
}

/* ---------- Botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 14px 26px; border-radius: 999px; border: 1px solid transparent;
  font-family: var(--fonte-titulo); font-weight: 700; font-size: 1rem; line-height: 1; letter-spacing: -0.01em;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  color: var(--tinta);
  background: linear-gradient(135deg, var(--amarelo-claro) -20%, var(--amarelo) 40%, var(--amarelo-2) 110%);
  box-shadow: var(--brilho-amarelo);
  transition: transform var(--transicao), box-shadow var(--transicao), background var(--transicao), color var(--transicao);
}
.botao:hover { transform: translateY(-2px); box-shadow: var(--brilho-amarelo-forte); color: var(--tinta); }
.botao:active { transform: translateY(0); }
.botao svg { width: 20px; height: 20px; flex: none; }
.botao--grande { padding: 18px 34px; font-size: 1.1rem; }
.botao--azul { color: var(--branco); background: linear-gradient(135deg, var(--azul-600) 0%, var(--azul-400) 60%, var(--ciano) 140%); box-shadow: var(--brilho); }
.botao--azul:hover { color: var(--branco); box-shadow: var(--brilho-forte); }
.botao--branco { background: var(--branco); color: var(--azul-800); box-shadow: 0 10px 30px -10px rgba(255, 255, 255, 0.5); }
.botao--branco:hover { color: var(--azul-700); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.6), 0 14px 40px -10px rgba(255, 255, 255, 0.6); }
.botao--contorno { background: rgba(255, 255, 255, 0.06); border-color: var(--borda-forte); box-shadow: none; color: var(--branco); }
.botao--contorno:hover { background: rgba(255, 255, 255, 0.14); border-color: var(--branco); box-shadow: none; color: var(--branco); }
.botao--escuro { background: var(--tinta); border-color: var(--borda); box-shadow: none; color: var(--branco); }
.botao--escuro:hover { border-color: var(--ciano); box-shadow: var(--brilho); color: var(--branco); }
.botao--pulso { position: relative; }
.botao--pulso::after {
  content: ""; position: absolute; inset: -4px; border-radius: inherit; border: 2px solid var(--amarelo); opacity: 0;
  animation: pulso-botao 2.4s ease-out infinite;
}
@media (max-width: 479px) {
  .botao { white-space: normal; text-align: center; max-width: 100%; line-height: 1.2; }
  .botao--grande { padding: 16px 22px; font-size: 1.02rem; }
  .botao--pulso::after { inset: -2px; }
}
.botoes { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.botoes--centro { justify-content: center; }
.nota-botao { font-size: 0.88rem; color: var(--texto-apagado); margin: 10px 0 0; }

/* ---------- Selos e etiquetas ---------- */
.selo {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px;
  font-size: 0.82rem; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase;
  color: var(--branco); background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.28);
}
.selo svg { width: 16px; height: 16px; }
.selo--branco { background: var(--branco); color: var(--azul-800); border-color: var(--branco); }
.selo--amarelo { background: var(--amarelo); color: var(--tinta); border-color: var(--amarelo); box-shadow: 0 6px 20px -8px rgba(255, 184, 0, 0.8); }
.selo--verde { background: rgba(46, 230, 166, 0.18); color: #c9ffe9; border-color: rgba(46, 230, 166, 0.5); }
.selo--escuro { background: var(--tinta); border-color: var(--borda); color: var(--branco); }
.selo--online::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--verde); box-shadow: 0 0 0 0 rgba(46, 230, 166, 0.7); animation: ponto-online 1.8s infinite; }
.etiqueta { display: inline-block; font-family: var(--fonte-titulo); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amarelo); margin-bottom: 12px; }

/* ---------- Seções ---------- */
.secao { position: relative; padding-block: clamp(56px, 8vw, 112px); }
.secao--apertada { padding-block: clamp(36px, 5vw, 64px); }
.secao--continua { padding-top: 0; } /* continua a seção anterior, de mesmo fundo, sem novo respiro no topo */
.secao--escura, .secao--preta { background: var(--tinta); box-shadow: inset 0 1px 0 var(--borda), inset 0 -1px 0 var(--borda); }
.secao--azul { background: linear-gradient(135deg, var(--azul-800), var(--azul-700) 60%, var(--azul-600)); }
.secao--azul p, .secao--azul li, .secao--azul .cabecalho-secao p, .secao--azul .passo p, .secao--azul .cartao p, .secao--azul .prosa p, .secao--azul .prosa li, .secao--azul .prosa .atualizado, .secao--azul .nota-botao { color: #fff; }
.secao--azul .etiqueta { color: var(--branco); }
.secao--branca { background: var(--branco); color: #13213f; }
.secao--branca h1, .secao--branca h2, .secao--branca h3, .secao--branca h4, .secao--branca strong { color: var(--tinta); }
.secao--branca p, .secao--branca li { color: #2b3a5e; }
.secao--branca .etiqueta { color: var(--azul-600); }
.secao--branca a:not(.botao) { color: var(--azul-600); }
.secao--branca a:not(.botao):hover { color: var(--azul-800); }
.secao--branca .botao--contorno { background: var(--azul-100); border-color: rgba(31, 99, 255, 0.35); color: var(--azul-700); }
.secao--branca .botao--contorno:hover { background: var(--azul-100); border-color: var(--azul-600); color: var(--azul-800); }
.secao--branca .cartao { background: var(--azul-100); border-color: rgba(31, 99, 255, 0.18); }
.secao--branca .cartao h3 { color: var(--tinta); }
.secao--branca .cartao p { color: #3a4a70; }
.secao--branca .cartao:hover { border-color: var(--azul-400); box-shadow: 0 16px 40px -20px rgba(31, 99, 255, 0.5); }
.secao--branca .selo { background: var(--azul-100); color: var(--azul-800); border-color: rgba(31, 99, 255, 0.25); }
.secao--branca .selo--amarelo { background: var(--amarelo); color: var(--tinta); border-color: var(--amarelo); }
.secao--branca .selo--verde { background: rgba(46, 230, 166, 0.16); color: #0b6b4a; border-color: rgba(46, 230, 166, 0.55); }
.secao--branca code { background: var(--azul-100); color: var(--azul-800); }
.secao--branca .prosa p, .secao--branca .prosa li { color: #2b3a5e; }
.secao--branca .prosa .atualizado { color: #5a6a90; }
.secao--gradiente { background: linear-gradient(180deg, transparent, rgba(6, 26, 79, 0.5)); }
.cabecalho-secao { max-width: 760px; margin-bottom: clamp(32px, 5vw, 56px); }
.cabecalho-secao--centro { margin-inline: auto; text-align: center; }
.cabecalho-secao .selo { margin-bottom: 12px; }
.cabecalho-secao p { font-size: 1.1rem; color: var(--texto-suave); }
.secao--branca .cabecalho-secao p { color: #3a4a70; }
.destaque { color: var(--ciano); }
.destaque--amarelo { color: var(--amarelo); }
.texto-gradiente {
  background: linear-gradient(90deg, var(--branco) 0%, var(--azul-200) 40%, var(--ciano) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.texto-amarelo {
  background: linear-gradient(90deg, var(--amarelo-claro) 0%, var(--amarelo) 55%, var(--amarelo-2) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- Fundo com vida ---------- */
.fundo-grade { position: relative; }
.fundo-grade::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 30%, transparent 100%);
}
.brilhos {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0;
  -webkit-mask-image: linear-gradient(transparent, #000 160px, #000 calc(100% - 180px), transparent); mask-image: linear-gradient(transparent, #000 160px, #000 calc(100% - 180px), transparent);
}
.brilho { position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.75; will-change: transform; }
.brilho--1 { width: 520px; height: 520px; left: -140px; top: -120px; background: radial-gradient(circle, rgba(94, 231, 255, 0.55), transparent 65%); animation: flutuar 14s ease-in-out infinite; }
.brilho--2 { width: 620px; height: 620px; right: -200px; top: 10%; background: radial-gradient(circle, rgba(255, 95, 162, 0.42), transparent 65%); animation: flutuar 18s ease-in-out infinite reverse; }
.brilho--3 { width: 440px; height: 440px; left: 38%; bottom: -200px; background: radial-gradient(circle, rgba(139, 92, 246, 0.5), transparent 65%); animation: flutuar 16s ease-in-out 2s infinite; }
.brilho--4 { width: 380px; height: 380px; right: 18%; top: -120px; background: radial-gradient(circle, rgba(255, 212, 59, 0.35), transparent 65%); animation: flutuar 20s ease-in-out 1s infinite reverse; }
.secao > .container, .hero > .container, .cabecalho-pagina > .container { position: relative; z-index: 1; }
.linha-luz { height: 1px; background: linear-gradient(90deg, transparent, var(--ciano), var(--amarelo), var(--rosa), transparent); opacity: 0.8; }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; padding-block: clamp(48px, 7vw, 96px) clamp(56px, 8vw, 112px); }
.hero__grade { display: grid; gap: 40px; align-items: center; }
@media (min-width: 960px) { .hero__grade { grid-template-columns: 1.05fr 0.95fr; gap: 48px; } }
.hero .selo { margin-bottom: 20px; }
.hero h1 { margin-bottom: 18px; font-size: clamp(2rem, 1.2rem + 2.4vw, 3rem); max-width: 22ch; text-wrap: balance; }
.hero__texto { font-size: clamp(1.05rem, 1rem + 0.4vw, 1.25rem); color: var(--texto-suave); max-width: 560px; margin-bottom: 26px; }
.hero__preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin: 0 0 22px; font-family: var(--fonte-titulo); }
.hero__preco .moeda { font-size: 1.2rem; color: var(--azul-200); font-weight: 600; }
.hero__preco .valor { font-size: clamp(2.6rem, 2rem + 2.6vw, 4rem); font-weight: 800; line-height: 1; color: var(--branco); text-shadow: 0 0 40px rgba(94, 231, 255, 0.35); }
.hero__preco .periodo { font-size: 1.05rem; color: var(--texto-apagado); }
.hero__preco .detalhe { font-size: 0.95rem; color: var(--azul-200); margin-left: 6px; }
.hero__preco .detalhe::before { content: "· "; }
@media (max-width: 599px), (min-width: 960px) and (max-width: 1199px) { .hero__preco .detalhe { flex-basis: 100%; margin-left: 0; } .hero__preco .detalhe::before { content: none; } }
.hero__provas { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 26px 0 0; padding: 0; list-style: none; color: var(--texto-suave); font-size: 0.95rem; }
.hero__provas li { display: inline-flex; align-items: center; gap: 8px; }
.hero__provas svg { width: 18px; height: 18px; color: var(--verde); flex: none; }
.hero__visual { position: relative; min-height: 0; }
@media (min-width: 960px) { .hero__visual { min-height: 320px; } }
.hero__visual > img, .hero__visual > svg { width: 100%; filter: drop-shadow(0 30px 60px rgba(94, 231, 255, 0.35)); }

/* ---------- Cartões flutuantes ---------- */
.flutuante {
  position: absolute; display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-radius: 14px;
  background: rgba(6, 26, 79, 0.82); border: 1px solid var(--borda-forte);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 20px 50px -20px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(143, 220, 255, 0.1);
  font-size: 0.9rem; color: var(--texto-suave); white-space: nowrap;
  animation: flutuar-leve 6s ease-in-out infinite;
}
.flutuante strong { display: block; font-family: var(--fonte-titulo); font-size: 1.05rem; color: var(--branco); }
.flutuante .icone-caixa { width: 40px; height: 40px; border-radius: 10px; }
.flutuante--1 { left: -6px; top: 8%; animation-delay: -1s; }
.flutuante--2 { right: -6px; top: 42%; animation-delay: -3s; }
.flutuante--3 { left: 10%; bottom: 4%; animation-delay: -5s; }
@media (max-width: 599px) { .flutuante { padding: 10px 12px; font-size: 0.82rem; } .flutuante .icone-caixa { width: 34px; height: 34px; } }

/* ---------- Ícones ---------- */
.icone { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.icone-caixa {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 52px; height: 52px; border-radius: 14px;
  background: linear-gradient(135deg, var(--azul-600), var(--azul-400)); color: var(--branco);
  box-shadow: var(--brilho);
}
.icone-caixa .icone { width: 26px; height: 26px; }
.icone-caixa--amarela { background: linear-gradient(135deg, var(--amarelo-claro), var(--amarelo) 50%, var(--amarelo-2)); color: var(--tinta); box-shadow: var(--brilho-amarelo); }
.icone-caixa--verde { background: linear-gradient(135deg, var(--verde), var(--ciano)); color: var(--tinta); box-shadow: 0 10px 30px -10px rgba(46, 230, 166, 0.7); }
.icone-caixa--rosa { background: linear-gradient(135deg, var(--rosa), var(--roxo)); color: var(--branco); box-shadow: 0 10px 30px -10px rgba(255, 95, 162, 0.7); }
.icone-caixa--ciano { background: linear-gradient(135deg, var(--ciano), var(--azul-400)); color: var(--tinta); box-shadow: var(--brilho); }
.icone-caixa--branca { background: var(--branco); color: var(--azul-700); box-shadow: 0 8px 24px -8px rgba(255, 255, 255, 0.5); }
.icone-caixa--escura, .icone-caixa--preta { background: var(--tinta); color: var(--amarelo); border: 1px solid var(--borda); box-shadow: none; }
.grade > :nth-child(4n+2) > .icone-caixa:not([class*="icone-caixa--"]) { background: linear-gradient(135deg, var(--amarelo-claro), var(--amarelo) 50%, var(--amarelo-2)); color: var(--tinta); box-shadow: var(--brilho-amarelo); }
.grade > :nth-child(4n+3) > .icone-caixa:not([class*="icone-caixa--"]) { background: linear-gradient(135deg, var(--verde), var(--ciano)); color: var(--tinta); box-shadow: 0 10px 30px -10px rgba(46, 230, 166, 0.7); }
.grade > :nth-child(4n+4) > .icone-caixa:not([class*="icone-caixa--"]) { background: linear-gradient(135deg, var(--rosa), var(--roxo)); color: var(--branco); box-shadow: 0 10px 30px -10px rgba(255, 95, 162, 0.7); }

/* ---------- Cartões ---------- */
.grade { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--min-col, 260px)), 1fr)); }
.grade--2 { --min-col: 320px; }
.grade--3 { --min-col: 280px; }
.grade--4 { --min-col: 230px; }
.cartao {
  position: relative; padding: 26px; border-radius: var(--raio);
  background: var(--vidro); border: 1px solid var(--borda);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: transform var(--transicao), border-color var(--transicao), box-shadow var(--transicao);
}
.cartao:hover { transform: translateY(-4px); border-color: rgba(143, 220, 255, 0.6); box-shadow: var(--brilho); }
.cartao .icone-caixa { margin-bottom: 18px; }
.cartao h3 { margin-bottom: 8px; }
.cartao p { color: var(--texto-suave); margin: 0; }
.cartao p + p { margin-top: 0.7em; }
.cartao--escuro, .cartao--preto { background: var(--vidro-escuro); }
.cartao--amarelo { background: var(--amarelo); border-color: var(--amarelo); color: var(--tinta); box-shadow: var(--brilho-amarelo); }
.cartao--amarelo h3, .cartao--amarelo p, .cartao--amarelo strong { color: var(--tinta); }
.cartao--amarelo .icone-caixa { background: var(--tinta); color: var(--amarelo); box-shadow: none; }
.cartao--amarelo:hover { border-color: var(--amarelo-claro); box-shadow: var(--brilho-amarelo-forte); }
.cartao--borda-viva { overflow: hidden; }
.cartao--borda-viva::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px;
  background: conic-gradient(from var(--angulo, 0deg), transparent 0 55%, var(--ciano) 75%, var(--amarelo) 88%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: girar-borda 6s linear infinite; pointer-events: none;
}
.cartao__numero { font-family: var(--fonte-titulo); font-size: 2.4rem; font-weight: 800; line-height: 1; color: var(--amarelo); }
.cartao__numero small { font-size: 1rem; font-weight: 600; color: var(--azul-200); margin-left: 4px; }
.secao--branca .cartao__numero { color: var(--azul-700); }
.secao--branca .cartao__numero small { color: #5a6a90; }

/* ---------- Lista com check ---------- */
.lista-check { list-style: none; padding: 0; margin: 0; }
.lista-check li { position: relative; padding-left: 32px; margin: 0; }
.lista-check li + li { margin-top: 12px; }
.lista-check li::before {
  content: ""; position: absolute; left: 0; top: 0.15em; width: 20px; height: 20px; border-radius: 50%;
  background: linear-gradient(135deg, var(--verde), var(--ciano));
  box-shadow: 0 0 14px rgba(46, 230, 166, 0.45);
}
.lista-check li::after {
  content: ""; position: absolute; left: 6px; top: calc(0.15em + 5px); width: 8px; height: 5px;
  border-left: 2px solid var(--tinta); border-bottom: 2px solid var(--tinta); transform: rotate(-45deg);
}
.lista-check--compacta li + li { margin-top: 8px; }
.secao--branca .lista-check li::before { box-shadow: none; }

/* ---------- Plano ---------- */
.plano {
  position: relative; display: grid; gap: 28px; padding: clamp(26px, 4vw, 44px);
  border-radius: var(--raio-g); overflow: hidden;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.12), rgba(6, 26, 79, 0.75));
  border: 1px solid rgba(143, 220, 255, 0.45);
  box-shadow: 0 0 0 1px rgba(94, 231, 255, 0.12), 0 40px 90px -40px rgba(94, 231, 255, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}
.plano::before {
  content: ""; position: absolute; inset: -40% -20% auto -20%; height: 70%;
  background: radial-gradient(ellipse at 50% 0%, rgba(94, 231, 255, 0.28), transparent 60%); pointer-events: none;
}
.plano::after {
  content: ""; position: absolute; right: -120px; bottom: -160px; width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 212, 59, 0.28), transparent 65%); filter: blur(30px); pointer-events: none;
}
@media (min-width: 860px) { .plano { grid-template-columns: 1fr 1.1fr; align-items: center; } }
.plano > * { position: relative; z-index: 1; }
.plano__nome { font-family: var(--fonte-titulo); font-size: 1.1rem; font-weight: 600; line-height: 1.4; letter-spacing: normal; color: var(--gelo); margin: 0 0 8px; }
.plano__preco { display: flex; align-items: baseline; gap: 6px; margin-bottom: 6px; font-family: var(--fonte-titulo); }
.plano__preco .moeda { font-size: 1.4rem; font-weight: 600; color: var(--amarelo-claro); }
.plano__preco .valor { font-size: clamp(3.4rem, 2.5rem + 4vw, 5.4rem); font-weight: 800; line-height: 0.95; color: var(--amarelo); text-shadow: 0 0 50px rgba(255, 212, 59, 0.45); letter-spacing: -0.04em; }
.plano__preco .centavos { font-size: 1.6rem; font-weight: 700; color: var(--amarelo); }
.plano__preco .periodo { font-size: 1.1rem; color: var(--texto-apagado); }
.plano__sub { color: var(--texto-suave); margin-bottom: 22px; }
.plano__destaques { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; padding: 0; list-style: none; }
.plano__destaques li { padding: 8px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); border: 1px solid var(--borda); font-size: 0.9rem; font-weight: 500; color: var(--branco); }
.plano__inclui { display: grid; gap: 10px 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.plano__inclui .lista-check li + li { margin-top: 10px; }
.plano .botao { width: 100%; }
@media (min-width: 480px) { .plano .botao { width: auto; } }
.plano__selo { margin-bottom: 14px; justify-self: start; }
@media (min-width: 860px) { .plano__selo { position: absolute; top: 18px; right: 18px; margin: 0; } }

/* ---------- Passos ---------- */
.passos { display: grid; gap: 20px; counter-reset: passo; }
@media (min-width: 760px) { .passos { grid-template-columns: repeat(var(--qtd, 4), 1fr); } }
.passo { position: relative; padding: 26px 22px 22px; border-radius: var(--raio); background: var(--vidro); border: 1px solid var(--borda); counter-increment: passo; transition: border-color var(--transicao), transform var(--transicao); }
.passo:hover { border-color: rgba(143, 220, 255, 0.6); transform: translateY(-3px); }
.passo::before {
  content: counter(passo, decimal-leading-zero); display: inline-block; margin-bottom: 14px;
  font-family: var(--fonte-titulo); font-size: 0.9rem; font-weight: 700; letter-spacing: 0.1em; color: var(--ciano);
  padding: 6px 10px; border-radius: 8px; background: rgba(94, 231, 255, 0.14); border: 1px solid rgba(94, 231, 255, 0.4); box-shadow: none;
}
.passo h3 { font-size: 1.15rem; }
.passo p { color: var(--texto-suave); margin: 0; }
.secao--branca .passo { background: var(--azul-100); border-color: rgba(31, 99, 255, 0.18); }
.secao--branca .passo:hover { border-color: var(--azul-400); }
.secao--branca .passo p { color: #3a4a70; }
.secao--branca .passo::before { color: var(--azul-700); background: rgba(31, 99, 255, 0.1); border-color: rgba(31, 99, 255, 0.3); }
.secao--branca .passo:last-child::before { color: var(--tinta); background: var(--amarelo); border-color: var(--amarelo); }
@media (min-width: 760px) {
  .passo:not(:last-child)::after { content: ""; position: absolute; top: 40px; right: -20px; width: 20px; height: 2px; background: linear-gradient(90deg, var(--ciano), transparent); }
}

/* ---------- Faixa de números ---------- */
.faixa-numeros { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); }
.numero { text-align: center; padding: 22px 12px; border-radius: var(--raio); background: var(--vidro); border: 1px solid var(--borda); transition: border-color var(--transicao); }
.numero:hover { border-color: rgba(143, 220, 255, 0.6); }
.numero b { display: block; font-family: var(--fonte-titulo); font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.8rem); font-weight: 800; color: var(--branco); line-height: 1.05; }
.numero b small { font-size: 0.55em; font-weight: 600; color: var(--gelo); margin-left: 3px; }
.numero span { display: block; margin-top: 6px; font-size: 0.9rem; color: var(--texto-apagado); }
.numero--amarelo b { color: var(--amarelo); }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: 12px; }
.faq details { border-radius: 14px; border: 1px solid var(--borda); background: var(--vidro); transition: border-color var(--transicao); }
.faq details[open] { border-color: rgba(143, 220, 255, 0.6); box-shadow: var(--brilho); background: rgba(255, 255, 255, 0.1); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 20px; font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.02rem; color: var(--branco);
}
.faq summary h3 { font: inherit; margin: 0; color: inherit; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; flex: none; width: 10px; height: 10px; border-right: 2px solid var(--amarelo); border-bottom: 2px solid var(--amarelo);
  transform: rotate(45deg); transition: transform var(--transicao); margin-right: 4px;
}
.faq details[open] summary::after { transform: rotate(-135deg); }
.faq .faq__resposta { padding: 0 20px 20px; color: var(--texto-suave); }
.faq .faq__resposta p:last-child { margin-bottom: 0; }
.secao--branca .faq details { background: var(--azul-100); border-color: rgba(31, 99, 255, 0.18); }
.secao--branca .faq summary { color: var(--tinta); }
.secao--branca .faq summary::after { border-color: var(--azul-600); }
.secao--branca .faq .faq__resposta { color: #2b3a5e; }
.secao--branca .faq details[open] { box-shadow: none; border-color: var(--azul-400); background: var(--azul-100); }

/* ---------- Tabela ---------- */
.tabela-rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--raio); border: 1px solid var(--borda); background: var(--vidro); }
.tabela { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.tabela th, .tabela td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--borda); vertical-align: top; }
.tabela thead th { font-family: var(--fonte-titulo); font-weight: 600; color: var(--branco); background: rgba(255, 255, 255, 0.12); }
.tabela tbody tr:last-child td { border-bottom: 0; }
.tabela td:first-child { color: var(--branco); font-weight: 500; }
.tabela .sim { color: var(--verde); font-weight: 600; }
.tabela .nao { color: var(--texto-apagado); }
.tabela .destaque-coluna { background: rgba(255, 212, 59, 0.08); }
.secao--branca .tabela-rolagem { border-color: rgba(31, 99, 255, 0.18); background: var(--branco); }
.secao--branca .tabela th, .secao--branca .tabela td { border-bottom-color: rgba(31, 99, 255, 0.14); }
.secao--branca .tabela thead th { color: var(--tinta); background: var(--azul-100); }
.secao--branca .tabela td { color: #2b3a5e; }
.secao--branca .tabela td:first-child { color: var(--tinta); }
.secao--branca .tabela .sim { color: #0f9f6e; }
.secao--branca .tabela .nao { color: #7483a6; }
.secao--branca .tabela .destaque-coluna { background: rgba(31, 99, 255, 0.06); }
.secao--branca .tabela thead .destaque-coluna { background: var(--azul-100); color: var(--azul-700); }
@media (max-width: 599px) {
  .tabela { font-size: 0.9rem; }
  .tabela th, .tabela td { padding: 10px; }
  /* tabelas de texto longo: cada linha vira um cartão */
  .tabela--empilha, .tabela--empilha tbody { display: block; }
  .tabela--empilha thead { display: none; }
  .tabela--empilha tr { display: block; padding: 12px 14px; border-bottom: 1px solid var(--borda); }
  .tabela--empilha tbody tr:last-child { border-bottom: 0; }
  .tabela--empilha td, .tabela--empilha tbody tr:last-child td { display: block; border: 0; padding: 2px 0; }
  .tabela--empilha td:first-child { font-weight: 600; margin-bottom: 4px; }
  .tabela--empilha .destaque-coluna, .secao--branca .tabela--empilha .destaque-coluna { background: none; }
  .tabela--empilha td[data-rotulo]::before { content: attr(data-rotulo) ": "; font-weight: 600; color: var(--gelo); }
  .secao--branca .tabela--empilha tr { border-bottom-color: rgba(31, 99, 255, 0.14); }
  .secao--branca .tabela--empilha td[data-rotulo]::before { color: var(--azul-700); }
}

/* ---------- Janela ilustrativa ---------- */
.janela { border-radius: 14px; overflow: hidden; background: var(--tinta); border: 1px solid var(--borda-forte); box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.7), var(--brilho); }
.janela__barra { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: rgba(255, 255, 255, 0.07); border-bottom: 1px solid var(--borda); }
.janela__barra i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.22); }
.janela__barra i:nth-child(1) { background: var(--rosa); }
.janela__barra i:nth-child(2) { background: var(--amarelo); }
.janela__barra i:nth-child(3) { background: var(--verde); }
.janela__barra span { margin-left: 10px; font-size: 0.8rem; color: var(--texto-apagado); }
.janela__corpo { padding: 16px; }
.secao--branca .janela { background: var(--tinta); }
.secao--branca .janela__corpo:not(.tabela-rolagem) { background: var(--branco); }
.janela .tabela-rolagem, .secao--branca .janela .tabela-rolagem { border: 0; border-radius: 0; background: none; }
.janela pre { margin: 0; overflow-x: auto; }
.janela pre code { display: block; background: none; padding: 0; border-radius: 0; color: var(--amarelo-claro); font-size: 0.9rem; line-height: 1.7; }
.prosa li > .janela { margin: 10px 0 14px; }

/* ---------- Ondas de som ---------- */
.ondas { display: inline-flex; align-items: center; gap: 3px; height: 28px; }
.ondas i { width: 4px; height: 30%; border-radius: 2px; background: linear-gradient(180deg, var(--amarelo), var(--ciano)); animation: onda 1.1s ease-in-out infinite; }
.ondas i:nth-child(2) { animation-delay: -0.2s; }
.ondas i:nth-child(3) { animation-delay: -0.4s; }
.ondas i:nth-child(4) { animation-delay: -0.6s; }
.ondas i:nth-child(5) { animation-delay: -0.8s; }
.ondas i:nth-child(6) { animation-delay: -1s; }
.ondas i:nth-child(7) { animation-delay: -0.3s; }

/* ---------- Mapa / datacenter ---------- */
.datacenter { display: grid; gap: 36px; align-items: center; }
@media (min-width: 900px) { .datacenter { grid-template-columns: 1fr 1fr; } }
.datacenter__mapa { position: relative; }
.datacenter__mapa img { width: 100%; max-width: 520px; margin-inline: auto; filter: drop-shadow(0 20px 50px rgba(94, 231, 255, 0.35)); }

/* ---------- CTA final ---------- */
.cta-final { position: relative; overflow: hidden; text-align: center; padding: clamp(44px, 6vw, 80px) var(--gutter); border-radius: var(--raio-g); background: linear-gradient(135deg, var(--azul-700), var(--azul-500) 55%, var(--ciano) 140%); border: 1px solid rgba(255, 255, 255, 0.25); box-shadow: 0 40px 100px -40px rgba(94, 231, 255, 0.7); }
.cta-final::before { content: ""; position: absolute; inset: 0; background: radial-gradient(600px 300px at 50% 120%, rgba(255, 255, 255, 0.28), transparent 60%), radial-gradient(400px 260px at 0% 0%, rgba(255, 212, 59, 0.25), transparent 60%); pointer-events: none; }
.cta-final > * { position: relative; }
.cta-final h2 { font-size: clamp(1.8rem, 1.2rem + 2.6vw, 3rem); }
.cta-final p { color: rgba(255, 255, 255, 0.9); font-size: 1.1rem; max-width: 620px; margin-inline: auto; }
.cta-final .botao { margin-top: 10px; }
@media (max-width: 479px) { .cta-final { padding-inline: 20px; } }

/* ---------- Cabeçalho de página interna ---------- */
.cabecalho-pagina { position: relative; overflow: hidden; padding-block: clamp(40px, 6vw, 80px) clamp(32px, 4vw, 56px); }
.cabecalho-pagina .hero__topo h1 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.25rem); max-width: 20ch; }
/* No desktop o título fica acima da grade (.hero__topo), na largura do container: no máximo 2 linhas */
@media (min-width: 960px) { .hero .hero__topo h1, .cabecalho-pagina .hero__topo h1 { max-width: 30ch; font-size: clamp(2.2rem, 1.2rem + 2vw, 3rem); } }
.cabecalho-pagina p { font-size: 1.12rem; color: var(--texto-suave); max-width: 700px; }
.migalhas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0 0 18px; padding: 0; list-style: none; font-size: 0.88rem; color: var(--texto-apagado); }
.migalhas li + li::before { content: "/"; margin-right: 6px; opacity: 0.5; }
.migalhas a { color: var(--texto-suave); text-decoration: none; }
.migalhas a:hover { color: var(--branco); }
.temas { display: flex; flex-wrap: nowrap; gap: 4px 24px; margin: 24px 0 0; padding: 14px 0 6px; list-style: none; border-top: 1px solid var(--borda); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.temas li { flex: none; }
.temas a { display: inline-block; padding: 6px 2px; white-space: nowrap; color: var(--branco); font-size: 1rem; font-weight: 600; text-decoration: underline; text-decoration-color: var(--ciano); text-decoration-thickness: 2px; text-underline-offset: 7px; transition: color var(--transicao); }
.temas a:hover { color: var(--ciano); }
@media (min-width: 960px) { .temas { flex-wrap: wrap; overflow-x: visible; } }

/* ---------- Prosa (páginas legais e artigos) ---------- */
.prosa { max-width: 72ch; }
.container.prosa { max-width: 860px; }
.prosa h2 { margin-top: 2.2em; font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem); }
.prosa h3 { margin-top: 1.6em; }
.prosa > :first-child, .prosa .cartao h3 { margin-top: 0; }
.prosa > h2:first-child { font-size: clamp(1.6rem, 1.1rem + 2.2vw, 2.6rem); }
.prosa p, .prosa li { color: var(--texto-suave); font-size: 1.05rem; }
.prosa ul, .prosa ol { margin-bottom: 1.3em; }
.prosa ol { padding-left: 2em; }
.prosa .atualizado { font-size: 0.9rem; color: var(--texto-apagado); }
.prosa img { border-radius: var(--raio); border: 1px solid var(--borda); margin: 1.5em 0; }
.prosa .cartao { margin: 1.5em 0; }
.aviso { padding: 18px 20px; border-radius: 14px; border: 1px solid rgba(255, 212, 59, 0.45); background: rgba(255, 212, 59, 0.1); color: var(--texto); }
.aviso p:last-child { margin-bottom: 0; }
.secao--branca .aviso { background: #fff7d6; border-color: #f2d36b; color: var(--tinta); }

/* ---------- Barra fixa de contratação (celular) ---------- */
.barra-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
  background: rgba(6, 26, 79, 0.92); border-top: 1px solid var(--borda-forte);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  transform: translateY(110%); visibility: hidden;
  transition: transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1), visibility 0s linear 0.35s;
}
.barra-cta--visivel { transform: translateY(0); visibility: visible; transition-delay: 0s; }
.barra-cta b { font-family: var(--fonte-titulo); font-size: 1.05rem; color: var(--amarelo); display: block; line-height: 1.1; }
.barra-cta small { color: var(--texto-apagado); font-size: 0.8rem; }
.barra-cta .botao { padding: 12px 20px; font-size: 0.95rem; }
@media (min-width: 960px) { .barra-cta { display: none; } }
body.com-barra { padding-bottom: 76px; }
@media (min-width: 960px) { body.com-barra { padding-bottom: 0; } }

/* ---------- Rodapé ---------- */
.rodape { background: var(--tinta); border-top: 1px solid var(--borda); padding: clamp(40px, 6vw, 72px) 0 28px; color: var(--texto-apagado); font-size: 0.95rem; }
.rodape__grade { display: grid; gap: 32px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .rodape__grade { grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 28px; } }
.rodape .rodape__titulo { margin: 0 0 14px; font-family: var(--fonte-titulo); font-weight: 600; font-size: 0.85rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amarelo); margin-bottom: 14px; }
.rodape ul { list-style: none; padding: 0; margin: 0; }
.rodape li + li { margin-top: 10px; }
.rodape a { color: var(--texto-suave); text-decoration: none; }
.rodape a:hover { color: var(--branco); }
.rodape .marca { margin-bottom: 14px; }
.rodape__sobre { max-width: 340px; }
.rodape__base { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--borda); display: flex; flex-wrap: wrap; gap: 10px 24px; justify-content: space-between; font-size: 0.85rem; }
.rodape__base p { margin: 0; }

/* ---------- Revelar ao rolar ---------- */
.js .revelar { opacity: 0; transform: translateY(22px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1); }
.js .revelar.visivel { opacity: 1; transform: none; }
.js .revelar--atraso-1 { transition-delay: 0.1s; }
.js .revelar--atraso-2 { transition-delay: 0.2s; }
.js .revelar--atraso-3 { transition-delay: 0.3s; }
/* Rede de segurança: se o site.js não carregar ou falhar antes de marcar html.js-ok, tudo aparece após 3 s */
.js:not(.js-ok) .revelar:not(.visivel) { animation: revelar-seguranca 0.6s ease 3s forwards; }
@keyframes revelar-seguranca { to { opacity: 1; transform: none; } }

/* ---------- Animações ---------- */
@keyframes flutuar { 0%, 100% { transform: translate(0, 0) scale(1); } 33% { transform: translate(40px, -30px) scale(1.06); } 66% { transform: translate(-30px, 20px) scale(0.96); } }
@keyframes flutuar-leve { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes onda { 0%, 100% { height: 30%; } 50% { height: 100%; } }
@keyframes ponto-online { 0% { box-shadow: 0 0 0 0 rgba(46, 230, 166, 0.7); } 70% { box-shadow: 0 0 0 8px rgba(46, 230, 166, 0); } 100% { box-shadow: 0 0 0 0 rgba(46, 230, 166, 0); } }
@keyframes pulso-botao { 0% { transform: scale(0.92); opacity: 0.8; } 100% { transform: scale(1.18); opacity: 0; } }
@property --angulo { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes girar-borda { to { --angulo: 360deg; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.001s !important; animation-iteration-count: 1 !important; transition-duration: 0.001s !important; }
  .js .revelar { opacity: 1; transform: none; }
}
