/* WordPress glue for the design system (site.css). Styles the Gutenberg
   content column (.content) for every allowed core block, plus admin-bar and
   core-markup fixes. Also loaded as the editor stylesheet, so the editor
   preview matches the front end. Uses only site.css tokens. */

.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

/* Sticky header clears the logged-in admin bar. */
body.admin-bar header.site{top:32px}
@media(max-width:782px){body.admin-bar header.site{top:46px}}
@media(max-width:600px){body.admin-bar header.site{top:0}}
header.site .bar{position:relative}

/* Design fix: .layout's padding shorthand wipes .wrap's 28px side gutter (same
   bug in the prototype), so the content column didn't line up with the header
   and touched the screen edge on phones. */
.wrap.layout{padding-left:28px;padding-right:28px}
@media(max-width:640px){.wrap.bar{padding-left:28px;padding-right:28px}}

/* ===== Content column: allowed core blocks ===== */
:is(.content,.is-root-container)>:first-child{margin-top:0}
:is(.content,.is-root-container) h3{font-size:1.45rem;margin:34px 0 10px}
:is(.content,.is-root-container) h4{font-size:1.15rem;margin:28px 0 8px}
:is(.content,.is-root-container) ul,:is(.content,.is-root-container) ol{font-size:1.15rem;color:#33424c;margin:0 0 18px;padding-left:1.4em}
:is(.content,.is-root-container) li{margin:0 0 6px}
:is(.content,.is-root-container) li::marker{color:var(--gold-d)}
:is(.content,.is-root-container) a{text-decoration:underline;text-underline-offset:.15em}
:is(.content,.is-root-container) a:hover{color:var(--navy-d)}
:is(.content,.is-root-container) strong{color:var(--ink)}

:is(.content,.is-root-container) .wp-block-image,:is(.content,.is-root-container) figure{margin:30px 0}
:is(.content,.is-root-container) .wp-block-image img,:is(.content,.is-root-container) .wp-block-gallery img{border-radius:18px;height:auto}
:is(.content,.is-root-container) figcaption,:is(.content,.is-root-container) .wp-element-caption{font-size:.94rem;color:var(--muted);margin-top:10px;text-align:left}
:is(.content,.is-root-container) .wp-block-gallery{gap:14px}

:is(.content,.is-root-container) blockquote,:is(.content,.is-root-container) .wp-block-quote{margin:30px 0;padding:6px 0 6px 26px;border-left:4px solid var(--gold)}
:is(.content,.is-root-container) blockquote p{font-family:var(--slab);font-weight:500;font-size:1.45rem;line-height:1.35;color:var(--ink)}
:is(.content,.is-root-container) blockquote cite{font-style:normal;font-size:.94rem;color:var(--muted);font-weight:700}

:is(.content,.is-root-container) .wp-block-table{margin:30px 0;overflow-x:auto}
:is(.content,.is-root-container) table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;font-size:1rem}
:is(.content,.is-root-container) th,:is(.content,.is-root-container) td{text-align:left;padding:12px 16px;border-top:1px solid var(--line);vertical-align:top}
:is(.content,.is-root-container) thead th{background:var(--cream-d);border-top:0;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
:is(.content,.is-root-container) tbody tr:first-child td{border-top:0}
:is(.content,.is-root-container) thead+tbody tr:first-child td{border-top:1px solid var(--line)}

:is(.content,.is-root-container) hr,:is(.content,.is-root-container) .wp-block-separator{border:0;border-top:1px solid var(--line);margin:40px 0}

:is(.content,.is-root-container) .wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0}
:is(.content,.is-root-container) .wp-block-button__link,.editor-styles-wrapper .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans);font-weight:800;font-size:1.03rem;padding:12px 22px;min-height:50px;border-radius:100px;border:2px solid transparent;background:var(--navy);color:#fff;text-decoration:none}
:is(.content,.is-root-container) .wp-block-button__link:hover{background:var(--navy-d);color:#fff;text-decoration:none}
:is(.content,.is-root-container) .is-style-line .wp-block-button__link,.editor-styles-wrapper .is-style-line .wp-block-button__link{background:#fff;color:var(--navy);border-color:var(--navy)}
:is(.content,.is-root-container) .is-style-line .wp-block-button__link:hover{background:#eef5fb;color:var(--navy)}
:is(.content,.is-root-container) .is-style-donate .wp-block-button__link,.editor-styles-wrapper .is-style-donate .wp-block-button__link{background:var(--gold);color:#241904;box-shadow:0 5px 16px rgba(216,148,26,.3)}
:is(.content,.is-root-container) .is-style-donate .wp-block-button__link:hover{background:#c7860f;color:#241904}

:is(.content,.is-root-container) .wp-block-file{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 20px;margin:20px 0}
:is(.content,.is-root-container) .wp-block-file>a:first-child{font-weight:800}
:is(.content,.is-root-container) .wp-block-file .wp-block-file__button{margin-left:auto;font-weight:800;font-size:.94rem;padding:8px 16px;border-radius:100px;background:var(--navy);color:#fff;text-decoration:none}

:is(.content,.is-root-container) .wp-block-embed{margin:30px 0}
:is(.content,.is-root-container) .wp-block-embed__wrapper iframe{border-radius:18px;max-width:100%}

/* core/details uses the design's <details> accordion styling from site.css. */
:is(.content,.is-root-container) details{margin:0 0 12px}
:is(.content,.is-root-container) details>:not(summary){margin-left:24px;margin-right:24px}
:is(.content,.is-root-container) details>:last-child{margin-bottom:22px}

/* Colour choices from the palette (theme.json) */
:is(.content,.is-root-container) .has-background{padding:20px 24px;border-radius:16px}

/* ===== Post lists (News index, archives, search) ===== */
.post-list{list-style:none;margin:0;padding:0;display:grid;gap:18px}
:is(.content,.is-root-container) .post-list{padding:0}
.post-list li{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 26px;margin:0}
.post-list h2{font-size:1.45rem;margin:6px 0 8px}
.post-list h2 a{text-decoration:none}
.post-list p{font-size:1rem;color:var(--muted);margin:0}
.nav-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}
.nav-links .page-numbers{display:inline-grid;place-items:center;min-width:44px;min-height:44px;padding:0 12px;border-radius:100px;border:1px solid var(--line);background:#fff;font-weight:800;text-decoration:none}
.nav-links .current{background:var(--navy);border-color:var(--navy);color:#fff}

/* Editor canvas: match the content column */
.editor-styles-wrapper{background:var(--cream);font-family:var(--sans)}
.editor-styles-wrapper .wp-block-post-title{font-family:var(--slab);font-weight:700;font-size:clamp(2.25rem,4.8vw,3.5rem)}

/* site.css content-column rules, repeated for the editor canvas. */
.is-root-container .lead{font-size:1.375rem;line-height:1.5;font-weight:600;margin:0 0 26px}
.is-root-container h2{font-size:2rem;margin:44px 0 14px}
.is-root-container p{font-size:1.15rem;color:#33424c;margin:0 0 18px}

/* ===== Homepage photos (the design only specifies .ph placeholders) ===== */
/* Hero photo: near-square, no overlay, newspaper-style caption (design review 2026-09-28). */
.hero-fig{margin:0;display:grid;gap:12px}
.hero-fig>img{width:100%;height:440px;object-fit:cover;border-radius:4px}
.hero-fig figcaption{font-size:.94rem;line-height:1.5;color:var(--muted);border-left:2px solid var(--line);padding-left:12px;max-width:60ch}
.hero-fig figcaption :is(b,strong){color:var(--ink)}
.hero .hero-fig--empty{border-radius:4px}
@media(max-width:980px){.hero-fig{order:-1}.hero-fig>img{height:300px}}
.testi img.pic{width:100%;object-fit:cover;border-radius:18px}

/* ===== Section heads: no eyebrow; left-set under a heavy ink rule, like a
   community newsletter (design review 2026-09-28). Replaces the design's
   eyebrow + centred head. How it works keeps its own treatment. ===== */
.head{border-top:3px solid var(--ink);padding-top:18px}
.head.wide{max-width:none}
.head.wide p{max-width:62ch}
.head h2,.db .head h2{margin-top:0}
.head p a{font-weight:700;text-decoration:underline;text-underline-offset:.15em}
.how .head{border-top:0;padding-top:0}

/* ===== Offices (cc_office): Locations cards, office page ===== */
.office-cards{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
:is(.content,.is-root-container) .office-cards{padding:0}
.office-cards li.card{margin:0;display:flex;flex-direction:column}
.office-cards h2,.office-cards h3{font-size:1.3rem;margin:0 0 10px}
.office-cards .factrow span{color:var(--muted)}
.office-cards .more{margin-top:auto;padding-top:14px;font-weight:800;text-decoration:none}
.addr{font-size:1rem;line-height:1.55;color:var(--ink);margin:0 0 12px}
.card .addr{color:var(--ink)}
.factrow b a{text-decoration:none;overflow-wrap:anywhere}
.content table.hours{max-width:480px;font-size:1.05rem}
.content table.hours th{font-weight:700;border-top:1px solid var(--line);width:45%}
.content table.hours tr:first-child th{border-top:0}
.content .note{font-size:.98rem;color:var(--muted)}
.content ul.contacts{list-style:none;padding:0;display:grid;gap:10px}
.content ul.contacts li{margin:0;display:grid;gap:2px}
.content ul.contacts b{font-family:var(--slab);font-size:1.1rem}
.content ul.contacts span{font-size:1rem;color:var(--muted)}

/* ===== Third-party form embeds ([cc_jotform], [cc_donorperfect]) in the
   Request Services .embed frame ===== */
.content .cc-embed{margin:30px 0 10px}
.cc-embed .embed-body{padding:8px}
.cc-embed iframe{display:block;width:100%;min-width:100%;border:0}
.content .embed-alt{font-size:.98rem;color:var(--muted);margin:0 0 30px}

/* ===== Native forms ([cc_form]) ===== */
.cc-form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;margin:30px 0;display:grid;gap:22px}
.cc-form .fld{display:grid;gap:6px}
.cc-form label{font-weight:800;font-size:1.08rem;color:var(--ink)}
.cc-form .req{font-weight:600;font-size:.9rem;color:var(--muted)}
.content .cc-form p.help{font-size:.98rem;color:var(--muted);margin:0}
.cc-form :is(input[type=text],input[type=email],input[type=tel],input[type=date],select,textarea){width:100%;font:inherit;font-size:1.08rem;color:var(--ink);background:#fff;padding:12px 16px;min-height:54px;border:2px solid #d9ccb2;border-radius:12px}
.cc-form textarea{min-height:120px;resize:vertical}
.cc-form :is(input,select,textarea):focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px rgba(0,74,134,.18)}
.cc-form .fld-checkbox{grid-template-columns:28px 1fr;align-items:start;gap:12px;background:var(--cream);border-radius:14px;padding:16px}
.cc-form .fld-checkbox input{width:24px;height:24px;margin:2px 0 0;accent-color:var(--navy)}
.cc-form .fld-checkbox label{font-weight:600;font-size:1.02rem}
.cc-form .has-err :is(input,select,textarea){border-color:#b3261e}
.content .cc-form p.err,.content .cc-form-err{color:#b3261e;font-weight:700;font-size:1rem;margin:0}
.cc-form .btn{justify-self:start}
.cc-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cc-form-done{background:#eaf5ee;border:1px solid #bfe0c9;border-radius:18px;padding:22px 26px;margin:30px 0;font-size:1.15rem;color:#1d6b38}
@media(max-width:640px){.cc-form{padding:20px}.cc-form .btn{justify-self:stretch}}
.office-cards .factrow{flex-wrap:wrap;column-gap:10px;row-gap:2px}
.office-cards .factrow :is(span,b){white-space:nowrap}
.office-cards .factrow b{margin-left:auto}
.factrow.stack{flex-direction:column;gap:2px}.factrow.stack b{text-align:left}

/* ===== Page templates: sidebar cards, section overviews, news ===== */
/* "In this section" / "More news" sidebar menu. */
.subnav ul{list-style:none;margin:0;padding:0;display:grid}
.subnav li{border-top:1px solid var(--line);margin:0}
.subnav li:first-child{border-top:0}
.subnav a{display:block;padding:10px 0;font-weight:700;text-decoration:none;min-height:44px}
.subnav a:hover{text-decoration:underline;text-underline-offset:.15em}
.subnav a[aria-current=page]{color:var(--ink);box-shadow:inset 3px 0 0 var(--gold);padding-left:12px}
.subnav li span{display:block;font-size:.9rem;color:var(--muted);margin:-6px 0 10px}
/* "What's included" on service pages: the service card's list style (.cat li). */
.card ul.ticks{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:1rem}
.card ul.ticks li{display:flex;gap:10px}
.card ul.ticks li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);flex:none;margin-top:.62em}
/* Donate form in the Donate overview sidebar. */
aside .give-form{margin:0}
/* Donate card (parts/donate-form.php): one button to Givecloud. */
.give-card{text-align:center}
.give-card .lead-in{font-size:1rem;color:var(--muted);margin:6px 0 18px}
.give-card .fine+.fine{margin-top:6px}

/* Section overview and news grids: 3 across (the homepage keeps 4). */
.cats.section-cards,.cats.news-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.cats.news-cards{margin-top:0}
@media(max-width:980px){.cats.section-cards,.cats.news-cards{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.cats.section-cards,.cats.news-cards{grid-template-columns:1fr}}
.cat h3{font-size:1.3rem}
.post-card .date{font-size:.875rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-d);margin-bottom:6px}
.post-card .pic{height:180px}

.news-filter{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.news-filter a{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border-radius:100px;border:1px solid var(--line);background:#fff;font-weight:800;text-decoration:none}
.news-filter a[aria-current=page]{background:var(--navy);border-color:var(--navy);color:#fff}
.content .post-photo{margin-top:0}
.content .back{margin-top:44px;font-weight:800}

/* ===== Notices (cc_notice): urgent variant; the rest is site.css ===== */
.notice-urgent{border-color:#e7b4ae}
.notice-urgent .ic{background:#fde8e6;color:#b3261e}
.notice-urgent .lab{color:#b3261e}
.notice p a{font-weight:700;text-decoration:underline;text-underline-offset:.15em}

/* ===== Office page: services offered (cc_service) ===== */
.content ul.services-here{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.content ul.services-here li{margin:0}
.content ul.services-here a{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border-radius:100px;border:1px solid var(--line);background:#fff;font-weight:800;font-size:1rem;text-decoration:none}
.content ul.services-here a:hover{border-color:var(--navy)}

/* ===== Accessibility options (footer.php, site.js) ===== */
/* Bottom-left launcher replaces the design's utility-bar Larger Text switch
   (client direction 2026-09-29, after peterboroughdiocese.org). */
.a11y{position:fixed;left:20px;bottom:20px;z-index:150}
.a11y-launch{width:56px;height:56px;border-radius:50%;background:var(--navy);color:#fff;border:3px solid var(--gold);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 24px rgba(0,30,60,.28);transition:transform .12s,background .12s}
.a11y-launch:hover{background:var(--navy-d);transform:translateY(-1px)}
.a11y-launch[aria-expanded="true"]{background:var(--navy-d)}
.a11y-panel{position:absolute;left:0;bottom:70px;width:min(19rem,calc(100vw - 40px));background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:20px;box-shadow:0 16px 38px rgba(40,30,10,.18);padding:18px}
.a11y-panel[hidden]{display:none}
.a11y-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.a11y-head h2{font-size:1.25rem;margin:0}
.a11y-x{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer}
.a11y-x:hover{background:var(--cream)}
.a11y ul{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:8px}
.a11y li{margin:0}
.a11y-size,.a11y-opt{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:52px;padding:6px 8px 6px 14px;border:1px solid var(--line);border-radius:14px;background:var(--cream);font:inherit;font-size:1rem;font-weight:700;color:var(--ink);text-align:left}
.a11y-size .ctl{display:flex;align-items:center;gap:6px}
.a11y-size button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:1.3rem;font-weight:800;line-height:1;cursor:pointer}
.a11y-size button:hover:not(:disabled){border-color:var(--navy)}
.a11y-size button:disabled{opacity:.4;cursor:default}
.a11y-size output{min-width:3.2em;text-align:center;font-variant-numeric:tabular-nums}
.a11y-opt{cursor:pointer;padding-right:14px}
.a11y-opt::after{content:"Off";content:"Off" / "";font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.a11y-opt[aria-pressed="true"]{background:#fff;border-color:var(--navy);box-shadow:inset 3px 0 0 var(--gold)}
.a11y-opt[aria-pressed="true"]::after{content:"On";content:"On" / "";color:var(--navy);font-weight:800}
.a11y-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.94rem}
.a11y-reset{background:none;border:0;padding:0 4px;min-height:44px;font:inherit;font-weight:800;color:var(--navy);text-decoration:underline;text-underline-offset:.15em;cursor:pointer}
.a11y-foot a{font-weight:700;text-decoration:underline;text-underline-offset:.15em}
@media(max-width:640px){.a11y{left:12px;bottom:12px}.a11y-launch{width:52px;height:52px}.a11y-panel{width:min(19rem,calc(100vw - 24px));bottom:64px}}
@media print{.a11y{display:none}}

/* High contrast: darken the muted/gold/line tokens and the pale text set on
   navy bands, so every text colour meets AAA-level contrast, and underline
   text links. Buttons and cards keep their own styling. */
html.a11y-contrast{--muted:#28343c;--gold-d:#6b4600;--line:#8f836b}
html.a11y-contrast :is(.content p,.is-root-container p,details p,.content ul,.content ol){color:var(--ink)}
html.a11y-contrast :is(.util,footer.site,footer.site .cols a,footer.site .desc,.foot-bot,.foot-bot a,.how p.s,.step p,.card.navy p){color:#fff}
html.a11y-contrast .how .ek{color:#ffd98a}
html.a11y-contrast .btn.ghost{border-color:#fff}
html.a11y-contrast input::placeholder,html.a11y-contrast textarea::placeholder{color:#4a4a44}
html.a11y-contrast a:not(.btn,.cat,.qcard,.logo,.skip,.wp-block-button__link,.social a){text-decoration:underline;text-underline-offset:.15em}

/* Highlight links: underline and outline every link, cards and buttons too. */
html.a11y-links a{text-decoration:underline!important;text-underline-offset:.18em;outline:2px solid currentColor;outline-offset:2px}
html.a11y-links a:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* Enlarged text (accessibility panel): let button labels wrap instead of
   pushing the page sideways, and widen the page container in step with the
   text so wide screens still use their space. Scaled breakpoints are in
   a11y-scale.css. */
html:is(.a11y-t1,.a11y-t2,.a11y-t3) .btn{white-space:normal;text-align:center}
html:is(.a11y-t1,.a11y-t2,.a11y-t3) .bar .acts{flex-wrap:wrap}
html.a11y-t1 .wrap{max-width:1426px}
html.a11y-t2 .wrap{max-width:1612px}
html.a11y-t3 .wrap{max-width:1860px}
@media(max-width:560px){html:is(.a11y-t2,.a11y-t3) .quick{grid-template-columns:1fr}}

/* Reflow at 320px (WCAG 1.4.10), any text size — design fixes: grid children
   may shrink below their content width, long words (emails) break, the finder
   row and header buttons wrap on very narrow screens. No effect at wider widths. */
:is(.layout,.reach,.how,.hero .grid,.faq,.testi,.db,.quick,.cats,aside)>*,.factrow>*{min-width:0}
:is(.content,aside,.reach,.offices){overflow-wrap:break-word}
.finder .row{flex-wrap:wrap}
@media(max-width:420px){
.bar .acts{flex-wrap:wrap}
.btn{white-space:normal;text-align:center;padding-left:16px;padding-right:16px}
.finder .row>*{flex:1 1 100%;min-width:0}
.card{padding-left:20px;padding-right:20px}
h1,h2,h3{overflow-wrap:break-word;hyphens:auto}
.offices li{grid-template-columns:minmax(0,1fr)}
.give-form{padding-left:18px;padding-right:18px}
}
/* The breadcrumb's separators have no spaces around them, so it couldn't
   wrap on narrow screens; wrap between items instead. */
.crumb{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:4px}

/* ===== Accessibility audit fixes (2026-09-29) ===== */
/* 1.4.3: the design's dark gold (#a8700c) was 3.6:1 on the cream page header
   and 4.2:1 on white for small bold text (eyebrows, dates). #8c5d00 is
   4.8:1 on cream and 5.7:1 on white; high contrast mode darkens it further. */
:root{--gold-d:#8c5d00}
/* 1.3.1: card titles in the sidebar and the donate card are now H2 (they
   followed the page H1 directly); keep the design's H3 look. */
:is(.card,.give-form) h2{font-size:1.3rem;margin:0 0 12px}
.give-form h2{font-size:1.4rem;text-align:center}
.card.navy h2{color:#fff}
