/* ========================================
   BOWL OF SAKI (module-bowl-of-saki.twig)
   Registered by the module template — loaded only where the module is used.
   The prev / dropdown / next bar is the design-system .step-nav component;
   the quote uses .quote-ruhaniat and the rule .divider-sand.
   ======================================== */

.saki {
  text-align: center;
}

.saki-title {
  margin: 0 0 var(--space-8);
}

.saki-label {
  font-size: var(--text-body-large);
  color: var(--color-dark);
  padding-top: var(--space-8);     /* breathing room below the title (padding: margins would collapse) */
  margin: 0 0 1rem;
}

.saki-quote {
  margin: 2.5rem auto 0;
  max-width: 900px;
}

/* .quote-ruhaniat overrides: the mock shows the quote in italic */
.saki-quote-text {
  font-style: italic;
  margin: 0 0 0.75rem;
}

/* blockquote inherits the display serif; the attribution is in the body face */
.saki-attribution {
  font-family: var(--font-primary);
  font-style: italic;
  font-size: var(--text-body-small);
  color: var(--color-light-text);
}

.saki-divider {
  margin: 2.5rem 0;
}

.saki-commentary-heading {
  font-size: var(--text-body-default);
  color: var(--color-light-text);
  margin: 0 0 1rem;
}

/* Long commentaries read better left-aligned; the mock's single centred line is the short case */
.saki-commentary {
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
}

.saki-empty {
  color: var(--color-light-text);
  margin: 2.5rem 0 0;
}

.saki-copyright,
.saki-copyright p {
  font-size: var(--text-body-small);
  color: var(--color-light-text);
  margin-bottom: 0;
  padding-top: var(--space-16);    /* breathing room below the commentary (padding: margins would collapse) */
  margin: 0;
}