回転しながら展開するフルカバーメニュー

<div class="d03-08-10-frame">
          <div class="d03-08-10-bar">
            <span class="d03-08-10-logo">Vision</span>
            <button class="d03-08-10-burger" type="button" aria-label="メニューを開く" aria-expanded="false">
              <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="#1f2937" stroke-width="2.2"><line x1="4" y1="7" x2="20" y2="7"/><line x1="4" y1="12" x2="20" y2="12"/><line x1="4" y1="17" x2="20" y2="17"/></svg>
            </button>
          </div>
          <div class="d03-08-10-menu">
            <a href="#">サービス</a>
            <a href="#">実績</a>
            <a href="#">採用</a>
            <a href="#">お問い合わせ</a>
          </div>
        </div>

.d03-08-10-frame{position:relative;width:100%;max-width:260px;height:210px;margin:0 auto;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 10px 26px rgba(30,41,59,.14);border:1px solid #e5e7eb}
        .d03-08-10-bar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:14px 16px}
        .d03-08-10-logo{font-weight:800;font-size:13px;color:#334155;letter-spacing:.02em;transition:color .3s}
        .d03-08-10-frame.open .d03-08-10-logo{color:#fff}
        .d03-08-10-burger{position:relative;width:28px;height:28px;border:0;background:transparent;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
        .d03-08-10-burger svg{transition:transform .55s cubic-bezier(.65,0,.35,1),stroke .3s}
        .d03-08-10-frame.open .d03-08-10-burger svg{transform:rotate(360deg);stroke:#fff}
        .d03-08-10-menu{position:absolute;inset:0;z-index:2;background:radial-gradient(circle at 88% 8%,#312e81,#0f172a 75%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transform:scale(0) rotate(-70deg);transform-origin:90% 10%;opacity:0;transition:transform .55s cubic-bezier(.65,0,.35,1),opacity .3s}
        .d03-08-10-frame.open .d03-08-10-menu{transform:scale(1) rotate(0deg);opacity:1}
        .d03-08-10-menu a{color:#e0e7ff;text-decoration:none;font-size:14px;font-weight:600}
        .d03-08-10-menu a:hover{color:#fff;text-decoration:underline}

(function(){
        var root=document.getElementById('item-03-08-10');
        var burger=root.querySelector('.d03-08-10-burger');
        var frame=root.querySelector('.d03-08-10-frame');
        burger.addEventListener('click',function(){
          var isOpen=frame.classList.toggle('open');
          burger.setAttribute('aria-expanded',isOpen?'true':'false');
        });
      })();