/* Shared styles for the static teaser legal pages (/privacy, /terms).
   Loaded after the site bundle CSS (/assets/index-*.css), which supplies the
   base reset, system font stack and letter-spacing. Sizes mirror the SPA's
   legal pages (text-sm / leading-relaxed / max-w-4xl). */

[hidden] { display: none !important; }

.lx-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 199; }
.lx-bar {
  display: flex; align-items: center; justify-content: space-between;
  height: 56px; padding: 0 24px; background: #1c1c1c;
}
.lx-bar a { display: block; }
.lx-bar img { display: block; height: 20px; width: auto; }
.lx-bar .lx-home { color: rgba(255, 255, 255, .7); font-size: 13px; text-decoration: none; }
.lx-bar .lx-home:hover { color: #fff; }
@media (min-width: 1024px) {
  .lx-nav { top: 32px; }
  .lx-bar { max-width: 85rem; margin: 0 auto; height: 62px; border-radius: 9999px; }
}

.lx-hero {
  padding: 128px 16px 16px; text-align: center;
  background: linear-gradient(to bottom, hsl(0 0% 96% / .3), #fff);
}
.lx-hero h1 { margin: 0 0 16px; font-size: 18px; line-height: 28px; font-weight: 700; color: #000; }
.lx-rule { width: 48px; height: 2px; margin: 0 auto; background: #000; }
.lx-updated { margin: 16px 0 0; font-size: 12px; line-height: 18px; color: hsl(0 0% 45%); }

.lx-main { padding: 32px 16px 64px; }
.lx-wrap { max-width: 56rem; margin: 0 auto; padding: 0 32px; color: #000; }
.lx-wrap p, .lx-wrap li, .lx-wrap td, .lx-wrap th { font-size: 14px; line-height: 1.625; color: #000; }
.lx-wrap p { margin: 0 0 8px; }
.lx-wrap h2 { margin: 32px 0 12px; font-size: 16px; line-height: 24px; font-weight: 700; color: #000; }
.lx-wrap h3 { margin: 16px 0 6px; font-size: 14px; line-height: 22px; font-weight: 700; color: #000; }
.lx-wrap a { color: #000; text-decoration: underline; text-underline-offset: 2px; word-break: break-word; }
.lx-wrap a:hover { color: #404040; }
.lx-wrap ul { margin: 0 0 8px; padding: 0; list-style: none; }
.lx-wrap ul > li { display: flex; align-items: flex-start; margin: 0 0 4px; }
.lx-wrap ul > li::before { content: "•"; margin-right: 8px; }
.lx-wrap ol { margin: 0 0 8px; padding-left: 1.4em; list-style: decimal; }
.lx-wrap ol > li { margin: 0 0 4px; padding-left: 2px; }
.lx-wrap ol > li::marker { font-weight: 700; }
.lx-table { margin: 8px 0 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lx-table table { width: 100%; min-width: 480px; border-collapse: collapse; }
.lx-table th, .lx-table td { padding: 8px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid #e5e5e5; }
.lx-table th { font-weight: 700; background: hsl(0 0% 96%); }
.lx-contact { margin-top: 8px; }
.lx-contact p { margin: 0 0 4px; }

.lx-footer { padding: 32px 24px 96px; background: #0f0f0f; color: rgba(255, 255, 255, .6); text-align: center; }
.lx-footer p { margin: 0; font-size: 12px; line-height: 20px; }
.lx-footer nav { margin-top: 8px; display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; }
.lx-footer a { color: rgba(255, 255, 255, .75); font-size: 12px; text-decoration: none; }
.lx-footer a:hover { color: #fff; }

.lx-toggle {
  position: fixed; right: 24px; bottom: 24px; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; padding: 0; border: 0; border-radius: 9999px; cursor: pointer;
  background: rgba(0, 0, 0, .8); color: #fff;
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
  font-size: 1.2rem; font-weight: 600; line-height: 1;
  transition: background-color .2s;
}
.lx-toggle:hover { background: rgba(0, 0, 0, .93); }
.lx-toggle:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
