/*
 * WARNING: このファイルはSWELL親テーマのクラス名に依存しています
 * SWELLメジャーアップデート時は以下を確認：
 * - .p-postList 系のクラス名
 * - .c-button 系のクラス名
 * - .l-container 系のクラス名
 * 最終確認バージョン: SWELL x.x（初期化時点では未確認）
 *
 * このファイルへの追加は最終手段。Layer 1〜3 で対応できないか検討してから記述すること。
 */

/* =========================================================
   SWELL 本文見出し装飾の無効化（固定ページ本文の自作セクション内）
   ---------------------------------------------------------
   SWELL は .post_content h2/h3/h4 にデフォルトで
   「背景ボックス（--color_htag）・上下罫線(::before)・白文字」を付与する。
   これが wp:html ブロックで組んだ自作見出し（.kc-sec-title 等）に乗ると、
   ブランドデザインが崩れる。kc- セクション配下の見出しでは打ち消す。
   見出しの色・サイズは kc- 側（base.css / patterns.css）の責務とする。
   依存クラス: .post_content（SWELL）。アップデート時は要確認。
   ========================================================= */
.post_content .kc-section h2,
.post_content .kc-section h3,
.post_content .kc-section h4 {
    background: none;
    border: 0;
    padding: 0;
}
.post_content .kc-section h2::before,
.post_content .kc-section h3::before,
.post_content .kc-section h4::before,
.post_content .kc-section h2::after,
.post_content .kc-section h3::after,
.post_content .kc-section h4::after {
    content: none;
    display: none;
}
/* SWELL の見出し色(#fff)を打ち消し、ブランド深緑へ（深緑背景の節は patterns 側で上書き）。
   併せて SWELL が付ける大きな margin-top も打ち消す（.kc-sec-title は直前 eyebrow が余白を作る）。
   ※ post/work h4・insight h2 等、モックで margin-top を持つ見出しは patterns 側の値が活きる
     （patterns は swell-parent より後に読み込まれ、同特異度で勝つ）。 */
.post_content .kc-sec-title { color: var(--kc-green-deep); margin-top: 0; }

/* =========================================================
   PCグローバルナビ：文字拡大＋自作ホバー（SWELL .c-gnav 起点）
   ---------------------------------------------------------
   SWELL グローバルナビの実体は ul.c-gnav > li.menu-item > a > span.ttl。
   ul に独自クラスを注入できなかった（SWELLが c-gnav を固定出力）ため、
   .c-gnav を起点にする＝SWELL内部クラス依存。方針書 原則2の例外として
   このファイル（overrides.css）に集約する。
   対象は通常メニュー項目のみ。CTA（.kc-nav-cta）は対象外＝現状維持。
   依存クラス: .c-gnav / .ttl（SWELL）, .menu-item（WP標準）。アップデート時は要確認。

   (1) SWELL標準ホバー装飾（下線等）の打ち消し
   ホバーの下線/ボーダーは `.c-gnav>.menu-item>a::after` に出る
   （カスタマイザーの「ホバーエフェクト」で width/transform/background が
   wp_head にインライン出力される）。display:none で無効化する。
   特異度メモ: SWELL base ::after=(0,2,2)/:hover::after=(0,3,2) を、
   `.c-gnav>li.menu-item:not(.kc-nav-cta)`＋:hover で上回る（base 0,3,3 / hover 0,4,3）。 */
.c-gnav > li.menu-item:not(.kc-nav-cta) > a::before,
.c-gnav > li.menu-item:not(.kc-nav-cta) > a::after,
.c-gnav > li.menu-item:not(.kc-nav-cta) > a:hover::before,
.c-gnav > li.menu-item:not(.kc-nav-cta) > a:hover::after {
    content: none;
    display: none;
}

/* (2) 文字サイズ 14px→16px ＋ 項目間余白の拡張 ＋ ホバーで中央から拡大。
   SWELL `.c-gnav>.menu-item>a .ttl{font-size:14px}`(0,3,1) を (0,4,2) で上書き。
   項目間の余白は SWELL `.c-gnav>.menu-item>a{padding:0 12px}`(0,2,1) の左右paddingを
   (0,3,2) で 18px に拡張（上下は SWELL の指定を維持＝padding-inline のみ変更）。
   通常色は --kc-ink-soft を明示（背景グラデ非対応ブラウザのフォールバックも兼ねる）。 */
