/* Blog content 1.0.0 */
/* Styling for the WordPress block markup inside an article body.
   Deliberately NOT built on .lvd-default: that class serves component rich-text —
   short WYSIWYG fields, with `ul` as a grid for multi-column lists and no support
   for ol, quotes, tables, figures or embeds. An article body is the opposite case
   (the full core block set, one column, long-form reading), and sharing one class
   meant every tweak to one risked breaking the other. */

.lvd-blog-single-body {
    /* Media corner radius — set from the Customizer, read by every media rule
       below, so the setting lives in one variable instead of a dozen rules. */
    --lvd-body-radius: var(--lvd-rounded);
    /* Reading measure, looser than the UI line-height (1.4) the rest of the theme
       uses: 1.4 is right for a button, cramped for a 16px paragraph read for
       minutes at a time. */
    --lvd-body-leading: 1.65;
}
.lvd-blog-single-body.lvd-body-radius-none  {--lvd-body-radius: 0;}
.lvd-blog-single-body.lvd-body-radius-md    {--lvd-body-radius: var(--lvd-rounded-md);}

/*--------------------------- TEXT ---------------------------*/

.lvd-blog-single-body p             {line-height:var(--lvd-body-leading); margin-bottom:24px;}

/* Headings — scale steps by ratio (~1.25 at the top, tightening downwards) rather
   than in fixed 8px increments, so h2 stays clearly below the article's h1 (48px)
   without the lower levels bunching up. */
.lvd-blog-single-body h2            {font-size:28px;}
.lvd-blog-single-body h3            {font-size:22px;}
.lvd-blog-single-body h4            {font-size:19px;}
.lvd-blog-single-body h5            {font-size:17px;}
.lvd-blog-single-body h6            {font-size:16px; text-transform:uppercase; letter-spacing:0.06em;}
.lvd-blog-single-body h2,
.lvd-blog-single-body h3,
.lvd-blog-single-body h4,
.lvd-blog-single-body h5,
.lvd-blog-single-body h6            {color:var(--lvd-color-black); line-height:1.25; font-weight:700;}

/* Section rhythm comes from the space ABOVE a heading, which the theme's rich-text
   base never set — headings sat flush against the preceding paragraph. */
.lvd-blog-single-body h2            {margin-top:32px; margin-bottom:16px;}
.lvd-blog-single-body h3,
.lvd-blog-single-body h4,
.lvd-blog-single-body h5,
.lvd-blog-single-body h6            {margin-top:24px; margin-bottom:12px;}
/* Anchors from the table of contents must clear the sticky header. Same 100px the
   grouped archives already use. */
.lvd-blog-single-body h2[id],
.lvd-blog-single-body h3[id]        {scroll-margin-top:100px;}

.lvd-blog-single-body a             {color:var(--lvd-cc-link); text-decoration:underline; text-underline-offset:3px;}
.lvd-blog-single-body a:hover       {color:var(--lvd-cc-link); opacity:0.7;}
.lvd-blog-single-body strong        {font-weight:700;}

/*--------------------------- LISTS ---------------------------*/

/* Ordered lists keep their numbers. The rich-text base stripped list markers from
   every li and painted a bullet pseudo-element on top, which silently turned every
   numbered list in an article into a bulleted one. */
.lvd-blog-single-body ul,
.lvd-blog-single-body ol            {margin:0 0 24px 0; padding-left:24px;}
.lvd-blog-single-body ul            {list-style:disc;}
.lvd-blog-single-body ol            {list-style:decimal;}
.lvd-blog-single-body li            {list-style:inherit; margin-bottom:8px; padding:0; line-height:var(--lvd-body-leading);}
.lvd-blog-single-body li::marker    {color:var(--lvd-cc-list-icon);}
.lvd-blog-single-body li:last-child {margin-bottom:0;}
/* Nested lists close up against their parent item. */
.lvd-blog-single-body li > ul,
.lvd-blog-single-body li > ol       {margin:8px 0 0 0;}

/*--------------------------- QUOTES ---------------------------*/

