/* Shared by privacy.html and terms.html. Same tokens and type as the home page. */
:root {
  --navy: #091B33; --navy-line: #1D3559; --royal: #1A73E8; --teal: #10B981;
  --mist: #A9B8D0; --paper: #F3F6FB; --slate: #4A5B76; --ink: #091B33;
  --spring: cubic-bezier(.34, 1.56, .64, 1); --ease-out: cubic-bezier(.22, 1, .36, 1);
  --shadow-btn: 0 1px 1px rgba(3,10,22,.2), 0 6px 16px -6px rgba(26,115,232,.65);
}
html { -webkit-text-size-adjust: 100%; }
body { background: var(--paper); color: var(--ink); font-family: Inter, system-ui, sans-serif; line-height: 1.7; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: Outfit, system-ui, sans-serif; }
h1 { letter-spacing: -0.03em; line-height: 1.05; font-weight: 700; }
::selection { background: rgba(16,185,129,.35); }

.wrap { max-width: 1200px; margin-inline: auto; padding-inline: 24px; }
@media (min-width: 768px) { .wrap { padding-inline: 32px; } }

.legal-head {
  position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(60% 80% at 90% 0%, rgba(26,115,232,.28), transparent 70%),
    radial-gradient(40% 70% at 0% 100%, rgba(16,185,129,.14), transparent 70%),
    var(--navy);
}
.legal-head::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-weight: 600; font-size: 14px; line-height: 1; padding: 11px 18px; white-space: nowrap; background: var(--royal); color: #fff; box-shadow: var(--shadow-btn); transition: transform .35s var(--spring); }
.btn::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(255,255,255,.18), transparent 60%); opacity: 0; transition: opacity .25s ease; }
.btn:hover { transform: translateY(-2px); }
.btn:hover::after { opacity: 1; }
.btn:active { transform: translateY(0) scale(.97); transition-duration: .1s; }
.btn:focus-visible, .focusable:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }

.backlink { display: inline-flex; align-items: center; gap: 8px; color: var(--mist); font-size: 15px; font-weight: 500; border-radius: 6px; transition: opacity .2s ease; }
.backlink svg { transition: transform .3s var(--spring); }
.backlink:hover { color: #fff; }
.backlink:hover svg { transform: translateX(-3px); }
.backlink:active { opacity: .7; }
.backlink:focus-visible { outline: 2px solid var(--teal); outline-offset: 4px; }

/* reading column */
.prose { max-width: 68ch; font-size: 17px; color: var(--slate); }
.prose h2 { margin-top: 56px; font-size: 26px; line-height: 1.25; letter-spacing: -0.015em; font-weight: 600; color: var(--ink); }
.prose h3 { margin-top: 32px; font-size: 19px; line-height: 1.3; font-weight: 600; color: var(--ink); }
.prose p, .prose ul { margin-top: 16px; }
.prose ul { padding-left: 22px; list-style: disc; }
.prose li { margin-top: 8px; padding-left: 4px; }
.prose li::marker { color: var(--teal); }
.prose strong { color: var(--ink); font-weight: 600; }
.prose code { font-size: .9em; background: rgba(9,27,51,.06); border-radius: 6px; padding: 1px 6px; color: var(--ink); }
.prose a { color: var(--royal); font-weight: 500; text-decoration: underline; text-decoration-color: rgba(26,115,232,.3); text-underline-offset: 4px; border-radius: 3px; transition: opacity .2s ease; }
.prose a:hover { opacity: .8; }
.prose a:active { opacity: .6; }
.prose a:focus-visible { outline: 2px solid var(--royal); outline-offset: 2px; }

/* the one-paragraph summary sits a level above the page */
.summary { background: #fff; border-radius: 20px; padding: 28px 32px; box-shadow: 0 1px 2px rgba(9,27,51,.06), 0 4px 12px -4px rgba(9,27,51,.08), 0 16px 32px -16px rgba(26,115,232,.18); }
.summary p { margin-top: 0; color: var(--ink); }

.footlink { color: var(--mist); font-size: 14px; border-radius: 4px; transition: opacity .2s ease; }
.footlink:hover { color: #fff; }
.footlink:active { opacity: .7; }
.footlink:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.footlink[aria-current="page"] { color: #fff; }

/* page transitions, matching the home page; the logo holds its place */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: vtOut .26s var(--ease-out) both; }
  ::view-transition-new(root) { animation: vtIn .55s var(--ease-out) both; }
}
@keyframes vtOut { to { opacity: 0; transform: translateY(-10px); } }
@keyframes vtIn { from { opacity: 0; transform: translateY(14px); } }
.legal-head nav > a:first-child img { view-transition-name: brand; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; }
}