/* CROWORDER — corvo (mascote vetorial; direção de arte em docs/design/corvo/variantes/final, pivôs no rationale.md).
   Carregado depois de landing.css. Três instâncias SVG inline (nav, hero e rodapé) e, com movimento, uma quarta criada
   pelo crow.js (o companheiro de rolagem, clone da instância do hero) usam os gradientes definidos uma vez em .crow-defs
   (ids crow-grad-*). Uma única linguagem de movimento, "o corvo pousa": gestos curtos com pausas, só transform/opacity,
   pivôs em unidades do viewBox 0 0 240 240 (transform-box:view-box). Sem JS, com movimento reduzido ou com
   ?progress/?showcase o corvo está pousado e parado: o grupo de voo (.crow-pose--fly) fica oculto. O JS só acrescenta
   classes (.is-flying, .is-perched, .is-landing, .is-appear, .is-blink, .is-tilt, .is-alert, .is-hop, .is-caw,
   .is-startle, .is-gone, .is-still; no companheiro .is-air) e propriedades custom (--crow-fx/--crow-fy da rota do voo,
   --crow-look/--crow-gx/--crow-gy do olhar que segue o ponteiro, --crow-left/--crow-top do poleiro do hero). */
.crow-defs{position:absolute;width:0;height:0;overflow:hidden}
.crow-mark{display:block;overflow:visible}
.crow-mark .crow-pose--perch,.crow-mark .crow-pose--fly,.crow-mark .crow-head,.crow-mark .crow-beak-low,.crow-mark .crow-wing-near,.crow-mark .crow-wing-far,.crow-mark .crow-tail,.crow-mark .crow-eyelid,.crow-light{transform-box:view-box}
.crow-pose--perch{transform-origin:112px 212px}
.crow-pose--perch .crow-head{transform-origin:98px 78px}
/* Bico inferior (grupo próprio em todas as instâncias): gira na base, junto à face, para o grasnar. */
.crow-pose--perch .crow-beak-low{transform-origin:60px 65px}
.crow-pose--perch .crow-wing-near{transform-origin:126px 86px}
.crow-pose--perch .crow-wing-far{transform-origin:152px 83px}
.crow-pose--perch .crow-tail{transform-origin:178px 146px}
.crow-pose--perch .crow-eyelid{transform:translate(78px,50.2px) scale(1,0)}
/* A pose de voo foi desenhada a 0,92 em torno de (120,120) e deslocada (−4,+4) para girar sem tocar o quadro;
   o grupo desfaz isso para as duas poses terem a mesma escala (o svg inline não recorta: overflow visible) e sobe
   16,8 un. (0,07 da altura), porque as pernas estendidas do voo descem abaixo dos pés do pousado: no fim do voo as
   pernas tocam a borda e a troca de pose (corte seco, sem cross-fade) não move nada. */
.crow-pose--fly{transform-origin:120px 120px;transform:translateY(-16.8px) scale(1.087) translate(4px,-4px);opacity:0}
.crow-pose--fly .crow-beak-low{transform-origin:62.6px 115.8px}
.crow-pose--fly .crow-wing-near{transform-origin:125.2px 129.5px}
.crow-pose--fly .crow-wing-far{transform-origin:123.4px 122.2px}
.crow-pose--fly .crow-tail{transform-origin:172px 186px}
/* Nav: marca de 28px antes do wordmark; no hover/foco do link a cabeça vira rápido (220 ms) e volta. É a única reação
   dela: o crow.js não a anima. */
