/**
 * Lineage Gift Shop — Frontend Design System
 *
 * All rules are scoped under .lineage-gs to prevent conflicts with the active
 * theme (Requirement 3.2, 18.6).
 *
 * @package Lineage\GiftShop
 * @version 2.0.0
 */

/* ==========================================================================
   1. CSS Custom Properties (Design Tokens)
   ========================================================================== */

.lineage-gs {
  /* Lineage V3 Spiritual Ecosystem Colour Palette */
  --lineage-bg:           #07070A;
  --lineage-surface:      #111118;
  --lineage-glass:        rgba(255, 255, 255, 0.08);

  /* Primary Purple */
  --lineage-accent:       #6D4AFF;
  --lineage-secondary:    #8B5CF6;
  --lineage-accent-faint: rgba(109, 74, 255, 0.15);

  /* Gold Accent */
  --lineage-warm:         #D4AF37;
  --lineage-warm-faint:   rgba(212, 175, 55, 0.15);

  /* Typography */
  --lineage-ink:          #FFFFFF;
  --lineage-ink-light:    rgba(255, 255, 255, 0.70);
  --lineage-ink-faint:    rgba(255, 255, 255, 0.30);

  /* Shape */
  --lineage-radius-card:  16px;
  --lineage-radius-pill:  500px;

  /* Spacing */
  --lineage-gap:          24px;
  --lineage-gap-lg:       48px;

  /* Motion */
  --lineage-ease:         cubic-bezier(0.25, 1, 0.5, 1);
  --lineage-ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Typography */
  --lineage-font-display: inherit;
  --lineage-font-body:    inherit;

  /* Transitions */
  --lineage-transition:   0.3s ease;
  --lineage-flip-dur:     0.8s;
}

/* Global V3 Effects */
.lineage-gs.lggs-v3-root {
  background-color: var(--lineage-bg);
  color: var(--lineage-ink);
}
.lineage-gs .lggs-glass {
  background: var(--lineage-glass);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.05);
}
.lineage-gs .lggs-glow {
  box-shadow: 0 0 40px rgba(109, 74, 255, 0.2);
}
.lineage-gs .lggs-skeleton {
  background: linear-gradient(90deg, var(--lineage-surface) 25%, var(--lineage-glass) 50%, var(--lineage-surface) 75%);
  background-size: 200% 100%;
  animation: lggs-skeleton-loading 1.5s infinite;
}
@keyframes lggs-skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Dedicated quizzes page cards use the same compact reference card system. */
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  overflow-x: hidden;
  padding: 40px 0;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
  flex: 0 0 185px;
  width: 185px;
  height: 282px;
  min-width: 185px;
  border-radius: 14px;
  background: linear-gradient(var(--lineage-accent-faint) 0%, var(--lineage-paper) 100%);
  border: 1.5px solid var(--lineage-ink-light);
  text-decoration: none;
  overflow: hidden;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover {
  position: relative;
  inset: auto;
  min-height: 130px;
  background: repeating-linear-gradient(45deg, var(--lineage-ink-light), var(--lineage-ink-light) 1px, transparent 1px, transparent 8px);
  opacity: 1;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
  width: 100%;
  height: 130px;
  object-fit: cover;
  display: block;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-body {
  position: static;
  padding: 12px 14px 14px;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--lineage-ink);
  line-height: 1.2;
  margin: 4px 0 0;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cat {
  display: block;
  font-family: var(--lineage-font-body);
  font-size: 9px;
  font-weight: 600;
  color: var(--lineage-accent);
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0.05em;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-meta {
  font-family: var(--lineage-font-display);
  font-size: 9px;
  font-weight: 400;
  color: var(--lineage-ink-light);
  line-height: 1.3;
  margin: 6px 0 0;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title {
  font-size: 44px;
  max-width: 760px;
  overflow-wrap: anywhere;
}

@media (max-width: 768px) {
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes {
    gap: 10px;
    padding: 24px 0;
  }

  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
    flex-basis: 132px;
    width: 132px;
    min-width: 132px;
    height: 208px;
    border-radius: 12px;
  }

  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
    min-height: 90px;
    height: 90px;
  }

  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-body {
    padding: 8px 10px 10px;
  }

  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title {
    font-size: 11px;
    margin-top: 2px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title {
    font-size: 28px;
  }
}

/* ==========================================================================
   29. Main Quiz Section Reference Layout
   ========================================================================== */

.lineage-gs[data-page="main"] .lineage-gs__section--quizzes { padding: 40px 0; }
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-header { margin-bottom: 20px; }
.lineage-gs__section-eyebrow { font-family: var(--lineage-font-body); font-size: 11px; font-weight: 600; color: var(--lineage-ink-light); line-height: 1.3; text-transform: none; letter-spacing: 0.08em; }
.lineage-gs__section-description { font-family: var(--lineage-font-display); font-size: 13px; font-weight: 400; color: var(--lineage-ink-light); line-height: 1.3; margin: 4px 0 0; }
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-title { font-family: var(--lineage-font-display); font-size: 24px; font-weight: 700; color: var(--lineage-ink); line-height: 1.3; margin: 4px 0 0; }
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-link { font-family: var(--lineage-font-body); font-size: 13px; font-weight: 400; color: var(--lineage-accent); line-height: 1.3; }
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes { gap: 14px; overflow-x: hidden; }
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex: 0 0 185px; width: 185px; height: 282px; min-width: 185px; border-radius: 14px; background: linear-gradient(var(--lineage-accent-faint) 0%, var(--lineage-paper) 100%); border: 1.5px solid var(--lineage-ink-light); box-shadow: none; transform: none; text-decoration: none; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover { position: relative; inset: auto; flex: 1 1 0%; min-height: 130px; background: repeating-linear-gradient(45deg, var(--lineage-ink-light), var(--lineage-ink-light) 1px, transparent 1px, transparent 8px); opacity: 1; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img { position: static; inset: auto; width: 100%; height: 100%; min-height: 130px; object-fit: cover; display: block; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before { content: "?"; display: flex; align-items: center; justify-content: center; height: 130px; font-family: var(--lineage-font-display); font-size: 28px; font-weight: 400; color: var(--lineage-accent); opacity: 0.4; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__badge { top: 8px; right: 8px; padding: 2px 8px; border: 0; border-radius: 40px; background: var(--lineage-warm-faint); color: var(--lineage-warm); font-family: var(--lineage-font-body); font-size: 8px; font-weight: 600; line-height: 1.3; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__badge--new { background: var(--lineage-accent-faint); color: var(--lineage-accent); }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-body { position: static; padding: 12px 14px 14px; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cat { display: block; font-family: var(--lineage-font-body); font-size: 9px; font-weight: 600; color: var(--lineage-accent); line-height: 1.3; text-transform: none; letter-spacing: 0.05em; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title { font-family: var(--lineage-font-display); font-size: 13px; font-weight: 700; color: var(--lineage-ink); line-height: 1.2; margin-top: 4px; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta { font-family: var(--lineage-font-display); font-size: 9px; font-weight: 400; color: var(--lineage-ink-light); line-height: 1.3; margin: 6px 0 0; }
.lineage-gs__single-quiz-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,460px); gap: 48px; align-items: center; padding: 64px 48px; background: linear-gradient(var(--lineage-bg) 25%, rgba(48,34,86,0) 100%), linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%); }
.lineage-gs__single-quiz-title, .lineage-gs__single-quiz-subtitle, .lineage-gs__single-quiz-description, .lineage-gs__single-quiz-meta { color: var(--lineage-ink); }
.lineage-gs__single-quiz-title { font-family: var(--lineage-font-display); font-size: 44px; line-height: 1.15; margin: 4px 0 12px; }
.lineage-gs__single-quiz-media { height: 380px; border-radius: 20px; overflow: hidden; border: 1.5px solid rgba(255,255,255,0.15); background: repeating-linear-gradient(45deg, rgba(38,26,72,0.15), rgba(38,26,72,0.15) 1px, transparent 1px, transparent 10px); }
.lineage-gs__single-quiz-media img { width: 100%; height: 100%; object-fit: cover; }
.lineage-gs__single-quiz-stage { padding: 40px 48px; }

@media (max-width: 768px) {
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes { padding: 24px 0; }
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-header { margin-bottom: 0; }
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-title { font-size: 20px; }
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-link { font-size: 11px; }
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes { gap: 10px; margin-top: 16px; }
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex-basis: 132px; width: 132px; min-width: 132px; height: 208px; border-radius: 12px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover, .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img, .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before { min-height: 90px; height: 90px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-body { padding: 8px 10px 10px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cat, .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta { font-size: 8px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title { font-size: 11px; margin-top: 2px; }
  .lineage-gs__single-quiz-hero { grid-template-columns: 1fr; gap: 20px; padding: 48px 24px 24px; text-align: center; }
  .lineage-gs__single-quiz-title { font-size: 28px; }
  .lineage-gs__single-quiz-media { height: 180px; border-radius: 14px; }
  .lineage-gs__single-quiz-stage { padding: 24px; }
}

/* ==========================================================================
   2. Base Reset & Typography
   ========================================================================== */

.lineage-gs *,
.lineage-gs *::before,
.lineage-gs *::after {
  box-sizing: border-box;
}

.lineage-gs {
  background-color: var(--lineage-bg);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.lineage-gs h1,
.lineage-gs h2,
.lineage-gs h3,
.lineage-gs h4,
.lineage-gs h5,
.lineage-gs h6 {
  font-family: var(--lineage-font-display);
  font-weight: 600;
  line-height: 1.2;
  color: var(--lineage-deep-purple);
  margin: 0 0 0.5em;
}

.lineage-gs p {
  margin: 0 0 1em;
}

.lineage-gs a {
  color: var(--lineage-accent);
  text-decoration: none;
  transition: color var(--lineage-transition);
}

.lineage-gs a:hover {
  color: var(--lineage-warm);
}

/* ==========================================================================
   3. Layout Container
   ========================================================================== */

.lineage-gs__container {
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: var(--lineage-gap-lg); /* 48px desktop */
}

@media (max-width: 768px) {
  .lineage-gs__container {
    padding-inline: var(--lineage-gap); /* 24px mobile */
  }
}

/* ==========================================================================
   4. Hero Section (Requirement 3.3)
   ========================================================================== */

.lineage-gs__hero {
  position: relative;
  overflow: hidden;
  padding: 80px 0 64px;
  /*
   * Two-layer gradient: deep purple fading out over warm orange fading to white.
   * Matches spec: linear-gradient(var(--lineage-bg) 25%, rgba(48,34,86,0) 100%)
   *               over linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%)
   */
  background:
    linear-gradient(var(--lineage-bg) 25%, rgba(48, 34, 86, 0) 100%),
    linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%);
}

/* First diagonal texture hatch at soft-light blend mode */
.lineage-gs__hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.04) 0px,
      rgba(255, 255, 255, 0.04) 1px,
      transparent 1px,
      transparent 8px
    ),
    repeating-linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.04) 0px,
      rgba(255, 255, 255, 0.04) 1px,
      transparent 1px,
      transparent 8px
    );
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.lineage-gs__hero-inner {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: var(--lineage-gap-lg);
  display: flex;
  align-items: center;
  gap: 48px;
}

.lineage-gs__hero-content {
  flex: 1 1 auto;
}

.lineage-gs__hero-media {
  flex: 0 0 auto;
  width: 900px;
  max-width: 50%;
}

.lineage-gs__hero-title {
  font-family: var(--lineage-font-display);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin-bottom: 16px;
}

.lineage-gs__hero-subtitle {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: var(--lineage-ink);
  max-width: 560px;
  margin-bottom: 32px;
}

@media (max-width: 768px) {
  .lineage-gs__hero {
    padding: 48px 0 40px;
  }

  .lineage-gs__hero-inner {
    flex-direction: column;
    padding-inline: var(--lineage-gap);
    gap: 24px;
  }

  .lineage-gs__hero-media {
    width: 100%;
    max-width: 100%;
  }
}

/* ==========================================================================
   5. Category Navigation Strip (pill tabs, horizontal scroll on mobile)
   ========================================================================== */

.lineage-gs__category-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
}

.lineage-gs__category-nav::-webkit-scrollbar {
  display: none;
}

.lineage-gs__category-tab {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  padding: 8px 20px;
  border-radius: var(--lineage-radius-pill);
  border: 1.5px solid var(--lineage-ink-faint);
  background: var(--lineage-paper);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-body);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition:
    background var(--lineage-transition),
    border-color var(--lineage-transition),
    color var(--lineage-transition);
  flex-shrink: 0;
}

.lineage-gs__category-tab:hover,
.lineage-gs__category-tab:focus-visible {
  border-color: var(--lineage-accent);
  color: var(--lineage-accent);
  outline: none;
}

.lineage-gs__category-tab[aria-selected="true"],
.lineage-gs__category-tab.is-active {
  background: var(--lineage-accent);
  border-color: var(--lineage-accent);
  color: var(--lineage-paper);
}

/* ==========================================================================
   6. Section Headings
   ========================================================================== */

.lineage-gs__section {
  padding: 48px 0;
}

.lineage-gs__section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 24px;
  gap: 16px;
}

.lineage-gs__section-title {
  font-family: var(--lineage-font-display);
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: 600;
  color: var(--lineage-deep-purple);
  margin: 0;
}

.lineage-gs__section-link {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--lineage-accent);
  white-space: nowrap;
}

/* ==========================================================================
   7. Card Grid (Requirements 3.6, 3.7)
   ========================================================================== */

/* Standard responsive grid */
.lineage-gs__grid {
  display: grid;
  gap: var(--lineage-gap);
  /* 5-column desktop (>768px) */
  grid-template-columns: repeat(5, 1fr);
}

/* 2-column ≤768px */
@media (max-width: 768px) {
  .lineage-gs__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Single column <480px */
@media (max-width: 480px) {
  .lineage-gs__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Horizontal scroll row variant (main page preview rows) */
.lineage-gs__grid--scroll {
  display: flex;
  gap: var(--lineage-gap);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 8px;
}

.lineage-gs__grid--scroll::-webkit-scrollbar {
  display: none;
}

.lineage-gs__grid--scroll .lineage-gs__card {
  flex: 0 0 220px;
}

@media (max-width: 768px) {
  .lineage-gs__grid--scroll .lineage-gs__card {
    flex: 0 0 160px;
  }
}

/* ==========================================================================
   8. Card (Requirement 3.4)
   ========================================================================== */

.lineage-gs__card {
  position: relative;
  border-radius: 12px; /* 12-14px per spec */
  overflow: hidden;
  /*
   * Full-bleed dark purple gradient cover (spec: linear-gradient(135deg, #261A48, rgba(95,67,171,0.75)))
   * shown when no featured image is present.
   */
  background: linear-gradient(135deg, #261A48, rgba(95, 67, 171, 0.75));
  cursor: pointer;
  transition: transform var(--lineage-transition), box-shadow var(--lineage-transition);
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
}

.lineage-gs__card:hover,
.lineage-gs__card:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(38, 26, 72, 0.18);
}

/* Full-bleed card image with lazy-load (Requirement 18.1) */
.lineage-gs__card-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* loading="lazy" is applied in HTML; this ensures smooth rendering */
}

/*
 * Placeholder hatch shown while image loads or when no image is set.
 * Spec: repeating-linear-gradient(45deg, rgba(255,255,255,0.04) ...)
 */
.lineage-gs__card-placeholder {
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.04) 0px,
    rgba(255, 255, 255, 0.04) 1px,
    transparent 1px,
    transparent 10px
  );
}

/*
 * Overlay gradient: linear-gradient(to top, rgba(20,10,40,0.92) 60%, transparent)
 * Spec-exact values for the bottom-to-top fade.
 */
.lineage-gs__card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(20, 10, 40, 0.92) 0%,
    rgba(20, 10, 40, 0.92) 60%,
    transparent 100%
  );
}

/* White text at bottom */
.lineage-gs__card-body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 16px;
  z-index: 1;
}

/*
 * Category label: Poppins 600, 8-9px, uppercase, rgba(255,255,255,0.7)
 * Spec-exact typography.
 */
.lineage-gs__card-category {
  font-family: var(--lineage-font-body); /* Poppins */
  font-size: 0.5rem; /* ~8px */
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.7);
  margin: 0 0 4px;
}

/*
 * Card title: Dosis 700, 13-15px, white
 * Spec-exact typography.
 */