.c-gnav > li.menu-item:not(.kc-nav-cta) > a {
    padding-inline: 18px;
}
.c-gnav > li.menu-item:not(.kc-nav-cta) > a .ttl {
    display: inline-block;          /* transform を効かせる */
    transform-origin: center;
    font-size: 16px;
    color: var(--kc-ink-soft);
    transition: transform .3s var(--kc-ease);
}
.c-gnav > li.menu-item:not(.kc-nav-cta) > a:hover .ttl {
    transform: scale(1.06);
}

/* (3) ホバーでブランドグリーンが左→右に走る（background-clip:text）。
   背景は 200%幅＝[左半分: 深緑→中緑→葉グリーン][右半分: 通常色(ベタ)]。
   通常は右半分(--kc-ink-soft)を表示、ホバーで左半分へスライド＝グリーンが左から右へ。
   日本語でも文字欠け・背景はみ出しなし。非対応ブラウザでは適用されず(2)の色のみ効く。 */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    .c-gnav > li.menu-item:not(.kc-nav-cta) > a .ttl {
        background-image: var(--kc-grad-nav-text);
        background-size: 200% 100%;
        background-position: 100% 0;     /* 通常: 右半分=ベタの通常色 */
        background-repeat: no-repeat;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        transition: background-position .5s var(--kc-ease),
                    transform .3s var(--kc-ease);
    }
    .c-gnav > li.menu-item:not(.kc-nav-cta) > a:hover .ttl {
        background-position: 0 0;        /* ホバー: 左半分=グリーンへスライド */
    }
}

/* (4) モーション軽減設定では拡大・スライドを止める */
@media (prefers-reduced-motion: reduce) {
    .c-gnav > li.menu-item:not(.kc-nav-cta) > a .ttl,
    .c-gnav > li.menu-item:not(.kc-nav-cta) > a:hover .ttl {
        transition: none;
        transform: none;
    }
}

/* =========================================================
   フロントページ：ヒーロー上部の余白を詰める
   ---------------------------------------------------------
   SWELL は `.top #content{padding-top:4em}` で本文上部に余白を入れる。
   全幅ヒーローをヘッダー直下に詰めたいので 0 にする。
   `.top` / `.home` はフロントページ（is_front_page）のみ #body_wrap に付与され、
   他の固定ページには付かない＝それらの上部余白には影響しない。
   `.home.top` で特異度を上げ、SWELL の `.top #content`（1,1,0）を確実に上書き。
   依存クラス: .top / .home / #content（SWELL/WP）。アップデート時は要確認。
   ========================================================= */
.home.top #content { padding-top: 0; }

/* =========================================================
   固定ページ：SWELL標準のページ見出し（.c-pageTitle）を非表示
   ---------------------------------------------------------
   各下層ページは独自の phead（eyebrow＋h1）を見出しに使うため、SWELLが
   本文上に出す `.c-pageTitle`（「サービス」等）は重複。非表示にする。
   パンくず（.p-breadcrumb）はナビ/SEOのため残す（別要素・影響なし）。
   `.page` は固定ページのみに付与され、投稿（.single）には付かないため
   ブログ記事のタイトルには影響しない。フロントpage（.c-pageTitle無し）も無影響。
   依存クラス: .page / .c-pageTitle（WP/SWELL）。アップデート時は要確認。
   ========================================================= */
.page .c-pageTitle { display: none; }

/* =========================================================
   事業承継ページ：料金カードの階段（段差 margin-bottom）を SWELL の
   last-child リセットから守る
   ---------------------------------------------------------
   SWELL は `.post_content div > :last-child { margin-bottom:0 !important }` で
   本文内の各最終要素の下余白を消す。料金3カードの3枚目（.kc-su-pcard.s3）は
   親 .kc-su-psteps の last-child に当たるため、階段の段差 margin-bottom:52px が
   この !important に負けて段差が消える（2枚目 .s2 は中間子で対象外＝段差は効く）。
   ここだけ同等の !important ＋十分な特異度（0,3,0 > SWELL 0,2,1）で段差を復活。
   モバイル（760px以下）は階段自体を解除するので 0 に戻す。
   patterns.css 側はマジックナンバー回避のため触らず、SWELL依存の打ち消しは本ファイルに集約。
   依存クラス: .post_content（SWELL）。アップデート時は要確認。
   ========================================================= */
