/* MemoirMaster shared styles.
   Loaded after each page's own <style>, so rules here win.
   Phase 1 (Nov 2026): footer, link contrast, mobile nav. More shared rules move here over time. */

:root { --mm-link: #8A6A3A; } /* 4.7:1 on cream; brand gold is 2.1:1 and fails for text */

/* Text links on light backgrounds */
p a:not([class]), li a:not([class]), td a:not([class]), dd a:not([class]),
.toc a, .related-posts a, .workbook-note a {
  color: var(--mm-link);
  text-decoration: underline;
  text-decoration-color: rgba(138, 106, 58, 0.4);
  text-underline-offset: 2px;
}
p a:not([class]):hover, li a:not([class]):hover, .toc a:hover, .related-posts a:hover { color: var(--sepia-dark, #4A3728); }

/* Links sitting on dark sections keep the light gold */
.final-cta a:not([class]), .quote-section a:not([class]), .cta-box a:not([class]),
.hero a:not([class]), .hero-chapter a:not([class]) { color: var(--gold, #C8A96E); }

/* Top navigation */
nav:not(.toc) li a:not([class]) { color: var(--parchment, #F5E6C8); text-decoration: none; }
nav:not(.toc) li a:not([class]):hover { color: var(--gold, #C8A96E); }
.mobile-toggle { display: none; background: none; border: none; color: var(--gold, #C8A96E); font-size: 1.5rem; line-height: 1; padding: 0.25rem 0.5rem; cursor: pointer; }
@media (max-width: 768px) {
  nav > .container, nav .container { position: relative; }
  nav ul { display: none; }
  .mobile-toggle { display: block; }
  nav ul.open { display: flex; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: var(--brown-deep, #2D1F14); padding: 1rem 2rem; gap: 1rem; z-index: 200; }
}

/* Shared footer */
footer.mm-footer { background: var(--brown-deep, #2D1F14); color: var(--parchment, #F5E6C8); text-align: center; padding: 3rem 1.5rem 2.5rem; font-family: 'Lora', Georgia, serif; line-height: 1.7; }
.mm-footer .mm-footer-brand { font-family: 'Playfair Display', Georgia, serif; font-size: 1.4rem; color: var(--gold, #C8A96E); margin-bottom: 1rem; }
.mm-footer .mm-footer-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 1.75rem; margin: 0 auto 1.25rem; max-width: 760px; }
footer.mm-footer a { color: var(--parchment, #F5E6C8); text-decoration: none; }
footer.mm-footer a:hover { color: var(--gold, #C8A96E); }
.mm-footer .mm-footer-contact { margin: 0 0 0.5rem; }
.mm-footer .mm-footer-contact a { color: var(--gold, #C8A96E); }
.mm-footer .mm-footer-legal { font-size: 0.85rem; margin: 0 0 1rem; }
.mm-footer .mm-footer-legal a { opacity: 0.8; }
.mm-footer .mm-footer-copy { font-size: 0.8rem; opacity: 0.7; margin: 0; }

/* Wide tables scroll inside their own box on phones instead of widening the page */
@media (max-width: 640px) {
  table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ===== Shared page components (Phase 2, Nov 2026) =====
   Used by the homepage and the services page. Prefix mm- so they never collide with older page styles. */
.mm-container { max-width: 1120px; margin: 0 auto; padding: 0 1.5rem; }
.mm-narrow { max-width: 760px; margin: 0 auto; padding: 0 1.5rem; }
.mm-section { padding: 5rem 0; }
.mm-section.cream { background: var(--cream, #FDF6EC); }
.mm-section.white { background: var(--warm-white, #FFFDF8); }
.mm-section.parchment { background: linear-gradient(180deg, var(--cream, #FDF6EC) 0%, var(--parchment, #F5E6C8) 100%); }
.mm-section.dark { background: var(--sepia-dark, #4A3728); color: var(--cream, #FDF6EC); }
.mm-center { text-align: center; }
.mm-eyebrow { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 700; font-size: 1rem; letter-spacing: 0.16em; text-transform: uppercase; color: #8A6A3A; margin: 0 0 0.75rem; }
.mm-section.dark .mm-eyebrow { color: var(--gold, #C8A96E); }
.mm-h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 2.3rem; line-height: 1.2; color: var(--sepia-dark, #4A3728); margin: 0 0 1rem; }
.mm-section.dark .mm-h2 { color: var(--warm-white, #FFFDF8); }
.mm-lead { font-size: 1.2rem; line-height: 1.7; color: var(--text-body, #4A3B2E); margin: 0 0 1.5rem; }
.mm-section.dark .mm-lead { color: var(--parchment, #F5E6C8); }
.mm-prose p { margin: 0 0 1.25rem; font-size: 1.08rem; line-height: 1.8; }

.mm-btn, a.mm-btn { display: inline-block; background: linear-gradient(135deg, var(--gold, #C8A96E), var(--gold-dark, #A07D4A)); color: var(--brown-deep, #2D1F14); font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: 1.1rem; line-height: 1.3; padding: 1rem 2.2rem; border-radius: 6px; text-decoration: none; text-align: center; box-shadow: 0 4px 18px rgba(160, 125, 74, 0.3); transition: transform .2s, box-shadow .2s; }
.mm-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 26px rgba(160, 125, 74, 0.45); color: var(--brown-deep, #2D1F14); }
.mm-btn-outline, a.mm-btn-outline { display: inline-block; border: 2px solid var(--gold, #C8A96E); color: var(--sepia-dark, #4A3728); background: transparent; font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: 1.05rem; line-height: 1.3; padding: calc(1rem - 2px) 2rem; border-radius: 6px; text-decoration: none; text-align: center; transition: background .2s; }
.mm-btn-outline:hover { background: var(--parchment, #F5E6C8); color: var(--sepia-dark, #4A3728); }
.mm-on-dark .mm-btn-outline, .mm-section.dark .mm-btn-outline { color: var(--parchment, #F5E6C8); }
.mm-on-dark .mm-btn-outline:hover, .mm-section.dark .mm-btn-outline:hover { background: rgba(200, 169, 110, 0.15); color: var(--warm-white, #FFFDF8); }
.mm-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; align-items: center; }
.mm-center .mm-actions { justify-content: center; }
.mm-note { font-size: 0.95rem; color: var(--text-muted, #6E5F4E); margin-top: 0.9rem; }
.mm-on-dark .mm-note, .mm-section.dark .mm-note { color: var(--parchment, #F5E6C8); opacity: 0.85; }

/* Three-path cards */
.mm-paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: stretch; margin-top: 2.75rem; }
.mm-path { position: relative; display: flex; flex-direction: column; background: var(--warm-white, #FFFDF8); border: 2px solid var(--parchment, #F5E6C8); border-radius: 12px; padding: 2.25rem 1.75rem 2rem; text-align: left; }
.mm-path.featured { border-color: var(--gold-dark, #A07D4A); box-shadow: 0 14px 40px rgba(74, 55, 40, 0.14); transform: translateY(-8px); }
.mm-path .mm-ribbon { position: absolute; top: -14px; left: 1.75rem; background: var(--sepia-dark, #4A3728); color: var(--parchment, #F5E6C8); font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.85rem; padding: 0.3rem 0.9rem; border-radius: 99px; }
.mm-path img.mm-path-icon { width: 56px; height: 56px; margin-bottom: 1rem; }
.mm-path h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.55rem; color: var(--sepia-dark, #4A3728); margin: 0 0 0.35rem; }
.mm-path .mm-path-tag { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.1rem; font-style: italic; color: #8A6A3A; margin: 0 0 1rem; }
.mm-path p { font-size: 1rem; line-height: 1.65; color: var(--text-body, #4A3B2E); margin: 0 0 1rem; }
.mm-path .mm-path-meta { font-size: 0.95rem; color: var(--text-muted, #6E5F4E); border-top: 1px solid var(--parchment, #F5E6C8); padding-top: 0.9rem; margin-top: auto; margin-bottom: 1.25rem; }
.mm-path .mm-btn, .mm-path .mm-btn-outline { width: 100%; }
.mm-path ul { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.mm-path li { position: relative; padding-left: 1.6rem; margin-bottom: 0.55rem; font-size: 0.98rem; line-height: 1.55; }
.mm-path li::before { content: "✓"; position: absolute; left: 0; color: var(--gold-dark, #A07D4A); font-weight: 700; }
.mm-path h4 { font-family: 'Lora', Georgia, serif; font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted, #6E5F4E); margin: 0.25rem 0 0.6rem; }
.mm-paths.two { grid-template-columns: repeat(2, 1fr); max-width: 980px; margin-left: auto; margin-right: auto; }

/* Numbered steps */
.mm-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 2.5rem; counter-reset: mmstep; }
.mm-steps.five { grid-template-columns: repeat(5, 1fr); gap: 1.25rem; }
.mm-step { counter-increment: mmstep; }
.mm-step::before { content: counter(mmstep); display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--gold, #C8A96E); color: var(--gold-dark, #A07D4A); font-family: 'Playfair Display', Georgia, serif; font-size: 1.4rem; font-weight: 700; margin: 0 auto 1rem; background: var(--warm-white, #FFFDF8); }
.mm-step h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.3rem; color: var(--sepia-dark, #4A3728); margin: 0 0 0.5rem; text-align: center; }
.mm-step p { font-size: 1rem; line-height: 1.65; text-align: center; margin: 0; }

/* Person block (photo + text) */
.mm-person { display: grid; grid-template-columns: 280px 1fr; gap: 3rem; align-items: center; }
.mm-person img { width: 100%; height: auto; border-radius: 12px; box-shadow: 0 14px 40px rgba(0, 0, 0, 0.18); }
.mm-person blockquote { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.45rem; font-style: italic; line-height: 1.5; color: var(--sepia-dark, #4A3728); border-left: 3px solid var(--gold, #C8A96E); padding-left: 1.25rem; margin: 1.5rem 0; }
.mm-callcard { display: flex; align-items: center; gap: 1.1rem; background: var(--warm-white, #FFFDF8); border: 2px solid var(--parchment, #F5E6C8); border-radius: 12px; padding: 1.1rem 1.25rem; max-width: 560px; margin: 2.5rem auto 0; text-align: left; }
.mm-callcard img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex: 0 0 64px; }
.mm-callcard p { margin: 0; font-size: 0.98rem; line-height: 1.5; }
.mm-callcard .mm-btn { padding: 0.8rem 1.4rem; font-size: 1rem; white-space: nowrap; margin-left: auto; }

/* Promise band */
.mm-promises { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 2.5rem; text-align: left; }
.mm-promise { border-top: 2px solid var(--gold, #C8A96E); padding-top: 1.25rem; }
.mm-promise h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.3rem; color: var(--warm-white, #FFFDF8); margin: 0 0 0.5rem; }
.mm-promise p { color: var(--parchment, #F5E6C8); font-size: 1rem; line-height: 1.65; margin: 0; }
.mm-bigquote { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.9rem; font-style: italic; line-height: 1.45; color: var(--cream, #FDF6EC); max-width: 760px; margin: 3.5rem auto 0; text-align: center; }

/* Figure */
.mm-figure { margin: 2.5rem 0 0; background: #fff; border: 1px solid var(--parchment, #F5E6C8); border-radius: 12px; padding: 1rem; box-shadow: 0 10px 30px rgba(74, 55, 40, 0.08); }
.mm-figure img { width: 100%; height: auto; display: block; }
.mm-figure figcaption { font-size: 0.92rem; color: var(--text-muted, #6E5F4E); text-align: center; margin-top: 0.75rem; }

/* Blog teaser cards */
.mm-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem; margin-top: 2.5rem; }
.mm-post { display: block; text-decoration: none; color: inherit; background: var(--warm-white, #FFFDF8); border-radius: 10px; overflow: hidden; border: 1px solid var(--parchment, #F5E6C8); transition: transform .2s, box-shadow .2s; }
.mm-post:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(74, 55, 40, 0.12); }
.mm-post img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.mm-post div { padding: 1.1rem 1.25rem 1.35rem; }
.mm-post time { font-size: 0.85rem; color: var(--text-muted, #6E5F4E); }
.mm-post h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.15rem; line-height: 1.35; color: var(--sepia-dark, #4A3728); margin: 0.3rem 0 0; }

/* FAQ */
.mm-faq { max-width: 780px; margin: 2.5rem auto 0; }
.mm-faq details { border-bottom: 1px solid var(--parchment, #F5E6C8); padding: 1.1rem 0; }
.mm-faq summary { cursor: pointer; list-style: none; font-family: 'Playfair Display', Georgia, serif; font-size: 1.2rem; color: var(--sepia-dark, #4A3728); padding-right: 2rem; position: relative; }
.mm-faq summary::-webkit-details-marker { display: none; }
.mm-faq summary::after { content: "+"; position: absolute; right: 0; top: 0; color: var(--gold-dark, #A07D4A); font-size: 1.5rem; line-height: 1; }
.mm-faq details[open] summary::after { content: "–"; }
.mm-faq details p { margin: 0.75rem 0 0; font-size: 1.02rem; line-height: 1.75; }

/* Who-it's-for grid */
.mm-who { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; margin-top: 2.5rem; text-align: left; }
.mm-who div { background: var(--warm-white, #FFFDF8); border: 1px solid var(--parchment, #F5E6C8); border-radius: 10px; padding: 1.5rem 1.6rem; }
.mm-who h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.25rem; color: var(--sepia-dark, #4A3728); margin: 0 0 0.5rem; }
.mm-who p { margin: 0; font-size: 1rem; line-height: 1.65; }

@media (max-width: 960px) {
  .mm-paths, .mm-paths.two { grid-template-columns: 1fr; max-width: 560px; margin-left: auto; margin-right: auto; }
  .mm-path.featured { transform: none; }
  .mm-steps.five { grid-template-columns: repeat(2, 1fr); }
  .mm-posts { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
  .mm-promises { grid-template-columns: 1fr; }
  .mm-person { grid-template-columns: 1fr; gap: 1.75rem; text-align: left; }
  .mm-person img { max-width: 260px; margin: 0 auto; }
}
@media (max-width: 640px) {
  .mm-section { padding: 3.5rem 0; }
  .mm-h2 { font-size: 1.85rem; }
  .mm-lead { font-size: 1.08rem; }
  .mm-steps, .mm-steps.five, .mm-who { grid-template-columns: 1fr; }
  .mm-actions > a { width: 100%; }
  .mm-callcard { flex-wrap: wrap; }
  .mm-callcard .mm-btn { width: 100%; margin-left: 0; }
  .mm-bigquote { font-size: 1.5rem; }
}

/* Dark CTA box in blog posts: keep emphasis readable */
.article-body .cta-box em, .article-body .cta-box strong { color: #E3C892; }

/* Blog post offers (inserted by /js/mm.js) */
.mm-offer { margin: 2.5rem 0; padding: 1.5rem; border-radius: 10px; font-family: inherit; }
.mm-offer p { margin: 0 0 .8rem; }
.mm-offer-book { background: #FFF8EC; border: 1px solid #E8D5B0; display: grid; gap: 1.25rem; align-items: center; }
.mm-offer-book img { width: 100%; max-width: 320px; height: auto; margin: 0 auto; display: block; border-radius: 6px; }
@media (min-width: 700px) { .mm-offer-book { grid-template-columns: 220px 1fr; } }
.mm-offer-quiz { background: #2D1F14; color: #F5E6C8; text-align: center; }
.mm-offer-quiz p { color: #F5E6C8; }
.article-body .mm-offer-eyebrow { font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: #8A6A3A; margin-bottom: .3rem; }
.article-body .mm-offer-title { font-size: 1.35rem; font-weight: 700; line-height: 1.3; color: #3A2E24; }
.article-body .mm-offer-quiz .mm-offer-title { color: #E3C892; }
.article-body .mm-offer em { color: inherit; }
.mm-offer-btns { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 0 !important; }
.mm-offer-quiz .mm-offer-btns { justify-content: center; }
.article-body a.mm-offer-btn { display: inline-block; background: #B8925A; color: #2D1F14; font-weight: 700; padding: .7rem 1.2rem; border-radius: 6px; text-decoration: none; }
.article-body a.mm-offer-btn:hover { background: #C8A96E; color: #2D1F14; }
.article-body a.mm-offer-btn-alt { background: transparent; color: #6E4F2A; border: 2px solid #B8925A; }