/* Hayo Pay legal pages.
   Same token names as consent-block.html. Swap these five values
   for the real brand tokens and every page follows. */
:root{
  --hp-ink:        #0A0A0A;
  --hp-ink-muted:  #6B6B6B;
  --hp-surface:    #FFFFFF;
  --hp-surface-2:  #FAFAF9;
  --hp-rule:       #E8E6E3;
  --hp-accent:     #E85D2F;
  --hp-font:       -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Helvetica, Arial, sans-serif;
  --hp-measure:    68ch;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--hp-surface);
  color:var(--hp-ink);
  font-family:var(--hp-font);
  font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

.skip{
  position:absolute; left:-9999px;
  background:var(--hp-ink); color:#fff; padding:12px 16px; border-radius:8px;
}
.skip:focus{left:16px; top:16px; z-index:10}

/* ---- header ---- */
.doc-head{
  max-width:var(--hp-measure); margin:0 auto;
  padding:32px 24px 0;
  display:flex; align-items:baseline; gap:12px;
}
.doc-home{
  font-weight:600; font-size:16px; letter-spacing:-.01em;
  color:var(--hp-ink); text-decoration:none;
}
.doc-kicker{
  margin:0; font-size:11px; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--hp-ink-muted);
}

/* ---- document body ---- */
.doc{
  max-width:var(--hp-measure); margin:0 auto;
  padding:40px 24px 80px;
}
.doc h1{
  font-size:34px; line-height:1.15; letter-spacing:-.022em;
  margin:0 0 28px;
}
/* Section headings inside the document. */
.doc h1 + p + h1, .doc h1 ~ h1{
  font-size:24px; letter-spacing:-.015em;
  margin:56px 0 14px; padding-top:28px;
  border-top:1px solid var(--hp-rule);
}
.doc h2{
  font-size:20px; letter-spacing:-.01em;
  margin:44px 0 12px; padding-top:24px;
  border-top:1px solid var(--hp-rule);
}
.doc h3{font-size:17px; margin:28px 0 8px}

.doc p{margin:0 0 16px}
.doc ul,.doc ol{padding-left:22px; margin:0 0 16px}
.doc li{margin:8px 0}
.doc strong{font-weight:600}

.doc a{color:var(--hp-ink); text-decoration:underline; text-underline-offset:2px}
.doc a:hover{color:var(--hp-accent)}
.doc a:focus-visible,.doc-nav a:focus-visible{
  outline:2px solid var(--hp-accent); outline-offset:2px; border-radius:2px;
}

.doc-lede{font-size:18px; color:var(--hp-ink-muted); margin:0 0 28px}

/* ---- tables ---- */
.doc table{
  border-collapse:collapse; width:100%;
  margin:20px 0; font-size:14px;
}
.doc th,.doc td{
  border:1px solid var(--hp-rule);
  padding:9px 11px; text-align:left; vertical-align:top;
}
.doc th{background:var(--hp-surface-2); font-weight:600}

/* ---- legal hub index ---- */
.doc-index{list-style:none; padding:0; margin:0}
.doc-index li{
  display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  padding:16px 0; margin:0; border-bottom:1px solid var(--hp-rule);
}
.doc-index li span:last-child{
  font-size:13px; color:var(--hp-ink-muted); white-space:nowrap;
}
.doc-index a{font-weight:550}
.doc-index .pending span:first-child{color:var(--hp-ink-muted)}

/* ---- footer ---- */
.doc-foot{
  border-top:1px solid var(--hp-rule);
  background:var(--hp-surface-2);
}
.doc-nav,.doc-entity{max-width:var(--hp-measure); margin:0 auto; padding:0 24px}
.doc-nav{
  padding-top:32px;
  display:flex; flex-wrap:wrap; gap:8px 20px;
  font-size:14px;
}
.doc-nav a{color:var(--hp-ink-muted); text-decoration:none}
.doc-nav a:hover{color:var(--hp-ink); text-decoration:underline; text-underline-offset:2px}
.doc-nav [aria-current="page"]{color:var(--hp-ink); font-weight:600}
.doc-entity{
  padding-top:24px; padding-bottom:48px;
  font-size:13px; line-height:1.6; color:var(--hp-ink-muted);
}
.doc-entity a{color:var(--hp-ink-muted)}

@media (max-width:600px){
  .doc h1{font-size:28px}
  .doc-index li{flex-direction:column; gap:4px}
  .doc-index li span:last-child{white-space:normal}
}