@layer components{.cmp-topo{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(2rem,1.5rem + 2vw,3.5rem);display:flex}.cmp-topo .cabeca{margin-bottom:0}.cmp-alterna{border:1px solid var(--borda);background:var(--superficie);box-shadow:var(--sombra-1);border-radius:999px;gap:2px;padding:4px;display:none}@media (min-width:960px){.cmp-alterna:not([hidden]){display:inline-flex}}.cmp-alterna button{font:600 .8125rem / 1 var(--f-corpo);color:var(--texto-suave);cursor:pointer;min-height:36px;transition:background-color var(--dur-estado) var(--ease-padrao), color var(--dur-estado) var(--ease-padrao);background:0 0;border:0;border-radius:999px;padding:10px 16px}.cmp-alterna button:hover{color:var(--texto)}.cmp-alterna button[aria-pressed=true]{background:var(--tinta);color:var(--sobre-tinta)}.cmp{gap:24px;display:grid}@media (min-width:900px){.cmp{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}}.cmp-cartao{--cartao-fundo:var(--superficie);background:linear-gradient(var(--superficie), var(--superficie)) padding-box, linear-gradient(150deg, color-mix(in srgb, var(--tinta) 55%, transparent), color-mix(in srgb, var(--borda) 80%, transparent) 42%, color-mix(in srgb, var(--areia) 45%, transparent)) border-box;min-width:0;transition:transform var(--dur-revela) var(--ease-saida), box-shadow var(--dur-revela) var(--ease-padrao);align-content:start;gap:30px;padding:clamp(24px,3vw,40px);display:grid}.cmp-cartao.modelo-b{background:linear-gradient(var(--superficie), var(--superficie)) padding-box, linear-gradient(150deg, color-mix(in srgb, var(--areia) 70%, transparent), color-mix(in srgb, var(--borda) 80%, transparent) 42%, color-mix(in srgb, var(--tinta) 45%, transparent)) border-box}.cmp-cabeca{gap:12px;display:grid}.cmp-selo{font:500 var(--t-rotulo) / 1 var(--f-dados);letter-spacing:.1em;text-transform:uppercase;color:var(--areia-texto)}.cmp-titulo{font:500 clamp(2.5rem, 1.5rem + 3.2vw, 4.25rem) / 1 var(--f-display);color:var(--tinta-escura);letter-spacing:-.025em}.cmp-letra{font-family:var(--f-display-i);color:var(--tinta);transition:transform var(--dur-revela) var(--ease-mola), opacity var(--dur-estado) var(--ease-padrao);font-style:italic;display:inline-block}.modelo-b .cmp-letra{color:var(--areia-texto)}.cmp-atr{color:var(--texto);gap:4px;max-width:48ch;font-size:.9375rem;display:grid}.cmp-atr span{font:500 .6875rem / 1.3 var(--f-dados);letter-spacing:.08em;text-transform:uppercase;color:var(--texto-suave)}.fx{padding-top:4px;position:relative}.fx-lista{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid;position:relative}.fx-linha{width:calc(66.6667% + 6.66667px);height:2px;position:absolute;top:27px;left:calc(16.6667% - 3.33333px);overflow:visible}.fx-linha path{fill:none;stroke:var(--areia);stroke-width:2px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.2s var(--ease-saida) .1s}.fx-passo{text-align:center;align-content:start;justify-items:center;gap:6px;min-width:0;display:grid}.fx-no{z-index:1;width:48px;height:48px;transition:transform .7s var(--ease-mola) calc(var(--i,0) * .24s + .15s), opacity var(--dur-estado) var(--ease-padrao) calc(var(--i,0) * .24s + .15s);border-radius:50%;place-items:center;display:grid;position:relative}.fx-no svg{width:22px;height:22px}.fx-cli{background:var(--superficie);border:1.5px solid var(--tinta);color:var(--tinta)}.fx-atu{background:var(--tinta);color:var(--sobre-tinta);box-shadow:0 6px 16px -8px var(--tinta)}.fx-atn{background:var(--areia);color:#1a1204;box-shadow:0 6px 16px -8px var(--areia)}.fx-etapa{font:600 .875rem / 1.25 var(--f-corpo);color:var(--texto)}.fx-quem{color:var(--texto-suave);font-size:.8125rem;line-height:1.35}.fx-etapa,.fx-quem{transition:opacity var(--dur-revela) var(--ease-padrao) calc(var(--i,0) * .24s + .35s), transform var(--dur-revela) var(--ease-saida) calc(var(--i,0) * .24s + .35s)}.cmp-linhas{border-top:1px solid var(--borda);margin:0;display:grid}.cmp-linha{border-bottom:1px solid var(--borda);transition:opacity var(--dur-revela) var(--ease-padrao) calc(var(--i) * 80ms + .5s), transform var(--dur-revela) var(--ease-saida) calc(var(--i) * 80ms + .5s);grid-template-columns:minmax(7.5rem,1fr) minmax(0,2fr);gap:6px 16px;padding:14px 0;display:grid}.cmp-linha dt{font:500 .75rem / 1.5 var(--f-dados);letter-spacing:.06em;text-transform:uppercase;color:var(--texto-suave)}.cmp-linha dd{color:var(--texto);margin:0;font-size:.9375rem}@media (max-width:520px){.cmp-linha{grid-template-columns:1fr;gap:2px}.fx-quem{font-size:.75rem}.fx-no{width:42px;height:42px}.fx-linha{top:24px}}.cmp-rodape{gap:12px;margin-top:28px;display:grid}.cmp-legenda{color:var(--texto-suave);flex-wrap:wrap;align-items:center;gap:8px 20px;font-size:.8125rem;display:flex}.cmp-legenda span{align-items:center;gap:8px;display:inline-flex}.fx-no.mini{width:22px;height:22px;transition:none;display:inline-grid}.fx-no.mini svg{width:12px;height:12px}@media (min-width:900px){@supports (grid-template-rows:subgrid){.cmp{grid-template-rows:repeat(7,auto);row-gap:0}.cmp-cartao{grid-row:span 7;grid-template-rows:subgrid;gap:0}.cmp-cabeca,.fx{padding-bottom:30px}.cmp-linhas{display:contents}.cmp-linha:first-child{border-top:1px solid var(--borda)}}}.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .fx-linha path{stroke-dashoffset:1px}.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .fx-passo .fx-no{opacity:0;transform:scale(.3)}.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .fx-etapa,.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .fx-quem{opacity:0;transform:translateY(8px)}.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .cmp-linha{opacity:0;transform:translateY(16px)}.mo .cmp[data-pronto] .cmp-cartao:not(.visto) .cmp-letra{opacity:0;transform:translateY(18%)rotate(-6deg)}.cmp[data-destaque=a] .modelo-a,.cmp[data-destaque=b] .modelo-b{box-shadow:0 0 0 2px color-mix(in srgb, var(--tinta) 55%, transparent), var(--sombra-1);transform:translateY(-6px)}.cmp[data-destaque=b] .modelo-b{box-shadow:0 0 0 2px color-mix(in srgb, var(--areia) 65%, transparent), var(--sombra-1)}.cmp[data-destaque=a] .modelo-b,.cmp[data-destaque=b] .modelo-a{box-shadow:none;transform:scale(.975)}.cmp[data-destaque=a] .modelo-b .fx-passo .fx-no,.cmp[data-destaque=b] .modelo-a .fx-passo .fx-no,.cmp[data-destaque=a] .modelo-b .cmp-letra,.cmp[data-destaque=b] .modelo-a .cmp-letra{opacity:.4;transition-delay:0s}}
