@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--yellow:#ffbc00;--muted:#c6b8d2}*{box-sizing:border-box}body{margin:0;background:#170c25;color:#fff;font-family:Outfit,Arial,sans-serif;font-size:16px;min-height:100svh}.ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 15%,#54207966,transparent 65%)}.orb{position:absolute;width:55vw;height:55vw;border-radius:50%;filter:blur(85px);opacity:.23;animation:drift 15s ease-in-out infinite alternate}.one{background:#9d27dd;top:-20%;left:-25%}.two{background:#752aaa;bottom:-35%;right:-20%;animation-delay:-7s}.ring{width:750px;height:750px;border:1px solid #b880eb12;border-radius:50%;position:absolute;left:50%;top:220px;transform:translateX(-50%);animation:ripple 12s ease-in-out infinite}.r2{width:1000px;height:1000px;top:95px;animation-delay:-4s}.r3{width:1250px;height:1250px;top:-30px;animation-delay:-8s}main{width:min(100% - 40px,550px);margin:auto;padding:46px 0 24px}header{text-align:center;margin-bottom:30px}.eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;font-size:12px;letter-spacing:2.3px;font-weight:500;color:#dac9e9}.wave{display:flex;gap:3px;align-items:center;height:20px}.wave i{height:14px;width:3px;border-radius:3px;background:var(--yellow);animation:equalize 1.2s ease-in-out infinite alternate}.wave i:nth-child(2){animation-delay:-.7s}.wave i:nth-child(3){animation-delay:-.3s}.wave i:nth-child(4){animation-delay:-1s}.wave i:nth-child(5){animation-delay:-.5s}h1{margin:27px auto 17px;width:92%;aspect-ratio:3.2;overflow:hidden;display:flex;align-items:center}h1 img{width:100%;height:auto;display:block}header p{font-size:17px;color:var(--muted);margin:0}.card{position:relative;display:flex;align-items:center;gap:18px;text-decoration:none;color:inherit;border:1px solid #ffffff17;border-radius:18px;padding:20px 23px;margin-bottom:12px;background:#ffffff06;transition:transform .25s,background .25s,border-color .25s;animation:enter .7s both}.card:hover{transform:translateY(-3px);border-color:#bc83e469;background:#ffffff0d}.card:active{transform:scale(.985)}a:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}.text{display:flex;flex:1;min-width:0;flex-direction:column;gap:5px}.text strong{font-size:20px;font-weight:600}.text>span:last-child{font-size:14px;color:var(--muted);line-height:1.45}.kicker{font-size:11px;font-weight:600;letter-spacing:1.6px}.icon{width:42px;flex-shrink:0;text-align:center;font-size:28px;color:#e9d9f5}.icon svg{width:28px;height:28px;vertical-align:middle}.arrow{font-size:25px;color:#b599cb;transition:transform .25s}.card:hover .arrow{transform:translate(3px,-3px)}.featured{background:var(--yellow);color:#251132;border-color:var(--yellow);padding:26px 23px;box-shadow:0 8px 40px #ffbc0010;overflow:hidden}.featured:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#ffffff35 45%,transparent 65%);transform:translateX(-130%);animation:shine 8s ease-in-out infinite}.featured:hover{background:#ffca2d;border-color:#ffd761}.featured .text strong{font-size:23px;font-weight:700}.featured .text>span:last-child{color:#51391f}.featured .icon,.featured .arrow{color:#32123f}.play{border:2px solid #32123f;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;font-size:18px;padding-left:3px}.event{background:linear-gradient(120deg,#60268c66,#35154966);animation-delay:.08s}.date{font-size:29px;font-weight:600;color:var(--yellow);width:42px;text-align:center;line-height:1}.date span{display:block;font-size:11px;letter-spacing:2px;margin-top:6px}.event .kicker{color:#d1b2e9}.section-label{font-size:11px;letter-spacing:2px;color:#a68db8;margin:26px 0 13px 3px}.social{min-height:90px}.social:nth-of-type(3){animation-delay:.16s}.social:nth-of-type(4){animation-delay:.24s}.social:nth-of-type(5){animation-delay:.32s}.facebook{font-family:Arial,sans-serif;font-weight:bold}.tiktok{font-weight:700;font-size:34px}footer{text-align:center;margin-top:28px}footer a{font-size:14px;color:#bba7cb;text-decoration:none}footer a:hover{color:var(--yellow)}.footer-line{display:flex;align-items:center;justify-content:center;gap:12px;color:#876e9b;font-size:10px;letter-spacing:2.3px;margin-top:28px}.footer-line span{height:1px;background:#ffffff12;width:35px}@keyframes equalize{from{transform:scaleY(.3)}to{transform:scaleY(1)}}@keyframes drift{to{transform:translate(60px,70px) scale(1.15)}}@keyframes ripple{50%{transform:translateX(-50%) scale(1.07);opacity:.5}}@keyframes shine{0%,60%{transform:translateX(-130%)}90%,100%{transform:translateX(130%)}}@keyframes enter{from{opacity:0;translate:0 15px}to{opacity:1;translate:0 0}}@media(min-width:900px){main{padding-top:58px}.ambient:after{content:'QUINTOW';position:absolute;top:44%;left:50%;transform:translate(-50%,-50%);font-size:22vw;font-weight:800;letter-spacing:-1vw;color:#ffffff02;white-space:nowrap}}@media(max-width:480px){main{width:calc(100% - 32px);padding-top:30px}header{margin-bottom:24px}h1{width:95%;margin-top:23px}.card{gap:13px;padding:18px 16px}.featured{padding:23px 16px}.featured .text strong{font-size:21px}.text strong{font-size:19px}.text>span:last-child{font-size:13px}.eyebrow{font-size:10px;letter-spacing:1.8px}.icon{width:34px}.play{width:39px;height:39px}.date{width:34px}.orb{width:95vw;height:95vw;filter:blur(65px)}.one{top:0;left:-50%}.two{bottom:0;right:-60%}}
/* Continuous brand motion, including touch devices. */
@media all{
 h1{position:relative;animation:logo-float 6s ease-in-out infinite;will-change:transform}
 h1:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#ffcf5118 48%,transparent 65%);pointer-events:none;animation:logo-light 9s ease-in-out infinite}
 .card .icon{animation:icon-float 4s ease-in-out infinite;transform-origin:center}
 .card:nth-of-type(2n) .icon{animation-delay:-1.3s}
 .card:nth-of-type(3n) .icon{animation-delay:-2.6s}
 .card .play{animation:play-pulse 3.4s ease-in-out infinite}
 .card .date{animation:date-sway 5s ease-in-out infinite}
 .card:hover .icon{animation-duration:1.8s}
}
@keyframes logo-float{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-7px) rotate(.4deg)}}
@keyframes logo-light{0%,55%{transform:translateX(-130%);opacity:0}60%{opacity:1}90%,100%{transform:translateX(130%);opacity:0}}
@keyframes icon-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-4px) rotate(3deg)}}
@keyframes play-pulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 #32123f00}50%{transform:scale(1.08);box-shadow:0 0 0 7px #32123f0d}}
@keyframes date-sway{0%,75%,100%{transform:rotate(0)}82%{transform:rotate(-5deg)}90%{transform:rotate(5deg)}}