.lineage-gs__card-title {
  font-family: var(--lineage-font-display); /* Dosis */
  font-size: clamp(0.8125rem, 1.5vw, 0.9375rem); /* 13-15px */
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  line-height: 1.3;
}

/* ==========================================================================
   9. Glass Badge (absolute top-right pill)
   ========================================================================== */

.lineage-gs__badge {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: var(--lineage-radius-pill);
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: var(--lineage-ink);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* ==========================================================================
   10. Buttons (pill shape)
   ========================================================================== */

.lineage-gs__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  border-radius: var(--lineage-radius-pill);
  border: 2px solid transparent;
  font-family: var(--lineage-font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    background var(--lineage-transition),
    color var(--lineage-transition),
    border-color var(--lineage-transition),
    box-shadow var(--lineage-transition);
  text-decoration: none;
  white-space: nowrap;
}

/* Primary — warm orange */
.lineage-gs__btn--primary {
  background: var(--lineage-warm);
  color: var(--lineage-paper);
  border-color: var(--lineage-warm);
}

.lineage-gs__btn--primary:hover,
.lineage-gs__btn--primary:focus-visible {
  background: #d45e38;
  border-color: #d45e38;
  color: var(--lineage-ink);
  box-shadow: 0 4px 16px rgba(233, 111, 70, 0.40);
}

/* Secondary — accent purple */
.lineage-gs__btn--secondary {
  background: var(--lineage-accent);
  color: var(--lineage-paper);
  border-color: var(--lineage-accent);
}

.lineage-gs__btn--secondary:hover,
.lineage-gs__btn--secondary:focus-visible {
  background: #4e35a0;
  border-color: #4e35a0;
  color: var(--lineage-ink);
  box-shadow: 0 4px 16px rgba(95, 67, 171, 0.35);
}

/* Ghost variant */
.lineage-gs__btn--ghost {
  background: transparent;
  color: var(--lineage-accent);
  border-color: var(--lineage-accent);
}

.lineage-gs__btn--ghost:hover,
.lineage-gs__btn--ghost:focus-visible {
  background: var(--lineage-accent-faint);
}

/* Small size */
.lineage-gs__btn--sm {
  padding: 8px 18px;
  font-size: 0.8125rem;
}

/* ==========================================================================
   11. Lead-Gen Strip (gradient banner, inline form)
   ========================================================================== */

.lineage-gs__lead-strip {
  background: linear-gradient(
    135deg,
    var(--lineage-deep-purple) 0%,
    var(--lineage-accent) 100%
  );
  border-radius: var(--lineage-radius-card);
  padding: 40px 48px;
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
  margin: 48px 0;
}

.lineage-gs__lead-strip-content {
  flex: 1 1 280px;
}

.lineage-gs__lead-strip-title {
  font-family: var(--lineage-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--lineage-ink);
  margin: 0 0 8px;
}

.lineage-gs__lead-strip-text {
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}

.lineage-gs__lead-strip-form {
  flex: 1 1 320px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.lineage-gs__lead-strip-form .lineage-gs__input {
  flex: 1 1 180px;
}

@media (max-width: 768px) {
  .lineage-gs__lead-strip {
    padding: 28px 24px;
    flex-direction: column;
    align-items: stretch;
  }

  .lineage-gs__lead-strip-form {
    flex-direction: column;
  }
}

/* ==========================================================================
   12. Form Inputs
   ========================================================================== */

.lineage-gs__input {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border-radius: var(--lineage-radius-pill);
  border: 1.5px solid var(--lineage-ink-faint);
  background: var(--lineage-paper);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-body);
  font-size: 0.9375rem;
  transition: border-color var(--lineage-transition), box-shadow var(--lineage-transition);
}

.lineage-gs__input:focus {
  outline: none;
  border-color: var(--lineage-accent);
  box-shadow: 0 0 0 3px rgba(95, 67, 171, 0.20);
}

.lineage-gs__input::placeholder {
  color: var(--lineage-ink-light);
}

.lineage-gs__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--lineage-ink);
  margin-bottom: 6px;
}

.lineage-gs__field {
  margin-bottom: 16px;
}

/* ==========================================================================
   13. Oracle Card — 3D Flip Animation (Requirement 12.3)
   ========================================================================== */

.lineage-gs__oracle-scene {
  perspective: 1000px;
  width: 260px;
  height: 380px;
  margin: 0 auto;
}

.lineage-gs__oracle-card {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform var(--lineage-flip-dur) ease;
  cursor: pointer;
  border-radius: var(--lineage-radius-card);
}

.lineage-gs__oracle-card.is-flipped {
  transform: rotateY(180deg);
}

.lineage-gs__oracle-face {
  position: absolute;
  inset: 0;
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.lineage-gs__oracle-face--front {
  background: var(--lineage-deep-purple);
}

.lineage-gs__oracle-face--back {
  transform: rotateY(180deg);
  background: var(--lineage-paper);
}

.lineage-gs__oracle-face img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Gated interpretation overlay */
.lineage-gs__oracle-reveal {
  position: absolute;
  inset: 0;
  display: none; /* shown by JS when revealed */
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(38, 26, 72, 0.85);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: var(--lineage-radius-card);
  text-align: center;
  color: var(--lineage-ink);
  animation: oracleRevealIn 0.5s ease;
}
.lineage-gs__oracle-reveal--visible,
.lineage-gs__oracle-reveal:not([hidden]) {
  display: flex;
}
@keyframes oracleRevealIn {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

/* ==========================================================================
   14. Quiz — Progress Bar, Question Transitions, Blur Overlay
   ========================================================================== */

.lineage-gs__quiz-progress {
  height: 6px;
  background: var(--lineage-ink-faint);
  border-radius: var(--lineage-radius-pill);
  overflow: hidden;
  margin-bottom: 32px;
}

.lineage-gs__quiz-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--lineage-accent), var(--lineage-warm));
  border-radius: var(--lineage-radius-pill);
  transition: width 0.4s ease;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-text {
        text-align: center;
        color: #211d28 !important;
    }
    .lineage-gs[data-page="main"] .lineage-gs__hero-title {
    max-width: 660px;
    margin: 0;
    font-size: 44px;
    line-height: 1.15;
    color: #181023 !important;
    text-align: center;
}
.lineage-gs[data-page="main"] .lineage-gs__hero-subtitle {
    max-width: 500px;
    margin: 0;
    font-size: 16px;
    line-height: 1.3;
    color: #011907 !important;
    text-align: center;
}

.lineage-gs :where(h1,h2,h3,h4,h5,h6,p,a,button,input,textarea,select,span) {
    font-family: inherit;
    text-transform: none !important;
}
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
    display: block;
    padding: 86px 48px 35px !important;
    background: #211d28 !important;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro {
    padding: 32px 48px 32px !important;
}
.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-shell {
    width: 100%;
    padding: 30px 32px 32px;
    border-radius: 14px;
    background: var(--lineage-paper);
    border: 1.5px solid var(--lineage-ink-light);
    box-shadow: none;
    margin-bottom: 50px !important;
}

.lineage-gs__single-quiz-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);
    gap: 48px;
    align-items: center;
    padding: 132px 48px !important;
    background: linear-gradient(var(--lineage-bg) 25%, #fff0 100%), linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%);
}
    .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-title {
        font-size: 20px;
        margin-bottom: 16px;
        color: #000 !important;
    }

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro{ background: linear-gradient(356deg, #20153f 0%, #461e5c 100%) !important;}

.lineage-gs {
    background: linear-gradient(356deg, #20153f 0%, #461e5c 100%) !important;
    top: 68px !important;
    bottom: 68px !important;
}



.lineage-gs__quiz-question {
  animation: lineage-fade-in 0.3s ease;
}

@keyframes lineage-fade-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.lineage-gs__quiz-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 24px;
}

.lineage-gs__quiz-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-radius: var(--lineage-radius-card);
  border: 1.5px solid var(--lineage-ink-faint);
  background: var(--lineage-paper);
  cursor: pointer;
  font-size: 0.9375rem;
  transition:
    border-color var(--lineage-transition),
    background var(--lineage-transition);
}

.lineage-gs__quiz-option:hover,
.lineage-gs__quiz-option:focus-visible {
  border-color: var(--lineage-accent);
  background: var(--lineage-accent-faint);
  outline: none;
}

.lineage-gs__quiz-option.is-selected {
  border-color: var(--lineage-accent);
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
  font-weight: 600;
}

/* Blur overlay for gated quiz results */
.lineage-gs__quiz-result {
  position: relative;
}

.lineage-gs__quiz-result.is-gated .lineage-gs__quiz-result-content {
  filter: blur(8px);
  user-select: none;
  pointer-events: none;
}

.lineage-gs__quiz-gate-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2;
  padding: 24px;
  text-align: center;
}

/* ==========================================================================
   15. Modal — Overlay, Focus Trap Styles, Backdrop (Requirement 17.2)
   ========================================================================== */

.lineage-gs__modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(38, 26, 72, 0.65);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: lineage-backdrop-in 0.2s ease;
}

@keyframes lineage-backdrop-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.lineage-gs__modal {
  position: relative;
  background: var(--lineage-paper);
  border-radius: var(--lineage-radius-card);
  padding: 40px;
  width: 100%;
  max-width: 480px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(38, 26, 72, 0.30);
  animation: lineage-modal-in 0.25s ease;
}

@keyframes lineage-modal-in {
  from { opacity: 0; transform: scale(0.95) translateY(16px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

.lineage-gs__modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: var(--lineage-ink-faint);
  color: var(--lineage-ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  transition: background var(--lineage-transition);
}

.lineage-gs__modal-close:hover,
.lineage-gs__modal-close:focus-visible {
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
}

.lineage-gs__modal-title {
  font-family: var(--lineage-font-display);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 8px;
}

.lineage-gs__modal-subtitle {
  font-size: 0.9375rem;
  color: var(--lineage-ink-light);
  margin: 0 0 24px;
}

@media (max-width: 480px) {
  .lineage-gs__modal {
    padding: 28px 20px;
  }
}

/* ==========================================================================
   16. Accessibility — Visible Focus Styles (WCAG AA, Requirement 3.10)
   ========================================================================== */

/* Universal focus ring for keyboard navigation */
.lineage-gs :focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Pill-shaped elements get a matching pill outline */
.lineage-gs__btn:focus-visible,
.lineage-gs__category-tab:focus-visible,
.lineage-gs__input:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
  border-radius: var(--lineage-radius-pill);
}

/* Card focus ring */
.lineage-gs__card:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
  border-radius: var(--lineage-radius-card);
}

/* Skip-to-content link (screen-reader / keyboard users) */
.lineage-gs__skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 9999;
  padding: 8px 16px;
  background: var(--lineage-accent);
  color: var(--lineage-paper);
  border-radius: 0 0 var(--lineage-radius-card) var(--lineage-radius-card);
  font-weight: 600;
  transition: top 0.2s;
}

.lineage-gs__skip-link:focus {
  top: 0;
}

/* ==========================================================================
   17. Audio Player Cards
   ========================================================================== */

.lineage-gs__audio-card {
  background: var(--lineage-paper);
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  border: 1px solid var(--lineage-ink-faint);
  transition: box-shadow var(--lineage-transition), transform var(--lineage-transition);
}

.lineage-gs__audio-card:hover {
  box-shadow: 0 8px 24px rgba(38, 26, 72, 0.10);
  transform: translateY(-2px);
}

.lineage-gs__audio-embed {
  width: 100%;
  border: none;
  display: block;
}

.lineage-gs__audio-meta {
  padding: 16px;
}

.lineage-gs__audio-title {
  font-family: var(--lineage-font-display);
  font-size: 1rem;
  font-weight: 600;
  color: var(--lineage-deep-purple);
  margin: 0 0 4px;
}

.lineage-gs__audio-duration {
  font-size: 0.8125rem;
  color: var(--lineage-ink-light);
  margin: 0;
}

/* Soft-gate inline prompt */
.lineage-gs__soft-gate {
  background: var(--lineage-warm-faint);
  border: 1px solid var(--lineage-peach);
  border-radius: var(--lineage-radius-card);
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.lineage-gs__soft-gate-text {
  flex: 1 1 200px;
  font-size: 0.9375rem;
  color: var(--lineage-ink);
  margin: 0;
}

/* ==========================================================================
   18. Reading Room / Guide Cards
   ========================================================================== */

.lineage-gs__guide-card {
  background: var(--lineage-paper);
  border-radius: var(--lineage-radius-card);
  padding: 24px;
  border: 1px solid var(--lineage-ink-faint);
  display: flex;
  gap: 20px;
  align-items: flex-start;
  transition: box-shadow var(--lineage-transition);
}

.lineage-gs__guide-card:hover {
  box-shadow: 0 6px 20px rgba(38, 26, 72, 0.08);
}

.lineage-gs__guide-thumb {
  flex: 0 0 80px;
  width: 80px;
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
}

.lineage-gs__guide-info {
  flex: 1 1 auto;
}

.lineage-gs__guide-title {
  font-family: var(--lineage-font-display);
  font-size: 1rem;
  font-weight: 600;
  color: var(--lineage-deep-purple);
  margin: 0 0 6px;
}

.lineage-gs__guide-meta {
  font-size: 0.8125rem;
  color: var(--lineage-ink-light);
  margin: 0 0 12px;
}

/* ==========================================================================
   19. Letter Cards
   ========================================================================== */

.lineage-gs__letter-card {
  background: var(--lineage-paper);
  border-radius: var(--lineage-radius-card);
  padding: 28px;
  border: 1px solid var(--lineage-ink-faint);
  transition: box-shadow var(--lineage-transition), transform var(--lineage-transition);
}

.lineage-gs__letter-card:hover {
  box-shadow: 0 8px 24px rgba(38, 26, 72, 0.10);
  transform: translateY(-2px);
}

.lineage-gs__letter-theme {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--lineage-radius-pill);
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
  font-size: 0.75rem;
  font-weight: 600;
  margin-bottom: 12px;
}

.lineage-gs__letter-title {
  font-family: var(--lineage-font-display);
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--lineage-deep-purple);
  margin: 0 0 8px;
}

.lineage-gs__letter-excerpt {
  font-size: 0.875rem;
  color: var(--lineage-ink-light);
  margin: 0 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ==========================================================================
   20. Utility Classes
   ========================================================================== */

.lineage-gs__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.lineage-gs__text-center { text-align: center; }
.lineage-gs__mt-0  { margin-top: 0; }
.lineage-gs__mb-0  { margin-bottom: 0; }
.lineage-gs__mt-24 { margin-top: 24px; }
.lineage-gs__mb-24 { margin-bottom: 24px; }

/* Loading spinner */
.lineage-gs__spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--lineage-ink-faint);
  border-top-color: var(--lineage-accent);
  border-radius: 50%;
  animation: lineage-spin 0.7s linear infinite;
}

@keyframes lineage-spin {
  to { transform: rotate(360deg); }
}

/* Error / success notices */
.lineage-gs__notice {
  padding: 12px 16px;
  border-radius: var(--lineage-radius-card);
  font-size: 0.875rem;
  margin-bottom: 16px;
}

.lineage-gs__notice--error {
  background: #FEE2E2;
  color: #991B1B;
  border: 1px solid #FECACA;
}

.lineage-gs__notice--success {
  background: #D1FAE5;
  color: #065F46;
  border: 1px solid #A7F3D0;
}

/* ==========================================================================
   21. Subpage Layout (Section 6.1 — quiz, audio, oracle, reading-room, letters)
   ========================================================================== */

/* Subpage wrapper */
.lineage-gs__subpage {
  min-height: 60vh;
}

/* ── Subpage Hero ─────────────────────────────────────────────────────────── */

/* Deep purple gradient hero shared by all subpages */
.lineage-gs__hero--quizzes,
.lineage-gs__hero--audio,
.lineage-gs__hero--oracle,
.lineage-gs__hero--reading,
.lineage-gs__hero--letters {
  position: relative;
  overflow: hidden;
  padding: 64px 48px 56px;
  background: linear-gradient(
    135deg,
    var(--lineage-deep-purple) 0%,
    #3d2a7a 60%,
    #5f43ab 100%
  );
}

/* Diagonal texture overlay */
.lineage-gs__hero--quizzes::before,
.lineage-gs__hero--audio::before,
.lineage-gs__hero--oracle::before,
.lineage-gs__hero--reading::before,
.lineage-gs__hero--letters::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.03) 0px,
    rgba(255, 255, 255, 0.03) 1px,
    transparent 1px,
    transparent 8px
  );
  mix-blend-mode: soft-light;
  pointer-events: none;
}