.crow--nav{flex:none;width:28px;height:28px}
.wordmark:hover .crow--nav .crow-head,.wordmark:focus-visible .crow--nav .crow-head{animation:crow-turn .44s ease-in-out}
/* Hero: poleiro (.crow-perch) dentro da linha de marca do h1 (.hero-copy__line, FK Screamer), com os pés (112, 212 do
   viewBox) no topo da última letra de "VENDAS" e o bico para a esquerda, para o texto. Tudo em em da linha: o corvo
   (--crow-size) e a unidade da rota do voo (--u, 1/100 da fonte) escalam com o título. Sem JS a posição vem das
   medidas de FK Screamer (pés a --crow-glyph do fim da linha e --crow-cap abaixo do topo dela); com JS o crow.js mede
   a letra na fonte carregada e grava --crow-left/--crow-top (px), ou move o poleiro para a borda superior do botão do
   hero, ou o esconde (.is-hidden) quando ali ele cobriria texto. */
.crow-perch{--crow-size:.74em;--u:.01em;--crow-glyph:.166em;--crow-cap:.051em;position:absolute;left:var(--crow-left,calc(100% - var(--crow-glyph) - var(--crow-size)*.467));top:var(--crow-top,calc(var(--crow-cap) - var(--crow-size)*.883));width:var(--crow-size);height:var(--crow-size);line-height:0;pointer-events:none}
.crow-perch.is-hidden{visibility:hidden}
.crow--hero{width:100%;height:100%}
/* Sombra curta embaixo do corvo do hero: separa o azul dele do azul da cortina atrás. */
.crow-perch .crow-mark{filter:drop-shadow(0 8px 16px rgba(2,4,10,.7))}
html.js .hero-sequence.is-animated .crow--hero:not(.is-flying):not(.is-perched){opacity:0}
/* Voo (1,6 s): entra planando de fora da tela, pela direita, com três batidas de asa (384 ms cada, a partir de 0,32 s),
   empina para frear (flare) e pousa; a cauda abre 10° na última batida. A rota (keyframes crow-glide) parte do
   deslocamento (--crow-fx, --crow-fy) em unidades --u (1/100 da fonte do título), que o JS calcula a cada medida: fora
   da tela à direita e na altura mais alta (até 45 unidades acima do poleiro) cuja trajetória inteira passa com folga do
   texto do primeiro quadro, do botão e da nav; na reta final os pés só encostam no topo da letra. O easing está nas amostras (X cai cedo, Y cai tarde,
   velocidade contínua e zero no pouso), por isso a função de tempo é linear; o JS repete as mesmas frações.
   --crow-t/--crow-play (?crow=0..1 na prévia) congelam todas as animações do voo num ponto. */
.crow--hero{--crow-fx:70;--crow-fy:-12}
.crow--hero.is-flying{animation:crow-glide 1.6s linear both;animation-delay:calc(var(--crow-t,0)*-1.6s);animation-play-state:var(--crow-play,running)}
.crow--hero.is-flying .crow-pose--fly{opacity:1}
.crow--hero.is-flying .crow-pose--perch{opacity:0}
.crow--hero.is-flying .crow-pose--fly .crow-wing-near{animation:crow-flap-near .384s ease-in-out 3 both;animation-delay:calc(.32s + var(--crow-t,0)*-1.6s);animation-play-state:var(--crow-play,running)}
.crow--hero.is-flying .crow-pose--fly .crow-wing-far{animation:crow-flap-far .384s ease-in-out 3 both;animation-delay:calc(.32s + var(--crow-t,0)*-1.6s);animation-play-state:var(--crow-play,running)}
.crow--hero.is-flying .crow-pose--fly .crow-tail{animation:crow-tail-fly 1.6s ease-in-out both;animation-delay:calc(var(--crow-t,0)*-1.6s);animation-play-state:var(--crow-play,running)}
/* Enquanto o companheiro voa pela página, o corvo do hero e o do rodapé ficam ocultos no lugar (sem mudar o layout). */
.crow--hero.is-gone,.crow--footer.is-gone{visibility:hidden}
/* Pouso (~300 ms, .is-landing só durante ele): corte seco da pose de voo para a pousada, com a asa fechando de −32° e a
   cauda voltando de 10° (.is-appear: sem voo, quando a pessoa já rolou, a pose pousada surge em 140 ms); depois, idle
   (.is-perched): respiração 1→1,015 em 4 s com origem nos pés; piscar e inclinar a cabeça −8° (220 ms, pausa, volta) são
   classes do JS (transições). Vale para o hero, o companheiro e, no pouso final, o rodapé. */
