/**
 * ヒーローセクションの背景色とテキスト色強制修正
 */

/* 背景色を緑に強制設定 - 最高優先度 */
.pricing-hero,
.service-hero,
.area-page-header,
.case-hero,
.company-hero,
.page-header {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%) !important;
    background-color: #4CAF50 !important;
}

/* より強力な背景指定 - ヘッダーやパンクズは除外 */
section.pricing-hero,
section.service-hero,  
section.area-page-header,
section.case-hero,
section.company-hero {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%) !important;
    background-color: #4CAF50 !important;
}

/* ページヘッダー（お問合せ用）のみ */
.page-header:not(.site-header):not(.breadcrumb-container) {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%) !important;
    background-color: #4CAF50 !important;
}

/* 最強の背景指定 - 特定のヒーローセクションのみ */
html body .pricing-hero,
html body .service-hero,
html body .area-page-header,  
html body .case-hero,
html body .company-hero,
html body section.pricing-hero,
html body section.service-hero,
html body section.area-page-header,
html body section.case-hero,
html body section.company-hero {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%) !important;
    background-color: #4CAF50 !important;
}

/* お問合せページのページヘッダーのみ */
html body section.page-header:not(.site-header):not(.breadcrumb-container) {
    background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%) !important;
    background-color: #4CAF50 !important;
}

/* すべてのヒーローセクションのテキストを黒色に（背景が緑なので） */
.service-hero h1,
.service-hero h1 *,
.service-hero .service-hero__title,
.service-hero .service-hero__title *,
.pricing-hero h1,
.pricing-hero h1 *,
.pricing-hero .pricing-hero__title,
.pricing-hero .pricing-hero__title *,
.area-page-header h1,
.area-page-header h1 *,
.area-page-header .area-page-header__title,
.area-page-header .area-page-header__title *,
.case-hero h1,
.case-hero h1 *,
.case-hero .case-hero__title,
.case-hero .case-hero__title *,
.company-hero h1,
.company-hero h1 *,
.company-hero .company-hero__title,
.company-hero .company-hero__title * {
    color: #212121 !important;
    text-shadow: none !important;
}

.service-hero p,
.service-hero p *,
.service-hero .service-hero__catchphrase,
.service-hero .service-hero__catchphrase *,
.pricing-hero p,
.pricing-hero p *,
.pricing-hero .pricing-hero__catchphrase,
.pricing-hero .pricing-hero__catchphrase *,
.area-page-header p,
.area-page-header p *,
.area-page-header .area-page-header__description,
.area-page-header .area-page-header__description *,
.case-hero p,
.case-hero p *,
.case-hero .case-hero__description,
.case-hero .case-hero__description *,
.company-hero p,
.company-hero p *,
.company-hero .company-hero__description,
.company-hero .company-hero__description * {
    color: #212121 !important;
    text-shadow: none !important;
    opacity: 0.8 !important;
}

/* より強力な指定 */
[class*="-hero"] h1,
[class*="-hero"] h1 * {
    color: #212121 !important;
    text-shadow: none !important;
}

[class*="-hero"] p,
[class*="-hero"] p * {
    color: #212121 !important;
    text-shadow: none !important;
    opacity: 0.8 !important;
}

/* ページヘッダー用 */
.page-header h1,
.page-header h1 *,
.page-header__title,
.page-header__title *,
.page-header__title-main,
.page-header__title-main * {
    color: #212121 !important;
    text-shadow: none !important;
}

.page-header p,
.page-header p *,
.page-header__description,
.page-header__description * {
    color: #212121 !important;
    text-shadow: none !important;
    opacity: 0.8 !important;
}

/* パンくずリストのスタイル（理想デザインに統一） - 最高優先度 */
.breadcrumb-container,
html body .breadcrumb-container,
body .breadcrumb-container {
    background: #ffffff !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #eeeeee !important;
    margin: 0 !important;
    height: auto !important;
    min-height: auto !important;
    box-sizing: border-box !important;
}

/* パンくず専用コンテナ - 競合を避けて確実に統一 */
html body .breadcrumb-container .container,
html body .breadcrumb-container .breadcrumb-wrapper {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* さらに強力な指定 */
.breadcrumb-container * {
    box-sizing: border-box !important;
}

/* より詳細な指定で他のCSSを上書き */
html body div.breadcrumb-container div.container,
html body div.breadcrumb-container div.breadcrumb-wrapper {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    width: 100% !important;
}

.breadcrumbs {
    font-size: 13px;
    color: #666;
}

.breadcrumbs__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    color: #666 !important;
    line-height: 1.5;
}

.breadcrumbs__link {
    color: #666 !important;
    text-decoration: none;
    transition: color 0.3s ease;
    padding: 3px 0;
}

.breadcrumbs__link:hover {
    color: #4CAF50 !important;
    text-decoration: underline;
}

.breadcrumbs__current {
    color: #333 !important;
    font-weight: 500;
    padding: 3px 0;
}

.breadcrumbs__separator {
    color: #999 !important;
    margin: 0 8px;
    font-size: 11px;
    user-select: none;
}