/*
 * Página de solução: layout + componentes do Magic UI portados (CSS).
 * Dot Pattern, Border Beam, Magic Card, Bento Grid, Animated Beam, Animated List, Text Animate,
 * Text Reveal, Number Ticker, Scroll Progress, Shine (Glare Hover). JS em assets/js/motion.js.
 * Contrastes em fundo marinho: branco 17,98:1, --slate-300 9,06:1, --gold-400 9,47:1.
 */

/* ---------- Base comum ---------- */
.ico{ width:24px; height:24px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.ico--sm{ width:16px; height:16px; }
.label{ margin-bottom:var(--s-2); }
.section-head .label{ margin-bottom:var(--s-2); }
h1 em, h2 em{ font-style:normal; color:var(--gold-400); }

/* Dot Pattern (Magic UI) em CSS: pontos com máscara radial. */
.dot-pattern{
  position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px, rgba(216,185,104,.32) 1px, transparent 0);
  background-size:22px 22px;
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 75% 40%, #000 0%, transparent 72%);
          mask-image:radial-gradient(ellipse 70% 70% at 75% 40%, #000 0%, transparent 72%);
}

/* Shine (Glare Hover): reflexo diagonal ao passar o mouse no botão primário. */
.btn--shine{ position:relative; overflow:hidden; isolation:isolate; }
.btn--shine::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%);
  transform:translateX(-120%); transition:transform 700ms var(--ease);
}
.btn--shine:hover::after, .btn--shine:focus-visible::after{ transform:translateX(120%); }
.btn .ico{ width:18px; height:18px; }

/* Scroll Progress (Magic UI) */
.scroll-progress{ position:fixed; inset:0 0 auto 0; height:2px; z-index:200; transform-origin:0 50%; transform:scaleX(0); background:linear-gradient(90deg, var(--gold-700), var(--gold-400)); pointer-events:none; }

