/* Church website looks. Each church picks one template (body class tpl-*) plus its own accent color (--accent).
   The default "dawn" look is the base styling in main.css; these rules adjust the rest. */

/* ---------- Shared pieces ---------- */
.church-site .section-tint { background: color-mix(in srgb, var(--accent) 9%, var(--white)); }
.church-site .hero-actions { margin-top: 1.4rem; }
.church-site .live-band { background: var(--night); color: var(--white); padding-block: 12px; }
.church-site .live-band .muted { color: #D9D3F5; }
.church-site .give-band { background: color-mix(in srgb, var(--accent) 14%, var(--paper)); }
.church-site .campaign { margin: 0 0 18px; max-width: 520px; }
.church-site .social-links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 10px; }
.church-site .footer-note { margin-top: 24px; font-weight: 500; }
.church-site .lead-center { margin-inline: auto; text-align: center; }
.church-site .church-hero.hero-plain .container, .church-site .church-hero.hero-art .container, .church-site .church-hero.hero-photo .container { position: relative; }
.church-site .church-hero .eyebrow { color: var(--gold); }
.church-site .church-hero.hero-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 11, 51, .15), rgba(15, 11, 51, .55)); }
.church-site .church-hero.hero-photo img.bg { opacity: 1; }
.church-site .church-hero.hero-photo .container { z-index: 1; }
.church-site .church-hero.hero-plain { background: linear-gradient(135deg, var(--night), var(--indigo)); }
.church-site .page-hero .eyebrow { color: var(--gold); }
.church-site .cal th, .church-site .cal td { border-color: var(--line); }

