/* ============================================================
   8FLiX — Global Heading Scale
   Dark Theme Typography v2
   ============================================================ */

:root {
  --efx-font-head: "Times New Roman", Times, Georgia, serif;
  --efx-font-body: "Lato", "Open Sans", Arial, sans-serif;

  --efx-h1: clamp(2.15rem, 3.2vw + 1rem, 4.25rem);
  --efx-h2: clamp(1.75rem, 2.25vw + .85rem, 3rem);
  --efx-h3: clamp(1.35rem, 1.35vw + .75rem, 2.05rem);
  --efx-h4: clamp(1.15rem, .85vw + .75rem, 1.55rem);
  --efx-h5: clamp(1.02rem, .55vw + .75rem, 1.25rem);
  --efx-h6: clamp(.92rem, .35vw + .72rem, 1.08rem);

  --efx-body: clamp(1rem, .22vw + .95rem, 1.125rem);
  --efx-body-small: clamp(.94rem, .16vw + .9rem, 1rem);
  --efx-body-large: clamp(1.08rem, .35vw + 1rem, 1.25rem);

  --efx-body-line: 1.7;
}

/* Body copy */
body,
p,
.entry-content p,
.fl-builder-content p,
.efx-p {
  font-family: var(--efx-font-body);
  font-size: var(--efx-body) !important;
  line-height: var(--efx-body-line);
  color: var(--efx-text-soft);
}

body.archive .ast-archive-description p {
  font-family: var(--efx-font-body);
  font-size: var(--efx-body) !important;
  line-height: var(--efx-body-line);
  color: var(--efx-text-soft);
}

/* Lists */
.entry-content li,
.fl-builder-content li {
  font-size: var(--efx-body) !important;
  line-height: 1.65;
  color: var(--efx-text-soft);
}

/* Headings */
h1,
.efx-h1 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h1) !important;
  line-height: .98;
  letter-spacing: -.025em;
  color: var(--efx-text);
}

h2,
.efx-h2 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h2) !important;
  line-height: 1.08;
  letter-spacing: -.028em;
  color: var(--efx-text);
}

h3,
.efx-h3 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h3) !important;
  line-height: 1.16;
  letter-spacing: -.018em;
  color: var(--efx-text);
}

h4,
.efx-h4 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h4) !important;
  line-height: 1.22;
  letter-spacing: -.01em;
  color: var(--efx-text-soft);
}

h5,
.efx-h5 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h5) !important;
  line-height: 1.28;
  letter-spacing: .01em;
  color: var(--efx-text-soft);
}

h6,
.efx-h6 {
  font-family: var(--efx-font-head);
  font-size: var(--efx-h6) !important;
  line-height: 1.3;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--efx-text-muted);
}

/* Beaver Heading module text should inherit the global heading scale */
.fl-builder-content .fl-module-heading .fl-heading-text {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  color: inherit !important;
}


/* ============================================================
   8FLiX — Heading Rhythm
   Applies to normal content and rich-text content only.
   Beaver Heading modules should manage spacing separately.
   ============================================================ */

.entry-content > h1,
.fl-rich-text h1 {
  margin-top: 0;
  margin-bottom: .65em !important;
}

.entry-content > h2,
.fl-rich-text h2,
.archive .ast-archive-description h2 {
  margin-top: 1.75em !important;
  margin-bottom: .55em !important;
}

.entry-content > h3,
.fl-rich-text h3,
.archive .ast-archive-description h3 {
  margin-top: 1.35em !important;
  margin-bottom: .45em !important;
}

.entry-content > h4,
.entry-content > h5,
.entry-content > h6,
.fl-rich-text h4,
.fl-rich-text h5,
.fl-rich-text h6,
.archive .ast-archive-description h4,
.archive .ast-archive-description h5,
.archive .ast-archive-description h6 {
  margin-top: 1.1em !important;
  margin-bottom: .35em !important;
}

/* No global heading padding. Components can add decorative spacing where needed. */
h1,
h2,
h3,
h4,
h5,
h6 {
  padding-bottom: 0 !important;
}

