.hero .arena{background-image:url('assets/arena-v2.webp');background-size:cover;inset:-3%;background-position:center;opacity:1;mask-image:none;-webkit-mask-image:none;animation:hero-distant-zoom 24s ease-in-out infinite alternate}.hero:after{background:linear-gradient(90deg,#04131eeb,#04131e99 42%,#04131e10 75%),linear-gradient(0deg,#061923,transparent 25%)}
.champion-portrait{position:absolute;z-index:2;right:max(64px,calc((100% - 1312px)/2));bottom:76px;width:42%;max-width:590px}.champion-photo{height:635px;overflow:hidden;mask-image:linear-gradient(0deg,transparent,#000 12%);-webkit-mask-image:linear-gradient(0deg,transparent,#000 12%)}.champion-photo img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;transform-origin:50% 60%;animation:champion-zoom 16s ease-in-out infinite alternate}.champion-card{position:relative;margin:-85px 15px 0 30px;padding:23px 27px;border:1px solid #7ac7d64d;border-radius:14px;background:linear-gradient(125deg,#0c3148f5,#04131ef5);backdrop-filter:blur(15px);box-shadow:0 15px 40px #0006;text-align:left}.champion-card h2{font-size:clamp(1.4rem,2.2vw,2rem);color:#5ae8ff;letter-spacing:-.03em;line-height:1.15;margin-bottom:9px}.champion-card p{font-size:15px;line-height:1.5;margin:0}.champion-card p+p{margin-top:9px;color:#b8ccd7;font-size:13px}.hero .hero-inner{max-width:53%}
@keyframes champion-zoom{from{transform:scale(1)}to{transform:scale(1.065)}}
@media(max-width:1000px){.champion-portrait{right:35px;width:42%;bottom:60px}.champion-photo{height:590px}.champion-card{margin-left:0;margin-right:0;padding:20px}.hero .hero-inner{max-width:55%}.hero h1{font-size:clamp(2.8rem,6vw,4.8rem)}}
@media(max-width:650px){.hero{display:block;min-height:0;padding-bottom:45px}.hero .hero-inner{max-width:100%}.hero .arena{inset:-3%;height:auto;opacity:.45;background-size:cover;background-position:65% center}.hero:after{background:linear-gradient(180deg,#04131edd,#04131e88 55%,#061923 100%)}.champion-portrait{position:relative;right:auto;bottom:auto;width:100%;max-width:400px;margin:30px auto 0}.champion-photo{height:480px}.champion-card{margin:-75px 0 0;padding:22px}.champion-card h2{font-size:25px}.hero .scroll-cue{display:none}.hero h1{font-size:clamp(2.6rem,10.6vw,4.2rem)}}
@media(prefers-reduced-motion:reduce){.champion-photo img,.hero .arena{animation:none!important}}
/* Compact champion plaque with a circulating illuminated border. */
@property --champion-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.champion-card{width:max-content;max-width:100%;margin:-85px auto 0;padding:23px 28px;text-align:center;border:1px solid transparent;background:linear-gradient(125deg,#0c3148,#04131e) padding-box,conic-gradient(from var(--champion-angle),#21a2ba33 0deg,#21a2ba33 240deg,#5ae8ff 285deg,#fff 300deg,#21a2ba33 330deg) border-box;box-shadow:0 0 22px #21a2ba55,0 15px 40px #0006;animation:champion-border-run 5s linear infinite,champion-card-glow 4s ease-in-out infinite}
.champion-card h2{font-size:clamp(.84rem,1.32vw,1.2rem);margin-bottom:9px}.champion-card p{font-size:15px}.champion-card p+p{font-size:13px}
@keyframes champion-border-run{to{--champion-angle:360deg}}
@keyframes champion-card-glow{50%{box-shadow:0 0 38px #21a2ba88,0 0 12px #5ae8ff44,0 15px 40px #0006}}
@media(max-width:1000px){.champion-card{margin:-85px auto 0;padding:22px 25px}}
@media(max-width:650px){.champion-card{margin:-75px auto 0;padding:22px 24px;max-width:100%}.champion-card h2{font-size:15px}.champion-card p+p{max-width:285px}}
@media(prefers-reduced-motion:reduce){.champion-card{animation:none}}
/* Larger, lower portrait framed at the waist belt. */
.champion-portrait{bottom:40px;width:45%;max-width:640px}.champion-photo{height:675px;position:relative}.champion-photo img{object-fit:contain;transform-origin:50% 48%;animation:champion-large-zoom 16s ease-in-out infinite alternate}.champion-card{margin-top:-105px}
@keyframes champion-large-zoom{from{transform:translateY(28px) scale(1.14)}to{transform:translateY(28px) scale(1.20)}}
@media(max-width:1000px){.champion-portrait{width:44%;bottom:35px}.champion-photo{height:620px}}
@media(max-width:650px){.champion-portrait{position:relative;width:100%;bottom:auto;margin-top:40px;max-width:430px}.champion-photo{height:510px}.champion-card{margin-top:-95px}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none;transform:translateY(28px) scale(1.14)}}
/* Visible zoom and float, with a steady waist-level crop. */
.champion-photo img{animation:champion-visible-motion 7s ease-in-out infinite alternate;transform-origin:50% 48%;will-change:transform;backface-visibility:hidden}
@keyframes champion-visible-motion{from{transform:translate3d(0,30px,0) scale(1.10)}to{transform:translate3d(-7px,8px,0) scale(1.24)}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none!important;transform:translateY(28px) scale(1.14)}}
/* Reserve the maximum animated footprint, keeping the entire portrait visible. */
.champion-photo{overflow:visible;mask-image:none;-webkit-mask-image:none;display:flex;align-items:center;justify-content:center}
.champion-photo img{width:80%;height:80%;object-fit:contain;object-position:center;transform-origin:center center;animation:champion-safe-motion 7s ease-in-out infinite alternate}
@keyframes champion-safe-motion{from{transform:translate3d(0,10px,0) scale(1.08)}to{transform:translate3d(-5px,-8px,0) scale(1.20)}}
.champion-card{margin-top:-35px}
@media(max-width:650px){.champion-card{margin-top:-28px}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none!important;transform:none}}
/* Larger portrait, lowered to meet the plaque at the waist, with restrained zoom. */
.champion-photo img{width:94%;height:94%;transform-origin:center center;animation:champion-gentle-motion 12s ease-in-out infinite alternate}
@keyframes champion-gentle-motion{from{transform:translate3d(0,24px,0) scale(1)}to{transform:translate3d(-3px,18px,0) scale(1.025)}}
.champion-card{margin-top:-90px}
@media(max-width:650px){.champion-card{margin-top:-75px}.champion-photo img{width:94%;height:94%}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none!important;transform:translateY(24px)}}
/* Increase the portrait footprint and lower the composition slightly. */
.champion-portrait{width:48%;max-width:690px;bottom:22px}.champion-photo{height:715px}.champion-photo img{width:96%;height:96%;animation:champion-gentle-lower 12s ease-in-out infinite alternate}
@keyframes champion-gentle-lower{from{transform:translate3d(0,36px,0) scale(1)}to{transform:translate3d(-3px,30px,0) scale(1.025)}}
@media(max-width:1000px){.champion-portrait{width:46%;bottom:22px}.champion-photo{height:650px}}
@media(max-width:650px){.champion-portrait{width:100%;bottom:auto;max-width:450px;margin-top:50px}.champion-photo{height:545px}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none!important;transform:translateY(36px)}}
/* Larger photo within the same card placement. */
.champion-photo{height:760px;margin-top:-45px}.champion-photo img{width:100%;height:100%;animation:champion-lowered-large 12s ease-in-out infinite alternate}
@keyframes champion-lowered-large{from{transform:translate3d(0,76px,0) scale(1.04)}to{transform:translate3d(-3px,70px,0) scale(1.065)}}
@media(max-width:1000px){.champion-photo{height:695px;margin-top:-45px}}
@media(max-width:650px){.champion-photo{height:585px;margin-top:-40px}}
@media(prefers-reduced-motion:reduce){.champion-photo img{animation:none!important;transform:translateY(76px) scale(1.04)}}