/* ============================================================
   PLAIN GREEN LOANS OFFER — Legal Pages & Sitemap CSS
   Applies to: privacy.html, terms.html, sitemap.html
   ============================================================ */

/* ─── Legal Layout ─── */
.legal-wrap {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 48px;
  align-items: flex-start;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ─── Table of Contents ─── */
.legal-toc {
  position: sticky;
  top: 24px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px 20px;
  box-shadow: var(--shadow-sm);
}
.legal-toc-title {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.legal-toc ol {
  list-style: none;
  counter-reset: toc;
  padding: 0;
}
.legal-toc li {
  counter-increment: toc;
  margin-bottom: 2px;
}
.legal-toc a {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: .8rem;
  color: var(--text-muted);
  padding: 6px 8px;
  border-radius: 6px;
  transition: all var(--transition);
  line-height: 1.4;
  text-decoration: none;
}
.legal-toc a::before {
  content: counter(toc) ".";
  font-size: .72rem;
  font-weight: 700;
  color: var(--accent);
  min-width: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}
.legal-toc a:hover,
.legal-toc a.active {
  background: var(--accent-light);
  color: var(--secondary);
}
.toc-meta {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: .73rem;
  color: var(--text-muted);
  line-height: 1.6;
}
.toc-meta strong {
  color: var(--primary);
  display: block;
  margin-bottom: 2px;
}

/* ─── Legal Content ─── */
.legal-content {
  padding: 48px 0 64px;
  min-width: 0;
}

/* Updated badge */
.legal-updated {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--accent-light);
  border: 1px solid var(--border);
  border-radius: 50px;
  padding: 7px 16px;
  font-size: .78rem;
  font-weight: 600;
  color: var(--secondary);
  margin-bottom: 32px;
}
.legal-updated::before {
  content: '';
  width: 7px; height: 7px;
  background: var(--accent);
  border-radius: 50%;
  display: inline-block;
  animation: blink 2s ease-in-out infinite;
}
@keyframes blink {
  0%,100% { opacity: 1; }
  50% { opacity: .35; }
}

/* Section blocks */
.legal-section {
  margin-bottom: 48px;
  scroll-margin-top: 96px;
}
.legal-section-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--accent-light);
}
.legal-section-num {
  width: 36px; height: 36px;
  background: var(--primary);
  color: var(--white);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
  flex-shrink: 0;
}
.legal-section h2 {
  font-family: 'Inter', sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--primary);
  margin: 0;
}
.legal-section p {
  font-size: .92rem;
  line-height: 1.8;
  color: var(--text-muted);
  margin-bottom: 14px;
}
.legal-section p:last-child { margin-bottom: 0; }

/* Sub-sections */
.legal-subsection {
  margin: 20px 0;
  padding-left: 18px;
  border-left: 3px solid var(--accent-light);
}
.legal-subsection h3 {
  font-family: 'Inter', sans-serif;
  font-size: .95rem;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 8px;
}

/* Lists */
.legal-list {
  list-style: none;
  padding: 0;
  margin: 12px 0;
}
.legal-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: .88rem;
  color: var(--text-muted);
  padding: 6px 0;
  border-bottom: 1px solid var(--bg);
  line-height: 1.65;
}
.legal-list li::before {
  content: '›';
  color: var(--accent);
  font-weight: 700;
  font-size: 1rem;
  flex-shrink: 0;
  margin-top: 1px;
}
.legal-list.disc li::before { content: '•'; }
.legal-list.numbered {
  counter-reset: lnum;
}
.legal-list.numbered li {
  counter-increment: lnum;
}
.legal-list.numbered li::before {
  content: counter(lnum) ".";
  font-size: .8rem;
  font-weight: 700;
  color: var(--accent);
  min-width: 20px;
}

