/* ===========================================================================
   Privacy Policy — page-specific styles (shared look lives in base.css).
   Values from the Privacy design export.
   =========================================================================== */

/* ---------- Title ---------- */
.pp-title {
    position: relative; z-index: 1;
    padding: 14vh var(--gutter) 12vh;
    display: flex; flex-direction: column; gap: 2.2em;
}
.pp-title .v2-h1 { font-size: clamp(44px, 5.4vw, 92px); }
.pp-updated {
    font-size: clamp(12px, 1vw, 15px);
    font-weight: 500; letter-spacing: .22em;
    color: var(--muted);
}

/* ---------- Layout: contents list + policy text ---------- */
.pp-policy {
    position: relative; z-index: 1;
    padding: 0 var(--gutter) 24vh;
    display: flex; flex-wrap: wrap; align-items: stretch;
    gap: 8vh 6vw;
}
.pp-aside { flex: 1 1 260px; max-width: 320px; }

/* ---------- Sticky numbered contents ---------- */
.pp-toc {
    position: sticky; top: 10vh;
    display: flex; flex-direction: column; gap: 1.2em;
    padding-top: 1.9em;
    border-top: 1px solid var(--rule);
}
.pp-toc__list { display: flex; flex-direction: column; }
.pp-toc__list a {
    display: flex; align-items: baseline; gap: .75em;
    padding: .38em 0;
    font-size: clamp(15px, 1.1vw, 18px); line-height: 1.3;
    color: var(--muted);
    transition: color 250ms ease;
}
.pp-toc__list a > span:first-child {
    flex: none; min-width: 1.9em;
    font-style: italic;
    transition: color 250ms ease;
}
.pp-toc__list a.pp-toc__sub {
    padding: .32em 0 .32em 3em;
    font-size: clamp(14px, 1vw, 16px);
}
/* States set by js/privacy.js: the section in view, its parent, and hover */
.pp-toc__list a.is-lit { color: var(--ink); }
.pp-toc__list a.is-active > span:first-child { color: var(--accent); }

/* ---------- Policy text ---------- */
.pp-text {
    flex: 999 1 520px; min-width: 0;
    display: flex; flex-direction: column;
    gap: clamp(64px, 11vh, 120px);
    font-size: clamp(17px, 1.3vw, 21px); line-height: 1.66;
    color: var(--body);
}
.pp-section {
    scroll-margin-top: 8vh;
    display: flex; flex-direction: column; gap: 1.15em;
    padding-top: 1.9em;
    border-top: 1px solid var(--rule);
}
.pp-section--parent { gap: 2.2em; }
.pp-section p { margin: 0; max-width: 34em; text-wrap: pretty; }
.pp-section h2 {
    margin: 0;
    display: flex; align-items: baseline; gap: .5em;
    font-size: clamp(28px, 2.4vw, 40px);
    font-weight:400; line-height: 1.12; letter-spacing: -.005em;
    color: var(--ink);
}
.pp-section h2 > span:first-child,
.pp-section h3 > span:first-child { flex: none; color: var(--accent); }
.pp-section h2 > span:first-child { font-style: italic; }
.pp-sub { scroll-margin-top: 8vh; display: flex; flex-direction: column; gap: .75em; }
.pp-sub h3 {
    margin: 0;
    display: flex; align-items: baseline; gap: .55em;
    font-size: clamp(20px, 1.55vw, 26px);
    font-weight:500; font-style: italic; line-height: 1.2;
    color: var(--ink);
}
.pp-section em { font-style: italic; color: var(--ink); }

.pp-list {
    margin: .2em 0; padding: 0; list-style: none;
    display: flex; flex-direction: column; gap: .6em;
    max-width: 34em;
}
.pp-list li { display: flex; align-items: baseline; gap: .9em; }
.pp-list li > span:first-child { flex: none; min-width: 1.5em; font-style: italic; color: var(--accent); }
.pp-list li > span:last-child { text-wrap: pretty; }

.pp-address {
    margin-top: 1.2em;
    font-style: normal;
    display: flex; flex-direction: column; gap: .1em;
    line-height: 1.5;
    color: var(--ink);
}
.pp-address span:first-child { font-style: italic; }
