/* ============================================================
   Content normalization — force legacy post/page HTML (old inline-styled
   tables, fixed widths, old colours) to conform to the new design system.
   Loaded on all singular content. First pass — extend as the sweep finds more.
   ============================================================ */

/* --- Tables: make every content table look like the design's .spec --- */
.prose table{
  width:100% !important; border-collapse:collapse; border:1px solid var(--line);
  border-radius:12px; overflow:hidden; margin:20px 0; font-size:14.5px; display:table;
}
.prose table td, .prose table th{
  text-align:left; padding:12px 15px; border-bottom:1px solid var(--line);
  vertical-align:top; line-height:1.5;
}
.prose table tr:last-child td{border-bottom:none}
.prose table tbody tr:nth-child(even){background:var(--paper)}
.prose table td:first-child{font-family:var(--display);font-weight:700;color:var(--green-800)}

/* Header bar: design .cmp/.spec.win look. LT content tables put column
   headers in the first row (often as <td>, not <th>/<thead>). Style a real
   <thead>/<th> when present, else fall back to the first row. */
.prose table thead th, .prose table thead td,
.prose table:not(:has(thead)) tr:first-child td,
.prose table:not(:has(thead)) tr:first-child th{
  background:var(--green-900); color:#fff;
  font-family:var(--display); font-weight:800; font-size:11.5px;
  letter-spacing:.06em; text-transform:uppercase; vertical-align:middle;
}
.prose table thead th *, .prose table thead td *,
.prose table:not(:has(thead)) tr:first-child td *,
.prose table:not(:has(thead)) tr:first-child th *{color:#fff !important}
/* header's first cell must win over the bold-green first-column rule */
.prose table thead tr:first-child td:first-child,
.prose table:not(:has(thead)) tr:first-child td:first-child{color:#fff}
/* the now-styled header row shouldn't also get zebra shading */
.prose table:not(:has(thead)) tr:first-child{background:var(--green-900) !important}

/* legacy blue header cells (#193dcd) → design green header */
.prose td[style*="193dcd" i], .prose th[style*="193dcd" i], .prose tr[style*="193dcd" i] td,
.prose td[bgcolor], .prose th[bgcolor]{
  background:var(--green-900) !important; color:#fff !important;
}
.prose td[style*="193dcd" i] *, .prose th[style*="193dcd" i] *,
.prose td[bgcolor] *, .prose th[bgcolor] *{ color:#fff !important; }

/* --- Width / overflow hygiene: nothing breaks the content column --- */
.prose [style*="width"]{ max-width:100% !important; }
.prose table[width]{ width:100% !important; }
.prose img, .prose video{ max-width:100%; height:auto; }
/* --- Video embeds: force a real 16:9 box (oEmbed iframes keep a small height attr → wide+short "leaderboard"). --- */
.prose iframe{ width:100%; }
.prose iframe[src*="youtube"], .prose iframe[src*="youtube-nocookie"], .prose iframe[src*="youtu.be"],
.prose iframe[src*="vimeo"], .prose iframe[src*="dailymotion"], .prose iframe[src*="player.twitch"]{
	aspect-ratio:16/9; height:auto; border:0; border-radius:14px; display:block; margin:28px 0;
}
/* WP block embeds (figure.wp-block-embed) + classic [embed] wrapper */
.prose .wp-block-embed__wrapper, .prose .wp-embed-aspect-16-9 .wp-block-embed__wrapper{ position:relative; aspect-ratio:16/9; }
.prose .wp-block-embed__wrapper iframe{ position:absolute; inset:0; width:100%; height:100%; border-radius:14px; }
.prose .wp-block-embed{ margin:28px 0; }

/* --- Images: match the design's editorial figure treatment --- */
/* Standalone block images (incl. legacy wp-image-* / size-full) → rounded, centred, breathing room */
.prose img{ border-radius:12px; height:auto; }
.prose > p > img, .prose > img, .prose p img.size-full, .prose img.size-large,
.prose img.alignnone, .prose img.aligncenter{ display:block; margin:22px auto; }
/* link-wrapped images must not draw the prose link underline */
.prose a:has(> img), .prose a:has(img){ border-bottom:none !important; display:block; }
/* WP alignment classes */
.prose .aligncenter{ display:block; margin:22px auto; }
.prose .alignnone{ display:block; margin:22px 0; }
.prose .alignleft{ float:left; margin:6px 24px 14px 0; max-width:48%; }
.prose .alignright{ float:right; margin:6px 0 14px 24px; max-width:48%; }
/* figures + captions */
.prose figure{ margin:22px 0; }
.prose figure img{ border-radius:12px; display:block; }
.prose .wp-caption{ max-width:100% !important; }
.prose figcaption, .prose .wp-caption-text{
  font-size:12.5px; color:var(--muted); margin-top:8px; font-style:italic; line-height:1.5; text-align:left;
}
@media(max-width:680px){ .prose .alignleft, .prose .alignright{ float:none; max-width:100%; margin:18px 0; } }

/* --- Kill legacy font/colour inline cruft so the design typography wins --- */
.prose font, .prose [face], .prose [color]{ font-family:inherit !important; }
.prose [style*="font-family"]{ font-family:inherit !important; }

/* horizontal scroll on small screens instead of breaking layout */
@media(max-width:680px){ .prose table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; } }

/* Prose lists — were unstyled (browser default). Design-system bulleted/numbered lists. */
.prose ul,.prose ol{margin:0 0 20px;padding-left:1.5em}
.prose li{margin:0 0 9px;line-height:1.62}
.prose li::marker{color:var(--green-600)}
.prose ul ul,.prose ol ol,.prose ul ol,.prose ol ul{margin:9px 0 0}
.prose li>p{margin:0 0 8px}

/* Align prose heading measure to body (generic prose). */
.prose h2, .prose h3, .prose h4{max-width:43rem}
