.hrhs-legal{max-width:1120px}
/* Hero band. A legal page still deserves a front door — and a dark band gives
   the contents card something to sit against, which is what makes the layout
   read as designed rather than as a dumped document. */
.hrhs-legal__head{
  background:var(--hrhs-dark);color:#fff;border-radius:var(--hrhs-radius-xl);
  padding:44px 40px;margin:0 0 30px;text-align:center;position:relative;overflow:hidden}
.hrhs-legal__head::after{content:"";position:absolute;width:620px;height:620px;max-width:100%;
  top:-320px;right:-200px;background:radial-gradient(circle,rgba(74,144,217,.28) 0%,transparent 66%);pointer-events:none}
.hrhs-legal__head>*{position:relative;z-index:1}
.hrhs-legal__eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--hrhs-accent);margin:0 0 10px}
.hrhs-legal h1{font-size:2.6rem;font-weight:800;letter-spacing:-.035em;color:#fff;margin:0 0 10px;line-height:1.08}
.hrhs-legal__meta{font-size:.85rem;color:rgba(255,255,255,.6);margin:0 0 14px}
.hrhs-legal__lede{font-size:1.02rem;line-height:1.7;color:rgba(255,255,255,.85);max-width:62ch;margin:0 auto}
.hrhs-legal__wrap{display:grid;grid-template-columns:230px 1fr;gap:44px;align-items:start}
/* Contents as a card, not a bare list: it is the only navigation on a very long
   page, and it has to look like something you can use. */
.hrhs-legal__toc{position:sticky;top:20px;background:var(--hrhs-white);
  border:1px solid var(--hrhs-border);border-radius:var(--hrhs-radius-lg);
  padding:16px 12px;box-shadow:var(--hrhs-shadow);max-height:calc(100vh - 44px);overflow-y:auto}
.hrhs-legal__toc p{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--hrhs-muted);margin:0 0 10px;padding:0 10px}
.hrhs-legal__toc a{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;
  font-size:.85rem;color:var(--hrhs-text);text-decoration:none;line-height:1.35}
.hrhs-legal__toc a:hover{background:var(--hrhs-light-bg);color:var(--hrhs-dark)}
/* The active section, tracked while scrolling — on a nineteen-section document
   "where am I" is the question the contents list actually answers. */
.hrhs-legal__toc a.is-here{background:var(--hrhs-dark);color:#fff;font-weight:700}
.hrhs-legal__toc a.is-here .hrhs-legal__ico{opacity:1}
.hrhs-legal__ico{width:20px;flex-shrink:0;text-align:center;opacity:.5;font-size:.9rem}
.hrhs-legal__doc{min-width:0;max-width:none;background:var(--hrhs-white);
  border:1px solid var(--hrhs-border);border-radius:var(--hrhs-radius-lg);
  padding:34px 38px;box-shadow:var(--hrhs-shadow)}
.hrhs-legal__doc>section>*{max-width:74ch}
.hrhs-legal__doc section{margin-bottom:34px;padding-bottom:26px;border-bottom:1px solid var(--hrhs-light-bg);scroll-margin-top:24px}
.hrhs-legal__doc section:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}
.hrhs-legal__doc h2{font-size:1.32rem;font-weight:800;color:var(--hrhs-dark);letter-spacing:-.02em;margin:0 0 12px}
.hrhs-legal__doc p{font-size:.95rem;line-height:1.75;margin:0 0 13px}
.hrhs-legal__doc ul{margin:0 0 13px;padding-left:20px}
.hrhs-legal__doc li{font-size:.95rem;line-height:1.7;margin-bottom:7px}
/* A plain-language line before the legal one. People do not read terms; they
   skim for what affects them, and these are the four places it does. */
