/* SPSA Church | burgundy and gold. Light mode only. Fonts are bundled; nothing loads from other sites. */
@font-face{font-family:"Amiri";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/amiri-latin-400.woff2) format("woff2")}
@font-face{font-family:"Amiri";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/amiri-latin-700.woff2) format("woff2")}
@font-face{font-family:"Amiri";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/amiri-arabic-400.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:"Amiri";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/amiri-arabic-700.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/plex-latin-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/plex-latin-600.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/plex-latin-700.woff2) format("woff2")}

:root{
  --burg:#82181E; --dark:#450C11; --gold:#DBA927; --bg:#FBF6EC; --ink:#2A1A1A; --line:#E4D6BC; --muted:#6F5F55; --tint:#F3E7D0; --card:#FFFDF8;
  --display:"Amiri","Times New Roman",Georgia,serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r:12px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;color-scheme:light}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--body);padding-bottom:calc(64px + env(safe-area-inset-bottom))}
img{max-width:100%;height:auto;display:block}
a{color:var(--burg);text-underline-offset:2px}
a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
h1,h2,h3{font-family:var(--display);line-height:1.2;margin:0}
h3{font-size:1.2rem;color:var(--dark)}
p{margin:.5em 0}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)} .small{font-size:.92rem} .center{text-align:center}
.cross{flex:none;display:inline-block}
.mc{vertical-align:-2px;margin:0 3px}

