@font-face{font-family:LfSerif;src:url('hero-serif.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:LfSerif;src:url('hero-serif-italic.woff2') format('woff2');font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:LfSans;src:url('hero-sans.woff2') format('woff2');font-weight:100 900;font-display:swap}
.lf{background:var(--hv-bg,#fafaf9);padding:clamp(48px,6vw,112px) 0}
.lf-frame{position:relative;overflow:hidden;isolation:isolate;margin:0 clamp(12px,2.9vw,52px);border-radius:8px;background:#0a0a0a;color:#f2efe9;height:clamp(560px,52vw,900px);display:grid;place-items:center}
.lf-stage{position:absolute;inset:-30% -35%;perspective:2200px;z-index:0}
.lf-plane{position:absolute;inset:0;display:flex;justify-content:center;gap:28px;transform:rotateX(34deg) rotateZ(-24deg) scale(1.05);transform-origin:50% 50%}
.lf-col{flex:0 0 clamp(420px,34vw,640px);overflow:visible}
.lf-track{display:flex;flex-direction:column;gap:28px;animation:lf-up 120s linear infinite;will-change:transform}
.lf-col:nth-child(even) .lf-track{animation-name:lf-down;animation-duration:140s}
.lf-col:nth-child(3) .lf-track{animation-duration:105s}
.lf-track img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(255,255,255,.07);box-shadow:0 30px 60px rgba(0,0,0,.55);background:#141414}
@keyframes lf-up{from{transform:translateY(0)}to{transform:translateY(calc(-50% - 14px))}}
@keyframes lf-down{from{transform:translateY(calc(-50% - 14px))}to{transform:translateY(0)}}
.lf:not(.is-running) .lf-track{animation-play-state:paused}
.lf-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
 background:
  radial-gradient(ellipse 46% 40% at 50% 50%,rgba(8,8,8,.62) 0%,rgba(8,8,8,.3) 60%,rgba(8,8,8,0) 100%),
  linear-gradient(180deg,#0a0a0a 0%,rgba(10,10,10,.35) 18%,rgba(10,10,10,.35) 82%,#0a0a0a 100%),
  linear-gradient(90deg,rgba(10,10,10,.75) 0%,rgba(10,10,10,0) 22%,rgba(10,10,10,0) 78%,rgba(10,10,10,.75) 100%),
  rgba(10,10,10,.26)}
.lf-title{position:relative;z-index:2;margin:0;text-align:center;font:700 clamp(44px,6.2vw,104px)/.98 LfSans,var(--sans);letter-spacing:-.04em;font-synthesis:none;color:#f2efe9;text-shadow:0 2px 40px rgba(0,0,0,.6)}
.lf-title span,.lf-title em{display:block}
.lf-title em{font:600 clamp(12px,.95vw,15px)/1 LfSans,var(--sans);font-style:normal;text-transform:uppercase;letter-spacing:.22em;color:rgba(242,239,233,.72);margin-bottom:clamp(16px,1.6vw,26px)}
.lf-title>*{opacity:0;transform:translateY(18px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.lf-title span{transition-delay:.18s}
.lf.is-seen .lf-title>*{opacity:1;transform:none}
@media (max-width:760px){
 .lf-frame{height:clamp(480px,128vw,620px)}
 .lf-title{font-size:clamp(34px,10.4vw,48px);padding:0 20px}
 .lf-title em{font-size:11px;letter-spacing:.2em}
 .lf-stage{inset:-40% -90%}
 .lf-plane{gap:16px}.lf-track{gap:16px}
 .lf-col{flex-basis:300px}
 @keyframes lf-up{to{transform:translateY(calc(-50% - 8px))}}
 @keyframes lf-down{from{transform:translateY(calc(-50% - 8px))}}
}
@media (prefers-reduced-motion:reduce){.lf-track{animation:none!important}.lf-title>*{transition:none}}