/* ---------- Classic: light, traditional, centered ---------- */
.tpl-classic { --font-head: 'Fraunces', Georgia, serif; --radius: 8px; --paper: #FFFFFF; --shadow: 0 1px 2px rgba(35, 21, 102, .05); }
.tpl-classic .church-hero { background: var(--white); color: var(--ink); text-align: center; border-bottom: 4px double var(--line); }
.tpl-classic .church-hero.hero-plain, .tpl-classic .church-hero.hero-art { background: #FBF9F4; }
.tpl-classic .church-hero img.bg { opacity: .16; }
.tpl-classic .church-hero.hero-photo img.bg { opacity: 1; }
.tpl-classic .church-hero.hero-photo { color: var(--white); }
.tpl-classic .church-hero h1 { color: var(--ink); max-width: none; text-shadow: none; font-weight: 500; letter-spacing: -0.01em; }
.tpl-classic .church-hero.hero-photo h1 { color: var(--white); }
.tpl-classic .church-hero .lead { color: var(--ink-soft); margin-inline: auto; }
.tpl-classic .church-hero.hero-photo .lead { color: #F0F2FA; }
.tpl-classic .church-hero .eyebrow { color: var(--dawn-ink); }
.tpl-classic .church-hero.hero-photo .eyebrow { color: var(--gold); }
.tpl-classic .church-hero .row { justify-content: center; }
.tpl-classic .church-hero .btn-secondary { color: var(--ink); border-color: var(--ink); }
.tpl-classic .church-hero.hero-photo .btn-secondary { color: var(--white); border-color: rgba(255, 255, 255, .8); }
.tpl-classic .page-hero { background: #FBF9F4; color: var(--ink); border-bottom: 1px solid var(--line); padding-block: 40px; text-align: center; }
.tpl-classic .page-hero h1, .tpl-classic .page-hero a:not(.btn) { color: var(--ink); }
.tpl-classic .page-hero .lead, .tpl-classic .page-hero .muted { color: var(--ink-soft); margin-inline: auto; }
.tpl-classic .page-hero .eyebrow, .tpl-classic .page-hero .eyebrow a { color: var(--dawn-ink); }
.tpl-classic .church-nav { background: #fff; }
.tpl-classic .card { box-shadow: none; }
.tpl-classic h2 { text-align: left; }

/* ---------- Modern: bold type, accent color blocks ---------- */
.tpl-modern { --font-head: 'Inter', system-ui, sans-serif; --radius: 12px; --shadow: none; }
.tpl-modern h1, .tpl-modern h2, .tpl-modern h3 { font-weight: 800; letter-spacing: -0.035em; }
.tpl-modern .church-hero { background: var(--accent); color: var(--accent-text); }
.tpl-modern .church-hero.hero-photo { background: var(--night); }
.tpl-modern .church-hero img.bg { opacity: .35; mix-blend-mode: multiply; }
.tpl-modern .church-hero.hero-photo img.bg { opacity: 1; mix-blend-mode: normal; }
.tpl-modern .church-hero .container { padding-block: 88px 96px; }
.tpl-modern .church-hero h1 { color: var(--accent-text); font-size: clamp(2.6rem, 7vw, 5rem); max-width: 14ch; text-shadow: none; }
.tpl-modern .church-hero.hero-photo h1 { color: var(--white); }
.tpl-modern .church-hero .lead { color: var(--accent-text); opacity: .9; }
.tpl-modern .church-hero.hero-photo .lead { color: #fff; }
.tpl-modern .church-hero .eyebrow { color: var(--accent-text); opacity: .85; }
.tpl-modern .church-hero.hero-photo .eyebrow { color: var(--gold); }
.tpl-modern .church-hero .btn-primary { background: var(--accent-text); color: var(--accent); box-shadow: none; }
.tpl-modern .church-hero .btn-secondary { color: var(--accent-text); border-color: var(--accent-text); }
.tpl-modern .church-hero.hero-photo .btn-primary { background: var(--accent); color: var(--accent-text); }
.tpl-modern .church-hero.hero-photo .btn-secondary { color: #fff; border-color: #fff; }
.tpl-modern .page-hero { background: var(--accent); color: var(--accent-text); }
.tpl-modern .page-hero h1, .tpl-modern .page-hero a:not(.btn), .tpl-modern .page-hero .lead, .tpl-modern .page-hero .muted, .tpl-modern .page-hero .eyebrow, .tpl-modern .page-hero .eyebrow a { color: var(--accent-text); }
.tpl-modern .card { border: 2px solid var(--ink); box-shadow: none; }
.tpl-modern a.card:hover { transform: translate(-3px, -3px); box-shadow: 5px 5px 0 var(--ink); }
.tpl-modern .church-nav { border-bottom: 2px solid var(--ink); }
.tpl-modern .btn { border-radius: 10px; }
.tpl-modern .give-band, .tpl-modern .section-tint { background: color-mix(in srgb, var(--accent) 16%, var(--white)); }

/* ---------- Warm: cream, soft and friendly ---------- */
.tpl-warm { --paper: #FBF3E6; --sky: #F6E7CF; --line: #EBDDC5; --radius: 28px; --font-head: 'Fraunces', Georgia, serif; }
.tpl-warm .section-white { background: #FFF9EF; }
.tpl-warm .church-hero { background: transparent; color: var(--ink); padding: 18px 0 0; }
.tpl-warm .church-hero .container { background: linear-gradient(135deg, var(--indigo), var(--violet)); color: var(--white); border-radius: 36px; max-width: 1140px; padding: 64px 40px 72px; position: relative; overflow: hidden; }
.tpl-warm .church-hero img.bg { opacity: .45; inset: 18px 0 0; height: calc(100% - 18px); border-radius: 36px; max-width: 1140px; margin-inline: auto; left: 0; right: 0; width: calc(100% - 2 * var(--gutter)); }
.tpl-warm .church-hero.hero-photo::after { display: none; }
.tpl-warm .church-hero.hero-plain .container { background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #3A1D5C)); color: var(--accent-text); }
.tpl-warm .church-hero.hero-plain h1, .tpl-warm .church-hero.hero-plain .lead, .tpl-warm .church-hero.hero-plain .eyebrow { color: var(--accent-text); }
.tpl-warm .church-hero h1 { max-width: none; }
.tpl-warm .page-hero { background: #F6E7CF; color: var(--ink); }
.tpl-warm .page-hero h1, .tpl-warm .page-hero a:not(.btn) { color: var(--ink); }
.tpl-warm .page-hero .lead, .tpl-warm .page-hero .muted { color: var(--ink-soft); }
.tpl-warm .page-hero .eyebrow, .tpl-warm .page-hero .eyebrow a { color: var(--dawn-ink); }
.tpl-warm .card { border-color: var(--line); background: #FFFDF8; }
.tpl-warm .btn { border-radius: 999px; }
.tpl-warm .church-nav { background: rgba(251, 243, 230, .95); }

/* ---------- Minimal: quiet, white, thin lines ---------- */
.tpl-minimal { --paper: #FFFFFF; --radius: 6px; --shadow: none; --font-head: 'Inter', system-ui, sans-serif; }
.tpl-minimal h1, .tpl-minimal h2, .tpl-minimal h3 { font-weight: 600; letter-spacing: -0.02em; }
.tpl-minimal .church-hero { background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); }
.tpl-minimal .church-hero img.bg { display: none; }
.tpl-minimal .church-hero.hero-photo img.bg { display: block; opacity: 1; }
.tpl-minimal .church-hero.hero-photo { color: var(--white); }
.tpl-minimal .church-hero .container { padding-block: 48px 52px; }
.tpl-minimal .church-hero h1 { color: var(--ink); font-size: clamp(2rem, 4vw, 3rem); max-width: none; text-shadow: none; }
.tpl-minimal .church-hero.hero-photo h1 { color: #fff; }
.tpl-minimal .church-hero .lead { color: var(--ink-soft); }
.tpl-minimal .church-hero.hero-photo .lead { color: #F0F2FA; }
.tpl-minimal .church-hero .eyebrow { color: var(--dawn-ink); }
.tpl-minimal .church-hero.hero-photo .eyebrow { color: var(--gold); }
.tpl-minimal .church-hero .btn-secondary { color: var(--ink); border-color: var(--line); }
.tpl-minimal .church-hero.hero-photo .btn-secondary { color: #fff; border-color: rgba(255, 255, 255, .8); }
.tpl-minimal .page-hero { background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); padding-block: 36px 30px; }
.tpl-minimal .page-hero h1, .tpl-minimal .page-hero a:not(.btn) { color: var(--ink); }
.tpl-minimal .page-hero .lead, .tpl-minimal .page-hero .muted { color: var(--ink-soft); }
.tpl-minimal .page-hero .eyebrow, .tpl-minimal .page-hero .eyebrow a { color: var(--dawn-ink); }
.tpl-minimal .card { box-shadow: none; border-radius: 6px; }
.tpl-minimal .section-white, .tpl-minimal .section-tint, .tpl-minimal .give-band { background: #fff; border-top: 1px solid var(--line); }
.tpl-minimal .btn-primary { box-shadow: none; }
.tpl-minimal .church-nav { background: #fff; }

/* A church with no hero photo gets a "plain" hero. The generic plain rule (a dark gradient) out-ranks each look's own .church-hero rule,
   which left Minimal with dark text on a dark banner and Modern without the church's accent color. Each look restates its plain hero here. */
.tpl-modern .church-hero.hero-plain { background: var(--accent); color: var(--accent-text); }
.tpl-minimal .church-hero.hero-plain { background: #fff; color: var(--ink); }
.tpl-warm .church-hero.hero-plain { background: transparent; color: var(--ink); }
