/* ============================================================================
   brandos-overlay.css — BrandOS token bridge (additive, safe overlay)
   -------------------------------------------------------------------
   RULES:
   • MUST load LAST in the CSS cascade (after all theme-*.css / joy-*.css / lumen-*.css)
   • NEVER redefines existing tokens (--gold-*, --ink, --page-bg, --ff-serif, etc.)
   • ONLY adds NEW alias tokens under the `--brandos-*` and `--wax-*` prefixes
   • ONLY applies visual styling to elements that opt in via `.brandos-*` classes
     or `[data-brandos-*]` attributes
   • Existing pages, headings, links, and body text are UNCHANGED
   ========================================================================== */

:root {
  /* ---- BrandOS token aliases mapped to existing tokens where possible ---- */
  --brandos-parchment-cream:  var(--cream-200);          /* existing #FDFBF5 */
  --brandos-parchment-deep:   var(--cream-400);          /* existing #F7EFD6 */
  --brandos-chalice-gold:     var(--gold-400);           /* existing #D89412 */
  --brandos-chalice-gold-hi:  var(--gold-200);           /* existing #FFD24A */
  --brandos-ink-brown:        var(--ink);                /* existing #2A2D38 */
  --brandos-ink-soft:         var(--ink-soft);           /* existing #5A6173 */

  /* ---- BrandOS NEW colors additive to the existing palette ---- */
  --wax-burgundy:             #6B1F2E;                   /* new — for seal accents only */
  --wax-burgundy-deep:        #4A1520;
  --wax-burgundy-warm:        #7A2532;
  --chalice-gold-warm:        #B48748;                   /* warm gold for seal impression */
  --chalice-gold-glint:       #D6A868;

  /* ---- Motion durations (namespaced; do not touch existing) ---- */
  --brandos-dur-quick:   240ms;
  --brandos-dur-default: 480ms;
  --brandos-dur-slow:    800ms;
  --brandos-dur-breath:  8000ms;
  --brandos-dur-reveal:  2400ms;

  --brandos-ease-gentle:  cubic-bezier(0.4, 0, 0.4, 1);
  --brandos-ease-breath:  cubic-bezier(0.42, 0, 0.58, 1);
  --brandos-ease-morning: cubic-bezier(0.25, 0.1, 0.25, 1);

  /* ---- Serif enhancement stack (optional, only for .brandos-wordmark) ---- */
  --brandos-ff-serif: "Source Serif 4", "Source Serif Pro", "Newsreader",
                      "EB Garamond", var(--ff-serif, Georgia), serif;
}

/* ---------- Opt-in wordmark class (for headers/footers that adopt it) ---- */
.brandos-wordmark {
  font-family: var(--brandos-ff-serif);
  font-weight: 400;
  font-style: normal;
  letter-spacing: -0.012em;
}

/* ---------- Wax-seal overlay element (opt-in via <span class="brandos-seal">) */
.brandos-seal {
  display: inline-block;
  vertical-align: middle;
  line-height: 0;
}
.brandos-seal svg {
  display: block;
  filter: drop-shadow(0 2px 3px rgba(74, 21, 32, 0.30));
}

/* ---------- Optional footer signature block (opt-in via .brandos-signature) */
.brandos-signature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  font-family: var(--ff-sans, system-ui);
  font-size: 0.85rem;
  color: var(--ink-soft, #5A6173);
  text-align: center;
}

/* ---------- BrandOS motion classes (opt-in only) ---------- */
@keyframes brandos-breath {
  0%,   100% { transform: scale(1);     opacity: 1;   }
  25%, 50%   { transform: scale(1.015); opacity: 1;   }
  75%        { transform: scale(.985);  opacity: .92; }
}
@keyframes brandos-arrival {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes brandos-reveal {
  0%, 33%    { opacity: 0; transform: translateY(2%) scale(.94); }
  83%        { opacity: 1; transform: translateY(-.5%) scale(1.02); }
  100%       { opacity: 1; transform: none; }
}

.brandos-motion-breath   { animation: brandos-breath  var(--brandos-dur-breath)  var(--brandos-ease-breath)  infinite; }
.brandos-motion-arrival  { animation: brandos-arrival var(--brandos-dur-default) var(--brandos-ease-morning) both; }
.brandos-motion-reveal   { animation: brandos-reveal  var(--brandos-dur-reveal)  var(--brandos-ease-morning) both; }

/* ---------- Rule-engine denial state ----------
   When the client-side rule engine tags an opt-in overlay with data-brandos-blocked,
   the overlay is hidden. Existing site content is NEVER touched. */
[data-brandos-mark][data-brandos-blocked="true"] {
  display: none !important;
}

/* ---------- Scoped focus ring for BrandOS interactive overlays ---------- */
.brandos-focus:focus-visible {
  outline: 3px solid rgba(180, 135, 72, 0.35);
  outline-offset: 4px;
}

/* ============================================================================
   BrandOS Real Visual Layer — modifies EXISTING footer/nav elements to add
   sacred-modern branded presence. NO floating overlays. NO temporary markers.
   Enhances what visitors already see, gives CrossAIHub a distinct identity.
   ========================================================================== */

/* --- 1. Subtle chalice-gold accent bar under the site header --- */
.site-header {
  position: relative;
}
.site-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(180, 135, 72, 0) 5%,
    rgba(180, 135, 72, 0.55) 30%,
    rgba(180, 135, 72, 0.55) 70%,
    rgba(180, 135, 72, 0) 95%,
    transparent 100%
  );
  pointer-events: none;
}

/* --- 2. Wordmark: subtle gold tint on the "AI" middle segment --- */
.wordmark__text .c-ai {
  color: #8E6832;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: color 200ms ease;
}
.wordmark:hover .c-ai {
  color: #B48748;
}

