/* Keep the circle in place while only its icon rolls through the window. */
.igla-page .socials>:is(button,a){position:relative;width:264.98rem;height:264.98rem;flex-shrink:0;transition:transform 350ms ease}
.igla-page .socials>:is(button,a)>.social-circle{position:absolute;inset:0;pointer-events:none}
.social-window{position:absolute;inset:0;overflow:hidden;border-radius:50%;pointer-events:none}
.social-window img{position:absolute;inset:0;transition:transform 350ms ease}
.social-window .social-back{transform:translateY(110%)}
header .portrait-play .portrait{object-position:center;object-fit:cover}
@media(hover:hover) and (pointer:fine){
 .igla-page .socials>:is(button,a):hover{transform:scale(1.04)}
 .igla-page .socials>:is(button,a):hover .social-front{transform:translateY(-110%)}
 .igla-page .socials>:is(button,a):hover .social-back{transform:translateY(0)}
}
.igla-page .socials>:is(button,a):focus-visible{transform:scale(1.04)}
.igla-page .socials>:is(button,a):focus-visible .social-front{transform:translateY(-110%)}
.igla-page .socials>:is(button,a):focus-visible .social-back{transform:translateY(0)}
@media(prefers-reduced-motion:reduce){
 .igla-page .socials>:is(button,a):hover,.igla-page .socials>:is(button,a):focus-visible{transform:none}
 .igla-page .socials>:is(button,a):hover .social-front,.igla-page .socials>:is(button,a):focus-visible .social-front{transform:none}
 .social-window .social-back{display:none}
}


/* Center picshum in the full desktop logo container. */
header .brand{left:0;top:33rem;width:415rem;height:42rem;display:flex;align-items:center;justify-content:center;text-align:center}
