.phoenix-brand {
  --img-rays: url(rays.webp);
  --img-sun: url(sun.webp);
  --img-flare: url(flare.webp);
  --img-horizon: url(horizon.webp);
  --img-logo: url(logo.webp);
  --img-logo_tm: url(logo_tm.webp);
  --img-sparkle1: url(sparkle1.webp);
  --img-sparkle5: url(sparkle5.webp);
  --grad-glow: radial-gradient(circle closest-side, rgba(255,0,0,0.5984) 0%, rgba(255,0,0,0.5933) 4%, rgba(255,0,0,0.5769) 8%, rgba(255,0,0,0.5494) 12%, rgba(255,0,0,0.5137) 16%, rgba(255,0,0,0.4719) 20%, rgba(255,0,0,0.4245) 24%, rgba(255,0,0,0.3749) 28%, rgba(255,0,0,0.3247) 32%, rgba(255,0,0,0.2760) 36%, rgba(255,0,0,0.2300) 40%, rgba(255,0,0,0.1880) 44%, rgba(255,0,0,0.1507) 48%, rgba(255,0,0,0.1187) 52%, rgba(255,0,0,0.0911) 56%, rgba(255,0,0,0.0686) 60%, rgba(255,0,0,0.0514) 64%, rgba(255,0,0,0.0384) 68%, rgba(255,0,0,0.0274) 72%, rgba(255,0,0,0.0192) 76%, rgba(255,0,0,0.0126) 80%, rgba(255,0,0,0.0078) 84%, rgba(255,0,0,0.0043) 88%, rgba(255,0,0,0.0039) 92%, rgba(255,0,0,0.0035) 96%, rgba(255,0,0,0.0001) 100%);
}

.phoenix-brand .preloader { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: #000; overflow: hidden; pointer-events: none; }
.phoenix-brand .preloader.is-done { opacity: 0; transition: opacity 520ms ease-out; }
.phoenix-brand .preloader__stage { position: relative; width: min(100%, 500px); aspect-ratio: 1000 / 620; background: #000; isolation: isolate; }
.phoenix-brand .layer { position: absolute; background-repeat: no-repeat; background-size: 100% 100%; pointer-events: none; }

.phoenix-brand .sky { position: absolute; left: 0; top: 0; width: 100%; height: 60.5968%; overflow: hidden; }
.phoenix-brand .sky__rise { position: absolute; inset: 0; animation: pl-rise 6.1s cubic-bezier(.05, .85, .15, 1) .2s both; will-change: transform; }
@keyframes pl-rise { from { transform: translateY(52%); } to { transform: translateY(0); } }
@keyframes pl-fadein { from { opacity: 0; } to { opacity: 1; } }

.phoenix-brand .glow { left:8.05%; top:-22.2252%; width:83.9%; height:222.518%; background-image: var(--grad-glow); mix-blend-mode: screen; animation: pl-breathe 10.4s ease-in-out infinite; }

.phoenix-brand .rays { left:13.95%; top:20.2289%; width:72.1%; height:137.6098%; background-image: var(--img-rays); mix-blend-mode: screen; will-change: transform, opacity; }
.phoenix-brand .rays--a { animation: pl-spin-cw 276s linear infinite, pl-flare 12.8s ease-in-out infinite; }
.phoenix-brand .rays--b { scale: 1.14; animation: pl-spin-ccw 184s linear infinite, pl-flare-back 16.2s ease-in-out infinite reverse; }
@keyframes pl-spin-cw  { to { rotate: 360deg; } }
@keyframes pl-spin-ccw { to { rotate: -360deg; } }
@keyframes pl-flare { 0%, 100% { opacity: .72; } 50% { opacity: 1; } }
@keyframes pl-flare-back { 0%, 100% { opacity: .26; } 50% { opacity: .46; } }
@keyframes pl-breathe { 0%, 100% { opacity: .78; transform: scale(1); } 50% { opacity: 1; transform: scale(1.035); } }

.phoenix-brand .disc { left:34.85%; top:48.7091%; width:30.3%; height:80.6495%; background-image: var(--img-sun); animation: pl-swell 13.6s ease-in-out infinite; will-change: transform; }
@keyframes pl-swell { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.014); } }

.phoenix-brand .flare-in { position: absolute; inset: 0; pointer-events: none; animation: pl-fadein 600ms ease-out .2s both; }
.phoenix-brand .flare { left:10.0%; top:52.129%; width:80.0%; height:16.9355%; background-image: var(--img-flare); mix-blend-mode: screen; animation: pl-fspread 6.1s cubic-bezier(.05, .85, .15, 1) .2s both, pl-flare 12.8s ease-in-out infinite; will-change: transform, opacity; }
.phoenix-brand .horizon { left:18.15%; top:60.1935%; width:63.7%; height:0.8065%; background-image: var(--img-horizon); mix-blend-mode: screen; animation: pl-hspread 6.1s cubic-bezier(.05, .85, .15, 1) .2s both; will-change: transform; }
@keyframes pl-fspread { from { transform: scaleX(.14); } to { transform: scaleX(1); } }
@keyframes pl-hspread { from { transform: scaleX(.06); opacity: 0; } 8% { opacity: 1; } to { transform: scaleX(1); opacity: 1; } }

