/* Collective Hub Center - the legal document layout.
 *
 * Shared by privacy.html and terms.html. These pages deliberately do NOT use
 * site.css: they are a single narrow column of running text with no countdown,
 * no fixed header and no reveal animation. Different job, different chrome.
 */

:root{
  --night:#0a0908; --film:#f2f0e9; --film-2:#b5b1a7; --gold:#c8a95f;
  --line:rgba(242,240,233,.11); --line-2:rgba(242,240,233,.26);
  /* Kept in step with site.css, which these pages deliberately do not load. */
  --display:"Nunito Sans",-apple-system,"Segoe UI",sans-serif;
  --text:"Nunito Sans",-apple-system,"Segoe UI",sans-serif;
  --gutter:1.35rem; --measure:34rem; --label:.875rem;
}
@media(min-width:680px){:root{--gutter:2.75rem}}
@media(min-width:1180px){:root{--gutter:4.5rem}}

*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
/* The in-page contents links jump to headings; without this they land under
   nothing in particular and the heading sits flush against the viewport edge. */
html{scroll-padding-top:2rem}
body{background:var(--night);color:var(--film);font-family:var(--text);font-size:1.125rem;line-height:1.72;
  -webkit-font-smoothing:antialiased}
a{color:var(--gold);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.wrap{max-width:52rem;margin-inline:auto;padding-inline:var(--gutter)}
nav{border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.5rem;max-width:80rem}
.mark{display:inline-flex;align-items:center;min-height:44px;font-family:var(--display);font-weight:400;
  font-size:1.3rem;letter-spacing:.08em;text-transform:uppercase;color:var(--film);text-decoration:none}
.back{display:inline-flex;align-items:center;min-height:44px;font-size:.9375rem;text-decoration:none}

main{padding-block:clamp(3rem,7vw,5.5rem) clamp(4rem,9vw,7rem)}
h1{font-family:var(--display);font-style:italic;font-weight:700;line-height:1.06;
  letter-spacing:-.012em;text-transform:uppercase;font-size:clamp(2.2rem,6vw,3.6rem)}
.updated{margin-top:1rem;font-size:.875rem;color:var(--film-2)}
.lede{margin-top:1.75rem;max-width:var(--measure)}

.notice{margin-top:2.5rem;padding:1.5rem 1.75rem;border:1px solid var(--gold);background:rgba(200,169,95,.07)}
.notice b{display:block;font-family:var(--display);font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gold);font-size:1rem}
.notice p{margin-top:.75rem;font-size:.9375rem}

h2{margin-top:3.25rem;font-family:var(--display);font-style:italic;font-weight:700;font-size:1.6rem;
  letter-spacing:-.005em;text-transform:uppercase;scroll-margin-top:2rem}
h3{margin-top:2rem;font-size:1.0625rem;font-weight:500;letter-spacing:.01em;color:var(--gold)}
p,li{margin-top:1rem;max-width:var(--measure)}
ul,ol{padding-left:1.15rem}
strong{font-weight:500;color:var(--film)}

/* Contents. Both documents are long enough that landing at the top with no map
   is a worse experience than one extra block of links. */
.toc{margin-top:2.5rem;padding:1.25rem 1.5rem;border:1px solid var(--line)}
.toc h2{margin:0;font-size:var(--label);letter-spacing:.14em;color:var(--film-2)}
.toc ol{margin-top:.85rem;padding-left:1.2rem;columns:2;column-gap:2rem}
.toc li{margin-top:.4rem;font-size:.9375rem}
@media(max-width:620px){.toc ol{columns:1}}

/* The CCPA category disclosure is a table by nature - category, examples,
   whether it is collected. Forcing it into prose makes it unreadable. */
.tablewrap{margin-top:1.5rem;overflow-x:auto;border:1px solid var(--line)}
table{width:100%;min-width:34rem;border-collapse:collapse;font-size:.9375rem}
th,td{padding:.85rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{font-weight:500;color:var(--gold);letter-spacing:.02em}
tbody tr:last-child td{border-bottom:0}
td p,td li{max-width:none;margin-top:0}

/* A table caption names the table for a screen reader without repeating the
   heading directly above it on screen. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

footer{border-top:1px solid var(--line);padding-block:2.5rem}
footer .wrap{max-width:80rem;display:flex;flex-wrap:wrap;gap:.5rem 2rem;font-size:.875rem;color:var(--film-2)}
footer a{min-height:44px;display:inline-flex;align-items:center}