/* Highlight boxes */
.legal-box {
  border-radius: var(--radius);
  padding: 18px 22px;
  margin: 20px 0;
  font-size: .88rem;
  line-height: 1.7;
}
.legal-box-info {
  background: var(--accent-light);
  border: 1px solid #A7F3D0;
  border-left: 4px solid var(--accent);
  color: var(--secondary);
}
.legal-box-warn {
  background: #FFFBEB;
  border: 1px solid #FCD34D;
  border-left: 4px solid #D97706;
  color: #78350F;
}
.legal-box-important {
  background: #FFF1F2;
  border: 1px solid #FECDD3;
  border-left: 4px solid #E11D48;
  color: #881337;
}
.legal-box strong {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* Data table */
.legal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .85rem;
  margin: 16px 0;
}
.legal-table th {
  background: var(--primary);
  color: var(--white);
  padding: 12px 16px;
  text-align: left;
  font-size: .8rem;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
}
.legal-table th:first-child { border-radius: 8px 0 0 0; }
.legal-table th:last-child  { border-radius: 0 8px 0 0; }
.legal-table td {
  padding: 11px 16px;
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  vertical-align: top;
  line-height: 1.55;
}
.legal-table tr:nth-child(even) td { background: var(--accent-light); }
.legal-table-wrap {
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  margin: 16px 0;
}

/* Inline code / legal references */
.legal-ref {
  font-size: .78rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 6px;
  font-family: 'Courier New', monospace;
  color: var(--secondary);
}

/* Contact card */
.legal-contact-card {
  background: var(--primary);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  color: var(--white);
  margin-top: 24px;
}
.legal-contact-card h3 {
  color: var(--white);
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  margin-bottom: 14px;
}
.legal-contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .88rem;
  color: rgba(255,255,255,.75);
  padding: 7px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.legal-contact-item:last-child { border-bottom: none; }
.legal-contact-item strong { color: var(--white); min-width: 90px; display: inline-block; }

/* ─── Sitemap Page ─── */
.sitemap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 40px;
}
.sitemap-category {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.sitemap-cat-header {
  background: var(--primary);
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.sitemap-cat-icon {
  font-size: 1.2rem;
}
.sitemap-cat-title {
  color: var(--white);
  font-family: 'Inter', sans-serif;
  font-size: .9rem;
  font-weight: 700;
}
.sitemap-links {
  list-style: none;
  padding: 16px 20px;
}
.sitemap-links li {
  border-bottom: 1px solid var(--border);
}
.sitemap-links li:last-child { border-bottom: none; }
.sitemap-links a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  font-size: .87rem;
  color: var(--text);
  text-decoration: none;
  transition: color var(--transition);
}
.sitemap-links a:hover { color: var(--accent-dark); }
.sitemap-links a::after {
  content: '→';
  color: var(--accent);
  font-size: .8rem;
  opacity: 0;
  transition: opacity var(--transition);
}
.sitemap-links a:hover::after { opacity: 1; }
.sitemap-link-meta {
  font-size: .72rem;
  color: var(--text-muted);
  display: block;
  margin-top: 1px;
}
.sitemap-index-card {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  border-radius: var(--radius-lg);
  padding: 32px;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
  gap: 32px;
}
.sitemap-index-info h2 {
  color: var(--white);
  margin-bottom: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 1.15rem;
}
.sitemap-index-info p {
  color: rgba(255,255,255,.65);
  font-size: .85rem;
  margin: 0;
}
.sitemap-total {
  flex-shrink: 0;
  text-align: center;
}
.sitemap-total-num {
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--accent);
  font-family: 'Inter', sans-serif;
  line-height: 1;
}
.sitemap-total-label {
  font-size: .75rem;
  color: rgba(255,255,255,.55);
  margin-top: 4px;
}

/* ─── Print styles ─── */
@media print {
  .navbar, .footer, .legal-toc, .page-hero,
  .btn, .breadcrumb { display: none !important; }
  .legal-wrap { grid-template-columns: 1fr; }
  .legal-content { padding: 0; }
  .legal-section { page-break-inside: avoid; }
  body { font-size: 11pt; color: #000; }
  a { color: #000; text-decoration: underline; }
  .legal-box { border: 1px solid #ccc !important; }
}

/* ─── Responsive ─── */
@media (max-width: 900px) {
  .legal-wrap { grid-template-columns: 1fr; }
  .legal-toc { position: static; margin-bottom: 28px; }
  .sitemap-grid { grid-template-columns: 1fr 1fr; }
  .sitemap-index-card { flex-direction: column; text-align: center; gap: 16px; }
}
@media (max-width: 560px) {
  .sitemap-grid { grid-template-columns: 1fr; }
}