/* Catholic Parish of Datchet and Eton — stylesheet
   Two churches, two colours: St Augustine's (river green) and Our Lady of Sorrows (Marian blue),
   joined by a gold ground line. Change the colours in :root to re-theme the whole site. */

:root {
  --stone: #edefea;
  --paper: #fafaf7;
  --ink: #1b2a2f;
  --ink-soft: #42545a;
  --line: #c7cdc5;
  --datchet: #2a5c4b;
  --eton: #33477f;
  --gold: #b98a2c;
  --gold-light: #e2bc63;
  --gold-text: #7e5a12;
  --gold-wash: #f4eacb;
  --gold-edge: #e2d19a;
  --serif: "Alegreya", Georgia, "Times New Roman", serif;
  --sans: "Alegreya Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --measure: 68ch;
  --wrap: 72rem;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--stone);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.1875rem;
  line-height: 1.6;
}

img { display: block; max-width: 100%; height: auto; }

a {
  color: var(--eton);
  text-underline-offset: 0.18em;
  text-decoration-thickness: 0.08em;
}
a:hover { text-decoration-thickness: 0.16em; }

:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

h1, h2, h3 {
  margin: 0 0 0.5em;
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.15;
  color: var(--ink);
}
h1 { font-size: clamp(2.5rem, 6vw, 4rem); font-weight: 800; letter-spacing: -0.01em; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.4rem); }
h3 { font-size: 1.4rem; }
p { margin: 0 0 1em; }

.wrap { width: min(100% - 2.5rem, var(--wrap)); margin-inline: auto; }

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  left: 1rem; top: -4rem;
  z-index: 10;
  padding: 0.6rem 1rem;
  background: var(--ink);
  color: #fff;
}
.skip-link:focus { top: 1rem; }

/* ---------- Header ---------- */

.site-header { background: var(--paper); border-bottom: 1px solid var(--line); }

.header-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 2rem;
  padding-block: 1rem;
}

.wordmark {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  color: var(--ink);
  text-decoration: none;
}
.wordmark img { width: 3rem; height: 3rem; flex: none; }
.wordmark-name {
  display: block;
  max-width: 15rem;
  font-family: var(--serif);
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.1;
}
.wordmark-sub { display: block; margin-top: 0.15rem; font-size: 0.95rem; color: var(--ink-soft); }

.site-nav { margin-left: auto; }
.site-nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-nav a {
  display: block;
  padding: 0.4rem 0;
  border-bottom: 3px solid transparent;
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 500;
  text-decoration: none;
}
.site-nav a:hover { border-bottom-color: var(--line); }
.site-nav a[aria-current] { border-bottom-color: var(--gold); font-weight: 700; }

.nav-toggle {
  display: none;
  padding: 0.5rem 1rem;
  border: 2px solid var(--ink);
  border-radius: 3px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 60rem) {
  .js .nav-toggle { display: inline-block; }
  .js .site-nav { display: none; width: 100%; margin-left: 0; }
  .js .site-nav.is-open { display: block; }
  .site-nav ul { flex-direction: column; gap: 0; }
  .site-nav a { padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
  .site-nav a[aria-current] { border-bottom-color: var(--gold); }
}

/* ---------- Page heads and sections ---------- */

.page-head { padding-block: clamp(2rem, 5vw, 3.5rem) 0; }
.lede { max-width: var(--measure); font-size: 1.3rem; color: var(--ink-soft); }

.subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.75rem;
  margin: 1.75rem 0 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--line);
}
.subnav a {
  display: block;
  margin-bottom: -1px;
  padding: 0.6rem 0;
  border-bottom: 3px solid transparent;
  color: var(--ink);
  text-decoration: none;
}
.subnav a:hover { border-bottom-color: var(--line); }
.subnav a[aria-current="page"] { border-bottom-color: var(--datchet); font-weight: 700; }

.section { padding-block: clamp(2rem, 5vw, 3.5rem); }
.section + .section { border-top: 1px solid var(--line); }
.prose { max-width: var(--measure); }

.split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  gap: 2rem clamp(2rem, 6vw, 5rem);
  align-items: start;
}

/* ---------- Buttons ---------- */

