/* ============================================================
   Diary 求人サイト — Footer（雑誌の奥付風 3カラム）
   - Follow us セクション + コンセプト/3つの安心と並べて違和感ゼロを目標
   - 角丸/影/グラデなし、くすみカラー統一
   - フォント/色変数は hero.css の :root を流用
   ============================================================ */

/* ============================================================
   セクション本体
   ============================================================ */
.rc-h2-footer {
    background: var(--rch2-bg-base);            /* #FAF7F2 */
    border-top: 0.5px solid var(--rch2-line);   /* 上下を細罫線で画定 */
    border-bottom: 0.5px solid var(--rch2-line);
    padding: 100px 6rem;
}
.rc-h2-footer-inner {
    max-width: 1200px;
    margin: 0 auto;
}

/* ============================================================
   3カラム グリッド
   - 左 1.3fr / 中央 1fr / 右 1fr
   - gap 60px
   ============================================================ */
.rc-h2-footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: 60px;
    align-items: start;
}

/* ============================================================
   左カラム: ブランド + 店舗情報
   ============================================================ */
.rc-h2-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.rc-h2-footer-logo-link {
    display: inline-block;
    text-decoration: none;
    color: var(--rch2-text-main);
}
.rc-h2-footer-logo-img {
    display: block;
    max-width: 180px;
    height: auto;
    margin-bottom: 20px;
}
.rc-h2-footer-logo-text {
    font-family: var(--rch2-font-serif);
    font-size: 18px;
    color: var(--rch2-text-main);
    letter-spacing: 0.1em;
    margin-bottom: 20px;
}

/* ロゴ画像下の店名テキスト (SEO用) */
.rc-h2-footer-store-name {
    font-family: var(--rch2-font-serif);
    font-size: 14px;
    font-weight: 500;
    color: var(--rch2-text-main);
    line-height: 1.6;
    letter-spacing: 0.04em;
    margin: 14px 0 0;
}

/* 業種・サイト種別（店名の下） */
.rc-h2-footer-industry {
    font-family: var(--rch2-font-serif);
    font-size: 12px;
    color: var(--rch2-text-sub);                /* #6B5544 */
    line-height: 1.6;
    letter-spacing: 0.06em;
    margin: 4px 0 0;
    opacity: 0.85;
}

/* ブランド下の細罫線 */
.rc-h2-footer-brand-divider {
    width: 30px;
    height: 1px;
    background: var(--rch2-accent-light);       /* #C8987A */
    margin: 20px 0;
}

/* 店舗情報テキスト */
.rc-h2-footer-info {
    font-family: var(--rch2-font-serif);
    font-size: 13px;                            /* 可読性を優先して 11→13 に */
    color: var(--rch2-text-sub);                /* #6B5544 */
    line-height: 1.95;
    letter-spacing: 0.08em;
}
.rc-h2-footer-info p {
    margin: 0;
}

/* 電話番号（em-dash表示） */
.rc-h2-footer-phone {
    margin-top: 20px;
    font-family: var(--rch2-font-en);
    font-style: italic;
    font-size: 16px;                            /* 13→16 に。フッター左カラムの主役として強める */
    color: var(--rch2-accent-strong);           /* #6B4226 */
    letter-spacing: 0.18em;
    text-decoration: none;
    display: inline-block;
    transition: color 0.3s ease;
}
.rc-h2-footer-phone:hover {
    color: var(--rch2-text-main);
}

/* ============================================================
   中央 / 右カラム: ナビ
   ============================================================ */
.rc-h2-footer-nav-col {
    display: flex;
    flex-direction: column;
}

/* ナビセクション間の余白 */
.rc-h2-footer-nav-section + .rc-h2-footer-nav-section {
    margin-top: 24px;
}

/* ナビ見出し (— About — 等) */
.rc-h2-footer-nav-eyebrow {
    font-family: var(--rch2-font-en);
    font-style: italic;
    font-size: 13px;                            /* 11→13 に。Follow us セクション見出しと揃える */
    color: var(--rch2-text-light);              /* #A98A6F */
    letter-spacing: 0.28em;
    margin: 0 0 16px;
}

/* ナビ項目 */
.rc-h2-footer-nav-list {
    display: flex;
    flex-direction: column;
}
.rc-h2-footer-nav-list a {
    font-family: var(--rch2-font-serif);
    font-size: 13.5px;                          /* 11→13.5 に。十分読みやすい */
    color: var(--rch2-text-sub);                /* #6B5544 */
    letter-spacing: 0.08em;
    margin-bottom: 10px;                        /* 8→10 で余白も合わせて広げる */
    text-decoration: none;
    line-height: 1.7;
    transition: color 0.3s ease;
}
.rc-h2-footer-nav-list a:last-child {
    margin-bottom: 0;
}
.rc-h2-footer-nav-list a:hover {
    color: var(--rch2-text-main);               /* #4A3520 */
}

