/* ============================================================
   ParishBrain — shared design language (v2 "institutional register")
   Warm paper, iron-gall ink, hairline rules, one gold rule, one oxblood seal.
   Used by every public page so the site stays one consistent register.
   ============================================================ */
:root{
  --paper:#F4EFE4; --raised:#FAF6EC; --ink:#1C1B17; --sepia:#56524A; --body:#3A372F;
  --gold:#9A7B1E; --oxblood:#7A2E22; --rule:#E0D7C4; --rule2:#D6CDB9; --dot:#BBB199; --muted:#8C8678;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{scroll-behavior:smooth;}
::selection{background:#E3CFA0;color:var(--ink);}
body{background:var(--paper);color:var(--ink);font-family:'Spectral',Georgia,serif;font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;}
a{color:inherit;}

.page{position:relative;min-height:100vh;}
.ruled{position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0 31px,rgba(120,108,82,0.07) 31px 32px);pointer-events:none;z-index:0;}
.wrap{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:52px 48px 96px;}

/* ---- type primitives ---- */
.kicker{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--oxblood);margin-bottom:12px;}
.kicker.sepia{color:var(--sepia);}
.kicker.gold{color:var(--gold);}
h2.t{font-family:'Spectral',serif;font-weight:600;font-size:31px;line-height:1.16;letter-spacing:-0.3px;color:var(--ink);margin:0 0 8px;max-width:24ch;}
h3.s{font-family:'Spectral',serif;font-weight:600;font-size:19px;color:var(--ink);margin:0 0 6px;}
p.lede{font-family:'Spectral',serif;font-size:18px;line-height:1.6;color:var(--ink);margin:0 0 8px;max-width:60ch;}
p.body{font-family:'Spectral',serif;font-size:16.5px;line-height:1.72;color:var(--body);margin:14px 0 0;max-width:64ch;}
p.body .q{font-style:italic;color:var(--ink);}            /* inline quoted phrase */
.em{font-style:italic;}
.u-gold{border-bottom:2px solid var(--gold);padding-bottom:1px;}
section{margin-top:74px;}

/* ---- masthead + nav ---- */
.topbar{display:flex;justify-content:space-between;align-items:center;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:1.5px;color:var(--sepia);border-top:2.5px solid var(--ink);border-bottom:1px solid var(--rule2);padding:9px 0;}
.topbar a{text-decoration:none;}
.topbar .date{text-transform:uppercase;letter-spacing:2px;}
.nav{display:flex;gap:22px;align-items:center;flex-wrap:wrap;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;padding:12px 0 0;}
.nav a{color:var(--sepia);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent;}
.nav a:hover{color:var(--ink);}
.nav a.here{color:var(--oxblood);border-bottom-color:var(--gold);}
.nav .spacer{flex:1;}
.nameplate{display:flex;justify-content:space-between;align-items:flex-end;margin-top:30px;gap:24px;flex-wrap:wrap;}
.wm{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:42px;color:var(--ink);line-height:0.95;letter-spacing:-0.5px;text-decoration:none;}
.wm-sub{font-family:'DM Mono',monospace;font-size:11.5px;letter-spacing:1px;color:var(--sepia);margin-top:9px;}
.nameplate .aside{font-family:'Spectral',serif;font-style:italic;font-size:15px;line-height:1.5;color:var(--sepia);max-width:32ch;text-align:right;}
.hero-lede{font-family:'Spectral',serif;font-weight:500;font-size:27px;line-height:1.38;letter-spacing:-0.3px;color:var(--ink);max-width:32ch;margin:46px 0 0;}
.hero-lede.wide{max-width:40ch;}
.hero-h{font-family:'Spectral',serif;font-weight:600;font-size:38px;line-height:1.12;letter-spacing:-0.5px;color:var(--ink);max-width:20ch;margin:44px 0 0;}
.hero-sub{font-family:'Spectral',serif;font-size:19px;line-height:1.52;color:var(--sepia);max-width:60ch;margin:18px 0 0;}
.prose-lead{font-family:'Spectral',serif;font-size:20px;line-height:1.6;color:var(--ink);max-width:66ch;margin:18px 0 0;}
.prose-lead .em{font-style:italic;}

