/* ==========================================================================
   PlugStack — legal / policy pages
   Loaded only on pages using the "Legal Page" template. Tokens come from
   plugstack.css.

   Same rules as the rest of the theme: no !important, overrides match Astra's
   specificity, fluid clamp() sizing, no per-breakpoint rules where a fluid
   value will do.
   ========================================================================== */

/* --------------------------------------------------------------- layout */

/* Escape Astra's 1240px container, as the catalogue templates do. */
.plugstack-legal-page .site-content > .ast-container {
  max-width: 100%;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}

body.plugstack-legal-page {
  background: var(--ps-white);
}

.plugstack-legal-page .site-content {
  margin-top: 0;
  padding-top: 0;
}

.plugstack-legal-page #primary.site-main {
  margin-top: 0;
  margin-bottom: 0;
}

.plugstack-legal {
  padding: clamp(32px, 4vw, 56px) 0 clamp(56px, 7vw, 88px);
}

/* Reading column: the single-plugin page uses the same 780px measure. */
.plugstack-legal__inner {
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
  min-width: 0;
  font-family: var(--ps-font-body);
  font-size: 16px;
  line-height: 1.7;
  color: #333;
  overflow-wrap: anywhere;         /* long emails and URLs wrap instead of overflowing */
}

/* ----------------------------------------------------------- typography */

.plugstack-legal__inner h2,
.plugstack-legal__inner h3 {
  font-family: var(--ps-font-display);
  color: var(--ps-ink);
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.plugstack-legal__inner h2 {
  font-size: clamp(21px, 2.4vw, 26px);
  font-weight: 700;
  margin: 2.2em 0 0.5em;
}

.plugstack-legal__inner h3 {
  font-size: 18px;
  font-weight: 600;
  margin: 1.8em 0 0.4em;
}

.plugstack-legal__inner > :first-child {
  margin-top: 0;
}

.plugstack-legal__inner p {
  margin: 0 0 16px;
}

.plugstack-legal__inner ul,
.plugstack-legal__inner ol {
  margin: 0 0 16px 1.25em;
  padding: 0;
}

.plugstack-legal__inner li {
  margin: 0 0 6px;
}

.plugstack-legal__inner a {
  color: var(--ps-red);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.plugstack-legal__inner a:hover,
.plugstack-legal__inner a:focus-visible {
  color: var(--ps-red-dark);
}

.plugstack-legal__inner a:focus-visible {
  outline: 2px solid var(--ps-red);
  outline-offset: 2px;
}

/* ---------------------------------------------------------- page pieces */

/* "Last updated" line: quiet, above the first heading. */
.plugstack-legal__inner .plugstack-legal__updated {
  font-size: 14px;
  color: var(--ps-muted);
}

/* The one thing a visitor came for, set apart from the prose. A bordered
   card, like every other container on the site. */
.plugstack-legal__inner .plugstack-legal__callout {
  margin: 0 0 8px;
  padding: clamp(18px, 2.4vw, 24px);
  border: 1px solid var(--ps-slate);
  border-top: 3px solid var(--ps-red);
  border-radius: var(--ps-radius-lg);
  background: var(--ps-soft);
}

.plugstack-legal__inner .plugstack-legal__callout > :last-child {
  margin-bottom: 0;
}

.plugstack-legal__inner .plugstack-legal__callout h2 {
  margin-top: 0;
  font-size: 18px;
}
