/* ==========================================================================
   AUM Statement

   A copy-led section with no call to action. Bootstrap owns the container
   width; every visual value reads a custom property with its default in the
   var() fallback, so nothing is declared on the element itself and the
   block's own controls can always override.
   ========================================================================== */

.aum-st {
  width: 100%;
  font-family: var(--aum-font, Lato, sans-serif);
  background: var(--aum-st-bg, transparent);
  padding-block: var(--aum-st-pad-y, 104px);
  text-align: center;
}

.aum-st.is-align-left  { text-align: left; }
.aum-st.is-align-right { text-align: right; }

.aum-st__nocontainer {
  width: 100%;
  padding-inline: var(--aum-container-padding, 24px);
}

.aum-st.is-background-contained {
  max-width: var(--aum-container, 1140px);
  margin-inline: auto;
}

.aum-st__inner {
  max-width: var(--aum-st-max, 900px);
  margin-inline: auto;
}

.aum-st.is-align-left  .aum-st__inner { margin-inline: 0 auto; }
.aum-st.is-align-right .aum-st__inner { margin-inline: auto 0; }

/* Hairline frame top and bottom, drawn on the inner so it follows the text
   column rather than the full container width. */
.aum-st.is-framed .aum-st__inner {
  border-top: 1px solid var(--aum-st-frame-color, var(--aum-border, #e8e8e8));
  border-bottom: 1px solid var(--aum-st-frame-color, var(--aum-border, #e8e8e8));
  padding-block: var(--aum-st-frame-pad, 56px);
}

/* --- Eyebrow -------------------------------------------------------------- */

.aum-st__eyebrow {
  font-size: var(--aum-st-eyebrow, 12px);
  font-style: normal;
  letter-spacing: var(--aum-st-eyebrow-track, .24em);
  text-transform: uppercase;
  color: var(--aum-st-eyebrow-color, var(--aum-accent-deep, #7b6a58));
  margin: 0 0 22px;
}

/* --- Lead ----------------------------------------------------------------
   Set as a statement rather than a heading: italic, light, and only a little
   larger than the body. Fluid between the mobile and desktop sizes so it does
   not need a media query.
   -------------------------------------------------------------------------- */

.aum-st__lead {
  font-size: clamp(var(--aum-st-lead-m, 22px), 3.4vw, var(--aum-st-lead, 34px));
  font-weight: var(--aum-st-lead-weight, 300);
  font-style: italic;
  letter-spacing: var(--aum-st-lead-track, .01em);
  line-height: var(--aum-st-lead-leading, 1.35);
  color: var(--aum-st-lead-color, var(--aum-gray, #9b9b9b));
  margin: 0 0 var(--aum-st-gap, 30px);
}

.aum-st.lead-upright .aum-st__lead { font-style: normal; }

/* Inside an italic run, em reads as the exception -- so it goes upright. */
.aum-st__lead em { font-style: normal; }

.aum-st__lead strong {
  font-weight: 400;
  color: var(--aum-st-emphasis, var(--aum-accent-deep, #7b6a58));
}

blockquote.aum-st__lead {
  border: 0;
  padding: 0;
  quotes: none;
}

/* --- Quote mark ----------------------------------------------------------- */

.aum-st.has-quote-mark .aum-st__lead::before {
  content: "\201C";
  display: block;
  font-size: var(--aum-fs-h1);
  font-style: normal;
  line-height: .6;
  color: var(--aum-st-rule-color, var(--aum-accent, #d7c6b2));
  margin-bottom: 18px;
}

/* --- Body ----------------------------------------------------------------- */

.aum-st__body {
  font-size: var(--aum-st-body, 17px);
  font-style: italic;
  font-weight: 300;
  line-height: var(--aum-st-body-leading, 1.85);
  color: var(--aum-st-body-color, var(--aum-gray, #9b9b9b));
  margin: 0 0 var(--aum-st-body-gap, 18px);
}

.aum-st.body-upright .aum-st__body {
  font-style: normal;
  color: var(--aum-st-body-color, var(--aum-text, #2b2b2b));
}

.aum-st__body:last-child { margin-bottom: 0; }

.aum-st__body strong {
  font-weight: 700;
  color: var(--aum-st-emphasis, var(--aum-accent-deep, #7b6a58));
}

.aum-st__body em { font-style: normal; }
.aum-st.body-upright .aum-st__body em { font-style: italic; }

/* --- Two columns ----------------------------------------------------------
   Long copy in one centred column becomes a wall. Two columns keep the
   measure short while the lead stays full width above them. Columns are
   left-aligned even when the section is centred -- justified-centre body copy
   is hard to read at length.
   -------------------------------------------------------------------------- */

.aum-st__cols { text-align: left; }

.aum-st.is-layout-columns .aum-st__cols .aum-st__body {
  font-style: normal;
  color: var(--aum-st-body-color, var(--aum-text, #2b2b2b));
}

/* --- Attribution ---------------------------------------------------------- */

.aum-st__attrib {
  font-size: var(--aum-st-attrib, 12px);
  font-style: normal;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--aum-st-attrib-color, var(--aum-gray, #9b9b9b));
  margin: 26px 0 0;
}

/* --- Rule ----------------------------------------------------------------- */

.aum-st__rule {
  border: 0;
  border-top: 2px solid var(--aum-st-rule-color, var(--aum-accent, #d7c6b2));
  width: 44px;
  margin: 0 auto var(--aum-st-gap, 30px);
  opacity: 1;
}

.aum-st__rule--after { margin: var(--aum-st-gap, 30px) auto 0; }

.aum-st.is-align-left  .aum-st__rule { margin-inline: 0 auto; }
.aum-st.is-align-right .aum-st__rule { margin-inline: auto 0; }

/* --- Extra blocks --------------------------------------------------------- */

.aum-st__extra { margin-top: var(--aum-st-gap, 30px); }
.aum-st__extra > *:last-child { margin-bottom: 0; }

/* --- Mobile --------------------------------------------------------------- */

@media (max-width: 575.98px) {
  .aum-st { padding-block: var(--aum-st-pad-y-m, 68px); }
  .aum-st.is-framed .aum-st__inner { padding-block: calc(var(--aum-st-frame-pad, 56px) * .7); }
  .aum-st.has-quote-mark .aum-st__lead::before { font-size: var(--aum-fs-h1); }
}
