/* ========================================
   Header CSS - ヘッダースタイル
   ======================================== */

/* Glassmorphism Header */
.glass-header {
    background: rgba(249, 248, 246, 0.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

/* ヘッダーコンテナ */
header {
    position: fixed;
    width: 100%;
    z-index: 50;
    border-bottom: 1px solid rgba(229, 231, 235, 0.5);
}

header .container {
    height: 5rem;
}

@media (min-width: 1024px) {
    header .container {
        height: 6rem;
    }
}

/* ヘッダーロゴ */
header .logo {
    flex-shrink: 0;
    margin-right: 2rem;
}

/* ヘッダーナビゲーション */
header nav {
    display: none;
}

@media (min-width: 1024px) {
    header nav {
        display: flex;
        align-items: center;
        gap: 2rem;
        flex-wrap: nowrap;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.1em;
        color: var(--iron-gray);
    }
}

@media (min-width: 1280px) {
    header nav {
        gap: 3rem;
    }
}

/* アクティブなナビゲーションリンク */
header nav .nav-link.active,
header nav .nav-link.text-bronze-accent {
    color: var(--bronze-accent);
}

/* モバイルメニューボタン */
header .mobile-menu-btn {
    display: block;
    padding: 0.5rem;
    color: var(--deep-slate);
    background: none;
    border: none;
    cursor: pointer;
}

@media (min-width: 1024px) {
    header .mobile-menu-btn {
        display: none;
    }
}

/* スクロール時のヘッダー */
header.scrolled {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

header.scrolled .container {
    height: 5rem !important;
}