:root {
  --lp-ease: cubic-bezier(.22, 1, .36, 1);
  --lp-metal: #d4dcc0;
  --lp-night: #101110;
}

.lp-intro {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 24px;
  border: 0;
  background: radial-gradient(ellipse at 50% 64%, #33392c 0%, #171a15 40%, #0c0d0c 75%);
  color: #fff;
  overflow: hidden;
}
.lp-intro[open] { display: grid; place-items: center; }
.lp-intro::backdrop { background: #0c0d0c; }
.lp-intro__facets { position: absolute; width: min(86vw, 58vh, 500px); overflow: visible; color: var(--lp-metal); }
.lp-intro__facets path { fill: none; stroke: currentColor; stroke-width: .4; opacity: .43; stroke-dasharray: 1; stroke-dashoffset: 1; animation: lp-trace 1.35s var(--lp-ease) forwards; }
.lp-intro__facets path:nth-child(2) { opacity: .19; animation-delay: .2s; }
.lp-intro__facets path:nth-child(3) { opacity: .22; animation-delay: .32s; }
.lp-intro__lockup { position: relative; display: grid; justify-items: center; gap: 20px; text-align: center; }
.lp-intro__logo { width: min(24vw, 17vh, 142px); overflow: visible; filter: drop-shadow(0 0 22px #e7efbf38); }
.lp-intro__logo path { fill: #fff0; stroke: #fff; stroke-width: 3; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: lp-logo 1.12s var(--lp-ease) .16s forwards; }
.lp-intro__lockup strong { font-size: clamp(.8rem, 3vw, 1rem); letter-spacing: .29em; text-transform: uppercase; }
.lp-intro__lockup span { margin-top: -12px; color: var(--lp-metal); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; }
.lp-intro__lockup strong, .lp-intro__lockup span { animation: lp-rise .75s var(--lp-ease) .44s both; }
.lp-intro__skip { position: absolute; bottom: max(26px, env(safe-area-inset-bottom)); left: 50%; translate: -50% 0; min-height: 44px; padding: 0 17px; border: 1px solid #ffffff55; border-radius: 40px; background: #171a15; color: #fff; font: inherit; font-size: .75rem; cursor: pointer; }
.lp-intro__timer { position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: linear-gradient(90deg, #758260, #f4f7e9); transform-origin: left; animation: lp-timer 1.8s linear both; }
.lp-intro.lp-out { animation: lp-iris .47s var(--lp-ease) both; }
.lp-intro.lp-out::backdrop { background: transparent; }

.lp-curtain { position: fixed; z-index: 950; inset: 0; display: grid; place-items: center; visibility: hidden; pointer-events: none; background: linear-gradient(145deg, #292d24, #111311 60%); }
.lp-curtain::before { content: ""; position: absolute; inset: 0; background: linear-gradient(137deg, transparent 49.9%, #c6ceac35 50%, transparent 50.2%), linear-gradient(43deg, transparent 65%, #c6ceac16 65.1%, transparent 65.25%); }
.lp-curtain img { position: relative; width: clamp(64px, 12vw, 110px); opacity: .91; }
.lp-curtain.lp-enter, .lp-curtain.lp-leave { visibility: visible; }
.lp-curtain.lp-enter { pointer-events: auto; animation: lp-curtain-in .33s var(--lp-ease) both; }
.lp-curtain.lp-leave { animation: lp-curtain-out .53s var(--lp-ease) both; }

@keyframes lp-trace { to { stroke-dashoffset: 0; } }
@keyframes lp-logo { 65% { fill: #fff0; } to { fill: #fff; stroke-dashoffset: 0; } }
@keyframes lp-timer { from { transform: scaleX(0); } }
@keyframes lp-iris {
  from { clip-path: polygon(50% -105%, 155% 50%, 50% 205%, -55% 50%); }
  to { clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%); }
}
@keyframes lp-curtain-in {
  from { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); }
  42% { clip-path: polygon(0 51%, 100% 77%, 100% 100%, 0 100%); }
  to { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}
@keyframes lp-curtain-out {
  from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
  to { clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
}

.lp-word { display: inline-block; overflow: clip; vertical-align: bottom; padding: .13em 0 .23em; margin: -.13em 0 -.23em; }
.lp-word > span { display: inline-block; }
.lp-in[data-lp-title] .lp-word > span { animation: lp-word .78s var(--lp-ease) both; animation-delay: calc(var(--lp-order) * 58ms); }
.lp-in[data-lp-reveal] { animation: lp-rise .73s var(--lp-ease) both; animation-delay: var(--lp-delay, 0ms); }
.lp-in[data-lp-reveal="card"] { animation-duration: .45s; }
.lp-in[data-lp-reveal="card"]:nth-child(2n) { --lp-delay: 45ms; }
@media (min-width: 1100px) {
  .lp-in[data-lp-reveal="card"]:nth-child(4n + 3) { --lp-delay: 90ms; }
  .lp-in[data-lp-reveal="card"]:nth-child(4n) { --lp-delay: 135ms; }
}
.lp-in[data-lp-mask] { animation: lp-mask .95s var(--lp-ease) both; }
.lp-in[data-lp-mask] img { animation: lp-zoom-out 1.1s var(--lp-ease) both; }
.lp-in:focus-within, .lp-in:focus-within .lp-word > span { animation: none !important; }
@keyframes lp-word { from { opacity: 0; transform: translateY(108%); } }
@keyframes lp-rise { from { opacity: 0; transform: translateY(19px); } }
@keyframes lp-mask { from { clip-path: polygon(0 0, 12% 0, 0 100%, 0 100%); } to { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } }
@keyframes lp-zoom-out { from { scale: 1.08; } }

.lp-progress { position: fixed; z-index: 100; inset: 0 auto auto 0; width: 100%; height: 2px; pointer-events: none; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, #687750, #d4dcc0, #fff); }
.lp-top { position: fixed; left: 14px; bottom: max(15px, env(safe-area-inset-bottom)); z-index: 55; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #fff5; border-radius: 50%; background: #121411f2; color: white; cursor: pointer; visibility: hidden; opacity: 0; transform: translateY(12px); transition: opacity .3s, transform .4s var(--lp-ease), visibility .3s; }
.lp-top.lp-visible { visibility: visible; opacity: 1; transform: none; }
.lp-top svg { width: 19px; }
.lp-spark { position: fixed; left: var(--lp-x); top: var(--lp-y); z-index: 960; pointer-events: none; }
.lp-spark i { position: absolute; width: 7px; height: 7px; background: var(--lp-metal); border: 1px solid #fff; animation: lp-burst .56s var(--lp-ease) both; }
.lp-spark i:nth-child(even) { background: #809363; width: 5px; height: 5px; }
@keyframes lp-burst { from { transform: rotate(45deg); } to { transform: translate(var(--lp-dx), var(--lp-dy)) rotate(135deg) scale(.12); opacity: 0; } }

.lp-marquee { display: flex; align-items: stretch; background: var(--lp-metal); color: #151713; border-block: 1px solid #101310; }
.lp-marquee__window { flex: 1; min-width: 0; overflow: hidden; }
.lp-marquee__track { display: flex; width: max-content; }
.lp-marquee__group { display: flex; align-items: center; justify-content: space-around; gap: 32px; padding: 13px 18px; min-width: 100vw; white-space: nowrap; font-size: .68rem; letter-spacing: .15em; font-weight: 850; text-transform: uppercase; }
.lp-marquee__group i { width: 7px; height: 7px; background: currentColor; rotate: 45deg; }
.lp-marquee.lp-running .lp-marquee__track { animation: lp-marquee 29s linear infinite; }
.lp-marquee.lp-paused .lp-marquee__track { animation-play-state: paused; }
.lp-marquee button { width: 47px; border: 0; border-left: 1px solid #15171350; background: transparent; color: inherit; font: inherit; font-size: .78rem; cursor: pointer; }
.lp-marquee button[hidden] { display: none; }
@keyframes lp-marquee { to { transform: translateX(-50%); } }

@media (hover: hover) and (pointer: fine) {
  [data-lp-tilt] { transform: perspective(780px) rotateX(var(--lp-rx, 0deg)) rotateY(var(--lp-ry, 0deg)); transition: transform .28s var(--lp-ease); }
  [data-lp-magnet] { translate: var(--lp-mx, 0) var(--lp-my, 0); transition: translate .28s var(--lp-ease), background .2s, color .2s, transform .2s; }
  [data-lp-parallax] { translate: 0 var(--lp-parallax, 0px); }
}
