:root { --church-navy: #4b3025; --church-blue: #8b5e3c; --church-brown-dark: #3a251c; --church-brown-light: #f4ebe3; --church-ink: #2d241f; --bs-primary: #8b5e3c; --bs-primary-rgb: 139, 94, 60; --bs-link-color: #79502f; --bs-link-hover-color: #4b3025; --bs-focus-ring-color: rgb(139 94 60 / 25%); }
body { background: #f8fafc; color: var(--church-ink); min-height: 100vh; }
.bg-primary { background-color: var(--church-navy) !important; }
.text-primary { color: var(--church-blue) !important; }
.btn-primary { color: #fff; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--church-brown-dark); border-color: var(--church-brown-dark); }
.btn-outline-primary { color: var(--church-blue); border-color: var(--church-blue); }
.btn-outline-primary:hover, .btn-outline-primary:focus { background-color: var(--church-blue); border-color: var(--church-blue); color: #fff; }
.form-check-input:checked { background-color: var(--church-blue); border-color: var(--church-blue); }
.btn-primary { background-color: var(--church-blue); border-color: var(--church-blue); }
.hero { color: #fff; background: linear-gradient(125deg, #3a251c, #8b5e3c); }
.hero-icon { font-size: 8rem; line-height: 1; opacity: .8; }
.event-card { border: 1px solid #e2e8f0; border-radius: 1rem; box-shadow: 0 2px 8px rgb(15 23 42 / 3%); }
.event-card .card-body { padding: 1.25rem; }
.feature-box { background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.5rem; }
.date-tile { background: var(--church-brown-light); color: var(--church-brown-dark); border-radius: .8rem; padding: .6rem .2rem; text-align: center; display: flex; flex-direction: column; align-items: center; }
.date-tile span, .date-tile small { text-transform: uppercase; font-size: .72rem; font-weight: 700; letter-spacing: .04em; }
.date-tile strong { font-size: 1.8rem; line-height: 1.25; }
footer { margin-top: auto; }
.offline-page { display: grid; place-items: center; padding: 2rem; }
.offline-page main { max-width: 32rem; background: white; padding: 2rem; border-radius: 1rem; }
@media print { nav, footer, button { display: none !important; } body { background: #fff; } .event-card { box-shadow: none; break-inside: avoid; } }

.hero { background-color: #4b3025; color: #fff; background-repeat: no-repeat; }
.hero a { text-decoration: none; }
@media print { nav, footer, button, .btn { display: none !important; } body { background: #fff; } }