/* FeelMakers — estilos
 *
 * Regra de proporção: no desktop (900px+), tudo é medido em "--u",
 * que vale 1/1096 da largura da tela (a composição aprovada na prévia).
 * Cada seção escala por inteiro,
 * como um vídeo: a composição é a mesma em qualquer monitor ou janela.
 * Abaixo de 900px, --u vale 1px e entram os layouts de tablet e celular.
 */
:root {
	--accent: #DFF23D;
	--ink: #0B0B0B;
	--paper: #F2EFE8;
	--muted: #9A978F;
	--soft: #C9C5BC;
	--line: #1F1F1D;
	--u: min(calc(100vw / 1096), 2px);
	--gutter: calc(48 * var(--u));
	--f-sans: 'Archivo', system-ui, sans-serif;
	--f-mono: 'JetBrains Mono', ui-monospace, monospace;
	--f-marker: 'Permanent Marker', cursive;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body.fm { margin: 0; background: var(--ink); color: var(--paper); font-family: var(--f-sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.fm a { color: var(--paper); text-decoration: none; }
.fm a:hover { color: var(--accent); }
.fm img, .fm video { display: block; }
.fm p { margin: 0; }

/* ---------- Estrutura comum ---------- */
.fm-sec { position: relative; aspect-ratio: 16 / 9; display: flex; align-items: center; }
.fm-pad { padding: calc(96 * var(--u)) var(--gutter); }
.fm-wrap { position: relative; width: 100%; max-width: calc(1320 * var(--u)); margin: 0 auto; }
.fm-bg { position: absolute; inset: 0; overflow: hidden; }
.fm-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fm-parallax { inset: -15% 0; height: 130%; will-change: transform; }
.fm-label { font-family: var(--f-mono); font-size: calc(12 * var(--u)); letter-spacing: 0.2em; }
.fm-h { margin: 0; font-weight: 800; font-stretch: 68%; line-height: 0.88; text-transform: uppercase; }
.fm-marker { font-family: var(--f-marker); }

/* Círculo a marcador (*palavra*): contido na própria linha */
.fm-circle { position: relative; display: inline-block; padding: 0 0.12em; }
.fm-circle__svg { position: absolute; left: -6%; top: 2%; width: 112%; height: 100%; overflow: visible; color: var(--circle, var(--accent)); pointer-events: none; }

/* ---------- 1. Reel ---------- */
.fm-hero { flex-direction: column; align-items: stretch; overflow: hidden; background: #141413; }
.fm-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fm-hero__shade { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(11,11,11,.45) 0%, rgba(11,11,11,0) 22%, rgba(11,11,11,0) 70%, rgba(11,11,11,.45) 100%); }
.fm-br { position: absolute; width: calc(44 * var(--u)); height: calc(44 * var(--u)); border: 0 solid var(--accent); z-index: 1; }
.fm-br--tl { top: calc(140 * var(--u)); left: var(--gutter); border-top-width: 2px; border-left-width: 2px; }
.fm-br--tr { top: calc(140 * var(--u)); right: var(--gutter); border-top-width: 2px; border-right-width: 2px; }
.fm-br--bl { bottom: calc(48 * var(--u)); left: var(--gutter); border-bottom-width: 2px; border-left-width: 2px; }
.fm-br--br { bottom: calc(48 * var(--u)); right: var(--gutter); border-bottom-width: 2px; border-right-width: 2px; }

.fm-hdr { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: calc(20 * var(--u)) calc(40 * var(--u)); padding: calc(24 * var(--u)) var(--gutter); }
.fm-logo { height: calc(84 * var(--u)); width: auto; }
.fm-nav { display: flex; align-items: center; gap: calc(8 * var(--u)) calc(36 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.fm-nav > a { padding: calc(12 * var(--u)) 0; }
.fm-lang { display: inline-flex; align-items: center; gap: 4px; font-family: var(--f-mono); font-size: calc(12 * var(--u)); font-weight: 400; }
.fm-lang a, .fm-lang span { padding: calc(12 * var(--u)) 4px; }
.fm-lang a { color: var(--muted); }
.fm-lang .is-active { color: var(--accent); }
.fm-lang__sep { color: #5E5B55; padding: 0 !important; }

.fm-heroinfo { position: relative; z-index: 2; margin-top: auto; padding: 0 calc(112 * var(--u)) calc(72 * var(--u)); display: flex; align-items: center; justify-content: space-between; gap: 16px; font-family: var(--f-mono); font-size: calc(12 * var(--u)); letter-spacing: 0.18em; color: var(--soft); }
.fm-rec { display: inline-flex; align-items: center; gap: calc(10 * var(--u)); color: var(--accent); }
.fm-rec__dot { width: calc(8 * var(--u)); height: calc(8 * var(--u)); border-radius: 50%; background: var(--accent); animation: fm-blink 1.2s steps(1) infinite; }
.fm-rec__tc { color: var(--soft); margin-left: 6px; font-variant-numeric: tabular-nums; }
.fm .fm-heroinfo__cue { color: var(--soft); padding: calc(12 * var(--u)) 0; }
@keyframes fm-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .fm-rec__dot { animation: none; } }

/* ---------- 2. Manifesto ---------- */
.fm-man { border-top: 1px solid var(--line); background: #1A1A18; }
.fm-man__shade { position: absolute; inset: 0; background: rgba(11,11,11,0.62); }
.fm-man__grid { display: flex; flex-direction: column; gap: calc(60 * var(--u)); }
.fm-man__left { min-width: 0; display: flex; flex-direction: column; gap: calc(36 * var(--u)); }
.fm-man__left .fm-label { color: var(--accent); }
.fm-man__title { font-size: calc(72 * var(--u)); }
.fm-man__right { min-width: 0; display: flex; flex-direction: column; gap: calc(22 * var(--u)); font-size: calc(20 * var(--u)); line-height: 1.55; color: #D6D2C9; }
.fm-punch { margin-top: calc(12 * var(--u)) !important; font-size: calc(26 * var(--u)); font-weight: 800; font-stretch: 80%; line-height: 1.25; text-transform: uppercase; color: var(--paper); }
.fm-punch mark { background: linear-gradient(var(--accent), var(--accent)) no-repeat left center / 100% 100%; color: var(--ink); padding: 0 calc(10 * var(--u)); white-space: nowrap; }
.fm-timeline { position: absolute; left: var(--gutter); right: var(--gutter); bottom: calc(32 * var(--u)); display: flex; align-items: center; gap: calc(16 * var(--u)); font-family: var(--f-mono); font-size: calc(11 * var(--u)); letter-spacing: 0.14em; color: var(--muted); }
.fm-timeline__bar { position: relative; flex: 1 1 auto; height: 2px; background: #34332F; }
.fm-timeline__fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--accent); }
.fm-timeline__fill::after { content: ''; position: absolute; right: -1px; top: -5px; width: 2px; height: 12px; background: var(--accent); }

/* ---------- 3. Light. Fast. Real. ---------- */
.fm-lfr { justify-content: flex-end; background: var(--accent); color: var(--ink); --circle: #fff; }
.fm-duotone .fm-cover { filter: grayscale(1) contrast(1.15) brightness(1.05); mix-blend-mode: multiply; opacity: 0.55; }
.fm-spark { position: absolute; z-index: 1; }
.fm-spark--plus { width: calc(40 * var(--u)); height: calc(40 * var(--u)); top: 22%; left: 38%; }
.fm-spark--x { width: calc(26 * var(--u)); height: calc(26 * var(--u)); bottom: 24%; left: 52%; }
.fm-lfr__tag { position: absolute; left: var(--gutter); bottom: calc(40 * var(--u)); font-family: var(--f-mono); font-size: calc(12 * var(--u)); letter-spacing: 0.2em; }
.fm-lfr__inner { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: calc(36 * var(--u)); padding-right: calc(110 * var(--u)); }
.fm-lfr__title { font-family: var(--f-marker); font-size: calc(99 * var(--u)); line-height: 0.95; transform: rotate(-6deg); transform-origin: left top; }
.fm-lfr__title .fm-circle__svg { left: -14%; top: -4%; width: 128%; height: 112%; }
.fm-lfr__list { display: flex; align-items: flex-start; gap: calc(16 * var(--u)); padding-left: calc(16 * var(--u)); }
.fm-lfr__list svg { width: calc(64 * var(--u)); height: auto; }
.fm-lfr__list > span { display: flex; flex-direction: column; gap: calc(6 * var(--u)); font-size: calc(22 * var(--u)); line-height: 1.3; }
.fm-u { background: linear-gradient(#fff, #fff) no-repeat left bottom / 100% 3px; padding-bottom: 3px; }

/* ---------- 4. Filmes (a única seção que rola) ---------- */
.fm-films { border-top: 1px solid var(--line); padding-top: calc(120 * var(--u)); padding-bottom: calc(130 * var(--u)); }
.fm-films__head { display: flex; align-items: flex-end; justify-content: space-between; gap: calc(24 * var(--u)); margin-bottom: calc(64 * var(--u)); }
.fm-films__titles { display: flex; align-items: flex-end; gap: calc(8 * var(--u)) calc(28 * var(--u)); }
.fm-films__title { font-size: calc(88 * var(--u)); line-height: 0.85; }
.fm-films__marker { font-size: calc(30 * var(--u)); line-height: 1; color: var(--accent); transform: rotate(-5deg); padding-bottom: calc(10 * var(--u)); }
.fm-films__all { display: inline-flex; align-items: center; gap: calc(10 * var(--u)); min-height: 44px; font-size: calc(14 * var(--u)); font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.fm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(64 * var(--u)) calc(32 * var(--u)); }
.fm-film { display: flex; flex-direction: column; gap: calc(18 * var(--u)); }
.fm-film__frame { position: relative; aspect-ratio: 16 / 9; background: #161615; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.fm-film__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .4s; filter: saturate(.9); }
.fm-film:hover .fm-film__frame img { transform: scale(1.04); filter: saturate(1.05); }
.fm-film__corner { position: absolute; width: calc(22 * var(--u)); height: calc(22 * var(--u)); border: 0 solid var(--accent); z-index: 1; }
.fm-film__corner--tl { top: calc(14 * var(--u)); left: calc(14 * var(--u)); border-top-width: 2px; border-left-width: 2px; }
.fm-film__corner--br { bottom: calc(14 * var(--u)); right: calc(14 * var(--u)); border-bottom-width: 2px; border-right-width: 2px; }
.fm-film__code { position: absolute; top: calc(18 * var(--u)); right: calc(20 * var(--u)); z-index: 1; font-family: var(--f-mono); font-size: calc(11 * var(--u)); letter-spacing: 0.16em; color: rgba(242,239,232,.75); text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.fm-film__play { position: relative; z-index: 1; width: calc(64 * var(--u)); height: calc(64 * var(--u)); border-radius: 50%; border: 1.5px solid var(--accent); display: flex; align-items: center; justify-content: center; color: var(--paper); background: rgba(11,11,11,.25); opacity: 0; transform: scale(.9); transition: opacity .3s, transform .3s; }
.fm-film:hover .fm-film__play, .fm-film:focus-visible .fm-film__play { opacity: 1; transform: scale(1); }
.fm-film__meta { display: flex; justify-content: space-between; align-items: baseline; gap: calc(16 * var(--u)); padding-top: calc(12 * var(--u)); border-top: 1px solid #2A2A27; }
.fm-film__title { font-size: calc(28 * var(--u)); font-weight: 800; font-stretch: 72%; text-transform: uppercase; line-height: 1.1; }
.fm-film__info { font-family: var(--f-mono); font-size: calc(12 * var(--u)); letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.fm .fm-film:hover { color: var(--paper); }
.fm-empty { font-family: var(--f-mono); font-size: 13px; color: var(--muted); }
.fm-empty a { color: var(--accent) !important; }

/* ---------- 5. Contato ---------- */
.fm-contact { background: var(--accent); color: var(--ink); padding-top: calc(72 * var(--u)); padding-bottom: calc(72 * var(--u)); --circle: var(--ink); }
.fm-contact__inner { display: flex; flex-direction: column; gap: calc(48 * var(--u)); }
.fm-contact__head { display: flex; align-items: flex-end; justify-content: space-between; gap: calc(20 * var(--u)) calc(40 * var(--u)); }
.fm-contact__title { font-weight: 900; font-stretch: 62%; line-height: 0.8; letter-spacing: -0.015em; font-size: calc(181 * var(--u)); }
.fm-contact__note { margin: 0 0 calc(24 * var(--u)) !important; max-width: calc(320 * var(--u)); font-size: calc(30 * var(--u)); line-height: 1.15; transform: rotate(-5deg); }
.fm-contact__items { display: flex; flex-wrap: wrap; gap: 0 calc(32 * var(--u)); }
.fm-ci { flex: 1 1 calc(200 * var(--u)); min-width: 0; display: flex; flex-direction: column; gap: calc(8 * var(--u)); padding: calc(16 * var(--u)) 4px; border-top: 2px solid var(--ink); }
.fm-ci--base { flex-basis: 100%; }
.fm .fm-contact a.fm-ci, .fm .fm-contact a.fm-ci:hover { color: var(--ink); }
.fm-contact a.fm-ci:hover { background: rgba(11,11,11,0.06); }
.fm-ci__label { font-family: var(--f-mono); font-size: calc(11 * var(--u)); letter-spacing: 0.2em; }
.fm-ci__value { font-size: calc(22 * var(--u)); font-weight: 800; font-stretch: 80%; line-height: 1.15; overflow-wrap: anywhere; }

/* ---------- Rodapé ---------- */
.fm-foot { padding: calc(36 * var(--u)) var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 24px; font-family: var(--f-mono); font-size: calc(12 * var(--u)); letter-spacing: 0.14em; color: var(--muted); }
.fm-foot__logo .fm-logo { height: calc(48 * var(--u)); }

/* ---------- Player (modal) ---------- */
.fm-modal { position: fixed; inset: 0; z-index: 100; background: rgba(11,11,11,0.94); display: flex; align-items: center; justify-content: center; padding: 64px 48px; }
.fm-modal[hidden] { display: none; }
.fm-modal__frame { width: 100%; max-width: 1280px; aspect-ratio: 16 / 9; max-height: 100%; background: #000; }
.fm-modal__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.fm-modal__close { position: absolute; top: 20px; right: 20px; width: 48px; height: 48px; border: 0; border-radius: 50%; background: transparent; color: var(--paper); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.fm-modal__close:hover { color: var(--accent); }

/* Foco visível */
.fm a:focus-visible, .fm button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.fm-contact a:focus-visible, .fm-lfr a:focus-visible { outline-color: var(--ink); }

/* ---------- Tablet (641–899px): layouts empilhados, medidas em px ---------- */
@media (max-width: 899px) {
	:root { --u: 1px; --gutter: 32px; }
	.fm-sec:not(.fm-hero) { aspect-ratio: auto; min-height: 56.25vw; }
	.fm-hero { min-height: 520px; }
	.fm-hdr, .fm-nav, .fm-heroinfo, .fm-man__grid, .fm-films__head, .fm-films__titles, .fm-contact__head, .fm-contact__items, .fm-foot { flex-wrap: wrap; }
	.fm-heroinfo { padding: 0 64px 56px; }
	.fm-man__title { font-size: clamp(52px, 8vw, 96px); }
	.fm-lfr__title { font-size: clamp(72px, 12vw, 120px); }
	.fm-films__title { font-size: clamp(64px, 11vw, 110px); }
	.fm-contact__title { font-size: clamp(88px, 20vw, 180px); }
	.fm-ci { flex: 1 1 220px; }
}

/* ---------- Celular (até 640px): 16:9 vira 9:16 ---------- */
@media (max-width: 640px) {
	:root { --gutter: 20px; }
	.fm-hero { aspect-ratio: 9 / 16; min-height: 560px; }
	.fm-sec:not(.fm-hero) { min-height: 177.78vw; }
	.fm-pad { padding: 80px var(--gutter); }
	.fm-hdr { padding: 16px var(--gutter); gap: 6px 20px; }
	.fm-nav { gap: 2px 18px; font-size: 12px; }
	.fm-logo { height: 56px; }
	.fm-heroinfo { padding: 0 28px 36px; }
	.fm-br--tl, .fm-br--tr { top: 118px; }
	.fm-br--tl, .fm-br--bl { left: 16px; }
	.fm-br--tr, .fm-br--br { right: 16px; }
	.fm-br--bl, .fm-br--br { bottom: 16px; }
	.fm-man__title { font-size: 46px; }
	.fm-man__right { font-size: 18px; }
	.fm-punch { font-size: 26px; }
	.fm-lfr { justify-content: flex-start; }
	.fm-lfr__inner { padding-right: 0; }
	.fm-lfr__title { font-size: 76px; }
	.fm-lfr__tag { bottom: 28px; }
	.fm-films__title { font-size: 64px; }
	.fm-grid { grid-template-columns: minmax(0, 1fr); }
	.fm-film__play { opacity: 1; transform: none; }
	.fm-contact__title { font-size: 76px; }
	.fm-modal { padding: 64px 0; }
	.fm-timeline { display: none; }
}

/* =====================================================================
   Animações (v1.2)
   Só entram quando o JavaScript marca <html class="fm-anim">.
   Sem JavaScript, ou com "reduzir movimento" ligado no sistema,
   tudo aparece parado e completo.
   Cada seção ganha a classe .is-in quando entra na tela.

   Mecânica dos títulos: palavra por palavra. Cada palavra surge
   desfocada, um pouco abaixo, e se assenta com desaceleração longa.
   Ritmo: --w-dur (duração de cada palavra) e --w-stag (intervalo entre palavras).
   ===================================================================== */
:root {
	--ease-settle: cubic-bezier(.22, 1, .36, 1);
	--ease-fade: cubic-bezier(.4, 0, .2, 1);
	--ease-io: cubic-bezier(.65, 0, .35, 1);
	--w-dur: 1.25s;
	--w-stag: .09s;
	--fade-dur: 1.6s;
}
.fm-line, .fm-line__in { display: block; }
.fm-w { display: inline-block; }

/* Palavras: sobem poucos pixels, ganham nitidez e opacidade */
.fm-anim .fm-w {
	opacity: 0;
	filter: blur(10px);
	transform: translate3d(0, .3em, 0);
	transition:
		transform var(--w-dur) var(--ease-settle),
		filter calc(var(--w-dur) * .9) var(--ease-settle),
		opacity calc(var(--w-dur) * .8) var(--ease-fade);
	transition-delay: calc(var(--line-d, 0s) + var(--w, 0) * var(--w-stag));
	will-change: transform, filter, opacity;
}
.fm-anim .is-in .fm-w { opacity: 1; filter: blur(0); transform: none; }

/* Blocos de texto de apoio: fade macio com leve subida */
.fm-anim [data-reveal], .fm-anim [data-reveal-self] {
	opacity: 0;
	filter: blur(6px);
	transform: translateY(calc(10 * var(--u)));
	transition: opacity var(--fade-dur) var(--ease-fade), transform var(--fade-dur) var(--ease-settle), filter var(--fade-dur) var(--ease-settle);
	transition-delay: var(--d, 0s);
}
.fm-anim .is-in [data-reveal], .fm-anim [data-reveal-self].is-in { opacity: 1; filter: blur(0); transform: none; }

/* Círculo a marcador: começa só depois que a palavra dele se assentou */
.fm-anim .fm-circle__svg path {
	stroke-dasharray: 1; stroke-dashoffset: 1;
	transition: stroke-dashoffset 1.6s var(--ease-io);
	transition-delay: calc(var(--line-d, 0s) + var(--w, 0) * var(--w-stag) + var(--w-dur) * .75);
}
.fm-anim .is-in .fm-circle__svg path { stroke-dashoffset: 0; }

/* "O craft fica.": o texto aparece e depois a faixa amarela se forma da esquerda para a direita */
.fm-anim .fm-punch mark {
	background-size: 0% 100%;
	color: var(--paper);
	transition: background-size 1.3s var(--ease-io) 3.1s, color .6s var(--ease-fade) 3.6s;
}
.fm-anim .is-in .fm-punch mark { background-size: 100% 100%; color: var(--ink); }

/* Reset instantâneo (usado para repetir as animações) */
.fm-anim.fm-reset *, .fm-anim.fm-reset *::before, .fm-anim.fm-reset *::after { transition: none !important; animation: none !important; }

/* ---------- Reel: a interface "liga" ao carregar ---------- */
.fm-anim .fm-hdr, .fm-anim .fm-heroinfo { opacity: 0; transition: opacity 1.6s var(--ease-fade) .4s, transform 1.8s var(--ease-settle) .4s; }
.fm-anim .fm-hdr { transform: translateY(calc(-8 * var(--u))); }
.fm-anim .fm-heroinfo { transform: translateY(calc(8 * var(--u))); transition-delay: .75s; }
.fm-anim .fm-hero.is-in .fm-hdr, .fm-anim .fm-hero.is-in .fm-heroinfo { opacity: 1; transform: none; }
.fm-anim .fm-br { opacity: 0; transition: transform 2s var(--ease-settle), opacity 1.2s var(--ease-fade); }
.fm-anim .fm-br--tl { transform: translate(-12px, -12px); }
.fm-anim .fm-br--tr { transform: translate(12px, -12px); }
.fm-anim .fm-br--bl { transform: translate(-12px, 12px); }
.fm-anim .fm-br--br { transform: translate(12px, 12px); }
.fm-anim .fm-hero.is-in .fm-br { opacity: 1; transform: none; }

/* ---------- Manifesto ---------- */
.fm-man { --line-d: .4s; }
.fm-anim .fm-timeline { opacity: 0; transition: opacity 1.6s var(--ease-fade) 2.2s; }
.fm-anim .fm-man.is-in .fm-timeline { opacity: 1; }

/* ---------- Light. Fast. Real. ---------- */
.fm-lfr { --line-d: .3s; --w-stag: .2s; --w-dur: 1.4s; }
/* Círculo do "Fast." em loop: forma, segura, some e forma de novo */
.fm-anim .fm-lfr.is-in .fm-lfr__title .fm-circle__svg path { transition: none; animation: fm-circle-loop 7.5s var(--ease-io) 1.6s infinite both; }
@keyframes fm-circle-loop {
	0%   { stroke-dashoffset: 1; opacity: 1; }
	22%  { stroke-dashoffset: 0; opacity: 1; }
	80%  { stroke-dashoffset: 0; opacity: 1; }
	90%  { stroke-dashoffset: 0; opacity: 0; }
	91%  { stroke-dashoffset: 1; opacity: 0; }
	100% { stroke-dashoffset: 1; opacity: 1; }
}
/* Seta se desenha; itens e sublinhados entram um após o outro */
.fm-anim .fm-arrow path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s var(--ease-io) 1.5s; }
.fm-anim .fm-arrow path + path { transition-delay: 2.6s; transition-duration: .6s; }
.fm-anim .fm-lfr.is-in .fm-arrow path { stroke-dashoffset: 0; }
.fm-anim .fm-lfr__item { opacity: 0; filter: blur(6px); transform: translateY(calc(8 * var(--u))); transition: opacity 1.2s var(--ease-fade), transform 1.4s var(--ease-settle), filter 1.2s var(--ease-settle); transition-delay: calc(2s + var(--k, 0) * .22s); }
.fm-anim .fm-lfr.is-in .fm-lfr__item { opacity: 1; filter: blur(0); transform: none; }
.fm-anim .fm-u { background-size: 0% 3px; transition: background-size 1s var(--ease-io); transition-delay: calc(2.5s + var(--k, 0) * .22s); }
.fm-anim .fm-lfr.is-in .fm-u { background-size: 100% 3px; }
/* Faíscas: o "+" gira devagar e o "×" pulsa */
.fm-anim .fm-lfr.is-in .fm-spark--plus { animation: fm-spin 11s var(--ease-io) infinite; }
.fm-anim .fm-lfr.is-in .fm-spark--x { animation: fm-pulse 4.2s var(--ease-io) infinite; }
@keyframes fm-spin { 0%, 70% { transform: rotate(0); } 100% { transform: rotate(180deg); } }
@keyframes fm-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(.7); opacity: .55; } }

/* ---------- Filmes ---------- */
.fm-films { --line-d: .1s; }
.fm-anim .fm-films__all { opacity: 0; transition: opacity 1.4s var(--ease-fade) 1.1s; }
.fm-anim .fm-films.is-in .fm-films__all { opacity: 1; }

/* ---------- Contato ---------- */
.fm-contact { --line-d: .2s; --w-stag: .14s; }
.fm-contact__note { --w-stag: .1s; }
.fm-anim .fm-ci { border-top-color: transparent; background-image: linear-gradient(var(--ink), var(--ink)); background-repeat: no-repeat; background-position: left top; background-size: 0% 2px; opacity: .001; transition: background-size 1.4s var(--ease-io), opacity 1.2s var(--ease-fade); }
.fm-anim .fm-ci:nth-child(1) { transition-delay: 1.9s; }
.fm-anim .fm-ci:nth-child(2) { transition-delay: 2.1s; }
.fm-anim .fm-ci:nth-child(3) { transition-delay: 2.3s; }
.fm-anim .fm-ci:nth-child(4) { transition-delay: 2.5s; }
.fm-anim .fm-contact.is-in .fm-ci { background-size: 100% 2px; opacity: 1; }
.fm-anim .fm-contact a.fm-ci:hover { background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(rgba(11,11,11,.06), rgba(11,11,11,.06)); background-size: 100% 2px, 100% 100%; }
