/* ============ Terms of the Desk — Syne, animated backdrop ============ */
/* (tokens + buttons live in shared.css; this page overrides the voice) */

body {
  font-family: 'Syne', sans-serif;
  color: #fff;
  overflow-x: clip;
  background-color: var(--bg);
  background-image: url(../bg.jpg);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* Frosted veil over the backdrop — the exact card treatment, full-page */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: rgba(10, 20, 26, .25);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
/* The BACK link is an anchor styled as a button */
.btn { text-decoration: none; display: inline-block; font-family: 'Syne', sans-serif; font-weight: 400; }

header { max-width: 720px; margin: 0 auto; text-align: center; padding: clamp(48px, 9vh, 96px) 22px 10px; }
h1 { font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(2rem, 6vw, 3.4rem); line-height: 1.1; }
.sub { font-family: 'Syne', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.7; color: #fff; margin-top: 16px; }
.tos { max-width: 720px; margin: 0 auto; padding: 0 22px 40px; }
section { padding: 26px 0; border-top: 1px solid var(--line); }
.sn { font-family: 'Syne', sans-serif; font-weight: 750; font-size: 1.1rem; letter-spacing: normal; color: #fff; margin-bottom: 10px; }
h2 { font-family: 'Syne', sans-serif; font-weight: 400; font-size: 1.05rem; line-height: 1.4; margin-bottom: 12px; }
p { font-family: 'Syne', sans-serif; font-weight: 400; font-size: .92rem; line-height: 1.85; color: #fff; margin-bottom: 10px; }
p b { color: #fff; font-weight: 400; }
p .coral { color: #fff; }
.fine { font-family: 'Syne', sans-serif; font-weight: 400; font-size: 10px; line-height: 2; letter-spacing: .1em; color: #fff; margin-top: 8px; }
.tos ul { margin: 0 0 26px 22px; }
.tos li { font-family: 'Syne', sans-serif; font-weight: 400; font-size: .92rem; line-height: 1.85; color: #fff; }

.back { text-align: center; padding: 30px 0 80px; }
/* back link = the wall's sitenav buttons (engrave / terms of service / account):
   the plain underlined aqua hyperlink voice, no chrome (wall.css .sitenav a verbatim) */
.back .btn {
  font-family: 'Syne', sans-serif; font-size: 1.2rem; font-weight: 700;
  letter-spacing: normal; text-transform: none; line-height: normal;
  color: var(--aqua); background: none; border: none; padding: 0;
  cursor: pointer; text-decoration: underline; display: inline-block;
}
.back .btn:visited { color: var(--aqua); }
.back .btn:hover { color: #bbdef0; background: none; box-shadow: none; transform: none; }
@media (max-width: 640px) { .back .btn { font-size: 1rem; } }