/**
 * HealthN.E.S.S. — Stitch reference visual refinement
 * Loads AFTER final-qa.css. Scoped overrides only — no structural rewrites,
 * no new fonts (Montserrat/Manrope brand type is preserved), no invented copy.
 *
 * Sections:
 *   1. FAQ page        (.faq-page)
 *   2. Insights page    (.insights-page)
 *   3. Homepage contact (#contact — "The Final Step")
 *   4. Contact page     (.contact-page)
 *   5. About — minor consistency
 *   6. Shared atmosphere helpers
 */

/* ==========================================================================
 * 6. Shared atmosphere helpers (used by sections 1, 3, 4)
 * ========================================================================== */
.stitch-atmosphere {
  position: relative;
  overflow: hidden;
  background: var(--color-surface-container-low);
}

.stitch-atmosphere img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.65) brightness(0.4) contrast(1.12);
}

.stitch-atmosphere__scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.stitch-atmosphere__caption {
  position: absolute;
  left: 50%;
  bottom: clamp(1.15rem, 3vw, 1.75rem);
  transform: translateX(-50%);
  margin: 0;
  max-width: 90%;
  text-align: center;
  font-family: var(--font-label);
  font-size: 0.6875rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(242, 202, 80, 0.82);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ==========================================================================
 * 1. FAQ page — layout owned by faq.css after structural repair.
 *    Keep only light polish that does not collapse the reading rail.
 * ========================================================================== */

.faq-page .faq-hero,
.faq-page .faq-layout,
.faq-page .faq-cta {
  max-width: var(--width-container-max);
  margin-left: auto;
  margin-right: auto;
}

.faq-page .faq-section .faq-list,
.faq-page .faq-list {
  max-width: none;
}

/* Legacy atmosphere class — unused on repaired FAQ; keep harmless */
.faq-atmosphere {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.faq-page .faq-section__title {
  font-family: var(--font-heading);
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 600;
  letter-spacing: -0.015em;
  text-transform: none;
  color: var(--color-on-background);
}

/* ==========================================================================
 * 2. Insights page — layout owned by insights.css after Coming Soon repair.
 *    Keep light CTA polish only; do not reintroduce topic pills / frames.
 * ========================================================================== */

.insights-page .insight-open,
.insights-page .insight-mission,
.insights-page .insight-index,
.insights-page .insight-promise,
.insights-page .insight-cta {
  max-width: var(--width-container-max);
  margin-left: auto;
  margin-right: auto;
}

.insights-page .insight-cta__panel {
  position: relative;
  overflow: hidden;
}

.insights-page .insight-cta__panel::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: 22rem;
  height: 22rem;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(242, 202, 80, 0.14), transparent 70%);
  filter: blur(20px);
  pointer-events: none;
}

.insights-page .insight-cta__panel > * {
  position: relative;
  z-index: 1;
}

/* ==========================================================================
 * 3–4. Homepage + Contact page compositions owned by contact.css
 * ========================================================================== */
#contact.chapter { isolation: isolate; }
.contact-emphasis { font-style: italic; font-weight: 700; color: var(--color-primary); }

/* ==========================================================================
 * 5. About — minor consistency (spacing / hairline / media treatment only)
 * ========================================================================== */
.about-page .about-story__media,
.about-page .about-story__placeholder {
  border-radius: 0;
}

.about-page .about-section + .about-section {
  border-top: 1px solid rgba(153, 144, 124, 0.12);
  padding-top: clamp(2.25rem, 5vw, 3.25rem);
}