.trial{background:var(--gold);color:var(--dark);text-align:center;font-size:.8rem;font-weight:600;padding:3px 8px;letter-spacing:.04em}
.urgent{background:#B3261E;color:#fff;text-align:center;font-weight:600;padding:10px 16px}

/* top bar */
.top{position:sticky;top:0;z-index:20;background:var(--dark);color:#fff;display:flex;align-items:center;gap:10px;padding:7px 14px;padding-top:max(7px,env(safe-area-inset-top));border-bottom:3px solid var(--gold)}
.home{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;margin-right:auto}
.badge{display:grid;place-items:center;flex:none}
.badge img{width:64px;height:auto;display:block}
.brand{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav-d{display:none}
.give{background:var(--gold);color:var(--dark);font-weight:700;text-decoration:none;padding:8px 18px;border-radius:999px;min-height:40px;display:inline-flex;align-items:center}
.give:hover{background:#ECC04A}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:flex;flex-direction:column;justify-content:center;gap:5px;align-items:center}
.menu summary::-webkit-details-marker{display:none}
.menu summary i{display:block;width:22px;height:2.5px;background:#fff;border-radius:2px}
.menu nav{position:absolute;right:0;top:50px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 10px 30px rgba(69,12,17,.25);min-width:250px;max-height:calc(100vh - 190px);max-height:calc(100dvh - 190px);overscroll-behavior:contain;overflow-y:auto;padding:6px;display:flex;flex-direction:column}
.menu .mg{margin:6px 0 0;padding:6px 14px 2px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--burg)}
.menu .mg:first-child{margin-top:0}
.menu nav a{padding:10px 14px;min-height:44px;display:flex;align-items:center;color:var(--ink);text-decoration:none;border-radius:8px}
.menu nav a:hover,.menu nav a[aria-current]{background:var(--tint);color:var(--burg)}

/* bottom tabs (phones) */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;background:var(--card);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:7px 2px 6px;min-height:56px;color:var(--muted);text-decoration:none;font-size:.72rem;font-weight:600}
.tabs svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tabs a[aria-current]{color:var(--burg)}
.tabs a[aria-current] svg{stroke:var(--burg)}

main{display:block}
.hero{position:relative;background:var(--dark)}
.hero img{width:100%;aspect-ratio:16/9;object-fit:cover}
.hero .panel{background:linear-gradient(180deg,var(--burg),var(--dark));color:#fff;text-align:center;padding:22px 18px 24px;border-bottom:3px solid var(--gold)}
.hero h1{font-size:1.7rem;font-weight:700;margin:6px 0 8px}
.hero .sub{margin:0;color:#F5DDA0;font-family:var(--display);font-size:1.2rem;font-style:italic}
.welcome{max-width:760px;margin:0 auto;padding:22px 18px 6px;text-align:center;font-size:1.05rem}

.sh{display:flex;align-items:center;gap:8px;font-size:1.5rem;color:var(--burg);margin:26px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.homegrid{max-width:1160px;margin:0 auto;padding:0 16px 8px}
.inner{max-width:820px;margin:0 auto;padding:6px 16px 28px}
.ptitle{background:linear-gradient(180deg,var(--burg),var(--dark));color:#fff;text-align:center;padding:22px 16px 24px;border-bottom:3px solid var(--gold)}
.ptitle h1{font-size:2rem;margin-top:4px}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin:0 0 12px;box-shadow:0 1px 0 rgba(69,12,17,.04)}
.card h3{margin-bottom:4px}
.list{list-style:none;margin:0;padding:0}
.ann{border-left:5px solid var(--gold)}
.ev{display:flex;gap:14px;align-items:flex-start}
.tile{flex:none;width:56px;text-align:center;background:var(--burg);color:#fff;border-radius:10px;padding:6px 0 8px;line-height:1.1}
.tile span{display:block;font-size:.7rem;letter-spacing:.08em;color:#F5DDA0;font-weight:600}
.tile b{font-family:var(--display);font-size:1.7rem}
.empty{color:var(--muted);background:var(--tint);border-radius:var(--r);padding:14px 16px;margin:0 0 12px}

.strip{display:flex;gap:10px;margin:0 0 12px}
.strip div{flex:1;background:var(--tint);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.strip b{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--burg)}
.givebox{background:var(--tint);border:1px solid var(--line);border-radius:var(--r);text-align:center;padding:16px;margin:12px 0}
.givebox p{margin:6px 0 0;color:var(--muted);font-size:.9rem}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--burg);color:#fff;text-decoration:none;font-weight:700;padding:11px 26px;border-radius:999px;min-height:44px;margin-top:6px}
.btn:hover{background:var(--dark)}
.givebox .btn{background:var(--gold);color:var(--dark)}

/* schedule */
.sched{display:flex;flex-direction:column}
.day{display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.day:first-child{border-top:0}
.d{flex:none;width:76px}
.dl{display:block;font-family:var(--display);font-weight:700;font-size:1.15rem;color:var(--burg)}
.ds{display:none}
.rows{flex:1;min-width:0}
.row{margin-bottom:10px}
.row:last-child{margin-bottom:0}
.n{font-weight:600}
.t{color:var(--muted);font-size:.93rem}
.chip{display:inline-block;margin-left:8px;background:var(--tint);color:var(--burg);border:1px solid var(--line);border-radius:999px;font-size:.72rem;font-weight:600;padding:1px 9px;vertical-align:middle}

.soonlist,.linklist{list-style:none;margin:6px 0 0;padding:0}
.soonlist li,.linklist li{padding:8px 0;border-top:1px solid var(--line)}
.soonlist li:first-child,.linklist li:first-child{border-top:0}
.tag{display:inline-block;margin-left:8px;background:var(--gold);color:var(--dark);font-size:.7rem;font-weight:700;border-radius:999px;padding:1px 9px;text-transform:uppercase;letter-spacing:.04em}
.points{margin:6px 0 0;padding-left:1.2em}
.points li{padding:3px 0}
.meetlink{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.meetlink a{display:block;font-weight:600}
.meetlink .t{display:block}
.meetlink .mlcard{display:block;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none}
.meetlink .mlcard img{display:block;width:100%;height:auto}
.meetlink .mlt{display:block;padding:8px 12px;font-weight:600}
.meetlink .mlcard + .t{margin-top:4px}
.card h4{margin:10px 0 2px;font-size:1rem;color:var(--burg)}
.linklist.big a{display:block;padding:4px 0;font-weight:600}
.findus .cname,.cname{font-weight:600}

/* footer */
.foot{background:var(--dark);color:#EBDDC5;margin-top:30px;padding:26px 18px 20px;text-align:center;border-top:4px solid var(--gold)}
.foot a{color:#F5DDA0}
.fcols{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.flogo{display:grid;place-items:center}
.flogo img{width:150px;height:auto}
.foot .motto{font-family:var(--display);font-size:1.3rem;color:var(--gold);font-weight:700}
.foot .cname{font-weight:600;color:#fff}
.foot .links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px}
.foot .links a{padding:6px 2px}
.dio{margin-top:16px;font-size:.85rem;color:#C9B8A0}

/* wide screens */
@media (min-width:900px){
  body{padding-bottom:0}
  .tabs,.menu{display:none}
  .nav-d{display:flex;gap:4px;flex-wrap:nowrap;margin:0 8px 0 auto}
  .dd{position:relative}
  .ddb{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:#fff;font:inherit;font-size:.95rem;font-weight:600;padding:9px 12px;border-radius:8px;cursor:pointer;white-space:nowrap}
  a.ddb{text-decoration:none}
  .ddb:hover,.dd.open .ddb{background:rgba(255,255,255,.14)}
  .ddb.on{background:rgba(219,169,39,.25);box-shadow:inset 0 -2px 0 var(--gold)}
  .ddb svg{transition:transform .15s}
  .dd.open .ddb svg,.dd:hover .ddb svg{transform:rotate(180deg)}
  .ddp{display:none;position:absolute;left:0;top:100%;padding-top:6px;min-width:240px;z-index:50}
  .dd:hover .ddp,.dd.open .ddp{display:block}
  .ddp a{display:flex;align-items:center;min-height:42px;padding:8px 16px;color:var(--ink);text-decoration:none;background:var(--card);white-space:nowrap}
  .ddp a:first-child{border-radius:var(--r) var(--r) 0 0;border-top:1px solid var(--line)}
  .ddp a:last-child{border-radius:0 0 var(--r) var(--r);box-shadow:0 10px 30px rgba(69,12,17,.25)}
  .ddp a:first-child:last-child{border-radius:var(--r)}
  .ddp a{border-left:1px solid var(--line);border-right:1px solid var(--line)}
  .ddp a:last-child{border-bottom:1px solid var(--line)}
  .ddp a:hover,.ddp a[aria-current]{background:var(--tint);color:var(--burg)}
  .dd:last-child .ddp{left:auto;right:0}
  .home{margin-right:0}
  .top{padding:10px 24px}
  .badge img{width:76px}
  .hero{height:440px}
  .hero img{height:100%;aspect-ratio:auto}
  .hero .panel{position:absolute;left:5%;bottom:36px;max-width:520px;border:0;border-left:4px solid var(--gold);border-radius:6px;text-align:left;background:rgba(69,12,17,.92)}
  .hero h1{font-size:2rem}
  .homegrid{display:grid;grid-template-columns:1.25fr 1fr;grid-template-areas:"ann side" "sermon posts" "photos photos" "sched sched";column-gap:32px}
  .g-ann{grid-area:ann}.g-side{grid-area:side}.g-sched{grid-area:sched}.g-sermon{grid-area:sermon}.g-posts{grid-area:posts}.g-photos{grid-area:photos}
  .g-side .sh{margin-top:26px}
  .g-sched .sched{display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px}
  .g-sched .day{flex-direction:column;gap:4px;border-top:0}
  .g-sched .d{width:auto}
  .fcols{flex-direction:row;justify-content:space-between;align-items:center;text-align:left;gap:30px}
  .foot .links{flex-direction:column;align-items:flex-start}
}
@media (max-width:359px){.give{padding:8px 12px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.givebox .cross{display:block;margin:0 auto 4px}
.prose p{margin:.9em 0}
.prose p:first-child{margin-top:0}
.prose .sub{font-size:1.25rem;color:var(--burg);margin:1.3em 0 .2em}
.prose strong{color:var(--dark)}
.portrait{width:100%;max-width:300px;height:auto;margin:0 auto 18px;border-radius:var(--r);border:3px solid var(--gold);box-shadow:0 6px 20px rgba(69,12,17,.2)}
.flinks{display:flex;justify-content:center;gap:18px;margin-top:14px;flex-wrap:wrap}
.flinks a{padding:6px 2px}
.sh + .card .linklist.big li{padding:2px 0}
/* The portrait on the Father Andrew page: on wider screens it sits on the right and the text wraps around it. */
@media (min-width:700px){
  .prose .portrait{float:right;width:300px;max-width:42%;margin:4px 0 14px 28px;border-radius:50%;shape-outside:ellipse(50% 50% at 50% 50%)}
  .prose::after{content:"";display:block;clear:both}
}

/* events from the live calendar */
.feed .list{margin-bottom:0}
.evbody{min-width:0;flex:1}
.pre{white-space:pre-line;overflow-wrap:anywhere}
.evdesc summary{cursor:pointer;color:var(--burg);font-weight:600;font-size:.92rem;margin-top:6px}
.more{margin:.2em 0 0}
.btn.light{background:var(--card);color:var(--burg);border:2px solid var(--burg)}
.btn.light:hover{background:var(--tint)}
.calsub{margin-top:18px}
.viewbar{display:flex;gap:0;margin:0 0 14px}
.vbtn{flex:1;max-width:160px;min-height:44px;font:600 1rem var(--body);background:var(--card);color:var(--burg);border:2px solid var(--burg);cursor:pointer}
.vbtn:first-child{border-radius:999px 0 0 999px}
.vbtn:last-child{border-radius:0 999px 999px 0;border-left-width:0}
.vbtn[aria-pressed="true"]{background:var(--burg);color:#fff}
.monthhead{font-size:1.25rem;color:var(--burg);margin:18px 0 8px}
.monthnav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.monthtitle{font-size:1.4rem;color:var(--burg);text-align:center;flex:1}
.navbtn{min-height:44px;padding:0 14px;font:600 .95rem var(--body);background:var(--card);color:var(--burg);border:2px solid var(--line);border-radius:999px;cursor:pointer}
.navbtn:disabled{opacity:.4;cursor:default}
.grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.dow{text-align:center;font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;padding:4px 0}
.cell{font:inherit;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:8px;min-height:56px;padding:4px 3px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;overflow:hidden;text-align:left}
.cell .num{font-weight:600;font-size:.9rem;align-self:center}
.cell .dots{display:flex;gap:3px;min-height:7px}
.cell .dots i{width:6px;height:6px;border-radius:50%;background:var(--burg)}
.cell .tt{display:none}
.cell.past{opacity:.55}
.cell.today .num{background:var(--burg);color:#fff;border-radius:999px;min-width:24px;text-align:center;padding:0 4px}
.cell[aria-pressed="true"]{border:2px solid var(--gold);background:var(--tint)}
@media (min-width:700px){
  .cell{min-height:92px;padding:5px 6px;align-items:stretch}
  .cell .num{align-self:flex-start}
  .cell .dots{display:none}
  .cell .tt{display:block;font-size:.74rem;line-height:1.25;background:var(--tint);border-left:3px solid var(--burg);border-radius:3px;padding:1px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cell .tt.more{background:none;border:0;color:var(--muted)}
}
.morebtn{display:block;margin:6px auto 0}

/* Install bar */
.linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
.linkbtn[hidden],.install[hidden]{display:none}
.install{position:fixed;left:10px;right:10px;bottom:calc(66px + env(safe-area-inset-bottom));z-index:30;display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r);box-shadow:0 10px 30px rgba(69,12,17,.28);padding:12px 14px}
.install img{border-radius:10px;flex:none}
.install .it{flex:1 1 180px;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.install .it b{font-family:var(--display);font-size:1.1rem;color:var(--dark)}
.install .it span{font-size:.9rem;color:var(--muted)}
.install .ib{display:flex;gap:8px;margin-left:auto}
.install button{font:inherit;font-weight:700;border-radius:999px;min-height:40px;padding:8px 18px;cursor:pointer}
.install .go{background:var(--burg);color:#fff;border:0}
.install .ghost{background:transparent;color:var(--burg);border:1px solid var(--line)}
@media (min-width:900px){.install{left:auto;right:20px;bottom:20px;width:440px}}
.install .steps{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.install .steps li{display:flex;align-items:center;gap:8px;font-size:.95rem;color:var(--ink);line-height:1.3}
.install .steps .n{flex:none;width:22px;height:22px;border-radius:50%;background:var(--burg);color:#fff;font-size:.8rem;font-weight:700;display:grid;place-items:center}
.install .steps .t{flex:1}
.install .glyph{flex:none;fill:none;stroke:var(--burg);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Next service */
.nextsvc{max-width:760px;margin:14px 16px 0;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r);padding:14px 16px;box-shadow:0 1px 0 rgba(69,12,17,.04)}
.nextsvc[hidden]{display:none}
.nextsvc .nl{margin:0;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--burg)}
.nextsvc .nn{font-size:1.5rem;color:var(--dark);margin:2px 0 2px}
.nextsvc .nt{margin:0;color:var(--muted)}
.nextsvc .na{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.nextsvc .btn{margin-top:0;padding:9px 20px}
.btn.ghost{background:transparent;color:var(--burg);border:1px solid var(--burg)}
.btn.ghost:hover{background:var(--tint);color:var(--dark)}
.empty.compact{padding:8px 12px;font-size:.92rem}
.welcome .btn{margin-top:2px}
.homegrid[hidden],.g-ann[hidden]{display:none}
@media (min-width:900px){
  .nextsvc{margin:18px auto 0}
  .homegrid:has(.g-ann[hidden]){grid-template-columns:1fr 1fr;grid-template-areas:"side side" "sched sched" "sermon posts" "photos photos"}
}
/* Phones: the dashboard order, and a shorter picture */
@media (max-width:899px){
  main.homepage{display:flex;flex-direction:column}
  .homepage .hero{order:0}.homepage .nextsvc{order:1}.homepage .homegrid{order:2;width:100%}.homepage .welcome{order:3;padding-bottom:20px}
  .hero img{aspect-ratio:auto;height:84px;object-position:50% 52%}
  .hero .panel{padding:9px 14px 11px}
  .hero h1{font-size:1.08rem;margin:0 0 2px;line-height:1.25}
  .hero .sub{font-size:.88rem}
}

/* More: a hub of grouped rows */
.hub ul{list-style:none;margin:4px 0 0;padding:0}
.hub li{border-top:1px solid var(--line)}
.hub li:first-child{border-top:0}
.hub a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:0 2px;color:var(--ink);text-decoration:none;font-weight:600}
.hub a:hover{color:var(--burg)}
.hub .chev{flex:none;color:var(--gold)}
/* Phones: a smaller footer */
@media (max-width:899px){
  .foot{padding:18px 16px 14px;margin-top:20px}
  .fcols{gap:8px}
  .flogo img{width:110px}
  .foot .motto{font-size:1.1rem}
  .foot .cname{font-size:.95rem}
  .foot p{margin:4px 0;font-size:.92rem}
  .foot .links{gap:0 14px;font-size:.92rem}
  .flinks{margin-top:6px;gap:2px 14px}
  .dio{margin-top:8px;font-size:.78rem}
}

/* Accordion pages: tap a title to open its text */
.accs{display:grid;gap:10px}
.acc{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.acc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:10px 16px;font-weight:700;color:var(--burg);font-size:1.05rem}
.acc>summary::-webkit-details-marker{display:none}
.acc>summary::after{content:"";flex:none;width:9px;height:9px;border-right:2.5px solid var(--gold);border-bottom:2.5px solid var(--gold);transform:rotate(45deg);margin-right:4px;transition:transform .15s}
.acc[open]>summary{background:var(--tint);border-bottom:1px solid var(--line)}
.acc[open]>summary::after{transform:rotate(-135deg)}
.accbody{padding:12px 14px 14px}
.accbody .card{border:0;box-shadow:none;padding:0;background:none;margin:0 0 10px}
.accbody .accs{margin-top:2px}
.accbody .own{margin:8px 0 0;font-size:.92rem}
.acc.link{padding:0}.acc.link a{display:block;padding:14px 16px;font-weight:700;text-decoration:none}
.accbody .acc>summary{font-size:1rem;min-height:48px}
/* Giving verse and footer address */
.verse{margin:10px 0 0;font-family:var(--display);font-style:italic;font-size:1rem;line-height:1.5;color:var(--ink)}
.verse p{margin:0}
.verse cite{display:block;margin-top:6px;font-style:normal;font-weight:700;font-size:.92rem;color:var(--burg)}
.givebox .vcredit{font-size:.75rem;color:var(--muted);margin-top:8px}
.foot a.addr{color:inherit;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}


/* Announcement flyer picture */
.ann .flyer{margin:12px 0 0;text-align:center}
.ann .flyer a{display:inline-block;line-height:0}
.ann .flyer img{width:100%;max-width:260px;height:auto;border:1px solid var(--line);border-radius:8px;box-shadow:0 1px 4px rgba(69,12,17,.15)}
.ann .flyer .small{display:block;margin-top:6px}
.ann p{margin:.5em 0}

/* Share buttons */
.btn.sm{padding:6px 16px;font-size:.95rem;margin-top:0;gap:8px}
.btn.ghost[data-share]{gap:8px}
.sharerow{margin:14px 0 0;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.sharemsg{font-size:.9rem;color:var(--burg);font-weight:600}
.ann{scroll-margin-top:96px}
.ann:target{box-shadow:0 0 0 3px var(--gold)}
[data-share][hidden]{display:none}

/* Home: linked headings, shorter cards; Posts */
.sh .shl{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.sh .arr{color:var(--gold);font-size:1.6rem;line-height:1;font-weight:700}
.compact{display:flex;gap:12px;align-items:flex-start}
.compact .thumb{flex:none;width:96px;line-height:0}
.compact .thumb img{width:100%;height:auto;border:1px solid var(--line);border-radius:6px}
.compact p{margin:.3em 0}
.compact>div>p:first-child{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;line-clamp:5;overflow:hidden}
.ann h3 a,.post h3 a{color:inherit;text-decoration:none}
.ann h3 a:hover,.post h3 a:hover{text-decoration:underline}
.posts .post{margin-bottom:14px}
.post{scroll-margin-top:96px;border-left:5px solid var(--gold)}
.post:target{box-shadow:0 0 0 3px var(--gold)}
.post .flyer{margin:10px 0;text-align:center}
.post .flyer a{display:inline-block;line-height:0}
.post .flyer img{width:100%;max-width:300px;height:auto;border:1px solid var(--line);border-radius:8px}
.post .flyer .small{display:block;margin-top:6px}
.post p{margin:.5em 0}

/* Footer: two-line name, one contact line, round social logos */
.foot .cname{line-height:1.3}
.foot .addr1{margin:10px 0 0}
.foot .contact1{margin:12px 0 0}
.foot .devby{margin:12px 0 0;font-size:.92rem}
.foot .links{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:6px}
.foot a.soc{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border:1.5px solid var(--gold);border-radius:50%;color:var(--gold);padding:0}
.foot a.soc:hover{background:var(--gold);color:var(--dark)}

/* Welcome to the Divine Liturgy guide (New Here? page): uses the same .acc cards as About Us. */
.guide{display:grid;gap:14px}
.ghead{text-align:left}
.ghead .sh{margin-bottom:4px}
.gsub{margin:0;color:var(--muted);font-size:1rem;line-height:1.45}
.gfacts h3{margin:0 0 6px}
.gfacts ul{margin:0;padding-left:1.15rem}.gfacts li{margin:4px 0;line-height:1.5}
.gintro p{margin:0 0 .85em;line-height:1.65}
.gintro .gimg{margin-bottom:14px}
.gimg{display:block;width:100%;height:auto;border-radius:10px;margin:14px 0 4px}
.ghl{margin:1.1em 0;padding:12px 16px;border-left:4px solid var(--gold);background:var(--tint);border-radius:0 10px 10px 0;font-family:var(--display);font-style:italic;font-size:1.3rem;line-height:1.5;color:var(--burg)}
.ghl span{display:block}
.ghl.big{font-style:normal;text-align:center;border-left:0;border-top:3px solid var(--gold);border-bottom:3px solid var(--gold);border-radius:0;font-size:1.15rem}
.ghl.big span:first-child{font-weight:700;letter-spacing:.04em}
.gsec{display:grid;gap:10px;margin-top:6px}
.gh{margin:14px 0 0;font-size:.95rem;letter-spacing:.09em;text-transform:uppercase;color:var(--burg);font-weight:700;display:flex;align-items:center;gap:10px}
.gh::after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}
.gsec.key{background:var(--tint);border:1px solid var(--gold);border-radius:var(--r);padding:4px 10px 12px;margin-top:14px}
.gsec.key .gh{font-size:1.05rem}
.gsec.key .acc{border-color:var(--gold)}
.guide .accbody p{margin:0 0 .85em;line-height:1.65}
.guide .accbody p:last-child{margin-bottom:0}
.scripture{margin:.2em 0 1em;padding:2px 0 2px 14px;border-left:3px solid var(--gold);color:#4a2f2a}
.guide .accbody .scripture p{font-style:italic;margin:0}
.scripture cite{display:block;font-style:normal;font-size:.88rem;color:var(--muted);margin-top:3px}
.gclose{text-align:center}
.gclose p{line-height:1.6}
.gaddr{margin:.6em 0 0;color:var(--burg);font-weight:600}
:root{interpolate-size:allow-keywords}
@media (prefers-reduced-motion:no-preference){
 .guide .acc::details-content{block-size:0;overflow:clip;transition:block-size .28s ease,content-visibility .28s allow-discrete}
 .guide .acc[open]::details-content{block-size:auto}
}

/* three doors on New Here? */
.doors{display:grid;gap:12px}
.door h3{margin:0 0 4px}.door h3 a{text-decoration:none}
.door p{margin:0 0 .5em;line-height:1.5}
.door .dc{font-weight:600}
.door .go{margin:.3em 0 0;font-weight:700}
.door .go a{text-decoration:none}
.door .go a::after{content:"\00a0\203A";color:var(--gold);font-size:1.3em;line-height:1}
@media (min-width:760px){.doors{grid-template-columns:repeat(3,1fr)}}

/* pull down to refresh (installed app only) */
.ptr{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 8px);z-index:60;transform:translate(-50%,calc(var(--d,0px) - 60px));opacity:0;pointer-events:none;background:var(--card);color:var(--burg);border:1px solid var(--gold);border-radius:999px;padding:8px 16px;font-weight:700;font-size:.92rem;box-shadow:0 6px 18px rgba(69,12,17,.25);transition:opacity .15s}
.ptr.on{opacity:1}.ptr.ready{background:var(--burg);color:#fff}.ptr.spin{opacity:1}
.gentrance{margin:0 0 14px}
.gfact{margin:0 0 16px}.gfact:last-child{margin-bottom:0}
.gfact h4{margin:0 0 4px;font-family:var(--display);font-size:1.15rem;color:var(--burg)}
.gfact p{margin:0;line-height:1.6}
.gfact .gimg{margin-top:10px}

/* Big screens (computers only; phones and tablets in portrait are not touched).
   Content width grows with the screen, the top bar and the banner line up with it, and the welcome sits beside Next Service. */
:root{--cw:1160px}
@media (min-width:900px){
  .top{padding-left:max(24px,calc((100% - var(--cw) - 160px)/2));padding-right:max(24px,calc((100% - var(--cw) - 160px)/2))}
  .hero{display:flex;justify-content:center;background:var(--dark)}
  .hero img{width:100%;max-width:1900px}
  .hero .panel{left:calc(50% - min(50%,950px) + min(5vw,95px))}
  main.homepage{display:grid;grid-template-columns:1fr minmax(0,calc(var(--cw)*.5556)) minmax(0,calc(var(--cw)*.4444)) 1fr;align-items:start}
  .homepage .hero{grid-column:1/-1;grid-row:1}
  .homepage .welcome{grid-column:2;grid-row:2;max-width:none;margin:0;padding:26px 36px 6px 16px;text-align:left;font-size:1rem;display:flex;flex-direction:column}
  .homepage .welcome p:first-child{order:2;margin:14px 0 0}
  .homepage .welcome p:last-child{order:1;margin:0}
  .homepage .nextsvc{grid-column:3;grid-row:2;max-width:none;margin:26px 16px 0 0;padding:20px 24px 22px}
  .homepage .nextsvc .nn{font-size:1.9rem}
  .homepage .nextsvc .nt{font-size:1.1rem}
  .homepage:has(.nextsvc[hidden]) .welcome{grid-column:2/4;max-width:760px;margin:0 auto;text-align:center;padding-right:16px}
  .homepage .homegrid{grid-column:1/-1;grid-row:3;width:100%;max-width:var(--cw);margin:0 auto}
  .g-ann .compact .thumb{width:150px}
  .g-sched .card{padding:18px 22px}
}
@media (min-width:1300px){.homepage .welcome{font-size:1.08rem}}
@media (min-width:1600px){
  :root{--cw:1400px}
  html{font-size:112.5%}
  body{font-size:1rem}
  .g-ann .compact .thumb{width:180px}
}
@media (min-width:2400px){
  :root{--cw:1640px}
  html{font-size:125%}
  .hero{height:520px}
}

/* Sermons */
.sermon{padding:20px 18px 22px}
.sermon p{margin:0 0 1em;line-height:1.75;font-size:1.08rem}
.shead{text-align:center;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:18px}
.shead .stitle{font-family:var(--display);font-size:1.8rem;font-weight:700;color:var(--burg);margin:0;line-height:1.2;text-transform:uppercase;letter-spacing:.02em}
.ssub{font-family:var(--display);font-style:italic;font-size:1.25rem;color:var(--muted);margin:2px 0 8px}
.shead .ssub{margin-bottom:8px}
.sphoto{margin:18px auto 24px;max-width:340px;text-align:center}
.sphoto img{display:block;width:100%;height:auto;border-radius:6px;border:1px solid var(--gold,#c9a24a);box-shadow:0 2px 10px rgba(0,0,0,.15)}
.sphoto figcaption{font-size:.9rem;font-style:italic;color:var(--muted);margin-top:8px}
.smeta{font-size:.95rem!important;color:var(--muted);margin:0!important;line-height:1.5!important}
.sermonh{font-family:var(--display);font-size:1.5rem;color:var(--burg);margin:1.5em 0 .5em;padding-bottom:4px;border-bottom:1px solid var(--line)}
.sermon .scripture{margin:.3em 0 1.1em;padding:4px 0 4px 16px}
.sermon .scripture p{font-style:italic;margin:0;font-size:1.08rem}
.sermon .scripture cite{font-size:.92rem;font-weight:700;color:var(--burg);margin-top:4px}
.sbox{background:var(--tint);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r);padding:6px 18px 8px;margin:1.6em 0}
.sbox .sermonh{margin-top:.6em;border-bottom:0}
.sbox p:last-child{margin-bottom:.4em}
.sermon .sstrong{font-weight:700;text-align:center;font-size:1.2rem;color:var(--dark);margin:1.1em 0}
.sermon .sprayer{font-style:italic;text-align:center;color:var(--dark)}
.scredit{text-align:center;color:var(--muted);font-size:.95rem!important;margin-top:1.6em!important;padding-top:12px;border-top:1px solid var(--line)}
.sermoncard h3{margin:2px 0 0;font-size:1.3rem}
.sermoncard h3 a{color:inherit;text-decoration:none}.sermoncard h3 a:hover{text-decoration:underline}
.sermoncard .ssub{font-size:1.05rem;margin:0 0 8px}
@media (min-width:900px){.sermonwrap{max-width:780px}.sermon{padding:30px 40px 32px}.sermon p{font-size:1.12rem}}
.sermoncard .scripture{margin:.2em 0 .8em}
.sermoncard .scripture p{font-style:italic;margin:0}
.sermoncard p{margin:0 0 .6em}
.sermoncard .small{margin-top:.8em}

.slidescard{margin:22px 0 6px;text-align:center}
.slidescard img{display:block;max-width:100%;height:auto;margin:10px auto 14px;border:1px solid var(--line);border-radius:10px}


/* Home banner with the drawing of the church (trial). Phones and narrow windows: the picture, then the burgundy caption. Computers 1100px and wider: the text sits on the soft cream area of the picture. */
.hero-ext .herobtns{display:none}
@media (max-width:899px){.hero-ext img{aspect-ratio:3/2;height:auto;object-position:50% 45%}}
@media (min-width:900px) and (max-width:1099px){
  .hero.hero-ext{display:block;height:auto}
  .hero-ext img{height:auto;max-height:460px;object-fit:cover;object-position:50% 40%}
  .hero-ext .panel{position:static;max-width:none;border:0;border-bottom:3px solid var(--gold);border-radius:0;text-align:center;background:linear-gradient(180deg,var(--burg),var(--dark))}
}
@media (min-width:1100px){
  .hero.hero-ext{display:block;height:auto;aspect-ratio:2022/778;background:var(--bg);overflow:hidden}
  .hero-ext picture{display:block;width:100%;height:100%}
  .hero-ext::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(251,246,236,.62) 0,rgba(251,246,236,.5) 28%,rgba(251,246,236,0) 52%)}
  .hero-ext .panel{z-index:2}
  .hero-ext img{width:100%;max-width:none;height:100%;object-fit:cover;object-position:100% 50%}
  .hero-ext .panel{position:absolute;top:53%;transform:translateY(-50%);left:5.8%;bottom:auto;max-width:42%;padding:0;border:0;border-radius:0;background:none;color:var(--dark);text-align:left}
  .hero-ext .panel::before{content:"";display:block;width:6%;min-width:44px;height:3px;background:var(--gold);margin:0 0 clamp(14px,2.2vw,30px)}
  .hero-ext h1{font-size:clamp(1.7rem,2.95vw,3.7rem);line-height:1.1;margin:0 0 clamp(8px,1vw,16px);color:var(--dark);text-wrap:balance}
  .hero-ext .sub{color:var(--burg);font-size:clamp(1rem,1.45vw,1.7rem)}
  .hero-ext .herobtns{display:flex;flex-wrap:wrap;gap:12px;margin:clamp(14px,1.6vw,28px) 0 0}
  .hero-ext .herobtns .btn::after{content:"\2192";margin-left:.5em}
  .hero-ext .herobtns .btn.ghost{background:rgba(255,253,248,.55);color:var(--burg);border:1.5px solid var(--burg)}
  .homepage .welcome p:first-child{display:none}
}
@media (min-width:2400px){.hero.hero-ext{height:auto}}

.tourhero{margin:0 0 18px}.tourhero img{width:100%;height:auto;border-radius:14px;display:block}
.card.wide{margin:18px 0;padding:0 0 14px;overflow:hidden}.card.wide h3,.card.wide p{margin-left:16px;margin-right:16px}.wideimg{width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;object-position:50% 40%;display:block;margin-bottom:12px}
.card.relic{display:grid;grid-template-columns:42% 1fr;margin:18px 0;padding:0;overflow:hidden;align-items:stretch}
.card.relic img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;display:block;aspect-ratio:3/4}
.relictext{padding:18px 8px;align-self:center}.relictext h3{margin:0 16px 8px}.relictext p{margin:0 16px}
@media (max-width:899px){.card.relic{grid-template-columns:1fr}.card.relic img{aspect-ratio:4/5}.relictext{padding:6px 0 14px}}

.card.lead{text-align:center;padding:18px 16px}.leadline{font-family:Amiri,Georgia,serif;font-size:1.25rem;line-height:1.4;color:var(--dark);margin:0 0 10px;font-weight:700}.tagline{margin:0;color:var(--burg);font-style:italic;font-size:1.02rem}

.card.wide.tall .wideimg{aspect-ratio:4/5;object-position:50% 30%}@media (min-width:900px){.card.wide.tall .wideimg{aspect-ratio:3/2;object-position:50% 35%}}

.card.wide.natural .wideimg{aspect-ratio:auto}
.relictext p{margin:0 16px 10px}.relictext p:last-child{margin-bottom:0}

/* Daily readings */
.rd{display:grid;gap:12px}
.rdnav{display:flex;align-items:center;gap:10px;padding:10px 12px}
.rdhead{flex:1;text-align:center}
.rdhead h2{font-size:1.35rem;color:var(--dark)}
.rdcop{margin:2px 0 0;color:var(--burg);font-weight:600;font-size:.95rem}
.rdb{flex:none;width:46px;height:46px;border-radius:999px;border:1px solid var(--line);background:var(--tint);color:var(--burg);font-size:1.8rem;line-height:1;cursor:pointer}
.rdb:disabled{opacity:.35;cursor:default}
.rdb:focus-visible,.rdtools button:focus-visible,.rdtools input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.rdtools{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin:0}
.rdtools label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.92rem}
.rdtools input{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);min-height:44px}
.rdsvc h3{margin:6px 2px 8px;color:var(--burg)}
.rdr>summary{gap:8px}
.rdk{font-weight:700}
.rdref{margin-left:auto;font-weight:400;color:var(--ink);font-size:.95rem;text-align:right}
.rdv{font-family:var(--display);font-size:1.18rem;line-height:1.75;margin:.3em 0}
.rdv sup{font-family:var(--body);font-size:.62em;color:var(--burg);font-weight:600;margin-right:.25em}
.rdpref{margin:10px 0 0;font-weight:700;color:var(--burg);font-size:.92rem}
.rdcredit{font-size:.78rem;color:var(--muted);margin:2px 4px}
.rdh .rdlist{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:3px;font-size:.95rem}
.rdh .rdcop{margin:0}
.rdh .more{margin:10px 0 0}
.rdsynh{margin:12px 0 0;font-weight:700;color:var(--burg);font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.rdr>summary .rdk{text-align:left}

.calsubcard{text-align:center;margin:0 0 14px}
.calsubcard p{margin:6px 0}
.addcal{font-weight:600}

/* Feasts and fasts */
.fastgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin:10px 0}
.fastcard{padding:10px 14px}
.fastcard h3{font-size:1.1rem}
.fastcard p{margin:2px 0}
.fastdates{color:var(--burg);font-weight:600;font-size:.95rem}.fastdates .muted{font-weight:400}
.fmonth .sub{margin:16px 2px 8px}
.flist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.frow{padding:0}
.frow a{display:flex;align-items:center;gap:12px;padding:10px 14px;text-decoration:none;color:var(--ink);min-height:56px}
.fday{flex:none;width:46px;text-align:center;line-height:1.1}
.fday small{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.fday b{font-family:var(--display);font-size:1.5rem;color:var(--burg)}
.ftxt{flex:1}.ftxt b{display:block}.ftxt small{color:var(--muted)}
.fgo{color:var(--gold);font-size:1.5rem}
.frow.past{opacity:.55}

/* Synaxarium */
.synsearch{padding:12px 14px}
.synsearch input{width:100%;font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);min-height:48px}
.synsearch input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.synsearch p{margin:6px 4px 0}
.synmonth .sub{margin:18px 2px 8px}
.syne>summary{gap:12px}
.syndate{flex:none;min-width:84px;font-size:.85rem;color:var(--muted);font-weight:600}
.syne .rdk{flex:1;font-weight:600;color:var(--ink)}
.syne{scroll-margin-top:90px}

/* Saints page filters */
.gchips{display:none;flex-wrap:wrap;gap:8px;padding:4px 0 10px}
.gselbox{margin:0 0 10px}
.gsel{width:100%;font:inherit;font-weight:600;color:var(--burg);min-height:48px;padding:10px 14px;border:1.5px solid var(--burg);border-radius:12px;background:var(--card)}
.gsel:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
@media (min-width:900px){.gchips{display:flex}.gselbox{display:none}}
.gsort{display:flex;gap:8px;margin:0 0 12px}
.gchip{flex:none;font:inherit;font-size:.9rem;min-height:44px;padding:6px 14px;border:1.5px solid var(--burg);border-radius:999px;background:var(--card);color:var(--burg);cursor:pointer;white-space:nowrap}
.gchip.on{background:var(--burg);color:#fff}
.gchip:focus-visible,.moresaints:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.moresaints{display:block;margin:14px auto}
.saintpage .sh{margin-top:20px}

/* ---------- Christian Writings Library ---------- */
.libnote{border-left:5px solid var(--gold);background:var(--tint)}
.libnote p{margin:0}
.libbox{border:1px solid var(--line);border-left-width:5px;border-radius:6px;padding:10px 14px;margin:0 0 12px;font-size:.95rem;line-height:1.45}
.libbox.mt{background:#fbe3dd;color:#6b1c12;border-color:#c9573f}
.libbox.nn{background:#fff3d6;color:#5e4204;border-color:#c99a2e}
.libbox.west{background:var(--tint);color:var(--ink);border-color:var(--gold);border-radius:0}
.liblab{display:inline-block;margin:4px 8px 0 0;border:1px solid;border-radius:999px;font-size:.72rem;font-weight:700;padding:1px 9px}
.liblab.mt{background:#fbe3dd;color:#6b1c12;border-color:#c9573f}
.liblab.nn{background:#fff3d6;color:#5e4204;border-color:#c99a2e}
.libtag{display:inline-block;margin:4px 8px 0 0;background:var(--tint);color:var(--dark);border:1px solid var(--gold);font-size:.72rem;font-weight:700;padding:1px 9px}
.libwrap{max-width:820px}
.crumbs{font-size:.88rem;color:var(--muted);margin:8px 0 12px;line-height:1.5}
.libhead p{margin:0 0 4px}
.libcount{font-size:.82rem;color:var(--muted);font-weight:400;margin-left:auto;padding-left:10px}
.libdir>summary{display:flex;align-items:center}
.libworks li{padding:8px 0}
.libtext{font-size:1.05rem;line-height:1.65;overflow-wrap:anywhere;word-break:normal}
.libtext p,.libtext div{margin:0 0 .8em}
.libtext img{max-width:100%;height:auto}
.libtext .tc{text-align:center}.libtext .tr{text-align:right}
.libtext pre{white-space:pre-wrap;overflow-x:auto}
.libtext h2,.libtext h3,.libtext h4,.libtext h5,.libtext h6{font-family:var(--display);color:var(--burg);line-height:1.3;margin:1.2em 0 .5em}
.libtext blockquote{margin:0 0 .8em 1em;padding-left:.8em;border-left:3px solid var(--line)}
.libtext table{border-collapse:collapse;margin:0 0 1em}
.libtext td,.libtext th{border:1px solid var(--line);padding:4px 8px;vertical-align:top}
.tblwrap{overflow-x:auto;max-width:100%}
.libtext sup a{text-decoration:none}
.libpn{display:flex;justify-content:space-between;gap:10px;margin:0 0 12px}
.libpn a{max-width:48%}
.libcredit{margin:10px 4px}
.librow[hidden]{display:none}
/* Fathers on the Bible */
.fcontrols{padding:14px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fgrid label{display:block;font-size:.8rem;font-weight:600;color:var(--muted)}
.fgrid select,.fgrid input{display:block;width:100%;margin-top:4px;font:inherit;font-size:1rem;min-height:46px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.fgrid label:nth-child(4){grid-column:1/-1}
.fgrid select:focus-visible,.fgrid input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.fcontrols p{margin:8px 2px 0}
.flabelkey{margin:12px 0;padding:10px 14px}.flabelkey summary{cursor:pointer;font-weight:600;color:var(--burg);min-height:44px;display:flex;align-items:center}
.flabelkey ul{margin:6px 0 8px;padding-left:18px}.flabelkey li{margin:6px 0}
.flab{display:inline-block;font-size:.72rem;font-weight:700;padding:1px 9px;border-radius:999px;border:1px solid var(--line);background:var(--tint);color:var(--burg);margin:0 4px 0 0;vertical-align:middle;white-space:nowrap}
.flab.accepted{background:#E7F0E3;border-color:#B9D2B0;color:#2F5A25}
.flab.notaccepted{background:#F9E1DF;border-color:#E3A9A4;color:#8B1A12}
.flab.western,.flab.protestant{background:#E6EAF3;border-color:#B8C2DA;color:#2D3F72}
.flab.pseudo,.flab.ref,.flab.decide{background:var(--tint);color:var(--muted)}
.fgroup .fnum{margin-left:auto;color:var(--muted);font-size:.85rem;font-weight:400;white-space:nowrap}
.fpass{padding:12px 0;border-top:1px solid var(--line)}.fpass:first-child{border-top:0}
.fhead{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-bottom:6px}
.fhead small{flex-basis:100%;color:var(--muted)}
.fsrc{font-size:.85rem}
.fdl{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:8px}.fdl .btn{min-height:44px}

/* Home readings card: open-book look */
.rdbook{border-left:6px solid var(--gold)}
.rdbook .rdcop{margin:0 0 10px;font-size:1.02rem}
.rdgospel{background:var(--tint);border-radius:12px;padding:10px 14px;margin-bottom:10px}
.rdgospel small{display:block;color:var(--burg);font-weight:700;letter-spacing:.07em;text-transform:uppercase;font-size:.74rem}
.rdgospel b{display:block;font-family:var(--display);font-size:1.5rem;color:var(--dark);line-height:1.25}
.rdpills{display:flex;flex-wrap:wrap;gap:8px}
.rdpill{display:inline-block;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:.92rem;color:var(--ink)}
.rdpill small{color:var(--burg);font-weight:700;margin-right:6px;font-size:.78rem}
.rdbook .rdsynh{border-top:1px solid var(--line);padding-top:12px;margin-top:14px}
.rdbook .more{border-top:1px solid var(--line);padding-top:10px}
/* Writings of the Fathers: the list page and the reading pages */
.wk-index .sub{font-size:1.25rem;color:var(--burg);margin:18px 2px 8px}
.wk-list{list-style:none;margin:0 0 6px;padding:0}
.wk-list li.card{padding:0;margin:8px 0}
.wk-list a{display:flex;align-items:center;gap:12px;padding:10px 14px;text-decoration:none;color:var(--ink);min-height:56px}
.wk-lt{flex:1;display:flex;flex-direction:column;min-width:0}
.wk-lt b{color:var(--burg);font-family:var(--display);font-size:1.2rem;line-height:1.25}
.wk-lt small{color:var(--muted)}
.wk .shead{padding-bottom:10px;margin-bottom:12px}
.wk .shead .ssub{margin:0;font-size:1.1rem}
.wk-toc{margin:0 0 1.2em;border:1px solid var(--line);border-radius:var(--r);background:var(--tint);padding:2px 14px}
.wk-toc summary{cursor:pointer;font-weight:600;color:var(--burg);min-height:44px;display:flex;align-items:center}
.wk-toc ul{margin:0 0 10px;padding-left:18px}
.wk-toc li{margin:2px 0}
.wk-toc a{color:var(--burg);display:inline-block;padding:5px 0}
.wk-toc .wk-tb{list-style:none;margin:10px 0 2px -18px;font-weight:600;color:var(--muted)}
.wkh{display:flex;flex-direction:column;gap:2px;scroll-margin-top:90px}
.wk-lab{font-family:var(--body);font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#7D5F0E}
.wk-ttl{display:block}
.wk-book{font-family:var(--display);font-size:1.7rem;color:var(--dark);text-align:center;margin:2em 0 .2em}
.wk-sec{scroll-margin-top:90px}
.wk .fnref{font-size:.72em;line-height:0}
.wk .fnref a{color:var(--burg);text-decoration:none;font-weight:700;display:inline-block;min-width:1em;padding:.25em .1em;text-align:center}
.wk .fnref a:hover{text-decoration:underline}
.wk-notes{margin-top:1.8em;border-top:3px solid var(--gold);padding-top:2px}
.wk .wk-nh{margin-top:.8em}
.wk-note{display:flex;gap:8px;font-size:.92rem;line-height:1.55;margin:0 0 .7em;scroll-margin-top:90px;overflow-wrap:anywhere}
.wk-note:target{background:var(--tint);border-radius:6px}
.fnno{flex:none;min-width:2.1em;text-align:right;color:var(--burg);font-weight:700}
.fntx{flex:1;min-width:0}
.fnback{flex:none;color:var(--burg);text-decoration:none;padding:0 8px;font-size:1.1rem}
.sermon .wk-credit{font-size:.82rem;color:var(--muted);line-height:1.5;margin:1.6em 0 0;border-top:1px solid var(--line);padding-top:10px}
.wk-nav{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin:14px 0 6px}
.wk-nav .btn{text-align:left}
.wk-nav a[rel=next]{margin-left:auto;text-align:right}
@media (min-width:900px){.wk-lt b{font-size:1.3rem}}
.sermon .wk-tnote{font-size:.9rem;color:var(--muted);margin:4px 0 0;text-align:center;line-height:1.5}

/* Writings: search */
.wk-search{padding:12px 14px;margin-bottom:12px}
.wk-search input{width:100%;font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);min-height:48px}
.wk-search input:focus-visible,.wk-where select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.wk-where{display:flex;flex-direction:column;gap:4px;margin-top:10px;font-size:.9rem;color:var(--muted,#6F5F55)}
.wk-where select{font:inherit;color:var(--ink);padding:10px 12px;min-height:48px;border:1px solid var(--line);border-radius:12px;background:#fff;max-width:100%}
.wk-dlrow{margin:8px 0 12px}
.wk-hit{padding:12px 14px;margin:8px 0}
.wk-hit .rdv{font-size:1.05rem;line-height:1.65;margin:.4em 0 0}
.wk-where2{font-weight:600;font-size:.92rem}
.wk-hit mark{background:#F6E7A8;color:inherit;padding:0 .1em;border-radius:3px}
[data-wres][hidden],[data-wbrowse][hidden],[data-w][hidden],[data-wg][hidden]{display:none}
.libdls{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 4px}
.libdlmsg{flex-basis:100%;margin:0}

/* menu sub-heading */
.ddp .ddh{display:block;margin:0;padding:10px 16px 4px;background:var(--card);border-top:1px solid var(--line);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--burg)}

/* What's new */
.upd{padding:12px 16px}
.updh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.updh h3{font-family:var(--display);color:var(--burg);font-size:1.15rem;margin:0}
.updh time{font-size:.85rem;color:var(--muted)}
.upd p{margin:6px 0 0}
.updmore{margin-top:4px}
.updmore summary{cursor:pointer;text-align:center;color:var(--burg);font-weight:600;padding:12px;min-height:44px;list-style:none}
.updmore summary::-webkit-details-marker{display:none}
.updmore[open] summary{margin-bottom:8px}
.foot .ver{margin:12px 0 0;font-size:.85rem;color:#EBDDC5}

/* Sermons: search, type buttons, filters, year groups */
.sfind [hidden]{display:none!important}
.sfind .synsearch{margin-bottom:10px}
.stypes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.sfilters{padding:0}
.sfilters summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;min-height:48px;cursor:pointer;list-style:none;font-weight:600;color:var(--burg)}
.sfilters summary::-webkit-details-marker{display:none}
.sfilters summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:var(--r)}
.sfilters summary::after{content:"";width:8px;height:8px;margin-left:4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);flex:none;transition:transform .15s}
.sfilters[open] summary::after{transform:rotate(-135deg)}
.sfs{flex:1}
.sfhint{font-weight:400}
.sfbody{padding:2px 16px 14px;border-top:1px solid var(--line)}
.sfg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-top:12px}
.sfg.one{grid-template-columns:minmax(0,1fr)}
.sfg label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted)}
.sfg select{font:inherit;font-size:.95rem;color:var(--ink);padding:10px 8px 10px 10px;text-overflow:ellipsis;min-height:48px;border:1px solid var(--line);border-radius:12px;background:#fff;max-width:100%;width:100%}
.sfg select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.sfg select:disabled{opacity:.55}
.sfact{display:flex;align-items:center;gap:16px;margin-top:14px}
.sfact .btn{margin-top:0}
.sfact .linkbtn,.sfind .empty .linkbtn{color:var(--burg);min-height:44px}
.schips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 4px}
.schips:empty{display:none}
.schip{font:inherit;font-size:.85rem;min-height:36px;padding:4px 12px;border:1px solid var(--line);border-radius:999px;background:var(--tint);color:var(--dark);cursor:pointer}
.schip:hover{background:#EAD9B8}
.schip:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.syear{font-family:inherit;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--burg);font-weight:700;margin:18px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.stype{display:inline-block;margin-right:8px;padding:1px 10px;border-radius:999px;font-size:.72rem;font-weight:700;background:var(--tint);color:var(--burg);border:1px solid var(--line);vertical-align:middle}
.stype.homily{background:var(--gold);color:var(--dark);border-color:var(--gold)}
.stype.funeral{background:var(--dark);color:#fff;border-color:var(--dark)}
.stype.feast{background:var(--burg);color:#fff;border-color:var(--burg)}
.ssnip{color:var(--ink);font-size:.95rem;margin:0 0 .6em}
.hasnip .steaser{display:none}
.sfind mark{background:#F6E7A8;color:inherit;padding:0 .1em;border-radius:3px}
@media (min-width:900px){
  .sfilters summary{display:none}
  .sfbody{border-top:0;padding-top:14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px 16px;align-items:end}
  .sfbody .sfg,.sfbody .sfg.one{display:contents;margin:0}
  .sfact{grid-column:1/-1;margin-top:2px}
}

/* ---------- Katamaros page (Arabic and English readings) ---------- */
.ar{font-family:"Amiri",var(--display),serif}
.katm .rdv.ar{font-size:1.45rem;line-height:2}
.katm .rdv.ar sup{margin:0 0 0 .35em}
.katm .rdref.ar{font-size:1.2rem;font-weight:400}
.katm .rdhead .ar{font-size:1.15rem;margin-top:2px}
.kseason{margin:0;text-align:center;color:var(--burg);font-weight:600}
.kseason .ar{font-size:1.1rem}
.kintro{color:var(--burg);font-size:1.1rem;margin:0 0 6px}
.ksw{display:flex;align-items:center;justify-content:center;margin:0}
.ksw span{color:var(--muted);margin-right:10px;font-size:.92rem}
.ksw button{font:inherit;min-height:44px;padding:0 20px;border:1px solid var(--line);background:#fff;color:var(--burg);cursor:pointer}
.ksw button:nth-of-type(1){border-radius:999px 0 0 999px;font-family:"Amiri",serif;font-size:1.2rem}
.ksw button:nth-of-type(2){border-radius:0 999px 999px 0;border-left:0}
.ksw .kon{background:var(--burg);color:#fff;border-color:var(--burg)}
.ksw button:focus-visible,.katm select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.katm select{font:inherit;min-height:44px;border:1px solid var(--line);border-radius:8px;padding:0 10px;background:#fff;color:var(--ink);max-width:100%}
.kverses{margin-top:4px}
.kcom{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.kcom>.ar{font-size:1.15rem;color:var(--burg);margin-right:4px}
.kcom .btn{min-height:44px;padding:0 14px;font-size:.92rem}
.kchap{width:100%;color:var(--muted);font-weight:600}
.kctl{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}
.kc{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.92rem}
.kdesc p{margin:.4em 0}
.kht{color:var(--dark);font-size:1.25rem;margin:14px 2px 6px}
.kfield{margin:6px 0}
.kdlg{width:min(720px,94vw);max-height:86vh;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink)}
.kfeast{all:unset;cursor:pointer;color:inherit;font:inherit;font-weight:inherit;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:4px;-webkit-tap-highlight-color:transparent}
.kfeast:hover,.kfeast:focus-visible{color:var(--dark)}
.kfeast:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.ktabs{display:flex;border:1.5px solid var(--burg);border-radius:22px;overflow:hidden;margin:10px 14px 0}
.ktabs[hidden]{display:none}
.ktab{flex:1;border:0;background:transparent;color:var(--burg);font:inherit;font-weight:700;font-size:.88rem;padding:10px 6px;min-height:44px;cursor:pointer}
.ktab+.ktab{border-left:1.5px solid var(--burg)}
.ktab.on{background:var(--burg);color:#fff}
.kcomb{min-height:44px}
.kdlg::backdrop{background:rgba(69,12,17,.55)}
.kdh{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:var(--tint);border-bottom:1px solid var(--line)}
.kdh h3{margin:0;color:var(--dark);font-size:1.05rem}
.kdb{padding:8px 16px 16px;overflow:auto;max-height:calc(86vh - 64px)}
.kby{color:var(--burg);font-size:1.1rem}
.kcp{font-size:1.3rem;line-height:1.95;margin:.5em 0}
.kch{font-size:1.4rem;color:var(--dark);margin:1em 0 .2em}

/* ---------- Hymns ---------- */
.hymnpage .hsort{flex-wrap:wrap}
.hletters{display:flex;flex-wrap:wrap;gap:6px;padding:0 0 12px}
.hletters .gchip{min-width:44px;padding:6px 10px;text-align:center}
.hset{border-left:5px solid var(--gold);margin:0 0 12px}
.hset h3{margin:0 0 6px;color:var(--burg)}
.hsetlist{margin:0 0 10px;padding-left:22px}
.hsetlist li{padding:4px 0}
.hsetlist li .hlink{margin-left:10px}
.hlink{font:inherit;font-size:.88rem;background:none;border:0;color:var(--burg);text-decoration:underline;cursor:pointer;min-height:32px;padding:0 4px}
.hacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.hymn .rdk{flex:1;font-weight:600}
.hymn>summary{gap:10px}
.hstar,.htag{flex:none;font-size:.72rem;font-weight:700;border:1px solid var(--gold);background:var(--tint);color:var(--dark);border-radius:999px;padding:1px 9px}
.htag{font-weight:600;color:var(--muted);border-color:var(--line);background:none}
.hlyrics{white-space:pre-line;font-size:1.08rem;line-height:1.7;margin:0}
.hsep{border:0;border-top:1px dashed var(--line);margin:14px 0}
body.tvopen{overflow:hidden}
.hymntv{position:fixed;top:0;left:0;width:100%;height:100vh;height:100dvh;z-index:200;background:#450C11;color:#FBF6EC;display:flex;flex-direction:column;cursor:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.hymntv[hidden]{display:none}
.hymntv.ui{cursor:default}
.tvtop{position:relative;z-index:3;flex:none;display:flex;justify-content:space-between;gap:16px;padding:12px 24px;min-height:56px;color:var(--gold);font-size:clamp(16px,2.2vw,28px);cursor:pointer}
.tvstage{flex:1;min-height:0;display:flex;padding:0 5vw 8px;text-align:center;overflow:hidden}
.tvtext{margin:auto;white-space:pre-line;line-height:1.3;font-family:var(--display);font-weight:700;max-width:100%}
.tvfoot{flex:none;display:flex;justify-content:space-between;gap:16px;padding:8px 24px 12px;min-height:38px;color:#c9b99a;font-size:clamp(13px,1.5vw,20px)}
.tvhint{opacity:0;transition:opacity .2s}
.hymntv.ui .tvhint{opacity:1}
.tvzone{position:absolute;top:56px;bottom:0;z-index:1}
.tvl{left:0;width:35%}
.tvr{right:0;width:65%}
.tvctl{position:absolute;left:0;right:0;bottom:48px;z-index:2;display:none;justify-content:center;flex-wrap:wrap;gap:10px;padding:0 12px}
.hymntv.ui .tvctl{display:flex}
.tvzoom{display:none;align-items:center;gap:10px;margin-inline:auto}
.hymntv.ui .tvzoom{display:flex}
.tvz{font:inherit;font-weight:700;min-width:56px;min-height:44px;padding:4px 14px;border-radius:12px;border:2px solid var(--gold);background:transparent;color:var(--gold);cursor:pointer}
.tvz:disabled{opacity:.35;cursor:default}
.tvzv{font:inherit;min-width:4.2em;min-height:44px;background:transparent;border:0;color:#d8c3c6;cursor:pointer}
.tvz:focus-visible,.tvzv:focus-visible{outline:3px solid #fff;outline-offset:2px}
.tvbtn{font:inherit;font-weight:700;min-height:48px;padding:8px 22px;border-radius:999px;border:2px solid var(--gold);background:var(--dark);color:#fff;cursor:pointer}
.tvbtn[hidden]{display:none}
.tvbtn:focus-visible{outline:3px solid #fff;outline-offset:2px}
.tvx{background:var(--gold);color:var(--dark)}
@media print{.hymntv{display:none}}
.hsource{margin:12px 0 0}

.hwdays{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:12px 0}
.hwday{display:flex;flex-direction:column;gap:2px;padding:12px 14px;text-decoration:none;color:var(--ink);min-height:76px;justify-content:center}
.hwday span{font-weight:600;color:var(--burg)}
.hwday b{font-size:1.25rem}
.hwday small{color:var(--muted,#6b5b4b)}
.hwday.hwnow{border-color:var(--burg);box-shadow:0 0 0 2px var(--burg) inset}
.hwday.hwfeast{background:#fbf3dc}

/* song page: Show on screen on top, the words as cards, the actions at the bottom */
.hlang{display:flex;gap:8px;margin:0 0 12px}
.hlang .gchip[lang=ar],.tvlang[lang=ar]{font-family:var(--display);font-size:1.15em}
.hshow{display:block;width:100%;font:inherit;font-weight:700;font-size:1.15rem;min-height:52px;padding:12px 16px;border:0;border-radius:var(--r);background:var(--burg);color:#fff;cursor:pointer}
.hshow:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.hnote{margin:6px 0 14px;text-align:center;color:var(--muted);font-size:.92rem}
.hwords{font-family:var(--display)}
.hcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin:0 0 12px;text-align:center;font-size:1.3rem;line-height:1.5}
.hcard.hlyrics{white-space:pre-line;font-size:1.2rem;line-height:1.6}
.hwords[dir=rtl] .hcard{font-size:1.45rem;line-height:1.7}
.hl{margin:2px 0}
.hmk{font:700 .6em var(--body);color:#B07A1D;margin-inline-start:.5em;vertical-align:middle}
.hrefc{background:#F3E7D0;border-color:#DBA927}
.hmore{margin-top:-6px}
.hlab{font:700 .72rem var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--burg);text-align:start}
.hwords[dir=rtl] .hlab{letter-spacing:0;font-size:.95rem;font-family:var(--display)}
.hnt{font:400 .8rem var(--body);color:var(--muted);margin-top:6px}
.hbottom{margin-top:14px}
.hheart{vertical-align:-3px;margin-inline-end:6px}
.hfavb[aria-pressed=true] .hheart path{fill:currentColor}
.harab{font-family:var(--display);font-size:.95rem}
.hflash{margin:8px 0 0}
/* the same song on the church screen: the verse, and under it the Refrain */
.tvtext.st{white-space:normal}
.tvtext .hl{margin:.08em 0}
.tvref{margin-top:.5em;padding:.4em .9em .45em;background:#5C1A20;border:1px solid #7A2E34;border-radius:.35em;font-size:.94em}
.tvlab{font:600 .36em var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.15em}
.tvtext[dir=rtl] .tvlab{letter-spacing:0;font-size:.5em;font-family:var(--display)}
.tvtext .hmk{color:var(--gold);font-size:.42em;font-family:var(--body)}

.tvdots{display:flex;align-items:center;gap:clamp(5px,.7vw,9px)}
.tvdots i{display:block;width:clamp(6px,.8vw,11px);height:clamp(6px,.8vw,11px);border-radius:50%;background:#7A2E34}
.tvdots i.on{background:var(--gold)}
.hymntv .tvhint,.hymntv .tvcount{color:#c9a9a0}
.tvfoot{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.tvfoot .tvcount{text-align:right}

@media (max-width:700px){.kdlg{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0;border:0}.kdb{max-height:calc(100dvh - 128px)}}

/* verse links and pop-up in sermons */
a.vref{color:inherit;text-decoration:underline dotted var(--burg);text-underline-offset:3px;text-decoration-thickness:1.5px}
a.vref:hover,a.vref:focus-visible{color:var(--burg);text-decoration-style:solid}
.vpop{position:absolute;z-index:60;background:var(--card);color:var(--ink);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r);box-shadow:0 8px 28px rgba(69,12,17,.22);padding:12px 14px;font-size:.95rem;line-height:1.5;max-height:70vh;overflow:hidden;display:flex;flex-direction:column}
.vpop .vpb{overflow:auto;min-height:0;flex:1 1 auto}
.vpop .vph{flex:none}
.vpop .vph{margin:0 0 6px;font-weight:600;color:var(--dark);font-size:1rem}
.vpop .vpb p{margin:0 0 6px}
.vpop .vpb sup{color:var(--burg);font-size:.7em;font-weight:600;margin-right:1px}
.vpop .vpm{color:var(--muted);font-style:italic}
.vpop .vpf{flex:none;display:flex;gap:16px;align-items:center;margin:8px 0 6px;font-size:.95rem}
.vpop .vpf a{font-weight:600;color:var(--burg)}
.vpop .vpn{margin:0;font-size:.72rem;color:var(--muted);line-height:1.4}

.synicon{margin:6px 0 14px;text-align:center;line-height:0}
.synicon img{display:block;margin:0 auto;width:62%;max-width:260px;height:auto;border-radius:10px;box-shadow:0 1px 4px rgba(69,12,17,.15)}

.iconbtn{display:block;margin:0 auto;padding:0;border:0;background:none;cursor:zoom-in;width:62%;max-width:260px;line-height:0}
.iconbtn img{width:100%;margin:0;height:auto}
.iconbtn:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:12px}
.iconhint{display:block;margin-top:6px;line-height:1.3}
.iconview{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:56px 12px 16px;border:0;background:#1b0a0c;color:#fff;overflow:auto;text-align:center}
.iconview[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}
.iconview::backdrop{background:#1b0a0c}
.iconview .iconbig{max-width:100%;max-height:calc(100dvh - 130px);width:auto;height:auto;border-radius:10px;touch-action:pinch-zoom}
.iconview .iconname{margin:12px 0 0;font-weight:600}
.iconview .iconclose{position:fixed;top:12px;right:12px}

.synfavrow{margin:8px 4px 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.synfavrow .small{flex:1;min-width:180px}
.synfavb[aria-pressed=true]{background:var(--burg);color:#fff}
.synfavb[aria-pressed=true] .hheart path{fill:currentColor}
.syne .hstar{align-self:center}

/* ---------- Photo albums ---------- */
.albums{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:12px}
.albumitem{padding:0;overflow:hidden}.albumitem h3,.albumitem p{margin-left:16px;margin-right:16px}.albumitem h3{margin-top:12px}.albumitem p:last-child{margin-bottom:14px}
.albumcover{display:block;line-height:0;aspect-ratio:4/3;overflow:hidden;background:var(--tint)}
.albumcover img{width:100%;height:100%;object-fit:cover;display:block}
.albumbtns{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:.6em 0}
.albumbtns .btn{margin-top:0}.albumitem{display:flex;flex-direction:column}.albumitem .albumshare{margin-top:auto;padding-top:2px}.albumitem .albumshare .btn{margin-top:0}
.zipnote{margin:0 0 .8em}
.albumgrid{list-style:none;margin:12px 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.albumgrid a{display:block;line-height:0;aspect-ratio:1/1;overflow:hidden;background:var(--tint);border-radius:4px}
.albumgrid img{width:100%;height:100%;object-fit:cover;display:block}
@media(min-width:640px){.albums{grid-template-columns:repeat(2,1fr)}.albumgrid{grid-template-columns:repeat(4,1fr);gap:6px}}
@media(min-width:960px){.albums{grid-template-columns:repeat(3,1fr)}.albumgrid{grid-template-columns:repeat(5,1fr)}}
.photoview .photonav{position:fixed;top:50%;transform:translateY(-50%);width:44px;height:64px;padding:0;font-size:2rem;line-height:1;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.35)}
.photoview .photonav.prev{left:8px}.photoview .photonav.next{right:8px}
.albumcard{display:grid;gap:14px;padding:12px}
.albummosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:4px;aspect-ratio:2/1;line-height:0;border-radius:8px;overflow:hidden;background:var(--tint)}
.albummosaic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.albummosaic img:first-child{grid-column:1/3;grid-row:1/3}
.albummosaic{outline-offset:3px}
.albummosaic:hover img{transform:scale(1.03)}
.albumtext{padding:0 4px 4px}
.albumtext h3{font-size:1.35rem;margin:2px 0 10px}
.albumtext h3 a{color:inherit;text-decoration:none}.albumtext h3 a:hover{text-decoration:underline}
.albumtext p{margin:.3em 0}
.albumtext .btn{margin-top:4px}
@media(min-width:900px){.albumcard{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);gap:28px;align-items:center;padding:14px}.albumtext h3{font-size:1.6rem}}

/* Home: Latest photos and Flashback side by side */
.albumcard[hidden]{display:none}
.photosplit{display:grid;gap:0 22px}
.photosplit .phalf{min-width:0}
@media(min-width:800px){.photosplit:not(.one){grid-template-columns:1fr 1fr}}
.albumcard.half{grid-template-columns:1fr;gap:12px;padding:12px}
.albummosaic.half{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(0,2fr) minmax(0,1fr);aspect-ratio:1/1}.albummosaic.half img{min-width:0;min-height:0}
.albummosaic.half img:first-child{grid-column:1/4;grid-row:1}
.albumcard.half .albumtext h3{font-size:1.3rem}
/* Posts: category label and buttons */
.catbar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.catbar .btn[aria-pressed="true"]{background:var(--burg);color:#fff}
.cattag{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:#7a5a12;font-weight:700}
.posts>li[hidden]{display:none}

/* Year headings and scrolling filter row */
.yearh{font-size:1.5rem;color:var(--burg);margin:22px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.yearsec[hidden]{display:none}
.catbar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:thin}
.catbar .btn{flex:0 0 auto;white-space:nowrap}
@media(min-width:700px){.catbar{flex-wrap:wrap;overflow:visible}}

/* names of the Fathers and teachers cited in a sermon: bold bronze (his choice B, 17 Oct 2026) */
.fname{font-weight:700;color:#8A5200}

.cols{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:12px}
.cols>.card{margin:0}
@media(min-width:800px){.cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.step{font:700 .78rem/1 var(--body,sans-serif);letter-spacing:.1em;text-transform:uppercase;color:#82181E;margin:0 0 6px}
.visit h3,.partner h3{margin-top:0}
.visit .when{font-weight:700;margin:0 0 2px}
.visit .whennote{margin-top:0}
.card.partner{background:#F7F3EA}
.partner .step,.partner h3{color:#0C447C}
.partner .plogo{display:flex;align-items:center;gap:12px;margin:6px 0 10px}
.partner .pdrop{width:56px;height:auto;margin:0}
.partner .pname{flex:1;width:100%;max-width:230px;height:auto;margin:0}
.partner .btn{background:#0C447C;color:#fff}
.partner .btn:hover{background:#042C53}
.partner .plink{margin:12px 0 0;font-weight:700}
.partner .plink a{color:#0C447C}
.cols .card{overflow-wrap:anywhere}
.partner .pname{min-width:0}

.hlangbar{display:flex;margin:14px 0 4px;border:2px solid var(--burg);border-radius:18px;overflow:hidden;background:var(--card)}
.hlangbar button{flex:1;font:inherit;font-weight:700;font-size:1.05rem;min-height:52px;border:0;background:transparent;color:var(--burg);cursor:pointer}
.hlangbar button+button{border-left:2px solid var(--burg)}
.hlangbar button.on{background:var(--burg);color:#fff}
.hlangbar small{display:block;font-weight:400;font-size:.8rem;opacity:.85}
.hlangbar button:focus-visible{outline:3px solid var(--gold);outline-offset:-5px}
.hlangbar button[lang=ar]{font-family:var(--display);font-size:1.2rem}
.hletters[hidden]{display:none}

.stag{display:inline-block;margin-top:8px;background:var(--tint);color:#8a5200;border-radius:10px;padding:2px 10px;font-size:.85rem}