/* --- 3. Footer brand mark: replace plain cross with wax seal --- */
.footer-mark {
  position: relative;
  padding-left: 8px;
}
.footer-mark__icon {
  position: relative;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.footer-mark__icon::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/assets/svg/brandos/cross-wax-seal.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 2px 4px rgba(43, 36, 24, 0.20));
  z-index: 1;
}
.footer-mark__icon > svg {
  position: relative;
  z-index: 2;
  opacity: 0;                        /* hide the plain cross behind the seal */
}
.footer-mark__name {
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* --- 4. Footer verse: gold border-left + burgundy citation --- */
.footer-verse {
  border-left: 3px solid rgba(180, 135, 72, 0.6);
  padding-left: 16px;
  margin-left: 2px;
}
.footer-verse cite {
  color: #6B1F2E;
  font-style: normal;
  font-weight: 500;
}

/* --- 5. Footer signature: elevated tagline in wax burgundy --- */
.footer-signature em {
  color: #6B1F2E;
  font-style: normal;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.82em;
  font-weight: 500;
}

/* --- 6. Footer signoff: soft brand tint --- */
.footer-signoff {
  color: rgba(43, 36, 24, 0.75);
}

/* --- 7. Blockquote / verse callouts get subtle brand accent --- */
.cinematic-hero blockquote,
.foundations blockquote,
blockquote.footer-verse {
  border-left-color: rgba(180, 135, 72, 0.6);
}

/* --- 8. Section h2 headings: refined letter-spacing --- */
.foundations__h2,
.foundations h2 {
  letter-spacing: -0.005em;
}

/* ============================================================================
   BrandOS Complete Design System — sacred-modern identity across every page.
   Applied to real, live elements. NO structural HTML changes.
   ========================================================================== */

/* --- 11. Unified kicker/eyebrow identity (burgundy uppercase across the site) */
.cinematic-hero__kicker,
.foundations__kicker,
.hotd__kicker,
.house-support__eyebrow,
.card__kicker,
.eyebrow,
.section-eyebrow,
[class$="__kicker"] {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  font-weight: 500;
}

/* --- 12. Hero em accent — chalice gold on "Joy in the Word" style emphasis */
html body .cinematic-hero__h1 em,
html body .cinematic-hero__h1 i {
  color: #8E6832;
  font-style: italic;
  font-weight: inherit;
}

/* --- 13. Hero lede: warmer ink color for premium reading */
.cinematic-hero__lede,
.hero__lede {
  color: rgba(43, 36, 24, 0.86);
}

/* --- 14. Section h2 refinement across all sections --- */
.foundations__h2,
.house-support__h2,
.hotd__title,
h2.section-title,
.section h2 {
  letter-spacing: -0.008em;
}

/* --- 15. Card family — subtle gold border-bottom on hover --- */
.foundations__card,
.vod-card,
.media-card,
.start-here__card,
.hotd,
.channel,
[class$="__card"] {
  border-bottom: 2px solid transparent;
  transition: border-color 260ms cubic-bezier(.2,.7,.3,1),
              transform 260ms cubic-bezier(.2,.7,.3,1),
              box-shadow 260ms cubic-bezier(.2,.7,.3,1);
}
.foundations__card:hover,
.vod-card:hover,
.media-card:hover,
.start-here__card:hover,
.channel:hover,
[class$="__card"]:hover {
  border-bottom-color: rgba(180, 135, 72, 0.7);
  transform: translateY(-1px);
}

/* --- 16. Scripture blockquotes across the site (unified pattern) --- */
blockquote:not(.footer-verse),
.scripture-quote,
.hotd__verse,
.foundations__verse,
[class$="__verse"]:not(.footer-verse) {
  border-left: 3px solid rgba(180, 135, 72, 0.55);
  padding-left: 1.1rem;
}
blockquote cite,
.scripture-quote cite,
.hotd__verse cite,
[class$="__verse"] cite {
  color: #6B1F2E;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.85em;
  display: block;
  margin-top: 0.5rem;
}

/* --- 17. Nav links — gold underline animates in on hover --- */
.site-nav a {
  position: relative;
  transition: color 220ms ease;
}
.site-nav a::after {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: -4px;
  height: 1.5px;
  background: linear-gradient(90deg, transparent 0%, #B48748 40%, #B48748 60%, transparent 100%);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 240ms cubic-bezier(.2,.7,.3,1);
  pointer-events: none;
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

/* --- 18. Button focus rings — brand burgundy --- */
.btn:focus-visible,
button:focus-visible,
a.btn:focus-visible,
a.btn--gold:focus-visible {
  outline: 3px solid rgba(107, 31, 46, 0.35);
  outline-offset: 3px;
  border-radius: 6px;
}

/* --- 19. Gold divider refinement --- */
.divider-gold {
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(180, 135, 72, 0.6) 30%,
    rgba(180, 135, 72, 0.6) 70%,
    transparent 100%
  );
  height: 1px;
  border: none;
}

/* --- 20. hr elements site-wide — brand-tinted --- */
hr:not(.divider-gold) {
  border: none;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(180, 135, 72, 0.35) 40%,
    rgba(180, 135, 72, 0.35) 60%,
    transparent 100%
  );
  margin: 2.5rem 0;
}

/* --- 21. HOTD (hymn of the day) enhanced brand presence --- */
.hotd__kicker { text-transform: uppercase; }
.hotd__title { font-family: inherit; }
.hotd__note--tomorrow {
  color: rgba(107, 31, 46, 0.75);
  font-style: italic;
  letter-spacing: 0.01em;
}

/* --- 22. Foundations section: brand identity --- */
.foundations__header {
  position: relative;
}
.foundations__lede {
  color: rgba(43, 36, 24, 0.82);
}

/* --- 23. house-support (donation section) refinement --- */
.house-support__inner {
  position: relative;
}
.house-support--minimal .house-support__h2 {
  letter-spacing: -0.005em;
}

/* --- 24. Content transitions: refined breathing between sections --- */
main > section + section,
.container + .container {
  padding-top: max(3rem, 4vh);
}

/* --- 25. Link accents in prose: burgundy on hover --- */
.container--prose a:not(.btn):hover,
main p a:not(.btn):hover {
  color: #6B1F2E;
  text-decoration-color: #B48748;
}

/* --- 26. Selection color across the site --- */
::selection {
  background: rgba(180, 135, 72, 0.28);
  color: #2B2418;
}

/* --- 27. Print: keep enhancements but suppress decorative rules --- */
@media print {
  .site-header::after { display: none; }
  .footer-mark__icon::before { display: none; }
  .footer-mark__icon > svg { opacity: 1; }
  .site-nav a::after { display: none; }
  hr { background: #ccc; height: 1px; }
}

/* --- 28. Reduced-motion respect --- */
@media (prefers-reduced-motion: reduce) {
  .wordmark:hover .c-ai,
  .foundations__card,
  .vod-card,
  .media-card,
  .start-here__card,
  .channel,
  [class$="__card"],
  .site-nav a::after,
  .site-nav a {
    transition: none;
  }
  .foundations__card:hover,
  .vod-card:hover,
  .media-card:hover,
  .start-here__card:hover,
  [class$="__card"]:hover { transform: none; }
}

/* --- 29. Mobile refinements --- */
@media (max-width: 640px) {
  .cinematic-hero__kicker,
  .foundations__kicker,
  .hotd__kicker { font-size: 0.75rem; letter-spacing: 0.12em; }
  .site-nav a::after { display: none; }  /* nav is likely a hamburger on mobile */
}

/* ============================================================================
   CrossAIHub 2.0 — new-component style layer for Phase 3 homepage restructure.
   ========================================================================== */

/* --- 30. Today's rhythm section (verse + hymn combined) --- */
.today-rhythm {
  padding: clamp(3rem, 6vh, 5rem) 0;
  background: linear-gradient(180deg, #FDFBF5 0%, #FBF6E9 100%);
}
.today-rhythm__header {
  text-align: center;
  max-width: 44rem;
  margin: 0 auto 2.5rem;
}
.today-rhythm__kicker {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
}
.today-rhythm__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.008em;
  color: #2B2418;
  margin: 0 0 0.5rem;
}
.today-rhythm__lede {
  color: rgba(43, 36, 24, 0.72);
  font-size: 0.95rem;
  margin: 0;
}
.today-rhythm__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  align-items: stretch;
}
.today-rhythm__col {
  background: #FFFEFB;
  border-radius: 12px;
  padding: 1rem;
  box-shadow: 0 1px 3px rgba(43, 36, 24, 0.04),
              0 12px 32px -20px rgba(43, 36, 24, 0.08);
  border: 1px solid rgba(180, 135, 72, 0.14);
}
/* Reset the inner section's own background/padding so they compose neatly */
.today-rhythm__col > .vod-section,
.today-rhythm__col > .hotd {
  background: transparent;
  padding: 0;
  margin: 0;
}

/* --- 31. Five pathways section --- */
.pathways {
  padding: clamp(4rem, 8vh, 6.5rem) 0;
  background: #FDFBF5;
}
.pathways__header {
  text-align: center;
  max-width: 44rem;
  margin: 0 auto 3rem;
}
.pathways__kicker {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
}
.pathways__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.008em;
  color: #2B2418;
  margin: 0;
}
.pathways__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  max-width: 84rem;
  margin: 0 auto;
}
/* Pathway card — the flagship new component */
.pathway-card {
  display: block;
  padding: 1.75rem 1.5rem 1.5rem;
  background: #FFFEFB;
  border: 1px solid rgba(180, 135, 72, 0.20);
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(43, 36, 24, 0.04);
  transition: transform 260ms cubic-bezier(.2,.7,.3,1),
              border-color 260ms ease,
              box-shadow 260ms ease;
}
.pathway-card::before {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, #B48748 30%, #B48748 70%, transparent 100%);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 320ms cubic-bezier(.2,.7,.3,1);
}
.pathway-card:hover {
  transform: translateY(-3px);
  border-color: rgba(107, 31, 46, 0.35);
  box-shadow: 0 4px 8px rgba(43, 36, 24, 0.06),
              0 16px 36px -18px rgba(107, 31, 46, 0.20);
}
.pathway-card:hover::before {
  transform: scaleX(1);
}
.pathway-card:focus-visible {
  outline: 3px solid rgba(107, 31, 46, 0.35);
  outline-offset: 4px;
}
.pathway-card__mark {
  width: 44px;
  height: 44px;
  color: #B48748;
  margin-bottom: 1.25rem;
  transition: color 240ms ease, transform 320ms cubic-bezier(.2,.7,.3,1);
}
.pathway-card__mark svg {
  width: 100%;
  height: 100%;
  display: block;
}
.pathway-card:hover .pathway-card__mark {
  color: #6B1F2E;
  transform: scale(1.06);
}
.pathway-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.pathway-card__kicker {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 500;
}
.pathway-card__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 500;
  color: #2B2418;
  margin: 0;
  letter-spacing: -0.005em;
  line-height: 1.28;
}
.pathway-card__note {
  color: rgba(43, 36, 24, 0.75);
  font-size: 0.925rem;
  line-height: 1.55;
  margin: 0;
}
.pathway-card__cta {
  color: #6B1F2E;
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-top: 0.5rem;
  transition: transform 240ms ease;
  display: inline-block;
}
.pathway-card:hover .pathway-card__cta {
  transform: translateX(4px);
}

/* --- 32. Mobile refinements for new sections --- */
@media (max-width: 640px) {
  .today-rhythm__grid { gap: 1rem; }
  .today-rhythm__col { padding: 0.75rem; }
  .pathways { padding: 3rem 0; }
  .pathways__grid { gap: 1rem; }
  .pathway-card { padding: 1.5rem 1.25rem 1.25rem; }
  .pathway-card__mark { width: 36px; height: 36px; margin-bottom: 1rem; }
  .pathway-card__title { font-size: 1.2rem; }
}

/* ============================================================================
   PHASE 4 — Nav restructure: 30+ items → 6 pathways + utility icons.
   Applies to all 186 pages via bulk nav replacement.
   ========================================================================== */