small,
.efx-small,
.efx-meta,
.efx-note,
.efx-muted {
  font-size: var(--efx-body-small);
  line-height: 1.55;
  color: var(--efx-text-muted);
}

.efx-lede,
.efx-intro p,
.efx-edu-intro p {
  font-size: var(--efx-body-large) !important;
  line-height: 1.65;
  color: var(--efx-text-soft);
}

/* ============================================================
   8FLiX — Typography Mobile Refinements
   Clamp handles sizing; this trims spacing on smaller screens.
   ============================================================ */

@media (max-width: 767px) {
  .entry-content > h1,
  .fl-rich-text h1 {
    margin-bottom: .55em !important;
  }

  .entry-content > h2,
  .fl-rich-text h2 {
    margin-top: 1.35em !important;
    margin-bottom: .45em !important;
  }

  .entry-content > h3,
  .fl-rich-text h3 {
    margin-top: 1.1em !important;
    margin-bottom: .4em !important;
  }

  .entry-content > h4,
  .entry-content > h5,
  .entry-content > h6,
  .fl-rich-text h4,
  .fl-rich-text h5,
  .fl-rich-text h6 {
    margin-top: .9em !important;
    margin-bottom: .3em !important;
  }

  p,
  .entry-content p,
  .fl-rich-text p,
  .entry-content li,
  .fl-rich-text li {
    line-height: 1.65;
  }
}

/* ===========================
   EFX Divider / Separator
   =========================== */

.efx-divider,
.fl-separator {
  --sep-thickness: 1px !important;
  --sep-gap-y: 1.25rem !important;
  --sep-radius: 999px !important;

  border: 0 !important;
  height: var(--sep-thickness) !important;
  margin-top: var(--sep-gap-y) !important;
  margin-bottom: var(--sep-gap-y) !important;
  border-radius: var(--sep-radius) !important;

  background: linear-gradient(
    90deg,
    rgba(211,35,154,.65),
    rgba(255,106,0,.65),
    transparent
  ) !important;
}

/* Responsive tweaks */
@media (max-width: 767px) {
  .efx-divider,
  .fl-separator {
    --sep-gap-y: 1rem !important;
  }
}

@media (max-width: 600px) {
  .efx-divider,
  .fl-separator {
    --sep-gap-y: 0.85rem !important;
  }
}

@media (max-width: 344px) {
  .efx-divider,
  .fl-separator {
    --sep-gap-y: 0.75rem !important;
  }
}

/* ===============================
   Lower Footer | Content
   =============================== */
.ast-footer-copyright {
  font-size: var(--efx-body-small);
  color: var(--efx-text-muted);
}

.ef-footer-copyright p {
	font-size: var(--efx-body-small);
	  line-height: 1.5em !important;
}

.site-footer .widget-title,
.site-footer h3.widget-title,
.ast-footer-overlay .widget-title,
.ast-builder-footer-grid-columns .widget-title,
.footer-widget-area .widget-title,
.footer-widget-area h3.widget-title {
  font-family: var(--efx-font-head) !important;
  font-size: clamp(1.35rem, 1.35vw + .75rem, 2.05rem) !important;
  line-height: 1.15 !important;
  letter-spacing: -.015em !important;
  color: var(--efx-text) !important;
}

/* ============================================================
   8FLiX — Browse Archive H1 Typography
   Category base is /browse/, so all category archives inherit this.
   Covers parent and nested genre/era archive pages.
   ============================================================ */

body.archive.category .ast-archive-description .ast-archive-title,
body.archive.category .ast-archive-description .ast-archive-title * {
  font-family: var(--efx-font-head) !important;
  font-size: var(--efx-h1) !important;
  line-height: .98 !important;
  letter-spacing: -.025em !important;
  font-weight: 400 !important;
  color: var(--efx-text) !important;
}

body.archive.category .ast-archive-description .ast-archive-title::before {
  content: "";
  display: block;
  width: clamp(54px, 8vw, 120px);
  height: 4px;
  margin: 0 0 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, #D3239A, #FF6A00);
  box-shadow: 0 0 18px rgba(211, 35, 154, .35);
}