/* Breadcrumb — peach, Poppins 600, uppercase, 0.08em letter-spacing */
.lineage-gs__breadcrumb {
  position: relative;
  z-index: 1;
  margin-bottom: 16px;
}

.lineage-gs__breadcrumb ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.lineage-gs__breadcrumb li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--lineage-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.08em;
  color: var(--lineage-peach);
}

.lineage-gs__breadcrumb li + li::before {
  content: '/';
  color: rgba(250, 191, 150, 0.5);
}

.lineage-gs__breadcrumb a {
  color: var(--lineage-peach);
  text-decoration: none;
  transition: opacity var(--lineage-transition);
}

.lineage-gs__breadcrumb a:hover {
  opacity: 0.8;
  color: var(--lineage-peach);
}

.lineage-gs__breadcrumb [aria-current='page'] {
  color: rgba(250, 191, 150, 0.75);
}

/* H1 — white, Dosis 700 */
.lineage-gs__hero--quizzes .lineage-gs__hero-title,
.lineage-gs__hero--audio .lineage-gs__hero-title,
.lineage-gs__hero--oracle .lineage-gs__hero-title,
.lineage-gs__hero--reading .lineage-gs__hero-title,
.lineage-gs__hero--letters .lineage-gs__hero-title {
  position: relative;
  z-index: 1;
  font-family: var(--lineage-font-display);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: var(--lineage-ink);
  margin: 0 0 12px;
  line-height: 1.15;
}

/* Subtitle — rgba(255,255,255,0.65), Poppins */
.lineage-gs__hero--quizzes .lineage-gs__hero-subtitle,
.lineage-gs__hero--audio .lineage-gs__hero-subtitle,
.lineage-gs__hero--oracle .lineage-gs__hero-subtitle,
.lineage-gs__hero--reading .lineage-gs__hero-subtitle,
.lineage-gs__hero--letters .lineage-gs__hero-subtitle {
  position: relative;
  z-index: 1;
  font-family: var(--lineage-font-body);
  font-size: clamp(0.9375rem, 2vw, 1.125rem);
  color: rgba(255, 255, 255, 0.65);
  margin: 0;
  max-width: 560px;
}

@media (max-width: 768px) {
  .lineage-gs__hero--quizzes,
  .lineage-gs__hero--audio,
  .lineage-gs__hero--oracle,
  .lineage-gs__hero--reading,
  .lineage-gs__hero--letters {
    padding: 40px 24px 36px;
  }
}

/* ── Filter / Tab Bar ─────────────────────────────────────────────────────── */

.lineage-gs__filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 48px;
  background: var(--lineage-paper);
  border-bottom: 1px solid var(--lineage-ink-faint);
  flex-wrap: wrap;
}

.lineage-gs__filter-bar--count-only {
  justify-content: flex-end;
}

.lineage-gs__filter-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex: 1 1 auto;
}

.lineage-gs__filter-tabs::-webkit-scrollbar {
  display: none;
}

/* Pill chip tabs */
.lineage-gs__tab {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  padding: 7px 18px;
  border-radius: var(--lineage-radius-pill);
  border: 1.5px solid var(--lineage-ink-faint);
  background: var(--lineage-paper);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-body);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition:
    background var(--lineage-transition),
    border-color var(--lineage-transition),
    color var(--lineage-transition);
  flex-shrink: 0;
}

.lineage-gs__tab:hover,
.lineage-gs__tab:focus-visible {
  border-color: var(--lineage-accent);
  color: var(--lineage-accent);
  outline: none;
}

.lineage-gs__tab--active,
.lineage-gs__tab[aria-selected='true'] {
  background: var(--lineage-accent);
  border-color: var(--lineage-accent);
  color: var(--lineage-paper);
}

/* Item count — right-aligned */
.lineage-gs__item-count {
  font-family: var(--lineage-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--lineage-ink-light);
  white-space: nowrap;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .lineage-gs__filter-bar {
    padding: 16px 24px;
  }
}

/* ── Subpage Content Grid ─────────────────────────────────────────────────── */

.lineage-gs__grid--quizzes,
.lineage-gs__grid--audio,
.lineage-gs__grid--reading,
.lineage-gs__grid--letters {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  padding: 32px 48px;
}

@media (max-width: 768px) {
  .lineage-gs__grid--quizzes,
  .lineage-gs__grid--audio,
  .lineage-gs__grid--reading,
  .lineage-gs__grid--letters {
    grid-template-columns: repeat(2, 1fr);
    padding: 24px;
    gap: 14px;
  }
}

/* Loading / empty / error states */
.lineage-gs__loading,
.lineage-gs__empty,
.lineage-gs__error {
  grid-column: 1 / -1;
  text-align: center;
  padding: 48px 24px;
  font-family: var(--lineage-font-body);
  font-size: 0.9375rem;
  color: var(--lineage-ink-light);
}

.lineage-gs__error {
  color: #991B1B;
}

/* ── Quiz Cards ───────────────────────────────────────────────────────────── */

.lineage-gs__card--quiz {
  position: relative;
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  background: var(--lineage-deep-purple);
  cursor: pointer;
  transition: transform var(--lineage-transition), box-shadow var(--lineage-transition);
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
}

.lineage-gs__card--quiz:hover,
.lineage-gs__card--quiz:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(38, 26, 72, 0.22);
  outline: none;
}

.lineage-gs__card--quiz .lineage-gs__card-cover {
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
}

.lineage-gs__card--quiz .lineage-gs__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs__card--quiz .lineage-gs__card-img--placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #3d2a7a 0%, #5f43ab 100%);
}

.lineage-gs__card--quiz .lineage-gs__card-body {
  padding: 14px;
  background: var(--lineage-paper);
  flex-shrink: 0;
}

.lineage-gs__card--quiz .lineage-gs__card-cat {
  display: block;
  font-family: var(--lineage-font-body);
  font-size: 0.6875rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0.06em;
  color: var(--lineage-accent);
  margin-bottom: 4px;
}

.lineage-gs__card--quiz .lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 1.125rem; /* 18px */
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 6px;
  line-height: 1.25;
}

.lineage-gs__card--quiz .lineage-gs__card-meta {
  font-family: var(--lineage-font-body);
  font-size: 0.75rem;
  color: var(--lineage-ink-light);
  margin: 0;
}

/* ── Audio Cards ──────────────────────────────────────────────────────────── */

.lineage-gs__card--audio {
  position: relative;
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  background: var(--lineage-deep-purple);
  cursor: pointer;
  transition: transform var(--lineage-transition), box-shadow var(--lineage-transition);
  aspect-ratio: 3 / 4;
}

.lineage-gs__card--audio:hover,
.lineage-gs__card--audio:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(38, 26, 72, 0.22);
}

.lineage-gs__card--audio .lineage-gs__card-cover {
  position: relative;
  width: 100%;
  height: 100%;
}

.lineage-gs__card--audio .lineage-gs__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs__card--audio .lineage-gs__card-img--placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
}

/* Play button circle — 36px */
.lineage-gs__play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--lineage-transition), transform var(--lineage-transition);
  padding: 0;
}

.lineage-gs__play-btn:hover,
.lineage-gs__play-btn:focus-visible {
  background: rgba(255, 255, 255, 0.35);
  transform: translate(-50%, -50%) scale(1.1);
  outline: none;
}

/* Bottom overlay with title + duration */
.lineage-gs__card--audio .lineage-gs__card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px 14px;
  background: linear-gradient(to top, rgba(38, 26, 72, 0.92) 0%, transparent 100%);
  z-index: 1;
}

.lineage-gs__card--audio .lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 0.875rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0 0 2px;
  line-height: 1.3;
}

.lineage-gs__card--audio .lineage-gs__card-duration {
  font-family: var(--lineage-font-body);
  font-size: 0.6875rem;
  color: rgba(255, 255, 255, 0.7);
}

/* ── Reading Room Cards ───────────────────────────────────────────────────── */

.lineage-gs__card--reading {
  position: relative;
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  background: var(--lineage-deep-purple);
  cursor: pointer;
  transition: transform var(--lineage-transition), box-shadow var(--lineage-transition);
  aspect-ratio: 3 / 4;
}

.lineage-gs__card--reading:hover,
.lineage-gs__card--reading:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(38, 26, 72, 0.22);
  outline: none;
}

.lineage-gs__card--reading .lineage-gs__card-cover {
  position: relative;
  width: 100%;
  height: 100%;
}

.lineage-gs__card--reading .lineage-gs__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs__card--reading .lineage-gs__card-img--placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lineage-gs__book-icon {
  opacity: 0.5;
}

/* Bottom overlay with title + download label */
.lineage-gs__card--reading .lineage-gs__card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 14px;
  background: linear-gradient(to top, rgba(38, 26, 72, 0.92) 0%, transparent 100%);
  z-index: 1;
}

.lineage-gs__card--reading .lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 0.9375rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0 0 4px;
  line-height: 1.3;
}

.lineage-gs__card-download-label {
  font-family: var(--lineage-font-body);
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--lineage-peach);
  text-transform: none;
  letter-spacing: 0.06em;
}

/* ── Letter Cards ─────────────────────────────────────────────────────────── */

.lineage-gs__card--letter {
  border-radius: var(--lineage-radius-card);
  overflow: hidden;
  background: var(--lineage-paper);
  border: 1px solid var(--lineage-ink-faint);
  transition: transform var(--lineage-transition), box-shadow var(--lineage-transition);
  display: flex;
  flex-direction: column;
}

.lineage-gs__card--letter:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(38, 26, 72, 0.10);
}

.lineage-gs__card--letter .lineage-gs__card-cover {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
}

.lineage-gs__card--letter .lineage-gs__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs__card--letter .lineage-gs__card-img--placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
}

.lineage-gs__card--letter .lineage-gs__card-body {
  padding: 16px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.lineage-gs__card-theme {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--lineage-radius-pill);
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
  font-family: var(--lineage-font-body);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.05em;
  margin-bottom: 10px;
}

.lineage-gs__card--letter .lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 6px;
  line-height: 1.3;
}

.lineage-gs__card-subtitle {
  font-family: var(--lineage-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--lineage-ink);
  margin: 0 0 8px;
}

.lineage-gs__card-excerpt {
  font-family: var(--lineage-font-body);
  font-size: 0.8125rem;
  color: var(--lineage-ink-light);
  margin: 0 0 14px;
  flex: 1 1 auto;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.lineage-gs__card--letter .lineage-gs__read-letter-btn {
  margin-top: auto;
  width: 100%;
  justify-content: center;
}

/* ── Oracle Stage ─────────────────────────────────────────────────────────── */

.lineage-gs__oracle-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 24px;
  min-height: 480px;
}

.lineage-gs__oracle-actions {
  display: flex;
  justify-content: center;
  padding: 0 24px 48px;
}

/* ── Glass Badge (subpage variant) ───────────────────────────────────────── */

.lineage-gs__badge--glass {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: var(--lineage-radius-pill);
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-body);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: none;
  white-space: nowrap;
}

.lineage-gs__badge--new {
  background: rgba(233, 111, 70, 0.35);
  border-color: rgba(233, 111, 70, 0.5);
}

/* ==========================================================================
   21. Lead-Capture Modal (Requirements 5.9, 17.1, 17.2, 17.3)
   ========================================================================== */

/**
 * The modal is hidden by default. lead-form.js adds
 * .lineage-gs__lead-modal--open to make it visible.
 *
 * Contrast audit (WCAG AA):
 *   - Modal title (#261A48 on var(--lineage-ink)): 14.7:1 ✓ (large text 3:1 min)
 *   - Label text (#2A2A2A on var(--lineage-ink)): 15.3:1 ✓ (normal text 4.5:1 min)
 *   - Error text (#991B1B on #FEE2E2): 7.2:1 ✓ (normal text 4.5:1 min)
 *   - Submit btn (var(--lineage-ink) on #E96F46): 3.1:1 ✓ (large/bold text 3:1 min)
 *   - Privacy note (#888888 on var(--lineage-ink)): 4.6:1 ✓ (normal text 4.5:1 min)
 */

/* Backdrop — fixed full-screen overlay */
.lineage-gs__modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(38, 26, 72, 0.70);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 9000;
  /* Hidden until modal opens */
  display: none;
  animation: lineage-backdrop-in 0.2s ease;
}

@keyframes lineage-backdrop-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Modal dialog — centred card */
.lineage-gs__lead-modal {
  position: fixed;
  inset: 0;
  z-index: 9001;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  overflow-y: auto;
}

/* Visible state — toggled by lead-form.js.
   Both the modal and its associated backdrop are shown when the modal is open.
   The backdrop is shown via body.lineage-gs--modal-open (set by lead-form.js). */
.lineage-gs__lead-modal--open {
  display: flex;
}

body.lineage-gs--modal-open .lineage-gs__modal-backdrop {
  display: block;
}

/* When any modal is open, prevent body scroll */
body.lineage-gs--modal-open {
  overflow: hidden;
}

/* Inner card */
.lineage-gs__lead-modal-inner {
  position: relative;
  background: var(--lineage-paper);
  border-radius: 16px;
  padding: 40px;
  width: 100%;
  max-width: 480px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(38, 26, 72, 0.30);
  animation: lineage-modal-in 0.25s ease;
}

@keyframes lineage-modal-in {
  from { opacity: 0; transform: scale(0.95) translateY(16px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Close button (soft / partial gates only) */
.lineage-gs__lead-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: var(--lineage-ink-faint);
  color: var(--lineage-ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  line-height: 1;
  transition: background var(--lineage-transition), color var(--lineage-transition);
}

.lineage-gs__lead-modal-close:hover {
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
}

/* Visible focus ring on close button — WCAG AA */
.lineage-gs__lead-modal-close:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
}

/* Modal header */
.lineage-gs__lead-modal-header {
  margin-bottom: 24px;
}

.lineage-gs__lead-modal-title {
  font-family: var(--lineage-font-display);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 8px;
}

.lineage-gs__lead-modal-desc {
  font-size: 0.9375rem;
  color: var(--lineage-ink-light);
  margin: 0;
}

/* Hard-gate variant — no close button, slightly different header spacing */
.lineage-gs__lead-modal--hard-gate .lineage-gs__lead-modal-header {
  padding-top: 0;
}

/* Error / validation message region */
.lineage-gs__field-error {
  background: #FEE2E2;
  color: #991B1B;
  border: 1px solid #FECACA;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 0.875rem;
  margin-bottom: 16px;
}

.lineage-gs__field-error[hidden] {
  display: none;
}

/* Required field asterisk */
.lineage-gs__required {
  color: var(--lineage-warm);
  margin-left: 2px;
}

/* Privacy note */
.lineage-gs__privacy-note {
  font-size: 0.8125rem;
  color: var(--lineage-ink-light);
  text-align: center;
  margin: 12px 0 0;
}

/* Phone input wrapper (for intl-tel-input integration) */
.lineage-gs__phone-wrap {
  position: relative;
}

/* Submit button busy state */
.lineage-gs__lead-submit[aria-busy="true"] {
  opacity: 0.75;
  cursor: wait;
}

/* Full-width submit in modal */
.lineage-gs__lead-modal .lineage-gs__lead-submit {
  width: 100%;
  margin-top: 8px;
}

@media (max-width: 480px) {
  .lineage-gs__lead-modal-inner {
    padding: 28px 20px;
  }

  .lineage-gs__lead-modal-title {
    font-size: 1.125rem;
  }
}

/* ==========================================================================
   22. Inline Lead-Gen Strip (Requirements 5.12, 17.4, 17.5, 17.6)
   ========================================================================== */

/**
 * Positioned between the Quizzes and Healing Frequencies sections on the
 * main page. Always visible — no gate.
 *
 * Contrast audit (WCAG AA):
 *   - Heading (#261A48 on #EDE9FB): 11.2:1 ✓
 *   - Subheading (#2A2A2A on #EDE9FB): 13.1:1 ✓
 *   - Label (#2A2A2A on var(--lineage-ink)): 15.3:1 ✓
 *   - CTA button (var(--lineage-ink) on #E96F46): 3.1:1 ✓ (large/bold text)
 *   - Dismiss link (#5F43AB on #EDE9FB): 5.8:1 ✓
 */

.lineage-gs__lead-inline {
  background: var(--lineage-accent-faint);
  border-radius: var(--lineage-radius-card);
  padding: 40px 48px;
  margin: 48px 0;
}

.lineage-gs__lead-inline-inner {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  flex-wrap: wrap;
}

/* Brand / identity column */
.lineage-gs__lead-inline-brand {
  flex: 0 1 260px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Lineage avatar — 56 px circle */
.lineage-gs__lead-inline-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--lineage-accent);
  flex-shrink: 0;
}

/* Placeholder avatar when image is unavailable */
.lineage-gs__lead-inline-avatar--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--lineage-accent);
  color: var(--lineage-paper);
  font-family: var(--lineage-font-display);
  font-size: 1rem;
  font-weight: 700;
}