/* --- 34. Site header layout — wordmark left, nav center, utility right --- */
.site-header__inner {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 3vw, 2.5rem);
  padding: 0.85rem clamp(1rem, 3vw, 2rem);
  max-width: 84rem;
  margin: 0 auto;
}
.site-header__inner > .wordmark {
  flex: 0 0 auto;
}
.site-header__inner > .site-nav {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
}
.site-header__inner > .site-header__utility {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* --- 35. Primary nav list — 6 pathways --- */
.site-nav__list {
  display: flex;
  gap: clamp(0.75rem, 1.6vw, 1.5rem);
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
}
.site-nav__list > .nav-item > .nav-trigger,
.site-nav__list > li > a {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 0.9rem;
  font-weight: 500;
  color: #2B2418;
  text-decoration: none;
  background: none;
  border: none;
  padding: 0.5rem 0.35rem;
  cursor: pointer;
  transition: color 200ms ease;
  position: relative;
}
.site-nav__list > .nav-item > .nav-trigger:hover,
.site-nav__list > li > a:hover {
  color: #6B1F2E;
}
.site-nav__list > .nav-item > .nav-trigger::after {
  content: "";
  display: inline-block;
  margin-left: 0.35rem;
  width: 5px;
  height: 5px;
  border: solid rgba(43, 36, 24, 0.4);
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
  transition: transform 200ms ease, border-color 200ms ease;
  vertical-align: 2px;
}
.site-nav__list > .nav-item > .nav-trigger:hover::after,
.site-nav__list > .nav-item[aria-expanded="true"] > .nav-trigger::after {
  border-color: #6B1F2E;
}

/* --- 36. Dropdown nav-menu refinement --- */
.nav-menu {
  min-width: 240px;
  padding: 0.75rem 0;
  background: #FFFEFB;
  border: 1px solid rgba(180, 135, 72, 0.20);
  border-radius: 10px;
  box-shadow: 0 12px 40px -18px rgba(43, 36, 24, 0.30),
              0 2px 6px rgba(43, 36, 24, 0.04);
}
.nav-menu li a {
  display: block;
  padding: 0.55rem 1.1rem;
  color: #2B2418;
  text-decoration: none;
  font-size: 0.9rem;
  transition: background 160ms ease, color 160ms ease;
}
.nav-menu li a:hover,
.nav-menu li a:focus-visible {
  background: rgba(180, 135, 72, 0.10);
  color: #6B1F2E;
  outline: none;
}
.nav-menu__heading {
  padding: 0.5rem 1.1rem 0.25rem;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6B1F2E;
}

/* --- 37. Utility icons area (right side of header) --- */
.site-header__utility {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.utility-link {
  color: rgba(43, 36, 24, 0.68);
  text-decoration: none;
  padding: 0.35rem;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  transition: color 200ms ease, background 200ms ease;
}
.utility-link:hover {
  color: #6B1F2E;
  background: rgba(180, 135, 72, 0.10);
}
.utility-link:focus-visible {
  outline: 2px solid rgba(107, 31, 46, 0.35);
  outline-offset: 2px;
}
.utility-link__label {
  font-size: 0.85rem;
  font-weight: 500;
}
@media (max-width: 900px) {
  .utility-link__label { display: none; }
}

/* --- 38. Mobile menu button (visible only on small screens) --- */
.site-header__menu {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 26px;
  height: 20px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}
.site-header__menu span {
  display: block;
  height: 2px;
  background: #2B2418;
  border-radius: 1px;
  transition: transform 200ms ease, opacity 200ms ease;
}

@media (max-width: 900px) {
  .site-nav { display: none; }
  .site-header__menu { display: flex; }
  .site-header__inner > .site-header__utility { gap: 0.5rem; }
}

/* ============================================================================
   PHASE 5 — Section-page unification.
   Every section page (/atlas, /learn, /hymnal, /tools, /find-a-verse,
   /devotionals, /sanctuary, /prayers, /iconography, /letters, /community)
   gets consistent hero typography, spacing, and content presentation via
   these CSS overrides. No HTML restructure — just visual normalization.
   ========================================================================== */

/* --- 40. Unified page-hero across all section pages --- */
.page-hero,
.section-hero,
.sanctuary-hero {
  padding: clamp(3rem, 8vh, 5.5rem) 0 clamp(2.5rem, 5vh, 4rem);
  text-align: center;
  background: linear-gradient(180deg, #FDFBF5 0%, #FBF6E9 100%);
  position: relative;
  border-bottom: 1px solid rgba(180, 135, 72, 0.15);
}
.page-hero__inner,
.section-hero__inner,
.sanctuary-hero__inner {
  max-width: 44rem;
  margin: 0 auto;
  padding: 0 clamp(1rem, 3vw, 2rem);
}
/* Kicker text above title on section pages */
.page-hero .kicker,
.page-hero__kicker,
.section-hero__kicker,
.page-hero p.eyebrow,
.page-hero__eyebrow {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 500;
  margin: 0 0 0.65rem;
  font-family: "Inter", system-ui, sans-serif;
}
/* Title on section pages */
.page-hero h1,
.section-hero h1,
.sanctuary-hero h1,
main > header h1 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 4.5vw, 3.2rem);
  font-weight: 500;
  letter-spacing: -0.012em;
  color: #2B2418;
  margin: 0 0 0.75rem;
  line-height: 1.12;
}
/* Lede paragraph */
.page-hero .lede,
.page-hero__lede,
.section-hero__lede,
.page-hero p:not(.eyebrow):not(.kicker) {
  font-size: clamp(1rem, 1.8vw, 1.15rem);
  color: rgba(43, 36, 24, 0.78);
  line-height: 1.6;
  max-width: 38rem;
  margin: 0.5rem auto 0;
}

/* --- 41. Main content prose containers on section pages --- */
main .container--prose,
main .prose,
article.prose {
  max-width: 42rem;
  padding: clamp(1.5rem, 4vw, 2.5rem) clamp(1rem, 3vw, 2rem);
  margin: 0 auto;
  font-size: 1.05rem;
  line-height: 1.72;
  color: #2B2418;
}
main .container--prose h2,
main .prose h2,
article.prose h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.85rem;
  font-weight: 500;
  letter-spacing: -0.008em;
  margin-top: 2.5rem;
  margin-bottom: 0.5rem;
}
main .container--prose h3,
main .prose h3 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.4rem;
  font-weight: 500;
  margin-top: 1.75rem;
  margin-bottom: 0.35rem;
}
main .container--prose p,
main .prose p {
  margin: 0 0 1.1rem;
}
main .container--prose a:not(.btn),
main .prose a:not(.btn) {
  color: #6B1F2E;
  text-decoration-color: rgba(180, 135, 72, 0.6);
  text-underline-offset: 0.15em;
}
main .container--prose a:hover:not(.btn),
main .prose a:hover:not(.btn) {
  color: #4A1520;
  text-decoration-color: #B48748;
}

/* --- 42. Section-page sibling/related-pathway footer (before global footer) --- */
.related-pathways {
  padding: clamp(3rem, 6vh, 5rem) 0;
  background: #F6EFDF;
  border-top: 1px solid rgba(180, 135, 72, 0.20);
}
.related-pathways__inner {
  max-width: 64rem;
  margin: 0 auto;
  padding: 0 clamp(1rem, 3vw, 2rem);
  text-align: center;
}
.related-pathways__kicker {
  color: #6B1F2E;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.75rem;
  font-weight: 500;
  margin-bottom: 0.6rem;
}
.related-pathways__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.5rem, 2.8vw, 2rem);
  font-weight: 500;
  color: #2B2418;
  margin: 0 0 1.5rem;
}
.related-pathways__grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.related-pathways__link {
  padding: 0.85rem 1.1rem;
  background: #FFFEFB;
  border: 1px solid rgba(180, 135, 72, 0.22);
  border-radius: 8px;
  color: #2B2418;
  text-decoration: none;
  font-weight: 500;
  transition: border-color 200ms ease, transform 200ms ease, background 200ms ease;
}
.related-pathways__link:hover {
  border-color: rgba(107, 31, 46, 0.4);
  background: #FFFCF5;
  transform: translateY(-1px);
  color: #6B1F2E;
}

/* ============================================================================
   PHASE 6 — Component consolidation.
   Card variants unified. All cards inherit shared foundation; variants
   only differ in size/emphasis.
   ========================================================================== */

/* --- 43. Base card foundation (applies to all card-like elements) --- */
.foundations__card,
.vod-card,
.media-card,
.start-here__card,
.channel,
.hotd {
  background: #FFFEFB;
  border-radius: 10px;
  border: 1px solid rgba(180, 135, 72, 0.14);
  transition: transform 260ms cubic-bezier(.2,.7,.3,1),
              box-shadow 260ms cubic-bezier(.2,.7,.3,1),
              border-color 260ms ease;
}
.foundations__card:hover,
.vod-card:hover,
.media-card:hover,
.start-here__card:hover,
.channel:hover {
  transform: translateY(-2px);
  border-color: rgba(180, 135, 72, 0.35);
  box-shadow: 0 6px 12px rgba(43, 36, 24, 0.05),
              0 20px 40px -22px rgba(43, 36, 24, 0.14);
}

