/* =====================================================================
   Editor utility classes — for content authored in the rich-text editor.

   This file deliberately does NOT re-declare h1-h6, p, a, ul, img, sup,
   blockquote, hr or the .text-*/.bg-*/font-name classes. Those are the
   style-guide base in skysona-styles.css and are already correct; a second
   copy here (it loads last) previously overrode the base with Zynteglo
   values. Base is authoritative — this file carries deltas only.

   Values transcribed from www.skysona.com app.min.css.
   ===================================================================== */

/* --- Superscript alignment helper (live .sup-text) --------------------- */

.sup-text {
  position: relative;
}

.sup-text sup {
  position: absolute;
  left: -4px;
  top: 6px;
}

.sup-text .symbol {
  position: absolute;
  left: -6px;
}

/* --- Editor font-size helpers ----------------------------------------- */

.font-large {
  color: var(--sky-black);
  font-size: 18px;
  font-weight: 400;
  line-height: 32px;
}

@media (max-width: 767px) {
  .font-large {
    font-size: 18px;
    line-height: 26px;
  }
}

.font-small {
  color: var(--sky-black);
  font-size: 14px;
  font-weight: 400;
}

.font-xsmall {
  color: var(--sky-black);
  font-size: 12px;
  font-weight: 400;
}

/* --- Bullet variants used in authored copy ---------------------------- */

:where(#content) ul.bullet {
  list-style: none;
  padding-left: 15px;
}

:where(#content) ul.bullet li::before,
:where(#content) .content-tile .content-tile-text ul li::before {
  content: "\2022";
  color: var(--sky-tertiary);
  display: inline-block;
  width: 1em;
  margin-left: -1em;
}

:where(#content) ul.dashed li::before {
  content: "\2012";
  color: var(--sky-tertiary);
  display: inline-block;
  width: 1em;
  margin-left: -1em;
}

:where(#content) ul.bullet-blue li::before {
  content: "\2022";
  color: var(--sky-septenary);
  display: inline-block;
  width: 1em;
  margin-left: -1em;
}

/* --- Layout helpers ---------------------------------------------------- */

.text-center-mobile {
  text-align: left;
}

@media (max-width: 767px) {
  .text-center-mobile {
    text-align: center;
  }
}

.text-nowrap {
  white-space: nowrap;
}

.section-spacing {
  padding: 30px 0;
}

.section-spacing-lg {
  padding: 60px 0;
}

/* --- Accessibility ----------------------------------------------------- */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}