.hero { flex: 0 0 255px; position: relative; overflow: hidden; color: white; background: linear-gradient(145deg, var(--green-950), var(--green-800)); }
.hero-pattern { position: absolute; inset: -40%; opacity: .11; transform: rotate(8deg); background-image: linear-gradient(30deg, transparent 42%, white 43%, white 44%, transparent 45%), linear-gradient(150deg, transparent 42%, white 43%, white 44%, transparent 45%); background-size: 54px 54px; }
.hero-content { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 22px 50px; text-align: center; }
.brand-mark { color: var(--gold-soft); font-size: 28px; line-height: 1; margin-bottom: 8px; }
.eyebrow, .header-kicker { text-transform: uppercase; letter-spacing: .16em; font-size: .65rem; font-weight: 700; opacity: .72; }
.hero h1 { margin-top: 7px; font-size: clamp(1.45rem, 5vw, 2.15rem); line-height: 1.15; letter-spacing: -.02em; }
.prayer-chip, .status-chip { margin-top: 12px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.1); backdrop-filter: blur(8px); border-radius: 999px; padding: 7px 14px; font-size: .78rem; font-weight: 650; }
.status-chip { margin-top: 7px; font-size: .68rem; opacity: .85; }
.home-panel { position: relative; z-index: 2; flex: 1; margin-top: -30px; border-radius: 30px 30px 0 0; background: var(--ivory); padding: 17px 18px calc(var(--footer-height) + 22px); overflow-y: auto; box-shadow: 0 -10px 30px rgba(0,0,0,.05); }
.ornament { display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--gold); margin: 0 auto 8px; max-width: 150px; }
.ornament span { height: 1px; flex: 1; background: var(--gold-soft); }.ornament i { font-style: normal; font-size: 11px; }
.date-info { text-align: center; color: var(--muted); font-size: .78rem; line-height: 1.55; }
.section-intro { text-align: center; margin: 22px 0 14px; font-size: .85rem; color: var(--muted); }
.page-content { flex: 1; overflow-y: auto; padding: 18px; padding-bottom: calc(var(--footer-height) + 20px); }