/* ============================================================================
   PHASE 7 — Mobile-first refinements.
   Ensures every new component reads well on phones.
   ========================================================================== */

@media (max-width: 900px) {
  .site-header__inner { padding: 0.75rem 1rem; gap: 0.75rem; }
  .site-nav__list { gap: 0.5rem; }
}
@media (max-width: 720px) {
  .site-nav__list > .nav-item > .nav-trigger { font-size: 0.85rem; padding: 0.35rem 0.2rem; }
  .today-rhythm__grid { grid-template-columns: 1fr; gap: 1rem; }
  .pathways__grid { grid-template-columns: 1fr; gap: 0.85rem; }
  .pathway-card { padding: 1.35rem 1.15rem 1.15rem; }
  .pathway-card__title { font-size: 1.15rem; }
  .related-pathways__grid { grid-template-columns: 1fr 1fr; }
  .page-hero, .section-hero, .sanctuary-hero { padding: 2.5rem 1rem 2rem; }
}
@media (max-width: 480px) {
  .related-pathways__grid { grid-template-columns: 1fr; }
  main .container--prose { padding: 1.25rem 1rem; font-size: 1rem; }
  main .container--prose h2 { font-size: 1.5rem; }
}

/* ============================================================================
   PHASE 8 — BrandOS final polish.
   Small, purposeful identity touches. No decorative noise.
   ========================================================================== */

/* --- 44. Wordmark cross icon: subtle wax-color transition on hover --- */
.wordmark:hover .wordmark__cross {
  color: #6B1F2E;
  transition: color 240ms ease;
}
.wordmark .wordmark__cross {
  color: currentColor;
  transition: color 240ms ease;
}

/* --- 45. Skip link elegant styling --- */
.skip-link {
  background: #6B1F2E;
  color: #F6EFDF;
  padding: 0.6rem 1rem;
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* --- 46. Reduced motion respect --- */
@media (prefers-reduced-motion: reduce) {
  .wordmark:hover .c-ai,
  .foundations__card,
  .vod-card,
  .media-card,
  .start-here__card,
  .channel,
  [class$="__card"],
  .site-nav a::after,
  .site-nav a,
  .wordmark .wordmark__cross,
  .pathway-card,
  .pathway-card__mark,
  .pathway-card__cta,
  .pathway-card::before,
  .related-pathways__link,
  .utility-link { transition: none; }
  .foundations__card:hover,
  .vod-card:hover,
  .media-card:hover,
  .start-here__card:hover,
  [class$="__card"]:hover,
  .pathway-card:hover,
  .related-pathways__link:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .pathway-card,
  .pathway-card__mark,
  .pathway-card__cta,
  .pathway-card::before { transition: none; }
  .pathway-card:hover { transform: none; }
  .pathway-card:hover .pathway-card__mark { transform: none; }
  .pathway-card:hover .pathway-card__cta { transform: none; }
}

/* ============================================================================
   CROSSAIHUB 3.0 — PHASE 3.1 FOUNDATION LAYER (2026-07-07)
   ---------------------------------------------------------------------------
   Contract: this block DEFINES the 3.0 design tokens and utility classes
   without APPLYING them to any existing component. Existing 2.0 rules above
   remain in force. Later phases (3.3+) opt components in explicitly.

   Ratified in:
     • CROSSAIHUB_3_HOME_ARCHITECTURE_MASTERPLAN.md
     • CROSSAIHUB_3_IMPLEMENTATION_BLUEPRINT.md §3

   Scope of this phase:
     ✓ Color tokens (parchment · ink · wax burgundy · gold — sanctuary deep)
     ✓ Typography rhythm (three faces · major-third rem scale · 68ch prose)
     ✓ Spacing ladder (4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 · 128 px)
     ✓ Border / shadow / motion / focus / responsive VARIABLES only
     ✗ No component styling
     ✗ No structural HTML change
     ✗ No existing 2.0 rule modified
   ========================================================================== */

:root {

  /* ── 3.0 Palette (ratified — retire coral/rose/sky in later phases) ── */
  --ch3-parchment-1:         #FDFBF5;   /* page background */
  --ch3-parchment-2:         #F6EFDF;   /* card / table surface */
  --ch3-parchment-3:         #EAE2CB;   /* recessed alcove */
  --ch3-sanctuary-deep:      #3C2E1B;   /* iconography / atlas dim bg */

  --ch3-ink:                 #2B2418;   /* body text — never #000 */
  --ch3-ink-soft:            rgba(43, 36, 24, 0.72);  /* secondary text */
  --ch3-ink-whisper:         rgba(43, 36, 24, 0.42);  /* metadata, small caps */

  --ch3-wax-burgundy:        #6B1F2E;   /* kicker, citation, wax seal */
  --ch3-wax-burgundy-warm:   #7A2532;   /* burgundy hover state */

  --ch3-chalice-gold:        #B48748;   /* rules, borders, small cross */
  --ch3-chalice-gold-glint:  #D6A868;   /* rare highlight — one per view */

  /* ── 3.0 Typography families (loaded via existing Google Fonts link) ── */
  --ch3-ff-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --ch3-ff-body:    "Inter", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --ch3-ff-mono:    "IBM Plex Mono", "SF Mono", Consolas, monospace;

  /* ── 3.0 Type scale — major-third rem ladder ── */
  --ch3-fs-000: 0.75rem;    /* small caps, footnote */
  --ch3-fs-100: 0.875rem;   /* metadata */
  --ch3-fs-200: 1rem;       /* body */
  --ch3-fs-300: 1.25rem;    /* lede */
  --ch3-fs-400: 1.5rem;     /* h3 */
  --ch3-fs-500: 2rem;       /* h2 */
  --ch3-fs-600: 3rem;       /* h1 */
  --ch3-fs-700: 4.5rem;     /* hero display */

  /* ── 3.0 Line heights ── */
  --ch3-lh-body:    1.65;
  --ch3-lh-prose:   1.72;   /* long reading, ≤ 68ch */
  --ch3-lh-display: 1.15;

  --ch3-tracking-kicker: 0.14em;

  /* ── 3.0 Prose column rule (68 characters, inviolable) ── */
  --ch3-prose-column-max: 42rem;

  /* ── 3.0 Spacing ladder (rem equivalents of 4/8/12/16/24/32/48/64/96/128) ── */
  --ch3-s-1:  0.25rem;   /* 4px  */
  --ch3-s-2:  0.5rem;    /* 8px  */
  --ch3-s-3:  0.75rem;   /* 12px */
  --ch3-s-4:  1rem;      /* 16px */
  --ch3-s-5:  1.5rem;    /* 24px */
  --ch3-s-6:  2rem;      /* 32px */
  --ch3-s-7:  3rem;      /* 48px */
  --ch3-s-8:  4rem;      /* 64px */
  --ch3-s-9:  6rem;      /* 96px */
  --ch3-s-10: 8rem;      /* 128px */

  /* ── 3.0 Borders ── */
  --ch3-border-hair:    1px solid rgba(180, 135, 72, 0.20);
  --ch3-scripture-rule: 3px solid rgba(180, 135, 72, 0.55);
  --ch3-rule-gold-h:    linear-gradient(90deg,
                          transparent 0%,
                          rgba(180, 135, 72, 0.35) 30%,
                          rgba(180, 135, 72, 0.35) 70%,
                          transparent 100%);

  /* ── 3.0 Shadows (warm only — never neutral gray) ── */
  --ch3-shadow-none:  none;
  --ch3-shadow-warm:  0 4px 8px rgba(43, 36, 24, 0.06),
                      0 16px 36px -18px rgba(107, 31, 46, 0.20);

  /* ── 3.0 Motion (only 4 durations allowed site-wide) ── */
  --ch3-motion-breath-duration:    6000ms;
  --ch3-motion-breath-curve:       ease-in-out;
  --ch3-motion-underline-duration: 240ms;
  --ch3-motion-underline-curve:    cubic-bezier(0.2, 0.7, 0.3, 1);
  --ch3-motion-card-duration:      260ms;
  --ch3-motion-card-curve:         cubic-bezier(0.2, 0.7, 0.3, 1);
  --ch3-motion-arrow-duration:     200ms;
  --ch3-motion-arrow-curve:        cubic-bezier(0.2, 0.7, 0.3, 1);

  /* ── 3.0 Focus ring ── */
  --ch3-focus-ring:    3px solid rgba(107, 31, 46, 0.35);
  --ch3-focus-offset:  3px;

  /* ── 3.0 Responsive breakpoints (reference — used by later @media queries) ── */
  --ch3-bp-mobile:  480px;
  --ch3-bp-tablet:  900px;
}

/* ── Reduced motion — disable the four site-wide motions gracefully ── */
@media (prefers-reduced-motion: reduce) {
  :root {
    --ch3-motion-breath-duration:    0ms;
    --ch3-motion-underline-duration: 0ms;
    --ch3-motion-card-duration:      0ms;
    --ch3-motion-arrow-duration:     0ms;
  }
}

/* ============================================================================
   3.0 Utility classes — AVAILABLE but not yet APPLIED by Phase 3.1.
   Later phases opt components in explicitly. Present here so that any
   component author can preview the 3.0 look by adding `class="ch3-*"` to a
   test element without touching production markup.
   ========================================================================== */

.ch3-prose {
  max-width: var(--ch3-prose-column-max);
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-200);
  line-height: var(--ch3-lh-prose);
  color: var(--ch3-ink);
  margin-inline: auto;
  padding-inline: var(--ch3-s-4);
}