.crow-mark.is-perched .crow-pose--perch{animation:crow-breathe 4s ease-in-out .4s infinite}
.crow-mark.is-perched.is-appear .crow-pose--perch{animation:crow-appear .14s ease-out both,crow-breathe 4s ease-in-out .4s infinite}
.crow-mark.is-landing .crow-pose--perch .crow-wing-near{animation:crow-fold .26s cubic-bezier(.22,.61,.36,1) both}
.crow-mark.is-landing .crow-pose--perch .crow-tail{animation:crow-settle .3s cubic-bezier(.22,.61,.36,1) both}
.crow-mark .crow-pose--perch .crow-head{rotate:var(--crow-look,0deg);transition:transform .22s cubic-bezier(.3,.7,.2,1)}
.crow-mark.is-tilt .crow-pose--perch .crow-head{transform:rotate(-8deg)}
.crow-mark .crow-pose--perch .crow-eyelid{transition:transform .09s ease-in-out}
.crow-mark.is-blink .crow-pose--perch .crow-eyelid{transform:translate(78px,50.2px) scale(1,1)}
/* Vivo ao ponteiro (hero, companheiro e rodapé, só com movimento). Olhar: a cabeça gira até −18°/+12° no pivô
   (propriedade rotate, somada à inclinação do idle) e o brilho do olho anda até 1,2 un. do viewBox na direção do
   cursor; o JS interpola os dois por quadro. Alerta (cursor a menos de 140 px): cabeça sobe e as asas levantam por
   250 ms. Pulinho (cursor por cima): sobe 6% da altura em 220 ms abrindo e fechando as asas uma vez. Grasnar (clique ou
   toque no corvo): o bico inferior abre 14° duas vezes (180 ms cada), com um pulinho. Susto (movimento brusco perto):
   dois passinhos para trás (para a direita, o corvo olha para a esquerda) e volta. */
.crow-mark .crow-pose--perch .crow-eye circle+circle{translate:var(--crow-gx,0px) var(--crow-gy,0px)}
.crow-mark.is-alert .crow-pose--perch .crow-head{transform:rotate(7deg)}
.crow-mark.is-alert .crow-pose--perch .crow-wing-near{animation:crow-lift .25s ease-out}
.crow-mark.is-alert .crow-pose--perch .crow-wing-far{animation:crow-lift-far .25s ease-out}
.crow-mark.is-hop{animation:crow-hop .22s cubic-bezier(.33,.66,.4,1)}
.crow-mark.is-hop .crow-pose--perch .crow-wing-near{animation:crow-hop-wing .22s ease-in-out}
.crow-mark.is-hop .crow-pose--perch .crow-wing-far{animation:crow-hop-far .22s ease-in-out}
.crow-mark.is-caw .crow-pose--perch .crow-beak-low{animation:crow-caw .36s ease-in-out}
.crow-mark.is-startle{animation:crow-startle .9s cubic-bezier(.3,.7,.4,1)}
/* .is-still desliga tudo, inclusive o pouso e as reações (capturas, ?crow=1, ?companion= e movimento reduzido ligado no
   meio da sessão): declarado depois das regras que ele anula, com a mesma especificidade delas. */
