/* ============================================================
   法的適合性について — 2026-08 サイト刷新（法務LPのトンマナ統一）
   ・トークンは site-shell.css、ボタンは .rv-btn を共用する。
   ・トップ(.rv-home)の「安心・安全」帯と同じ面の作り（guard色のカード・13px角丸・薄い罫線）に寄せる。
   ・.rv-legal 配下にスコープし、既存 styles.css / Bootstrap と衝突させない。
   ・色・見出し寸法・hero/gov固有paddingが `.rv-legal` を重ねた形（例 `.rv-legal .rv-legal-hero h1`）
     なのは、素直にクラス1個で書くと次の2つに負けて設計どおりに出ないため。重ねて 0-2-x にする。
       - 非ログイン時に読まれる公開下地 site-public.css の `body.rv-public h1` / `:is(p, li)` 等（0-1-2）。
         body も要素として数えるので、`.rv-legal-hero h1`（0-1-1）では負ける。
       - このファイル内の一律指定 `.rv-legal section`（0-1-1）。`.rv-legal-hero`（0-1-0）では負ける。
     ログイン時は公開下地が読まれないが、重ねても結果は変わらない。
   ============================================================ */

.rv-legal {
    font-family: var(--rv-font);
    color: var(--rv-ink);
    background: var(--rv-ground);
}

    .rv-legal section {
        padding: 64px 0;
    }

    .rv-legal :is(h1, h2, h3) {
        font-family: inherit;
        color: var(--rv-ink);
        letter-spacing: .005em;
    }

    .rv-legal p,
    .rv-legal li {
        color: var(--rv-ink-2);
        line-height: 1.85;
    }

    .rv-legal a:not(.rv-btn) {
        color: var(--rv-brand-ink);
        text-decoration: underline;
        text-underline-offset: 3px;
    }

        /* hover でも 4.5:1 を割らないよう brand-deep（3.61:1）ではなく更に濃い側へ振る。
           非ログイン時は site-public.css の body.rv-public a:not(.btn):not(.rv-btn):hover（0-4-2）が
           競合し、ページ側がクラス3個では負けるため、下地より強い形も併記する。 */
        .rv-legal a:not(.rv-btn):hover,
        body.rv-public .rv-legal a:not(.btn):not(.rv-btn):hover {
            color: var(--rv-brand-ink-strong);
        }

    /* 半透明のオレンジは白地で約1.42:1しか出ず現在位置が分からないため、不透明な brand-ink（白地で約6.1:1）にする */
    .rv-legal a:focus-visible,
    .rv-legal button:focus-visible {
        outline: 3px solid var(--rv-brand-ink);
        outline-offset: 2px;
    }

/* ---- セクション見出し（トップの .rv-head / .rv-kicker と同じ形） ---- */
.rv-legal-head {
    max-width: 860px;
    margin-bottom: 38px;
}

.rv-legal .rv-legal-kicker {
    margin: 0 0 11px;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .16em;
    /* 11.5px なので brand(#ff7900, 2.63:1) では 4.5:1 に届かない */
    color: var(--rv-brand-ink);
}

.rv-legal .rv-legal-head h2 {
    margin: 0 0 14px;
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 800;
    line-height: 1.5;
}

/* キッカーも <p> なので除外する。除外しないとこの説明文用の指定（0-2-1）が
   .rv-legal .rv-legal-kicker（0-2-0）に勝ち、アクセント色が本文色に潰れる。 */
.rv-legal .rv-legal-head > p:not(.rv-legal-kicker) {
    margin: 0;
    font-size: 15.5px;
    color: var(--rv-muted);
}

/* ---- ヒーロー ---- */
/* section の一律paddingより強くする（.rv-legal section は 0-1-1）。以下 hero/gov も同じ理由。 */
.rv-legal .rv-legal-hero {
    padding: 72px 0 56px;
    background: radial-gradient(900px 420px at 85% -10%, var(--rv-guard-wash), transparent 62%), var(--rv-ground);
    border-bottom: 1px solid var(--rv-line);
}

.rv-legal .rv-legal-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 20px;
    padding: 7px 14px;
    border: 1px solid var(--rv-guard-line);
    border-radius: 999px;
    background: var(--rv-card);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--rv-guard);
}

.rv-legal-badge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rv-guard);
}

.rv-legal .rv-legal-hero h1 {
    margin: 0 0 18px;
    font-size: clamp(28px, 3.6vw, 42px);
    font-weight: 800;
    line-height: 1.4;
}

.rv-legal .rv-legal-lead {
    max-width: 760px;
    margin: 0;
    font-size: 15.5px;
    color: var(--rv-muted);
}

/* ---- 総務省回答カード（トップの .rv-expert と同じ guard 色の面） ---- */
.rv-legal .rv-legal-gov {
    padding-top: 48px;
}

.rv-legal-govcard {
    padding: 32px 34px 28px;
    border: 1px solid var(--rv-guard-line);
    border-radius: 13px;
    background: var(--rv-guard-wash);
}