/* outcomes ledger */
.oledger{border-top:1.5px solid var(--ink);margin-top:30px;}
.oledger .row{display:grid;grid-template-columns:180px 1fr 140px;gap:22px;padding:18px 0;border-bottom:1px solid var(--rule);align-items:baseline;}
.oledger .row.last{border-bottom:1.5px solid var(--ink);}
.oledger .nm{font-family:'Spectral',serif;font-weight:600;font-size:18px;color:var(--ink);}
.oledger .ds{font-family:'Spectral',serif;font-size:15px;line-height:1.5;color:var(--sepia);}
.oledger .tag{font-family:'DM Mono',monospace;font-size:12px;color:var(--oxblood);text-align:right;}

/* ---- ledger of figures ---- */
.ledger{margin-top:44px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);}
.ledger .cap{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:2px;color:var(--gold);text-transform:uppercase;padding:9px 0 2px;}
.ledger .row{display:grid;grid-template-columns:repeat(4,1fr);}
.ledger .cell{padding:14px 18px 18px 18px;border-right:1px solid var(--rule2);}
.ledger .cell:first-child{padding-left:0;}
.ledger .cell:last-child{border-right:none;padding-right:0;}
.ledger .n{font-family:'Spectral',serif;font-weight:600;font-size:42px;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums;}
.ledger .n span{font-size:23px;color:var(--oxblood);}
.ledger .l{font-family:'DM Mono',monospace;font-size:11px;color:var(--sepia);margin-top:9px;letter-spacing:0.5px;}

/* ---- roman list ---- */
.rlist{border-top:1.5px solid var(--ink);margin-top:30px;}
.rlist .row{display:grid;grid-template-columns:32px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--rule);}
.rlist .row.last{border-bottom:1.5px solid var(--ink);}
.rlist .rn{font-family:'Spectral',serif;font-style:italic;font-size:24px;color:var(--gold);line-height:1;}
.rlist p{font-family:'Spectral',serif;font-size:16px;line-height:1.62;color:var(--body);margin:0;max-width:62ch;}

/* ---- numbered movements ---- */
.steps{border-top:1.5px solid var(--ink);margin-top:30px;}
.steps .row{display:grid;grid-template-columns:54px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--rule);align-items:baseline;}
.steps .row.last{border-bottom:1.5px solid var(--ink);}
.steps .no{font-family:'DM Mono',monospace;font-size:13px;color:var(--gold);}
.steps p{font-family:'Spectral',serif;font-size:16.5px;line-height:1.6;color:var(--body);margin:0;max-width:64ch;}
.steps strong{color:var(--ink);font-weight:600;}

/* ---- pull quote (used sparingly; most quotes run inline) ---- */
.quote{border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:22px 0;margin:28px 0;}
.quote .src{font-family:'DM Mono',monospace;font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--oxblood);margin-bottom:12px;}
.quote .q{font-family:'Spectral',serif;font-style:italic;font-weight:500;font-size:26px;line-height:1.3;color:var(--ink);max-width:32ch;}

/* ---- Pope quote callout (right-side marginalia; floats beside the prose) ---- */
.pquote{float:right;width:282px;margin:7px 0 22px 44px;padding:3px 0 5px 22px;border-left:2.5px solid var(--gold);}
.pquote .src{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--oxblood);margin-bottom:11px;line-height:1.55;}
.pquote .q{font-family:'Spectral',serif;font-style:italic;font-weight:500;font-size:19px;line-height:1.42;color:var(--ink);}
.pquote .cite{display:block;margin-top:12px;font-family:'DM Mono',monospace;font-style:normal;font-weight:400;font-size:9.5px;letter-spacing:1px;line-height:1.6;text-transform:uppercase;color:var(--muted);}
.pquote .cite a{color:var(--sepia);}
/* contain the marginalia float within its section so it never bleeds into the next */
section::after{content:"";display:block;clear:both;}
/* structured blocks always start on a clean line below a marginalia float (never overlap it) */
.steps,.rlist,.oledger,.ledger,.scenes,.diagram,.band,.seal-grid{clear:both;}

