.studio-menu-toggle{display:none}
@media(max-width:800px){
  .studio-landing .studio-menu-toggle{position:absolute;z-index:6;top:16px;right:14px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:48px;height:48px;padding:10px;border:0;border-radius:2px;color:#fff;background:rgba(0,0,0,.2);cursor:pointer}
  .studio-menu-toggle span{display:block;width:25px;height:2px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
  .studio-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .studio-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .studio-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .studio-menu-toggle:focus-visible{outline:2px solid #fff;outline-offset:3px}
  .studio-landing .hero .center{position:static;transform:none;width:auto}
  .studio-landing .hero .center>h1{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
  .studio-landing .hero .nav{position:absolute;top:74px;right:18px;left:auto;z-index:5;display:none!important;width:min(290px,calc(100vw - 36px));box-sizing:border-box;max-height:calc(100dvh - 145px);overflow-y:auto;margin:0;padding:16px 24px;flex-direction:column;align-items:stretch;gap:0;background:rgba(14,14,14,.94);border:1px solid rgba(255,255,255,.2);font-size:18px;line-height:1.4;text-align:left;box-shadow:0 10px 28px rgba(0,0,0,.2)}
  .studio-landing .hero .nav.is-open{display:flex!important}
  .studio-landing .hero .nav a,.studio-landing .hero .nav a[href="contact"]{display:block!important;padding:13px 0;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.studio-menu-toggle span{transition:none}}

@media(max-width:800px){.studio-landing .hero .nav{top:50%;left:50%;right:auto;transform:translate(-50%,-50%);width:min(90vw,400px);max-height:calc(100dvh - 180px);padding:0;background:transparent;border:0;box-shadow:none;text-align:center;align-items:center;gap:6px}.studio-landing .hero .nav a{font-size:20px;text-shadow:0 2px 10px rgba(0,0,0,.9)}.studio-landing .hero.mobile-menu-open .center>h1{opacity:0!important;visibility:hidden!important}.studio-landing .studio-menu-toggle{background:transparent}}

@media(max-width:800px){.studio-landing .hero .nav a{opacity:.75}.studio-landing .hero .nav a:hover,.studio-landing .hero .nav a:focus-visible{opacity:1}}