.rv-legal-govhead {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 22px;
}

    .rv-legal .rv-legal-govhead h2 {
        margin: 0 0 4px;
        font-size: clamp(18px, 2.2vw, 22px);
        font-weight: 800;
        line-height: 1.5;
    }

    .rv-legal .rv-legal-govhead p {
        margin: 0;
        font-size: 13.5px;
        color: var(--rv-muted);
    }

.rv-legal-ic {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--rv-card);
    border: 1px solid var(--rv-guard-line);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

    .rv-legal-ic svg {
        stroke: var(--rv-guard);
    }

.rv-legal-govlist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

    .rv-legal-govlist li {
        display: flex;
        gap: 14px;
        align-items: flex-start;
        padding: 18px 20px;
        border: 1px solid var(--rv-guard-line);
        border-radius: 11px;
        background: var(--rv-card);
    }

    .rv-legal-govlist p {
        margin: 0;
        font-size: 14.5px;
    }

    .rv-legal-govlist b {
        color: var(--rv-ink);
    }

.rv-legal-check {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--rv-ok-wash);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    margin-top: 3px;
}

    .rv-legal-check svg {
        stroke: var(--rv-ok);
    }

.rv-legal-govfoot {
    margin-top: 20px;
}

/* ---- 4つの設計（トップの .rv-tcard と同じカード） ---- */
.rv-legal-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.rv-legal-card {
    padding: 26px 24px;
    border: 1px solid var(--rv-line);
    border-radius: 13px;
    background: var(--rv-card);
}

.rv-legal .rv-legal-num {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    /* 12px なので brand(#ff7900, 2.63:1) では 4.5:1 に届かない */
    color: var(--rv-brand-ink);
    font-variant-numeric: tabular-nums;
}

.rv-legal .rv-legal-card h3 {
    margin: 0 0 8px;
    font-size: 16.5px;
    font-weight: 700;
    line-height: 1.55;
}

.rv-legal .rv-legal-card p:last-child {
    margin: 0;
    font-size: 14px;
    color: var(--rv-muted);
    line-height: 1.78;
}

/* ---- 資料請求 ---- */
.rv-legal-docs {
    background: var(--rv-ground-2);
}

.rv-legal-docgrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.rv-legal-doc {
    display: flex;
    flex-direction: column;
    padding: 28px 26px 26px;
    border: 1px solid var(--rv-line);
    border-radius: 13px;
    background: var(--rv-card);
    box-shadow: var(--rv-lift);
}

.rv-legal .rv-legal-for {
    margin: 0 0 8px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--rv-brand-ink);
}

.rv-legal .rv-legal-doc h3 {
    margin: 0 0 10px;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.5;
}

/* 「〜の方へ」(.rv-legal-for) も直下の <p> なので、キッカーと同じ理由で除外する。 */
.rv-legal .rv-legal-doc > p:not(.rv-legal-for) {
    margin: 0 0 16px;
    font-size: 14px;
    color: var(--rv-muted);
}

.rv-legal-doc ul {
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

    .rv-legal-doc li {
        position: relative;
        padding-left: 18px;
        font-size: 14px;
    }

        .rv-legal-doc li::before {
            content: "";
            position: absolute;
            left: 2px;
            top: .78em;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: var(--rv-brand-line);
        }

.rv-legal-doc .rv-btn {
    margin-top: auto;
    align-self: flex-start;
}

/* ---- 注記・関連リンク ---- */
.rv-legal-notebox {
    padding: 30px 32px;
    border: 1px solid var(--rv-line);
    border-radius: 13px;
    background: var(--rv-card);
}

    .rv-legal .rv-legal-notebox h2 {
        margin: 0 0 12px;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: .04em;
        color: var(--rv-muted);
    }

    .rv-legal .rv-legal-notebox h2 + ul + h2 {
        margin-top: 26px;
    }

.rv-legal-notelist,
.rv-legal-reflist {
    margin: 0;
    padding-left: 1.3em;
    display: grid;
    gap: 6px;
    font-size: 13.5px;
}

.rv-legal-contact {
    margin: 24px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--rv-line);
    font-size: 14px;
}

/* ---- レスポンシブ ---- */
@media (max-width: 980px) {
    .rv-legal section {
        padding: 52px 0;
    }
}

@media (max-width: 760px) {
    .rv-legal-grid,
    .rv-legal-docgrid {
        grid-template-columns: 1fr;
    }

    .rv-legal-govcard,
    .rv-legal-doc,
    .rv-legal-notebox {
        padding: 22px 20px;
    }

    .rv-legal-govhead {
        gap: 14px;
    }
}

@media (max-width: 580px) {
    .rv-legal section {
        padding: 44px 0;
    }

    .rv-legal .rv-legal-hero {
        padding: 52px 0 40px;
    }

    .rv-legal-br {
        display: none;
    }
}