/* ----- Design tokens ----- */
:root {
    --bg: #000000;
    /* page background (black, as requested) */
    --surface: #0d0d0f;
    /* the policy card, lifted just off black */
    --border: #2a2a2e;
    /* hairline borders */
    --text: #f4f4f5;
    /* body text — near-white to ease halation, ~18:1 contrast */
    --heading: #ffffff;
    /* headings in pure white */
    --muted: #c7c7cc;
    /* slightly softened text where useful */
    --accent: #6cc6ff;
    /* high-contrast blue for accents/links on black */

    --maxread: 68ch;
    /* readable line length */
    --radius: 14px;

    --font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Honour a reader who prefers less motion */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* ----- Layout wrappers ----- */
.policy-wrap {
    padding: clamp(1.5rem, 4vw, 4rem) 1rem;
}

.container {
    width: 100%;
    max-width: 860px;
    margin-inline: auto;
}

.policy-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: clamp(1.5rem, 4vw, 3.25rem);
}

/* Constrain text to a comfortable measure and centre it in the card */
.policy-content {
    max-width: var(--maxread);
    margin-inline: auto;
}

/* ----- Sections & spacing ----- */
.policy-content>section {
    margin-block: 2.25rem;
}

.policy-content>section:first-child {
    margin-top: 0;
}

.policy-content>section:last-child {
    margin-bottom: 0;
}




/* ----- Body text ----- */
p {
    margin: 0 0 1.1rem;
}

p:last-child {
    margin-bottom: 0;
}

strong {
    color: var(--heading);
    font-weight: 700;
}

/* ----- Lists ----- */
ul {
    margin: 0 0 1.1rem;
    padding-left: 1.4rem;
}

li {
    margin-bottom: 0.65rem;
}

li:last-child {
    margin-bottom: 0;
}

.toc {
    padding: 0;
}

.toc li {
    margin-left: 0.85rem;
    margin-bottom: 0;
    text-decoration: underline;
}

/* ----- Keyboard focus: always clearly visible ----- */
:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ----- Text selection contrast ----- */
::selection {
    background: var(--accent);
    color: #000;
}

/* ==========================================================================
        Accessibility safeguards
        ========================================================================== */

/* Windows High Contrast / forced-colors mode: let the OS palette take over
        instead of fighting it, so the policy stays legible. */
@media (forced-colors: active) {
    .policy-card {
        border: 1px solid CanvasText;
    }

    h2 {
        border-bottom-color: CanvasText;
    }

    ul li::before {
        background: CanvasText;
    }


    :focus-visible {
        outline-color: Highlight;
    }
}

/* Utility class for visually hidden text that screen readers still announce.
        Add class="visually-hidden" to any element you want read but not shown
        (for example an <h1> page title above this section). */
.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

/* ----- Small screens ----- */
@media (max-width: 480px) {
    .policy-card {
        border-radius: 10px;
    }
}

/* ----- Print: black-on-white, no card chrome ----- */
@media print {
    body {
        background: #fff;
        color: #000;
    }

    .policy-card {
        border: none;
        padding: 0;
    }

    h1,
    h2,
    h3,
    strong {
        color: #000;
    }


    ul li::before {
        background: #000;
    }
}