.lvd-blog-single-body blockquote            {margin:40px 0; padding-left:24px; border-left:2px solid var(--lvd-color-primary); font-size:var(--lvd-text-h5); line-height:1.5;}
.lvd-blog-single-body blockquote p          {margin-bottom:12px;}
.lvd-blog-single-body blockquote p:last-of-type {margin-bottom:0;}
.lvd-blog-single-body blockquote cite,
.lvd-blog-single-body blockquote .wp-block-quote__citation {display:block; margin-top:12px; font-size:var(--lvd-text-s1); font-style:normal; color:var(--lvd-color-gray-400);}

.lvd-blog-single-body .wp-block-pullquote   {margin:40px 0; padding:32px 0; border-top:2px solid var(--lvd-color-primary); border-bottom:2px solid var(--lvd-color-primary); text-align:center;}
.lvd-blog-single-body .wp-block-pullquote p {font-size:var(--lvd-text-h4); line-height:1.35; margin-bottom:0;}
.lvd-blog-single-body .wp-block-pullquote cite {display:block; margin-top:16px; font-size:var(--lvd-text-s1); font-style:normal; color:var(--lvd-color-gray-400);}

/*--------------------------- MEDIA ---------------------------*/

/* One radius variable across every media type, so the Customizer setting cannot
   apply to some blocks and miss others. */
.lvd-blog-single-body img,
.lvd-blog-single-body .wp-block-image img,
.lvd-blog-single-body .wp-block-video video,
.lvd-blog-single-body .wp-block-cover,
.lvd-blog-single-body .wp-block-embed iframe,
.lvd-blog-single-body .wp-block-gallery img     {border-radius:var(--lvd-body-radius);}

.lvd-blog-single-body figure                {margin:40px 0;}
.lvd-blog-single-body img                   {max-width:100%; height:auto; display:block;}
.lvd-blog-single-body figcaption,
.lvd-blog-single-body .wp-element-caption   {font-size:var(--lvd-text-s1); color:var(--lvd-color-gray-400); text-align:left; padding:4px 16px 0 16px; margin:0;}

.lvd-blog-single-body .wp-block-gallery     {margin:40px 0;}
.lvd-blog-single-body .wp-block-gallery figure {margin:0;}

/* Embeds — YouTube, Vimeo, X, anything with an iframe. aspect-ratio keeps them
   responsive without the padding-top hack, and reserves the box before the iframe
   loads, so nothing shifts. */
.lvd-blog-single-body .wp-block-embed       {margin:40px 0;}
.lvd-blog-single-body .wp-block-embed__wrapper  {position:relative;}
.lvd-blog-single-body .wp-block-embed.is-type-video .wp-block-embed__wrapper {aspect-ratio:16 / 9;}
.lvd-blog-single-body .wp-block-embed.is-type-video iframe  {position:absolute; inset:0; width:100%; height:100%; border:0;}
/* Non-video embeds (X, Instagram) size themselves — they only need to not overflow. */
.lvd-blog-single-body .wp-block-embed iframe    {max-width:100%;}

.lvd-blog-single-body .wp-block-video       {margin:40px 0;}
.lvd-blog-single-body .wp-block-video video {width:100%; height:auto; display:block;}
.lvd-blog-single-body .wp-block-audio       {margin:32px 0;}
.lvd-blog-single-body .wp-block-audio audio {width:100%;}

.lvd-blog-single-body .wp-block-cover       {margin:40px 0; overflow:hidden;}

/*--------------------------- ALIGNMENTS ---------------------------*/

/* The body is a narrow reading column, so "wide" and "full" widen out of it by a
   fixed amount rather than escaping to 100vw: the viewport trick overflows by the
   scrollbar width and produces horizontal scroll on desktop. */
.lvd-blog-single-body .alignwide,
.lvd-blog-single-body .alignfull    {margin-left:-60px; margin-right:-60px; width:auto; max-width:none;}
.lvd-blog-single-body .aligncenter  {margin-left:auto; margin-right:auto;}
.lvd-blog-single-body .alignleft    {float:left; margin:8px 32px 24px 0; max-width:50%;}
.lvd-blog-single-body .alignright   {float:right; margin:8px 0 24px 32px; max-width:50%;}

