.page-hero {
            background-image:
                linear-gradient(120deg, rgba(255,255,255,0.74) 0%, rgba(234,240,248,0.5) 50%, rgba(216,226,240,0.55) 100%),
                url('../../images/team-photo.jpg');
        }

        /* Intro */
        .staff-intro {
            padding: 110px 0 50px;
            position: relative;
            overflow: hidden;
        }
        .staff-intro h2 {
            font-size: 34px;
            line-height: 1.5;
            margin: 8px 0 28px;
            color: var(--navy);
        }
        .staff-intro p {
            font-size: 16px;
            line-height: 2;
            color: #444;
            max-width: 880px;
        }

        /* Staff spotlight — broken grid */
        .staff {
            padding: 90px 0;
            position: relative;
            overflow: hidden;
        }
        .staff + .staff { border-top: 1px solid rgba(5,5,72,0.08); }
        .staff-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            column-gap: 40px;
            row-gap: 24px;
            align-items: start;       /* 全アイテムを上端揃え */
            grid-auto-flow: dense;    /* reverse 版で空きを埋めて text を row 1 に配置 */
            position: relative;
        }

        .staff-num {
            font-family: 'Hiragino Kaku Gothic ProN', sans-serif;
            font-size: 180px;
            line-height: 0.9;
            color: rgba(212, 175, 55, 0.18);
            font-weight: 700;
            position: absolute;
            top: -30px;
            z-index: 0;
            pointer-events: none;
        }

        .staff-photo {
            grid-column: 1 / 6;
            aspect-ratio: 4 / 5;
            border-radius: 26px;
            overflow: hidden;
            background: #eef0f4;
            position: relative;
            z-index: 1;
        }
        .staff-photo img {
            width: 100%; height: 100%;
            object-fit: cover;
            transition: transform 0.8s ease;
        }
        .staff-photo:hover img { transform: scale(1.04); }

        /* staff-text = staff-head + staff-body をラップするコンテナ
           grid-auto-flow: dense により reverse 版でも row 1 に並列配置される。
           padding-top は staff-num(font-size 180px, line-height 0.9, top: -30px)の
           下端(grid 上端から132px)+ 余白で 140px に設定。 */
        .staff-text {
            grid-column: 6 / 13;
            padding-top: 140px;
            align-self: start;
            position: relative;
            z-index: 1;
        }
        .staff-head {
            position: relative;
            z-index: 1;
        }
        .staff-label {
            color: var(--gold);
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            margin-bottom: 14px;
            display: inline-block;
        }
        .staff-role-tag {
            display: inline-block;
            background: var(--pink);
            color: var(--white);
            font-size: 12px;
            padding: 5px 14px;
            border-radius: 20px;
            margin-bottom: 14px;
            margin-right: 8px;
        }
        .staff-name {
            font-size: 40px;
            line-height: 1.3;
            color: var(--navy);
            margin-bottom: 6px;
            font-weight: 700;
        }
        .staff-name-en {
            color: #888;
            font-size: 14px;
            letter-spacing: 0.1em;
            display: block;
            margin-bottom: 28px;
        }
        .staff-quote {
            font-family: 'Hiragino Kaku Gothic ProN', sans-serif;
            color: var(--navy);
            font-size: 22px;
            font-weight: 700;
            line-height: 1.6;
            margin-bottom: 22px;
            padding-left: 22px;
            border-left: 3px solid var(--gold);
        }
        /* staff-text コンテナで head + body をラップしているため、
           PC表示の追加調整は不要(grid-column と align-self: start で上端配置済み) */

        .staff-body {
            position: relative;
            z-index: 1;
        }
        .staff-body p {
            font-size: 15px;
            line-height: 2;
            color: #444;
            margin-bottom: 16px;
        }
        .staff-meta {
            margin: 30px 0 0;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 0;
            border-top: 1px solid rgba(5,5,72,0.1);
            border-bottom: 1px solid rgba(5,5,72,0.1);
        }
        .staff-meta > div {
            padding: 16px 16px 16px 0;
            border-right: 1px solid rgba(5,5,72,0.1);
        }
        .staff-meta > div:last-child { border-right: none; padding-right: 0; }
        .staff-meta dt {
            font-size: 11px;
            color: var(--gold);
            font-weight: 700;
            letter-spacing: 0.12em;
            margin-bottom: 6px;
        }
        .staff-meta dd { font-size: 13.5px; color: var(--navy); font-weight: 500; line-height: 1.6; }

        /* Store info compact (under staff details) */
        .staff-store {
            grid-column: 1 / 6;
            position: relative;
            z-index: 1;
        }
        .staff-store-title {
            font-family: 'Hiragino Kaku Gothic ProN', sans-serif;
            color: var(--gold);
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.2em;
            margin-bottom: 10px;
            display: block;
        }
        .staff-store-name {
            font-size: 18px;
            color: var(--navy);
            font-weight: 700;
            margin-bottom: 16px;
        }
        .staff-store-info {
            display: grid;
            gap: 0;
            border-top: 1px solid rgba(5,5,72,0.1);
            font-size: 13px;
        }
        .staff-store-info > div {
            padding: 12px 0;
            display: grid;
            grid-template-columns: 70px 1fr;
            gap: 10px;
            border-bottom: 1px solid rgba(5,5,72,0.1);
            align-items: start;
        }
        .staff-store-info dt {
            font-size: 11px;
            color: var(--gold);
            font-weight: 700;
            letter-spacing: 0.08em;
            padding-top: 2px;
        }
        .staff-store-info dd {
            color: var(--navy);
            line-height: 1.7;
        }
        .staff-store-info dd a { color: var(--gold); font-weight: 700; }

        /* Reverse */
        .staff--rev .staff-photo { grid-column: 8 / 13; align-self: start; }
        /* specificity を上げて確実に効かせる(他のスタイルや古いキャッシュに負けないように) */
        .staff.staff--rev .staff-text {
            grid-column: 1 / 8;
            text-align: right;
            align-self: start;
            padding-top: 140px;
        }
        .staff--rev .staff-head .staff-quote {
            border-left: none;
            border-right: 3px solid var(--gold);
            padding-left: 0;
            padding-right: 22px;
        }
        .staff--rev .staff-store { grid-column: 8 / 13; }
        .staff--rev .staff-num { right: 0; left: auto; text-align: right; }

        /* Final CTA */
        .staff-cta {
            padding: 110px 0;
            background: linear-gradient(135deg, var(--navy) 0%, var(--pink) 100%);
            color: var(--white);
            text-align: center;
        }
        .staff-cta h2 { font-size: 30px; color: var(--white); margin-bottom: 18px; line-height: 1.5; }
        .staff-cta p { font-size: 15px; opacity: 0.9; margin-bottom: 30px; }
        .staff-cta .btn-group { display: inline-flex; gap: 16px; flex-wrap: wrap; justify-content: center; }

        @media (max-width: 1199px) {
            .staff-intro { padding: 70px 0 30px; }
            .staff-intro h2 { font-size: 24px; }
            .staff-intro p { font-size: 15px; }

            .staff { padding: 60px 0 70px; }
            .staff-grid { column-gap: 24px; row-gap: 30px; }
            .staff-num { font-size: 120px; top: -20px; }

            /* モバイルは1カラムに。staff-text(新ラッパー)も grid-column 1/13 に強制。
               PC 版の .staff.staff--rev .staff-text(specificity 0,3,0)に勝てるよう
               同等以上の specificity で記述 */
            .staff .staff-photo,
            .staff.staff--rev .staff-photo,
            .staff .staff-text,
            .staff.staff--rev .staff-text,
            .staff .staff-head,
            .staff.staff--rev .staff-head,
            .staff .staff-body,
            .staff.staff--rev .staff-body,
            .staff .staff-store,
            .staff.staff--rev .staff-store {
                grid-column: 1 / 13;
                padding-top: 0;
                text-align: left;
            }
            /* モバイルでは写真→見出し の縦並び。grid の row-gap (30px) だけで間隔は十分。
               PC版の padding-top:140px は数字の下に置くための値で、モバイルでは不要。 */
            .staff .staff-text,
            .staff.staff--rev .staff-text {
                padding-top: 0;
            }
            .staff--rev .staff-head .staff-quote {
                border-right: none;
                border-left: 3px solid var(--gold);
                padding-right: 0;
                padding-left: 22px;
            }
            .staff-photo { max-width: 360px; aspect-ratio: 4/5; }
            .staff-name { font-size: 28px; }
            .staff-quote { font-size: 17px; }
            .staff-meta { grid-template-columns: 1fr; }
            .staff-meta > div {
                padding: 14px 0;
                border-right: none;
                border-bottom: 1px solid rgba(5,5,72,0.1);
            }
            .staff-meta > div:last-child { border-bottom: none; }

            .staff-cta { padding: 80px 0; }
            .staff-cta h2 { font-size: 22px; }
        }
        @media (max-width: 640px) {
            .staff-num { font-size: 80px; }
            .staff-name { font-size: 24px; }
            .staff-photo { max-width: 100%; }
        }