/* ===================================================================
   FLOWTRIG — terms.css   (Terms & Data / Privacy page)
   Uses global tokens + tokens.css gradients.
   =================================================================== */
.tm-page > section{ padding:clamp(30px,4vw,52px) 0; }
.tm-page .wrap{ width:min(1160px, 90vw); margin-inline:auto; }
.tm-layout{ padding:0 clamp(0px,1vw,12px); }
.tm-hero{ text-align:center; padding:clamp(40px,5vw,66px) 0 0; }
.tm-hero .sec-kicker{ justify-content:center; }
.tm-hero h1{ font-family:var(--font-d); font-weight:600; letter-spacing:-.03em; font-size:clamp(32px,5vw,56px); line-height:1.05; margin:16px 0 0; }
.tm-hero .sub{ margin:16px auto 0; max-width:58ch; }
.tm-meta{ display:inline-flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:20px; }
.tm-meta .pill{ display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--tx-soft); background:var(--surface); border:1px solid var(--line); padding:7px 13px; border-radius:999px; }
.tm-meta .pill svg{ width:14px; height:14px; color:var(--neon); }

/* trust badges row */
.tm-badges{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:clamp(24px,3vw,38px); }
@media(max-width:760px){ .tm-badges{ grid-template-columns:repeat(2,1fr); } }
.tm-badge{ border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:18px; text-align:center; transition:transform .25s, border-color .2s, box-shadow .25s; }
.tm-badge:hover{ transform:translateY(-3px); border-color:var(--line-glow); box-shadow:0 0 34px -16px rgba(43,232,129,.4); }
.tm-badge .bi{ width:44px; height:44px; border-radius:13px; margin:0 auto 12px; background:var(--green-soft); border:1px solid rgba(43,232,129,.2); color:var(--neon); display:flex; align-items:center; justify-content:center; }
.tm-badge .bi svg{ width:22px; height:22px; }
.tm-badge .bt{ font-size:14px; font-weight:600; }
.tm-badge .bs{ font-size:11.5px; color:var(--tx-mute); margin-top:4px; line-height:1.4; }

/* layout: sticky TOC + content */
.tm-layout{ display:flex; gap:clamp(28px,3vw,46px); align-items:flex-start; }
@media(max-width:900px){ .tm-layout{ flex-direction:column; } .tm-toc{ position:static !important; display:none; } }
.tm-toc{ flex:0 0 240px; position:sticky; top:96px; border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:14px; }
.tm-toc .th{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tx-mute); padding:6px 10px; }
.tm-toc a{ display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:9px; font-size:13px; color:var(--tx-soft); transition:background .15s, color .15s; }
.tm-toc a:hover, .tm-toc a.active{ background:var(--green-soft); color:var(--tx); }
.tm-toc a .n{ font-family:var(--font-m); font-size:10.5px; color:var(--tx-mute); width:16px; flex:0 0 16px; }
.tm-toc a.active .n{ color:var(--neon); }
.tm-toc a .ti{ width:18px; height:18px; flex:0 0 18px; display:inline-flex; align-items:center; justify-content:center; color:var(--tx-mute); }
.tm-toc a .ti svg{ width:15px; height:15px; }
.tm-toc a.active .ti, .tm-toc a:hover .ti{ color:var(--neon); }

/* content */
.tm-content{ flex:1 1 0%; min-width:0; padding-right:clamp(12px,2vw,28px); }
.tm-clause p, .tm-clause li{ overflow-wrap:anywhere; }
.tm-clause{ scroll-margin-top:90px; padding:24px 26px; border:1px solid var(--line); border-radius:18px; background:var(--surface); margin-bottom:16px; box-sizing:border-box; max-width:100%; }
.tm-clause .ch{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-bottom:14px; }
.tm-clause .ch .ci{ width:40px; height:40px; flex:0 0 40px; border-radius:12px; background:var(--green-soft); border:1px solid rgba(43,232,129,.2); color:var(--neon); display:flex; align-items:center; justify-content:center; }
.tm-clause .ch .ci svg{ width:20px; height:20px; }
.tm-clause .ch h2{ font-family:var(--font-d); font-weight:600; font-size:clamp(18px,2vw,22px); letter-spacing:-.01em; }
.tm-clause .ch .n{ font-family:var(--font-m); font-size:11px; color:var(--tx-mute); }
.tm-clause p{ font-size:14px; line-height:1.7; color:var(--tx-soft); margin-top:10px; }
.tm-clause p:first-of-type{ margin-top:0; }
.tm-clause p strong{ color:var(--tx); }
.tm-clause ul{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:9px; }
.tm-clause li{ position:relative; display:block; padding-left:28px; font-size:13.5px; color:var(--tx-soft); line-height:1.6; }
.tm-clause li .ck{ position:absolute; left:0; top:4px; width:18px; height:18px; flex:none; border-radius:50%; background:var(--green-soft); color:var(--neon); display:inline-flex; align-items:center; justify-content:center; }
.tm-clause li .ck svg{ width:10px; height:10px; }
/* emphasis / liability callout */
.tm-note{ border:1px solid rgba(244,180,58,.32); background:rgba(244,180,58,.08); border-radius:14px; padding:14px 16px; margin-top:14px; display:flex; gap:12px; }
.tm-note .ni{ flex:0 0 20px; color:var(--amber); }
.tm-note .ni svg{ width:20px; height:20px; }
.tm-note p{ margin:0; font-size:13px; color:var(--tx-soft); line-height:1.6; }
.tm-note.strong{ border-color:rgba(255,107,87,.32); background:rgba(255,107,87,.08); }
.tm-note.strong .ni{ color:var(--rose); }

.tm-disc{ text-align:center; font-size:12px; color:var(--tx-mute); margin-top:18px; max-width:70ch; margin-inline:auto; }

/* Body text now aligns naturally under the heading (icon sits above) */
.tm-clause p,
.tm-clause ul,
.tm-clause .tm-note{ margin-left:0; }
@media(max-width:600px){
  .tm-clause p,
  .tm-clause ul,
  .tm-clause .tm-note{ margin-left:0; }
}
