/* Site title like hero text (Source Serif Pro) */
.wp-block-site-title,
.wp-block-site-title a {
  font-family: "Source Serif Pro", ui-serif, Georgia, "Times New Roman", serif;
  font-style: normal !important;
  font-weight: 550;                               /* use a clear weight */
  font-size: clamp(34px, 4.8vw, 76px) !important;   /* desktop/tablet default */
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: #F7F5F2;
  text-decoration: none;
}

/* Ensure anchor inherits and behaves */
.wp-block-site-title a {
  font: inherit !important;
  color: inherit;
  display: inline-block;
}

/* Remove unexpected spacing above/below the title */
.wp-block-site-title { 
  margin: 0 !important;
}

/* Make the logo BIGGER on small phones */
@media (max-width: 480px){
  .wp-block-site-title {
    font-size: clamp(30px, 8.5vw, 64px) !important;  /* larger than default */
    line-height: 1.05;
  }
}

/* Optional: subtle halo for readability over hero image */
.home .wp-block-site-title,
.home .wp-block-site-title a,
.front-page .wp-block-site-title,
.front-page .wp-block-site-title a {
  text-shadow: 0 2px 6px rgba(0,0,0,.5);
}

/* Default: dark logo/text on light pages (posts, archives, etc.) */
body:not(.home):not(.front-page) .wp-block-site-title,
body:not(.home):not(.front-page) .wp-block-site-title a {
  color: #0D1B2A !important;
  text-shadow: none !important;
}

/* Optional: small icon separation on dark hero only */
.home .wp-block-site-logo img,
.front-page .wp-block-site-logo img {
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}

/* Headings with outline */
h1.outlined, h2.outlined {
  font-weight: 500;
  color: #FFF;
  -webkit-text-fill-color: #FFF;
  -webkit-text-stroke: clamp(.6px, .18vw, 1.2px) rgba(0,0,0,.75);
  text-shadow: 0 0 6px rgba(0,0,0,.22);
  paint-order: stroke fill;
}

/* Tablet and down: size control for outlined headings */
@media (max-width: 768px){
  h1.outlined, h2.outlined {
    font-size: 2rem !important;   /* ~32px */
    line-height: 1.12;
    max-width: 18ch;
  }
}

/* Small phones: slightly smaller than tablet (fix wrong 3.7rem) */
@media (max-width: 480px){
  h1.outlined, h2.outlined {
    font-size: 1.6rem !important; /* ~26px */
    line-height: 1.15;
    max-width: 16ch;
    -webkit-text-stroke: .6px rgba(0,0,0,.8);
    text-shadow: 0 0 4px rgba(0,0,0,.22);
  }
}

/* Firefox fallback for outlined headings */
@supports not (-webkit-text-stroke: 1px black){
  h1.outlined, h2.outlined {
    text-shadow:
      0 0 1px rgba(0,0,0,.85),
      0 0 3px rgba(0,0,0,.35);
  }
}

/* Scope fixes so your style isn't ruined by theme ornaments */
figure.wp-block-quote > blockquote.scripture::before,
blockquote.scripture::before,
blockquote.scripture::after{ content:none !important; }

blockquote.scripture p{ margin:0; }
blockquote.scripture cite{
  display:block; margin-top:.6rem; font-style:normal; font-size:.92em; opacity:.85;
}

/* Dark mode tokens */
@media (prefers-color-scheme: dark){
  blockquote.scripture{ --scr-bg:#0b1020; --scr-accent:#93c5fd; --scr-ring:rgba(147,197,253,.2); }
}

/* verse styloe starts here */

blockquote.scripture{
  --scr-accent:#3b82f6;               /* accent colour */
  --scr-bg:#f7f9fc;                   /* card background */
  --scr-ring:rgba(59,130,246,.15);    /* soft glow */
  --scr-ink:inherit;

  display:block; max-width:65ch; color:var(--scr-ink);
  padding:1.25rem 1.2rem; border-radius:16px;
  background:
    radial-gradient(120% 120% at 0% 0%, var(--scr-ring), transparent 60%),
    var(--scr-bg);
  box-shadow:0 6px 20px rgba(0,0,0,.08);
}

/* ===== Reduce font size body===== */

/* Standalone post typography — does NOT affect site title/logo
   Abbrev.: px = pixels, vw = viewport width */

/* === Single post: body text (slightly larger) === */
.single-post .wp-block-post-content,
.single-post .entry-content {
  font-size: clamp(19px, 1.6vw, 21px) !important;
  line-height: 1.7;
}

/* Keep common text elements in sync */
.single-post .entry-content p,
.single-post .entry-content li,
.single-post .entry-content figcaption {
  font-size: inherit;
  line-height: inherit;
}

/* === Single post: main post title (slightly larger) === */
.single-post .wp-block-post-title,
.single-post .entry-title {
  font-size: clamp(34px, 4.6vw, 48px) !important;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

/* === Single post: headings inside the content (slightly larger) === */
.single-post .wp-block-post-content h1,
.single-post .entry-content h1 {
  font-size: clamp(32px, 3.9vw, 42px) !important;
  line-height: 1.2;
}

.single-post .wp-block-post-content h2,
.single-post .entry-content h2 {
  font-size: clamp(27px, 3.2vw, 36px) !important;
  line-height: 1.25;
}

.single-post .wp-block-post-content h3,
.single-post .entry-content h3 {
  font-size: clamp(23px, 2.7vw, 28px) !important;
  line-height: 1.3;
}

.single-post .wp-block-post-content h4,
.single-post .entry-content h4 {
  font-size: clamp(21px, 2.4vw, 24px) !important;
  line-height: 1.35;
}

.single-post .wp-block-post-content h5,
.single-post .entry-content h5 {
  font-size: clamp(20px, 2.1vw, 22px) !important;
  line-height: 1.4;
}

.single-post .wp-block-post-content h6,
.single-post .entry-content h6 {
  font-size: clamp(19px, 1.8vw, 20px) !important;
  line-height: 1.45;
}

/* If you use outlined headings inside posts */
.single-post .entry-content h1.outlined,
.single-post .entry-content h2.outlined {
  font-size: clamp(30px, 3.4vw, 40px) !important;
  line-height: 1.2;
}