.crow-mark.is-still,.crow-mark.is-still.is-perched .crow-pose--perch,.crow-mark.is-still .crow-pose--perch [class]{animation:none}
/* Rodapé: corvo grande pousado sobre o fim do wordmark gigante (pés na linha das maiúsculas de Geist 900: topo das
   caixas-altas a 0,134em do topo da linha). O wordmark reserva a altura do corvo acima de si para ele não cobrir os
   links. Um plano de luz recortado pela silhueta (#crow-clip) percorre os planos a cada 9 s; parado com movimento
   reduzido. É também o último poleiro do companheiro (data-crow-perch="rodape dock"): ele pousa exatamente aqui e o
   corvo do rodapé reaparece no lugar. */
.footer-wordmark{--fh:clamp(160px,.88em,220px);position:relative;padding-top:calc(var(--fh)*.883 - .134em)}
.footer-wordmark>span{position:relative;display:inline-block}
.crow--footer{position:absolute;right:calc(.3em - var(--fh)*.533);bottom:calc(100% - .134em - var(--fh)*.117);width:var(--fh);height:var(--fh)}
.crow--footer .crow-light{transform:translateX(-90px);animation:crow-sheen 9s cubic-bezier(.45,0,.55,1) 1.5s infinite}
/* Companheiro de rolagem: um único svg (clone do hero) numa camada absoluta no topo do documento, recortada na altura do
   body (o JS mede): voar para fora da janela não cria rolagem nem muda o layout. A camada fica abaixo do CTA fixo do
   celular (40) e do header (50); o JS só escolhe poleiros que ficam entre os dois, longe de texto e de botões. O
   ponteiro atravessa a camada (pointer-events:none): as reações são calculadas pela geometria. Posição, giro e escala
   vão no transform do invólucro, com origem nos pés (112, 212 do viewBox); no ar ele mostra a pose de voo batendo as
   asas sem parar; .is-turning vira o corpo de volta para a esquerda (escala X) ao pousar. Tamanho: 90–120 px no
   computador, 44–56 px no celular. */