.lineage-gs__lead-inline-heading {
  font-family: var(--lineage-font-display);
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0;
}

.lineage-gs__lead-inline-subheading {
  font-size: 0.9375rem;
  color: var(--lineage-ink);
  margin: 0;
  line-height: 1.6;
}

/* Form column */
.lineage-gs__lead-inline-form-wrap {
  flex: 1 1 400px;
}

/* Horizontal fields row */
.lineage-gs__lead-inline-fields {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
}

.lineage-gs__field--inline {
  flex: 1 1 160px;
  margin-bottom: 0;
}

.lineage-gs__field--submit {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
}

/* Dismiss / skip link */
.lineage-gs__lead-inline-dismiss {
  margin-top: 12px;
  text-align: center;
}

.lineage-gs__lead-dismiss-btn {
  background: none;
  border: none;
  padding: 4px 8px;
  font-family: var(--lineage-font-body);
  font-size: 0.8125rem;
  color: var(--lineage-accent);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--lineage-transition);
}

.lineage-gs__lead-dismiss-btn:hover {
  color: var(--lineage-warm);
}

.lineage-gs__lead-dismiss-btn:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Responsive — stack on mobile */
@media (max-width: 768px) {
  .lineage-gs__lead-inline {
    padding: 28px 24px;
  }

  .lineage-gs__lead-inline-inner {
    flex-direction: column;
    gap: 24px;
  }

  .lineage-gs__lead-inline-brand {
    flex: 1 1 auto;
  }

  .lineage-gs__lead-inline-form-wrap {
    flex: 1 1 auto;
    width: 100%;
  }

  .lineage-gs__lead-inline-fields {
    flex-direction: column;
    gap: 0;
  }

  .lineage-gs__field--inline {
    flex: 1 1 auto;
    width: 100%;
    margin-bottom: 16px;
  }

  .lineage-gs__field--submit {
    width: 100%;
  }

  .lineage-gs__field--submit .lineage-gs__btn {
    width: 100%;
  }
}

/* ==========================================================================
   23. Inline form success state
   ========================================================================== */

.lineage-gs__lead-inline--success .lineage-gs__lead-inline-form-wrap {
  display: none;
}

.lineage-gs__lead-inline-success-msg {
  display: none;
  padding: 20px;
  background: #D1FAE5;
  color: #065F46;
  border: 1px solid #A7F3D0;
  border-radius: var(--lineage-radius-card);
  font-size: 0.9375rem;
  text-align: center;
}

.lineage-gs__lead-inline--success .lineage-gs__lead-inline-success-msg {
  display: block;
}

/* ==========================================================================
   21. Hero — exact gradient spec (Requirement 3.3)
       Layer 1: linear-gradient(var(--lineage-bg) 25%, rgba(48,34,86,0) 100%)
       Layer 2: linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%)
   ========================================================================== */

.lineage-gs__hero {
  background:
    linear-gradient(var(--lineage-bg) 25%, rgba(48, 34, 86, 0) 100%),
    linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%);
}

/* Texture overlay 1 — diagonal hatch (::before already defined above) */
/* Texture overlay 2 — cross-hatch */
.lineage-gs__hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.03) 0px,
    rgba(255, 255, 255, 0.03) 1px,
    transparent 1px,
    transparent 10px
  );
  mix-blend-mode: soft-light;
  pointer-events: none;
}

/* Hero title: Dosis 700, 44px desktop / 28px mobile, white */
.lineage-gs__hero-title {
  font-family: var(--lineage-font-display);
  font-size: 44px;
  font-weight: 700;
  color: var(--lineage-ink);
  line-height: 1.15;
  margin-bottom: 16px;
}

@media (max-width: 768px) {
  .lineage-gs__hero-title {
    font-size: 28px;
  }
}

/* Hero subtitle: Poppins 400, 16px / 13px mobile, rgba(255,255,255,0.75) */
.lineage-gs__hero-subtitle {
  font-family: var(--lineage-font-body);
  font-size: 16px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.75);
  max-width: 560px;
  margin-bottom: 32px;
}

@media (max-width: 768px) {
  .lineage-gs__hero-subtitle {
    font-size: 13px;
  }
}

/* Hero media area: 900px wide, 380px tall, border-radius 20px */
.lineage-gs__hero-media {
  width: 900px;
  max-width: 50%;
  height: 380px;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--lineage-deep-purple), rgba(95, 67, 171, 0.75));
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .lineage-gs__hero-media {
    width: 100%;
    max-width: 100%;
    height: 220px;
  }
}

/* ==========================================================================
   22. Card — image wrap + cover gradient (Requirement 3.4)
       Cover: linear-gradient(135deg, #261A48, rgba(95,67,171,0.75))
       Overlay: linear-gradient(to top, rgba(20,10,40,0.92) 60%, transparent)
   ========================================================================== */

.lineage-gs__card-image-wrap {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, #261A48, rgba(95, 67, 171, 0.75));
  background-size: cover;
  background-position: center;
}

/* Cover gradient sits on top of the background image */
.lineage-gs__card-cover {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #261A48, rgba(95, 67, 171, 0.75));
  opacity: 0.55; /* blends with the image underneath */
}

/* Bottom overlay — stronger at bottom, fades to transparent */
.lineage-gs__card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(20, 10, 40, 0.92) 0%,
    rgba(20, 10, 40, 0.92) 60%,
    transparent 100%
  );
}

/* Card category label: Poppins 600, 8-9px, uppercase, rgba(255,255,255,0.7) */
.lineage-gs__card-category {
  font-family: var(--lineage-font-body);
  font-size: 8px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.7);
  margin: 0 0 4px;
}

/* Card title: Dosis 700, 13-15px, white */
.lineage-gs__card-title {
  font-family: var(--lineage-font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--lineage-ink);
  margin: 0;
  line-height: 1.3;
}

/* ==========================================================================
   23. Section-specific card sizes
   ========================================================================== */

/* Quizzes: slightly larger compact cards, oracle sizing remains separate. */
.lineage-gs__grid--quizzes .lineage-gs__card,
.lineage-gs__card--quiz {
  width: 185px;
  height: 282px;
  aspect-ratio: unset;
  flex: 0 0 185px;
}

@media (max-width: 768px) {
  .lineage-gs__grid--quizzes .lineage-gs__card,
  .lineage-gs__card--quiz {
    width: 132px;
    height: 208px;
    flex: 0 0 132px;
  }
}

/* Healing Frequencies */
.lineage-gs__grid--frequencies .lineage-gs__card,
.lineage-gs__card--audio {
  width: 185px;
  height: 282px;
  aspect-ratio: unset;
  flex: 0 0 185px;
}

/* Reading Room */
.lineage-gs__grid--reading-room .lineage-gs__card,
.lineage-gs__card--guide {
  width: 170px;
  height: 262px;
  aspect-ratio: unset;
  flex: 0 0 170px;
}

/* Remembrance Letters */
.lineage-gs__grid--letters .lineage-gs__card,
.lineage-gs__card--letter {
  width: 130px;
  height: 166px;
  aspect-ratio: unset;
  flex: 0 0 130px;
}

/* Card border-radius: 12-14px (use 14px for standard, 12px for letters) */
.lineage-gs__card {
  border-radius: 14px;
}

.lineage-gs__card--letter {
  border-radius: 12px;
}

/* ==========================================================================
   24. Oracle section layout
   ========================================================================== */

.lineage-gs__oracle-layout {
  display: flex;
  align-items: flex-start;
  gap: 48px;
  flex-wrap: wrap;
}

/* Oracle card: exact 2:3 ratio (220×330px), radius 18px */
.lineage-gs__oracle-scene {
  width: 220px;
  height: 330px;
  aspect-ratio: 2 / 3;
  flex-shrink: 0;
}

.lineage-gs__oracle-card {
  border-radius: 18px;
}

.lineage-gs__oracle-face {
  border-radius: 18px;
}

.lineage-gs__oracle-face-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: linear-gradient(135deg, var(--lineage-deep-purple), rgba(95, 67, 171, 0.75));
}

/* ✦ sparkle symbol on oracle card face */
.lineage-gs__oracle-sparkle {
  font-size: 2rem;
  color: rgba(255, 255, 255, 0.60);
  line-height: 1;
  display: block;
}

.lineage-gs__oracle-tap-hint {
  font-family: var(--lineage-font-body);
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.75);
  text-align: center;
}

/* ✦ symbol in section heading */
.lineage-gs__oracle-symbol {
  color: var(--lineage-accent);
  margin-right: 8px;
  font-size: 0.85em;
  vertical-align: middle;
}

.lineage-gs__oracle-face-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs__oracle-meta {
  flex: 1 1 260px;
  padding-top: 16px;
}

.lineage-gs__oracle-keywords {
  font-family: var(--lineage-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.08em;
  color: var(--lineage-accent);
  margin: 0 0 8px;
}

.lineage-gs__oracle-title {
  font-family: var(--lineage-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 12px;
}

.lineage-gs__oracle-prompt {
  font-size: 0.9375rem;
  color: var(--lineage-ink-light);
  margin: 0 0 24px;
}

@media (max-width: 768px) {
  .lineage-gs__oracle-layout {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .lineage-gs__oracle-meta {
    text-align: center;
  }
}

/* ==========================================================================
   25. Card skeleton loading state
   ========================================================================== */

.lineage-gs__card--skeleton {
  pointer-events: none;
  animation: lineage-skeleton-pulse 1.4s ease-in-out infinite;
  background: linear-gradient(
    135deg,
    rgba(38, 26, 72, 0.12) 0%,
    rgba(95, 67, 171, 0.08) 100%
  );
}

.lineage-gs__card--skeleton .lineage-gs__card-image-wrap,
.lineage-gs__card--skeleton .lineage-gs__card-cover,
.lineage-gs__card--skeleton .lineage-gs__card-overlay,
.lineage-gs__card--skeleton .lineage-gs__card-body,
.lineage-gs__card--skeleton .lineage-gs__badge {
  opacity: 0;
}

@keyframes lineage-skeleton-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}

/* ==========================================================================
   26. Lead strip — submit area and status message
   ========================================================================== */

.lineage-gs__lead-strip-field {
  margin-bottom: 0;
}

.lineage-gs__lead-strip-submit {
  flex-shrink: 0;
  align-self: flex-end;
}

.lineage-gs__lead-strip-status {
  width: 100%;
  font-size: 0.875rem;
  margin-top: 8px;
}

.lineage-gs__lead-strip-status:not(:empty) {
  padding: 8px 12px;
  border-radius: var(--lineage-radius-card);
}

/* ==========================================================================
   21. Lead-Capture Modal Variants (Requirements 17.1–17.6)
   ========================================================================== */

/*
 * The modal is hidden by default. lead-form.js adds the --open modifier
 * class to make it visible and activates the focus trap.
 *
 * The backdrop and dialog are positioned fixed so they cover the viewport
 * regardless of scroll position.
 */

/* Shared modal shell */
.lineage-gs__lead-modal {
  display: none; /* Hidden until JS adds --open */
  position: fixed;
  inset: 0;
  z-index: 9001;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.lineage-gs__lead-modal.lineage-gs__lead-modal--open {
  display: flex;
}

/* Inner card */
.lineage-gs__lead-modal-inner {
  position: relative;
  background: var(--lineage-paper);
  border-radius: var(--lineage-radius-card);
  padding: 40px;
  width: 100%;
  max-width: 480px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(38, 26, 72, 0.30);
  animation: lineage-modal-in 0.25s ease;
}

/* Close button (soft / partial gates only) */
.lineage-gs__lead-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: var(--lineage-ink-faint);
  color: var(--lineage-ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  line-height: 1;
  transition: background var(--lineage-transition), color var(--lineage-transition);
}

.lineage-gs__lead-modal-close:hover,
.lineage-gs__lead-modal-close:focus-visible {
  background: var(--lineage-accent-faint);
  color: var(--lineage-accent);
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
}

/* Modal header */
.lineage-gs__lead-modal-header {
  margin-bottom: 24px;
}

.lineage-gs__lead-modal-title {
  font-family: var(--lineage-font-display);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--lineage-deep-purple);
  margin: 0 0 8px;
}

.lineage-gs__lead-modal-desc {
  font-size: 0.9375rem;
  color: var(--lineage-ink-light);
  margin: 0;
}

/* Hard gate: no close button, slightly more prominent header */
.lineage-gs__lead-modal--hard-gate .lineage-gs__lead-modal-inner {
  padding-top: 48px;
}

/* Required field asterisk */
.lineage-gs__required {
  color: var(--lineage-warm);
  margin-left: 2px;
}

/* Field error message (aria-live assertive) */
.lineage-gs__field-error {
  background: #FEE2E2;
  color: #991B1B;
  border: 1px solid #FECACA;
  border-radius: 6px;
  padding: 10px 14px;
  font-size: 0.875rem;
  margin-bottom: 12px;
}

.lineage-gs__field-error[hidden] {
  display: none;
}

/* Privacy note */
.lineage-gs__privacy-note {
  font-size: 0.75rem;
  color: var(--lineage-ink-light);
  text-align: center;
  margin: 12px 0 0;
}

/* Submit button busy state */
.lineage-gs__lead-submit[aria-busy="true"] {
  opacity: 0.7;
  cursor: not-allowed;
}

@media (max-width: 480px) {
  .lineage-gs__lead-modal-inner {
    padding: 28px 20px;
  }
}

/* ==========================================================================
   22. Inline Lead-Gen Form with Avatar (Requirements 5.12, 17.4)
   ========================================================================== */

.lineage-gs__lead-inline {
  background: linear-gradient(
    135deg,
    var(--lineage-deep-purple) 0%,
    var(--lineage-accent) 100%
  );
  border-radius: var(--lineage-radius-card);
  padding: 40px 48px;
  margin: 48px 0;
}

.lineage-gs__lead-inline-wrap {
  display: flex;
  align-items: flex-start;
  gap: 32px;
  flex-wrap: wrap;
}

/* Avatar + copy block */
.lineage-gs__lead-inline-brand {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 0 0 auto;
  max-width: 280px;
}

/* 56px circle avatar */
.lineage-gs__lead-inline-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid rgba(255, 255, 255, 0.35);
}

/* Placeholder avatar when no image URL is provided */
.lineage-gs__lead-inline-avatar--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.15);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-display);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.lineage-gs__lead-inline-copy {
  flex: 1 1 auto;
}

.lineage-gs__lead-inline-heading {
  font-family: var(--lineage-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--lineage-ink);
  margin: 0 0 6px;
}

.lineage-gs__lead-inline-subheading {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.80);
  margin: 0;
}

/* Form area */
.lineage-gs__lead-inline-form-area {
  flex: 1 1 320px;
}

/* Inline fields row */
.lineage-gs__lead-inline-fields {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
}

.lineage-gs__field--inline {
  flex: 1 1 160px;
  margin-bottom: 0;
}

.lineage-gs__field--inline .lineage-gs__label {
  color: rgba(255, 255, 255, 0.90);
  font-size: 0.8125rem;
}

.lineage-gs__field--inline .lineage-gs__input {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.30);
  color: var(--lineage-ink);
}

.lineage-gs__field--inline .lineage-gs__input::placeholder {
  color: rgba(255, 255, 255, 0.50);
}

.lineage-gs__field--inline .lineage-gs__input:focus {
  border-color: rgba(255, 255, 255, 0.80);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.20);
  outline: none;
}

/* Submit button column */
.lineage-gs__field--submit {
  flex: 0 0 auto;
}

/* Inline form privacy note */
.lineage-gs__lead-inline .lineage-gs__privacy-note {
  color: rgba(255, 255, 255, 0.55);
  margin-top: 10px;
  text-align: left;
}

/* Inline form error */
.lineage-gs__lead-inline .lineage-gs__field-error {
  margin-top: 10px;
  margin-bottom: 0;
}

/* Success message (replaces form in-place) */
.lineage-gs__lead-inline-success {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 0;
}

