.hero-bg{-webkit-mask-image:linear-gradient(#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(#000 calc(100% - 3rem),transparent)}.hero-bg-veil{background:radial-gradient(22rem 11rem at 50% 14rem,color-mix(in srgb,var(--color-black) 82%,transparent),transparent 100%)}@media (width >= 768px){.hero-bg-veil{background:radial-gradient(56rem 17rem at 50% 14.5rem,color-mix(in srgb,var(--color-black) 82%,transparent),transparent 100%)}}.hero-bg-bounds{-webkit-mask-image:linear-gradient(transparent,#000 10% 80%,transparent);mask-image:linear-gradient(transparent,#000 10% 80%,transparent)}#essayer{scroll-margin-top:6rem}@keyframes xelvid-card-in{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:no-preference){.hero-card-in{animation:xelvid-card-in .6s var(--ease-smooth) .15s both}}@keyframes xelvid-hero-drift{to{transform:translateY(-2.5rem);opacity:.24}}@keyframes xelvid-heading-in{0%{opacity:0;transform:translateY(1.5rem)}to{opacity:1;transform:none}}@keyframes xelvid-heading-in-blur{0%{opacity:0;transform:translateY(1.5rem);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}@supports (animation-timeline:scroll()){@media (prefers-reduced-motion:no-preference){.heading-in{animation:xelvid-heading-in linear both;animation-timeline:view();animation-range:entry 0 cover 30%}@media (width >= 768px){.hero-drift{animation:xelvid-hero-drift linear both;animation-timeline:scroll(root block);animation-range:0 55vh}.heading-in{animation-name:xelvid-heading-in-blur}}}}