/* Member app — public church-site pages and website sections (devotional of the day, testimonies). Classes start with .mb- */
.mb-page, .mb-section { --mb-accent: var(--church, var(--primary, #4f46e5)); color: var(--ink, #0f172a); }
.mb-page { max-width: 820px; margin: 0 auto; }
.mb-page-head h1, .mb-devo-full h1, .mb-empty h1 { font-size: clamp(26px, 4vw, 36px); font-weight: 800; letter-spacing: -.02em; line-height: 1.15; margin: 0 0 8px; }
.mb-page-head p { color: var(--muted, #64748b); font-size: 17px; margin: 0 0 24px; }
.mb-section { margin: 40px 0; }
.mb-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.mb-head h2 { font-size: 22px; font-weight: 800; margin: 0; }
.mb-head a { font-weight: 700; color: var(--mb-accent); text-decoration: none; white-space: nowrap; }
.mb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.mb-quote { position: relative; margin: 0; padding: 22px 20px 18px; border-radius: 18px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.mb-quote::before { content: "“"; position: absolute; top: -4px; left: 14px; font: 800 60px/1 Georgia, serif; color: var(--mb-accent); opacity: .25; }
.mb-quote-title { display: block; font-size: 17px; margin-bottom: 6px; }
.mb-quote p { margin: 0 0 .8em; line-height: 1.65; color: var(--ink-2, #334155); }
.mb-quote cite { font-style: normal; font-weight: 700; font-size: 14px; color: var(--muted, #64748b); }
.mb-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 20px; border-radius: 999px; border: 0; background: var(--mb-accent); color: var(--on-church, #fff) !important;
  font: 700 15px var(--font, system-ui, sans-serif); text-decoration: none !important; cursor: pointer; }
.mb-btn-soft { background: var(--surface-3, #f1f5f9); color: var(--ink, #0f172a) !important; }
.mb-cta { margin: 18px 0 0; text-align: center; }
.mb-devo-card { padding: clamp(18px, 4vw, 32px); border-radius: 22px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); box-shadow: 0 8px 30px rgba(15, 23, 42, .06); }
.mb-devo-card h3 { font-size: 22px; font-weight: 800; margin: 6px 0 10px; }
.mb-devo-date { font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--mb-accent); }
.mb-verse { margin: 16px 0 20px; padding: 16px 20px; border-left: 5px solid var(--mb-accent); background: var(--surface-2, #f8fafc); border-radius: 0 14px 14px 0; }
.mb-verse p { margin: 0; font: italic 19px/1.6 Georgia, "Times New Roman", serif; color: var(--ink, #0f172a); }
.mb-verse cite { display: block; margin-top: 8px; font-style: normal; font-weight: 800; font-size: 14px; color: var(--mb-accent); }
.mb-prose { font-size: 17px; line-height: 1.75; color: var(--ink-2, #334155); }
.mb-prose p { margin: 0 0 1em; }
.mb-prayer, .mb-prayer-box { color: var(--ink-2, #334155); }
.mb-prayer-box { margin-top: 20px; padding: 16px 20px; border-radius: 14px; border: 1px dashed var(--border-strong, #cbd5e1); background: var(--surface-2, #f8fafc); }
.mb-prayer-box p { margin: 6px 0 0; font-style: italic; }
.mb-author { color: var(--muted, #64748b); margin: 16px 0 0; }
.mb-note { padding: 12px 16px; border-radius: 12px; background: var(--info-soft, #dbeafe); color: var(--info, #1d4ed8); }
.mb-daynav { display: flex; justify-content: space-between; gap: 12px; margin: 20px 0; }
.mb-empty { text-align: center; padding: 40px 20px; color: var(--muted, #64748b); }
.mb-app-cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 28px 0; padding: 16px 18px; border-radius: 18px; background: var(--surface-2, #f8fafc); border: 1px solid var(--border, #e5e7eb); }
.mb-app-cta img { border-radius: 12px; }
.mb-app-cta div { flex: 1; min-width: 180px; display: flex; flex-direction: column; }
.mb-app-cta span { color: var(--muted, #64748b); font-size: 14px; }
.mb-form { margin: 40px 0 0; padding: clamp(18px, 4vw, 28px); border-radius: 22px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e7eb); }
.mb-form h2 { font-size: 22px; font-weight: 800; margin: 0 0 6px; }
.mb-thanks { padding: 14px 16px; border-radius: 12px; background: var(--success-soft, #dcfce7); color: var(--success, #15803d); font-weight: 600; }