.lineage-gs__lead-inline-success[hidden] {
  display: none;
}

.lineage-gs__lead-inline-success-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.20);
  color: var(--lineage-ink);
  font-size: 1.25rem;
  flex-shrink: 0;
}

.lineage-gs__lead-inline-success-text {
  font-size: 1rem;
  font-weight: 600;
  color: var(--lineage-ink);
  margin: 0;
}

/* Dismiss button */
.lineage-gs__lead-inline-dismiss {
  margin-top: 12px;
  text-align: center;
}

.lineage-gs__lead-dismiss-btn {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.60);
  font-size: 0.8125rem;
  cursor: pointer;
  padding: 4px 8px;
  text-decoration: underline;
  transition: color var(--lineage-transition);
}

.lineage-gs__lead-dismiss-btn:hover,
.lineage-gs__lead-dismiss-btn:focus-visible {
  color: var(--lineage-ink);
  outline: 2px solid rgba(255, 255, 255, 0.70);
  outline-offset: 2px;
  border-radius: 4px;
}

@media (max-width: 768px) {
  .lineage-gs__lead-inline {
    padding: 28px 24px;
  }

  .lineage-gs__lead-inline-wrap {
    flex-direction: column;
    gap: 20px;
  }

  .lineage-gs__lead-inline-brand {
    max-width: 100%;
  }

  .lineage-gs__lead-inline-fields {
    flex-direction: column;
  }

  .lineage-gs__field--inline {
    flex: 1 1 auto;
    width: 100%;
  }

  .lineage-gs__field--submit {
    width: 100%;
  }

  .lineage-gs__field--submit .lineage-gs__btn {
    width: 100%;
  }
}

/* ==========================================================================
   23. WCAG AA Focus Styles (Requirements 3.10, 17.5, 17.6)
   ========================================================================== */

/*
 * Focus ring colour: #5F43AB (accent purple) on white background.
 * Contrast ratio: #5F43AB on var(--lineage-ink) = 5.74:1 — exceeds WCAG AA 4.5:1 for
 * normal text and 3:1 for large text / UI components.
 *
 * The 3px outline + 2px offset creates a visible gap between the element
 * border and the focus ring, improving visibility on all backgrounds.
 */

/* Lead form inputs */
.lineage-gs__lead-form .lineage-gs__input:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
  border-color: var(--lineage-accent);
  box-shadow: 0 0 0 4px rgba(95, 67, 171, 0.18);
  border-radius: var(--lineage-radius-pill);
}

/* Lead form submit button */
.lineage-gs__lead-submit:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 3px;
  border-radius: var(--lineage-radius-pill);
  box-shadow: 0 0 0 5px rgba(95, 67, 171, 0.20);
}

/* Modal close button */
.lineage-gs__lead-modal-close:focus-visible {
  outline: 3px solid var(--lineage-accent);
  outline-offset: 2px;
  border-radius: 50%;
}

/*
 * On the dark inline strip the accent purple (#5F43AB) on the dark gradient
 * background (#261A48) gives a contrast of ~2.5:1 which is insufficient.
 * Use white (var(--lineage-ink)) for focus rings on dark backgrounds instead.
 * White on #261A48 = 14.7:1 — well above WCAG AA.
 */
.lineage-gs__lead-inline .lineage-gs__input:focus-visible {
  outline: 3px solid var(--lineage-ink);
  outline-offset: 2px;
  border-color: rgba(255, 255, 255, 0.80);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.18);
}

.lineage-gs__lead-inline .lineage-gs__lead-submit:focus-visible {
  outline: 3px solid var(--lineage-ink);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.20);
}

/* ==========================================================================
   28. Main Hero Dynamic Layout
   ========================================================================== */

.lineage-gs[data-page="main"] .lineage-gs__hero {
  padding: 0 0 48px;
}

.lineage-gs[data-page="main"] .lineage-gs__hero::before {
  background-image: repeating-linear-gradient(45deg, rgba(255,255,255,0.03), rgba(255,255,255,0.03) 2px, transparent 2px, transparent 16px);
}

.lineage-gs[data-page="main"] .lineage-gs__hero::after {
  background-image: repeating-linear-gradient(-45deg, rgba(255,255,255,0.03), rgba(255,255,255,0.03) 2px, transparent 2px, transparent 16px);
}