.ch3-display {
  font-family: var(--ch3-ff-display);
  font-weight: 500;
  line-height: var(--ch3-lh-display);
  letter-spacing: -0.008em;
  color: var(--ch3-ink);
}

.ch3-kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  font-weight: 500;
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-tracking-kicker);
  text-transform: uppercase;
}

.ch3-scripture {
  border-left: var(--ch3-scripture-rule);
  padding-left: var(--ch3-s-5);
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: var(--ch3-fs-300);
  color: var(--ch3-ink);
  line-height: var(--ch3-lh-prose);
}
.ch3-scripture cite,
.ch3-citation {
  display: block;
  font-family: var(--ch3-ff-body);
  font-style: normal;
  font-weight: 500;
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: var(--ch3-s-2);
}

.ch3-rule-gold {
  height: 1px;
  border: 0;
  background: var(--ch3-rule-gold-h);
  margin: var(--ch3-s-6) auto;
  width: 240px;
}

/* Phase 3.1 END */

/* ========================================================================
   CROSSAIHUB 3.0 — PHASE 3.2 ROOM SHELL (2026-07-07)
   Additive overlay. Restyles nav (front-door ribbon) + footer (Exit Blessing)
   + mobile hamburger (small door) using ONLY the Phase 3.1 tokens.
   Wordmark "AI" tint applied here per the Phase 3.2 brief. All 2.0 layout
   survives underneath — this layer wins by specificity + last-declared order.
   ==================================================================== */

/* -------- 1. FRONT DOOR RIBBON — .site-header ----------------------- */
.site-header {
  background: var(--ch3-parchment-1);
  border-bottom: 1px solid rgba(180, 135, 72, 0.18);
  box-shadow: 0 1px 0 0 rgba(180, 135, 72, 0.06);
  padding-top: var(--ch3-s-3);
  padding-bottom: var(--ch3-s-3);
}
.site-header__inner {
  max-width: 76rem;
  padding-left: var(--ch3-s-5);
  padding-right: var(--ch3-s-5);
}

/* -------- 2. WORDMARK AS DOOR PLATE --------------------------------- */
.wordmark {
  color: var(--ch3-ink);
  font-family: var(--ch3-ff-display);
  letter-spacing: 0.008em;
}
.wordmark__cross {
  color: var(--ch3-wax-burgundy);
}
.wordmark__text {
  font-family: var(--ch3-ff-display);
  font-weight: 500;
  letter-spacing: 0.008em;
}
.wordmark__text .c-cross,
.wordmark__text .c-hub {
  color: var(--ch3-ink);
  -webkit-text-fill-color: var(--ch3-ink);
  background: none;
  -webkit-background-clip: initial;
          background-clip: initial;
}
.wordmark__text .c-ai {
  color: var(--ch3-wax-burgundy) !important;
  -webkit-text-fill-color: var(--ch3-wax-burgundy) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
          background-clip: initial !important;
  font-style: italic;
  font-weight: 500;
}

/* -------- 3. NAV RIBBON — quiet doorbell buttons -------------------- */
.site-nav__list {
  gap: var(--ch3-s-6);
}
.nav-item .nav-trigger {
  font-family: var(--ch3-ff-body);
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--ch3-ink-soft);
  letter-spacing: 0.01em;
  padding: var(--ch3-s-2) 0;
  background: transparent;
  border: 0;
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
  position: relative;
  cursor: pointer;
}
.nav-item .nav-trigger::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 0;
  height: 1px;
  background: var(--ch3-chalice-gold);
  transform: translateX(-50%);
  transition: width var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.nav-item .nav-trigger:hover,
.nav-item .nav-trigger:focus-visible,
.nav-item .nav-trigger[aria-expanded="true"] {
  color: var(--ch3-ink);
}
.nav-item .nav-trigger:hover::after,
.nav-item .nav-trigger:focus-visible::after,
.nav-item .nav-trigger[aria-expanded="true"]::after {
  width: 100%;
}
.nav-item .nav-trigger:focus-visible {
  outline: var(--ch3-focus-ring);
  outline-offset: 4px;
  border-radius: 3px;
}

/* Dropdown menus reshaped as parchment cards */
.nav-menu {
  background: var(--ch3-parchment-1);
  border: 1px solid rgba(180, 135, 72, 0.22);
  border-radius: 4px;
  box-shadow: var(--ch3-shadow-warm);
  padding: var(--ch3-s-4);
}
.nav-menu li a {
  color: var(--ch3-ink-soft);
  font-family: var(--ch3-ff-body);
  font-size: 0.92rem;
  padding: var(--ch3-s-2) var(--ch3-s-3);
  border-radius: 3px;
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              background var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.nav-menu li a:hover,
.nav-menu li a:focus-visible {
  color: var(--ch3-wax-burgundy);
  background: rgba(180, 135, 72, 0.06);
}
.nav-menu__heading {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  font-weight: 600;
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  color: var(--ch3-ink-whisper);
  padding: var(--ch3-s-2) var(--ch3-s-3);
  margin-bottom: var(--ch3-s-2);
  border-bottom: 1px solid rgba(180, 135, 72, 0.14);
}

/* Utility icons — smaller, softer */
.site-header__utility {
  gap: var(--ch3-s-3);
}
.utility-link {
  color: var(--ch3-ink-whisper);
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.utility-link:hover,
.utility-link:focus-visible {
  color: var(--ch3-wax-burgundy);
}

/* -------- 4. HAMBURGER — small side door ---------------------------- */
.site-header__menu {
  background: transparent;
  border: 1px solid rgba(180, 135, 72, 0.22);
  border-radius: 3px;
  padding: 8px 10px;
  width: 40px;
  height: 40px;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              background var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.site-header__menu span {
  display: block;
  width: 18px;
  height: 1.5px;
  background: var(--ch3-ink);
  margin: 3px auto;
  transition: transform var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              opacity var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
  border-radius: 1px;
}
.site-header__menu:hover,
.site-header__menu:focus-visible {
  border-color: var(--ch3-wax-burgundy);
  background: rgba(180, 135, 72, 0.05);
}
.site-header__menu[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(4.5px) rotate(45deg);
}
.site-header__menu[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
}
.site-header__menu[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-4.5px) rotate(-45deg);
}

/* -------- 5. MOBILE — nav collapses into small door ---------------- */
@media (max-width: 899px) {
  .site-nav {
    display: none;
    order: 3;
    width: 100%;
    margin-top: var(--ch3-s-4);
  }
  .site-header[data-menu-open="true"] .site-nav,
  .site-header .site-nav[data-open="true"] {
    display: block;
  }
  .site-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: var(--ch3-s-2);
  }
  .nav-item {
    border-bottom: 1px solid rgba(180, 135, 72, 0.12);
    padding-bottom: var(--ch3-s-2);
  }
  .nav-item:last-child { border-bottom: 0; }
  .nav-item .nav-trigger {
    display: block;
    text-align: left;
    padding: var(--ch3-s-3) 0;
    font-size: 1.05rem;
  }
  .nav-menu {
    position: static;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    padding: 0 0 var(--ch3-s-3) var(--ch3-s-3);
    background: transparent;
  }
  .site-header__menu {
    display: inline-flex;
  }
  .site-header__utility {
    order: 2;
  }
  .site-header__inner {
    flex-wrap: wrap;
    row-gap: var(--ch3-s-2);
  }
}

/* -------- 6. EXIT BLESSING FOOTER — .site-footer.ch3-exit-blessing -- */
.site-footer.ch3-exit-blessing {
  background: var(--ch3-parchment-2);
  color: var(--ch3-ink);
  padding: var(--ch3-s-9) var(--ch3-s-5) var(--ch3-s-7);
  border-top: 1px solid rgba(180, 135, 72, 0.18);
  margin-top: var(--ch3-s-9);
  font-family: var(--ch3-ff-body);
  text-align: center;
}
.ch3-blessing-inner {
  max-width: 42rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ch3-s-4);
}