/* ---- seal block ---- */
.seal-grid{display:grid;grid-template-columns:140px 1fr;gap:38px;align-items:start;border-top:1.5px solid var(--ink);padding-top:30px;margin-top:26px;}
.seal-grid h3{font-family:'Spectral',serif;font-weight:600;font-size:24px;line-height:1.2;color:var(--ink);margin:0 0 12px;max-width:28ch;}
.seal-grid p{font-family:'Spectral',serif;font-size:16px;line-height:1.62;color:var(--body);margin:0;max-width:60ch;}
.dashlist{display:grid;gap:13px;}
.dashlist .d{display:flex;gap:12px;align-items:baseline;}
.dashlist .m{font-family:'DM Mono',monospace;font-size:12px;color:var(--oxblood);}
.dashlist p{font-family:'Spectral',serif;font-size:15.5px;line-height:1.55;color:var(--body);margin:0;max-width:62ch;}
.dashlist strong{color:var(--ink);font-weight:600;}

/* ---- scenes ledger ---- */
.scenes{border-top:1.5px solid var(--ink);margin-top:30px;}
.scenes .row{display:grid;grid-template-columns:170px 1fr;gap:24px;padding:20px 0;border-bottom:1px solid var(--rule);align-items:baseline;}
.scenes .row.last{border-bottom:1.5px solid var(--ink);}
.scenes .when{font-family:'DM Mono',monospace;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);}
.scenes .what{font-family:'Spectral',serif;font-size:16px;line-height:1.62;color:var(--body);max-width:64ch;}
.scenes .what strong{color:var(--ink);font-weight:600;}

/* ---- apps catalogue (name + descriptor + full description) ---- */
.applist{border-top:1.5px solid var(--ink);margin-top:30px;}
.applist .item{padding:20px 0;border-bottom:1px solid var(--rule);}
.applist .item.last{border-bottom:1.5px solid var(--ink);}
.applist .hd{display:flex;align-items:baseline;gap:8px 16px;flex-wrap:wrap;margin-bottom:8px;}
.applist .nm{font-family:'Spectral',serif;font-weight:600;font-size:20px;color:var(--ink);}
.applist .nm .star{font-family:'DM Mono',monospace;font-size:12px;color:var(--gold);margin-left:5px;}
.applist .dsc{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold);}
.applist p{font-family:'Spectral',serif;font-size:16px;line-height:1.64;color:var(--body);margin:0;max-width:72ch;}

/* ---- FAQ accordion (native <details>, exclusive via name=) ---- */
.faq{border-top:1.5px solid var(--ink);margin-top:30px;}
.faq details{border-bottom:1px solid var(--rule);}
.faq details.last{border-bottom:1.5px solid var(--ink);}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:baseline;padding:18px 0;font-family:'Spectral',serif;font-weight:600;font-size:18px;line-height:1.35;color:var(--ink);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:'DM Mono',monospace;font-size:19px;line-height:1;color:var(--gold);flex:0 0 auto;}
.faq details[open] summary{color:var(--oxblood);}
.faq details[open] summary::after{content:"\2212";}
.faq summary:hover{color:var(--oxblood);}
.faq .a{padding:0 0 20px;}
.faq .a p{font-family:'Spectral',serif;font-size:16px;line-height:1.7;color:var(--body);margin:0 0 12px;max-width:76ch;}
.faq .a p:last-child{margin-bottom:0;}
.faq .a a{color:var(--oxblood);}
@media (prefers-reduced-motion:no-preference){
  .faq details[open] .a{animation:faqreveal .26s ease both;}
}
@keyframes faqreveal{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:none;}}

