/* public/shared/mobile-nav.css
   ★ 2026-10-03 신설: 개별 랜딩/PDP(life·love·money) 모바일 메뉴를 메인 랜딩(src/app/page.js .mobile-nav) 디자인과 동일하게 통일.
   마크업: <div class="mobile-nav mnav2" id="mobileNav"> (money는 land-mobile-nav) — 기존 클래스/ID는 유지(열기·닫기·로그인 표시 JS 호환).
   페이지별 기존 .mobile-nav 규칙을 이기도록 div.mnav2 로 특이도를 높였다. */
div.mnav2{display:none;position:fixed;inset:0;z-index:10000;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:0;height:100vh;height:100dvh;padding:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:radial-gradient(120% 60% at 50% 0%,rgba(201,169,110,.10) 0%,rgba(201,169,110,0) 60%),#0a0a0a;}
div.mnav2.open{display:flex;animation:mnav2In .28s ease;}
@keyframes mnav2In{from{opacity:0}to{opacity:1}}
body:has(div.mnav2.open){overflow:hidden;}
div.mnav2 .mnav-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top,0px)) 20px 14px 24px;background:#0a0a0a;border-bottom:1px solid rgba(255,255,255,.07);}
div.mnav2 .mnav-head img{height:26px;width:auto;}
div.mnav2 .mnav-close{position:static;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.75);font-size:18px;line-height:1;cursor:pointer;}
div.mnav2 .mnav-close:active{background:rgba(201,169,110,.18);color:#c9a96e;border-color:rgba(201,169,110,.5);}
div.mnav2 .mnav-body{flex:1;padding:8px 24px 24px;}
div.mnav2 .mnav-group{margin-top:26px;}
div.mnav2 .mnav-label{display:block;font-family:var(--sans,'Noto Sans KR',sans-serif);font-size:10px;font-weight:700;letter-spacing:.3em;color:#c9a96e;opacity:.85;margin-bottom:4px;}
div.mnav2 a.mnav-item{display:flex;align-items:center;gap:14px;width:100%;padding:16px 0;border:none;border-bottom:1px solid rgba(255,255,255,.08);background:none;text-align:left;text-decoration:none;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;font-size:inherit;}
div.mnav2 a.mnav-item:hover{color:#fff;}
div.mnav2 .mnav-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--dot,#c9a96e);box-shadow:0 0 0 4px rgba(255,255,255,.04);}
div.mnav2 .mnav-text{flex:1;min-width:0;}
div.mnav2 .mnav-title{display:block;font-family:var(--serif,'Noto Serif KR',serif);font-size:18px;line-height:1.35;letter-spacing:.005em;word-break:keep-all;}
div.mnav2 .mnav-desc{display:block;margin-top:3px;font-family:var(--sans,'Noto Sans KR',sans-serif);font-size:12px;line-height:1.5;color:rgba(255,255,255,.45);word-break:keep-all;}
div.mnav2 .mnav-arrow{flex:0 0 auto;color:rgba(255,255,255,.28);font-size:15px;transition:transform .25s ease,color .25s;}
div.mnav2 a.mnav-item:active{background:rgba(255,255,255,.04);}
div.mnav2 a.mnav-item:active .mnav-arrow{color:#c9a96e;transform:translateX(3px);}
div.mnav2 .mnav-foot{padding:18px 24px calc(22px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(201,169,110,0) 0%,rgba(201,169,110,.05) 100%);}
div.mnav2 a.mnav-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;margin:0;padding:16px 20px;border-radius:999px;background:#c9a96e;color:#0a0a0a;font-family:var(--sans,'Noto Sans KR',sans-serif);font-size:13px;font-weight:700;letter-spacing:.06em;text-decoration:none;box-shadow:0 6px 22px -8px rgba(201,169,110,.55);}
div.mnav2 a.mnav-cta:hover{color:#0a0a0a;}
div.mnav2 .mnav-account{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;}
div.mnav2 .mnav-account a{font-family:var(--sans,'Noto Sans KR',sans-serif);font-size:13px;letter-spacing:.04em;color:rgba(255,255,255,.75);text-decoration:none;padding:8px 2px;}
div.mnav2 .mnav-account a.mnav-sub{color:rgba(255,255,255,.4);font-size:12px;opacity:1;}
@media (prefers-reduced-motion:reduce){div.mnav2.open{animation:none}div.mnav2 .mnav-arrow{transition:none}}
