/* =========================================================
   legal-page.css – layout and typography for legal pages
   ========================================================= */

.legal-main {
  direction: rtl;
  padding-block: 48px 80px;
  min-height: 60vh;
}

.legal-container {
  max-width: 960px;
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 48px);
}

/* Title row reuse – matches inner-page.css */
.legal-container .inner-page-title-row {
  margin-block-end: 8px;
}

.legal-updated {
  font-size: clamp(0.8rem, 1.5vw, 0.9rem);
  color: #6b7280;
  margin-block-end: 40px;
}

/* Sections */
.legal-section {
  margin-block-start: 40px;
}

.legal-section__title {
  font-size: clamp(1rem, 2vw, 1.2rem);
  font-weight: 700;
  color: #1a1a2e;
  margin-block-end: 12px;
  line-height: 1.5;
}

.legal-section p {
  font-size: clamp(0.875rem, 1.6vw, 1rem);
  line-height: 1.9;
  color: #1a1a2e;
  margin-block-end: 14px;
}

/* Lists inside legal sections */
.legal-list {
  padding-inline-start: 24px;
  margin-block: 10px 14px;
  list-style: disc;
}

.legal-list li {
  font-size: clamp(0.875rem, 1.6vw, 1rem);
  line-height: 1.9;
  color: #1a1a2e;
  margin-block-end: 6px;
}

/* Bracketed editorial notes inside headings */
.legal-note {
  font-size: 0.8em;
  font-weight: 400;
  color: #e55a1c;
  display: block;
  margin-block-start: 4px;
}

/* Third-party table */
.legal-table {
  width: 100%;
  border-collapse: collapse;
  margin-block: 16px 14px;
  font-size: clamp(0.8rem, 1.4vw, 0.9rem);
  direction: rtl;
  text-align: right;
}

.legal-table th,
.legal-table td {
  border: 1px solid #d1d5db;
  padding: 10px 14px;
  vertical-align: top;
  line-height: 1.7;
  color: #1a1a2e;
}

.legal-table thead th {
  background-color: #f3f4f6;
  font-weight: 700;
}

.legal-table__note {
  font-size: 0.85em;
  color: #6b7280;
  font-style: italic;
}

/* Email link */
.legal-section a[href^="mailto"] {
  color: #e55a1c;
  text-decoration: underline;
  word-break: break-all;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .legal-main {
    padding-block: 32px 60px;
  }

  .legal-section {
    margin-block-start: 28px;
  }

  .legal-table {
    font-size: 0.78rem;
  }

  .legal-table th,
  .legal-table td {
    padding: 8px 10px;
  }
}