/* header-v30: 3-bar hamburger + fullscreen black overlay + CLOSE button */

.hdr{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,0.97);border-bottom:1px solid #e0e0e0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.hdr-in{max-width:var(--wide,1280px);margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between}
.logo{font-family:var(--display);font-size:clamp(26px,3.5vw,42px);font-weight:900;letter-spacing:-0.04em;line-height:1;color:#0a0a0a;text-decoration:none;z-index:1100;position:relative}
.logo-dot{opacity:0.2}

/* Desktop nav */
.nav-links{display:flex;align-items:center;gap:clamp(16px,2vw,28px)}
.nav-links a{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:#999;text-decoration:none;transition:color 0.2s;white-space:nowrap}
.nav-links a:hover,.nav-links a.active{color:#0a0a0a}

/* 3-bar hamburger button */
.menu-btn{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:32px;height:32px;background:none;border:none;cursor:pointer;padding:0;z-index:1100;position:relative}
.menu-btn .bar{display:block;width:22px;height:2px;background:#0a0a0a;border-radius:1px;transition:transform 0.3s ease,opacity 0.3s ease,background 0.3s ease}

/* X animation */
body.menu-open .menu-btn{position:fixed;top:18px;right:24px;z-index:1200}
body.menu-open .menu-btn .bar:nth-child(1){transform:translateY(7px) rotate(45deg);background:#fff}
body.menu-open .menu-btn .bar:nth-child(2){opacity:0}
body.menu-open .menu-btn .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);background:#fff}

/* Fullscreen overlay */
.menu-overlay{position:fixed;inset:0;z-index:1050;background:#0a0a0a;display:flex;flex-direction:column;opacity:0;pointer-events:none;transition:opacity 0.3s ease}
body.menu-open .menu-overlay{opacity:1;pointer-events:auto}
body.menu-open{overflow:hidden}

.menu-top{display:flex;align-items:center;justify-content:space-between;padding:18px 24px}
.menu-logo{font-family:var(--display);font-size:clamp(22px,6vw,28px);font-weight:900;letter-spacing:-0.04em;color:#fff;text-decoration:none;line-height:1}
.menu-logo .logo-dot{opacity:0.3}

.menu-close{font-family:var(--mono,'JetBrains Mono',monospace);font-size:11px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.5);background:none;border:1px solid rgba(255,255,255,0.15);padding:8px 18px;cursor:pointer;transition:all 0.2s ease}
.menu-close:hover{color:#fff;border-color:rgba(255,255,255,0.4)}

.menu-links{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 28px;gap:0}
.menu-links a{font-family:var(--display);font-weight:900;font-size:clamp(36px,11vw,60px);line-height:1.15;text-transform:uppercase;color:#fff;text-decoration:none;padding:12px 0;border-bottom:1px solid rgba(255,255,255,0.08);letter-spacing:-0.02em;transition:color 0.2s ease}
.menu-links a:first-child{border-top:1px solid rgba(255,255,255,0.08)}
.menu-links a:hover{color:rgba(255,255,255,0.4)}

/* Responsive */
@media(max-width:960px){.nav-links{display:none}.menu-btn{display:flex}}
@media(min-width:961px){.menu-overlay{display:none!important}.menu-btn{display:none!important}}