.btn {
  display: inline-block;
  padding: 0.7rem 1.3rem;
  border: 2px solid var(--ink);
  border-radius: 3px;
  background: var(--ink);
  color: #fff;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}
.btn:hover { background: #0e1a1e; border-color: #0e1a1e; }
.btn--outline { background: transparent; color: var(--ink); }
.btn--outline:hover { background: var(--ink); color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; margin: 1.25rem 0; }

/* ---------- Home: two arched doorways ---------- */

.hero { padding-block: clamp(2.5rem, 6vw, 4.5rem) 0; }

.arches {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1rem, 3vw, 2.5rem);
  margin-top: clamp(2rem, 5vw, 3.5rem);
  border-bottom: 8px solid var(--gold);
}

.arch {
  position: relative;
  padding: 38% 1.5rem 2.25rem;
  border-radius: 999px 999px 0 0;
  background: var(--c);
  color: #fff;
  text-align: center;
}
.arch::before {
  content: "";
  position: absolute;
  inset: 0.75rem 0.75rem 0;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-bottom: 0;
  border-radius: 999px 999px 0 0;
  pointer-events: none;
}
.arch--datchet { --c: var(--datchet); }
.arch--eton { --c: var(--eton); }

.arch-cross {
  position: absolute;
  top: 14%;
  left: 50%;
  width: 1.4rem;
  height: auto;
  transform: translateX(-50%);
  color: var(--gold-light);
}
.arch h2 { margin-bottom: 0.1em; color: #fff; font-size: clamp(1.9rem, 3.6vw, 2.6rem); }
.arch .place { margin-bottom: 1rem; font-family: var(--serif); font-size: 1.3rem; font-style: italic; }
.arch address { margin-bottom: 1rem; font-style: normal; }
.arch .arch-time { margin-bottom: 1.25rem; font-size: 1.25rem; }
.arch .btn { border-color: #fff; background: transparent; color: #fff; }
.arch .btn:hover { background: #fff; color: var(--c); }
.arch :focus-visible { outline-color: #fff; }

@media (max-width: 44rem) {
  .arches { grid-template-columns: 1fr; gap: 2.5rem; border-bottom: 0; }
  .arch { padding-top: 34%; }
  .arch-cross { top: 12%; }
  .arch { border-bottom: 8px solid var(--gold); }
}

.notice {
  margin-top: clamp(2rem, 5vw, 3rem);
  border-block: 1px solid var(--gold-edge);
  background: var(--gold-wash);
}
.notice-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  padding-block: 1.25rem;
}
.notice p { max-width: var(--measure); margin: 0; }
.cta-line { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.cta-line p { margin: 0; }

/* ---------- Timetable ---------- */

.timetable {
  width: 100%;
  table-layout: fixed;
  border: 1px solid var(--line);
  border-collapse: collapse;
  background: var(--paper);
}
.timetable caption { padding-bottom: 0.75rem; color: var(--ink-soft); text-align: left; }
.timetable th,
.timetable td {
  padding: 0.85rem 1rem;
  border-top: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}
.timetable thead th { border-top: 0; color: #fff; font-family: var(--serif); font-size: 1.15rem; }
.timetable thead th:first-child { width: 9rem; background: var(--ink); }
.timetable thead th.col-datchet { background: var(--datchet); }
.timetable thead th.col-eton { background: var(--eton); }
.timetable tbody th { font-family: var(--serif); font-size: 1.15rem; }
.timetable td.none { color: var(--ink-soft); }
.timetable tr.is-today > * { background: var(--gold-wash); }
.today-flag {
  display: block;
  font-family: var(--sans);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--gold-text);
}

@media (max-width: 40rem) {
  .timetable th,
  .timetable td { padding: 0.7rem 0.6rem; font-size: 1.05rem; }
  .timetable thead th:first-child { width: 5.5rem; }
}

.notes { display: grid; gap: 1.25rem 3rem; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); margin: 2rem 0 0; }
.notes dt { font-family: var(--serif); font-size: 1.25rem; font-weight: 700; }
.notes dd { margin: 0.15rem 0 0; }

/* =========================================================
   HISTORY TEXT - PAGE FIT + JUSTIFIED
========================================================= */

.history-copy {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

.history-copy p {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    line-height: 1.72;
}

/* Keep headings naturally aligned */

.history-copy h2 {
    text-align: left;
}

/* Notes also use the page width */

.history-copy .source-note {
    width: 100%;
    box-sizing: border-box;
}

/* On smaller phones, left alignment reads better */

@media (max-width: 600px) {

    .history-copy p {
        text-align: left;
        hyphens: none;
        -webkit-hyphens: none;
    }

}

.history-copy {
    width: 100%;
    max-width: none;
}

/* ---------- Contact details ---------- */

.contact {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.4rem 1.25rem;
  margin: 1rem 0 0;
}
.contact dt { font-weight: 700; }
.contact dd { margin: 0; overflow-wrap: anywhere; }

.address-block { margin-bottom: 2rem; }
.address-block h3 { margin-bottom: 0.15em; }
.address-block address { margin-bottom: 0.75rem; font-style: normal; }
.address-block--datchet { padding-left: 1.1rem; border-left: 6px solid var(--datchet); }
.address-block--eton { padding-left: 1.1rem; border-left: 6px solid var(--eton); }
.person { padding-left: 1.1rem; border-left: 6px solid var(--gold); overflow-wrap: anywhere; }
.person h2 { font-size: 1.5rem; }

/* ---------- Pictures ---------- */

.photo { margin: 0; }
.photo img { width: 100%; min-height: 6rem; background: var(--line); }
.photo figcaption,
.portrait figcaption { padding-top: 0.5rem; color: var(--ink-soft); font-size: 0.95rem; }
.portrait { margin: 0; }
.portrait img { width: 100%; max-width: 24rem; background: var(--line); }

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 1.5rem 1.25rem;
  margin: 1rem 0 2.5rem;
  padding: 0;
  list-style: none;
}
.gallery figure { margin: 0; }
.gallery a { display: block; background: var(--line); }
.gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gallery figcaption { padding-top: 0.4rem; color: var(--ink-soft); font-size: 0.95rem; line-height: 1.35; }

.pdf-embed {
  width: 100%;
  height: min(80vh, 60rem);
  margin-top: 1rem;
  border: 1px solid var(--line);
  background: var(--paper);
}
@media (max-width: 48rem) { .pdf-embed { display: none; } }

.checklist { margin: 0 0 1.25rem; padding-left: 1.25rem; }
.checklist li { margin-bottom: 0.25rem; }

/* ---------- Newsletter archive ---------- */

.year-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.year-block { padding-top: 1.5rem; }
.year-block h2 { padding-bottom: 0.35rem; border-bottom: 2px solid var(--ink); }
.month {
  display: grid;
  grid-template-columns: 9rem 1fr;
  gap: 0.35rem 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--line);
}
.month h3 { margin: 0; padding-top: 0.2rem; font-size: 1.15rem; }
.month ul { display: flex; flex-wrap: wrap; gap: 0.4rem 0.6rem; margin: 0; padding: 0; list-style: none; }
.month li a,
.month li .pending {
  display: inline-block;
  min-width: 3.5rem;
  padding: 0.2rem 0.65rem;
  border: 1px solid var(--line);
  background: var(--paper);
  text-align: center;
  text-decoration: none;
}
.month li a:hover { border-color: var(--ink); }
.month li .pending { border-style: dashed; color: var(--ink-soft); }
@media (max-width: 36rem) { .month { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */

.site-footer {
  margin-top: clamp(3rem, 7vw, 5rem);
  padding-block: 2.5rem;
  background: var(--ink);
  color: #e6ebe8;
}
.site-footer a { color: #fff; }
.site-footer :focus-visible { outline-color: #fff; }
.site-footer h2 { margin-bottom: 0.4em; color: #fff; font-size: 1.25rem; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 2rem; }
.footer-grid address { font-style: normal; }
.footer-grid p { overflow-wrap: anywhere; }
.footer-grid ul { margin: 0; padding: 0; list-style: none; }
.footer-legal {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  color: #c5cfcb;
  font-size: 0.95rem;
}
.footer-legal p { margin-bottom: 0.25rem; }

/* ---------- Print ---------- */

@media print {
  body { background: #fff; font-size: 12pt; }
  .site-nav, .nav-toggle, .subnav, .btn, .skip-link, .pdf-embed, .site-footer .footer-grid { display: none; }
  .site-footer { background: none; color: #000; padding: 0; }
  .site-footer .footer-legal { border-color: #000; color: #000; }
}

/* ===== 2026 Glass redesign ===== */
:root{--glass:rgba(255,255,255,.70);--glass-strong:rgba(255,255,255,.88);--shadow:0 18px 55px rgba(23,42,47,.11);--shadow-sm:0 8px 28px rgba(23,42,47,.08);--radius:24px;--radius-sm:16px}
body{background:radial-gradient(circle at 8% 0%,rgba(185,138,44,.13),transparent 30rem),radial-gradient(circle at 95% 15%,rgba(51,71,127,.12),transparent 34rem),linear-gradient(135deg,#f4f6f2 0%,#eef2f4 55%,#f7f4ed 100%);background-attachment:fixed}
.site-header{position:sticky;top:0;z-index:20;background:rgba(250,250,247,.76);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:0 8px 30px rgba(27,42,47,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.header-inner{padding-block:.8rem}.wordmark img{filter:drop-shadow(0 5px 10px rgba(27,42,47,.12))}.site-nav a{border:0;border-radius:999px;padding:.55rem .85rem}.site-nav a:hover{background:rgba(255,255,255,.7)}.site-nav a[aria-current]{border:0;background:rgba(185,138,44,.14);box-shadow:inset 0 0 0 1px rgba(185,138,44,.22)}
.page-head{margin:1.4rem auto 0;width:min(calc(100% - 2rem),76rem);padding:clamp(2rem,5vw,4rem);border:1px solid rgba(255,255,255,.75);border-radius:32px;background:linear-gradient(135deg,rgba(255,255,255,.80),rgba(255,255,255,.48));box-shadow:var(--shadow);backdrop-filter:blur(18px)}.page-head .wrap{width:100%}.page-head h1{background:linear-gradient(100deg,var(--ink),var(--eton));-webkit-background-clip:text;background-clip:text;color:transparent}.subnav{border:0;gap:.55rem}.subnav a{margin:0;padding:.55rem .9rem;border:1px solid rgba(27,42,47,.1);border-radius:999px;background:rgba(255,255,255,.52)}.subnav a[aria-current="page"]{border-color:rgba(42,92,75,.25);background:rgba(42,92,75,.11)}
.section{border:0!important}.section>.wrap{padding:clamp(1.4rem,3vw,2.4rem);border:1px solid rgba(255,255,255,.78);border-radius:var(--radius);background:var(--glass);box-shadow:var(--shadow-sm);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.section+.section{padding-top:0}
.hero{padding-top:clamp(2rem,5vw,4rem)}.hero>.wrap{padding:clamp(2rem,5vw,4rem);border:1px solid rgba(255,255,255,.8);border-radius:32px;background:linear-gradient(135deg,rgba(255,255,255,.83),rgba(255,255,255,.48));box-shadow:var(--shadow);backdrop-filter:blur(18px)}.arches{border:0;gap:1.25rem}.arch{overflow:hidden;padding:8rem 1.5rem 2.25rem;border:1px solid rgba(255,255,255,.3);border-radius:var(--radius);box-shadow:0 18px 45px rgba(27,42,47,.16)}.arch::before{inset:0;background:linear-gradient(150deg,rgba(255,255,255,.18),transparent 45%);border:0;border-radius:inherit}.arch-cross{top:2.4rem}.notice{margin:1.5rem auto;width:min(calc(100% - 2.5rem),var(--wrap));border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.btn{border:0;border-radius:999px;padding:.78rem 1.25rem;box-shadow:0 7px 18px rgba(27,42,47,.12);transition:transform .2s ease,box-shadow .2s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 11px 24px rgba(27,42,47,.16)}.btn--outline{border:1px solid rgba(27,42,47,.16);background:rgba(255,255,255,.62)}
.photo,.portrait{overflow:hidden;border-radius:20px;background:rgba(255,255,255,.6);box-shadow:var(--shadow-sm)}.photo img,.portrait img{width:100%}.photo figcaption,.portrait figcaption{padding:.8rem 1rem}.gallery{gap:1rem}.gallery figure{height:100%;overflow:hidden;border:1px solid rgba(255,255,255,.8);border-radius:18px;background:rgba(255,255,255,.68);box-shadow:var(--shadow-sm)}.gallery img{transition:transform .35s ease}.gallery a:hover img{transform:scale(1.025)}
.timetable{overflow:hidden;border-radius:18px;box-shadow:0 0 0 1px rgba(27,42,47,.08)}.contact{padding:1.2rem;border-radius:18px;background:rgba(255,255,255,.52)}
.site-footer{margin-top:3rem;background:linear-gradient(135deg,#16282c,#22363b);color:#eef4f2}.site-footer h2,.site-footer a{color:#fff}.footer-grid>div{padding:1.2rem;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.05)}
.content-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.glass-card{padding:1.35rem;border:1px solid rgba(255,255,255,.82);border-radius:20px;background:rgba(255,255,255,.58);box-shadow:var(--shadow-sm)}.glass-card h3{margin-top:0}.history-copy{max-width:78ch}.history-copy p{margin-bottom:1.2rem}.history-meta{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 1.5rem}.pill{display:inline-block;padding:.35rem .7rem;border-radius:999px;background:rgba(185,138,44,.13);color:var(--gold-text);font-size:.95rem;font-weight:700}.sacrament-card{scroll-margin-top:7rem}.sacrament-card p:last-child{margin-bottom:0}.sacrament-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}.sacrament-nav a{padding:.5rem .8rem;border-radius:999px;background:rgba(255,255,255,.62);text-decoration:none;font-weight:700}.source-note{margin-top:1.5rem;padding:1rem;border-left:4px solid var(--gold);border-radius:0 14px 14px 0;background:rgba(244,234,203,.55)}
@media(max-width:60rem){.site-nav a{border-radius:12px}.js .site-nav.is-open{padding:.7rem;border-radius:18px;background:rgba(255,255,255,.92);box-shadow:var(--shadow-sm)}.arch{padding-top:6rem}}
@media(max-width:42rem){body{font-size:1.08rem}.wrap{width:min(100% - 1.25rem,var(--wrap))}.page-head{width:calc(100% - 1rem);border-radius:22px;padding:1.5rem}.hero>.wrap{padding:1.35rem;border-radius:22px}.arches{grid-template-columns:1fr}.section>.wrap{padding:1.2rem;border-radius:20px}.wordmark-name{font-size:1.15rem}.wordmark-sub{font-size:.85rem}}
/* 2026 glass refresh */
body{background:linear-gradient(135deg,#eef4ef 0%,#f4f6fb 52%,#f7f1e5 100%);background-attachment:fixed}.site-header{position:sticky;top:0;z-index:20;background:rgba(250,250,247,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 8px 30px rgba(27,42,47,.06)}.hero--home{padding-bottom:4rem;background:radial-gradient(circle at 15% 20%,rgba(42,92,75,.15),transparent 35%),radial-gradient(circle at 85% 30%,rgba(51,71,127,.16),transparent 34%)}.eyebrow{display:inline-block;margin-bottom:.6rem;color:var(--gold-text);font-weight:700;text-transform:uppercase;letter-spacing:.13em;font-size:.82rem}.church-photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2.5rem}.church-visual{overflow:hidden;border:1px solid rgba(255,255,255,.5);border-radius:28px;color:#fff;box-shadow:0 24px 55px rgba(21,37,43,.18)}.church-visual--green{background:linear-gradient(145deg,#214d3f,#2f715b)}.church-visual--blue{background:linear-gradient(145deg,#293b70,#405b9c)}.church-image{height:270px;background-size:cover;background-position:left center}.church-image--eton{background-position:right center}.church-copy{padding:1.6rem 1.8rem}.church-copy h2,.church-copy p{color:#fff}.church-copy>span{opacity:.8;text-transform:uppercase;letter-spacing:.12em;font-size:.85rem}.mass-pill{display:inline-block;margin:0;padding:.35rem .75rem;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(8px)}.section-heading{max-width:52rem;margin-bottom:1.7rem}.week-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.glass-card,.group-card,.pastoral-card,.feature-card{background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.82);box-shadow:0 16px 40px rgba(31,51,58,.09);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:22px}.week-grid .glass-card{display:flex;flex-direction:column;padding:1.15rem 1.3rem}.week-grid strong{font-family:var(--serif);font-size:1.3rem}.small-note{font-size:.92rem;color:var(--ink-soft);margin-top:1rem}.soft{background:rgba(255,255,255,.25)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}.feature-card{display:block;padding:2rem;color:var(--ink);text-decoration:none;transition:.2s transform,.2s box-shadow}.feature-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(31,51,58,.14)}.feature-card span{color:var(--gold-text);font-weight:700;text-transform:uppercase;font-size:.8rem;letter-spacing:.1em}.group-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.group-card{padding:1.7rem}.group-card h2{font-size:1.55rem}.group-icon{width:3rem;height:3rem;display:grid;place-items:center;border-radius:50%;background:var(--gold-wash);color:var(--gold-text);font-size:1.35rem;margin-bottom:1rem}.callout{margin-top:2rem;padding:2rem;border-radius:24px;background:linear-gradient(135deg,rgba(42,92,75,.1),rgba(51,71,127,.1));border:1px solid rgba(255,255,255,.8)}.pastoral-hero{background:linear-gradient(120deg,rgba(51,71,127,.11),transparent)}.pastoral-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.pastoral-card{padding:1.6rem;border-top:4px solid var(--eton)}.pastoral-card span{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--eton);font-weight:700}.pastoral-card h2{font-size:1.5rem;margin-top:.35rem}.foodbank-hero{background:linear-gradient(120deg,rgba(42,92,75,.14),transparent)}.glass-card.accent{padding:1.8rem;border-left:5px solid var(--datchet)}.message-form{display:grid;gap:1rem}.message-form label{font-weight:700}.message-form input,.message-form textarea{width:100%;padding:.8rem 1rem;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.78);font:inherit}.message-form textarea{min-height:160px;resize:vertical}.hp{position:absolute;left:-9999px}@media(max-width:60rem){.church-photo-grid,.feature-grid,.group-grid,.pastoral-grid{grid-template-columns:1fr 1fr}.week-grid{grid-template-columns:1fr 1fr}}@media(max-width:42rem){.church-photo-grid,.feature-grid,.group-grid,.pastoral-grid,.week-grid{grid-template-columns:1fr}.church-image{height:210px}}

/* Newsletter-synchronised Mass table */
.mass-table-wrap{overflow-x:auto;border-radius:20px;border:1px solid rgba(255,255,255,.9);box-shadow:0 16px 40px rgba(31,51,58,.09);background:rgba(255,255,255,.72);backdrop-filter:blur(16px)}
.newsletter-mass-table{width:100%;border-collapse:collapse;font-size:clamp(1.05rem,2vw,1.28rem)}
.newsletter-mass-table th{padding:.8rem 1rem;text-align:left;background:linear-gradient(135deg,rgba(42,92,75,.14),rgba(51,71,127,.12));font-family:var(--serif);font-size:1.15em}
.newsletter-mass-table td{padding:.7rem 1rem;border-top:1px solid rgba(27,42,47,.12)}
.newsletter-mass-table tbody tr:hover{background:rgba(255,255,255,.55)}
.newsletter-mass-table td:first-child{font-weight:700}.mass-auto-note{margin:.75rem 0 0;color:var(--ink-soft);font-size:.9rem}
.pastoral-card h2 a{color:inherit;text-decoration:none}.pastoral-card h2 a::after{content:' ↗';font-family:var(--sans);font-size:.7em;color:var(--eton)}.pastoral-card h2 a:hover{text-decoration:underline;text-underline-offset:.18em}
@media(max-width:42rem){.newsletter-mass-table th,.newsletter-mass-table td{padding:.62rem .7rem}}

/* ---------- Parish photography placed across content pages ---------- */
.editorial-photo{margin:1.5rem 0 0;overflow:hidden;border:1px solid rgba(255,255,255,.55);border-radius:24px;background:rgba(255,255,255,.58);box-shadow:0 18px 45px rgba(18,42,48,.12);backdrop-filter:blur(14px)}
.editorial-photo img{display:block;width:100%;height:clamp(230px,34vw,460px);object-fit:cover}.editorial-photo--portrait img{height:clamp(300px,42vw,540px);object-position:center}.editorial-photo figcaption{padding:.8rem 1rem;color:var(--ink-soft);font-size:.95rem}.photo-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:1.5rem}.photo-pair .editorial-photo{margin:0}.page-photo-strip{margin-top:1.5rem}.page-photo-strip img{width:100%;max-height:420px;object-fit:cover;border-radius:24px;box-shadow:0 18px 45px rgba(18,42,48,.12)}@media(max-width:42rem){.photo-pair{grid-template-columns:1fr}}


/* ===== V5 homepage services, contact image and former priests ===== */
.home-service-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.4rem;align-items:stretch}
.home-service-grid>.glass-card{padding:clamp(1.25rem,2.5vw,2rem);margin:0}.weekly-mass-card .section-heading{margin-bottom:1.15rem}.weekly-mass-card .section-heading h2{font-size:clamp(1.8rem,3vw,2.5rem)}.weekly-mass-card .section-heading p{font-size:.98rem}.weekly-mass-card .btn-row{margin-top:1rem}.weekly-mass-card .newsletter-mass-table{font-size:1.02rem}.weekly-mass-card .newsletter-mass-table th,.weekly-mass-card .newsletter-mass-table td{padding:.58rem .7rem}
.spiritual-card{background:linear-gradient(145deg,rgba(42,92,75,.12),rgba(255,255,255,.72))!important}.spiritual-card h2{font-size:clamp(2rem,3vw,2.7rem);margin-bottom:1.1rem}.spiritual-list{display:grid;gap:.7rem;margin:0 0 1.35rem}.spiritual-item{display:grid;grid-template-columns:3rem 1fr;gap:.85rem;align-items:center;padding:.8rem .9rem;border-radius:16px;background:rgba(255,255,255,.58);border:1px solid rgba(255,255,255,.82)}.spiritual-icon{width:3rem;height:3rem;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--datchet),#43856e);color:#fff;font-size:1.3rem;box-shadow:0 8px 20px rgba(42,92,75,.18)}.spiritual-item h3{margin:0;font-size:1.28rem}.spiritual-item p{margin:.1rem 0 0;color:var(--ink-soft)}
.contact-church-photo{margin:1.25rem 0 0;overflow:hidden;border-radius:20px;background:rgba(255,255,255,.65);box-shadow:var(--shadow-sm)}.contact-church-photo img{display:block;width:100%;height:270px;object-fit:cover}.contact-church-photo figcaption{padding:.65rem .85rem;color:var(--ink-soft);font-size:.92rem}
.former-priests-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}.priest-era{padding:1.2rem 1.35rem;border:1px solid rgba(255,255,255,.84);border-radius:18px;background:rgba(255,255,255,.6);box-shadow:var(--shadow-sm)}.priest-era span{display:block;margin-bottom:.25rem;color:var(--gold-text);font-weight:700;letter-spacing:.05em}.priest-era h2{margin:0;font-size:1.35rem}
@media(max-width:52rem){.home-service-grid{grid-template-columns:1fr}.former-priests-grid{grid-template-columns:1fr}}
/* V6 refinements */
.priest-profile-split{grid-template-columns:minmax(0,3fr) minmax(9rem,1fr);gap:clamp(1.5rem,4vw,3rem)}
.priest-profile-split .portrait{justify-self:end;max-width:10rem}
.priest-profile-split .portrait img{max-width:10rem}
.spiritual-card .btn-row{margin-top:1.25rem;display:grid;grid-template-columns:1fr;gap:.7rem}
.spiritual-card .btn-row .btn{width:100%;text-align:center;border-radius:999px;padding:.9rem 1.2rem}
.page-photo-strip{width:min(1180px,calc(100% - 2rem));height:clamp(220px,34vw,430px);margin:0 auto 2rem;overflow:hidden;border-radius:26px;box-shadow:0 18px 45px rgba(31,51,58,.13)}
.page-photo-strip img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:42rem){.priest-profile-split{grid-template-columns:1fr}.priest-profile-split .portrait{justify-self:start;max-width:9rem}.priest-profile-split .portrait img{max-width:9rem}}

/* ===== V7 sacrament imagery + About priest profile refinements ===== */
.sacrament-hero img{object-position:center 18%;}
.sacrament-card{overflow:hidden;padding:0 1.35rem 1.35rem;}
.sacrament-card-photo{display:block;width:calc(100% + 2.7rem);height:180px;margin:0 -1.35rem 1.15rem;object-fit:cover;object-position:center;}
.sacrament-card h2{margin-top:.15rem;}
.priest-profile-split{align-items:stretch;grid-template-columns:minmax(0,4fr) minmax(10rem,1fr);}
.priest-profile-split .portrait{display:flex;flex-direction:column;justify-self:stretch;max-width:none;margin:0;}
.priest-profile-split .portrait img{width:100%;max-width:none;height:100%;min-height:220px;object-fit:cover;object-position:center top;border-radius:18px;}
.priest-profile-split .portrait figcaption{padding-top:.55rem;}
@media(max-width:42rem){.priest-profile-split .portrait{max-width:13rem}.priest-profile-split .portrait img{max-width:13rem;height:auto;min-height:0}}

/* V9 church photo collages — fixed crop matching supplied reference */
.church-photo-grid--collage .church-collage-card{overflow:hidden}
.church-collage{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px 14px 0;height:300px}
.church-collage img{width:100%;height:100%;object-fit:cover;display:block;border-radius:4px}
.church-collage img:nth-child(1){object-position:center center}
.church-collage img:nth-child(2){object-position:center center}
.church-collage img:nth-child(3){object-position:center center}
@media(max-width:760px){.church-collage{height:210px;gap:6px;padding:9px 9px 0}.church-photo-grid--collage{grid-template-columns:1fr}}

/* V10: parish team, parish-life tiles and open Parish Groups */
.team-card{padding:clamp(1.5rem,3vw,2.4rem);overflow:hidden;position:relative}
.team-card:after{content:"";position:absolute;right:-5rem;top:-5rem;width:14rem;height:14rem;border-radius:50%;background:radial-gradient(circle,rgba(197,155,68,.16),transparent 70%);pointer-events:none}
.team-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:1.4rem}
.team-grid>div{padding:1.15rem;border-radius:18px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.9)}
.team-grid strong,.team-grid span{display:block}.team-grid strong{color:var(--gold-text);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.35rem}.team-grid span{font-family:var(--serif);font-size:1.25rem;color:var(--ink)}
.parish-groups-open{align-items:stretch}.parish-groups-open>div{align-self:center}.parish-groups-photo{margin:0;min-height:300px}.parish-groups-photo img{height:100%;min-height:300px;object-fit:cover}
/* Let parish-life photographs fill their tiles edge-to-edge. */
.gallery{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.gallery li{min-width:0}.gallery figure{display:flex;flex-direction:column;height:100%}.gallery a{flex:1;min-height:230px}.gallery img{height:100%;min-height:230px;aspect-ratio:auto;object-fit:cover}.gallery figcaption{padding:.65rem .8rem .8rem}
.feature-grid:has(> .feature-card:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.moved-devotional{margin:2rem 0}.moved-devotional img{object-position:center 35%}
@media(max-width:60rem){.team-grid{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:42rem){.team-grid,.gallery,.feature-grid:has(> .feature-card:nth-child(2):last-child){grid-template-columns:1fr}}

/* =========================================================
   CHURCH STONE THEME — 22/09/2026
   Warm cream / stone shades sampled from the supplied church image.
   This final override intentionally replaces the former green/blue/gold
   accents throughout the site while preserving layout and photography.
========================================================= */

:root {
  --stone: #d8d2c2;
  --paper: #f4f0e6;
  --ink: #4f493e;
  --ink-soft: #756d5f;
  --line: #c2b9a6;

  /* Existing variable names retained so every old page adopts one palette */
  --datchet: #9e9078;
  --eton: #9e9078;
  --gold: #b0a48d;
  --gold-light: #d5cbb8;
  --gold-text: #635b4d;
  --gold-wash: #e9e3d6;
  --gold-edge: #c9bea9;

  --glass: rgba(244,240,230,.72);
  --glass-strong: rgba(244,240,230,.90);
  --shadow: 0 18px 55px rgba(99,91,77,.13);
  --shadow-sm: 0 8px 28px rgba(99,91,77,.10);
}

/* Overall warm stone background */
body {
  background:
    radial-gradient(circle at 8% 0%, rgba(176,164,141,.24), transparent 30rem),
    radial-gradient(circle at 95% 15%, rgba(158,144,120,.18), transparent 34rem),
    linear-gradient(135deg,#e7e1d4 0%,#f1ede4 52%,#ddd5c5 100%) !important;
  background-attachment: fixed !important;
}

/* Header and navigation */
.site-header {
  background: rgba(244,240,230,.86) !important;
  border-bottom-color: rgba(158,144,120,.24) !important;
  box-shadow: 0 8px 30px rgba(99,91,77,.08) !important;
}

.site-nav a:hover {
  background: rgba(216,210,194,.58) !important;
}

.site-nav a[aria-current] {
  background: rgba(176,164,141,.24) !important;
  box-shadow: inset 0 0 0 1px rgba(158,144,120,.28) !important;
}

/* Keep the logo in the same stone family */
.wordmark img {
  filter: sepia(.34) saturate(.62) hue-rotate(355deg) brightness(.93) contrast(.88)
          drop-shadow(0 5px 10px rgba(99,91,77,.16)) !important;
}

/* Page headers */
.page-head {
  border-color: rgba(255,255,255,.60) !important;
  background: linear-gradient(135deg,rgba(244,240,230,.91),rgba(216,210,194,.66)) !important;
  box-shadow: var(--shadow) !important;
}

.page-head h1 {
  background: linear-gradient(100deg,#4f493e,#9e9078) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.subnav a {
  border-color: rgba(99,91,77,.14) !important;
  background: rgba(244,240,230,.62) !important;
}

.subnav a[aria-current="page"] {
  border-color: rgba(158,144,120,.40) !important;
  background: rgba(176,164,141,.22) !important;
}

/* Main glass cards */
.section > .wrap,
.glass-card,
.group-card,
.pastoral-card,
.feature-card,
.priest-era,
.team-grid > div {
  border-color: rgba(255,255,255,.62) !important;
  background: rgba(244,240,230,.72) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* Homepage hero */
.hero > .wrap {
  border-color: rgba(255,255,255,.64) !important;
  background: linear-gradient(135deg,rgba(244,240,230,.91),rgba(216,210,194,.61)) !important;
}

.hero--home {
  background:
    radial-gradient(circle at 15% 20%,rgba(176,164,141,.25),transparent 35%),
    radial-gradient(circle at 85% 30%,rgba(158,144,120,.22),transparent 34%) !important;
}

/* All accent text */
.eyebrow,
.feature-card span,
.priest-era span,
.team-grid strong,
.today-flag {
  color: #635b4d !important;
}

/* Buttons */
.btn {
  background: #635b4d !important;
  border-color: #635b4d !important;
  color: #fff !important;
  box-shadow: 0 7px 18px rgba(99,91,77,.18) !important;
}

.btn:hover {
  background: #4f493e !important;
  border-color: #4f493e !important;
}

.btn--outline {
  background: rgba(244,240,230,.72) !important;
  color: #635b4d !important;
  border: 1px solid rgba(99,91,77,.28) !important;
}

.btn--outline:hover {
  background: #635b4d !important;
  color: #fff !important;
}

/* Homepage church cards — both use the church stone palette */
.v2-church-card--datchet,
.v2-church-card--eton {
  background: #e9e3d6 !important;
  border-color: #b0a48d !important;
  box-shadow: 0 18px 45px rgba(99,91,77,.16) !important;
}

.v2-church-card--datchet .v2-photo-area,
.v2-church-card--eton .v2-photo-area {
  background: linear-gradient(180deg,#f4f0e6 0%,#d8d2c2 100%) !important;
}

.v2-church-card--datchet .v2-church-info,
.v2-church-card--eton .v2-church-info {
  background: linear-gradient(135deg,#9e9078 0%,#635b4d 100%) !important;
}

/* Older church-card classes, if still used on other versions/pages */
.church-visual--green,
.church-visual--blue {
  background: linear-gradient(145deg,#9e9078,#635b4d) !important;
}

/* Spiritual activities */
.spiritual-card {
  background: linear-gradient(145deg,rgba(176,164,141,.25),rgba(244,240,230,.78)) !important;
}

.spiritual-item {
  background: rgba(244,240,230,.72) !important;
  border-color: rgba(255,255,255,.65) !important;
}

.spiritual-icon {
  background: linear-gradient(145deg,#9e9078,#635b4d) !important;
  box-shadow: 0 8px 20px rgba(99,91,77,.20) !important;
}

/* Mass tables */
.mass-table-wrap {
  background: rgba(244,240,230,.78) !important;
  border-color: rgba(255,255,255,.68) !important;
  box-shadow: 0 16px 40px rgba(99,91,77,.11) !important;
}

.newsletter-mass-table th {
  background: linear-gradient(135deg,rgba(176,164,141,.30),rgba(158,144,120,.20)) !important;
}

.newsletter-mass-table td {
  border-top-color: rgba(99,91,77,.15) !important;
}

.newsletter-mass-table tbody tr:hover {
  background: rgba(216,210,194,.36) !important;
}

.timetable thead th:first-child,
.timetable thead th.col-datchet,
.timetable thead th.col-eton {
  background: #756d5f !important;
}

.timetable tr.is-today > * {
  background: #e9e3d6 !important;
}

/* Callouts / notices / source notes */
.notice,
.source-note,
.callout {
  background: rgba(233,227,214,.78) !important;
  border-color: #c9bea9 !important;
}

.source-note {
  border-left-color: #9e9078 !important;
}

.callout,
.pastoral-hero,
.foodbank-hero {
  background: linear-gradient(120deg,rgba(176,164,141,.22),rgba(244,240,230,.48)) !important;
}

.pastoral-card {
  border-top-color: #9e9078 !important;
}

.pastoral-card span,
.pastoral-card h2 a::after {
  color: #756d5f !important;
}

.glass-card.accent {
  border-left-color: #9e9078 !important;
}

/* Forms */
.message-form input,
.message-form textarea {
  border-color: #c2b9a6 !important;
  background: rgba(244,240,230,.82) !important;
}

/* Photos / gallery surrounding cards */
.photo,
.portrait,
.editorial-photo,
.contact-church-photo,
.gallery figure {
  background: rgba(244,240,230,.68) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* Newsletter/archive controls */
.month li a,
.month li .pending {
  background: #f4f0e6 !important;
  border-color: #c2b9a6 !important;
}

/* Footer */
.site-footer {
  background: linear-gradient(135deg,#4f493e,#635b4d) !important;
  color: #f4f0e6 !important;
}

.site-footer h2,
.site-footer a {
  color: #fff !important;
}

.footer-grid > div {
  border-color: rgba(244,240,230,.14) !important;
  background: rgba(244,240,230,.06) !important;
}

.footer-legal {
  color: #d8d2c2 !important;
  border-top-color: rgba(244,240,230,.18) !important;
}

/* Address accents */
.address-block--datchet,
.address-block--eton {
  border-left-color: #9e9078 !important;
}

.person {
  border-left-color: #b0a48d !important;
}

/* Selection/focus accent */
:focus-visible {
  outline-color: #635b4d !important;
}



/* ===== GLOBAL UNIFORM FOOTER — 22/09/2026 ===== */
.footer-grid {
  display: grid !important;
  grid-template-columns: minmax(180px,.70fr) minmax(180px,.70fr) minmax(430px,1.60fr) !important;
  gap: 1.25rem !important;
  align-items: stretch;
}

.footer-grid > div {
  min-width: 0;
}

.footer-safeguarding-card h2 {
  margin-top: 0;
}

.footer-safeguarding-card p {
  margin-bottom: 0;
  line-height: 1.65;
}

.footer-safeguarding-card a[href^="mailto:"] {
  white-space: nowrap;
}

@media (max-width: 900px) {
  .footer-grid {
    grid-template-columns: 1fr !important;
  }

  .footer-safeguarding-card a[href^="mailto:"] {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}
