body:has(.infoMenu[open]){overflow:hidden}
.app .infoMenu[open]{position:fixed;inset:0;z-index:9999;isolation:isolate}
.app .infoMenu[open]>summary{position:fixed;right:max(20px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));z-index:2;color:#29475e}
.app .infoMenu[open]>summary::before{top:21px;transform:rotate(45deg);box-shadow:none}
.app .infoMenu[open]>summary::after{top:21px;width:26px;transform:rotate(-45deg)}
.app .infoMenu[open] .menuPanel{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;box-sizing:border-box;border:0;border-radius:0;margin:0;padding:96px max(24px,calc((100vw - 900px)/2)) 40px;background:radial-gradient(ellipse at 90% 10%,#d6eaff 0,transparent 45%),radial-gradient(ellipse at 0% 100%,#e0f4f5 0,transparent 45%),#f6f9fc;box-shadow:none;display:flex;flex-direction:column;justify-content:safe center;gap:8px;overflow:auto;animation:fullMenu .35s ease both}
.app .infoMenu[open] .menuPanel::before{content:'Yallo / Explore';color:#2478b8;font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;margin-bottom:24px}
.app .infoMenu[open] .menuPanel::after{content:'One hello. Endless possibilities.';font-size:14px;color:#62798d;margin-top:28px;padding-bottom:env(safe-area-inset-bottom)}
.app .infoMenu[open] .menuPanel a{flex:none;min-height:68px;padding:16px 20px;background:#ffffff80;border:1px solid #ffffff;border-radius:18px;color:#263a51;transition:transform .2s,background .2s;animation:fullLink .4s both}
.app .infoMenu[open] .menuPanel a span{font-size:clamp(19px,3vw,30px)!important;line-height:1.25;font-weight:600}
.app .infoMenu[open] .menuPanel a svg{color:#2478b8;width:24px;height:24px;flex-basis:24px}
.app .infoMenu[open] .menuPanel a:nth-child(2){animation-delay:.04s}.app .infoMenu[open] .menuPanel a:nth-child(3){animation-delay:.08s}.app .infoMenu[open] .menuPanel a:nth-child(4){animation-delay:.12s}.app .infoMenu[open] .menuPanel a:nth-child(5){animation-delay:.16s}
.app .infoMenu[open] .menuPanel a:hover{background:#fff;transform:translateX(6px)}
@keyframes fullMenu{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}@keyframes fullLink{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-height:650px){.app .infoMenu[open] .menuPanel{justify-content:flex-start;padding-top:76px;gap:6px}.app .infoMenu[open] .menuPanel a{min-height:52px;padding:10px 14px}.app .infoMenu[open] .menuPanel::before{margin-bottom:10px}.app .infoMenu[open] .menuPanel::after{margin-top:14px}}
@media(prefers-reduced-motion:reduce){.app .infoMenu[open] .menuPanel,.app .infoMenu[open] .menuPanel a{animation:none;transition:none}}