/* Keep the animated background above the body paint on Safari. */
body{isolation:isolate}.ambient{z-index:0}main{position:relative;z-index:1}
.arrow{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 24px}.arrow svg{display:block;width:24px;height:24px}.play svg{width:23px;height:23px}.play{padding-left:0}
.orb{filter:none;background:radial-gradient(circle,#9238c980 0%,#7926ac38 35%,transparent 70%);opacity:.7;will-change:transform}
@media(max-width:600px){.orb{filter:none;width:110vw;height:110vw}.one{top:-10%;left:-45%}.two{bottom:0;right:-45%}.ring{width:85vw;height:85vw;top:130px;border-color:#b880eb26}.r2{width:125vw;height:125vw;top:65px}.r3{width:165vw;height:165vw;top:0}h1{animation-duration:4.5s}.card .icon{animation-duration:3s}}
.motion-toggle{display:none;margin:20px auto 0;padding:10px 16px;font:inherit;font-size:14px;color:#e9d9f5;background:#ffffff0a;border:1px solid #ffffff30;border-radius:24px;cursor:pointer}.motion-toggle:focus-visible{outline:2px solid var(--yellow);outline-offset:4px}
@media(prefers-reduced-motion:reduce){html:not([data-motion="on"]) *,html:not([data-motion="on"]) *:before,html:not([data-motion="on"]) *:after{animation:none!important;transition:none!important}.motion-toggle{display:block}}