.post_content .kc-su-psteps .kc-su-pcard.s3 { margin-bottom: 52px !important; }
@media (max-width: 760px) {
    .post_content .kc-su-psteps .kc-su-pcard.s3 { margin-bottom: 0 !important; }
}

/* =========================================================
   フッター リデザイン（SWELL .l-footer ウィジェットを土台に）
   ---------------------------------------------------------
   構成:
   - 3列領域＝薄グレー面(--kc-sand-soft・全幅)。中身は .l-container で中央幅を維持
   - 左列(box1)＝深緑カード(--kc-green-deep・直角)。画面左端までフルブリード(100vw基準)、
     テキストは中央コンテンツ幅の左列位置に収める。PCでは本文との境界にまたがるせり上げ
   - 中央(box2)＝列見出し「SITE MAP」＋ナビ（各リンク下罫線・ホバーで葉グリーン＆右へ）
   - 右(box3)＝列見出し「CONTACT」＋深緑ボタン(.kc-btn-primary流用/色は深緑上書き)＋控えめリンク
   - 最下部コピーライトのみ深緑帯(--kc-green-deep)
   色は薄グレー面＋深緑＋グレー文字のみ（色を足さない）。深緑は --kc-green-deep に統一。
   HTMLはフッター1/2/3ウィジェット(カスタムHTML)側に kc-foot-* で配置する。
   依存(SWELL): .l-footer / .l-footer__widgetArea / .w-footer / .w-footer__box
               / .l-footer__foot / .copyright / .l-container
   ========================================================= */

/* 0-a. 本文とフッターの間隔（フッター上の余白）。SWELL既定 #content margin-bottom(96px)を
   上書きして広げ、フッター左カードのせり上げ(PC 80px)がこの余白の中で本文寄りまで持ち上がる。
   overrides.css は最後に読み込むため #content 単独で後勝ちできる想定。効かなければ特異度を上げる。 */
#content { margin-bottom: 200px; }

/* 0-b. フッター全体の深緑地を解除／左フルブリードの横スクロールバーを出さない */
.l-footer { background: transparent; overflow-x: clip; }

/* 1. 3列領域＝薄グレー面（全幅）。中身(.l-container)は中央コンテンツ幅で維持 */
.l-footer .l-footer__widgetArea { background: var(--kc-sand-soft); padding: 0; }
.l-footer .w-footer {
    align-items: stretch;              /* 左の深緑カードを列の高さいっぱいに（下端をグレー面と揃える） */
    gap: 48px;
    padding-block: 64px 60px;          /* 上下余白のみ。左右は SWELL .l-container(48px) を維持 */
}

/* 2. 左列(box1)＝深緑カード・左端フルブリード・PCせり上げ ------------------ */
.l-footer .w-footer__box:first-child {
    position: relative;
    margin-top: -144px;                /* PCせり上げ：上余白64を超えて本文へ約80px食い込む（#content下余白200pxと呼応） */
    padding: 40px 44px 40px 0;         /* テキストは中央幅の左端に（左padは0） */
    color: #fff;
}
/* 深緑の面：箱の右端 → 画面左端まで（100vw基準・直角）。溢れ分は overflow-x:clip が隠す */
.l-footer .w-footer__box:first-child::before {
    content: ""; position: absolute; z-index: 0;
    top: 0; bottom: 0; right: 0;
    left: calc(50% - 50vw);
    background: var(--kc-green-deep);
}
.l-footer .w-footer__box:first-child > * { position: relative; z-index: 1; }

.l-footer .kc-foot-brand {
    font-size: 15px; font-weight: 700; color: #fff;
    line-height: 1.6; margin: 0 0 12px;
}
.l-footer .kc-foot-meta {
    font-size: 13px; line-height: 1.9;
    color: rgba(255, 255, 255, .82);
    margin: 0 0 20px;
}
.l-footer .kc-foot-map {
    aspect-ratio: 16 / 10;
    border-radius: var(--kc-radius-card-sm);
    overflow: hidden;
    background: rgba(255, 255, 255, .06);
}
.l-footer .kc-foot-map iframe { width: 100%; height: 100%; display: block; border: 0; }

