/* ------------------------------------------------------------------
   prose.css - running text in the pink / lavender design: the About story, a
   project's write-up, a plain page and a blog post.

   The bodies came from Divi and the editor, so .prose styles a plain run of
   elements (paragraphs, headings, lists, images, video, code) rather than
   anything the theme emits itself. A page asks for it with
   fr_modern_look( 'name', array( 'components', 'prose' ) ).
   ------------------------------------------------------------------ */

.prose{color:#4a4456;font-size:16.5px;line-height:1.82}
.prose>*:first-child{margin-top:0}
.prose>*:last-child{margin-bottom:0}
.prose p{margin:0 0 22px}
.prose h2{margin:48px 0 14px;color:#261f31;font-size:clamp(25px,2.7vw,33px);font-weight:740;line-height:1.2;letter-spacing:-.04em}
.prose h3{margin:38px 0 12px;color:#2b2335;font-size:clamp(20px,2.1vw,25px);font-weight:720;line-height:1.28;letter-spacing:-.03em}
.prose h4{margin:30px 0 10px;color:#2b2335;font-size:18px;font-weight:720;letter-spacing:-.02em}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose a{color:#7b4aa3;font-weight:650;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose a:hover{color:#a5508b}
.prose strong{color:#241d2e;font-weight:760}
.prose ul,.prose ol{margin:0 0 22px;padding-left:24px}
.prose li{margin-bottom:9px}
.prose ul li::marker{color:#b66fbd}
.prose blockquote{margin:30px 0;padding:19px 24px;border-left:3px solid #c58ad0;border-radius:0 14px 14px 0;background:#f8f1fb;font-size:1.06em}
.prose blockquote p:last-child{margin-bottom:0}
.prose hr{margin:42px 0;border:0;border-top:1px solid #e6dded}
.prose table{width:100%;margin:0 0 24px;border-collapse:collapse;font-size:.95em}
.prose th,.prose td{padding:10px 12px;border:1px solid #e6dded;text-align:left}
.prose th{background:#f6f0fa;color:#261f31;font-weight:780}

/* Images and figures. */
.prose img,.post-figure img{display:block;max-width:100%;height:auto;border-radius:16px}
.post-figure{width:100%;margin:32px 0}
.post-figure img{width:100%;box-shadow:0 14px 40px rgba(59,28,73,.1)}
.prose figcaption{margin-top:10px;color:#6a6270;font-size:13px;text-align:center}

/* Video: a fixed ratio, so it scales with the column and leaves no gap. */
.post-video{position:relative;margin:32px 0;padding-top:56.25%;overflow:hidden;border-radius:16px;background:#1d1929;box-shadow:0 14px 40px rgba(59,28,73,.14)}
.post-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Code. Divi kept newlines as comment markers; they are restored before this
   runs, so pre keeps whitespace and long blocks scroll sideways. */
.prose pre{margin:28px 0;padding:20px 22px;overflow-x:auto;border-radius:14px;background:#1d1929;color:#e8e2f0;font-size:14px;line-height:1.6;white-space:pre;-webkit-overflow-scrolling:touch;box-shadow:0 14px 40px rgba(29,25,41,.18)}
.prose pre code{padding:0;border:0;background:none;color:inherit;font-size:inherit}
.prose code{padding:2px 6px;border:1px solid #e6dded;border-radius:6px;background:#f6f0fa;color:#a5508b;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:.9em}
.prose pre::-webkit-scrollbar{height:8px}
.prose pre::-webkit-scrollbar-thumb{border-radius:99px;background:#6b5d8266}

/* Divi left empty wrappers behind; collapse them so there are no dead gaps. */
.prose div:empty,.prose p:empty,.prose span:empty{display:none}
.prose div{margin:0}

/* A plain page or a fallback view is one readable column, not the full width. */
.page-band .prose{max-width:800px}

.page-links{margin-top:28px;color:#6a6270;font-size:14px;font-weight:700}
.page-links a{margin:0 3px}
