/* =========================================================================
   RA Fischer: block styling for converted posts
   Loaded on the front end and in the block editor, so writers see what
   readers see. The 217 converted posts use: paragraph, heading, list, image,
   buttons, quote, details, separator, embed, table, and synced patterns.
   ========================================================================= */

/* ---------- Reading measure and rhythm ---------- */

/* Reading measure. Without this, posts run the full container width and the
   images blow up with it. Pages built as HTML set their own widths and are
   excluded, so this only shapes the 217 converted posts. */
.single-post .entry-content {
  font-size: 17px;
  line-height: 1.75;
  color: var(--raf-text);
  max-width: var(--raf-content);
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
.single-post .entry-header,
.single-post .raf-author-box,
.single-post .raf-related,
.single-post .raf-post-meta {
  max-width: var(--raf-content);
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

/* Featured image. GeneratePress uses .featured-image or .post-image depending
   on where the image is placed, so both are handled. The cap on height matters
   as much as the width: several of these images are tall portraits that would
   otherwise fill the screen before a word of the post is visible. */
.single-post .featured-image,
.single-post .post-image {
  max-width: var(--raf-content);
  margin: 0 auto 28px;
  padding: 0 20px;
}
.single-post .featured-image img,
.single-post .post-image img {
  width: 100%;
  height: auto;          /* no crop: these banners carry their own headline */
  border-radius: 12px;
  display: block;
}

/* Inline images: never wider than the measure, never distorted. */
.single-post .entry-content img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Wide and full alignments still get to breathe, just not without limit. */
.single-post .entry-content .alignwide { max-width: 1000px; margin-left: auto; margin-right: auto; }
.single-post .entry-content .alignfull { max-width: 100%; }

/* Videos and embeds keep their aspect ratio inside the measure. */
.single-post .entry-content iframe { max-width: 100%; }

.single-post .entry-content > * { margin-bottom: 1.3em; }

.single-post .entry-content h2 {
  font-size: 1.7rem;
  margin-top: 2.2em;
  margin-bottom: 0.5em;
  padding-bottom: 0.35em;
  border-bottom: 1px solid var(--raf-border);
}

.single-post .entry-content h3 {
  font-size: 1.3rem;
  margin-top: 1.8em;
  margin-bottom: 0.4em;
}

.single-post .entry-content h4 {
  font-family: var(--raf-sans);
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--raf-text);
  margin-top: 1.6em;
}

/* ---------- Lists ---------- */

.entry-content ul.wp-block-list,
.entry-content ol.wp-block-list { padding-left: 1.3em; }

.entry-content .wp-block-list li { margin-bottom: 0.5em; }

/* ---------- Images ---------- */

.entry-content .wp-block-image img {
  border-radius: 12px;
  display: block;
  height: auto;
}

.entry-content .wp-block-image figcaption {
  font-size: 12.5px;
  color: var(--raf-text-muted);
  text-align: center;
  margin-top: 8px;
}

/* ---------- Buttons ---------- */

.entry-content .wp-block-button__link {
  background: var(--raf-green);
  color: #fff;
  font-family: var(--raf-sans);
  font-size: 15px;
  font-weight: 500;
  padding: 13px 28px;
  border-radius: 8px;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  transition: background 0.2s;
}
.entry-content .wp-block-button__link:hover { background: var(--raf-navy); color: #fff; }

.entry-content .is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--raf-blue);
  border: 1.5px solid var(--raf-blue);
}
.entry-content .is-style-outline .wp-block-button__link:hover {
  background: var(--raf-blue);
  color: #fff;
}

/* ---------- Details, converted from the Elementor accordions ---------- */

.entry-content .wp-block-details {
  border-bottom: 1px solid var(--raf-border);
  padding: 0;
}
.entry-content .wp-block-details:first-of-type { border-top: 1px solid var(--raf-border); }

.entry-content .wp-block-details summary {
  position: relative;
  list-style: none;
  cursor: pointer;
  padding: 16px 36px 16px 0;
  font-family: var(--raf-sans);
  font-size: 16px;
  font-weight: 500;
  color: var(--raf-text);
  line-height: 1.4;
}
.entry-content .wp-block-details summary::-webkit-details-marker { display: none; }

.entry-content .wp-block-details summary::after {
  content: '+';
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
  color: var(--raf-green);
  transition: transform 0.25s;
}
.entry-content .wp-block-details[open] summary::after {
  transform: translateY(-50%) rotate(45deg);
}

.entry-content .wp-block-details > *:not(summary) {
  font-size: 15.5px;
  color: var(--raf-text-mid);
  margin-bottom: 1em;
}
.entry-content .wp-block-details > *:last-child { padding-bottom: 10px; }

/* ---------- Quotes, converted from the testimonial widgets ---------- */

