/* ============================================================
   SUITED — legal document, shown as an in-page overlay on the
   landing page (Privacy / Terms). Loaded ONLY on the homepage.
   Reuses suited-clean.css tokens; styles the fetched .doc-wrap
   content + the overlay chrome. Keeping the user on the homepage
   means the audio context is never torn down by a navigation.
   ============================================================ */

.legal-ov{
  position:fixed;inset:0;z-index:200;
  background:var(--bg);
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  opacity:0;visibility:hidden;
  transition:opacity .42s var(--ease),visibility .42s var(--ease);
}
.legal-ov.is-open{opacity:1;visibility:visible}

/* slim top bar — brand + close */
.legal-ov__bar{
  position:sticky;top:0;z-index:5;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px clamp(22px,5vw,40px);
  background:color-mix(in srgb,var(--bg) 84%,transparent);
  -webkit-backdrop-filter:blur(14px) saturate(120%);backdrop-filter:blur(14px) saturate(120%);
  border-bottom:1px solid var(--line-soft);
}
.legal-ov__brand{
  font-family:var(--font-head);font-weight:900;letter-spacing:-.04em;font-size:24px;
  color:var(--ink);text-decoration:none;line-height:1;
}
.legal-ov__brand .dot{color:var(--accent)}
.legal-ov__close{
  flex:none;width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg-2);border:1px solid var(--line);color:var(--ink);
  font-size:17px;line-height:1;cursor:pointer;
  transition:background .25s,transform .25s var(--ease),border-color .25s,color .25s;
}
.legal-ov__close:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:rotate(90deg)}

/* the injected document */
.legal-ov .doc-wrap{max-width:760px;margin:0 auto;padding:0 clamp(22px,5vw,40px)}
.legal-ov .doc-head{padding:clamp(40px,7vw,88px) 0 clamp(30px,5vw,52px);border-bottom:1px solid var(--line)}
.legal-ov .doc-eyebrow{
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);
  display:inline-flex;align-items:center;gap:11px;margin-bottom:22px;
}
.legal-ov .doc-eyebrow::before{content:"";width:26px;height:1.5px;background:var(--accent)}
.legal-ov .doc-head h1{
  font-family:var(--font-head);font-weight:900;letter-spacing:-.04em;line-height:.92;
  font-size:clamp(40px,8vw,76px);color:var(--ink);
}
.legal-ov .doc-meta{margin-top:20px;font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--mute);text-transform:uppercase}

.legal-ov .doc-body{padding:clamp(34px,6vw,60px) 0 100px}
.legal-ov .doc-note{
  background:var(--bg-2);border:1px solid var(--line);border-radius:14px;
  padding:18px 20px;font-size:14px;line-height:1.55;color:var(--ink-2);margin-bottom:42px;
}
.legal-ov .doc-note b{color:var(--ink)}
.legal-ov .doc-body section{margin-bottom:40px}
.legal-ov .doc-body h2{
  font-family:var(--font-head);font-weight:800;letter-spacing:-.02em;font-size:clamp(22px,3vw,28px);
  margin-bottom:14px;display:flex;gap:14px;align-items:baseline;color:var(--ink);
}
.legal-ov .doc-body h2 .s-num{font-family:var(--mono);font-weight:700;font-size:13px;color:var(--accent);letter-spacing:.04em;flex:none}
.legal-ov .doc-body h3{font-family:var(--font-head);font-weight:700;font-size:17px;margin:20px 0 8px;color:var(--ink)}
.legal-ov .doc-body p{font-size:16px;color:var(--ink-2);margin-bottom:14px;text-wrap:pretty}
.legal-ov .doc-body p strong{color:var(--ink)}
.legal-ov .doc-body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.legal-ov .doc-body a:hover{color:var(--accent)}
.legal-ov .doc-body ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0 0 16px}
.legal-ov .doc-body li{position:relative;padding-left:20px;font-size:16px;color:var(--ink-2);line-height:1.55}
.legal-ov .doc-body li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.legal-ov .doc-body li strong{color:var(--ink)}

/* lock the page behind the overlay */
html.legal-open{overflow:hidden}