/**
 * Static-page — editorial register
 * Wave 5B ( SPEC §2)
 * Closes FINAL-DS §G.5 #20
 *
 * Activates only when body[data-page-context="editorial"]:
 *   - editorial-policy
 *   - advertising-policy
 *   - about
 *   - press
 *   - login / registration (already editorial pre-Wave 5B)
 *
 * Design language: long-form authority surface. Display-serif title,
 * hairline rulings between sections, 66ch prose body, italic = gold accent.
 *
 * Token discipline: zero hex/px/rgba literals. Wave 0 tokens only.
 */

body[data-page-context="editorial"].static-page-body {
  background: var(--color-bg-editorial);
}

body[data-page-context="editorial"] .static-page {
  padding: var(--space-16) var(--gutter) var(--space-20);
}

/* Section-mast wrapper above the H1 (slotted in template) */
body[data-page-context="editorial"] .static-page .section-mast {
  margin-bottom: var(--space-10);
}

/* H1 — display serif, left-aligned. Legal/static documents are dense reference
   text, not magazine features, so the title is sized as a calm document heading
   (text-4xl) rather than the screaming editorial hero (was text-6xl/7xl).
   Founder 2026-06-17: "убери эти кричащие h1 с документов". */
body[data-page-context="editorial"] .static-page__title {
  font-family: var(--font-display);
  font-size: var(--text-4xl);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-display);
  color: var(--color-text);
  text-align: left;
  text-wrap: balance;
  margin: 0;
}

@media (min-width: 1024px) {
  body[data-page-context="editorial"] .static-page__title {
    font-size: var(--text-5xl);
  }
}

/* Italic accent inside H1 (lexicon split optional) — gold */
body[data-page-context="editorial"] .static-page__title em,
body[data-page-context="editorial"] .static-page__title i {
  color: var(--color-editorial-mark);
  font-style: italic;
}

/* Body prose register — 66ch, prose line-height, body color */
body[data-page-context="editorial"] .static-page__content {
  font-family: var(--font-ui);
  font-size: var(--text-base);
  line-height: var(--line-height-prose);
  max-width: 66ch;
  color: var(--color-text);
}

/* Italic = gold editorial accent inside body prose */
body[data-page-context="editorial"] .static-page__content em,
body[data-page-context="editorial"] .static-page__content i {
  color: var(--color-editorial-mark);
  font-style: italic;
}

/* Section dividers — single hairline ruling, no radius */
body[data-page-context="editorial"] .static-page__content hr {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: var(--space-12) 0;
}

/* H2/H3 inside prose body — display serif, less bombastic than H1 */
body[data-page-context="editorial"] .static-page__content h2 {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-display);
  color: var(--color-text);
  margin: var(--space-12) 0 var(--space-4);
}

body[data-page-context="editorial"] .static-page__content h3 {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: var(--font-weight-regular);
  color: var(--color-text);
  margin: var(--space-8) 0 var(--space-3);
}

/* Pull-quote — optional in body content (.pull-quote class on blockquote) */
body[data-page-context="editorial"] .static-page__content blockquote.pull-quote {
  border-left: 4px solid var(--color-editorial-mark);
  padding-left: var(--space-6);
  margin: var(--space-10) 0;
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-style: italic;
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-display);
  color: var(--color-text);
}

body[data-page-context="editorial"] .static-page__content blockquote.pull-quote cite {
  display: block;
  margin-top: var(--space-3);
  font-family: var(--font-ui);
  font-size: var(--text-sm);
  font-style: normal;
  color: var(--color-text-secondary);
  letter-spacing: var(--letter-spacing-caps);
  text-transform: uppercase;
}

/* Italic figcaption — editorial caption convention */
body[data-page-context="editorial"] .static-page__content figcaption {
  font-family: var(--font-ui);
  font-size: var(--text-sm);
  font-style: italic;
  color: var(--color-text-secondary);
  margin-top: var(--space-2);
}

/* FAQ details — strip catalog chrome (radius, raw rgba) — hairline-only */
body[data-page-context="editorial"] .static-page__content details {
  border: none;
  border-bottom: 1px solid var(--color-border);
  border-radius: 0;
  margin-bottom: 0;
  overflow: visible;
}

body[data-page-context="editorial"] .static-page__content details[open] {
  border-color: var(--color-border);
}

body[data-page-context="editorial"] .static-page__content summary {
  background: var(--color-bg-elevated);
  font-family: var(--font-ui);
  font-weight: var(--font-weight-semibold);
}

body[data-page-context="editorial"] .static-page__content summary:hover {
  background: var(--color-bg-elevated);
}

/* Mobile responsive — keep editorial scale but trim padding */
@media (max-width: 640px) {
  body[data-page-context="editorial"] .static-page {
    padding: var(--space-12) var(--gutter) var(--space-16);
  }
}
