/* ============================================================
   legal.css — Shared layout for privacy.html & terms.html
   ============================================================ */

/* Page wrapper so footer sticks to bottom on short content */
.legal-page-wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* Main content area */
.legal-main {
  flex: 1;
  max-width: 760px;
  margin: 0 auto;
  padding: 108px 28px 72px; /* top clears desktop nav */
  width: 100%;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .legal-main {
    padding: 72px 20px 56px;
  }
}

/* Content card */
.legal-card {
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 20px;
  padding: 48px 52px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.07), 0 2px 8px rgba(0, 0, 0, 0.04);
}

html.dark-mode .legal-card {
  background: rgba(36, 36, 36, 0.65);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@media (max-width: 600px) {
  .legal-card {
    padding: 32px 24px;
  }
}

/* Footer must still sit at the bottom */
.legal-page-wrapper footer {
  margin-top: 0;
}