/* ---------- Hero ---------- */
.sx-hero{ position:relative; overflow:hidden; background:var(--navy-900); color:#fff; padding-block:var(--s-5) var(--s-6); }
.sx-hero__bg{ position:absolute; inset:0; }
.sx-hero__glow{ position:absolute; width:720px; height:720px; left:-240px; top:-320px; border-radius:50%; background:radial-gradient(circle, rgba(30,71,122,.55), transparent 65%); }
.sx-hero__grid{ position:relative; display:grid; gap:var(--s-6); align-items:center; }
.sx-hero .breadcrumb ol{ color:var(--slate-300); }
.sx-hero .breadcrumb [aria-current="page"]{ color:#fff; }
.sx-hero h1{ color:#fff; font-size:clamp(2.375rem, 1.6rem + 3.2vw, 4rem); line-height:1.04; letter-spacing:-.03em; max-width:14ch; }
.sx-hero__lead{ margin-top:var(--s-3); color:var(--slate-300); max-width:34rem; }
.sx-hero .btn-row{ margin-top:var(--s-4); }

.sx-facts{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); margin:var(--s-5) 0 0; padding-top:var(--s-3); border-top:1px solid rgba(174,185,201,.22); }
.sx-facts > div{ display:flex; flex-direction:column-reverse; gap:4px; padding-right:var(--s-2); }
.sx-facts > div + div{ padding-left:var(--s-2); border-left:1px solid rgba(174,185,201,.22); }
.sx-facts dt{ font-size:var(--fs-small); color:var(--slate-300); line-height:1.35; }
.sx-facts dd{ margin:0; font:600 clamp(1.125rem, 1rem + .6vw, 1.5rem)/1.2 var(--font-display); color:#fff; font-variant-numeric:tabular-nums; white-space:nowrap; }

.sx-hero__media{ position:relative; padding:0 0 var(--s-5); }
.sx-hero__photo{ position:relative; border-radius:12px; overflow:hidden; box-shadow:0 30px 60px -20px rgba(0,0,0,.6); }
.sx-hero__photo::after{ content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(216,185,104,.35); pointer-events:none; }
.sx-hero__photo img{ width:100%; aspect-ratio:4 / 3; object-fit:cover; border-radius:0; }

.sx-float{
  position:absolute; border-radius:10px; color:#fff;
  background:rgba(11,30,54,.82); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(216,185,104,.28); box-shadow:var(--shadow-float);
}
.sx-float--status{ left:-12px; bottom:0; width:min(280px, 82%); padding:var(--s-2); }
.sx-float__title{ font-size:var(--fs-label); font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-400); margin-bottom:var(--s-1); }
.sx-status{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.sx-status li{ display:flex; align-items:center; gap:10px; font-size:.875rem; line-height:1.3; color:#fff; transition:opacity 350ms var(--ease), transform 450ms cubic-bezier(.34,1.56,.64,1); }
.sx-status .ico{ color:var(--gold-400); }
.sx-status .is-live .ico{ color:var(--gold-300); }
.sx-status .is-live::after{ content:""; width:8px; height:8px; margin-left:auto; border-radius:50%; background:var(--gold-400); box-shadow:0 0 0 0 rgba(216,185,104,.6); animation:fx-pulse 2s ease-out infinite; }
.sx-float--chip{ top:16px; right:-8px; display:flex; align-items:center; gap:8px; padding:10px 14px; font-size:.8125rem; font-weight:600; }
.sx-float--chip .ico{ color:var(--gold-400); }
@keyframes fx-pulse{ 0%{ box-shadow:0 0 0 0 rgba(216,185,104,.6); } 80%,100%{ box-shadow:0 0 0 10px rgba(216,185,104,0); } }

@media (min-width:1024px){
  .sx-hero{ padding-block:var(--s-6) var(--s-7); }
  .sx-hero__grid{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:var(--s-7); }
  .sx-float--status{ left:-48px; bottom:-8px; }
  .sx-float--chip{ right:-24px; top:32px; }
}
@media (max-width:479.98px){
  .sx-facts{ grid-template-columns:1fr 1fr; row-gap:var(--s-2); }
  .sx-facts > div:nth-child(3){ grid-column:1 / -1; padding-left:0; border-left:0; padding-top:var(--s-2); border-top:1px solid rgba(174,185,201,.22); }
  .sx-float--chip{ right:8px; }
  .sx-float--status{ left:8px; }
}

/* Entrada do hero: Text Animate (blurInUp por palavra) + Blur Fade escalonado + revelação da foto. */
.js [data-text-animate] .ta-w{ display:inline-block; opacity:0; filter:blur(10px); transform:translateY(20px); }
.js [data-text-animate].is-in .ta-w{ opacity:1; filter:blur(0); transform:none; transition:opacity 400ms var(--ease), filter 300ms var(--ease), transform 300ms var(--ease); transition-delay:calc(var(--w) * 60ms + 80ms); }
.js [data-hero-in]{ opacity:0; filter:blur(6px); transform:translateY(12px); }
.js [data-hero-in].is-in{ opacity:1; filter:none; transform:none; transition:opacity 500ms var(--ease), filter 500ms var(--ease), transform 500ms var(--ease); transition-delay:calc(var(--i, 0) * 120ms + 350ms); }
.js .sx-hero__photo{ animation:fx-clip 1100ms cubic-bezier(.65,0,.35,1) 200ms both; }
.js .sx-float{ animation:fx-float-in 600ms var(--ease) both; animation-delay:900ms; }
.js .sx-float--chip{ animation-delay:1150ms; }
@keyframes fx-clip{ from{ clip-path:inset(0 0 100% 0 round 12px); } to{ clip-path:inset(0 0 0 0 round 12px); } }
@keyframes fx-float-in{ from{ opacity:0; transform:translateY(16px) scale(.96); } to{ opacity:1; transform:none; } }
/* Animated List: estado de entrada (escala + opacidade, mola). */
.js [data-animated-list] > .is-enter{ opacity:0; transform:scale(.6) translateY(-8px); }
.js [data-animated-list] > .is-out{ opacity:0; transform:scale(.9); transition:opacity 300ms var(--ease), transform 300ms var(--ease); }

/* ---------- Text Reveal ---------- */
.sx-statement{ padding-block:var(--s-7); background:var(--surface); }
.sx-statement__text{ max-width:22ch; font:600 clamp(1.75rem, 1.2rem + 2.6vw, 3.25rem)/1.15 var(--font-display); letter-spacing:-.025em; color:var(--ink); }
.js .sx-statement__text .ta-w{ color:rgba(14,23,38,.16); transition:color 250ms var(--ease); }
.js .sx-statement__text .ta-w.is-on{ color:var(--ink); }
@media (min-width:1024px){ .sx-statement{ padding-block:var(--s-8); } }

/* ---------- O que é + Ficha (Border Beam) ---------- */
.sx-about{ align-items:start; }
.prose{ margin-top:var(--s-3); color:var(--text-2); }
.sx-sheet{ position:relative; padding:var(--s-4); border-radius:12px; background:var(--surface); border:1px solid var(--line-2); box-shadow:0 24px 48px -28px rgba(8,23,43,.35); }
.sx-sheet__head{ display:flex; align-items:center; gap:12px; margin-bottom:var(--s-2); color:var(--gold-700); }
.sx-sheet__head h3{ font-size:1.0625rem; color:var(--ink); }
.sx-sheet .termsheet > div{ grid-template-columns:minmax(0,1fr); }
@media (min-width:480px){ .sx-sheet .termsheet > div{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:var(--s-2); } }
@media (min-width:1024px){ .sx-sheet{ position:sticky; top:100px; } }

/* Border Beam (Magic UI): conic-gradient girando, recortado na borda. */
@property --bb-angle{ syntax:"<angle>"; inherits:false; initial-value:0deg; }
.border-beam{
  position:absolute; inset:-1px; border-radius:inherit; padding:1.5px; pointer-events:none;
  background:conic-gradient(from var(--bb-angle), transparent 0 72%, var(--gold-500) 86%, var(--gold-300) 92%, transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor;
          mask:linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation:fx-beam 6s linear infinite;
}
@keyframes fx-beam{ to{ --bb-angle:360deg; } }

/* ---------- Para quem é: Magic Card ---------- */
.sx-cards{ list-style:none; margin:0; padding:0; display:grid; gap:var(--s-2); }
@media (min-width:768px){ .sx-cards{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-3); } }
@media (min-width:1024px){
  .sx-cards--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .sx-cards--4{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .sx-cards--5{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  .sx-cards--5 > li{ grid-column:span 2; }
  .sx-cards--5 > li:nth-child(4){ grid-column:2 / span 2; }
}
.sx-card{ position:relative; padding:var(--s-4); border-radius:12px; background:var(--surface); border:1px solid var(--line-2); transition:transform 250ms var(--ease), box-shadow 250ms var(--ease), border-color 250ms var(--ease); }
.sx-card h3{ margin-top:var(--s-3); font-size:1.1875rem; }
.sx-card p{ margin-top:var(--s-1); color:var(--text-2); }
.sx-card__icon{ display:inline-grid; place-items:center; width:48px; height:48px; border-radius:10px; background:var(--navy-900); color:var(--gold-400); }

[data-spotlight]{ --mx:-400px; --my:-400px; }
[data-spotlight]::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:0; transition:opacity 300ms var(--ease);
  background:radial-gradient(260px circle at var(--mx) var(--my), rgba(201,162,75,.14), transparent 70%);
}
[data-spotlight]::after{
  content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px; pointer-events:none; opacity:0; transition:opacity 300ms var(--ease);
  background:radial-gradient(220px circle at var(--mx) var(--my), var(--gold-500), transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor;
          mask:linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
@media (hover:hover) and (pointer:fine){
  [data-spotlight]:hover::before, [data-spotlight]:hover::after{ opacity:1; }
  .sx-card:hover{ transform:translateY(-4px); box-shadow:0 24px 40px -24px rgba(8,23,43,.35); }
}

/* ---------- Como funciona: Animated Beam + passos ---------- */
.sx-how{ position:relative; overflow:hidden; }
.sx-how__bg{ -webkit-mask-image:radial-gradient(ellipse 60% 60% at 50% 30%, #000, transparent 75%); mask-image:radial-gradient(ellipse 60% 60% at 50% 30%, #000, transparent 75%); }
.sx-how .wrap{ position:relative; }
.sx-how .section-head p{ color:var(--slate-300); }

.sx-flow{ position:relative; display:grid; grid-template-columns:1fr 1.2fr 1fr; align-items:center; gap:var(--s-2); max-width:880px; margin:0 auto var(--s-6); padding:var(--s-4) var(--s-2); border-radius:16px; background:rgba(255,255,255,.03); border:1px solid rgba(174,185,201,.14); }
.sx-flow__col{ position:relative; z-index:1; display:flex; justify-content:center; }
.sx-flow__col--stack{ flex-direction:column; align-items:center; gap:var(--s-3); }
.sx-node{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; font-size:.8125rem; line-height:1.3; color:var(--slate-300); max-width:120px; }
.sx-node .ico{ box-sizing:content-box; width:22px; height:22px; padding:13px; border-radius:50%; color:var(--gold-400); background:var(--navy-800); border:1px solid rgba(216,185,104,.35); box-shadow:0 0 24px -6px rgba(201,162,75,.45); }
.sx-node--hub{ color:#fff; font-weight:600; }
.sx-node--hub img{ width:72px; height:72px; border-radius:18px; box-shadow:0 0 0 1px rgba(216,185,104,.5), 0 0 48px -6px rgba(201,162,75,.7); }
.beam-svg{ position:absolute; inset:0; z-index:0; overflow:visible; pointer-events:none; }
.beam-base{ fill:none; stroke:rgba(174,185,201,.22); stroke-width:1.5; }
.beam-light{ fill:none; stroke:var(--gold-400); stroke-width:2; stroke-linecap:round; opacity:0; filter:drop-shadow(0 0 4px rgba(216,185,104,.8)); }
.is-live .beam-light{ opacity:1; animation:fx-beam-run 3.2s cubic-bezier(.16,1,.3,1) infinite; }
@keyframes fx-beam-run{ from{ stroke-dashoffset:calc(var(--len) * .22); } to{ stroke-dashoffset:calc(var(--len) * -1); } }
@media (min-width:768px){ .sx-flow{ padding:var(--s-5) var(--s-4); } .sx-node{ font-size:.875rem; max-width:150px; } }

.sx-steps{ position:relative; list-style:none; margin:0; padding:0; display:grid; gap:var(--s-4); --fill:0; }
.sx-steps > li:not(.sx-steps__line){ position:relative; display:grid; grid-template-columns:48px minmax(0,1fr); column-gap:var(--s-2); align-content:start; }
.sx-steps > li > *:not(.sx-steps__num){ grid-column:2; }
.sx-steps__num{ grid-row:1 / span 2; display:grid; place-items:center; width:48px; height:48px; border-radius:50%; font:600 .9375rem/1 var(--font-display); font-variant-numeric:tabular-nums; color:var(--slate-300); background:var(--navy-900); border:1px solid rgba(174,185,201,.3); transition:background-color 300ms var(--ease), color 300ms var(--ease), border-color 300ms var(--ease), box-shadow 300ms var(--ease); }
.sx-steps li.is-active .sx-steps__num{ background:var(--gold-500); color:var(--navy-900); border-color:var(--gold-500); box-shadow:0 0 0 6px rgba(201,162,75,.15); }
.sx-steps h3{ font-size:1.125rem; color:#fff; padding-top:12px; }
.sx-steps p{ margin-top:var(--s-1); color:var(--slate-300); }
.sx-steps__line{ position:absolute; left:23px; top:24px; bottom:24px; width:2px; background:rgba(174,185,201,.2); }
.sx-steps__line span{ position:absolute; inset:0; background:linear-gradient(var(--gold-400), var(--gold-600)); transform-origin:top; transform:scaleY(var(--fill)); }
@media (min-width:1024px){
  .sx-steps--4{ grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--gutter); }
  .sx-steps--4 > li:not(.sx-steps__line){ grid-template-columns:1fr; }
  .sx-steps--4 > li > *:not(.sx-steps__num){ grid-column:1; }
  .sx-steps--4 .sx-steps__num{ grid-row:auto; margin-bottom:var(--s-2); }
  .sx-steps--4 h3{ padding-top:0; }
  .sx-steps--4 .sx-steps__line{ left:24px; right:calc(25% - 24px); top:23px; bottom:auto; width:auto; height:2px; }
  .sx-steps--4 .sx-steps__line span{ transform-origin:left; transform:scaleX(var(--fill)); }
}

/* ---------- O que você precisa: checklist que se desenha ---------- */
.sx-req{ align-items:start; }
.sx-req .lead{ margin-top:var(--s-2); }
.sx-checklist{ list-style:none; margin:0; padding:var(--s-2) var(--s-3); border-radius:12px; background:var(--surface-2); border:1px solid var(--line-2); }
.sx-checklist li{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:var(--s-2); align-items:start; padding:14px 0; color:var(--ink); }
.sx-checklist li + li{ border-top:1px solid var(--line-2); }
.sx-check{ width:24px; height:24px; margin-top:1px; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.sx-check circle{ fill:var(--navy-900); stroke:none; }
.sx-check path{ stroke:var(--gold-400); stroke-width:2; stroke-dasharray:16; stroke-dashoffset:0; }
.js .sx-checklist[data-reveal] .sx-check path{ stroke-dashoffset:16; }
.js .sx-checklist[data-reveal].is-in .sx-check path{ stroke-dashoffset:0; transition:stroke-dashoffset 450ms var(--ease); transition-delay:calc(var(--i) * 140ms + 250ms); }

/* ---------- Diferenciais: Bento Grid ---------- */
.sx-bento{ list-style:none; margin:0; padding:0; display:grid; gap:var(--s-2); }
.sx-bento__cell{ position:relative; display:flex; flex-direction:column; overflow:hidden; border-radius:16px; background:var(--surface); border:1px solid var(--line-2); transition:transform 300ms var(--ease), box-shadow 300ms var(--ease); }
.sx-bento__visual{ position:relative; display:grid; place-items:center; min-height:190px; padding:var(--s-3); background:var(--navy-900); color:#fff; overflow:hidden; }
.sx-bento__visual::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(circle at 1px 1px, rgba(216,185,104,.22) 1px, transparent 0); background-size:18px 18px; -webkit-mask-image:radial-gradient(ellipse at center, #000, transparent 75%); mask-image:radial-gradient(ellipse at center, #000, transparent 75%); }
.sx-bento__body{ padding:var(--s-3) var(--s-4) var(--s-4); }
.sx-bento__body h3{ font-size:1.1875rem; }
.sx-bento__body p{ margin-top:var(--s-1); color:var(--text-2); }
@media (hover:hover) and (pointer:fine){ .sx-bento__cell:hover{ transform:translateY(-4px); box-shadow:0 28px 48px -28px rgba(8,23,43,.45); } }
@media (min-width:768px){
  .sx-bento{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-3); }
  .sx-bento__cell--escrow{ grid-column:1 / -1; }
}
@media (min-width:1024px){
  .sx-bento{ grid-template-columns:repeat(3, minmax(0,1fr)); grid-template-areas:"escrow escrow trace" "seg gov trace"; }
  .sx-bento__cell--escrow{ grid-area:escrow; }
  .sx-bento__cell--rastreabilidade{ grid-area:trace; }
  .sx-bento__cell--segregadas{ grid-area:seg; }
  .sx-bento__cell--governanca{ grid-area:gov; }
  .sx-bento__cell--rastreabilidade .sx-bento__visual{ flex:1; align-items:start; padding-top:var(--s-4); }
}

/* Visual: escrow (Animated Beam pequeno) */
.vx-escrow{ position:relative; z-index:1; display:flex; justify-content:space-between; align-items:center; width:100%; max-width:460px; gap:var(--s-2); }
.sx-node--sm .ico{ width:20px; height:20px; padding:12px; }
.sx-node--sm{ font-size:.8125rem; }
.vx-escrow .sx-node--hub .ico{ width:26px; height:26px; padding:16px; color:var(--navy-900); background:var(--gold-500); border-color:var(--gold-400); }

/* Visual: rastreabilidade (Animated List em loop) */
.vx-feed{ position:relative; z-index:1; list-style:none; margin:0; padding:0; width:100%; max-width:320px; min-height:300px; display:grid; gap:10px; align-content:start; }
.vx-feed li{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid rgba(174,185,201,.18); font-size:.875rem; color:#fff; transition:opacity 350ms var(--ease), transform 500ms cubic-bezier(.34,1.56,.64,1); }
.vx-feed li .ico{ box-sizing:content-box; padding:7px; border-radius:8px; background:rgba(201,162,75,.16); color:var(--gold-400); }
.vx-feed li:first-child{ border-color:rgba(216,185,104,.45); }

/* Visual: contas segregadas */
.vx-split{ position:relative; z-index:1; display:flex; align-items:flex-end; gap:var(--s-3); height:130px; }
.vx-split__acc{ display:flex; flex-direction:column; align-items:center; gap:10px; font-size:.8125rem; color:var(--slate-300); }
.vx-split__bar{ width:56px; height:64px; border-radius:6px 6px 2px 2px; background:rgba(174,185,201,.25); }
.vx-split__acc--op .vx-split__bar{ height:96px; background:linear-gradient(var(--gold-400), var(--gold-700)); }
.vx-split__wall{ align-self:stretch; width:0; border-left:2px dashed rgba(216,185,104,.6); }
.js .sx-bento__cell[data-reveal] .vx-split__bar{ transform:scaleY(.1); transform-origin:bottom; }
.js .sx-bento__cell[data-reveal].is-in .vx-split__bar{ transform:none; transition:transform 900ms cubic-bezier(.34,1.3,.64,1) 300ms; }

/* Visual: governança (aprovações em sequência) */
.vx-gov{ position:relative; z-index:1; list-style:none; margin:0; padding:0; width:100%; max-width:260px; display:grid; gap:8px; counter-reset:gov; }
.vx-gov li{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-radius:8px; background:rgba(255,255,255,.06); border:1px solid rgba(174,185,201,.18); font-size:.875rem; color:#fff; }
.vx-gov .ico{ box-sizing:content-box; padding:3px; border-radius:50%; background:var(--gold-500); color:var(--navy-900); stroke-width:2.5; }
.js .sx-bento__cell[data-reveal] .vx-gov .ico{ transform:scale(0); }
.js .sx-bento__cell[data-reveal].is-in .vx-gov .ico{ transform:scale(1); transition:transform 400ms cubic-bezier(.34,1.56,.64,1); transition-delay:calc(var(--i) * 350ms + 400ms); }

/* ---------- FAQ ---------- */
.sx-faq__aside h2{ margin-bottom:var(--s-4); }
.sx-help{ padding:var(--s-3); border-radius:12px; background:var(--navy-900); color:var(--slate-300); }
.sx-help a{ display:inline-flex; align-items:center; gap:10px; min-height:44px; margin-top:var(--s-1); font:600 1.25rem/1.2 var(--font-display); color:#fff; text-decoration:none; }
.sx-help a .ico{ color:var(--gold-400); }
.sx-help a:hover{ color:var(--gold-300); }
.sx-help .small{ color:var(--slate-300); }
.faq details{ transition:background-color 200ms var(--ease); }
.faq summary:hover{ color:var(--navy-700); }
.faq details::details-content{ block-size:0; overflow:hidden; transition:block-size 300ms var(--ease), content-visibility 300ms allow-discrete; }
.faq details[open]::details-content{ block-size:auto; }
:root{ interpolate-size:allow-keywords; }
@media (max-width:1023.98px){ .sx-faq__aside{ margin-bottom:var(--s-2); } }

/* ---------- CTA final ---------- */
.sx-cta{ position:relative; overflow:hidden; background:var(--navy-900); color:#fff; padding-block:var(--s-7); text-align:center; }
.sx-cta__bg{ position:absolute; inset:0; }
.sx-cta .dot-pattern{ -webkit-mask-image:radial-gradient(ellipse 55% 70% at 50% 50%, #000, transparent 75%); mask-image:radial-gradient(ellipse 55% 70% at 50% 50%, #000, transparent 75%); }
.sx-cta__inner{ position:relative; display:flex; flex-direction:column; align-items:center; }
.sx-cta h2{ color:#fff; max-width:20ch; font-size:clamp(1.875rem, 1.4rem + 2vw, 3rem); }
.sx-cta .lead{ margin-top:var(--s-2); color:var(--slate-300); max-width:36rem; }
.sx-cta .btn-row{ justify-content:center; }

/* ---------- Outras soluções ---------- */
.sx-others{ list-style:none; margin:0; padding:0; display:grid; gap:var(--s-2); }
@media (min-width:768px){ .sx-others{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-3); } }
@media (min-width:1024px){ .sx-others{ grid-template-columns:repeat(4, minmax(0,1fr)); } }
.sx-other{ position:relative; display:flex; flex-direction:column; height:100%; overflow:hidden; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink); text-decoration:none; transition:transform 300ms var(--ease), box-shadow 300ms var(--ease); }
.sx-other__img{ display:block; overflow:hidden; }
.sx-other__img img{ width:100%; aspect-ratio:16 / 10; object-fit:cover; border-radius:0; transition:transform 600ms var(--ease); }
.sx-other__body{ display:flex; flex-direction:column; gap:4px; padding:var(--s-3) var(--s-3) var(--s-5); }
.sx-other__name{ font:600 1.1875rem/1.3 var(--font-display); }
.sx-other__desc{ font-size:var(--fs-small); color:var(--text-3); }
.sx-other__arrow{ position:absolute; right:var(--s-3); bottom:var(--s-3); color:var(--gold-700); transition:transform 250ms var(--ease); }
.sx-other:hover{ color:var(--ink); }
@media (hover:hover) and (pointer:fine){
  .sx-other:hover{ transform:translateY(-4px); box-shadow:0 24px 40px -24px rgba(8,23,43,.35); }
  .sx-other:hover .sx-other__img img{ transform:scale(1.06); }
  .sx-other:hover .sx-other__arrow{ transform:translateX(4px); }
}

/* ---------- Menos movimento ---------- */
@media (prefers-reduced-motion: reduce){
  .border-beam, .sx-status .is-live::after{ animation:none; }
  .js .sx-hero__photo, .js .sx-float{ animation:none; }
  .js [data-text-animate] .ta-w, .js [data-hero-in]{ opacity:1; filter:none; transform:none; }
  .js .sx-statement__text .ta-w{ color:var(--ink); }
  .js .sx-checklist[data-reveal] .sx-check path{ stroke-dashoffset:0; }
  .js .sx-bento__cell[data-reveal] .vx-split__bar, .js .sx-bento__cell[data-reveal] .vx-gov .ico{ transform:none; }
  .beam-light{ display:none; }
}