.crow-layer{position:absolute;top:0;left:0;z-index:30;width:100%;height:0;overflow:hidden;overflow:clip;pointer-events:none}
.crow-companion{--crow-s:clamp(90px,7.2vw,120px);position:absolute;top:0;left:0;width:var(--crow-s);height:var(--crow-s);transform-origin:46.667% 88.333%;visibility:hidden;will-change:transform}
.crow-companion.is-shown{visibility:visible}
.crow-companion.is-turning{transition:transform .2s cubic-bezier(.3,.7,.4,1)}
.crow--companion{width:100%;height:100%}
.crow--companion.is-air .crow-pose--fly{opacity:1}
.crow--companion.is-air .crow-pose--perch{opacity:0}
.crow--companion.is-air .crow-pose--fly .crow-wing-near{animation:crow-flap-near .3s ease-in-out infinite}
.crow--companion.is-air .crow-pose--fly .crow-wing-far{animation:crow-flap-far .3s ease-in-out infinite}
@keyframes crow-turn{50%{transform:rotate(-12deg)}}
@keyframes crow-glide{0%{transform:translate(calc(var(--crow-fx)*var(--u)),calc(var(--crow-fy)*var(--u))) rotate(-6deg)}10%{transform:translate(calc(var(--crow-fx)*.76*var(--u)),calc(var(--crow-fy)*var(--u))) rotate(-5deg)}20%{transform:translate(calc(var(--crow-fx)*.56*var(--u)),calc(var(--crow-fy)*var(--u))) rotate(-4deg)}30%{transform:translate(calc(var(--crow-fx)*.396*var(--u)),calc(var(--crow-fy)*var(--u))) rotate(-3deg)}40%{transform:translate(calc(var(--crow-fx)*.265*var(--u)),calc(var(--crow-fy)*.945*var(--u))) rotate(-2deg)}50%{transform:translate(calc(var(--crow-fx)*.165*var(--u)),calc(var(--crow-fy)*.802*var(--u))) rotate(-1deg)}60%{transform:translate(calc(var(--crow-fx)*.092*var(--u)),calc(var(--crow-fy)*.606*var(--u))) rotate(1deg)}70%{transform:translate(calc(var(--crow-fx)*.044*var(--u)),calc(var(--crow-fy)*.394*var(--u))) rotate(4deg)}80%{transform:translate(calc(var(--crow-fx)*.015*var(--u)),calc(var(--crow-fy)*.198*var(--u))) rotate(7deg)}90%{transform:translate(calc(var(--crow-fx)*.003*var(--u)),calc(var(--crow-fy)*.055*var(--u))) rotate(4deg)}100%{transform:translate(0,0) rotate(0)}}
@keyframes crow-flap-near{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(26deg)}}
@keyframes crow-flap-far{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-16deg)}}
@keyframes crow-tail-fly{0%,70%{transform:rotate(0)}82%,100%{transform:rotate(10deg)}}
@keyframes crow-appear{from{opacity:0}to{opacity:1}}
@keyframes crow-breathe{50%{transform:scale(1.015)}}
@keyframes crow-fold{from{transform:rotate(-32deg)}to{transform:rotate(0)}}
@keyframes crow-settle{from{transform:rotate(10deg)}to{transform:rotate(0)}}
@keyframes crow-sheen{0%{transform:translateX(-90px)}20%,100%{transform:translateX(360px)}}
@keyframes crow-lift{0%,100%{transform:rotate(0)}30%,70%{transform:rotate(-9deg)}}
@keyframes crow-lift-far{0%,100%{transform:rotate(0)}30%,70%{transform:rotate(-6deg)}}
@keyframes crow-hop{0%,100%{transform:translateY(0)}45%{transform:translateY(-6%)}}
@keyframes crow-hop-wing{0%,100%{transform:rotate(0)}45%{transform:rotate(-26deg)}}
@keyframes crow-hop-far{0%,100%{transform:rotate(0)}45%{transform:rotate(-14deg)}}
@keyframes crow-caw{0%,50%,100%{transform:rotate(0)}22%,72%{transform:rotate(-14deg)}}
@keyframes crow-startle{0%,100%{transform:translate(0,0)}12%{transform:translate(3.5%,-4%)}22%{transform:translate(5%,0)}36%{transform:translate(8.5%,-4%)}46%,70%{transform:translate(10%,0)}84%{transform:translate(5%,-2.5%)}}

/* Tablets e telas médias: rodapé com corvo a partir de 120 px. */
@media (max-width:1199.98px){
  .footer-wordmark{--fh:clamp(120px,.88em,220px)}
}
@media (max-width:809.98px){
  /* No celular o título ocupa a largura toda e o corvo do hero fica logo abaixo do eyebrow: sem JS (sem guarda) ele
     não aparece; com JS ele pousa onde a guarda confirma que não cobre texto. */
  html:not(.js) .crow-perch{display:none}
  /* Corvo do rodapé a 96px, pousado no fim da palavra como no desktop (pés .3em antes do fim do R); abaixo de 600px
     ele ancora na borda da faixa (regra seguinte). */
  .footer-wordmark{--fh:96px}
  .crow-companion{--crow-s:clamp(44px,13vw,56px)}
}
/* Abaixo de 600px o corvo do hero fica proporcionalmente maior (o título tem 48–90px). A palavra do rodapé (14vw)
   ocupa quase toda a largura e a cauda do corvo estouraria a faixa: ele ancora na borda direita do bloco, e os pés
   continuam sobre o R (feet − fim da palavra = 0,146 × largura − 91 px). */
@media (max-width:599.98px){
  .footer-wordmark>span{position:static}
  .crow--footer{right:0;bottom:calc(28px + .866em - var(--fh)*.117)}
  .crow-perch{--crow-size:.92em}
}
/* Telas baixas (celulares deitados): o título encosta no header e o corvo cobriria a nav. Com JS a guarda mede e
   esconde; sem JS ele some. */
@media (max-height:599.98px){
  html:not(.js) .crow-perch{display:none}
}