/* An isolated drawer leaves the desktop navigation unchanged. */
.drawer-shell[hidden] { display: none !important; }
.drawer-shell { position: fixed; inset: 0; z-index: 100; visibility: hidden; pointer-events: none; transition: visibility 0s linear .36s; }
.drawer-shell.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }
.drawer-scrim { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(0,0,0,.64); opacity: 0; transition: opacity .35s ease; }
.drawer-shell.is-open .drawer-scrim { opacity: 1; }
.drawer-panel { position: absolute; top: 0; right: 0; height: 100%; height: 100dvh; width: min(410px, 89vw); padding: max(30px, env(safe-area-inset-top)) max(30px, env(safe-area-inset-right)) max(32px, env(safe-area-inset-bottom)) 38px; background: #151612; color: #f1eee6; box-shadow: -20px 0 70px rgba(0,0,0,.3); transform: translateX(102%); transition: transform .36s cubic-bezier(.22,1,.36,1); display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; }
.drawer-shell.is-open .drawer-panel { transform: translateX(0); }
.drawer-top { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.drawer-label { font: 600 19px "Cormorant Garamond",serif; color: #d5bd8d; letter-spacing: .12em; }
.drawer-label small { display: block; margin-top: 4px; font: 9px "Noto Sans KR",sans-serif; color: #9d988c; letter-spacing: .22em; }
.drawer-close { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 0; background: transparent; color: #d6c4a1; cursor: pointer; font: 300 32px/1 sans-serif; }
.drawer-body { margin: auto 0; padding: 45px 0; }
.drawer-eyebrow { margin-bottom: 26px; color: #a88e60; font-size: 9px; letter-spacing: .2em; }
.drawer-nav { display: flex; flex-direction: column; gap: 5px; }
.drawer-nav a { display: flex; align-items: center; min-height: 57px; gap: 20px; color: #ede9e0; font-size: 19px; letter-spacing: -.03em; transition: color .2s, transform .2s; }
.drawer-nav a span { color: #8f7956; font: 13px "Cormorant Garamond",serif; letter-spacing: .08em; }
.drawer-nav a b { margin-left: auto; font-weight: 400; font-size: 14px; color: #a98e62; }
.drawer-nav a:hover { color: #d7bd88; transform: translateX(4px); }
.drawer-foot { color: #8d877a; font: 10px "Cormorant Garamond",serif; letter-spacing: .2em; }
.drawer-close:focus-visible, .drawer-nav a:focus-visible { outline: 2px solid #dec58d; outline-offset: 4px; }
@media (max-width: 900px) {
  .drawer-available .header .nav { display: none !important; }
  html:not(.drawer-available) .menu { display: none; }
  html:not(.drawer-available) .header .nav { display: flex; }
}
@media (min-width: 901px) { .drawer-shell { display: none !important; } }
@media (max-width: 320px) { .drawer-panel { padding-left: 25px; padding-right: 20px; } .drawer-nav a { min-height: 51px; font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .drawer-shell, .drawer-scrim, .drawer-panel, .drawer-nav a { transition: none; } .drawer-nav a:hover { transform: none; } }
