/* The published terms pages (/terms/coaches, /terms/coaching): static documents to read, save or print, in Actiiv's
   own look (paid.html's palette, the pay page's layout), on both actiiv.club and coach.actiiv.club. No inline style
   and no script on those pages: everything visual is here. Dark is the default; light follows the phone's setting.
   Inter and Fraunces come from /fonts/fonts.css (self-hosted); the system faces stand in until they load. */
:root{
  --bg:#101210;--card:#181B18;--card-2:#1F231F;--line:#2F332E;--ink:#F5F2EC;--muted:#B8BBB2;--sage:#C9D3C0;--focus:#E9E4D8;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --serif:'Fraunces','Iowan Old Style','Palatino Linotype',Palatino,Georgia,'Times New Roman',serif;
  color-scheme:dark
}
@media (prefers-color-scheme:light){
  :root{--bg:#F5F2EC;--card:#FFFFFF;--card-2:#FBF9F5;--line:#E0DBD1;--ink:#1E201D;--muted:#474A44;--sage:#46553F;--focus:#1E201D;color-scheme:light}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
body{margin:0;min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
a:hover{text-decoration-thickness:2px}
p{margin:0}
img{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:8px}
.terms-skip{position:absolute;left:12px;top:-64px;z-index:10;background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:999px;font-weight:600;text-decoration:none}
.terms-skip:focus{top:12px}

/* ---- layout: one column, a phone first ---- */
.terms{min-height:100vh;min-height:100dvh;display:flex;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 16px max(28px,env(safe-area-inset-bottom))}
.terms-col{width:100%;max-width:680px;display:flex;flex-direction:column}
.terms-top{display:flex;align-items:center;justify-content:center;min-height:48px;margin:4px 0 18px}
.terms-mark{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;border-radius:8px}
.terms-logo{height:30px;width:auto}
.terms-logo-light{display:none}
@media (prefers-color-scheme:light){
  .terms-logo-dark{display:none}
  .terms-logo-light{display:block}
}
.terms-body{outline:none}
@media (min-width:720px){
  .terms{padding-top:48px}
  .terms-top{margin-bottom:28px}
  .terms-body{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:40px 44px 36px}
}

/* ---- type ---- */
.terms-eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 10px}
h1{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.15;letter-spacing:-.015em;margin:0 0 8px;overflow-wrap:anywhere}
h2{font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.25;margin:0 0 10px}
h3{font-size:16px;font-weight:600;margin:20px 0 8px}
.terms-lede{color:var(--muted);font-size:17px;margin:0 0 6px}
.terms-note{margin:18px 0 0;padding:12px 14px;border-radius:12px;background:var(--card-2);border:1px solid var(--sage);font-size:15px}
.terms-note strong{font-weight:600}
section{margin-top:30px}
section p+p,section ul+p,section p+ul,section table+p{margin-top:10px}
ul{margin:0;padding-left:22px}
li{margin:4px 0}
strong{font-weight:600}

/* ---- contents ---- */
.terms-toc{margin-top:22px;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--card-2)}
@media (min-width:720px){.terms-toc{background:var(--bg)}}
.terms-toc-h{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 6px}
/* each entry carries its own section number ("1. Who we are"), so the list adds none of its own */
.terms-toc ol{margin:0;padding-left:0;list-style:none;font-size:15px;columns:2;column-gap:20px}
@media (max-width:480px){.terms-toc ol{columns:1}}
.terms-toc li{break-inside:avoid;margin:3px 0}

/* ---- tables (the fee and seat schedules) ---- */
table{width:100%;border-collapse:collapse;margin-top:8px;font-size:15px}
th,td{text-align:left;vertical-align:top;padding:10px 10px 10px 0;border-bottom:1px solid var(--line)}
th{font-weight:600}
th,td{overflow-wrap:break-word}
/* A table of four columns or more (the privacy notice's AI features and providers, class terms-wide from
   tools/legal/privacy-page.mjs) on a phone: one block per row, each cell under its column's name (data-label), so the
   page never scrolls sideways. The column names stay in the markup for screen readers. */
@media (max-width:600px){
  .terms-wide thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .terms-wide,.terms-wide tbody,.terms-wide tr,.terms-wide td{display:block;width:100%}
  .terms-wide tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .terms-wide td{border:0;padding:3px 0}
  .terms-wide td::before{content:attr(data-label);display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--muted)}
}

/* ---- footer ---- */
.terms-foot{margin-top:26px;padding:0 2px;font-size:14px;color:var(--muted);text-align:center;display:grid;gap:4px;justify-items:center}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{
  html,body{background:#fff;color:#000}
  .terms-body{border:0;padding:0}
  .terms-skip,.terms-toc{display:none}
}
