/* Below-the-fold copy — loaded LAST, only on sites that define seoText or faq.
   The point is indexable text: the pages carried ~110 characters of body copy,
   which is enough to rank for the exact handle and nothing else. It lives past
   the first screen so the hero (name, links, video) is visually untouched.
   The theme still supplies the display font; colors here are theme-neutral. */

/* The themes pin `html, body { height: 100% }`, which (combined with their
   `overflow-x: hidden`) turns the body into a fixed-height nested scroller — the
   section below would render in the right place but barely scroll. Letting both
   grow hands scrolling back to the document. */
html, body { height: auto; min-height: 100%; }
body { padding: 0; }
/* The floating glass card (avatar layout) keeps its breathing room by hand,
   since the body padding it relied on is gone. */
.card:not(.card--video) { margin: clamp(16px, 5vw, 40px); }

/* First screen is exactly one viewport tall, hero centered in it, © pinned to
   its bottom edge — so the section below starts at a clean boundary. Without
   this the fixed © would float over the copy for the whole scroll. */
.card--video {
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.card--video .foot {
  position: absolute;
  left: 0; right: 0;
  bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  margin: 0;
}

/* ---- The section itself ---- */
.more {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: clamp(34px, 9vw, 58px) clamp(20px, 6vw, 32px) clamp(44px, 11vw, 68px);
  /* Near-opaque: the clip is position:fixed, so without this the text would sit
     on moving video and be unreadable. */
  background: rgba(6, 6, 9, 0.94);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255, 255, 255, 0.09);
}
.more__inner {
  width: min(560px, 100%);
  margin: 0 auto;
  text-align: left;
}

.blurb {
  margin: 0 0 clamp(26px, 6vw, 34px);
  font-size: clamp(14px, 3.6vw, 15px);
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.8);
}

.more__h {
  margin: 0 0 clamp(16px, 4vw, 22px);
  font-family: var(--display, Georgia, serif);
  font-weight: 400;
  font-size: clamp(21px, 5.5vw, 27px);
  line-height: 1.15;
  color: #fff;
}

.faq__item + .faq__item { margin-top: clamp(18px, 4.5vw, 24px); }
.faq__q {
  margin: 0 0 6px;
  font-size: clamp(12.5px, 3.3vw, 13.5px);
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #fff;
}
.faq__a {
  margin: 0;
  font-size: clamp(13.5px, 3.5vw, 14.5px);
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.72);
}

/* The heart glyph is crimson-on-dark in the hero; down here it would fight the
   body copy, so let it inherit. */
.more .hrt { -webkit-text-fill-color: currentColor; color: inherit; text-shadow: none; }
