/* Legal page styles — scoped to .legal-page to avoid affecting other pages */
.legal-page {
    --ink: #CD377F;
    --ink-muted: #6b6660;
    --accent: #e8579d;
    --accent-light: #e8dfc8;
    --border: #d9d2c5;
    --white: #fdfcfa;
    color: var(--ink);
    font-weight: 300;
    line-height: 1.8;
}

        /* Header */
        .tos-header {
            background-color: var(--ink);
            color: var(--white);
            padding: 80px 40px 60px;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .tos-header::before {
            content: '';
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                45deg,
                transparent,
                transparent 40px,
                rgba(200, 169, 110, 0.04) 40px,
                rgba(200, 169, 110, 0.04) 41px
            );
        }

        .tos-header .eyebrow {
            font-family: 'DM Sans', sans-serif;
            font-weight: 500;
            font-size: 0.75rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--accent);
            margin-bottom: 20px;
            position: relative;
        }

        .tos-header h1 {
            font-family: 'Playfair Display', serif;
            font-size: clamp(2.5rem, 5vw, 4rem);
            font-weight: 400;
            letter-spacing: -0.01em;
            line-height: 1.15;
            position: relative;
        }

        .tos-header .meta {
            margin-top: 24px;
            font-size: 0.875rem;
            color: rgba(253, 252, 250, 0.5);
            position: relative;
        }

        /* Layout */
        .tos-wrapper {
            max-width: 780px;
            margin: 0 auto;
            padding: 60px 24px 100px;
        }

        /* Intro box */
        .tos-intro {
            background: var(--white);
            border: 1px solid var(--border);
            border-left: 4px solid var(--accent);
            padding: 28px 32px;
            margin-bottom: 56px;
            font-size: 0.95rem;
            color: var(--ink-muted);
            line-height: 1.9;
        }

        .tos-intro strong {
            color: var(--ink);
            font-weight: 500;
        }

        /* Table of Contents */
        .toc {
            background: var(--white);
            border: 1px solid var(--border);
            padding: 32px;
            margin-bottom: 56px;
        }

        .toc h2 {
            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
            font-size: 1.1rem;
            font-weight: 400;
            margin-bottom: 16px;
            padding-bottom: 12px;
            border-bottom: 1px solid var(--border);
        }

        h3 {
            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
            font-size: 16px;
            margin-bottom: 12px;
        }

        .toc ol {
            list-style: none;
            counter-reset: toc-counter;
        }

        .toc ol li {
            counter-increment: toc-counter;
            padding: 6px 0;
            border-bottom: 1px dashed var(--border);
            font-size: 0.9rem;
        }

        .toc ol li:last-child {
            border-bottom: none;
        }

        .toc ol li::before {
            content: counter(toc-counter, decimal-leading-zero) ". ";
            color: var(--accent);
            font-weight: 500;
            margin-right: 6px;
        }

        .toc a {
            color: var(--ink);
            text-decoration: none;
            transition: color 0.2s;
        }

        .toc a:hover {
            color: var(--accent);
        }

        /* Sections */
        .tos-section {
            margin-bottom: 52px;
            padding-bottom: 52px;
            border-bottom: 1px solid var(--border);
        }

        .tos-section:last-of-type {
            border-bottom: none;
        }

        .section-number {
            font-size: 0.7rem;
            font-weight: 500;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--accent);
            display: block;
            margin-bottom: 8px;
        }

        .tos-section h2 {
            font-family: 'Perpetua', serif;
            font-size: 1.6rem;
            font-weight: 700;
            margin-bottom: 20px;
            line-height: 1.3;
        }

        .tos-section p {
            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
            font-size: 0.95rem;
            color: var(--ink-muted);
            margin-bottom: 16px;
        }

        .tos-section p:last-child {
            margin-bottom: 0;
        }

        .tos-section ul {
            list-style: none;
            margin: 16px 0;
        }

        .tos-section ul li {
            font-size: 0.95rem;
            color: var(--ink-muted);
            padding: 6px 0 6px 24px;
            position: relative;
            border-bottom: 1px dashed var(--border);
        }

        .tos-section ul li:last-child {
            border-bottom: none;
        }

        .tos-section ul li::before {
            content: '—';
            position: absolute;
            left: 0;
            color: var(--accent);
        }

        /* Highlight box */
        .highlight-box {
            background: var(--accent-light);
            border: 1px solid var(--accent);
            padding: 20px 24px;
            margin: 24px 0;
            font-size: 0.9rem;
            color: var(--ink);
        }

        .highlight-box strong {
            display: block;
            font-weight: 500;
            margin-bottom: 6px;
        }

        /* Footer */
        .tos-footer {
            background: var(--ink);
            color: rgba(253, 252, 250, 0.5);
            text-align: center;
            padding: 40px 24px;
            font-size: 0.8rem;
            letter-spacing: 0.05em;
        }

        .tos-footer a {
            color: var(--accent);
            text-decoration: none;
        }

        /* Responsive */
        @media (max-width: 600px) {
            .tos-header {
                padding: 60px 24px 44px;
            }

            .tos-wrapper {
                padding: 40px 16px 80px;
            }

            .toc, .tos-intro {
                padding: 24px;
            }
        }