/* ========================================
   HEADER
======================================== */
.header{
    position:fixed;top:0;left:0;right:0;z-index:200;
    padding:24px 32px;
    display:flex;justify-content:space-between;align-items:center;
    background:transparent;
    transition:background .3s,border-bottom .3s;
}
.header.solid{
    background:rgba(250,249,247,.92);
    backdrop-filter:blur(20px);
    border-bottom:1px solid rgba(0,0,0,.05);
}
.header-logo{
    font-weight:900;font-size:14px;letter-spacing:.08em;
    color:#fff;transition:color .3s;
    display:flex;align-items:center;gap:6px;
}
.header-logo .logo-dash{font-weight:900;letter-spacing:-.02em}
.header-logo .logo-dot{color:#6b9e7e}
.header.solid .header-logo{color:#1d1d1f}
.header-nav{display:flex;gap:28px}
.header-nav a{
    font-size:11px;font-weight:500;letter-spacing:.06em;
    color:rgba(255,255,255,.7);transition:color .3s;
}
.header.solid .header-nav a{color:#888}
.header-nav a:hover{color:#fff}
.header.solid .header-nav a:hover{color:#1d1d1f}

/* ========================================
   HEADER — menu-open 状態
======================================== */
.header.menu-open{
    mix-blend-mode:normal;
    background:transparent;
    border-bottom:none;
    backdrop-filter:none;
}
.header.menu-open .header-logo{color:#fff}

/* ========================================
   HAMBURGER BUTTON
======================================== */
.hamburger{
    display:none;
    background:none;border:none;cursor:pointer;
    width:32px;height:32px;
    position:relative;
    padding:0;
    -webkit-tap-highlight-color:transparent;
}
.hamburger-line{
    display:block;
    width:20px;height:1.5px;
    background:#fff;
    position:absolute;left:6px;
    transition:transform .35s cubic-bezier(.77,0,.18,1),
                opacity .2s ease,
                background .3s;
}
.hamburger-line:nth-child(1){top:11px}
.hamburger-line:nth-child(2){top:19px}
.header.solid .hamburger-line{background:#1d1d1f}

/* open → X */
.hamburger.open .hamburger-line{background:#fff}
.hamburger.open .hamburger-line:nth-child(1){
    top:15px;transform:rotate(45deg);
}
.hamburger.open .hamburger-line:nth-child(2){
    top:15px;transform:rotate(-45deg);
}

/* ========================================
   MOBILE MENU OVERLAY
======================================== */
.mobile-menu{
    position:fixed;inset:0;z-index:150;
    background:#1d1d1f;
    display:flex;align-items:center;justify-content:center;
    opacity:0;visibility:hidden;
    overflow:hidden;
    transition:opacity .4s cubic-bezier(.77,0,.18,1),
                visibility .4s;
}
.mobile-menu.open{opacity:1;visibility:visible}

.mobile-menu-inner{
    text-align:center;
    padding:0 32px;
}
.mobile-menu-nav{
    display:flex;flex-direction:column;gap:0;
}
.mobile-menu-link{
    font-family:'Zen Old Mincho',serif;
    font-size:20px;font-weight:700;
    color:#fff;
    padding:12px 0;
    letter-spacing:.04em;
    opacity:0;transform:translateY(16px);
    transition:opacity .35s ease,transform .35s ease,color .2s;
}
.mobile-menu.open .mobile-menu-link{opacity:1;transform:none}
.mobile-menu.open .mobile-menu-link:nth-child(1){transition-delay:.08s}
.mobile-menu.open .mobile-menu-link:nth-child(2){transition-delay:.13s}
.mobile-menu.open .mobile-menu-link:nth-child(3){transition-delay:.18s}
.mobile-menu.open .mobile-menu-link:nth-child(4){transition-delay:.23s}
.mobile-menu.open .mobile-menu-link:nth-child(5){transition-delay:.28s}
.mobile-menu-link:hover{color:#6b9e7e}

.mobile-menu-footer{
    margin-top:48px;
    opacity:0;transform:translateY(12px);
    transition:opacity .4s ease .32s,transform .4s ease .32s;
}
.mobile-menu.open .mobile-menu-footer{opacity:1;transform:none}

.mobile-menu-tagline{
    font-size:12px;color:rgba(255,255,255,.3);
    letter-spacing:.1em;margin-bottom:16px;
}
.mobile-menu-sub{
    display:flex;gap:20px;justify-content:center;
}
.mobile-menu-sub a{
    font-size:11px;color:rgba(255,255,255,.45);
    letter-spacing:.06em;transition:color .2s;
}
.mobile-menu-sub a:hover{color:#fff}