/* ============================================================
   DYBS INTERNATIONAL LTD — legal.css
   Shared stylesheet for privacy.html and terms-of-service.html
   Legal pages load ONLY this file. Strong contrast, no rgba().
   Palette:
     board-black   #1B1D21
     flap-bone     #F1ECE0
     concourse-ice #C9DEEC
     panel-well    #24272D
     night-apron   #131518
     shaft-slate   #8B95A0
     seam-line     #34383F
   ============================================================ */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-size: 16px;
  margin: 0;
  padding: 0;
  background-color: #1B1D21;
  color: #F1ECE0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a {
  color: #C9DEEC;
  text-decoration: underline;
}

a:hover {
  color: #F1ECE0;
}

h1, h2, h3 {
  line-height: 1.25;
  margin: 0 0 0.6em 0;
  font-weight: 800;
  color: #F1ECE0;
}

p {
  margin: 0 0 1em 0;
  color: #F1ECE0;
}

/* ---------- legal masthead ---------- */

.legal-header {
  background-color: #131518;
  border-bottom: 2px solid #C9DEEC;
  padding: 30px 0;
}

.legal-header-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.legal-header-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.legal-header-disc {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background-color: #C9DEEC;
  color: #121417;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 16px;
  border: 4px solid #24272D;
  flex: 0 0 auto;
}

.legal-header-name {
  font-weight: 800;
  font-size: 16px;
  letter-spacing: 0.14em;
  color: #F1ECE0;
  display: block;
}

.legal-header-sub {
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #8B95A0;
  display: block;
}

.legal-header-home {
  color: #C9DEEC;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ---------- legal page banner ---------- */

.legal-banner {
  background-color: #24272D;
  border-bottom: 1px solid #34383F;
  padding: 46px 0 40px 0;
}

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

.legal-banner h1 {
  font-size: 38px;
  color: #C9DEEC;
  margin-bottom: 12px;
}

.legal-banner .legal-meta {
  color: #F1ECE0;
  font-size: 15px;
  margin: 0;
}

/* ---------- table of contents ---------- */

.legal-toc {
  background-color: #131518;
  border: 1px solid #34383F;
  border-left: 5px solid #C9DEEC;
  border-radius: 5px;
  padding: 22px 24px;
  max-width: 900px;
  margin: 34px auto 10px auto;
}

.legal-toc h2 {
  font-size: 18px;
  color: #C9DEEC;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.legal-toc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 24px;
}

.legal-toc-list li {
  border-bottom: 1px solid #34383F;
  padding: 7px 0;
}

.legal-toc-list a {
  color: #F1ECE0;
  font-size: 14px;
  text-decoration: none;
}

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

/* ---------- legal content ---------- */

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

.legal-content section {
  background-color: transparent !important;
  border-bottom: 1px solid #34383F;
  padding: 26px 0;
}

.legal-content section:last-of-type {
  border-bottom: none;
}

.legal-content h2 {
  font-size: 23px;
  color: #C9DEEC;
  margin-bottom: 12px;
}

.legal-content h3 {
  font-size: 17px;
  color: #F1ECE0;
  margin: 18px 0 8px 0;
}

.legal-content p {
  font-size: 15.5px;
  color: #F1ECE0;
}

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

.legal-content li {
  color: #F1ECE0;
  font-size: 15.5px;
  margin-bottom: 8px;
}

.legal-note {
  background-color: #24272D;
  border: 1px solid #34383F;
  border-left: 5px solid #C9DEEC;
  border-radius: 4px;
  padding: 18px 20px;
  margin: 6px 0 18px 0;
}

.legal-note p {
  margin: 0;
  font-size: 14.5px;
}

.legal-address-block {
  background-color: #24272D;
  border: 1px solid #34383F;
  border-radius: 4px;
  padding: 18px 20px;
  margin: 8px 0 16px 0;
}

.legal-address-block p {
  margin: 0 0 6px 0;
  font-size: 15px;
}

.legal-address-block p:last-child {
  margin-bottom: 0;
}

/* ---------- legal footer ---------- */

.legal-footer {
  background-color: #131518;
  border-top: 2px solid #C9DEEC;
  padding: 34px 0 26px 0;
}

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

.legal-footer-links {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.legal-footer-links a {
  color: #C9DEEC;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.06em;
}

.legal-footer-contact {
  color: #F1ECE0;
  font-size: 14px;
  margin-bottom: 10px;
}

.legal-footer-contact span {
  display: block;
  margin-bottom: 5px;
}

.legal-footer-copy {
  color: #8B95A0;
  font-size: 13px;
  margin: 0;
  border-top: 1px solid #34383F;
  padding-top: 14px;
}

@media (max-width: 640px) {
  .legal-toc-list {
    grid-template-columns: 1fr;
  }
  .legal-banner h1 {
    font-size: 30px;
  }
}
