/* Legal document component (.lg): used on privacy.html / terms.html and inside the booking dialog.
   Colours come from the page's tokens; the dialog maps them to its own below. */
.lg{
  --lg-text:var(--text-2); --lg-strong:var(--bone); --lg-muted:var(--ash); --lg-line:var(--line); --lg-accent:var(--neon);
  --lg-link:var(--bone); --lg-card:var(--soot); --lg-note-bg:var(--bk-note-bg); --lg-note-ink:var(--bk-note-ink);
  container-type:inline-size; color:var(--lg-text); font-size:16.5px; line-height:1.65; overflow-wrap:break-word; min-width:0;
}
.bk .lg{--lg-text:var(--bk-text); --lg-strong:var(--bk-text); --lg-muted:var(--bk-muted); --lg-line:var(--bk-line); --lg-accent:var(--bk-accent); --lg-link:var(--bk-text); --lg-card:var(--bk-card); font-size:15.5px}
.lg p{margin:0 0 14px; max-width:74ch}
.lg strong{color:var(--lg-strong); font-weight:600}
.lg a{color:var(--lg-link); text-underline-offset:4px; text-decoration-color:var(--lg-accent); overflow-wrap:anywhere}
.lg a:hover{text-decoration-thickness:2px}
.lg-nw{white-space:nowrap}
.lg-meta{color:var(--lg-muted); font-size:14px; margin-bottom:18px}
.lg-lead{font-size:1.09em; color:var(--lg-strong)}
.lg-note{padding:12px 16px; border-radius:12px; background:var(--lg-note-bg); color:var(--lg-note-ink); font-size:14.5px; line-height:1.5; max-width:74ch}
.lg-note--quiet{background:transparent; color:var(--lg-muted); padding:0; font-style:italic}
.lg-todo{background:var(--lg-note-bg); color:var(--lg-note-ink); padding:1px 8px; border-radius:6px; font-size:.92em; font-weight:500; box-decoration-break:clone; -webkit-box-decoration-break:clone}

.lg-toc{margin:26px 0 8px; padding:20px 24px; border:1px solid var(--lg-line); border-radius:16px; background:var(--lg-card)}
.lg-toc__t{margin:0 0 10px; font:600 13px/1.2 var(--body); letter-spacing:.06em; text-transform:uppercase; color:var(--lg-muted)}
.lg-toc ol{margin:0; padding:0 0 0 1.5em; columns:2; column-gap:40px; font-size:15px; line-height:1.45}
.lg-toc li{margin:0 0 8px; break-inside:avoid; padding-left:2px}
.lg-toc li::marker{color:var(--lg-muted); font-variant-numeric:tabular-nums}
.lg-toc a{text-decoration-color:transparent}
.lg-toc a:hover{text-decoration-color:var(--lg-accent)}

.lg-sec{padding-top:30px; scroll-margin-top:16px}
.lg-h{margin:0 0 14px; font:700 clamp(18px,2.2cqw + 12px,23px)/1.25 var(--display); letter-spacing:-.005em; color:var(--lg-strong); text-wrap:balance}
.lg-h:focus{outline:none}
.lg-h:focus-visible{outline:2px solid var(--tungsten); outline-offset:4px; border-radius:4px}
.lg-n{display:inline-block; min-width:1.35em; margin-right:.42em; color:var(--lg-accent); font-variant-numeric:tabular-nums}
.lg ul{margin:0 0 14px; padding-left:1.25em; max-width:74ch}
.lg li{margin:0 0 9px; padding-left:3px}
.lg li::marker{color:var(--lg-accent)}

.lg-dl{margin:4px 0 18px; border-top:1px solid var(--lg-line); max-width:860px}
.lg-dl > div{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:6px 28px; padding:12px 0; border-bottom:1px solid var(--lg-line)}
.lg-dl dt{color:var(--lg-strong); font-weight:500; min-width:0}
.lg-dl dd{margin:0; min-width:0; overflow-wrap:anywhere}
@container (max-width:560px){
  .lg-dl > div{grid-template-columns:minmax(0,1fr); gap:2px}
  .lg-dl dt{font-size:.92em; color:var(--lg-muted)}
  .lg-toc ol{columns:1}
  .lg-toc{padding:16px 18px}
}