/* ═══════════════════════════════════════════════════════════
   BRAVOS: LEGAL PAGES (privacy policy)
   Loaded via extra_css, so responsive.css still lands last.
   ═══════════════════════════════════════════════════════════ */

.lg-wrap{
  display:grid; grid-template-columns:240px minmax(0,1fr); gap:56px;
  align-items:start;
}

/* ── Contents rail ── */
.lg-toc{
  position:sticky; top:calc(var(--nav-h) + 24px);
  padding:20px 22px; border-radius:var(--r-lg);
  background:var(--stone-lt);
}
.lg-toc-title{
  font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gray-500); margin-bottom:12px;
}
.lg-toc ol{ list-style:none; margin:0; padding:0; counter-reset:lg; }
.lg-toc li{ counter-increment:lg; }
/* `li a`, not `a`: main.css underlines `li a:not([class])` as prose, and
   that selector outranks a single class. */
.lg-toc li a{
  display:flex; gap:8px; padding:6px 0;
  font-size:.86rem; font-weight:600; color:var(--gray-700); line-height:1.4;
  text-decoration:none;
}
.lg-toc a::before{ content:counter(lg) "."; min-width:20px; color:var(--gray-400); font-weight:600; }
.lg-toc a:hover{ color:var(--gray-900); }

/* ── Body ── */
.lg-body{ max-width:760px; }
.lg-updated{
  display:inline-block; margin-bottom:28px; padding:5px 12px; border-radius:100px;
  background:var(--c-orange-tint); color:var(--c-orange-deep);
  font-size:.8rem; font-weight:700;
}
.lg-body section{
  padding:28px 0; border-top:1px solid var(--gray-200);
  /* The navbar is fixed, so a contents link would land the heading under it. */
  scroll-margin-top:calc(var(--nav-h) + 16px);
}
.lg-body section:first-of-type{ border-top:none; padding-top:0; }
.lg-body h2{ font-size:1.35rem; letter-spacing:-.01em; color:var(--gray-900); margin-bottom:14px; }
.lg-body p, .lg-body li, .lg-body dd{ font-size:.97rem; line-height:1.75; color:var(--gray-700); }
.lg-body p + p{ margin-top:12px; }
/* main.css resets every list to list-style:none for the nav and cards. */
.lg-body ul{ margin:12px 0 0; padding-left:20px; list-style:disc; }
.lg-body li{ margin-bottom:8px; }
.lg-body li::marker{ color:var(--gray-400); }
.lg-body a{ color:var(--gray-900); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.lg-body a:hover{ color:var(--c-orange-deep); }
.lg-body strong{ color:var(--gray-900); }

.lg-list{
  display:grid; grid-template-columns:180px minmax(0,1fr); gap:0;
  margin-top:18px; border-top:1px solid var(--gray-200);
}
.lg-list dt, .lg-list dd{ padding:14px 0; border-bottom:1px solid var(--gray-200); margin:0; }
.lg-list dt{ font-size:.92rem; font-weight:700; color:var(--gray-900); padding-right:20px; }

.lg-contact{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px;
  margin-top:16px; padding:22px 24px; border-radius:var(--r-lg);
  background:var(--stone-lt);
}
.lg-contact p{ margin:0; }
.lg-contact p + p{ margin-top:0; }

/* ── Responsive ── */
@media (max-width:900px){
  .lg-wrap{ grid-template-columns:1fr; gap:0; }
  /* Twelve links stacked above the text would push the policy a full screen
     down on a phone; the headings are numbered, so the page reads without it. */
  .lg-toc{ display:none; }
}
@media (max-width:600px){
  .lg-list{ grid-template-columns:1fr; }
  .lg-list dt{ padding-bottom:2px; border-bottom:none; }
  .lg-list dd{ padding-top:0; }
  .lg-contact{ grid-template-columns:1fr; padding:18px; }
  .lg-body h2{ font-size:1.2rem; }
  .lg-body p, .lg-body li, .lg-body dd{ font-size:.94rem; }
}