/**
 * Japanese Single Solution (Solution Detail) Styles
 * 日本語ソリューション詳細ページスタイル
 * 
 * Design: Clean, refined, quality-focused design for Japanese market
 * Target: .lang-ja.single-solution body class
 * 
 * This stylesheet applies Japanese design aesthetics to the single solution page
 * using refined colors and elegant typography.
 */

/* ============================================================================
   日本市場デザインシステム - Japanese Market Design System
   ============================================================================ */

/* 日本市場の配色 - Japanese Market Blue Color Palette (Matching Homepage) */
body.lang-ja.single-solution {
    /* 主色調 - 深蓝色系 (Deep Blue Color Scheme - Matching Homepage) */
    --jp-primary-dark: #1e3c72;        /* 深蓝 - Deep Blue (Homepage Hero) */
    --jp-primary-dark-rgb: 30, 60, 114;
    
    --jp-primary: #2a5298;             /* 中蓝 - Medium Blue (Homepage Hero) */
    --jp-primary-rgb: 42, 82, 152;
    
    --jp-primary-light: #1e88e5;       /* 亮蓝 - Bright Blue (Homepage Buttons) */
    --jp-primary-light-rgb: 30, 136, 229;
    
    --jp-primary-pale: #e3f2fd;        /* 极浅蓝 - Pale Blue */
    --jp-primary-pale-rgb: 227, 242, 253;
    
    /* 中性色 - Neutral Colors */
    --jp-text-primary: #2C3E50;        /* 主要テキスト - Primary Text */
    --jp-text-secondary: #5A6C7D;      /* 二次テキスト - Secondary Text */
    --jp-text-light: #95A5A6;          /* 辅助文字 - Light Text */
    
    /* 背景色 - Background Colors */
    --jp-bg-white: #FFFFFF;            /* 白背景 - White Background */
    --jp-bg-light: #F8F9FA;            /* 明るい背景 - Light Background */
    --jp-bg-gray: #ECF0F1;             /* 灰色背景 - Gray Background */
    
    /* 边框色 - Border Colors */
    --jp-border-light: #D5DBDB;        /* ボーダー - Border */
    
    /* 阴影效果 - Shadow Effects */
    --jp-shadow-sm: 0 2px 8px rgba(30, 60, 114, 0.08);
    --jp-shadow-md: 0 4px 16px rgba(30, 60, 114, 0.12);
    --jp-shadow-lg: 0 8px 24px rgba(30, 60, 114, 0.16);
}

/* ============================================================================
   Solution Hero Section - ソリューションヒーローセクション
   ============================================================================ */

/* 日本語ソリューション詳細ページの Hero 区域 */
body.lang-ja.single-solution .solution-hero-new {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important;
    padding: 70px 0 60px !important;
}