/* Coffee Bench — soft italic, warm, no CTAs */
.ch3-coffee-bench {
  font-family: var(--ch3-ff-body);
  font-style: italic;
  font-size: 0.98rem;
  line-height: var(--ch3-lh-prose);
  color: var(--ch3-ink-soft);
  max-width: 34rem;
  margin: 0 auto var(--ch3-s-4);
}
.ch3-coffee-bench a {
  color: var(--ch3-wax-burgundy);
  text-decoration: none;
  border-bottom: 1px solid rgba(107, 31, 46, 0.22);
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              border-color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.ch3-coffee-bench a:hover,
.ch3-coffee-bench a:focus-visible {
  color: var(--ch3-wax-burgundy-warm);
  border-color: var(--ch3-wax-burgundy);
}
.ch3-coffee-bench__more {
  font-style: normal;
}

/* Wax seal — natural end of the journey. CSS-only medallion */
.ch3-blessing-mark {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 32%, var(--ch3-wax-burgundy-warm) 0%, var(--ch3-wax-burgundy) 60%, #4d1621 100%);
  box-shadow: inset 2px 3px 6px rgba(255, 255, 255, 0.14),
              inset -2px -3px 6px rgba(0, 0, 0, 0.30),
              0 4px 12px rgba(107, 31, 46, 0.22);
  position: relative;
  margin: var(--ch3-s-3) auto;
}
.ch3-blessing-mark::before,
.ch3-blessing-mark::after {
  content: "";
  position: absolute;
  background: var(--ch3-chalice-gold-glint);
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.35));
}
.ch3-blessing-mark::before {
  /* vertical bar of cross */
  width: 6px;
  height: 44px;
  top: 26px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 1px;
}
.ch3-blessing-mark::after {
  /* horizontal bar of cross */
  width: 30px;
  height: 6px;
  top: 42px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 1px;
}

/* Exit blessing text — the last line the visitor reads */
.ch3-blessing-text {
  font-family: var(--ch3-ff-display);
  font-size: var(--ch3-fs-400);
  font-style: italic;
  color: var(--ch3-ink);
  line-height: var(--ch3-lh-display);
  margin: 0;
  max-width: 30rem;
}
.ch3-scripture-citation {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-ink-whisper);
  letter-spacing: 0.06em;
  margin: 0 0 var(--ch3-s-4);
}

/* Signature line */
.ch3-signature {
  font-family: var(--ch3-ff-display);
  font-size: 0.95rem;
  color: var(--ch3-ink-soft);
  margin: 0;
}
.ch3-signoff {
  font-family: var(--ch3-ff-body);
  font-size: 0.82rem;
  color: var(--ch3-ink-whisper);
  letter-spacing: 0.02em;
  margin: var(--ch3-s-2) 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--ch3-s-2);
}
.ch3-signoff a {
  color: var(--ch3-ink-soft);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              border-color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
}
.ch3-signoff a:hover,
.ch3-signoff a:focus-visible {
  color: var(--ch3-wax-burgundy);
  border-bottom-color: var(--ch3-wax-burgundy);
}
.ch3-signoff__sep {
  opacity: 0.4;
}

/* No-track badge — kept, softened */
.site-footer.ch3-exit-blessing .no-track-badge {
  margin-top: var(--ch3-s-5);
  color: var(--ch3-ink-whisper);
  font-size: 0.78rem;
  background: transparent;
  border: 0;
  padding: var(--ch3-s-2) var(--ch3-s-3);
  text-decoration: none;
  border-radius: 3px;
  transition: color var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.site-footer.ch3-exit-blessing .no-track-badge:hover,
.site-footer.ch3-exit-blessing .no-track-badge:focus-visible {
  color: var(--ch3-wax-burgundy);
}

/* Mobile footer tuning */
@media (max-width: 480px) {
  .site-footer.ch3-exit-blessing {
    padding: var(--ch3-s-7) var(--ch3-s-4) var(--ch3-s-5);
  }
  .ch3-blessing-text {
    font-size: 1.35rem;
  }
  .ch3-signoff {
    font-size: 0.75rem;
  }
}

/* Reduced motion — remove all Room-shell transitions */
@media (prefers-reduced-motion: reduce) {
  .site-header, .wordmark, .nav-trigger, .nav-trigger::after,
  .nav-menu li a, .utility-link, .site-header__menu,
  .site-header__menu span, .ch3-coffee-bench a, .ch3-signoff a,
  .site-footer.ch3-exit-blessing .no-track-badge {
    transition: none !important;
  }
}

/* Phase 3.2 END */

/* ========================================================================
   CROSSAIHUB 3.0 — PHASE 3.3 ROOM 1: FRONT DOOR HERO (2026-07-07)
   Additive overlay. Replaces the old .cinematic-hero visual with the
   ratified painted door composition. Silent, single peg-sign CTA, no
   headline overlay (the stone lintel IS the headline, inside the painting).
   Respects House Bible Part 6 (AI absent from this frame), Part 7 (cinematic
   still, no scroll animation), Part 8 (emotional target: "I feel welcomed").
   ==================================================================== */
.front-door-hero {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 66vh;
  max-height: calc(100vh - 60px);
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.front-door-hero__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 42%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
/* The single invitation — an invisible clickable overlay
   sitting exactly over the painted peg-sign in the artwork. */
.front-door-hero__peg {
  position: absolute;
  right: 4%;
  top: 44%;
  width: 12%;
  height: 22%;
  min-width: 96px;
  min-height: 96px;
  border-radius: 6px;
  outline: 0;
  transition: transform var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve),
              filter var(--ch3-motion-underline-duration) var(--ch3-motion-underline-curve);
  z-index: 3;
}
.front-door-hero__peg:hover {
  transform: rotate(-1.2deg) translateY(1px);
  filter: brightness(1.05);
}
.front-door-hero__peg:focus-visible {
  outline: var(--ch3-focus-ring);
  outline-offset: 2px;
}
/* Silent scroll link — active on keyboard for accessibility only. */
.front-door-hero__silent-next {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 40%;
  height: 6%;
  transform: translateX(-50%);
  z-index: 2;
}
/* Screen-reader-only label for the peg-sign */
.front-door-hero .visually-hidden {
  position: absolute;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
}
/* Mobile — portrait crop, peg still tappable */
@media (max-width: 899px) {
  .front-door-hero {
    aspect-ratio: 3 / 4;
    min-height: 72vh;
  }
  .front-door-hero__painting {
    object-position: center 40%;
  }
  .front-door-hero__peg {
    right: 6%;
    top: 46%;
    width: 22%;
    height: 16%;
  }
}
@media (max-width: 480px) {
  .front-door-hero {
    aspect-ratio: 9 / 16;
    min-height: 78vh;
  }
  .front-door-hero__peg {
    right: 5%;
    top: 48%;
    width: 26%;
    height: 14%;
  }
}
/* Reduced motion — remove even the small hover tilt */
@media (prefers-reduced-motion: reduce) {
  .front-door-hero__peg,
  .front-door-hero__peg:hover {
    transition: none !important;
    transform: none !important;
  }
}

/* Phase 3.3 Room 1 END */

/* ========================================================================
   CROSSAIHUB 3.0 — PHASE 3.3 ROOM 2: KITCHEN TABLE (2026-07-07)
   Cinematic transition. Full-viewport painted overhead of the household's
   1782 kitchen table. KJV Bible + hand-copied hymn sheet + folded
   "today's letter first draft to Chapel" page + blue enamel mug + brass
   candlestick + Joshua 24:15 sampler on the wall. The visitor walks from
   the Front Door into the Kitchen. No AI, no screens. The existing
   today-rhythm block with today's verse/hymn data continues below.
   ==================================================================== */
.kitchen-table-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.14);
}
.kitchen-table-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 35% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.kitchen-table-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.82) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.kitchen-table-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.kitchen-table-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.05rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
/* Mobile — portrait crop */
@media (max-width: 899px) {
  .kitchen-table-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .kitchen-table-room__painting { object-position: 30% 50%; }
  .kitchen-table-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .kitchen-table-room__footline { font-size: 0.95rem; }
}
@media (max-width: 480px) {
  .kitchen-table-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}

/* Phase 3.3 Room 2 END */

/* ========================================================================
   CROSSAIHUB HALLWAY FIVE DOORWAYS · NAVIGATION CABINET (2026-07-07)
   ---------------------------------------------------------------------
   IMPORTANT — this block is a NAVIGATION COMPONENT, not one of the 19
   canonical rooms of the CrossAIHub House. Per Master Visual Bible §6,
   the 19 canonical rooms are numbered 1 (Front Door) through 19 (Chapel
   Garden). The Five Doorways is an architectural artifact of the central
   hallway — a Shaker-built five-cupboard cabinet that lives on the wall
   of the middle-floor hallway and functions as the household's navigation
   between Read · Sing · Pray · Learn · Family. Exhibited on the homepage
   between the Kitchen Table Room and the Family Room. Each cupboard door
   is an invisible clickable hotspot pointing to /find-a-verse/, /hymnal/,
   /prayers/, /learn/, /community/ respectively. Hover swings one door a
   hair open. Illustrated register (1960s Christian children's book plate).
   ==================================================================== */
