
:root{
  --bg:#e8edf1;
  --bg-soft:#f5f7f9;
  --surface:#ffffff;
  --surface-2:#fbfbfc;
  --text:#1d2430;
  --muted:#5b6472;
  --accent:#b38a2e;
  --accent-deep:#6e5318;
  --nav:#1c2430;
  --nav-2:#2a3443;
  --border:#d8dee6;
  --shadow:0 14px 36px rgba(21,31,45,.12);
  --radius:20px;
  --radius-sm:12px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  font-family: Inter, Arial, Helvetica, sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#edf2f5 0%, #e8edf1 280px, #f7f8fa 281px, #f7f8fa 100%);
  line-height:1.7;
  font-size:18px;
}
a{color:#154d8f;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:14px;top:14px;width:auto;height:auto;padding:12px 14px;background:#fff;border-radius:12px;z-index:9999;box-shadow:var(--shadow)}
.hero,.page-shell{position:relative; background:#253142 center/cover no-repeat; color:#fff}
.hero{min-height:84svh;display:flex;flex-direction:column}
.hero::before,.page-shell::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,22,32,.76),rgba(21,33,46,.34) 34%,rgba(21,33,46,.76))}
.topbar{position:sticky;top:0;z-index:30;background:rgba(20,28,39,.82);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.12)}
.nav-wrap{max-width:var(--max);margin:0 auto;padding:0 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:78px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;font-weight:700;min-width:0}
.brand img{width:50px;height:50px;border-radius:50%;border:2px solid rgba(255,255,255,.75);object-fit:cover;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.brand span{font-size:1rem;line-height:1.25;white-space:normal;max-width:16ch}
.nav-toggle{display:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.24);color:#fff;padding:10px 14px;border-radius:999px;font-weight:700}
.main-nav{display:flex;flex-wrap:wrap;justify-content:flex-end}
.main-nav a{display:block;color:#fff;padding:28px 14px 26px;font-size:.97rem;border-bottom:3px solid transparent}
.main-nav a.active,.main-nav a:hover{border-bottom-color:var(--accent);background:rgba(255,255,255,.08);text-decoration:none}
.hero-inner,.page-title-banner{position:relative;z-index:2;max-width:var(--max);margin:0 auto;width:100%;padding:0 20px}
.hero-inner{padding-top:clamp(84px,9vw,120px);padding-bottom:clamp(56px,8vw,94px);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.95fr);gap:28px;align-items:end;min-height:calc(84svh - 78px)}
.hero-copy{max-width:760px}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.14);font-size:.92rem;margin-bottom:20px}
.hero-inner h1,.page-title-banner h1{font-family: Georgia, 'Times New Roman', serif;font-weight:400;line-height:1.08;letter-spacing:.01em;margin:0;text-wrap:balance}
.hero-inner h1{font-size:clamp(2.5rem,6vw,4.5rem);margin-bottom:18px}
.hero-inner p{font-size:clamp(1.1rem,2.1vw,1.35rem);max-width:42rem;margin:0;color:#f4f7fa}
.hero-panel{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px);padding:22px;border-radius:24px;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.hero-panel h2{margin:0 0 10px;font-size:1.15rem;color:#fff}
.hero-panel p{font-size:1rem;margin:0}
.hero-panel .mass-time{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;margin-top:12px;color:#fff}
.page-title-banner{display:flex;align-items:flex-end;min-height:290px;padding-bottom:26px}
.page-title-banner h1{font-size:clamp(2.3rem,5vw,4.2rem);text-shadow:0 2px 10px rgba(0,0,0,.3)}
.container{max-width:var(--max);margin:0 auto;padding:28px 20px 44px}
.home-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.9fr);gap:28px;align-items:start;margin-top:-56px;position:relative;z-index:4}
.stack{display:grid;gap:28px}
.card,.content-card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.content-card{padding:clamp(24px,3vw,40px)}
.panel{padding:22px}
.content-card h1,.content-card h2,.content-card h3,.content-card h4,.panel h2,.panel h3{font-family: Georgia, 'Times New Roman', serif;color:#1a2330;line-height:1.2;margin:0 0 16px}
.content-card h1{font-size:clamp(2rem,4vw,2.8rem)}
.content-card h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-top:28px}
.content-card h3{font-size:clamp(1.35rem,2.5vw,1.8rem);margin-top:26px}
.content-card h4,.panel h3{font-size:1.32rem}
.content-card p,.content-card li,.panel p,.panel li{font-size:1.03rem}
.content-card > :first-child{margin-top:0}
.content-card figure{margin:22px 0}
.content-card .aligncenter{text-align:center}
.content-card iframe,.content-card video{width:100%;max-width:100%}
.content-card hr{border:none;border-top:1px solid var(--border);margin:30px 0}
.muted{color:var(--muted)}
.quick-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.quick-link{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border:1px solid var(--border);border-radius:16px;background:var(--surface-2);font-weight:600;color:var(--text)}
.quick-link:hover{text-decoration:none;border-color:#c7a45a;transform:translateY(-1px)}
.feature-image{overflow:hidden;border-radius:18px;background:#dbe2ea}
.feature-image img{display:block;width:100%;height:auto}
.info-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tile{padding:18px;border-radius:18px;background:linear-gradient(180deg,#faf8f1,#f4efe2);border:1px solid #e4d5aa}
.tile h4{margin:0 0 6px;font-size:1.05rem}
.tile p{margin:0;font-size:1rem}
.contact-block p{margin:.35em 0}
.info-list{padding-left:1.2rem;margin:0}
.widget-card{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid var(--border);border-radius:18px;padding:20px}
.widget-card .small,.small{font-size:.95rem;color:var(--muted)}
.widget-card .saint-name{font-size:1.35rem;font-family:Georgia,serif;margin:.2rem 0 .55rem}
.calendar-frame{width:100%;height:760px;border:0;border-radius:16px;background:#fff}
.facebook-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr);gap:28px;align-items:start}
.fb-side{display:grid;gap:20px;position:sticky;top:96px}
.fb-embed{width:100%;min-height:720px;border:1px solid var(--border);background:#fff;border-radius:18px;overflow:hidden}
.news-list article{padding:0 0 24px;margin:0 0 24px;border-bottom:1px solid var(--border)}
.news-list article:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}
.news-date{color:var(--muted);font-size:.95rem}
.bulletin-embed{width:100%;height:min(1100px,85vh);border:1px solid var(--border);border-radius:18px;background:#f7f8fa}
.bulletin-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 0}
.button{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--nav);color:#fff;font-weight:700;border:0}
.button.alt{background:#fff;color:var(--nav);border:1px solid var(--border)}
.button:hover{text-decoration:none;filter:brightness(1.02)}
.footer{margin-top:28px;background:linear-gradient(180deg,#1a2330,#121822);color:#f2f5f7;padding:34px 0 24px}
.footer .container{padding-top:0;padding-bottom:0}
.footer-grid{display:grid;grid-template-columns:1.2fr .9fr 1fr;gap:28px}
.footer h3{font-family:Georgia,serif;margin:0 0 12px;font-size:1.35rem}
.footer p,.footer li,.footer a{color:#d6deea}
.footer a:hover{color:#fff}
.footer ul{padding-left:1.1rem;margin:0}
.search-box input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;font-size:1rem}
.search-box input::placeholder{color:#d6deea}
.copy{border-top:1px solid rgba(255,255,255,.14);margin-top:24px;padding-top:16px;color:#bcc6d4;font-size:.92rem}
.to-top{position:fixed;right:18px;bottom:18px;background:var(--nav);color:#fff;border:0;border-radius:999px;width:48px;height:48px;display:none;box-shadow:0 12px 26px rgba(0,0,0,.25);cursor:pointer;font-size:1.1rem}
.to-top.show{display:block}
.notice{padding:16px 18px;border-left:4px solid var(--accent);background:#f8f3e3;border-radius:14px;color:#413217}
.embed-fallback{margin-top:14px;padding:14px 16px;border-radius:14px;background:#f6f8fa;border:1px solid var(--border)}
@media (max-width: 1080px){
  .hero-inner,.home-grid,.facebook-wrap,.footer-grid{grid-template-columns:1fr}
  .hero{min-height:72svh}
  .hero-inner{min-height:auto}
  .fb-side{position:static}
}
@media (max-width: 820px){
  body{font-size:17px}
  .nav-toggle{display:block}
  .main-nav{display:none;position:absolute;right:18px;top:74px;flex-direction:column;min-width:min(280px,calc(100vw - 36px));background:rgba(18,24,34,.97);border:1px solid rgba(255,255,255,.12);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
  .main-nav.open{display:flex}
  .main-nav a{padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.08);border-left:3px solid transparent}
  .main-nav a.active,.main-nav a:hover{border-bottom-color:transparent;border-left-color:var(--accent)}
  .page-title-banner{min-height:220px}
  .home-grid{margin-top:-30px}
  .quick-links,.info-tiles{grid-template-columns:1fr}
}
@media (max-width: 560px){
  .nav-wrap{min-height:72px}
  .brand img{width:44px;height:44px}
  .brand span{font-size:.92rem}
  .container{padding-inline:14px}
  .content-card,.panel{padding:18px}
  .hero-inner,.page-title-banner{padding-inline:14px}
  .hero-kicker{font-size:.84rem}
}

/* CUSTOM OVERRIDES */
:root{
  --accent:#7b1e2b;
  --accent-deep:#54111c;
  --nav:#17202b;
}
a{color:#8a2030}
a:hover{color:#54111c}
.topbar{background:rgba(20,25,33,.9)}
.main-nav a.active,.main-nav a:hover{border-bottom-color:var(--accent);background:rgba(123,30,43,.18)}
.hero,.page-shell{background-position:center center}
.hero{min-height:92svh}
.hero::before,.page-shell::before{background:linear-gradient(180deg,rgba(19,22,29,.68),rgba(41,19,24,.28) 38%,rgba(25,26,35,.72))}
.hero-panel{background:rgba(28,17,21,.36);border-color:rgba(255,255,255,.14)}
.button{background:var(--accent)}
.button.alt{color:var(--accent);border-color:#d8b9bf;background:#fff}
.notice{border-left-color:var(--accent);background:#f7eff1;color:#4a1521}
.page-title-banner{min-height:360px;padding-bottom:0;background-position:center center}
.page-title-banner.hero-visual{display:block}
.footer .copy{text-align:center}
.gallery-block{margin:26px 0 12px}
.gallery-stage{position:relative;background:#f2f2f2;border:1px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.gallery-main-image{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#dbe0e6}
.gallery-controls{position:absolute;inset:auto 14px 14px auto;display:flex;gap:10px}
.gallery-arrow{width:46px;height:46px;border-radius:999px;border:0;background:rgba(23,32,43,.76);color:#fff;font-size:2rem;line-height:1;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.gallery-thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:10px;margin-top:12px}
.gallery-thumb{padding:0;border:2px solid transparent;border-radius:14px;overflow:hidden;background:#fff;cursor:pointer}
.gallery-thumb img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery-thumb.active{border-color:var(--accent);box-shadow:0 6px 18px rgba(123,30,43,.18)}
.video-embed{position:relative;padding-top:56.25%;border-radius:18px;overflow:hidden;margin-top:18px;background:#111}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.anchor-menu{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 28px}
.prayer-section{scroll-margin-top:108px;margin-top:12px;padding-top:8px}
.prayer-section h2{padding-bottom:8px;border-bottom:2px solid #efe1e4}
.fb-embed{min-height:920px;padding:12px}
.fb-embed .fb-page,.fb-embed span,.fb-embed iframe{max-width:100% !important}
.widget-card .saint-name{color:var(--accent-deep)}
.widget-card .small{color:#6e5860}
body{background:linear-gradient(180deg,#f0f2f4 0%, #eef0f3 260px, #fbfbfc 261px, #fbfbfc 100%)}
.content-card,.panel{border-radius:22px}
@media (max-width:1080px){.page-title-banner{min-height:300px}}
 (max-width:820px){.page-title-banner{min-height:240px}.fb-embed{min-height:700px}.hero{min-height:auto}.calendar-frame{height:900px}}



/* ROUND 2 REFINEMENTS */
:root{
  --accent:#7b1e2b;
  --accent-deep:#5b1621;
}
a{color:#7b1e2b}
a:hover{color:#7b1e2b}
.button,
.button.alt,
.quick-link,
.anchor-menu .button,
.school-links .button,
.wp-block-file__button,
.embed-fallback .button{
  background:var(--accent) !important;
  color:#fff !important;
  border:1px solid rgba(0,0,0,.06) !important;
  box-shadow:0 10px 24px rgba(123,30,43,.18);
}
.button:hover,
.button.alt:hover,
.quick-link:hover,
.anchor-menu .button:hover,
.school-links .button:hover,
.wp-block-file__button:hover,
.embed-fallback .button:hover{
  background:var(--accent-deep) !important;
  color:#fff !important;
  text-decoration:none;
}
.quick-link{
  min-height:64px;
  border-radius:18px;
  border:0;
}
.quick-link span{color:#fff}
.main-nav a{color:#fff !important; border-radius:10px 10px 0 0; margin-left:2px; margin-right:2px}
.main-nav a.active,.main-nav a:hover{
  color:#fff !important;
  background:var(--accent);
  border-bottom-color:var(--accent);
}
@media (max-width: 820px){
  .main-nav a.active,.main-nav a:hover{
    color:#fff !important;
    background:rgba(123,30,43,.9);
    border-left-color:var(--accent);
  }
}
.panel h3,.content-card h2,.content-card h3,.content-card h4{scroll-margin-top:110px}
.hero-panel .button{margin-top:10px}
.video-embed{
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:20px;
  background:#111;
  box-shadow:var(--shadow);
  margin:16px 0 18px;
}
.video-embed::before{
  content:"";
  display:block;
  padding-top:56.25%;
}
.video-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.fb-embed{
  min-height:920px;
  border-radius:20px;
  overflow:hidden;
  background:#fff;
}
.fb-embed iframe{
  width:100%;
  min-height:920px;
  border:0;
}
.anchor-menu{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:22px 0 30px;
}
.school-links{
  display:grid;
  gap:14px;
  margin-top:28px;
}
.school-links .button{
  justify-content:center;
  padding:16px 18px;
  border-radius:18px;
  text-align:center;
}
.gallery-block{
  margin:26px 0 6px;
  border-radius:22px;
  overflow:hidden;
  background:#f2f4f7;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
}
.gallery-stage{
  position:relative;
  background:#10151d;
}
.gallery-main-image{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
}
.gallery-controls{
  position:absolute;
  inset:auto 16px 16px auto;
  display:flex;
  gap:10px;
}
.gallery-arrow{
  width:44px;
  height:44px;
  border-radius:999px;
  border:0;
  background:rgba(123,30,43,.92);
  color:#fff;
  font-size:1.6rem;
  line-height:1;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,0,0,.25);
}
.gallery-arrow:hover{background:var(--accent-deep)}
.gallery-thumbs{
  display:flex;
  gap:10px;
  overflow:auto;
  padding:14px;
  background:#fff;
}
.gallery-thumb{
  border:2px solid transparent;
  border-radius:14px;
  padding:0;
  background:none;
  cursor:pointer;
  overflow:hidden;
  flex:0 0 96px;
}
.gallery-thumb img{
  display:block;
  width:96px;
  height:72px;
  object-fit:cover;
}
.gallery-thumb.active{
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(123,30,43,.1);
}


/* ROUND 4 REFINEMENTS */
.page-title-banner.hero-uniform{min-height:420px;background-size:cover;background-position:center 34%;}
.page-title-banner.hero-uniform.hero-peterlee{min-height:440px;background-position:center 12%;}
.page-shell{background-position:center 32%;}
.gallery-stage{display:grid;place-items:center;min-height:clamp(320px,52vw,620px);padding:18px;background:linear-gradient(180deg,#f5f6f8,#eceff3)}
.gallery-main-image{width:100%;height:clamp(300px,50vw,580px);object-fit:contain;object-position:center center;background:transparent}
.pope-card .feature-image img{width:100%;max-width:640px;margin:0 auto;display:block;border-radius:18px}
.widget-card .liturgical-colour{font-weight:800}
.widget-card .liturgical-colour.colour-white,
.widget-card .liturgical-colour.colour-gold{color:#9a7a1c}
.widget-card .liturgical-colour.colour-red{color:#b01f2f}
.widget-card .liturgical-colour.colour-green{color:#2f6b2a}
.widget-card .liturgical-colour.colour-purple,
.widget-card .liturgical-colour.colour-violet{color:#6d3a8b}
.widget-card .liturgical-colour.colour-rose{color:#c14f7b}
.widget-card .liturgical-colour.colour-black{color:#222}
.widget-card .liturgical-colour.colour-default{color:var(--accent-deep)}
@media (max-width:1080px){
  .page-title-banner.hero-uniform{min-height:360px}
  .page-title-banner.hero-uniform.hero-peterlee{min-height:390px}
}
@media (max-width:820px){
  .page-title-banner.hero-uniform{min-height:300px;background-position:center 30%}
  .page-title-banner.hero-uniform.hero-peterlee{min-height:320px;background-position:center 18%}
  .gallery-stage{min-height:280px;padding:12px}
  .gallery-main-image{height:clamp(240px,58vw,420px)}
}

/* FINAL FIXES */
.search-box input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #c8d2dc;background:#fff;color:#1d2430 !important;font-size:1rem}
.search-box input::placeholder{color:#9aa6b2 !important}
.search-result-card{background:linear-gradient(180deg,#fff,#fbf8f8);border:1px solid #ead9dd;border-radius:18px;padding:18px;box-shadow:0 10px 24px rgba(56,19,27,.08);margin:0 0 16px}
.facebook-hybrid-panel,.facebook-native-feed{display:grid;gap:14px}
.facebook-feed-card{background:linear-gradient(180deg,#fff,#fbf8f8);border:1px solid #ead9dd;border-radius:18px;padding:16px;box-shadow:0 10px 24px rgba(56,19,27,.08)}
.facebook-feed-card h4{margin:0 0 8px;font-size:1.06rem;color:var(--accent-deep,#5b1621)}
.facebook-feed-card p{margin:0 0 10px}
.facebook-feed-meta{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;font-size:.94rem;color:#6e5860}
.facebook-feed-link{display:inline-block;margin-top:6px;font-weight:700}
.facebook-feed-image{width:100%;border-radius:14px;margin:10px 0 4px;display:block;object-fit:cover;max-height:240px;border:1px solid #ead9dd}
.facebook-feed-loading,.facebook-feed-empty{background:#f7eff1;border:1px dashed #d3b1b9;color:#5b1621;border-radius:18px;padding:18px}
.facebook-actions .button{width:100%;text-align:center;justify-content:center}
.liturgical-colour{display:inline-block;padding:.25rem .6rem;border-radius:999px;font-weight:700;border:1px solid rgba(0,0,0,.08)}
.colour-white{background:#f7f7f7;color:#4b4b4b}.colour-gold{background:#f2e4a6;color:#5b4a0b}.colour-red{background:#f4d4d8;color:#7b1e2b}.colour-green{background:#dff0df;color:#275e27}.colour-purple{background:#e6ddf2;color:#5a377a}.colour-rose{background:#f7dce5;color:#8d4a67}.colour-black{background:#d6d6d6;color:#202020}.colour-default{background:#eef2f6;color:#314150}
.hero-uniform{min-height:380px;background-size:cover;background-repeat:no-repeat}
.hero-peterlee{min-height:430px;background-position:center 42%}
.horden-hero-adjust .hero-uniform{background-position:center 72% !important}
.gallery-main-image{object-fit:contain;background:#e8edf1}

.search-box{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search-box input{flex:1 1 220px;min-width:0}
.search-submit{white-space:nowrap}
.search-result-card{background:#fff;border:1px solid #e4dde0;border-radius:18px;padding:18px;margin:0 0 16px;box-shadow:0 8px 24px rgba(56,19,27,.06)}

.search-box input{color:#1d2430 !important;background:#fff !important;border:1px solid #c8d2dc !important;}
.search-box input::placeholder{color:#9aa6b2 !important;}

.next-mass-panel{margin-top:14px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18)}
.next-mass-panel p{margin:0;color:#fff}
.next-mass-panel .next-mass-title{font-weight:700;margin-bottom:4px}
.next-mass-panel .next-mass-meta{opacity:.92;font-size:.96rem}
.search-box button,.search-submit{margin-top:10px;background:var(--nav);color:#fff;border:none;border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer}
.search-box button:hover,.search-submit:hover{background:var(--accent-deep)}
.search-result-card{padding:18px;border:1px solid var(--border);border-radius:18px;background:#fff;margin-bottom:16px}