.phoenix-brand .sparks { position: absolute; left:17.35%; top:41.129%; width:65.3%; height:26.6129%; overflow: visible; animation: pl-fadein 1200ms ease-out 6.1s both; }
.phoenix-brand .spark { position: absolute; width: var(--sz, 4%); aspect-ratio: 1; background-repeat: no-repeat; background-size: 100% 100%; mix-blend-mode: screen; opacity: 0; animation: pl-drift var(--dur, 10s) linear infinite; animation-delay: var(--delay, 0s); will-change: transform, opacity; }
.phoenix-brand .spark--a { background-image: var(--img-sparkle1); }
.phoenix-brand .spark--b { background-image: var(--img-sparkle5); }
@keyframes pl-drift {
  0%   { transform: translate(0, 20px) scale(.35) rotate(0deg); opacity: 0; }
  16%  { opacity: 1; }
  55%  { transform: translate(calc(var(--dx) * .55), calc(var(--rise) * -.55)) scale(1) rotate(calc(var(--spin) * .55)); opacity: .9; }
  100% { transform: translate(var(--dx), calc(var(--rise) * -1)) scale(.3) rotate(var(--spin)); opacity: 0; }
}

.phoenix-brand .brand { position: absolute; inset: 0; animation: pl-reveal 1440ms cubic-bezier(.3, .6, .25, 1) .2s both; will-change: clip-path; }
@keyframes pl-reveal { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
.phoenix-brand .reveal-bar { position: absolute; top: -30%; left: 44.5%; width: 11%; height: 160%; background: linear-gradient(90deg, transparent 0%, rgba(255, 248, 224, .95) 50%, transparent 100%); opacity: 0; animation: 1440ms cubic-bezier(.3, .6, .25, 1) .2s both; will-change: transform, opacity; }
.phoenix-brand .reveal-bar--l { animation-name: pl-wipe-l; }
.phoenix-brand .reveal-bar--r { animation-name: pl-wipe-r; }
@keyframes pl-wipe-l { 0% { transform: translateX(0); opacity: 1; } 78% { opacity: 1; } 100% { transform: translateX(-410%); opacity: 0; } }
@keyframes pl-wipe-r { 0% { transform: translateX(0); opacity: 1; } 78% { opacity: 1; } 100% { transform: translateX(410%); opacity: 0; } }

.phoenix-brand .ignite { left:10.0%; top:52.129%; width:80.0%; height:16.9355%; background-image: var(--img-flare); background-repeat: no-repeat; background-size: 100% 100%; mix-blend-mode: screen; opacity: 0; pointer-events: none; animation: pl-ignite 1040ms cubic-bezier(.16, 1, .3, 1) .1s 1 both; }
@keyframes pl-ignite { 0% { opacity: 0; transform: scaleX(.18) scaleY(.5); } 22% { opacity: 1; transform: scaleX(1.06) scaleY(1.5); } 100% { opacity: 0; transform: scaleX(1.5) scaleY(.7); } }

.phoenix-brand .logo { left:17.35%; top:62.3387%; width:65.3%; height:12.0968%; background-image: var(--img-logo); animation: pl-swell 13.6s ease-in-out infinite; will-change: transform; }
.phoenix-brand .logo-shine { position: absolute; left:17.35%; top:62.3387%; width:65.3%; height:12.0968%; overflow: hidden; mask-image: var(--img-logo); mask-size: 100% 100%; mask-repeat: no-repeat; -webkit-mask-image: var(--img-logo); -webkit-mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mix-blend-mode: screen; }
.phoenix-brand .logo-shine__bar { position: absolute; top: -25%; left: 0; width: 26%; height: 150%; background: linear-gradient(100deg, transparent 0%, rgba(255, 246, 220, 0) 22%, rgba(255, 246, 220, .85) 50%, rgba(255, 246, 220, 0) 78%, transparent 100%); transform: translateX(-260%) skewX(-12deg); animation: pl-sweep 14.4s ease-in-out 4.4s infinite; will-change: transform; }
@keyframes pl-sweep { 0% { transform: translateX(-260%) skewX(-12deg); } 24% { transform: translateX(500%) skewX(-12deg); } 100% { transform: translateX(500%) skewX(-12deg); } }

.phoenix-brand .tm { left:82.8%; top:70.9677%; width:1.8%; height:1.2903%; background-image: var(--img-logo_tm); }

.phoenix-brand { display:grid; place-items:center; width:100%; }
.phoenix-brand .preloader__stage { width:min(90vw,680px); }
.phoenix-bootstrap { position:fixed; inset:0; z-index:10000; background:#000; }
@media(prefers-reduced-motion:reduce) {
 .phoenix-brand * { animation:none!important; }
 .phoenix-brand .brand { clip-path:none; }
 .phoenix-brand .sky__rise { transform:none; }
}