.legal-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 88% 4%, rgba(255, 159, 181, 0.16), transparent 24rem),
        var(--cream, #fffaf5);
    color: var(--ink-900, #2f2940);
}

.legal-header .header-inner {
    min-height: 76px;
}

.legal-header .brand {
    text-decoration: none;
}

.legal-header nav {
    display: flex;
    align-items: center;
    gap: 24px;
}

.legal-header nav a {
    color: var(--ink-700, #5f596e);
    font-size: 0.92rem;
    font-weight: 600;
    text-decoration: none;
}

.legal-header nav a:hover,
.legal-header nav a[aria-current="page"] {
    color: var(--ink-900, #2f2940);
}

.legal-main {
    padding: 76px 0 104px;
}

.legal-document {
    width: min(760px, calc(100% - 40px));
    margin: 0 auto;
}

.legal-document h1 {
    max-width: 700px;
    margin: 0 0 16px;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(2.6rem, 7vw, 4.6rem);
    line-height: 1.03;
    letter-spacing: -0.04em;
}

.legal-updated {
    margin: 0 0 52px;
    color: var(--ink-500, #817a8e);
    font-size: 0.92rem;
}

.legal-intro {
    margin-bottom: 52px;
    color: var(--ink-700, #5f596e);
    font-size: clamp(1.1rem, 2.2vw, 1.28rem);
    line-height: 1.75;
}

.legal-section {
    padding: 30px 0;
    border-top: 1px solid rgba(67, 57, 86, 0.13);
}

.legal-section h2 {
    margin: 0 0 14px;
    font-family: "Fraunces", Georgia, serif;
    font-size: 1.55rem;
    line-height: 1.2;
}

.legal-section h3 {
    margin: 24px 0 8px;
    font-size: 1rem;
}

.legal-section p,
.legal-section li {
    color: var(--ink-700, #5f596e);
    line-height: 1.72;
}

.legal-section p {
    margin: 0 0 14px;
}

.legal-section ul {
    margin: 10px 0 14px;
    padding-left: 1.3rem;
}

.legal-section li + li {
    margin-top: 8px;
}

.legal-document a {
    color: #b94571;
    text-underline-offset: 3px;
}

.legal-callout {
    margin: 14px 0;
    padding: 18px 20px;
    border: 1px solid rgba(255, 111, 151, 0.22);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.7);
}

@media (max-width: 640px) {
    .legal-header .header-inner {
        align-items: center;
    }

    .legal-header nav {
        gap: 14px;
    }

    .legal-header nav a:first-child {
        display: none;
    }

    .legal-main {
        padding: 52px 0 72px;
    }

    .legal-updated,
    .legal-intro {
        margin-bottom: 38px;
    }
}