/* ==========================================================================
   security.css — /security page-specific styles
   Colors/type/spacing come from tokens.css via base.css. Mobile-first.
   ========================================================================== */

/* Breadcrumb trail above the page title. */
.breadcrumb {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  color: var(--color-muted);
  margin-bottom: 20px;
}
.breadcrumb a { font-size: 0.8rem; }
.breadcrumb span[aria-current] { color: var(--color-muted); }

/* Intro: copy on the left, large stamp anchor on the right. */
.security-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
}
.security-hero h1 { margin: 12px 0 0; }
.security-stamp {
  display: flex;
  justify-content: center;
}
@media (min-width: 900px) {
  .security-hero-grid { grid-template-columns: 1.2fr 0.8fr; gap: 48px; }
}

/* Detail sections: constrained measure for comfortable long-form reading. */
.security-detail h2 { margin: 8px 0 16px; max-width: 24ch; }
.security-detail p {
  max-width: 70ch;
  margin: 0 0 16px;
  font-size: 1.05rem;
}
.security-detail p:last-child { margin-bottom: 0; }

/* Inline mono term for cryptographic names (e.g. SHA-256). */
.mono-term {
  font-family: var(--font-mono);
  font-size: 0.92em;
  color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 8%, transparent);
  padding: 0.1em 0.4em;
  border-radius: 6px;
}

/* DPDP legal policy links. */
.legal-links {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  max-width: 70ch;
}
.legal-links a { font-weight: 600; }
@media (min-width: 640px) {
  .legal-links { grid-template-columns: 1fr 1fr; }
}