.hallway-five-doorways {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.hallway-five-doorways__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.hallway-five-doorways__kicker {
  position: absolute;
  top: var(--ch3-s-5);
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0;
  padding: var(--ch3-s-2) var(--ch3-s-4);
  background: rgba(253, 251, 245, 0.72);
  border-radius: 2px;
  z-index: 3;
}
/* Each door is an invisible clickable overlay sized and positioned
   to match its painted door on the cabinet. Hover swings the door
   a subtle 1.5° open on its right-side hinge (or left for the ajar Sing door).
   Percentages match the plate 03 painted composition at aspect 16:9. */
.hallway-five-doorways__door {
  position: absolute;
  outline: 0;
  border: 0;
  border-radius: 3px;
  transform-origin: right center;
  transition: transform var(--ch3-motion-card-duration) var(--ch3-motion-card-curve),
              background var(--ch3-motion-card-duration) var(--ch3-motion-card-curve);
  z-index: 4;
}
.hallway-five-doorways__door:hover {
  transform: rotate(-2deg);
  background: rgba(180, 135, 72, 0.06);
}
.hallway-five-doorways__door:focus-visible {
  outline: var(--ch3-focus-ring);
  outline-offset: 2px;
}
/* Bottom row of cupboard doors (approximate percentages of the painting) */
.hallway-five-doorways__door--read   { left: 20%; top: 46%; width: 9%;  height: 42%; transform-origin: left  center; }
.hallway-five-doorways__door--sing   { left: 30%; top: 46%; width: 9%;  height: 42%; transform-origin: left  center; }
.hallway-five-doorways__door--pray   { left: 40%; top: 46%; width: 9%;  height: 42%; transform-origin: right center; }
.hallway-five-doorways__door--learn  { left: 50%; top: 46%; width: 9%;  height: 42%; transform-origin: right center; }
.hallway-five-doorways__door--family { left: 60%; top: 46%; width: 9%;  height: 42%; transform-origin: right center; }
.hallway-five-doorways__door--sing:hover  { transform: rotate(3deg); }
.hallway-five-doorways__door--pray:hover,
.hallway-five-doorways__door--learn:hover,
.hallway-five-doorways__door--family:hover { transform: rotate(2deg); }

/* Mobile — portrait crop of the cabinet, doors stacked as a column of taps */
@media (max-width: 899px) {
  .hallway-five-doorways {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .hallway-five-doorways__painting {
    object-position: center 55%;
    object-fit: cover;
  }
  /* Enlarge tap targets on mobile — sized to the visible painted doors */
  .hallway-five-doorways__door        { top: 50%; height: 30%; width: 12%; }
  .hallway-five-doorways__door--read   { left: 15%; }
  .hallway-five-doorways__door--sing   { left: 28%; }
  .hallway-five-doorways__door--pray   { left: 41%; }
  .hallway-five-doorways__door--learn  { left: 54%; }
  .hallway-five-doorways__door--family { left: 67%; }
}
@media (max-width: 480px) {
  .hallway-five-doorways { aspect-ratio: 4 / 5; min-height: 60vh; }
  .hallway-five-doorways__door        { top: 52%; height: 26%; width: 14%; }
}

/* Reduced motion — no door swing */
@media (prefers-reduced-motion: reduce) {
  .hallway-five-doorways__door,
  .hallway-five-doorways__door:hover {
    transition: none !important;
    transform: none !important;
  }
}

/* Hallway Five Doorways END (navigation component, not a canonical room) */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 3: FAMILY ROOM (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 3 · The Family Room.
   Purpose: the heart of belonging; where people matter more than
   productivity; the household's monthly Sunday Family Council meets here
   under the Joshua 24:15 sampler above the hearth. AI is completely
   absent from this room. Sits between the Kitchen Table Room and the
   Hallway Five Doorways cabinet in the homepage visitor scroll.
   Emotional target: "A family can gather here without needing to
   perform." (Wyeth-Rockwell-Vermeer register.)
   ==================================================================== */
.family-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.family-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 55% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.family-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 40rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.family-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.family-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .family-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .family-room__painting { object-position: 60% 50%; }
  .family-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .family-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .family-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}

/* Room 3 · Family Room END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 4: MUSIC ROOM (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 4. East-wing addition (Gen 4 · 1867);
   piano commissioned (Gen 5 · 1893); guitar hand-carved (Gen 6 · 1934);
   Suno + KJV-verified hymn practice (Gen 9 · 2026). No amplification.
   No microphones. No cables. No LED. AI appears only as a hand-labelled
   working paper "Suno · take 7 · KJV verified" on the piano rack — the
   proprietary practice of the household making hymns under KJV
   discipline. Sits between Family Room and Hallway Five Doorways
   in the visitor scroll. Ribbon nav "Sing" remains the /hymnal/ entry
   point; the room itself has no CTA button.
   ==================================================================== */
.music-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.music-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.music-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.music-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.music-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .music-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .music-room__painting { object-position: center 50%; }
  .music-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .music-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .music-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}

/* Room 4 · Music Room END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 5: COFFEE CORNER (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 5. Established Gen 5 · 1893 beside the
   Library; shelf added Gen 7 · 1978; tradition preserved Gen 9 · 2026 —
   technology may assist, but hospitality remains human. AI absent from
   this frame entirely. Small round oak table, copper coffee pot, six
   pottery cups on a pine shelf, KJV Bible resting naturally beside the
   cups, antique wooden coffee grinder, handwritten recipe cards pinned
   to the plaster wall, dried herbs by the leaded-glass window. Emotional
   target: "I was not invited to consume. I was invited to sit, listen,
   and stay." Sits between Music Room and Hallway Five Doorways cabinet.
   ==================================================================== */
.coffee-corner-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.coffee-corner-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.coffee-corner-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 44rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.coffee-corner-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.coffee-corner-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .coffee-corner-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .coffee-corner-room__painting { object-position: center 50%; }
  .coffee-corner-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .coffee-corner-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .coffee-corner-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}

/* Room 5 · Coffee Corner END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 6: NURSERY (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 6. Nine generations of household children
   formed here since 1782. Child-scale Shaker furniture (Gen 5 · 1893);
   hand-drawn Holy Land map (Gen 6 · 1934); "Suffer the little children"
   embroidered pillow on the crib. Books before screens. AI absent. Sits
   between Coffee Corner and Hallway Five Doorways cabinet.
   Emotional target: "The children are read to before they are entertained."
   ==================================================================== */
.nursery-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.nursery-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.nursery-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.nursery-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.nursery-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .nursery-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .nursery-room__painting { object-position: center 50%; }
  .nursery-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .nursery-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .nursery-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}

/* Room 6 · Nursery END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 7: CHAPEL (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 7. Family chapel expanded 1839 after the
   Second Great Awakening. Fieldstone walls, white pine altar, oak benches,
   leather KJV Bible, brass candle holders, small empty wooden cross.
   No crucifix. No people. No modern objects.
   Emotional target: "Prayer before speech, always."
   ==================================================================== */
