/* ============================================================
   Pyrority — Manifesto page
   Scoped under body.pyrority-page--manifesto so its overrides
   (amber-period color, slimmer reveal transform) don't bleed
   into other pages.
   ============================================================ */

/* On the manifesto, the amber period reads in white-hot rather than amber. */
body.pyrority-page--manifesto .amber-period { color: var(--white-hot); }

/* ============================================================
   Page shell
   ============================================================ */
body.pyrority-page--manifesto main.manifesto {
  max-width: 1700px;
  margin: 0 auto;
  padding: 80px 40px 0;
}

.reading-column {
  max-width: 720px;
  margin: 0 auto;
}

/* ============================================================
   Top declaration — static on load (no animation)
   ============================================================ */
.declaration {
  padding: 80px 0 120px;
}

.declaration-text {
  font-family: 'Syne', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 5.4vw, 80px);
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--text);
}

.declaration-text .line {
  display: block;
  margin-bottom: 8px;
}

.declaration-text .line:last-child { margin-bottom: 0; }

/* ============================================================
   Stanza
   ============================================================ */
.stanza {
  padding: 72px 0;
  border-top: 1px solid var(--border-soft);
}

.stanza-eyebrow {
  display: block;
  font-family: 'Outfit', sans-serif;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-dim);
  margin-bottom: 24px;
}

.stanza-heading {
  font-family: 'Syne', sans-serif;
  font-weight: 700;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--text);
  margin-bottom: 40px;
}

/* Manifesto-specific reveal — slightly smaller rise than base. */
.stanza-heading.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 700ms cubic-bezier(0.2, 0.8, 0.2, 1),
              transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.stanza-heading.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

.stanza-body p {
  font-family: 'Outfit', sans-serif;
  font-weight: 300;
  font-size: 21px;
  line-height: 1.65;
  letter-spacing: 0.001em;
  color: var(--text-muted);
  margin-bottom: 28px;
}

.stanza-body p:last-child { margin-bottom: 0; }

.stanza-body p strong {
  color: var(--text);
  font-weight: 500;
}

/* ============================================================
   The closer
   ============================================================ */
.closer {
  padding: 160px 0;
  border-top: 1px solid var(--border-soft);
}

.closer-text {
  font-family: 'Syne', sans-serif;
  font-weight: 700;
  font-size: clamp(56px, 7vw, 104px);
  line-height: 1.02;
  letter-spacing: -0.035em;
  color: var(--text);
  max-width: 920px;
}

.closer-text .line { display: block; }

.closer-text .accent { color: var(--white-hot); }

/* ============================================================
   The call
   ============================================================ */
.call {
  padding: 80px 0 120px;
  border-top: 1px solid var(--border-soft);
}

.call-text {
  font-family: 'Outfit', sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 1.4;
  color: var(--text-muted);
  margin-bottom: 28px;
  max-width: 620px;
}

.call-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--amber);
  font-family: 'Outfit', sans-serif;
  font-weight: 500;
  font-size: 18px;
  text-decoration: none;
  border-bottom: 1px solid var(--amber-deep);
  padding-bottom: 4px;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.call-link:hover {
  color: #ffb544;
  border-color: var(--amber);
}

.call-link svg {
  width: 14px;
  height: 14px;
  transition: transform 0.2s ease;
}

.call-link:hover svg { transform: translateX(3px); }

/* ============================================================
   Reduced motion — kill stanza heading reveal
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .stanza-heading.reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ============================================================
   Tablet
   ============================================================ */
@media (max-width: 1100px) {
  body.pyrority-page--manifesto main.manifesto { padding: 60px 32px 0; }
  .declaration { padding: 56px 0 96px; }
}

/* ============================================================
   Mobile
   ============================================================ */
@media (max-width: 768px) {
  body.pyrority-page--manifesto main.manifesto { padding: 40px 20px 0; }
  .declaration { padding: 32px 0 72px; }

  .stanza { padding: 56px 0; }
  .stanza-body p { font-size: 18px; line-height: 1.6; }

  .closer { padding: 96px 0; }
  .call { padding: 56px 0 80px; }
  .call-text { font-size: 18px; }
}
