/* Church and town pages (server-rendered for search engines). Colours match styles.css. */
:root { --brand: #24483f; --brand-deep: #17302a; --gold: #b59247; --gold-ink: #7a5b24; --gold-soft: #f1e8d3; --bg: #f9f6ef; --surface: #fffdf8; --ink: #1d2e28; --ink-2: #425249; --muted: #626e65; --line: #dedfd3; --ok: #1d7450; --ok-soft: #e3f3ea; --warn: #9a5700; --warn-soft: #fcf0dc; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.6 Inter, system-ui, sans-serif; }
a { color: var(--brand); } a:hover { color: var(--gold-ink); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.p-top { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: space-between; padding: 14px clamp(16px, 4vw, 40px); background: var(--brand-deep); }
.p-brand { display: flex; flex-direction: column; color: #fff; text-decoration: none; line-height: 1.15; }
.p-brand strong { font: 600 22px 'EB Garamond', Georgia, serif; } .p-brand span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #c2dcc5; }
.p-search { display: flex; flex: 1; max-width: 420px; min-width: 220px; }
.p-search input { flex: 1; min-width: 0; padding: 9px 14px; border: 0; border-radius: 999px 0 0 999px; font: inherit; }
.p-search button { padding: 9px 16px; border: 0; border-radius: 0 999px 999px 0; background: var(--gold); color: #1e1606; font: 600 15px Inter, sans-serif; cursor: pointer; }
.p-main { max-width: 900px; margin: 0 auto; padding: 24px clamp(16px, 4vw, 40px) 48px; }
.p-crumbs { font-size: 14px; color: var(--muted); margin-bottom: 8px; }
h1 { margin: 6px 0 4px; font: 600 clamp(32px, 5vw, 46px)/1.08 'EB Garamond', Georgia, serif; color: var(--brand-deep); overflow-wrap: anywhere; }
h2 { margin: 28px 0 10px; font: 600 24px 'EB Garamond', Georgia, serif; color: var(--brand-deep); }
.p-sub { margin: 0 0 16px; color: var(--ink-2); font-size: 17px; }
.p-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.p-tags span { padding: 2px 10px; border-radius: 999px; background: #e9ece2; font-size: 13px; font-weight: 600; }
.p-tags .st-ACTIVE { background: var(--ok-soft); color: var(--ok); } .p-tags .st-UNCERTAIN { background: var(--warn-soft); color: var(--warn); }
.p-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.btn { display: inline-block; padding: 9px 18px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); text-decoration: none; font-weight: 600; font-size: 15px; }
.btn-primary { background: var(--brand); border-color: var(--brand); color: #fff; } .btn-primary:hover { color: #fff; background: #315b4e; }
.p-facts { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
.p-facts dt { color: var(--muted); } .p-facts dd { margin: 0; }
.muted, .fine { color: var(--muted); font-size: 14px; }
.p-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.p-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 16px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.p-list a { font-weight: 600; text-decoration: none; } .p-list span { color: var(--muted); font-size: 14px; }
.p-towns { columns: 4 180px; padding: 0; list-style: none; margin: 0; } .p-towns li { padding: 2px 0; break-inside: avoid; } .p-towns span { color: var(--muted); font-size: 13px; }
.p-claim { margin-top: 28px; padding: 4px 20px 12px; border-radius: 14px; background: var(--gold-soft); }
.p-sources { padding-left: 20px; }
.p-foot { padding: 24px clamp(16px, 4vw, 40px) 36px; border-top: 1px solid var(--line); text-align: center; color: var(--ink-2); font-size: 15px; }