/* ===== 共通テーマスタイル ===== */
/* このファイルは全ページで共通のヘッダー、フッター、ボタンのスタイルを定義します */

/* カラー変数のオーバーライド - プロフェッショナルな配色 */
:root {
    --color-primary: #1a365d !important;      /* ディープネイビー - 信頼・高級感 */
    --color-secondary: #0f2442 !important;    /* ダークネイビー */
    --color-accent: #3182ce !important;       /* ミディアムブルー - 落ち着いたアクセント */
    --color-text: #1a202c !important;         /* チャコール */
    --color-text-medium: #4a5568 !important;  /* ミディアムグレー */
    --color-bg-section: #f7fafc !important;   /* 極薄グレー */
}

/* ボディの洗練 */
body {
    letter-spacing: 0.02em !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* ===== ヘッダーの高級感 ===== */
.header {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
    transition: all 0.3s ease !important;
}

.header.header-scrolled {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

/* ナビゲーションリンク */
.nav-link {
    font-weight: 500 !important;
    letter-spacing: 0.03em !important;
    color: #2d3748 !important;
    transition: color 0.2s ease !important;
}

.nav-link:hover {
    color: #1a365d !important;
}

/* company-page スクロール前のナビリンク（白文字） */
body.company-page .header:not(.header-scrolled) .nav-link {
    color: #ffffff !important;
}

body.company-page .header:not(.header-scrolled) .nav-link:hover {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* ===== ボタンの洗練 ===== */
.btn-primary {
    background: linear-gradient(135deg, #1a365d 0%, #2c5282 100%) !important;
    border: none !important;
    box-shadow: 0 2px 4px rgba(26, 54, 93, 0.15), 0 8px 16px rgba(26, 54, 93, 0.1) !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
    transition: all 0.3s ease !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #2c5282 0%, #3182ce 100%) !important;
    box-shadow: 0 4px 8px rgba(26, 54, 93, 0.2), 0 12px 24px rgba(26, 54, 93, 0.15) !important;
    transform: translateY(-1px) !important;
}

.btn-secondary,
.btn-secondary-dark {
    background: transparent !important;
    border: 1.5px solid #1a365d !important;
    color: #1a365d !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
}

.btn-secondary:hover,
.btn-secondary-dark:hover {
    background: #1a365d !important;
    color: white !important;
}

/* ===== セクションタイトルの高級感 ===== */
.section-title {
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    color: #1a202c !important;
}

.section-subtitle {
    color: #3182ce !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
}

/* ===== フッターの洗練 ===== */
.footer {
    background: #1a365d !important;
    padding: 40px 0 20px !important;
}

.footer-logo {
    margin-bottom: 10px !important;
}

.footer-content {
    margin-bottom: 20px !important;
}

.footer-logo-image {
    height: 80px !important;
    width: auto !important;
    max-width: 240px !important;
}

.footer-nav-link {
    color: #ffffff !important;
    transition: opacity 0.2s ease !important;
}

.footer-nav-link:hover {
    opacity: 0.8 !important;
}

.footer-nav {
    color: #ffffff !important;
}

.footer-nav-item {
    color: #ffffff !important;
}

.footer-content {
    color: #ffffff !important;
}

.footer-copyright {
    color: rgba(255, 255, 255, 0.7) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.footer-copyright p {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* ===== カードの洗練 ===== */
.case-card,
.news-card,
.feature-card {
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.3s ease !important;
}

.case-card:hover,
.news-card:hover,
.feature-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e0 !important;
}

/* ===== フォームの洗練 ===== */
.form-group input,
.form-group textarea,
.form-group select {
    border: 1.5px solid #e2e8f0 !important;
    transition: all 0.2s ease !important;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    border-color: #3182ce !important;
    box-shadow: 0 0 0 3px rgba(49, 130, 206, 0.1) !important;
}

/* ===== CTAセクションの色統一 ===== */
.cta-section {
    background: linear-gradient(135deg, #0f2442 0%, #1a365d 100%) !important;
    box-shadow: 0 8px 24px rgba(26, 54, 93, 0.25) !important;
}

.cta-section h2 {
    color: #ffffff !important;
}

.cta-section p {
    color: rgba(255, 255, 255, 0.8) !important;
}

.cta-section-enhanced {
    background: linear-gradient(135deg, #0f2442 0%, #1a365d 100%) !important;
}

/* カテゴリバッジの色統一 */
.news-article-category {
    background: #1a365d !important;
}

/* ===== 記事ページのコンテナ調整 ===== */
.news-article-hero .container,
.news-article-content .container,
.news-page-hero .container,
.news-list-section .container {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

@media (max-width: 768px) {
    .news-article-hero .container,
    .news-article-content .container,
    .news-page-hero .container,
    .news-list-section .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}