/* 3. 中央(box2)/右(box3)＝グレー面上の列。見出し＋リンク --------------------- */
.l-footer .kc-foot-col { padding-top: 6px; }
.l-footer .kc-foot-h {
    font-family: var(--kc-font-en);
    font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
    color: var(--kc-ink-soft);
    margin: 0 0 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--kc-sand);
}
/* SITE MAP ナビ：各リンクに下罫線／ホバーで葉グリーン＆少し右へ */
.l-footer .kc-foot-nav a {
    display: block;
    padding: 12px 0;
    color: var(--kc-ink);
    font-size: 14px; text-decoration: none;
    border-bottom: 1px solid var(--kc-sand);
    transition: color .2s ease, transform .2s ease;
}
.l-footer .kc-foot-nav a:hover { color: var(--kc-green-leaf); transform: translateX(4px); }

/* CONTACT：深緑ボタン（.kc-btn-primary 流用＋色を深緑単色に上書き）＋控えめリンク */
.l-footer .kc-foot-btn {
    display: inline-flex;
    background: var(--kc-green-deep);   /* グラデでなく深緑単色（確定事項4） */
    margin-bottom: 18px;
}
.l-footer .kc-foot-sublink {
    display: inline-block;
    color: var(--kc-ink-soft);
    font-size: 13px; text-decoration: none;
    transition: color .2s ease, transform .2s ease;
}
.l-footer .kc-foot-sublink:hover { color: var(--kc-green-leaf); transform: translateX(4px); }

/* 4. コピーライト帯＝深緑(--kc-green-deep)。中身は .l-container で中央幅 -------- */
.l-footer .l-footer__foot { background: var(--kc-green-deep); border-top: 0; }
.l-footer .copyright {
    font-family: var(--kc-font-en);
    font-size: 12px; letter-spacing: .04em;
    color: rgba(255, 255, 255, .55);
    padding-block: 22px;
}

/* 5. レスポンシブ：SPは縦積み・せり上げ無効・左カードは全幅深緑 ------------- */
@media (max-width: 768px) {
    #content { margin-bottom: 120px; }   /* SPは200pxだと過剰。せり上げ無効なので純粋な余白 */
    .l-footer .w-footer { flex-direction: column; gap: 0; padding-block: 48px 40px; }
    .l-footer .w-footer__box:first-child {
        margin-top: 0;                 /* せり上げ無効 */
        padding: 32px 0 34px;
        margin-bottom: 34px;
    }
    .l-footer .w-footer__box:first-child::before {
        left: calc(50% - 50vw); right: calc(50% - 50vw);   /* 全幅深緑 */
    }
    .l-footer .w-footer__box:not(:first-child) + .w-footer__box { margin-top: 30px; }
}

/* =========================================================
   会社案内⑦会社概要テーブル（.kc-ab-ctable）
   SWELL の .post_content table / th / td 装飾（全周border・th背景・padding .5em）を
   打ち消し、モックの「下線のみ」のクリーンな体裁に戻す。
   依存クラス: .post_content（SWELL）。.kc-ab-* を冠して特異度で親テーマに勝つ。
   ========================================================= */
.post_content .kc-ab-ctable { width: 100%; border-collapse: collapse; }
.post_content .kc-ab-ctable th,
.post_content .kc-ab-ctable td {
    text-align: left;
    padding: 18px 4px;
    border: none;
    border-bottom: 1px solid var(--kc-sand);
    font-size: 14px;
    vertical-align: top;
    line-height: 1.9;
}
.post_content .kc-ab-ctable th {
    width: 140px;
    color: var(--kc-green-deep);
    font-weight: 700;
    white-space: nowrap;
    background: transparent;
}
.post_content .kc-ab-ctable td { color: var(--kc-ink-soft); }
@media (max-width: 560px) {
    .post_content .kc-ab-ctable th,
    .post_content .kc-ab-ctable td { display: block; width: 100%; border-bottom: none; padding: 8px 4px; }
    .post_content .kc-ab-ctable td { padding-top: 0; padding-bottom: 18px; border-bottom: 1px solid var(--kc-sand); }
}

