/* ChurchesAtlas shared styles. Phone first: base rules are for phones,
   the @media blocks at the end widen things for tablets and desktops. */

:root{--egg:#F6F2E9;--card:#FCFAF5;--ink:#1C1B19;--muted:#5E574B;--body:#35322C;--red:#8C1D18;--gold:#9A7426;--goldl:#B48C3C;--goldtxt:#7A5A18;--burg:#5E1A24;--line:#E2D9C6;--plan:#F1EADB;
--gold-leaf:linear-gradient(172deg,#8A6416 0%,#C99A3A 22%,#F1D88E 40%,#C5973A 58%,#8E6619 80%,#B98B33 100%);
--gold-rule:linear-gradient(90deg,rgba(154,116,38,0) 0%,#9A7426 8%,#E7CC80 30%,#B48C3C 50%,#E7CC80 70%,#9A7426 92%,rgba(154,116,38,0) 100%)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--egg);font-family:'Plex Sans',sans-serif;color:var(--ink);line-height:1.5}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.narrow{max-width:720px}
.mono{font-family:'Plex Mono',monospace}
.serif{font-family:'EB Garamond',serif}
.fraktur{font-family:'UnifrakturMaguntia','EB Garamond',serif;font-weight:400}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- header ---------- */
.hdr{display:flex;align-items:center;gap:10px;padding:12px 0}
.hdr .logo{flex:1 1 auto;display:flex;align-items:center;min-height:44px;min-width:0}
.hdr .logo img{height:30px;width:auto;display:block}
.hdr .actions{display:flex;gap:8px;align-items:center;flex:0 0 auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:22px;background:var(--red);color:var(--card);font:500 14px 'Plex Sans',sans-serif;text-decoration:none;border:0;cursor:pointer;box-shadow:inset 0 0 0 1.5px var(--goldl)}
.btn.ghost{background:transparent;color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.btn.light{background:#F1D88E;color:var(--burg);box-shadow:none}
.btn.block{display:flex;width:100%}
details.support{position:relative}
details.support summary{list-style:none}
details.support summary::-webkit-details-marker{display:none}
details.support .menu{position:absolute;right:0;top:52px;z-index:20;width:min(280px,calc(100vw - 32px));background:var(--card);border:1px solid var(--line);box-shadow:0 10px 28px rgba(28,27,25,.16);padding:4px 14px}
.menu a{display:block;padding:12px 0;text-decoration:none;border-top:1px solid var(--line)}
.menu a:first-child{border-top:0}
.menu b{font-weight:500}.menu span{display:block;font-size:13px;color:var(--muted)}
.cotw{display:none}
.toprule{height:1.5px;background:var(--gold-rule)}
.crumbs{padding:12px 0 0;font-family:'Plex Mono',monospace;font-size:11.5px;letter-spacing:.5px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.crumbs .here{color:var(--red)}

/* ---------- type ---------- */
.kick{font-family:'Plex Mono',monospace;font-size:11.5px;letter-spacing:1px;color:var(--muted)}
.gold-h{font-family:'EB Garamond',serif;font-weight:500;background:var(--gold-leaf);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-bottom:4px}
h1.page{margin:6px 0 0;font-size:44px;line-height:1.05}
.sec{margin-top:40px}
.sec>h2{margin:0;font-size:30px;line-height:1.15}
.sec .rule{height:1.5px;background:var(--gold-rule);margin:8px 0 16px}
.lead{margin:0 0 14px;font-family:'EB Garamond',serif;font-size:19px;line-height:1.55}
.note{font-family:'Plex Mono',monospace;font-size:10.5px;letter-spacing:.5px;color:var(--muted)}
.tag{display:inline-block;font-family:'Plex Mono',monospace;font-size:10.5px;letter-spacing:.6px;padding:3px 7px;border-radius:3px;border:1px solid var(--goldl);color:var(--goldtxt)}
.tag.live{background:var(--red);border-color:var(--red);color:var(--card)}
.tag.wip{border-color:var(--red);color:var(--red)}

/* ---------- photo placeholders ---------- */
.ph{background:#2A2118;color:#E9DCC4;display:flex;align-items:center;justify-content:center;text-align:center;font-family:'Plex Mono',monospace;font-size:11px;letter-spacing:1px;line-height:1.9;padding:12px}
.ph.light{background:#E9E1D0;color:var(--muted);border:1px dashed var(--goldl)}

/* ---------- boxes ---------- */
.box{background:var(--card);border:1px solid var(--line);padding:18px 16px;border-radius:6px}
.box h3{margin:0;font-family:'EB Garamond',serif;font-weight:500;font-size:23px;line-height:1.2}
.box p{margin:4px 0 0;font-size:14px;color:var(--muted)}
.box form{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.box label{flex:1 1 200px;display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.box input{height:48px;border:1px solid #BFB193;border-radius:6px;background:#fff;padding:0 12px;font:16px 'Plex Sans',sans-serif;color:var(--ink)}
.box .btn{align-self:flex-end}
.burg{background:var(--burg);color:#E9DCC4;padding:24px 18px;outline:1px solid rgba(201,162,74,.55);outline-offset:-7px}
.burg h2{margin:6px 0 0;font-family:'EB Garamond',serif;font-style:italic;font-weight:400;font-size:32px;line-height:1.08;color:#FBF7EC}
.burg p{margin:8px 0 0;font-size:15px;line-height:1.6}
.burg .k{font-family:'Plex Mono',monospace;font-size:11px;letter-spacing:1px;color:#E7CC80}

/* ---------- support list (end of pages) ---------- */
.support-list{border-top:1px solid var(--line)}
.support-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;border-bottom:1px solid var(--line);text-decoration:none}
.support-list b{display:block;font-family:'EB Garamond',serif;font-weight:400;font-size:20px}
.support-list span span{display:block;font-size:13px;color:var(--muted)}
.support-list i{font-style:normal;color:var(--red)}

/* ---------- footer ---------- */
footer.site{background:var(--burg);color:#E9DCC4;position:relative;padding:34px 0 22px;margin-top:48px}
footer.site::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#8A6416,#E7CC80 25%,#B48C3C 50%,#E7CC80 75%,#8A6416)}
footer.site .wm img{height:34px;width:auto;display:block}
.fcols{display:grid;grid-template-columns:1fr 1fr;gap:22px 16px;margin-top:22px}
.fh{font-size:14px;line-height:2.1}
.fh b{display:block;font-family:'EB Garamond',serif;font-weight:500;font-size:19px;color:#F1D88E}
.fh a{color:#E9DCC4;text-decoration:none}
.fnet{margin-top:26px;padding-top:14px;border-top:1px solid rgba(201,162,74,.45);font-family:'Plex Mono',monospace;font-size:10.5px;letter-spacing:.5px;color:#D6C6A6}

/* ---------- wider screens ---------- */
@media (min-width:640px){
  .cotw{display:inline-flex}
  .hdr .logo img{height:44px}
  h1.page{font-size:54px}
}
@media (min-width:960px){
  .wrap{padding:0 48px}
  .hdr{padding:24px 0 20px}
  .hdr .logo img{height:60px}
  .fcols{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ---------- forms (contact, suggest a church) ---------- */
.fpage{max-width:720px}
.fpage .intro{margin:8px 0 0;font-family:'EB Garamond',serif;font-size:19px;line-height:1.5;color:var(--body)}
.fform{display:flex;flex-direction:column;gap:16px;margin-top:22px}
.fset{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:16px 14px 18px;margin:0;display:flex;flex-direction:column;gap:14px;min-width:0}
.fset legend{padding:0 6px;font-family:'EB Garamond',serif;font-weight:500;font-size:22px;color:var(--red)}
.fld{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--muted)}
.fld b{font-weight:500;color:var(--ink);font-size:14px}
.fld input,.fld select,.fld textarea{width:100%;min-height:48px;border:1px solid #BFB193;border-radius:6px;background:#fff;padding:10px 12px;font:16px 'Plex Sans',sans-serif;color:var(--ink)}
.fld textarea{min-height:130px;resize:vertical;line-height:1.5}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--red);outline-offset:1px;border-color:var(--red)}
.frow{display:grid;grid-template-columns:1fr;gap:14px}
.opt{display:flex;gap:12px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:14px;line-height:1.45;cursor:pointer}
.opt input{flex:0 0 auto;width:22px;height:22px;margin:0;accent-color:var(--red)}
.opt span span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.opt:has(input:checked){border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:130px;border:1.5px dashed var(--goldl);border-radius:6px;background:#FBF7EC;text-align:center;padding:16px;cursor:pointer;color:var(--muted);font-size:13px}
.drop b{color:var(--red);font-weight:500;font-size:16px}
.drop input{position:absolute;width:1px;height:1px;opacity:0}
.drop:focus-within{outline:2px solid var(--red);outline-offset:2px}
.thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.thumbs figure{margin:0;position:relative;aspect-ratio:1;border-radius:4px;overflow:hidden;background:#E9E1D0}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs button{position:absolute;top:4px;right:4px;width:32px;height:32px;border-radius:16px;border:0;background:rgba(28,27,25,.75);color:#fff;font-size:18px;line-height:1;cursor:pointer}
.thumbs .bar{position:absolute;left:0;bottom:0;height:4px;background:var(--gold);width:0;transition:width .2s}
.thumbs figure.ok::after{content:'✓';position:absolute;left:6px;bottom:6px;width:24px;height:24px;border-radius:12px;background:var(--red);color:#fff;font-size:14px;display:flex;align-items:center;justify-content:center}
.fmsg{padding:12px 14px;border-radius:6px;font-size:14px}
.fmsg.err{background:#F7E4E0;color:#7A1A15;border:1px solid #D9A9A1}
.fdone{text-align:center;padding:28px 18px}
.fdone h2{margin:8px 0 0;font-family:'EB Garamond',serif;font-weight:500;font-size:32px}
.fdone p{font-size:15px;color:var(--muted)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fsmall{font-size:12.5px;color:var(--muted);line-height:1.5}
.fsubmit .btn{width:100%;min-height:52px;font-size:16px}
.fsubmit .btn[disabled]{opacity:.6;cursor:wait}
@media (min-width:640px){
  .frow{grid-template-columns:1fr 1fr}
  .fset{padding:20px 22px 22px}
  .thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .fsubmit .btn{width:auto;min-width:220px}
}

/* ---------- Today in Church History ---------- */
.today{max-width:720px}
.today>.kick{margin-top:18px}
.today h1.page{font-size:38px}
.thead{margin:6px 0 0;font-family:'EB Garamond',serif;font-style:italic;font-size:23px;line-height:1.25;color:var(--red)}
.topen{margin:12px 0 0;font-size:15px;line-height:1.55;color:var(--muted)}
.tacc{margin-top:22px}
.tacc p{margin:0 0 14px;font-family:'EB Garamond',serif;font-size:20px;line-height:1.55;color:var(--body)}
.tlist,.tdays{list-style:none;margin:0;padding:0}
.tlist li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.45}
.tlist .mono{font-size:13px;line-height:1.7;color:var(--red)}
.tfeast{margin:0;font-family:'EB Garamond',serif;font-size:20px;line-height:1.4}
.tsmall{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--muted)}
.tsmall b{font-weight:500;color:var(--ink)}
.tnote{margin-top:24px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:6px}
.tsrc{margin-top:28px}
.tnav{display:flex;justify-content:space-between;gap:10px;margin-top:32px}
.tnav a{flex:0 1 48%;display:block;padding:10px 14px;background:var(--card);border:1px solid var(--line);border-radius:6px;text-decoration:none;font-family:'EB Garamond',serif;font-size:19px;line-height:1.2}
.tnav a.n{margin-left:auto;text-align:right}
.tnav span{display:block;font-family:'Plex Mono',monospace;font-size:10.5px;letter-spacing:.5px;color:var(--muted);margin-bottom:3px}
.tcal{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.tcal a,.tcal span{display:flex;align-items:center;justify-content:center;min-height:46px;border-radius:6px;font-family:'EB Garamond',serif;font-size:20px;text-decoration:none}
.tcal a{background:var(--card);border:1px solid var(--goldl);color:var(--red)}
.tcal a.here{background:var(--red);border-color:var(--red);color:var(--card)}
.tcal span{border:1px dashed var(--line);color:#6F685B}
.tcal .now a,.tcal .now span{box-shadow:0 0 0 2px var(--egg),0 0 0 4px var(--gold)}
.tsoon{margin-top:14px}
.tdays a{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:baseline;min-height:48px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;font-family:'EB Garamond',serif;font-size:19px;line-height:1.25}
.tdays .mono{font-size:13px;color:var(--red)}
@media (min-width:640px){
  .today h1.page{font-size:50px}
  .tcal a,.tcal span{min-height:60px;font-size:23px}
}

/* gold lettering lives here so it reaches every page */
.gold-t{background:var(--gold-leaf);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
footer.site .fh b{background:linear-gradient(172deg,#C99A3A,#F1D88E 45%,#C5973A 75%,#E2C26E);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
