/* Shared navigation, including narrow and short viewports. */
.site-header, .board-back { display: none !important; }
.sm-bar { position:fixed; inset:0 0 auto; z-index:40; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px max(24px,env(safe-area-inset-right)) 12px max(24px,env(safe-area-inset-left)); background:rgba(244,241,234,.94); }
.sm-logo { color:#20242f; font:700 14px/1.3 "Chakra Petch","Noto Sans SC",sans-serif; letter-spacing:.03em; text-decoration:none; min-width:0; }
.sm-menu-btn,.sm-close { min-height:44px; min-width:64px; padding:10px; background:none; border:0; color:#20242f; cursor:pointer; font:600 13px/1.2 Inter,"Noto Sans SC",sans-serif; letter-spacing:.06em; }
.sm-overlay { position:fixed; inset:0; width:100%; height:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; background:transparent; overflow:hidden; color:#20242f; }
.sm-overlay::backdrop { background:rgba(8,8,12,.45); }
.sm-overlay:not([open]) { display:none; }
body.sm-open { overflow:hidden; }
.sm-links { position:absolute; inset:0 0 0 auto; width:min(560px,60vw); box-sizing:border-box; display:flex; flex-direction:column; justify-content:safe center; gap:12px; padding:88px clamp(24px,4vw,56px) max(32px,env(safe-area-inset-bottom)); background:#f4f1ea; overflow-y:auto; overscroll-behavior:contain; }
.sm-link { display:flex; align-items:center; gap:16px; padding:12px 0; min-height:44px; text-decoration:none; font:800 clamp(28px,3.7vw,48px)/1.12 "Chakra Petch","Noto Sans SC",sans-serif; color:#4c5160; letter-spacing:-.01em; }
.sm-link:hover,.sm-link:focus-visible,.sm-link[aria-current] { color:#15181f; }
.sm-txt { min-width:0; overflow-wrap:anywhere; }
.sm-link i { display:block; font:600 12px/1.5 Inter,"Noto Sans SC",sans-serif; letter-spacing:.12em; color:#565b6b; margin-top:6px; }
.sm-ap { flex:none; width:18px; height:18px; border:1px solid currentColor; border-radius:50%; }
.sm-link[aria-current] .sm-ap { background:currentColor; }
.sm-close { position:absolute; top:max(12px,env(safe-area-inset-top)); right:max(18px,env(safe-area-inset-right)); z-index:2; background:#f4f1ea; }
.sm-contact { display:flex; align-items:center; flex-wrap:wrap; gap:12px; align-self:flex-start; min-height:44px; margin-top:12px; padding:12px 0; border:0; background:none; color:#20242f; cursor:pointer; text-decoration:none; font:700 clamp(24px,3vw,36px)/1.2 "Chakra Petch","Noto Sans SC",sans-serif; }
.sm-contact span { font:600 12px/1.5 Inter,sans-serif; letter-spacing:.12em; color:#565b6b; }
.lang-switch { position:fixed; right:max(24px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); z-index:41; display:inline-flex; align-items:center; justify-content:center; min-height:44px; box-sizing:border-box; padding:10px 16px; border:0; border-radius:24px; background:#343841; color:#fff; font:600 13px/1.2 Inter,"Noto Sans SC",sans-serif; text-decoration:none; cursor:pointer; }
:where(a,button,select,[tabindex]):focus-visible { outline:2px solid #2f6fd0; outline-offset:4px; }
.skip-link { position:fixed; top:8px; left:16px; z-index:50; padding:12px 20px; background:#20242f; color:#fff; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
@media (max-width:760px) {
 .sm-bar { padding:8px max(16px,env(safe-area-inset-right)) 8px max(16px,env(safe-area-inset-left)); }
 .sm-logo { font-size:12px; letter-spacing:0; }
 .sm-menu-btn { min-width:56px; }
 .sm-links { width:100%; padding-inline:max(24px,env(safe-area-inset-left)); }
 .lang-switch { right:max(16px,env(safe-area-inset-right)); }
}
@media (max-height:500px) {
 .sm-links { justify-content:flex-start; gap:0; padding-top:64px; padding-bottom:24px; }
 .sm-link { font-size:25px; padding:8px 0; }
 .sm-link i { display:inline-block; margin:0 0 0 12px; }
 .sm-contact { font-size:24px; margin-top:4px; }
}
@media (prefers-reduced-motion:no-preference) {
 .sm-overlay[open] .sm-links { animation:menu-enter .3s cubic-bezier(.16,1,.3,1); }
 @keyframes menu-enter { from { transform:translateX(100%); } to { transform:none; } }
}

.sm-sublinks { display:flex; flex-wrap:wrap; gap:8px 22px; margin:-6px 0 4px 34px; }
.sm-sublinks a { min-height:40px; display:inline-flex; align-items:center; color:#4c5160; font-size:14px; text-decoration:underline; text-underline-offset:5px; }
@media(max-height:650px) { .sm-links { justify-content:flex-start; gap:2px; } .sm-link { font-size:clamp(24px,3.5vw,38px); padding-block:8px; } }