/* =========================================================
   ブログ記事本文（single）を kc トーンに寄せる
   ---------------------------------------------------------
   対象は投稿のみ（body.single）。固定ページ（.page＝kc LP群）や kcセクションには
   影響しない。範囲は「見出し／本文行長 ~680px／流れる本文の両端揃え／blockquote
   （緑トーン）／figure+figcaption」に限定。SWELL標準で足りる箇所は触らない。
   SWELLクラス（.post_content）依存の上書きのため、本ファイル（overrides）に集約。
   依存クラス: .single / .post_content（WP/SWELL）。アップデート時は要確認。
   ========================================================= */

/* 行長：テキスト系ブロックを可読上限 ~680px に絞って中央寄せ。
   画像・図・table 等はSWELLのコンテンツ幅のまま（絞らない）。 */
.single .post_content > p,
.single .post_content > h2,
.single .post_content > h3,
.single .post_content > h4,
.single .post_content > ul,
.single .post_content > ol,
.single .post_content > blockquote {
    max-width: 680px;
    margin-inline: auto;
}

/* 本文 */
.single .post_content { color: var(--kc-ink); }
.single .post_content > p {
    font-size: 16px;
    line-height: 2;
    margin-bottom: 1.6em;
    color: var(--kc-ink);
}
.single .post_content > ul,
.single .post_content > ol { line-height: 1.95; }
.single .post_content li { margin-bottom: .4em; }
/* 流れる本文は PC 幅で両端揃え（SPは間延び回避で左揃え＝既定のまま）。既存 .kc-*-body と同流儀。 */
@media (min-width: 768px) {
    .single .post_content > p { text-align: justify; word-break: auto-phrase; }
}

/* 見出し：SWELL標準の箱組み装飾を外し、記事用の落ち着いた深緑見出しに。
   （過剰装飾にしない：h2＝下ヘアライン、h3＝左に葉グリーンのアクセント） */
.single .post_content h2,
.single .post_content h3,
.single .post_content h4 {
    color: var(--kc-green-deep);
    font-weight: 700;
    background: none;
    border: none;
}
.single .post_content h2::before,
.single .post_content h2::after,
.single .post_content h3::before,
.single .post_content h3::after,
.single .post_content h4::before,
.single .post_content h4::after {
    content: none;
    display: none;
    background: none;
    border: none;
}
.single .post_content h2 {
    font-size: clamp(20px, 3vw, 26px);
    line-height: 1.5;
    margin: 2.4em auto 1em;
    padding-bottom: .5em;
    border-bottom: 2px solid var(--kc-sand);
}
.single .post_content h3 {
    font-size: clamp(17px, 2.2vw, 20px);
    line-height: 1.6;
    margin: 2.2em auto .9em;
    padding-left: 14px;
    border-left: 3px solid var(--kc-green-leaf);
}
.single .post_content h4 {
    font-size: 16px;
    line-height: 1.6;
    margin: 1.8em auto .8em;
}

/* 引用：SWELLのグレー箱 → 緑トーン（左に葉グリーンの帯、淡い緑地） */
.single .post_content blockquote {
    background: rgba(91, 138, 60, .06);
    border-left: 3px solid var(--kc-green-leaf);
    border-radius: 0 var(--kc-radius-card-sm) var(--kc-radius-card-sm) 0;
    padding: 20px 24px;
    margin: 1.8em auto;
    color: var(--kc-ink);
}
.single .post_content blockquote > :not(:last-child) { margin-bottom: .6em; }
.single .post_content blockquote cite {
    display: block;
    margin-top: 1em;
    font-size: .85em;
    font-style: normal;
    color: var(--kc-ink-soft);
}

/* 図版＋キャプション */
.single .post_content figure { margin: 2em auto; }
.single .post_content figure img { border-radius: var(--kc-radius-card-sm); }
.single .post_content figcaption {
    margin-top: 10px;
    font-size: 13px;
    color: var(--kc-ink-soft);
    text-align: center;
    line-height: 1.7;
}

/* 本文リンク（ボタン以外）は葉グリーン暗で控えめに */
.single .post_content a:not(.wp-block-button__link):not(.wp-element-button) {
    color: var(--kc-green-leaf-dark);
    text-underline-offset: 2px;
}