.chapel-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.chapel-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 40% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.chapel-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.chapel-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.chapel-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .chapel-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .chapel-room__painting { object-position: 40% 55%; }
  .chapel-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .chapel-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .chapel-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 7 · Chapel END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 8: LIBRARY (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 8. Shaker-inspired library added 1893.
   Handcrafted oak shelves, leather books, KJV Bible, ink bottle, quill,
   brass lamp, wool chair, linen curtains, fieldstone fireplace.
   Small wooden plaque: "AI is an aid, never the master." AI as philosophy
   only. No computers. No screens.
   Emotional target: "Wisdom is read slowly and kept quietly."
   ==================================================================== */
.library-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.library-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 30% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.library-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.library-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.library-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .library-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .library-room__painting { object-position: 28% 55%; }
  .library-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .library-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .library-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 8 · Library END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 9: SUNDAY LETTER DESK (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 9. Careful preparation before sharing
   wisdom. Oak writing desk, parchment letters, fountain pen, wax seal,
   leather folders, KJV Bible, brass candle, handwritten AI Ethics drafts.
   No computer. No screen. No technology visible.
   Emotional target: "One Sunday letter, sealed with care."
   ==================================================================== */
.letter-desk-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.letter-desk-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 45% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.letter-desk-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.letter-desk-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.letter-desk-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .letter-desk-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .letter-desk-room__painting { object-position: 42% 55%; }
  .letter-desk-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .letter-desk-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .letter-desk-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 9 · Sunday Letter Desk END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 10: WORKSHOP & AI ROOM (2026-07-07)
   ---------------------------------------------------------------------
   Master Visual Bible §6 · Room 10. Woodworking workshop added 1978,
   disciplined AI corner added 2007. Oak workbench, chisels, plane, leather
   notebook, parchment notes, brass hardware, fieldstone wall, pine
   shelves. ONE wooden-framed matte monitor displays only the italic line
   "AI is an aid, never the master." No interface. No dashboard. No blue
   glow. AI is a servant tool inside a family workshop. Only room in the
   house where a monitor is permitted.
   Emotional target: "AI is an aid, never the master."
   ==================================================================== */
.workshop-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.workshop-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.workshop-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.workshop-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.workshop-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .workshop-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .workshop-room__painting { object-position: 65% 55%; }
  .workshop-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .workshop-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .workshop-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 10 · Workshop & AI Room END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 11: CREATIVE STUDIO (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · Ground/middle floor west side · north-facing dormer light,
   honoured since Generation 5. A sanctuary of human hand and human eye.
   AI is absent by household choice. Pine drafting table, wooden brush stand,
   aged parchment stack, half-finished watercolor of a hymn broadsheet,
   oak card-catalogue cabinet, brass Shaker lamp, north-facing leaded window.
   Calibration: drafting table + brush stand focal centre-right (~55% x);
   window left, cabinet right — safe under mobile 3:4 crop with slight left bias.
   Emotional target: "Human creativity is honored here."
   ==================================================================== */
.creative-studio-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.creative-studio-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 45% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.creative-studio-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.creative-studio-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.creative-studio-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .creative-studio-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .creative-studio-room__painting { object-position: 50% 55%; }
  .creative-studio-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .creative-studio-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .creative-studio-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 11 · Creative Studio END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 12: ARCHIVE ROOM (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · deep interior · protected preservation. Fifty small oak
   drawers, brass labels (Family Letters, Hymn Books, Foundations MSS,
   Household Records). Oak reading table centre-right, two brass candlesticks,
   small leaded-glass window high on the wall, hand-carved step stool.
   Calibration: drawer wall left (~0-70% x), reading table right (~65-90% x)
   — mobile 3:4 crop needs slight right bias to keep both drawer wall and table.
   Emotional target: "Nothing published is ever thrown away."
   ==================================================================== */
.archive-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.archive-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 55% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.archive-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.archive-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.archive-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .archive-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .archive-room__painting { object-position: 55% 50%; }
  .archive-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .archive-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .archive-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 12 · Archive Room END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 13: THE SANCTUARY (attic) (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · upper floor attic · single dormer. Exposed oak rafters,
   pine floor, madder-red wool rug, Windsor chair, oak side table, open KJV
   Bible, footstool, pinned prayer "Speak, Lord, thy servant heareth."
   (1 Samuel 3:9, KJV) on the rafter beam.
   Calibration: chair centre-left (~35% x), Bible+table centre-right (~68%),
   prayer parchment upper-right (~72%) — keep chair, table, prayer all visible.
   Emotional target: "Nothing is asked of me here."
   ==================================================================== */
.sanctuary-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.sanctuary-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.sanctuary-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.sanctuary-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.sanctuary-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .sanctuary-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .sanctuary-room__painting { object-position: 55% 50%; }
  .sanctuary-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .sanctuary-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .sanctuary-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 13 · The Sanctuary END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 14: DEVOTIONAL LOFT (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · upper hallway. Long low oak shelf with 56 leather-bound
   devotional volumes — one per family member across nine generations.
   Two leaded-glass windows, brass candlestick sconces, Windsor chair.
   Calibration: bookshelf RIGHT (~55-100% x) is the critical identity;
   mobile 3:4 crop must preserve visible spines with lettered names+years.
   Emotional target: "The household has been reading for a long time."
   ==================================================================== */
.devotional-loft-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.devotional-loft-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.devotional-loft-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.devotional-loft-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.devotional-loft-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .devotional-loft-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .devotional-loft-room__painting { object-position: 65% 55%; }
  .devotional-loft-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .devotional-loft-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .devotional-loft-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 14 · Devotional Loft END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 15: THE GUEST ROOM (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · upper floor · far end of upper hallway. Hospitality since
   1782 without charge or record. Oak bed, linen bedding, welcome card,
   washstand w/ ceramic pitcher+bowl, oak wardrobe, Windsor chair, leaded
   window. Hebrews 13:2, KJV. AI absent.
   Calibration: bed centered, wardrobe left, chair right — symmetric.
   Emotional target: "I am welcome."
   ==================================================================== */
.guest-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.guest-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.guest-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.guest-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.guest-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .guest-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .guest-room__painting { object-position: 50% 55%; }
  .guest-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .guest-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .guest-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 15 · The Guest Room END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 16: THE KITCHEN GARDEN (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · outbuildings / garden south of house. Three raised beds,
   lavender/thyme, apple/pear/weeping cherry, wooden gate, garden path,
   fieldstone house wall in background. Genesis 2:15. AI absent.
   Calibration: raised beds foreground left-centre (~20-55%), gate at ~60%,
   house right — slight right bias for mobile keeps gate + house visible.
   Emotional target: "Quiet stewardship."
   ==================================================================== */
.kitchen-garden-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.kitchen-garden-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 60%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.kitchen-garden-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.kitchen-garden-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.kitchen-garden-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .kitchen-garden-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .kitchen-garden-room__painting { object-position: 55% 60%; }
  .kitchen-garden-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .kitchen-garden-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .kitchen-garden-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 16 · The Kitchen Garden END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 17: GARDEN BENCH & EXIT BLESSING (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · south end of chapel garden. Stone bench, bare fruit tree,
   iron gate standing open, folded gilt-edged blessing card w/ wax burgundy
   seal, one evening star, autumn dusk. Numbers 6:24-26 KJV. AI absent.
   Calibration: bench centre-left (~35-60% x), blessing card ~45% x,
   iron gate ~60% x, evening star upper-right. Slight left bias mobile
   keeps bench + card. CRITICAL: blessing card is the identity object.
   Emotional target: "The blessing at parting."
   ==================================================================== */
.garden-bench-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-1);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.garden-bench-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 45% 55%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.garden-bench-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.garden-bench-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.garden-bench-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .garden-bench-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .garden-bench-room__painting { object-position: 42% 55%; }
  .garden-bench-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .garden-bench-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .garden-bench-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 17 · Garden Bench & Exit Blessing END */

/* ========================================================================
   CROSSAIHUB 3.0 — ROOM 18: THE WOODWORKING SHED (2026-07-07)
   ---------------------------------------------------------------------
   House Bible · outbuilding · east side · covered walkway to kitchen.
   HUMAN ROOTS of craftsmanship. NOT the AI workshop (Room 10 is the only
   AI room). Brick floor, oak workbench, hand tools in rows (planes,
   chisels, mallet, saw), wood shavings, oak+pine planks, fieldstone walls,
   small leaded window. Work done unto the Lord. AI absent.
   Calibration: workbench centre (~40-70% x), tool wall behind bench,
   open plank door LEFT (~10-25%), covered walkway visible through door,
   window RIGHT (~85-95%). Slight right bias mobile keeps workbench + tools.
   Emotional target: "Honest labor, faithful work."
   ==================================================================== */
.woodworking-shed-room {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 60vh;
  max-height: 100vh;
  background: var(--ch3-parchment-2);
  overflow: hidden;
  isolation: isolate;
  border-top: 1px solid rgba(180, 135, 72, 0.10);
  border-bottom: 1px solid rgba(180, 135, 72, 0.10);
}
.woodworking-shed-room__painting {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 55% 50%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.woodworking-shed-room__overlay {
  position: absolute;
  left: 50%;
  bottom: var(--ch3-s-7);
  transform: translateX(-50%);
  max-width: 42rem;
  padding: var(--ch3-s-4) var(--ch3-s-6);
  text-align: center;
  background: linear-gradient(180deg,
    rgba(253, 251, 245, 0) 0%,
    rgba(253, 251, 245, 0.55) 45%,
    rgba(253, 251, 245, 0.85) 100%);
  border-radius: 3px;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
  z-index: 2;
}
.woodworking-shed-room__kicker {
  font-family: var(--ch3-ff-body);
  font-size: var(--ch3-fs-000);
  color: var(--ch3-wax-burgundy);
  letter-spacing: var(--ch3-kicker-tracking);
  text-transform: uppercase;
  margin: 0 0 var(--ch3-s-2);
}
.woodworking-shed-room__footline {
  font-family: var(--ch3-ff-display);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--ch3-ink-soft);
  margin: 0;
  line-height: var(--ch3-lh-prose);
}
@media (max-width: 899px) {
  .woodworking-shed-room {
    aspect-ratio: 3 / 4;
    min-height: 66vh;
  }
  .woodworking-shed-room__painting { object-position: 60% 50%; }
  .woodworking-shed-room__overlay {
    bottom: var(--ch3-s-5);
    padding: var(--ch3-s-3) var(--ch3-s-4);
  }
  .woodworking-shed-room__footline { font-size: 1rem; }
}
@media (max-width: 480px) {
  .woodworking-shed-room { aspect-ratio: 4 / 5; min-height: 60vh; }
}
/* Room 18 · The Woodworking Shed END */