/* パンくずリスト - 日本語スタイル */
body.lang-ja.single-solution .breadcrumb-new {
    color: rgba(255, 255, 255, 0.95) !important;
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .breadcrumb-new a {
    color: rgba(255, 255, 255, 0.95) !important;
}

body.lang-ja.single-solution .breadcrumb-new a:hover {
    color: #1e88e5 !important;
}

/* ソリューションタイトル - 日本語フォント最適化 */
body.lang-ja.single-solution .solution-title-new {
    color: #ffffff !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.03em !important;
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
}

/* 業界バッジ - 日本語スタイル */
body.lang-ja.single-solution .industry-badge-new {
    background: rgba(30, 136, 229, 0.2) !important;
    border: 1px solid #1e88e5 !important;
    color: #fff !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .industry-badge-new:hover {
    background: rgba(30, 136, 229, 0.3) !important;
    border-color: #1e88e5 !important;
}

/* ============================================================================
   Featured Image Section - 特色画像セクション
   ============================================================================ */

body.lang-ja.single-solution .solution-featured-image-new {
    background: linear-gradient(to bottom, #f8f9fa 0%, #ffffff 100%) !important;
}

body.lang-ja.single-solution .featured-image-wrapper {
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(30, 60, 114, 0.15) !important;
}

/* ============================================================================
   Content Section - コンテンツセクション
   ============================================================================ */

body.lang-ja.single-solution .solution-content-new {
    background: #ffffff !important;
}

body.lang-ja.single-solution .solution-section-new {
    background: var(--jp-bg-light) !important;
    border-left: 4px solid #2a5298 !important;
    box-shadow: var(--jp-shadow-md) !important;
    border-radius: 14px !important;
}

body.lang-ja.single-solution .solution-section-new h2 {
    color: #1e3c72 !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
}

body.lang-ja.single-solution .solution-section-new h2::after {
    background: linear-gradient(90deg, #1e3c72 0%, #1e88e5 100%) !important;
}

body.lang-ja.single-solution .section-icon {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important;
    box-shadow: 0 8px 24px rgba(30, 60, 114, 0.35) !important;
    color: #ffffff !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    flex-shrink: 0 !important;
}

body.lang-ja.single-solution .section-icon .dashicons {
    font-size: 28px !important;
    width: 28px !important;
    height: 28px !important;
    color: #ffffff !important;
}

body.lang-ja.single-solution .section-content h2 {
    color: #1e3c72 !important;
}

/* Benefits List - 利点リスト */
body.lang-ja.single-solution .benefits-list-new li {
    border-bottom: 1px solid var(--jp-border-light) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.01em !important;
}

body.lang-ja.single-solution .benefit-icon {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important;
    box-shadow: 0 4px 12px rgba(30, 60, 114, 0.3) !important;
    color: #ffffff !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    flex-shrink: 0 !important;
}

body.lang-ja.single-solution .benefit-icon .dashicons {
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
    color: #ffffff !important;
}

/* Entry Content - エントリーコンテンツ */
body.lang-ja.single-solution .entry-content {
    color: var(--jp-text-secondary) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.01em !important;
}

/* ============================================================================
   Product Recommendation Section - 製品推奨セクション
   ============================================================================ */

body.lang-ja.single-solution .solution-product-recommendation {
    background: linear-gradient(135deg, #e3f2fd 0%, #ffffff 100%) !important;
    border-top: 4px solid #2a5298 !important;
    box-shadow: var(--jp-shadow-md) !important;
    border-radius: 14px !important;
}

body.lang-ja.single-solution .recommendation-header h2 {
    color: #1e3c72 !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
}

body.lang-ja.single-solution .recommendation-icon {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important;
    box-shadow: 0 8px 24px rgba(30, 60, 114, 0.35) !important;
    color: #ffffff !important;
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
    max-width: 64px !important;
    max-height: 64px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    flex-shrink: 0 !important;
}

body.lang-ja.single-solution .recommendation-icon .dashicons {
    font-size: 32px !important;
    width: 32px !important;
    height: 32px !important;
    color: #ffffff !important;
}

body.lang-ja.single-solution .recommendation-subtitle {
    color: var(--jp-text-secondary) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .recommendation-card {
    background: #ffffff !important;
    border: 2px solid #e8eaed !important;
    border-radius: 10px !important;
}

body.lang-ja.single-solution .recommendation-card:hover {
    border-color: #2a5298 !important;
    box-shadow: 0 20px 40px rgba(42, 82, 152, 0.15) !important;
}

body.lang-ja.single-solution .recommendation-btn {
    background: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .recommendation-btn:hover {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%) !important;
    box-shadow: 0 8px 20px rgba(30, 136, 229, 0.4) !important;
}

body.lang-ja.single-solution .recommendation-title {
    color: var(--jp-text-primary) !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .recommendation-excerpt {
    color: var(--jp-text-secondary) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.01em !important;
}

body.lang-ja.single-solution .recommendation-category {
    color: #2a5298 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .view-all-products {
    background: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%) !important;
    color: #fff !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .view-all-products:hover {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%) !important;
    box-shadow: 0 12px 28px rgba(30, 136, 229, 0.4) !important;
}

/* ============================================================================
   CTA Section - CTAセクション
   ============================================================================ */

body.lang-ja.single-solution .solution-cta-new {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important;
    border-radius: 14px !important;
}

body.lang-ja.single-solution .solution-cta-new h3 {
    color: #ffffff !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
}

body.lang-ja.single-solution .solution-cta-new p {
    color: rgba(255, 255, 255, 0.95) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .solution-cta-new .btn-primary {
    background: #ffffff !important;
    color: #1e3c72 !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .solution-cta-new .btn-primary:hover {
    background: #f5f5f5 !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35) !important;
}

/* CTA アイコン - 円形修正 */
body.lang-ja.single-solution .cta-icon {
    width: 80px !important;
    height: 80px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 20px !important;
}

body.lang-ja.single-solution .cta-icon .dashicons {
    font-size: 40px !important;
    width: 40px !important;
    height: 40px !important;
    color: #ffffff !important;
}

/* CTA コンテンツレイアウト - 中央揃え */
body.lang-ja.single-solution .cta-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

/* ボタン中央揃え */
body.lang-ja.single-solution .solution-cta-new .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

/* ============================================================================
   Products Grid - 製品グリッド
   ============================================================================ */

body.lang-ja.single-solution .products-grid-new {
    gap: 28px !important;
}

body.lang-ja.single-solution .product-card-new {
    background: #ffffff !important;
    border: 2px solid #e8eaed !important;
    border-radius: 10px !important;
}

body.lang-ja.single-solution .product-card-new:hover {
    border-color: #2a5298 !important;
    box-shadow: 0 12px 40px rgba(42, 82, 152, 0.15) !important;
}

body.lang-ja.single-solution .product-title-card {
    color: var(--jp-text-primary) !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .product-title-card a:hover {
    color: #2a5298 !important;
}

body.lang-ja.single-solution .product-excerpt-card {
    color: var(--jp-text-secondary) !important;
    line-height: 1.8 !important;
    letter-spacing: 0.01em !important;
}

body.lang-ja.single-solution .product-link-new {
    color: #1e88e5 !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

body.lang-ja.single-solution .product-link-new:hover {
    color: #1e3c72 !important;
}

/* ============================================================================
   Responsive Design - レスポンシブデザイン
   ============================================================================ */

@media (max-width: 768px) {
    body.lang-ja.single-solution .solution-title-new {
        font-size: 28px !important;
        letter-spacing: 0.02em !important;
    }
    
    body.lang-ja.single-solution .solution-section-new h2 {
        font-size: 24px !important;
    }
    
    body.lang-ja.single-solution .recommendation-header h2 {
        font-size: 26px !important;
    }
    
    body.lang-ja.single-solution .solution-cta-new h3 {
        font-size: 26px !important;
    }
}

@media (max-width: 640px) {
    body.lang-ja.single-solution .solution-title-new {
        font-size: 22px !important;
        letter-spacing: 0.01em !important;
    }
    
    body.lang-ja.single-solution .solution-section-new h2 {
        font-size: 20px !important;
    }
    
    body.lang-ja.single-solution .recommendation-header h2 {
        font-size: 22px !important;
    }
    
    body.lang-ja.single-solution .solution-cta-new h3 {
        font-size: 22px !important;
    }
}