.hrhs-legal__short{background:var(--hrhs-primary-lt);border-left:3px solid var(--hrhs-primary);border-radius:0 8px 8px 0;padding:12px 16px;font-size:.9rem;line-height:1.65;margin:0 0 14px}
.hrhs-legal__short--warn{background:#fff6e8;border-left-color:#d97706}
.hrhs-legal__foot{margin-top:30px;padding-top:18px;border-top:1px solid var(--hrhs-border);font-size:.9rem;color:var(--hrhs-muted)}
.hrhs-legal__accept{margin-top:40px;padding-top:26px;border-top:1px solid var(--hrhs-border)}
@media (max-width:880px){
  .hrhs-legal__head{padding:30px 22px;border-radius:var(--hrhs-radius-lg)}
  .hrhs-legal__doc{padding:22px 20px}
  .hrhs-legal__wrap{grid-template-columns:1fr;gap:22px}
  .hrhs-legal__toc{position:static;border-left:0;border-top:1px solid var(--hrhs-border);padding:14px 0 0;columns:2;column-gap:20px}
  .hrhs-legal h1{font-size:1.65rem}
}
@media print{
  .hrhs-hdr,.hrhs-legal__toc,.hrhs-legal__accept,.mocknote{display:none}
  .hrhs-legal__wrap{grid-template-columns:1fr}
}

/* ─── Accepting updated terms ────────────────────────────────
   The document is shown on the page, in a scroll region, rather
   than linked away to. "I was never shown them" is the whole of
   the argument this screen exists to answer. */
.hrhs-terms-accept { padding: 0; overflow: hidden; }
.hrhs-terms-accept__doc {
    max-height: 46vh; overflow-y: auto; padding: 22px 24px;
    border-bottom: 1px solid var(--hrhs-border);
}
.hrhs-terms-accept__doc .hrhs-legal__wrap { grid-template-columns: 1fr; gap: 0; }
.hrhs-terms-accept__doc .hrhs-legal__toc { display: none; }
.hrhs-terms-accept__doc:focus-visible { outline: 2px solid var(--hrhs-primary); outline-offset: -2px; }
.hrhs-terms-accept__form { padding: 20px 24px 24px; }
.hrhs-terms-accept__tick { display: flex; gap: 11px; align-items: flex-start; font-size: .95rem; line-height: 1.6; }
.hrhs-terms-accept__tick input { margin-top: 3px; flex-shrink: 0; }
.hrhs-terms-accept__actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 18px; }
.hrhs-terms-accept__out { margin-left: auto; font-size: .88rem; color: var(--hrhs-muted); }
.hrhs-terms-accept__note { margin: 14px 0 0; font-size: .8rem; color: var(--hrhs-muted); }
@media (max-width: 640px) {
    .hrhs-terms-accept__doc { max-height: 40vh; padding: 18px; }
    .hrhs-terms-accept__actions .hrhs-btn { width: 100%; }
    .hrhs-terms-accept__out { margin: 4px auto 0; }
}

/* ─── Terms inside the registration modal ────────────────────
   The document renders in a scroll region with no contents list:
   a nineteen-entry sidebar inside a modal is unusable, and the
   full page is one click away for anyone who wants to navigate. */
.hrhs-tos-doc .hrhs-legal__wrap{display:block}
.hrhs-tos-doc .hrhs-legal__toc{display:none}
.hrhs-tos-doc .hrhs-legal__doc{border:0;box-shadow:none;padding:0;background:none}
.hrhs-tos-doc .hrhs-legal__doc h2{font-size:1.02rem}
.hrhs-tos-doc .hrhs-legal__doc section{margin-bottom:20px;padding-bottom:16px}
.hrhs-tos-doc .hrhs-legal__short{font-size:.85rem;padding:10px 13px}
.hrhs-tos-updated{font-size:.78rem;color:var(--hrhs-muted);margin:0 0 16px}

/* ─── Links inside a legal document ──────────────────────────
   Pinned across every state for the same reason the buttons are:
   an Elementor kit styles bare `a` site-wide, and a cross-reference
   between policies repainted in the kit's accent stops looking like
   a link to the document it points at. */
.hrhs-legal__doc a,
.hrhs-legal__doc a:link,
.hrhs-legal__doc a:visited{color:var(--hrhs-primary-dk)!important;text-decoration:underline;text-underline-offset:2px}
.hrhs-legal__doc a:hover{color:var(--hrhs-dark)!important}
.hrhs-legal__doc a:focus-visible{outline:2px solid var(--hrhs-primary);outline-offset:2px;border-radius:2px}
.hrhs-legal__toc a,
.hrhs-legal__toc a:link,
.hrhs-legal__toc a:visited,
.hrhs-legal__toc a:focus,
.hrhs-legal__toc a:active{color:var(--hrhs-text)!important;text-decoration:none!important}
.hrhs-legal__toc a:hover{color:var(--hrhs-dark)!important}
.hrhs-legal__toc a.is-here,
.hrhs-legal__toc a.is-here:link,
.hrhs-legal__toc a.is-here:visited,
.hrhs-legal__toc a.is-here:hover{color:#fff!important}
