/* Branded image adaptation of React Bits SplitFlapText, David Haz. */
.brand:has(.brand-logo){display:inline-flex;flex:none;align-items:center;letter-spacing:normal;line-height:1}
.brand-logo{--logo-width:210px;--logo-height:calc(var(--logo-width) * 146 / 514);position:relative;display:block;width:var(--logo-width);height:var(--logo-height);isolation:isolate}
.brand-original{display:block;width:100%;height:100%;object-fit:contain;opacity:1;transition:opacity .16s ease}
.brand-flap{position:absolute;inset:0;display:block;opacity:0;pointer-events:none;transition:opacity .16s ease}
.brand-logo.is-playing .brand-original{opacity:0}.brand-logo.is-playing .brand-flap{opacity:1}
.logo-tile{position:absolute;top:0;left:var(--tile-left);width:var(--tile-width);height:100%;perspective:400px;transform-style:preserve-3d;isolation:isolate}
.logo-tile::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,#000a,transparent);z-index:9;pointer-events:none}
.logo-half,.logo-flap{position:absolute;left:0;width:100%;height:50%;overflow:hidden;backface-visibility:hidden;background:#090b0d}
.logo-top,.logo-front{top:0}.logo-bottom,.logo-back{bottom:0}
.logo-art{display:block;position:absolute;left:var(--art-left);width:var(--logo-width);max-width:none!important;height:var(--logo-height)}
.logo-top .logo-art,.logo-front .logo-art{top:0}.logo-bottom .logo-art,.logo-back .logo-art{bottom:0}
.logo-glyph{position:absolute;left:0;width:100%;height:200%;display:flex;align-items:center;justify-content:center;font:900 calc(var(--logo-height) * .65)/1 monospace;letter-spacing:-.08em;color:var(--glyph-color,#fff);text-shadow:0 2px 5px #0008}
.logo-top .logo-glyph,.logo-front .logo-glyph{top:0}.logo-bottom .logo-glyph,.logo-back .logo-glyph{bottom:0}
.logo-flap{z-index:6;will-change:transform,filter;transform-style:preserve-3d}
.logo-front{transform-origin:center bottom;animation:logo-flap-front var(--flap-duration,180ms) linear both}
.logo-back{transform-origin:center top;animation:logo-flap-back var(--flap-duration,180ms) linear both}
@keyframes logo-flap-front{0%{transform:rotateX(0);filter:brightness(1.06);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}50%,100%{transform:rotateX(-90deg);filter:brightness(.5)}}
@keyframes logo-flap-back{0%,50%{transform:rotateX(90deg);filter:brightness(.55);animation-timing-function:cubic-bezier(.215,.61,.355,1)}100%{transform:rotateX(0);filter:brightness(1)}}
.footer .brand-logo{--logo-width:230px}
@media(max-width:1000px){.nav .brand-logo{--logo-width:175px}.nav-center{font-size:10px}}
@media(max-width:700px){.nav .brand-logo{--logo-width:138px}.footer .brand-logo{--logo-width:200px}}
@media(max-width:360px){.nav .brand-logo{--logo-width:118px}}
@media(prefers-reduced-motion:reduce){.brand-original{transition:none!important;opacity:1!important}.brand-flap{display:none!important}}
