/* ============================================================
   GridSync LLC - shared legal stylesheet (privacy + terms)
   Loaded alone; defines its own background and text colours.
   ============================================================ */

:root {
  --bus-night: #141A18;
  --chassis-deep: #1B2320;
  --dial-cream: #F1EDE0;
  --copper-bus: #C07840;
  --panel-bone: #E7E2D2;
  --bus-ink: #232622;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  line-height: 1.7;
  background-color: #141A18;
  color: #F1EDE0;
  overflow-x: hidden;
}

.legal-skip {
  position: absolute;
  left: -9999px;
  background-color: #C07840;
  color: #232622;
  padding: 10px 18px;
  text-decoration: none;
}

.legal-skip:focus {
  left: 12px;
  top: 12px;
}

.legal-header {
  background-color: #1B2320;
  border-bottom: 4px solid #C07840;
  padding: 30px 24px;
}

.legal-header-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px;
}

.legal-header h1 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  color: #F1EDE0;
  font-size: 2.1rem;
  margin: 0 0 10px;
}

.legal-header .legal-brand {
  display: inline-block;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: bold;
  color: #F1EDE0;
  background-color: #232622;
  border: 2px solid #C07840;
  border-radius: 5px;
  padding: 7px 15px;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  text-decoration: none;
}

.legal-header .legal-updated {
  color: #F1EDE0;
  font-size: 0.95rem;
  margin: 0;
}

.legal-toc {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 24px;
}

.legal-toc h2 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  color: #C07840;
  font-size: 1.2rem;
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.legal-toc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
}

.legal-toc-list a {
  color: #F1EDE0;
  text-decoration: none;
  font-size: 0.95rem;
}

.legal-toc-list a:hover,
.legal-toc-list a:focus {
  color: #C07840;
  text-decoration: underline;
}

.legal-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px 60px;
}

.legal-content section {
  background-color: transparent !important;
  margin-bottom: 34px;
}

.legal-content h2 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  color: #C07840;
  font-size: 1.5rem;
  border-bottom: 2px solid #232622;
  padding-bottom: 10px;
  margin: 0 0 16px;
}

.legal-content h3 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  color: #F1EDE0;
  font-size: 1.15rem;
  margin: 22px 0 10px;
}

.legal-content p,
.legal-content li {
  color: #F1EDE0;
  font-size: 1.03rem;
}

.legal-content ul {
  padding-left: 22px;
  margin: 0 0 1.2em;
}

.legal-content li {
  margin-bottom: 8px;
}

.legal-content a {
  color: #C07840;
  text-decoration: underline;
}

.legal-note {
  background-color: #1B2320;
  border-left: 5px solid #C07840;
  border-radius: 4px;
  padding: 18px 22px;
  margin: 0 0 30px;
}

.legal-note p {
  margin: 0;
}

.legal-footer {
  background-color: #1B2320;
  border-top: 4px solid #C07840;
  padding: 30px 24px;
  text-align: center;
}

.legal-footer p {
  max-width: 900px;
  margin: 0 auto 10px;
  padding: 0 24px;
  color: #F1EDE0;
  font-size: 0.95rem;
}

.legal-footer a {
  color: #C07840;
  text-decoration: underline;
  font-weight: bold;
}

.legal-footer .legal-foot-links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 14px;
}

.legal-footer .legal-foot-links a {
  font-family: "Trebuchet MS", Verdana, sans-serif;
}

@media (max-width: 640px) {
  .legal-header h1 {
    font-size: 1.6rem;
  }
  .legal-content h2 {
    font-size: 1.25rem;
  }
}