/*--------------------------- TABLE ---------------------------*/

.lvd-blog-single-body .wp-block-table       {margin:40px 0; overflow-x:auto;}
.lvd-blog-single-body table                 {width:100%; border-collapse:collapse; font-size:var(--lvd-text-s1);}
.lvd-blog-single-body th,
.lvd-blog-single-body td                    {padding:12px 16px; text-align:left; border-bottom:1px solid var(--lvd-color-gray-200);}
.lvd-blog-single-body th                    {font-weight:700; color:var(--lvd-color-black);}
.lvd-blog-single-body tbody tr:last-child td    {border-bottom:0;}

/*--------------------------- CODE ---------------------------*/

.lvd-blog-single-body code                  {padding:2px 6px; border-radius:4px; background:var(--lvd-color-gray-200); font-size:0.9em;}
.lvd-blog-single-body pre                   {margin:32px 0; padding:20px 24px; border-radius:var(--lvd-body-radius); background:var(--lvd-color-gray-200); overflow-x:auto; font-size:var(--lvd-text-s1); line-height:1.6;}
.lvd-blog-single-body pre code              {padding:0; background:transparent;}
.lvd-blog-single-body .wp-block-verse       {margin:32px 0; font-family:inherit; white-space:pre-wrap;}

/*--------------------------- STRUCTURE ---------------------------*/

.lvd-blog-single-body .wp-block-separator   {margin:40px auto; border:0; border-top:1px solid var(--lvd-color-gray-200); max-width:100%;}
.lvd-blog-single-body .wp-block-buttons     {margin:32px 0;}
.lvd-blog-single-body .wp-block-columns     {margin:32px 0; gap:32px;}
.lvd-blog-single-body .wp-block-group       {margin:32px 0;}
.lvd-blog-single-body .wp-block-media-text  {margin:40px 0;}
.lvd-blog-single-body .wp-block-media-text img  {border-radius:var(--lvd-body-radius);}
.lvd-blog-single-body .wp-block-details     {margin:32px 0;}
.lvd-blog-single-body .wp-block-details summary {font-weight:700; cursor:pointer;}
.lvd-blog-single-body .wp-block-footnotes   {margin-top:40px; font-size:var(--lvd-text-s1); color:var(--lvd-color-gray-400);}

/* The body's own edges are set by the article layout, so the first and last child
   never add their own — otherwise every article opened with a double gap. */
.lvd-blog-single-body > *:first-child   {margin-top:0;}
.lvd-blog-single-body > *:last-child    {margin-bottom:0;}


/* Bm */
@media (min-width:1px) and (max-width:767px)
{
.lvd-blog-single-body h2            {font-size:25px; margin-top:28px;}
.lvd-blog-single-body h3            {font-size:20px;}
.lvd-blog-single-body h4            {font-size:18px;}
.lvd-blog-single-body h5            {font-size:16px;}
.lvd-blog-single-body h6            {font-size:15px;}

.lvd-blog-single-body figure,
.lvd-blog-single-body .wp-block-embed,
.lvd-blog-single-body .wp-block-video,
.lvd-blog-single-body .wp-block-cover,
.lvd-blog-single-body .wp-block-gallery,
.lvd-blog-single-body blockquote    {margin-top:32px; margin-bottom:32px;}

/* No room to widen out of the column, and floats leave unreadable text slivers
   beside a half-width image. */
.lvd-blog-single-body .alignwide,
.lvd-blog-single-body .alignfull    {margin-left:0; margin-right:0;}
.lvd-blog-single-body .alignleft,
.lvd-blog-single-body .alignright   {float:none; margin-left:0; margin-right:0; max-width:100%;}

.lvd-blog-single-body .wp-block-columns {gap:24px;}
.lvd-blog-single-body figcaption,
.lvd-blog-single-body .wp-element-caption   {padding-left:8px; padding-right:8px;}
}


/* Bt */
@media (min-width:768px) and (max-width:1023px)
{
.lvd-blog-single-body .alignwide,
.lvd-blog-single-body .alignfull    {margin-left:-24px; margin-right:-24px;}
}