.entry-content .wp-block-quote {
  background: var(--raf-bg-soft);
  border: 1px solid var(--raf-border);
  border-left: 4px solid var(--raf-green);
  border-radius: 12px;
  padding: 20px 24px;
  margin: 1.8em 0;
}
.entry-content .wp-block-quote p {
  font-size: 16px;
  line-height: 1.65;
  color: var(--raf-text-mid);
  margin-bottom: 0.6em;
}
.entry-content .wp-block-quote cite {
  font-style: normal;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--raf-text);
}

/* ---------- Tables ---------- */

.entry-content .wp-block-table { overflow-x: auto; }
.entry-content .wp-block-table table {
  border-collapse: collapse;
  font-size: 15px;
  width: 100%;
}
.entry-content .wp-block-table th {
  background: var(--raf-navy);
  color: #fff;
  font-weight: 500;
  text-align: left;
  padding: 12px 14px;
}
.entry-content .wp-block-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--raf-border);
  vertical-align: top;
}
.entry-content .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: var(--raf-bg-soft);
}

/* ---------- Separator ---------- */

.entry-content .wp-block-separator {
  border: 0;
  border-top: 1px solid var(--raf-border);
  margin: 2.4em auto;
  max-width: 100%;
}

/* ---------- Embeds ---------- */

.entry-content .wp-block-embed iframe { border-radius: 12px; max-width: 100%; }

/* =========================================================================
   Blog template: meta, author box, related posts
   ========================================================================= */

/* Categories, tags and prev/next. GeneratePress outputs these as plain lists,
   which read as stray links under the article. */
.single-post .entry-meta,
.single-post .post-navigation {
  max-width: var(--raf-content);
  margin: 0 auto;
  padding: 0 20px;
}
.single-post footer.entry-meta {
  margin-top: 32px;
  padding-top: 18px;
  border-top: 1px solid var(--raf-border);
  font-size: 13px;
  color: var(--raf-text-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}
.single-post footer.entry-meta a {
  color: var(--raf-text-mid);
  text-decoration: none;
  border-bottom: 1px solid var(--raf-border-mid);
}
.single-post footer.entry-meta a:hover { color: var(--raf-blue); }

.single-post .post-navigation {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 20px;
  font-size: 13.5px;
}
.single-post .post-navigation .nav-previous,
.single-post .post-navigation .nav-next { max-width: 48%; }
.single-post .post-navigation a {
  color: var(--raf-navy);
  text-decoration: none;
  font-weight: 500;
  line-height: 1.4;
  display: block;
}
.single-post .post-navigation a:hover { color: var(--raf-blue); }

@media (max-width: 600px) {
  .single-post .post-navigation { flex-direction: column; }
  .single-post .post-navigation .nav-previous,
  .single-post .post-navigation .nav-next { max-width: 100%; }
}

.single-post .entry-header .entry-title { font-size: clamp(1.9rem, 3.4vw, 2.6rem); }

.raf-post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  font-size: 13px;
  color: var(--raf-text-muted);
  margin: 10px 0 24px;
}
.raf-post-meta a { color: var(--raf-text-muted); text-decoration: underline; }

.raf-author-box {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-top: 48px;
  padding: 22px 24px;
  background: var(--raf-bg-soft);
  border: 1px solid var(--raf-border);
  border-radius: 12px;
}
.raf-author-box img { border-radius: 50%; flex-shrink: 0; width: 48px; height: 48px; }
.raf-author-box { padding: 16px 20px; }
.raf-author-box .raf-author-name {
  font-size: 15px;
  font-weight: 500;
  color: var(--raf-navy);
  margin-bottom: 2px;
}
.raf-author-box .raf-author-bio {
  font-size: 13.5px;
  color: var(--raf-text-muted);
  line-height: 1.6;
}

.raf-related { margin-top: 48px; }
.raf-related h2 {
  font-size: 1.4rem;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--raf-border);
  margin-bottom: 18px;
}
.raf-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.raf-related-card {
  border: 1px solid var(--raf-border);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  transition: box-shadow 0.2s;
}
.raf-related-card:hover { box-shadow: 0 8px 24px rgba(27,58,92,0.10); }
.raf-related-card img { width: 100%; height: 140px; object-fit: cover; display: block; }
.raf-related-card .raf-related-body { padding: 14px 16px 18px; }
.raf-related-card .raf-related-date { font-size: 11px; color: var(--raf-text-muted); margin-bottom: 4px; }
.raf-related-card a {
  font-size: 14px;
  font-weight: 500;
  color: var(--raf-navy);
  line-height: 1.4;
  text-decoration: none;
}
.raf-related-card a:hover { color: var(--raf-blue); }

@media (max-width: 768px) {
  .raf-related-grid { grid-template-columns: 1fr; }
  .raf-author-box { flex-direction: column; }
  .single-post .entry-content { font-size: 16px; }
}

/* =========================================================================
   Editor: keep the writing view close to the reading view
   ========================================================================= */

.editor-styles-wrapper {
  font-family: var(--raf-sans);
  color: var(--raf-text);
}
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3 {
  font-family: var(--raf-serif);
  font-weight: 400;
  color: var(--raf-navy);
}