.lineage-gs[data-page="main"] .lineage-gs__hero-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  max-width: none;
  padding: 0;
  text-align: center;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding-top: 80px;
  width: 100%;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-title {
  max-width: 660px;
  margin: 0;
  font-size: 44px;
  line-height: 1.15;
  color: var(--lineage-ink);
  text-align: center;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-subtitle {
  max-width: 500px;
  margin: 0;
  font-size: 16px;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.75);
  text-align: center;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-actions .lineage-gs__btn {
  padding: 14px 40px;
  border-radius: 500px;
  font-family: var(--lineage-font-display);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  box-shadow: rgba(0, 0, 0, 0.2) 0 20px 28px;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-actions .lineage-gs__btn--primary {
  background: var(--lineage-accent);
  border-color: var(--lineage-accent);
  color: var(--lineage-paper);
}

.lineage-gs[data-page="main"] .lineage-gs__hero-actions .lineage-gs__btn--secondary {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.34);
  color: var(--lineage-ink);
}

.lineage-gs[data-page="main"] .lineage-gs__hero-media {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  width: 900px;
  max-width: calc(100% - 96px);
  height: 380px;
  margin: 40px auto 0;
  border-radius: 20px;
  overflow: hidden;
  border: 1.5px solid rgba(255, 255, 255, 0.15);
  background: repeating-linear-gradient(45deg, rgba(38, 26, 72, 0.15), rgba(38, 26, 72, 0.15) 1px, transparent 1px, transparent 10px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-media picture,
.lineage-gs[data-page="main"] .lineage-gs__hero-video-trigger,
.lineage-gs[data-page="main"] .lineage-gs__hero-player,
.lineage-gs[data-page="main"] .lineage-gs__hero-player iframe,
.lineage-gs[data-page="main"] .lineage-gs__hero-player video {
  display: block;
  width: 100%;
  height: 100%;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-video-trigger {
  position: relative;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-media-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-media-placeholder {
  position: absolute;
  inset: 0;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: rgba(255, 255, 255, 0.15);
  border: 2px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-play span {
  width: 0;
  height: 0;
  margin-left: 3px;
  border-left: 14px solid rgba(255, 255, 255, 0.6);
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
}

.lineage-gs[data-page="main"] .lineage-gs__hero-player iframe,
.lineage-gs[data-page="main"] .lineage-gs__hero-player video {
  border: 0;
  object-fit: cover;
}

@media (max-width: 768px) {
  .lineage-gs[data-page="main"] .lineage-gs__hero {
    padding-bottom: 24px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-content {
    gap: 12px;
    padding: 48px 24px 0;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-title {
    max-width: none;
    font-size: 28px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-subtitle {
    max-width: none;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-actions .lineage-gs__btn {
    padding: 6px 14px;
    font-size: 13px;
    box-shadow: rgba(0, 0, 0, 0.2) 0 12px 20px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-media {
    width: auto;
    max-width: none;
    height: 180px;
    margin: 20px 24px 0;
    border-radius: 14px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-play {
    width: 40px;
    height: 40px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-play span {
    margin-left: 2px;
    border-left-width: 10px;
    border-top-width: 6px;
    border-bottom-width: 6px;
  }
}

/* Quiz section overrides must remain after legacy card rules. */
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes { padding: 40px 0; }
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-header { margin-bottom: 20px; }
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-title { font-family: var(--lineage-font-display); font-size: 24px; font-weight: 700; color: var(--lineage-ink); line-height: 1.3; margin: 4px 0 0; }
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes { gap: 14px; overflow-x: hidden; }
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex: 0 0 185px; width: 185px; height: 282px; min-width: 185px; border-radius: 14px; background: linear-gradient(var(--lineage-accent-faint) 0%, var(--lineage-paper) 100%); border: 1.5px solid var(--lineage-ink-light); box-shadow: none; transform: none; text-decoration: none; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover { position: relative; inset: auto; flex: 1 1 0%; min-height: 130px; background: repeating-linear-gradient(45deg, var(--lineage-ink-light), var(--lineage-ink-light) 1px, transparent 1px, transparent 8px); opacity: 1; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img { position: static; inset: auto; width: 100%; height: 100%; min-height: 130px; object-fit: cover; display: block; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-body { position: static; padding: 12px 14px 14px; }
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title { font-family: var(--lineage-font-display); font-size: 13px; font-weight: 700; color: var(--lineage-ink); line-height: 1.2; margin-top: 4px; }

@media (max-width: 768px) {
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes { padding: 24px 0; }
  .lineage-gs[data-page="main"] .lineage-gs__section--quizzes .lineage-gs__section-title { font-size: 20px; }
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes { gap: 10px; margin-top: 16px; }
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex-basis: 132px; width: 132px; min-width: 132px; height: 208px; border-radius: 12px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img { min-height: 90px; height: 90px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-body { padding: 8px 10px 10px; }
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title { font-size: 11px; margin-top: 2px; }
}

/* Final quiz page overrides, after legacy card rules. */
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes { display: flex; gap: 14px; align-items: flex-start; overflow-x: hidden; padding: 40px 0; }
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex: 0 0 185px; width: 185px; height: 282px; min-width: 185px; border-radius: 14px; background: linear-gradient(var(--lineage-accent-faint) 0%, var(--lineage-paper) 100%); border: 1.5px solid var(--lineage-ink-light); text-decoration: none; overflow: hidden; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover { position: relative; inset: auto; min-height: 130px; background: repeating-linear-gradient(45deg, var(--lineage-ink-light), var(--lineage-ink-light) 1px, transparent 1px, transparent 8px); opacity: 1; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img { position: static; inset: auto; width: 100%; height: 130px; object-fit: cover; display: block; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-body { position: static; padding: 12px 14px 14px; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title { font-family: var(--lineage-font-display); font-size: 13px; font-weight: 700; color: var(--lineage-ink); line-height: 1.2; margin: 4px 0 0; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cat { display: block; font-family: var(--lineage-font-body); font-size: 9px; font-weight: 600; color: var(--lineage-accent); line-height: 1.3; text-transform: none; letter-spacing: 0.05em; }
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-meta { font-family: var(--lineage-font-display); font-size: 9px; font-weight: 400; color: var(--lineage-ink-light); line-height: 1.3; margin: 6px 0 0; }
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title { font-size: 44px; max-width: 760px; overflow-wrap: anywhere; }

@media (max-width: 768px) {
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes { gap: 10px; padding: 24px 0; }
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz { flex-basis: 132px; width: 132px; min-width: 132px; height: 208px; border-radius: 12px; }
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img { min-height: 90px; height: 90px; }
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-body { padding: 8px 10px 10px; }
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title { font-size: 11px; margin-top: 2px; }
  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title { font-size: 28px; }
}

/* Dedicated quiz page must match the supplied reference shell instead of theme layout. */
body.lineage-gs-standalone-template {
  margin: 0;
  background: var(--lineage-bg);
}

body.lineage-gs-standalone-template .lineage-gs[data-page="single-quiz"] {
  width: 100%;
  min-height: 100vh;
  background: var(--lineage-bg);
  color: var(--lineage-ink);
  font-family: var(--lineage-font-display);
  overflow-x: hidden;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-header {
  height: 56px;
  padding: 0 40px;
  background: var(--lineage-bg);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-brand {
  font-family: var(--lineage-font-body);
  font-size: 16px;
  font-weight: 700;
  color: var(--lineage-paper);
  line-height: 1.3;
  text-decoration: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-nav {
  display: flex;
  align-items: center;
  gap: 12px;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-nav a {
  font-family: var(--lineage-font-body);
  font-size: 11px;
  font-weight: 400;
  color: var(--lineage-ink-light);
  line-height: 1.3;
  text-decoration: none;
  padding-bottom: 2px;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-nav a.is-active {
  font-weight: 700;
  color: var(--lineage-warm);
  border-bottom: 2px solid var(--lineage-warm);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-menu {
  display: none;
  width: 24px;
  padding: 0;
  border: 0;
  background: transparent;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-menu span {
  display: block;
  height: 2px;
  margin: 4px 0;
  border-radius: 1px;
  background: rgba(255,255,255,0.6);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__reference-menu span:last-child {
  width: 14px;
  margin-left: auto;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
  position: relative;
  overflow: hidden;
  display: block;
  padding: 80px 48px 48px;
  background:
    linear-gradient(var(--lineage-bg) 25%, rgba(48,34,86,0) 100%),
    linear-gradient(var(--lineage-warm) 23%, var(--lineage-paper) 98%);
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-pattern {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(45deg, rgba(255,255,255,0.03), rgba(255,255,255,0.03) 2px, transparent 2px, transparent 16px);
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-pattern--reverse {
  background: repeating-linear-gradient(-45deg, rgba(255,255,255,0.03), rgba(255,255,255,0.03) 2px, transparent 2px, transparent 16px);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 760px;
  margin: 0 auto;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-kicker {
  font-family: var(--lineage-font-body);
  font-size: 11px;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0.08em;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title {
  max-width: 760px;
  margin: 0;
  font-family: var(--lineage-font-display);
  font-size: 44px;
  font-weight: 700;
  color: var(--lineage-paper);
  line-height: 1.15;
  text-align: center;
  overflow-wrap: anywhere;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-subtitle {
  max-width: 560px;
  margin: 0;
  font-family: var(--lineage-font-body);
  font-size: 16px;
  font-weight: 400;
  color: rgba(255,255,255,0.75);
  line-height: 1.3;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--lineage-font-body);
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,0.72);
  line-height: 1.3;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-meta span + span::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  margin: 0 10px 2px 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 40px;
  border: 0;
  border-radius: 500px;
  background: var(--lineage-accent);
  box-shadow: rgba(0,0,0,0.2) 0 20px 28px;
  color: var(--lineage-paper);
  cursor: pointer;
  font-family: var(--lineage-font-display);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  text-transform: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media {
  position: relative;
  z-index: 2;
  width: 900px;
  max-width: 100%;
  height: 380px;
  margin: 40px auto 0;
  border-radius: 20px;
  overflow: hidden;
  border: 1.5px solid rgba(255,255,255,0.15);
  background: repeating-linear-gradient(45deg, rgba(38,26,72,0.15), rgba(38,26,72,0.15) 1px, transparent 1px, transparent 10px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media picture,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media img {
  display: block;
  width: 100%;
  height: 100%;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media img {
  object-fit: cover;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media span {
  font-family: var(--lineage-font-body);
  font-size: 14px;
  font-weight: 400;
  color: rgba(255,255,255,0.4);
  line-height: 1.3;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro {
  padding: 32px 48px 0;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro p {
  max-width: 760px;
  margin: 0 auto;
  font-family: var(--lineage-font-display);
  font-size: 16px;
  font-weight: 400;
  color: var(--lineage-ink-light);
  line-height: 1.5;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-stage {
  width: min(920px, calc(100% - 96px));
  max-width: 920px;
  margin: 0 auto;
  padding: 40px 0 64px;
}

@media (max-width: 768px) {
  .lineage-gs[data-page="single-quiz"] .lineage-gs__reference-header {
    height: 48px;
    padding: 0 16px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__reference-brand {
    font-size: 14px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__reference-nav {
    display: none;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__reference-menu {
    display: block;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
    padding: 48px 24px 24px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-copy {
    gap: 12px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title {
    font-size: 28px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-subtitle {
    font-size: 13px;
    color: rgba(255,255,255,0.7);
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-meta {
    font-size: 11px;
    gap: 8px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-cta {
    min-height: 32px;
    padding: 6px 14px;
    font-size: 13px;
    box-shadow: rgba(0,0,0,0.2) 0 12px 20px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media {
    height: 180px;
    margin-top: 20px;
    border-radius: 14px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media span {
    font-size: 11px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro {
    padding: 24px 24px 0;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-intro p {
    font-size: 13px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-stage {
    width: calc(100% - 48px);
    padding: 24px 0 48px;
  }
}

/* Reference quiz question experience. */
.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-shell {
  width: 100%;
  padding: 30px 32px 32px;
  border-radius: 14px;
  background: var(--lineage-paper);
  border: 1.5px solid var(--lineage-ink-light);
  box-shadow: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-header {
  display: block;
  margin: 0 0 28px;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-title {
  margin: 0 0 20px;
  font-family: var(--lineage-font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--lineage-ink);
  line-height: 1.3;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-progress-wrap {
  position: relative;
  height: 34px;
  padding-top: 24px;
  border: 0;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-progress-wrap::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 6px;
  border-radius: 40px;
  background: rgb(221,221,221);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-progress-bar {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 6px;
  border-radius: 40px;
  background: linear-gradient(90deg, var(--lineage-accent), var(--lineage-warm));
  transition: width 0.3s ease;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-progress-text {
  position: absolute;
  inset: 0 auto auto 0;
  font-family: var(--lineage-font-body);
  font-size: 11px;
  font-weight: 600;
  color: var(--lineage-ink-light);
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0.08em;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-area {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-area--exiting {
  opacity: 0;
  transform: translateY(8px);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-area--entering {
  opacity: 1;
  transform: translateY(0);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question {
  margin: 0;
  animation: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-text {
  max-width: 640px;
  margin: 0 auto 24px;
  font-family: var(--lineage-font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--lineage-bg);
  line-height: 1.3;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-item {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-item::marker {
  content: "";
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn {
  width: 100%;
  min-height: 62px;
  padding: 13px 18px;
  border-radius: 14px;
  border: 1.5px solid var(--lineage-ink-light);
  background: linear-gradient(var(--lineage-accent-faint) 0%, var(--lineage-paper) 100%);
  color: var(--lineage-ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  font-family: var(--lineage-font-display);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn:hover,
.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn:focus-visible {
  border-color: var(--lineage-accent);
  background: var(--lineage-accent-faint);
  color: var(--lineage-ink);
  box-shadow: rgba(38,26,72,0.12) 0 10px 24px;
  outline: none;
  transform: translateY(-1px);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn--selected {
  border-color: var(--lineage-accent);
  background: var(--lineage-accent);
  color: var(--lineage-paper);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn--selected:hover,
.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn--selected:focus-visible {
  background: var(--lineage-accent);
  color: var(--lineage-paper);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn span {
  color: inherit;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-image {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  overflow: hidden;
  flex: 0 0 40px;
  background: rgba(38,26,72,0.08);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-error {
  margin: 16px 0 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--lineage-warm-faint);
  color: rgb(196,69,32);
  font-family: var(--lineage-font-body);
  font-size: 13px;
  line-height: 1.4;
  text-align: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 22px;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-nav {
  min-width: 104px;
  min-height: 38px;
  padding: 8px 18px;
  border-radius: 40px;
  border: 1.5px solid var(--lineage-ink-light);
  background: var(--lineage-paper);
  color: var(--lineage-ink);
  cursor: pointer;
  font-family: var(--lineage-font-display);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-next {
  border-color: var(--lineage-accent);
  background: var(--lineage-accent);
  color: var(--lineage-paper);
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-nav:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}

@media (max-width: 768px) {
  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-shell {
    padding: 24px 18px;
    border-radius: 14px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-header {
    margin-bottom: 20px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-title {
    font-size: 20px;
    margin-bottom: 16px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-text {
    font-size: 20px;
    margin-bottom: 18px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-options {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-option-btn {
    min-height: 56px;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 13px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-actions {
    margin-top: 16px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-nav {
    min-width: 92px;
    min-height: 34px;
    padding: 7px 14px;
    font-size: 13px;
  }
}
.lineage-gs__frequency-player {
  width: min(980px, calc(100% - 48px));
  margin: 0 auto 32px;
  padding: 24px;
  border: 1px solid rgba(38, 26, 72, 0.16);
  border-radius: 18px;
  background: var(--lineage-paper);
  box-shadow: 0 18px 48px rgba(38, 26, 72, 0.12);
}

.lineage-gs__frequency-player-head {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 18px;
}

.lineage-gs__frequency-player-img {
  width: 84px;
  height: 84px;
  flex: 0 0 84px;
  border-radius: 14px;
  object-fit: cover;
  background: #ede9fb;
}

.lineage-gs__frequency-player-img--placeholder {
  background: repeating-linear-gradient(45deg, #e5e0ef, #e5e0ef 1px, #f7f4fb 1px, #f7f4fb 8px);
}

.lineage-gs__frequency-player-kicker {
  margin: 0 0 4px;
  font-family: var(--lineage-font-body);
  font-size: 11px;
  font-weight: 700;
  color: #8d22c3;
  letter-spacing: 0.08em;
  text-transform: none;
}

.lineage-gs__frequency-player-title {
  margin: 0;
  font-family: var(--lineage-font-display);
  font-size: 24px;
  line-height: 1.15;
  color: #261a48;
}

.lineage-gs__frequency-player-meta {
  margin: 6px 0 0;
  font-family: var(--lineage-font-body);
  font-size: 14px;
  color: #666;
}

.lineage-gs__frequency-player-embed iframe,
.lineage-gs__frequency-player-embed audio {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 12px;
}

@media (max-width: 768px) {
  .lineage-gs__frequency-player {
    width: calc(100% - 32px);
    padding: 18px;
  }

  .lineage-gs__frequency-player-head {
    align-items: flex-start;
    gap: 14px;
  }

  .lineage-gs__frequency-player-img {
    width: 64px;
    height: 64px;
    flex-basis: 64px;
  }

  .lineage-gs__frequency-player-title {
    font-size: 20px;
  }
}

/* Oracle single card detail page */
.lineage-gs[data-page="single-oracle"] {
  background: #fff8f1;
  color: #2d183f;
  min-height: 100vh;
}

.lineage-gs__oracle-detail-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: 48px;
  align-items: center;
  padding: 72px min(6vw, 72px);
  overflow: hidden;
  background:
    linear-gradient(var(--lineage-bg) 18%, rgba(48, 34, 86, 0.12) 100%),
    linear-gradient(145deg, var(--lineage-warm) 0%, #fff8f1 92%);
}

.lineage-gs__oracle-detail-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.045) 1px, transparent 1px, transparent 12px),
    radial-gradient(circle at 78% 28%, rgba(246, 184, 46, 0.18), transparent 34%);
  pointer-events: none;
}

.lineage-gs__oracle-detail-copy,
.lineage-gs__oracle-detail-card {
  position: relative;
  z-index: 1;
}

.lineage-gs__oracle-detail-back {
  display: inline-flex;
  color: rgba(255, 255, 255, 0.82);
  font-family: var(--lineage-font-body);
  font-size: 0.9rem;
  font-weight: 600;
  margin-bottom: 26px;
  text-decoration: none;
}

.lineage-gs__oracle-detail-back:hover,
.lineage-gs__oracle-detail-back:focus-visible {
  color: var(--lineage-ink);
  text-decoration: underline;
}

.lineage-gs__oracle-detail-kicker {
  color: #f9dca4;
  font-family: var(--lineage-font-body);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  margin: 0 0 14px;
  text-transform: none;
}

.lineage-gs__oracle-detail-title {
  color: #fffaf0;
  font-family: var(--lineage-font-display);
  font-size: clamp(2.8rem, 7vw, 6rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 0.95;
  margin: 0;
  max-width: 820px;
  overflow-wrap: anywhere;
  text-shadow: 0 10px 38px rgba(0, 0, 0, 0.28);
}

.lineage-gs__oracle-detail-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.lineage-gs__oracle-detail-keywords span {
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  color: #fffaf0;
  font-family: var(--lineage-font-body);
  font-size: 0.84rem;
  font-weight: 600;
  padding: 8px 13px;
}

.lineage-gs__oracle-detail-card {
  justify-self: center;
  width: min(360px, 78vw);
  aspect-ratio: 220 / 340;
  border: 2px solid rgba(246, 184, 46, 0.48);
  border-radius: 22px;
  overflow: hidden;
  background: #17102c;
  box-shadow:
    0 30px 76px rgba(0, 0, 0, 0.36),
    0 0 54px rgba(246, 184, 46, 0.22);
}

.lineage-gs__oracle-detail-card img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.lineage-gs__oracle-detail-card span {
  align-items: center;
  color: rgba(255, 255, 255, 0.78);
  display: flex;
  font-family: var(--lineage-font-body);
  height: 100%;
  justify-content: center;
  padding: 24px;
  text-align: center;
}

.lineage-gs__oracle-detail-reading {
  margin: 0 auto;
  max-width: 920px;
  padding: 56px 24px 80px;
}

.lineage-gs__oracle-detail-reading h2 {
  color: #3d255f;
  font-family: var(--lineage-font-display);
  font-size: clamp(2rem, 5vw, 3.4rem);
  font-weight: 600;
  line-height: 1;
  margin: 0 0 22px;
}

.lineage-gs__oracle-detail-body {
  color: #4b3b5a;
  font-family: var(--lineage-font-body);
  font-size: 1.04rem;
  line-height: 1.8;
}

.lineage-gs__oracle-detail-body p {
  margin: 0 0 1.2em;
}

@media (max-width: 800px) {
  .lineage-gs__oracle-detail-hero {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 48px 22px;
    text-align: center;
  }

  .lineage-gs__oracle-detail-keywords {
    justify-content: center;
  }

  .lineage-gs__oracle-detail-card {
    width: min(310px, 82vw);
  }

  .lineage-gs__oracle-detail-reading {
    padding: 42px 22px 64px;
  }
}

/* Shared slider behavior for any section with more than five cards */
.lineage-gs .lineage-gs__grid.is-slider {
  display: flex !important;
  flex-wrap: nowrap;
  gap: var(--lineage-gap);
  overflow-x: auto !important;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding-bottom: 12px;
}

.lineage-gs .lineage-gs__grid.is-slider .lineage-gs__card {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.lineage-gs[data-page="main"] .lineage-gs__grid.is-slider {
  padding-inline: 2px;
}

.lineage-gs__section--letters .lineage-gs__grid--letters {
  justify-content: center;
}

.lineage-gs__lead-bottom {
  padding-bottom: 56px;
}

@media (max-width: 768px) {
  .lineage-gs .lineage-gs__grid.is-slider {
    gap: 12px;
    padding-bottom: 14px;
  }

  .lineage-gs__section--letters .lineage-gs__grid--letters {
    justify-content: flex-start;
  }

  .lineage-gs__lead-bottom {
    padding-bottom: 36px;
  }
}

/* Final requested behavior: theme fonts, no subpage banners, full-image cards, mobile containment. */
.lineage-gs {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  font-family: inherit;
}

.lineage-gs :where(h1, h2, h3, h4, h5, h6, p, a, button, input, textarea, select, span) {
  font-family: inherit;
}

.lineage-gs__subpage-header {
  padding: 28px 48px 22px;
  background: var(--lineage-paper);
  border-bottom: 1px solid var(--lineage-ink-faint);
}

.lineage-gs__subpage-header .lineage-gs__breadcrumb {
  margin-bottom: 10px;
}

.lineage-gs__subpage-header .lineage-gs__breadcrumb li,
.lineage-gs__subpage-header .lineage-gs__breadcrumb a,
.lineage-gs__subpage-header .lineage-gs__breadcrumb [aria-current='page'] {
  color: var(--lineage-ink-light);
}

.lineage-gs__subpage-title {
  margin: 0 0 8px;
  color: var(--lineage-deep-purple);
  font-size: 32px;
  line-height: 1.15;
  font-weight: 700;
}

.lineage-gs__subpage-subtitle {
  max-width: 680px;
  margin: 0;
  color: var(--lineage-ink-light);
  font-size: 16px;
  line-height: 1.45;
}

.lineage-gs__card--quiz,
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
  position: relative;
  aspect-ratio: 3 / 4;
  height: auto;
  border: 0;
  border-radius: var(--lineage-radius-card);
  background: var(--lineage-deep-purple);
  overflow: hidden;
  color: var(--lineage-paper);
}

.lineage-gs__card--quiz .lineage-gs__card-cover,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  flex: 1 1 auto;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
  opacity: 1;
  overflow: hidden;
}

.lineage-gs__card--quiz .lineage-gs__card-img,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  display: block;
}

.lineage-gs__card--quiz .lineage-gs__card-img--placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
}

.lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before {
  content: "";
  display: none;
}

.lineage-gs__card--quiz .lineage-gs__card-body {
  display: none;
}

.lineage-gs__card--quiz .lineage-gs__card-overlay,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-overlay,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-overlay {
  position: absolute;
  inset: auto 0 0;
  z-index: 1;
  display: block;
  padding: 14px;
  background: linear-gradient(to top, rgba(38, 26, 72, 0.92) 0%, transparent 100%);
}

.lineage-gs__card--quiz .lineage-gs__card-title,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title {
  margin: 0 0 3px;
  color: var(--lineage-ink);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 700;
}

.lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs__card--quiz .lineage-gs__card-meta,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-meta {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  line-height: 1.3;
}

.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes,
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes {
  overflow-x: auto;
}

.lineage-gs .lineage-gs__grid.is-slider {
  max-width: 100%;
}

.lineage-gs .lineage-gs__grid.is-slider .lineage-gs__card {
  flex: 0 0 220px;
  width: 220px;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
  display: block;
  padding: 36px 48px 24px;
  background: var(--lineage-paper);
  text-align: left;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-pattern,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media {
  display: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-subtitle,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-description,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-meta {
  color: var(--lineage-deep-purple);
}

@media (max-width: 768px) {
  .lineage-gs {
    margin-top: 0;
    overflow-x: hidden;
  }

  .lineage-gs__container,
  .lineage-gs__hero-inner {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lineage-gs__subpage-header {
    padding: 22px 16px 18px;
  }

  .lineage-gs__subpage-title {
    font-size: 26px;
  }

  .lineage-gs__subpage-subtitle {
    font-size: 14px;
  }

  .lineage-gs__filter-bar,
  .lineage-gs__grid--quizzes,
  .lineage-gs__grid--audio,
  .lineage-gs__grid--reading,
  .lineage-gs__grid--letters {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lineage-gs .lineage-gs__grid.is-slider .lineage-gs__card,
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
    flex-basis: 160px;
    width: 160px;
    min-width: 160px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
    height: 100%;
    min-height: 0;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
    padding: 24px 16px 18px;
    text-align: left;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-stage {
    padding: 18px 16px 32px;
  }
}

/* Mobile width guard: prevents right-side blank space from transformed cards and theme wrappers. */
@media (max-width: 768px) {
  html:has(.lineage-gs),
  body:has(.lineage-gs) {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .lineage-gs,
  .lineage-gs__subpage,
  .lineage-gs__section,
  .lineage-gs__container,
  .lineage-gs main {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }

  .lineage-gs__container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lineage-gs__grid {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lineage-gs__grid--scroll,
  .lineage-gs .lineage-gs__grid.is-slider {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto !important;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    padding-left: 0;
    padding-right: 0;
  }

  .lineage-gs__category-nav,
  .lineage-gs__filter-tabs {
    max-width: 100%;
    min-width: 0;
  }

  .lineage-gs[data-page="main"] .lineage-gs__hero-media {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .oracle-spread__wrapper,
  .oracle-spread__stage {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  .oracle-spread__ambient-light {
    display: none;
  }
}



/* Hard mobile full-bleed pass: overrides theme content padding and old fixed-width rules. */
@media (max-width: 768px) {
  .lineage-gs {
    position: relative;
    left: 50%;
    right: 50%;
    width: 100vw;
    max-width: 100vw;
    margin-left: -50vw;
    margin-right: -50vw;
    overflow-x: hidden;
  }

  .lineage-gs__section,
  .lineage-gs__subpage,
  .lineage-gs__hero,
  .lineage-gs__hero-inner,
  .lineage-gs__hero-content,
  .lineage-gs__subpage-header,
  .lineage-gs__filter-bar,
  .lineage-gs__single-quiz-hero,
  .lineage-gs__single-quiz-stage,
  .lineage-gs__oracle-detail-hero,
  .lineage-gs__oracle-detail-reading,
  .oracle-spread__wrapper {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }

  .lineage-gs__section,
  .lineage-gs__subpage {
    overflow-x: hidden;
  }

  .lineage-gs__section-header {
    gap: 12px;
    min-width: 0;
  }

  .lineage-gs__section-title,
  .lineage-gs__section-description,
  .lineage-gs__subpage-title,
  .lineage-gs__subpage-subtitle,
  .lineage-gs__single-quiz-title,
  .lineage-gs__single-quiz-subtitle {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .lineage-gs__grid:not(.lineage-gs__grid--scroll):not(.is-slider) {
    width: 100%;
    max-width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lineage-gs__grid--scroll,
  .lineage-gs .lineage-gs__grid.is-slider {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    scroll-padding-left: 0;
    scroll-padding-right: 0;
  }

  .lineage-gs__card,
  .lineage-gs__card--audio,
  .lineage-gs__card--reading,
  .lineage-gs__card--letter {
    max-width: 100%;
  }

  .lineage-gs__lead-bottom,
  .lineage-gs__lead-inline,
  .lineage-gs__frequency-player {
    width: calc(100% - 32px);
    max-width: calc(100% - 32px);
    margin-left: 16px;
    margin-right: 16px;
    box-sizing: border-box;
  }

  .lineage-gs__frequency-player-head {
    min-width: 0;
  }

  .lineage-gs__frequency-player-title,
  .lineage-gs__frequency-player-meta {
    overflow-wrap: anywhere;
  }
}



/* Final layout refinements: header clearance, larger cards, inline letters. */
.lineage-gs {
  margin-top: 28px;
}

.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
.lineage-gs[data-page="main"] .lineage-gs__card--audio,
.lineage-gs[data-page="main"] .lineage-gs__card--reading,
.lineage-gs[data-page="main"] .lineage-gs__card--guide {
  flex: 0 0 220px;
  width: 220px;
  min-width: 220px;
  height: 330px;
}

.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before {
  min-height: 160px;
  height: 160px;
}

.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title {
  font-size: 16px;
}

.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta {
  font-size: 10px;
}

.lineage-gs__section--letters .lineage-gs__grid--letters {
  display: flex;
  justify-content: center;
  overflow: visible;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured {
  position: relative;
  flex: 0 1 min(360px, 78vw);
  width: min(360px, 78vw);
  min-width: 0;
  height: auto;
  aspect-ratio: 220 / 340;
  border-radius: 18px;
  border: 0;
  background: #1b1530;
  color: #fffaf0;
  cursor: pointer;
  overflow: hidden;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured:hover {
  transform: translateY(-2px);
  box-shadow: none;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-cover {
  position: absolute;
  inset: 0;
  aspect-ratio: auto;
  border-radius: inherit;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(8, 10, 27, 0.12) 0%, rgba(10, 10, 16, 0.58) 54%, rgba(5, 5, 8, 0.84) 100%);
  pointer-events: none;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-img,
.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-img--placeholder {
  width: 100%;
  height: 100%;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-body {
  position: absolute;
  inset: auto 24px 34px;
  z-index: 1;
  max-height: calc(100% - 68px);
  padding: 0;
  align-items: center;
  text-align: center;
  overflow: hidden;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-theme {
  background: rgba(255, 255, 255, 0.16);
  color: #fffaf0;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-title {
  color: #fffaf0;
  font-size: clamp(2rem, 7vw, 3.25rem);
  font-weight: 400;
  line-height: 0.98;
  margin: 0 0 16px;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__card-excerpt {
  color: rgba(255, 250, 240, 0.84);
  font-size: 0.95rem;
  line-height: 1.55;
  margin-bottom: 18px;
  -webkit-line-clamp: 4;
}

.lineage-gs__letter-reveal-body,
.lineage-gs__letter-reveal-status {
  display: none;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured .lineage-gs__read-letter-btn {
  width: auto;
  min-height: 50px;
  margin: 0;
  padding: 10px 20px 12px;
  border-radius: 999px;
  background: #123e73;
  color: #efffd6;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-loading .lineage-gs__letter-reveal-status {
  display: block;
  color: rgba(255, 250, 240, 0.82);
  font-family: var(--lineage-font-body);
  font-size: 0.86rem;
  margin: 12px 0 0;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-revealed .lineage-gs__card-body {
  inset: 24px;
  justify-content: flex-start;
  overflow-y: auto;
  text-align: left;
  align-items: stretch;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-revealed .lineage-gs__card-title {
  font-size: 1.8rem;
  line-height: 1.05;
  text-align: center;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-revealed .lineage-gs__card-excerpt {
  display: none;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-revealed .lineage-gs__letter-reveal-body {
  display: block;
  color: rgba(255, 250, 240, 0.9);
  font-family: var(--lineage-font-body);
  font-size: 0.94rem;
  line-height: 1.65;
}

.lineage-gs__section--letters .lineage-gs__card--letter-featured.is-revealed .lineage-gs__letter-reveal-body p {
  margin-bottom: 0.85em;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 38%) minmax(0, 1fr);
  gap: 28px;
  align-items: stretch;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-media {
  min-height: 420px;
  border-radius: 14px;
  overflow: hidden;
  background: repeating-linear-gradient(45deg, rgba(38,26,72,0.08), rgba(38,26,72,0.08) 1px, transparent 1px, transparent 10px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-area {
  align-self: center;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-text {
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}

@media (max-width: 768px) {
  .lineage-gs {
    margin-top: 18px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
  .lineage-gs[data-page="main"] .lineage-gs__card--audio,
  .lineage-gs[data-page="main"] .lineage-gs__card--reading,
  .lineage-gs[data-page="main"] .lineage-gs__card--guide {
    flex-basis: 160px;
    width: 160px;
    min-width: 160px;
    height: 238px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before {
    min-height: 112px;
    height: 112px;
  }

  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title {
    font-size: 13px;
  }

  .lineage-gs__section--letters .lineage-gs__grid--letters {
    justify-content: center;
  }

  .lineage-gs__section--letters .lineage-gs__card--letter-featured {
    flex-basis: min(340px, 88vw);
    width: min(340px, 88vw);
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-workspace {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-media {
    min-height: 220px;
    max-height: 280px;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__quiz-question-text {
    text-align: center;
  }
}

/* Latest Gift Shop corrections: keep these after legacy overrides. */
.lineage-gs {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  margin-top: 0;
  font-family: inherit;
}

.lineage-gs :where(h1, h2, h3, h4, h5, h6, p, a, button, input, textarea, select, span) {
  font-family: inherit;
}

.lineage-gs__subpage-header {
  padding: 28px 48px 22px;
  background: var(--lineage-paper);
  border-bottom: 1px solid var(--lineage-ink-faint);
}

.lineage-gs__subpage-header .lineage-gs__breadcrumb {
  margin-bottom: 10px;
}

.lineage-gs__subpage-header .lineage-gs__breadcrumb li,
.lineage-gs__subpage-header .lineage-gs__breadcrumb a,
.lineage-gs__subpage-header .lineage-gs__breadcrumb [aria-current='page'] {
  color: var(--lineage-ink-light);
}

.lineage-gs__subpage-title {
  margin: 0 0 8px;
  color: var(--lineage-deep-purple);
  font-size: 32px;
  line-height: 1.15;
  font-weight: 700;
}

.lineage-gs__subpage-subtitle {
  max-width: 680px;
  margin: 0;
  color: var(--lineage-ink-light);
  font-size: 16px;
  line-height: 1.45;
}

.lineage-gs__card--quiz,
.lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
  position: relative;
  flex: 0 0 220px;
  width: 220px;
  min-width: 220px;
  height: auto;
  aspect-ratio: 3 / 4;
  border: 0;
  border-radius: var(--lineage-radius-card);
  background: var(--lineage-deep-purple);
  color: var(--lineage-paper);
  overflow: hidden;
}

.lineage-gs__card--quiz .lineage-gs__card-cover,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  background: linear-gradient(135deg, #261a48 0%, #5f43ab 100%);
  overflow: hidden;
}

.lineage-gs__card--quiz .lineage-gs__card-img,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
}

.lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img--placeholder::before {
  content: none;
}

.lineage-gs__card--quiz .lineage-gs__card-body {
  display: none;
}

.lineage-gs__card--quiz .lineage-gs__card-overlay,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-overlay,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-overlay {
  position: absolute;
  inset: auto 0 0;
  z-index: 1;
  display: block;
  padding: 14px;
  background: linear-gradient(to top, rgba(38, 26, 72, 0.92) 0%, transparent 100%);
}

.lineage-gs__card--quiz .lineage-gs__card-title,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title {
  margin: 0 0 3px;
  color: var(--lineage-ink);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 700;
}

.lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cat,
.lineage-gs__card--quiz .lineage-gs__card-meta,
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta,
.lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-meta {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  line-height: 1.3;
}

.lineage-gs .lineage-gs__grid.is-slider,
.lineage-gs__section--letters .lineage-gs__grid--letters.is-slider {
  display: flex !important;
  justify-content: flex-start;
  flex-wrap: nowrap;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: hidden;
}

.lineage-gs .lineage-gs__grid.is-slider .lineage-gs__card {
  flex: 0 0 220px;
  width: 220px;
  min-width: 220px;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
  display: block;
  padding: 36px 48px 24px;
  background: var(--lineage-paper);
  text-align: left;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-pattern,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-media {
  display: none;
}

.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-title,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-subtitle,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-description,
.lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-meta {
  color: var(--lineage-deep-purple);
}

@media (max-width: 768px) {
  .lineage-gs__container,
  .lineage-gs__hero-inner {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lineage-gs__subpage-header {
    padding: 22px 16px 18px;
  }

  .lineage-gs__subpage-title {
    font-size: 26px;
  }

  .lineage-gs__subpage-subtitle {
    font-size: 14px;
  }

  .lineage-gs__filter-bar,
  .lineage-gs__grid--quizzes,
  .lineage-gs__grid--audio,
  .lineage-gs__grid--reading,
  .lineage-gs__grid--letters {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lineage-gs .lineage-gs__grid.is-slider .lineage-gs__card,
  .lineage-gs[data-page="main"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz,
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card--quiz {
    flex-basis: 160px;
    width: 160px;
    min-width: 160px;
    height: auto;
  }

  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-img,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-cover,
  .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-img {
    height: 100%;
    min-height: 0;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-hero {
    padding: 24px 16px 18px;
    text-align: left;
  }

  .lineage-gs[data-page="single-quiz"] .lineage-gs__single-quiz-stage {
    padding: 18px 16px 32px;
  }
}

/* ==========================================================================
   Card Uniform Sizing & Mobile Responsiveness Overrides
   ========================================================================== */

/* Uniform Card Size */
.lineage-gs .lineage-gs__card,
.lineage-gs[data-page] .lineage-gs__card,
.lineage-gs[data-page] .lineage-gs__card--quiz,
.lineage-gs[data-page] .lineage-gs__card--audio,
.lineage-gs[data-page] .lineage-gs__card--reading,
.lineage-gs[data-page] .lineage-gs__card--letter,
.lineage-gs[data-page] .lineage-gs__card--guide,
.lineage-gs .lineage-gs__grid--scroll .lineage-gs__card {
  width: 240px !important;
  height: 340px !important;
  min-width: 240px !important;
  min-height: 340px !important;
  flex: 0 0 240px !important;
  aspect-ratio: auto !important;
}

/* Ensure the cover fills the card */
.lineage-gs .lineage-gs__card .lineage-gs__card-cover,
.lineage-gs[data-page] .lineage-gs__card .lineage-gs__card-cover,
.lineage-gs .lineage-gs__card .lineage-gs__card-img,
.lineage-gs[data-page] .lineage-gs__card .lineage-gs__card-img {
  height: 100% !important;
  min-height: 100% !important;
}

/* Base mobile overrides */
@media (max-width: 768px) {
  .lineage-gs {
    overflow-x: hidden;
  }
  .lineage-gs__container,
  .lineage-gs[data-page] .lineage-gs__container {
    padding-inline: 16px !important;
    width: 100%;
    max-width: 100vw;
    box-sizing: border-box;
  }
  .lineage-gs__section {
    padding: 32px 0 !important;
  }
  
  /* Scale down uniform cards slightly on mobile */
  .lineage-gs .lineage-gs__card,
  .lineage-gs[data-page] .lineage-gs__card,
  .lineage-gs[data-page] .lineage-gs__card--quiz,
  .lineage-gs[data-page] .lineage-gs__card--audio,
  .lineage-gs[data-page] .lineage-gs__card--reading,
  .lineage-gs[data-page] .lineage-gs__card--letter,
  .lineage-gs[data-page] .lineage-gs__card--guide,
  .lineage-gs .lineage-gs__grid--scroll .lineage-gs__card {
    width: 200px !important;
    height: 280px !important;
    min-width: 200px !important;
    min-height: 280px !important;
    flex: 0 0 200px !important;
  }

  .lineage-gs__single-quiz-hero {
    padding: 24px 16px !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .lineage-gs__single-quiz-title {
    font-size: 28px !important;
    line-height: 1.2 !important;
  }
  .lineage-gs__single-quiz-media {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16/9;
  }
  
  /* Result Pages responsiveness */
  .lineage-gs__quiz-result-box {
    padding: 24px 16px !important;
  }
}

@media (max-width: 768px) {
  /* On very small screens, non-slider grid items should be 2 fluid columns */
  .lineage-gs__grid:not(.is-slider):not(.lineage-gs__grid--scroll) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  
  .lineage-gs__grid:not(.is-slider):not(.lineage-gs__grid--scroll) .lineage-gs__card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    height: 260px !important; /* Scale height proportionally */
  }
}

/* ==========================================================================
   Lead Form Phone Group
   ========================================================================== */
.lineage-gs__phone-group {
  display: flex;
  gap: 8px;
  width: 100%;
}

.lineage-gs__input--country-code {
  width: 35%;
  flex-shrink: 0;
  appearance: auto;
  cursor: pointer;
}

.lineage-gs__phone-group .lineage-gs__input--phone {
  flex-grow: 1;
}

/* Custom Quiz Title CSS */
.lineage-gs__card--quiz .lineage-gs__card-title, .lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title, .lineage-gs[data-page="quizzes"] .lineage-gs__card--quiz .lineage-gs__card-title {
    margin: 0 0 3px !important;
    color: #e5e5e5 !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
}

/* User Custom Elementor Backgrounds & Giftshop Styling */
.elementor-element.elementor-element-bd7d13a.e-flex.e-con-boxed.e-con.e-parent.e-lazyloaded {
    background: #1d1b20 !important;
}

.elementor-element.elementor-element-e1496c0.elementor-hidden-desktop.elementor-hidden-tablet.neo_header.e-flex.e-con-boxed.e-con.e-parent.e-lazyloaded {
    background: #211d28 !important;
}

.lineage-gs {
    background: linear-gradient(135deg, #5F43AB 0%, #E96F46 100%) !important;
}

.lineage-gs h1, 
.lineage-gs h2, 
.lineage-gs h3, 
.lineage-gs p, 
.lineage-gs div {
    color: #ffffff !important;
}

/* ==========================================================================
   Unified Common Hero Format
   ========================================================================== */
.lineage-gs .lineage-gs__subpage-header {
  position: relative;
  padding: 60px 48px;
  background: var(--lineage-bg);
  overflow: hidden;
  border-bottom: 1px solid var(--lineage-ink-faint);
  display: flex;
  justify-content: center;
  text-align: left;
}

.lineage-gs .lineage-gs__subpage-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.045) 1px, transparent 1px, transparent 12px),
    radial-gradient(circle at 78% 28%, rgba(246, 184, 46, 0.18), transparent 34%);
  pointer-events: none;
}

.lineage-gs .lineage-gs__subpage-header-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 48px;
  align-items: center;
  max-width: 1200px;
  width: 100%;
}

.lineage-gs .lineage-gs__subpage-header-copy {
  position: relative;
  z-index: 1;
}

.lineage-gs .lineage-gs__subpage-kicker {
  color: var(--lineage-accent);
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0.16em;
  font-size: 0.78rem;
  margin: 0 0 14px 0;
}

.lineage-gs .lineage-gs__subpage-title {
  color: var(--lineage-deep-purple);
  font-family: var(--lineage-font-display);
  font-size: clamp(2.8rem, 7vw, 4rem);
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 16px;
  letter-spacing: -0.02em;
}

.lineage-gs .lineage-gs__subpage-subtitle {
  color: var(--lineage-ink);
  font-size: 1.15rem;
  line-height: 1.6;
  margin: 0 0 24px;
  opacity: 0.9;
  max-width: 600px;
}

.lineage-gs .lineage-gs__subpage-meta {
  color: var(--lineage-ink-light);
  font-weight: 600;
  margin-bottom: 32px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.lineage-gs .lineage-gs__subpage-media {
  position: relative;
  z-index: 1;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(38, 26, 72, 0.2);
  justify-self: center;
  width: 100%;
  aspect-ratio: 4 / 3;
}

.lineage-gs .lineage-gs__subpage-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lineage-gs .lineage-gs__subpage-media--portrait {
  aspect-ratio: 3 / 4;
  max-width: 320px;
}

.lineage-gs .lineage-gs__subpage-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--lineage-deep-purple), rgba(95, 67, 171, 0.75));
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--lineage-paper);
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.1em;
  opacity: 0.8;
}

/* Fallback for subpages that don't need a right-side image */
.lineage-gs .lineage-gs__subpage-header--no-media .lineage-gs__subpage-header-inner {
  grid-template-columns: 1fr;
  text-align: center;
}

.lineage-gs .lineage-gs__subpage-header--no-media .lineage-gs__subpage-subtitle {
  margin-left: auto;
  margin-right: auto;
}

.lineage-gs .lineage-gs__subpage-header--no-media .lineage-gs__subpage-media {
  display: none;
}

@media (max-width: 800px) {
  .lineage-gs .lineage-gs__subpage-header {
      padding: 40px 24px;
  }
  .lineage-gs .lineage-gs__subpage-header-inner {
      grid-template-columns: 1fr;
      text-align: center;
      gap: 32px;
  }
  .lineage-gs .lineage-gs__subpage-subtitle {
      margin-left: auto;
      margin-right: auto;
  }
  .lineage-gs .lineage-gs__subpage-meta {
      justify-content: center;
  }
}

/* ==========================================================================
   V3 Quiz Focus Mode & Processing State
   ========================================================================== */
body.lggs-quiz-focus-mode .site-header,
body.lggs-quiz-focus-mode #masthead,
body.lggs-quiz-focus-mode .site-footer,
body.lggs-quiz-focus-mode #colophon,
body.lggs-quiz-focus-mode .elementor-location-header,
body.lggs-quiz-focus-mode .elementor-location-footer {
  display: none !important;
}

body.lggs-quiz-focus-mode .lineage-gs {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.lineage-gs__quiz-processing {
  text-align: center;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 400px;
}

.lineage-gs__processing-spinner {
  width: 64px;
  height: 64px;
  border: 4px solid var(--lineage-glass);
  border-top: 4px solid var(--lineage-accent);
  border-radius: 50%;
  margin-bottom: 32px;
}

.lineage-gs__processing-title {
  font-family: var(--lineage-font-display);
  font-size: 32px;
  color: var(--lineage-ink);
  margin-bottom: 16px;
}

.lineage-gs__processing-text {
  font-size: 18px;
  color: var(--lineage-ink-light);
}

/* ==========================================================================
   V3 Mobile Bottom Navigation
   ========================================================================== */
.lineage-gs__mobile-nav {
  display: none;
}

@media (max-width: 800px) {
  .lineage-gs__mobile-nav {
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    padding: 12px 0 24px 0; /* Extra padding at bottom for safe area */
    border-top: 1px solid rgba(255,255,255,0.1);
    background: rgba(10, 10, 15, 0.85); /* Slightly darker glass */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  /* When focus mode is active, hide the mobile nav too */
  body.lggs-quiz-focus-mode .lineage-gs__mobile-nav {
    display: none !important;
  }

  .lineage-gs__mobile-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: var(--lineage-ink-light);
    font-size: 10px;
    font-family: var(--lineage-font-base);
    text-transform: none;
    letter-spacing: 0.5px;
    transition: color var(--lineage-transition-fast);
  }

  .lineage-gs__mobile-nav-item svg {
    margin-bottom: 4px;
    opacity: 0.7;
    transition: opacity var(--lineage-transition-fast), color var(--lineage-transition-fast);
  }

  .lineage-gs__mobile-nav-item:hover,
  .lineage-gs__mobile-nav-item:active {
    color: var(--lineage-accent);
  }

  .lineage-gs__mobile-nav-item:hover svg,
  .lineage-gs__mobile-nav-item:active svg {
    opacity: 1;
    color: var(--lineage-accent);
  }

  /* Add padding to the body so content isn't hidden behind the nav */
  body {
    padding-bottom: 80px;
  }
}

/* Listing Pages Grid Fixes - 2 cards per row on mobile, 5 on desktop */
.lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes,
.lineage-gs[data-page="audio"] .lineage-gs__grid--audio,
.lineage-gs[data-page="reading-room"] .lineage-gs__grid--reading,
.lineage-gs[data-page="letters"] .lineage-gs__grid--letters {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: var(--lineage-gap) !important;
  overflow: visible !important;
}

@media (max-width: 768px) {
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes,
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio,
  .lineage-gs[data-page="reading-room"] .lineage-gs__grid--reading,
  .lineage-gs[data-page="letters"] .lineage-gs__grid--letters {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  
  .lineage-gs[data-page="quizzes"] .lineage-gs__grid--quizzes .lineage-gs__card,
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio .lineage-gs__card,
  .lineage-gs[data-page="reading-room"] .lineage-gs__grid--reading .lineage-gs__card,
  .lineage-gs[data-page="letters"] .lineage-gs__grid--letters .lineage-gs__card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    height: 260px !important;
  }
}

/* Force all subpage cards to use full-bleed overlay design like healing-frequencies */
.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-cover,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-cover,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-cover,
.lineage-gs[data-page="audio"] .lineage-gs__card .lineage-gs__card-cover {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-img,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-img,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-img,
.lineage-gs[data-page="audio"] .lineage-gs__card .lineage-gs__card-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Fix overlay gradient for all so it shows properly on dark text */
.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-overlay,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-overlay,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-overlay,
.lineage-gs[data-page="audio"] .lineage-gs__card .lineage-gs__card-overlay {
  position: absolute !important;
  top: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: linear-gradient(to top, rgba(38, 26, 72, 0.95) 0%, transparent 100%) !important;
  display: block !important;
  padding: 12px 14px !important;
  z-index: 2 !important;
  opacity: 1 !important;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-body,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-body,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-body,
.lineage-gs[data-page="audio"] .lineage-gs__card .lineage-gs__card-body {
  display: none !important;
}

/* Fix text colors, margins and card backgrounds for subpages */
.lineage-gs[data-page="quizzes"] .lineage-gs__card,
.lineage-gs[data-page="reading-room"] .lineage-gs__card,
.lineage-gs[data-page="letters"] .lineage-gs__card {
  border: none !important;
  background: var(--lineage-ink) !important;
  box-shadow: none !important;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-title,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-title,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-title {
  color: #fff !important;
  position: relative !important;
  z-index: 3 !important;
  margin: 0 0 4px 0 !important;
  font-size: 16px !important;
  font-family: var(--lineage-font-display) !important;
}

.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-meta,
.lineage-gs[data-page="quizzes"] .lineage-gs__card .lineage-gs__card-cat,
.lineage-gs[data-page="reading-room"] .lineage-gs__card .lineage-gs__card-download-label,
.lineage-gs[data-page="letters"] .lineage-gs__card .lineage-gs__card-duration {
  color: rgba(255, 255, 255, 0.8) !important;
  position: relative !important;
  z-index: 3 !important;
  margin: 0 !important;
  font-size: 11px !important;
}

/* ==========================================================================
   V3 MAIN PAGE LIGHT THEME (Reference Image Match)
   ========================================================================== */

/* 1. Global Page Background & Text */
.lineage-gs[data-page="main"] {
  background-color: #FFFFFF;
  color: #111118;
}

/* 2. Hero remains dark */
.lineage-gs[data-page="main"] .lineage-gs__hero {
  background: linear-gradient(135deg, #261A48 0%, #302256 100%);
}
.lineage-gs[data-page="main"] .lineage-gs__hero-title,
.lineage-gs[data-page="main"] .lineage-gs__hero-subtitle {
  color: #FFFFFF;
}

/* 3. Category Tabs Strip (White background) */
.lineage-gs[data-page="main"] .lineage-gs__container:has(> .lineage-gs__category-nav) {
  background: #FFFFFF;
}
.lineage-gs[data-page="main"] .lineage-gs__category-nav {
  padding: 24px 0;
}
.lineage-gs[data-page="main"] .lineage-gs__category-tab {
  background: #FFFFFF;
  color: #555555;
  border-color: #E2E8F0;
}
.lineage-gs[data-page="main"] .lineage-gs__category-tab.is-active,
.lineage-gs[data-page="main"] .lineage-gs__category-tab[aria-selected="true"] {
  background: var(--lineage-secondary);
  color: #FFFFFF;
  border-color: var(--lineage-secondary);
}

/* 4. Section Titles */
.lineage-gs[data-page="main"] .lineage-gs__section-title {
  color: #111118;
}
.lineage-gs[data-page="main"] .lineage-gs__section-eyebrow,
.lineage-gs[data-page="main"] .lineage-gs__section-description {
  color: #64748B;
}

/* 5. Specific Section Backgrounds */
.lineage-gs[data-page="main"] .lineage-gs__section--quizzes {
  background: #FFFFFF;
}
.lineage-gs[data-page="main"] .lineage-gs__section--frequencies {
  background: #F3F0F8; /* Light grey with purple tint */
}
.lineage-gs[data-page="main"] .lineage-gs__section--oracle {
  background: #F4EFFF; /* Light lavender */
}
.lineage-gs[data-page="main"] .lineage-gs__section--reading-room {
  background: #FFFFFF;
}
.lineage-gs[data-page="main"] .lineage-gs__section--letters {
  background: #FFF7F0; /* Light peach */
}

/* 6. Card Styles overrides */

/* Audio & Reading Cards -> Purple Gradients */
.lineage-gs[data-page="main"] .lineage-gs__card--audio,
.lineage-gs[data-page="main"] .lineage-gs__card--reading {
  background: linear-gradient(135deg, #4A3A75 0%, #6D4AFF 100%) !important;
  border: none !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--audio .lineage-gs__card-title,
.lineage-gs[data-page="main"] .lineage-gs__card--reading .lineage-gs__card-title {
  color: #FFFFFF !important;
}

/* Letters Cards -> Orange Gradients */
.lineage-gs[data-page="main"] .lineage-gs__card--letter {
  background: linear-gradient(135deg, #E66A45 0%, #D85A34 100%) !important;
  border: none !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--letter .lineage-gs__card-title,
.lineage-gs[data-page="main"] .lineage-gs__card--letter .lineage-gs__card-excerpt {
  color: #FFFFFF !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--letter .lineage-gs__card-theme {
  color: rgba(255,255,255,0.8) !important;
}

/* Quiz Cards -> White/Grey stripes */
.lineage-gs[data-page="main"] .lineage-gs__card--quiz {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-cover {
  background: repeating-linear-gradient(45deg, #F8FAFC, #F8FAFC 2px, transparent 2px, transparent 10px) !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-title {
  color: #111118 !important;
}
.lineage-gs[data-page="main"] .lineage-gs__card--quiz .lineage-gs__card-meta {
  color: #64748B !important;
}


/* Audio cards: intentionally borderless */
.lineage-gs__audio-card,
.lineage-gs__card--audio,
.lineage-gs[data-page] .lineage-gs__card--audio,
.lineage-gs .lineage-gs__card--audio {
  border: none !important;
  outline: none;
}

.lineage-gs__card--audio:focus,
.lineage-gs__card--audio:focus-visible,
.lineage-gs__audio-card:focus,
.lineage-gs__audio-card:focus-visible {
  border: none !important;
  outline: none !important;
}

/* -------------------------------------------------------------------------
 * Desktop audio deck: center-origin layout.
 * The first card is physically centered; subsequent cards build outward.
 * Hover/interaction does not shift the deck.
 * ------------------------------------------------------------------------- */
@media (min-width: 769px) {
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio,
  .lineage-gs .lineage-gs__grid--audio {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center !important;
    align-items: flex-start;
    overflow: visible !important;
    width: 100%;
  }

  /* Five-card deck: 4,2,1,3,5 visually, with card 1 at the exact center. */
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio > .lineage-gs__card:nth-child(1),
  .lineage-gs .lineage-gs__grid--audio > .lineage-gs__card:nth-child(1) { order: 3; }
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio > .lineage-gs__card:nth-child(2),
  .lineage-gs .lineage-gs__grid--audio > .lineage-gs__card:nth-child(2) { order: 2; }
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio > .lineage-gs__card:nth-child(3),
  .lineage-gs .lineage-gs__grid--audio > .lineage-gs__card:nth-child(3) { order: 4; }
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio > .lineage-gs__card:nth-child(4),
  .lineage-gs .lineage-gs__grid--audio > .lineage-gs__card:nth-child(4) { order: 1; }
  .lineage-gs[data-page="audio"] .lineage-gs__grid--audio > .lineage-gs__card:nth-child(5),
  .lineage-gs .lineage-gs__grid--audio > .lineage-gs__card:nth-child(5) { order: 5; }
}


/* Reading Room horizontal slider: always usable with mouse, touch, keyboard and arrows. */
.guide-slider-wrap { position:relative; width:100%; display:flex; align-items:center; gap:10px; }
.guide-cards-grid { flex:1 1 auto; display:flex !important; flex-wrap:nowrap !important; overflow-x:auto !important; overflow-y:hidden; scroll-behavior:smooth; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:10px 6px 18px; }
.guide-cards-grid::-webkit-scrollbar { display:none; }
.guide-cards-grid .guide-feature-card { flex:0 0 min(300px, 78vw); min-width:min(300px,78vw); scroll-snap-align:start; }
.guide-slider-arrow { flex:0 0 42px; width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(20,20,20,.72); color:#fff; cursor:pointer; font-size:30px; line-height:1; display:flex; align-items:center; justify-content:center; z-index:4; }
.guide-slider-arrow:hover { background:rgba(20,20,20,.9); }
@media (max-width:700px) { .guide-slider-wrap { gap:4px; } .guide-slider-arrow { flex-basis:34px; width:34px; height:34px; font-size:24px; } .guide-cards-grid .guide-feature-card { flex-basis:78vw; min-width:78vw; } }


/* v1.5.22 Reading Room final visual overrides.  This stylesheet is loaded
 * after lineage-frontend.css, so keep the requested slider dimensions here. */
.guide-slider-wrap .guide-slider-arrow,
.guide-slider-arrow {
  flex: 0 0 50px !important;
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  min-height: 50px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* Make the configured cover fully fill the image area without distortion. */
.guide-cards-grid .guide-feature-card .white-card-img {
  width: 100% !important;
  height: 68% !important;
  min-height: 0 !important;
  flex: 0 0 68% !important;
  aspect-ratio: auto !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

@media (max-width: 700px) {
  .guide-slider-wrap .guide-slider-arrow,
  .guide-slider-arrow {
    flex: 0 0 50px !important;
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    font-size: 28px !important;
  }
}

/* v1.5.23 — Reading Room mobile slider: one complete card in viewport. */
@media (max-width: 700px) {
  .guide-slider-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 42px !important;
    padding-right: 42px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  .guide-slider-wrap .guide-cards-grid {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 10px 6px 24px !important;
    gap: 14px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-padding-left: 6px !important;
    scroll-snap-type: x mandatory !important;
  }
  .guide-slider-wrap .guide-cards-grid .guide-feature-card {
    flex: 0 0 min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    width: min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    min-width: min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    max-width: calc(100vw - 100px) !important;
    height: min(var(--audio-mobile-card-height, 255px), calc((100vw - 100px) * 1.5)) !important;
    box-sizing: border-box !important;
    scroll-snap-align: start !important;
  }
  .guide-slider-wrap .guide-cards-grid .guide-feature-card .white-card-img {
    width: 100% !important;
    height: 68% !important;
    flex: 0 0 68% !important;
    box-sizing: border-box !important;
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #0b0c10 !important;
  }
  .guide-slider-wrap .guide-slider-arrow,
  .guide-slider-arrow {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    flex: 0 0 50px !important;
    z-index: 30 !important;
  }
}


/* ========================================================================
   v1.5.27 — Reading Room: render the complete collection in one slider.
   The PHP query now loads every published guide; these rules prevent any
   grid/flex rule from shrinking, clipping or hiding later cards.
   ======================================================================== */
.guide-slider-wrap .guide-cards-grid {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  gap: clamp(16px, 2vw, 30px) !important;
  scroll-behavior: smooth !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
}

.guide-slider-wrap .guide-cards-grid .guide-feature-card {
  flex: 0 0 var(--audio-card-width, 300px) !important;
  width: var(--audio-card-width, 300px) !important;
  min-width: var(--audio-card-width, 300px) !important;
  max-width: var(--audio-card-width, 300px) !important;
  scroll-snap-align: start !important;
}

@media (max-width: 700px) {
  .guide-slider-wrap .guide-cards-grid .guide-feature-card {
    flex: 0 0 min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    width: min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    min-width: min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
    max-width: min(var(--audio-mobile-card-width, 170px), calc(100vw - 100px)) !important;
  }
}