/* ---- app index (with optional highlight) ---- */
.group{display:flex;align-items:center;gap:12px;margin:22px 0 4px;}
.group:first-of-type{margin-top:0;}
.group .gl{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);}
.group .gr{flex:1;height:1px;background:var(--rule2);}
.app{display:flex;align-items:baseline;gap:10px;padding:10px 0;border-bottom:1px solid #E4DCCB;}
.app .nm{font-family:'Spectral',serif;font-size:17px;color:var(--ink);}
.app.key .nm{font-weight:600;}
.app .star{font-family:'DM Mono',monospace;font-size:11px;color:var(--gold);}
.app .lead{flex:1;border-bottom:1px dotted var(--dot);transform:translateY(-4px);}
.app .ds{font-family:'DM Mono',monospace;font-size:12px;color:var(--sepia);}

/* ---- architecture diagram ---- */
.diagram{border:1px solid var(--rule);background:var(--raised);padding:16px;margin-top:30px;}
.diagram svg{width:100%;height:auto;display:block;}

/* ---- callout band ---- */
.band{background:var(--ink);padding:26px 28px;margin-top:30px;display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap;}
.band .bt{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:24px;color:var(--paper);line-height:1.05;}
.band .bs{font-family:'DM Mono',monospace;font-size:11.5px;color:#C9BFA6;margin-top:8px;letter-spacing:0.5px;}
.band .br{font-family:'Spectral',serif;font-style:italic;font-size:14px;color:#C9BFA6;max-width:40ch;text-align:right;}

/* ---- buttons / signup ---- */
.actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:20px;}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'DM Mono',monospace;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--paper);background:var(--oxblood);border:1.5px solid var(--oxblood);padding:14px 24px;text-decoration:none;cursor:pointer;}
.btn.ghost{color:var(--oxblood);background:transparent;}
.signup{display:flex;flex-wrap:wrap;align-items:stretch;max-width:430px;margin-top:8px;}
.signup input{flex:1 1 180px;min-width:0;font-family:'DM Mono',monospace;font-size:12px;letter-spacing:1px;color:var(--ink);background:var(--raised);border:1.5px solid var(--ink);border-right:none;padding:15px 16px;outline:none;}
.signup button{flex:0 0 auto;font-family:'DM Mono',monospace;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--paper);background:var(--oxblood);border:1.5px solid var(--oxblood);padding:15px 24px;cursor:pointer;white-space:nowrap;}
.confirm{display:none;font-family:'Spectral',serif;font-style:italic;font-size:15px;color:var(--oxblood);margin-top:12px;}

/* ---- colophon + sources ---- */
.colophon{margin-top:80px;border-top:2.5px solid var(--ink);padding-top:30px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:flex-start;}
.colophon .cw{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:24px;color:var(--ink);}
.colophon .ct{font-family:'Spectral',serif;font-style:italic;font-size:15px;color:var(--sepia);margin:7px 0 0;line-height:1.5;max-width:42ch;}
.colophon .cm{font-family:'DM Mono',monospace;font-size:11.5px;line-height:1.7;color:var(--sepia);text-align:right;}
.sources{margin-top:24px;}
.sources .h{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.sources p{font-family:'DM Mono',monospace;font-size:11px;line-height:1.7;color:var(--sepia);max-width:90ch;}
.sources a{color:var(--oxblood);}

@media (max-width:900px){
  .pquote{width:232px;margin-left:30px;}
  .pquote .q{font-size:18px;}
}
@media (max-width:760px){
  .wrap{padding:30px 20px 72px;}
  .ledger .row{grid-template-columns:1fr 1fr;}
  .ledger .n{font-size:32px;}
  .ledger .cell:nth-child(2){border-right:none;}
  .ledger .cell{padding:14px 14px 16px;}
  .seal-grid{grid-template-columns:1fr;gap:22px;}
  .scenes .row{grid-template-columns:1fr;gap:4px;}
  .oledger .row{grid-template-columns:1fr;gap:4px;}
  .oledger .tag{text-align:left;}
  .hero-h{font-size:30px;}
  .hero-sub{font-size:17px;}
  .prose-lead{font-size:18px;}
  .band{flex-direction:column;align-items:flex-start;}
  .band .br{text-align:left;}
  .hero-lede{font-size:23px;}
  h2.t{font-size:26px;}
  .quote .q{font-size:21px;}
  .pquote{float:none;width:auto;margin:22px 0;padding:14px 0 14px 18px;}
  .pquote .q{font-size:18px;}
  .signup button{flex:1 1 100%;}
  .colophon{flex-direction:column;}.colophon .cm{text-align:left;}
}
