/* Guided Prayer — shared styles for guide + FAQ pages (matches homepage tokens) */
:root {
  --primary:#1D4ED8;
  --primaryDark:#1E3A8A;
  --teal:#3B82F6;
  --gold:#d4a72c;
  --bg:#f8fafc;
  --text:#1f2937;
  --muted:#6b7280;
  --border:#DBEAFE;
  --white:#fff;
  --radius:20px;
  --shadow:0 14px 36px rgba(17,24,39,.1);
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:"Manrope","Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 6% 0%, rgba(29,78,216,.14), transparent 35%),
    linear-gradient(180deg, #f8fafc 0%, var(--bg) 40%, #eef2ff 100%);
  line-height:1.65;
}
a { color:var(--primaryDark); }
.container { width:min(1140px, calc(100% - 48px)); margin:0 auto; }
header.site {
  position:sticky; top:0; z-index:99;
  backdrop-filter:blur(10px);
  background:rgba(248,250,252,.9);
  border-bottom:1px solid rgba(207,250,254,.9);
}
.headerRow { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand {
  display:flex; align-items:center; gap:12px;
  font-family:"Fraunces",serif; font-size:22px; font-weight:800;
  color:var(--text); text-decoration:none;
}
.mark {
  width:34px; height:34px; border-radius:10px; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid rgba(29,78,216,.2);
}
.mark img { width:100%; height:100%; object-fit:cover; display:block; }
header.site nav { display:flex; gap:22px; }
header.site nav a { color:var(--muted); font-size:14px; font-weight:700; text-decoration:none; }
header.site nav a:hover { color:var(--primaryDark); }
.topBtn {
  padding:10px 15px; border-radius:999px; font-weight:800; font-size:13px; color:#fffaf4;
  text-decoration:none; white-space:nowrap;
  background:linear-gradient(135deg, var(--primary), var(--primaryDark));
  box-shadow:0 10px 24px rgba(29,78,216,.28);
}
main.article { max-width:780px; margin:0 auto; padding:44px 24px 60px; }
.crumb { font-size:13px; color:var(--muted); margin-bottom:18px; }
.crumb a { color:var(--muted); }
main.article h1 {
  font-family:"Fraunces",serif;
  font-size:clamp(30px,5vw,44px);
  line-height:1.08; letter-spacing:-.5px;
  margin-bottom:14px;
}
.lead { font-size:18px; color:var(--muted); margin-bottom:26px; }
main.article h2 {
  font-family:"Fraunces",serif;
  font-size:clamp(22px,3.4vw,28px);
  line-height:1.15; margin:34px 0 10px;
}
main.article h3 { font-size:18px; margin:24px 0 8px; }
main.article p { margin-bottom:14px; }
main.article ul, main.article ol { margin:0 0 16px 22px; }
main.article li { margin-bottom:8px; }
blockquote.verse {
  border-left:4px solid var(--gold);
  background:rgba(255,255,255,.8);
  border-radius:0 14px 14px 0;
  padding:14px 18px; margin:0 0 16px;
  font-style:italic;
}
blockquote.verse cite { display:block; margin-top:6px; font-style:normal; font-weight:700; font-size:14px; color:var(--primaryDark); }
.bridge {
  margin:36px 0;
  border:1px solid rgba(59,130,246,.24);
  background:linear-gradient(160deg,#fff 0%, #eff6ff 100%);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:26px;
  display:grid; grid-template-columns:1fr 190px; gap:22px; align-items:center;
}
.bridge h2 { margin-top:0 !important; }
.bridge img {
  width:100%; height:auto; border-radius:16px;
  border:1px solid rgba(37,99,235,.2);
}
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding:13px 20px; border-radius:12px; font-size:14px; font-weight:800;
  color:#fffaf4; text-decoration:none;
  background:linear-gradient(135deg, var(--primary), var(--primaryDark));
  box-shadow:0 10px 24px rgba(29,78,216,.27);
}
.related {
  margin-top:40px; padding-top:22px;
  border-top:1px solid rgba(207,250,254,.9);
}
.related h2 { font-size:20px !important; margin-top:0 !important; }
.related ul { list-style:none; margin-left:0; }
.related li { margin-bottom:8px; }
footer.site { padding:46px 0 26px; }
.foot {
  border-top:1px solid rgba(207,250,254,.8); padding-top:28px;
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:18px;
}
.foot h4 { font-size:13px; text-transform:uppercase; letter-spacing:.35px; color:var(--primaryDark); margin-bottom:10px; }
.footBrand { font-family:"Fraunces",serif; font-size:22px; margin-bottom:7px; }
.foot p, .foot a { color:var(--muted); font-size:14px; }
.foot ul { list-style:none; display:grid; gap:7px; }
@media (max-width:900px) {
  .foot { grid-template-columns:1fr 1fr; }
  .bridge { grid-template-columns:1fr; }
  .bridge img { max-width:210px; }
}
@media (max-width:640px) {
  .container { width:min(1140px, calc(100% - 28px)); }
  header.site nav { display:none; }
  .foot { grid-template-columns:1fr; }
}