/* Entry CTA はヘッダーとモバイル固定バーで常時表示されているため
   フッターでは扱わない（2026-05-18 削除）。
   旧クラス: .rc-h2-footer-entry-block / -message / -divider / -btn / -arrow / -sub
   再追加する場合はこのコメント位置に書く想定。 */

/* ============================================================
   コピーライト行
   ============================================================ */
.rc-h2-footer-copy {
    border-top: 0.5px solid var(--rch2-line);
    margin-top: 56px;
    padding: 24px 0 0;
    text-align: center;
}
.rc-h2-footer-copy-text {
    font-family: var(--rch2-font-en);
    font-style: italic;
    font-size: 12px;                            /* 10→12 に。コピーライトでも視認できるサイズ */
    color: var(--rch2-text-mute);               /* #8B7565 */
    letter-spacing: 0.28em;
}

/* 法的リンク (プライバシーポリシー等) */
.rc-h2-footer-copy-links {
    display: inline-block;
    margin-left: 32px;
    font-family: var(--rch2-font-serif);
    font-size: 12px;
    letter-spacing: 0.08em;
}
.rc-h2-footer-copy-links a {
    color: var(--rch2-text-mute);
    text-decoration: none;
    transition: color 0.25s ease;
}
.rc-h2-footer-copy-links a:hover {
    color: var(--rch2-accent-strong);
    text-decoration: underline;
    text-underline-offset: 3px;
}
@media (max-width: 768px) {
    .rc-h2-footer-copy-links {
        display: block;
        margin: 12px 0 0;
    }
}

/* ============================================================
   レスポンシブ
   ============================================================ */

/* タブレット: 3カラム維持・gap縮小 */
@media (max-width: 1024px) {
    .rc-h2-footer {
        padding: 90px 3rem;
    }
    .rc-h2-footer-grid {
        gap: 40px;
    }
    .rc-h2-footer-logo-img {
        max-width: 160px;
    }
}

/* モバイル: コンパクト2列グリッド構成
   - Brand: ロゴ + 電話のみ（営業時間/エリア等の info は非表示で短縮）
   - About + Work: 2カラム横並び
   - More: 親見出しは1列、項目は2カラムで詰める
   - 効果: 縦スクロール大幅短縮（約60%減） */
@media (max-width: 768px) {
    .rc-h2-footer {
        padding: 48px 1.5rem 80px;              /* 60→48 で上余白も詰める */
    }
    .rc-h2-footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    /* 左ブロック: ロゴ + 電話だけに簡略化 */
    .rc-h2-footer-brand {
        align-items: center;
        text-align: center;
    }
    .rc-h2-footer-logo-img {
        max-width: 130px;
        margin: 0 auto 14px;
    }
    .rc-h2-footer-logo-text {
        margin: 0 auto 14px;
    }
    /* info ブロック（営業時間/年中無休/エリア）と装飾罫線はモバイルで非表示 */
    .rc-h2-footer-brand-divider { display: none; }
    .rc-h2-footer-info { display: none; }
    .rc-h2-footer-phone {
        font-size: 15px;
        text-align: center;
        margin-top: 0;
    }

    /* About + Work を含む nav-col（最初の nav-col）: 2列グリッドに */
    .rc-h2-footer-nav-col:nth-of-type(2) {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px 20px;
    }
    /* 2列化したのでセクション間の縦マージンは0 */
    .rc-h2-footer-nav-col:nth-of-type(2) .rc-h2-footer-nav-section + .rc-h2-footer-nav-section {
        margin-top: 0;
    }

    /* More 列: 見出しは1列のまま、リンクだけ2列に詰める */
    .rc-h2-footer-nav-col:nth-of-type(3) .rc-h2-footer-nav-list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px 16px;
    }
    .rc-h2-footer-nav-col:nth-of-type(3) .rc-h2-footer-nav-list a {
        margin-bottom: 0;
    }

    /* 共通: フォントサイズ調整 */
    .rc-h2-footer-nav-eyebrow {
        font-size: 12px;
        letter-spacing: 0.24em;
        margin-bottom: 12px;
    }
    .rc-h2-footer-nav-list a {
        font-size: 13px;
        margin-bottom: 8px;
    }

    /* Entry ブロックはフッターから削除済み（ヘッダー + 固定バーで常時表示のため） */

    /* Copyright */
    .rc-h2-footer-copy {
        margin-top: 32px;                       /* 40→32 で少し詰める */
        padding-top: 20px;
    }
    .rc-h2-footer-copy-text {
        font-size: 11px;                        /* 9.5→11 */
        letter-spacing: 0.25em;
    }
}

/* 小型モバイル */
@media (max-width: 380px) {
    .rc-h2-footer {
        padding: 50px 1.2rem 80px;
    }
    .rc-h2-footer-logo-img {
        max-width: 120px;
    }
}
