/*
 * Single Blog post layout - ported from legacy style.css (confirmed live
 * against evolution.edu.au/how-to-get-your-rsa-certification-in-sydney-step-by-step-guide-2025/):
 * .back__course__page_grid.react-courses__single-page > .container > .row >
 * .col-lg-8 (.blog-single-inner: image + article) + .col-lg-4 (the same
 * .react-sidebar Popular Posts widget the blog archive page uses - its CSS
 * lives in forms-blocks.css, shared via a combined selector there rather
 * than duplicated here). Grid/container values match the same convention
 * used throughout this plugin (course-single.css, forms-blocks.css): no
 * Bootstrap, each block scopes its own .container/.row/.col-*.
 */
.evolution-blog-single .container {
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	max-width: 1140px;
	padding-left: 12px;
	padding-right: 12px;
	width: 100%;
}
@media (min-width: 1400px) {
	.evolution-blog-single .container {
		max-width: 1320px;
	}
}
.evolution-blog-single .row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -15px;
}
.evolution-blog-single .col-lg-8,
.evolution-blog-single .col-lg-4 {
	padding: 0 15px;
	box-sizing: border-box;
	width: 100%;
}
.evolution-blog-single .pb---40 {
	padding-bottom: 40px;
}
.evolution-blog-single .pt---110 {
	padding-top: 110px;
}
.evolution-blog-single .pb---70 {
	padding-bottom: 70px;
}
@media (min-width: 992px) {
	.evolution-blog-single .col-lg-8 {
		flex: 0 0 60%;
		max-width: 60%;
	}
	.evolution-blog-single .col-lg-4 {
		flex: 0 0 40%;
		max-width: 40%;
	}
	.evolution-blog-single .md-mt-60 {
		margin-top: 0;
	}
	/* Legacy's real ml----30 (course-single.css:55-57/72-74) applies this
	   30px gutter to the .react-sidebar wrapper INSIDE the column, not to
	   the column itself - putting it on .col-lg-4 directly (a flex item
	   whose flex-basis already sums to exactly 100% with .col-lg-8's
	   66.6667%) pushed the row's total width past 100%, and flex-wrap
	   wrapped the sidebar onto its own line below the article instead of
	   beside it (confirmed live: the sidebar rendered at the bottom of the
	   page instead of next to the content column). */
	.evolution-blog-single .react-sidebar {
		margin-left: 30px;
	}
}
@media (max-width: 991px) {
	.evolution-blog-single .md-mt-60 {
		margin-top: 60px;
	}
}

.evolution-blog-single .blog-image {
	margin-bottom: 42px;
}
.evolution-blog-single .blog-image img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}
.evolution-blog-single .blog-content {
	color: #3e3e51;
}
/* Legacy's sitewide base link rule (style.css: a { color:#2D2D73;
   text-decoration:none !important }, confirmed live) - post-content
   hyperlinks (source citations etc.) get no explicit styling of their own
   in the raw content, so they should just inherit that same color/no-
   underline treatment, matching legacy. This theme carries no equivalent
   sitewide `a` reset, so it's applied here directly. */
.evolution-blog-single .blog-content a {
	color: #2D2D73;
	text-decoration: none;
}
.evolution-blog-single .blog-content p {
	margin: 0 0 40px;
	line-height: 28px;
	font-size: 18px;
	font-weight: 400;
	color: #5B5F64;
}
/* h4/h5/h6 included alongside h2/h3: some posts' raw content uses <h5> for
   what is visually and editorially a main section heading (confirmed live
   on the "Navigating Australia's Visa Options in 2024" post - "Working
   Holiday Visa (Subclass 417)" etc. are literally <h5> tags), which this
   rule previously left completely unstyled at browser <h5> defaults. */
.evolution-blog-single .blog-content h2,
.evolution-blog-single .blog-content h3,
.evolution-blog-single .blog-content h4,
.evolution-blog-single .blog-content h5,
.evolution-blog-single .blog-content h6 {
	color: #1E1E1E;
	font-weight: 600;
	font-size: 34px;
	line-height: 43px;
	margin: 0 0 24px;
}
.evolution-blog-single .blog-content ul {
	margin-bottom: 40px;
}
.evolution-blog-single .blog-content ul li {
	margin: 0 0 12px;
	font-size: 16px;
	line-height: 24px;
	color: #5B5F64;
}
/* postid-375's steps list was rebuilt as an <ol> since it reads as
   sequential instructions, but the raw MSO markup it came from never had
   visible numbers (the list markers were blank, not "1." "2." etc.) -
   decimal numbering wasn't wanted, so suppressed while keeping the same
   item spacing/typography as this post's regular bulleted lists. */
.postid-375 .evolution-blog-single .blog-content ol {
	list-style: none;
	padding-left: 40px;
	margin-bottom: 40px;
}
.postid-375 .evolution-blog-single .blog-content ol > li {
	margin: 0 0 12px;
	font-size: 16px;
	line-height: 24px;
	color: #5B5F64;
}
/* Requested darker body text on this post - a step down from the shared
   #5B5F64 used sitewide for paragraphs/list items. */
.postid-375 .evolution-blog-single .blog-content p,
.postid-375 .evolution-blog-single .blog-content ul li,
.postid-375 .evolution-blog-single .blog-content ol > li {
	color: #3A3D42;
}
/* The nested sub-list under "Cooking Time and Steak Size Guide" is a <ul>
   inside an <ol> <li>, so it defaults to the browser's nested-list marker
   (a hollow "circle" outline) instead of the outer list's solid "disc" -
   that hollow outline reads as much lighter than the dark body text even
   though it already inherits the same color, so switched to a solid disc
   to actually look dark/bold like the outer bullets. */
.postid-375 .evolution-blog-single .blog-content ol ul {
	list-style-type: disc;
}
/* Inline content images (as opposed to the featured .blog-image at the
   top) had no spacing rule at all - text sat flush against them with no
   breathing room, unlike every other content element here which already
   carries its own margin-bottom. */
/* display:block + margin:0 auto: these are bare <img> tags with no
   wrapping element (confirmed live - no surrounding <p>/<div> at all in
   several posts' raw content), so they default to display:inline, sitting
   left-anchored in the text flow rather than centered like a normal
   content image. Explicit centering here is deliberate, not just a
   default carried over from block. */
.evolution-blog-single .blog-content img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto 40px;
}
/* No table styling existed at all - tables rendered with only whatever
   (often incomplete - inline border-width/color with no border-style,
   a Word-paste artifact) styling happened to be inline in the raw content,
   unlike legacy's consistently bordered/shaded tables. This applies
   regardless of what inline styles a given table does or doesn't carry. */
.evolution-blog-single .blog-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 40px;
}
.evolution-blog-single .blog-content th,
.evolution-blog-single .blog-content td {
	border: 1px solid #ddd;
	padding: 10px;
	text-align: left;
	font-size: 16px;
	line-height: 24px;
	color: #5B5F64;
}
.evolution-blog-single .blog-content th {
	background: #f5f5f5;
	color: #1E1E1E;
	font-weight: 600;
}
/* This post's legacy source (Elementor, post-3965.css, confirmed live) sets
   font-family:Arial and color:#333333 for its text widgets, distinct from
   the Montserrat/#5B5F64 confirmed correct for the more typical native-
   WordPress-block posts (e.g. the RSA-certification post this file is
   otherwise based on) - scoped to this one post so that one doesn't
   regress. */
.postid-378 .evolution-blog-single .blog-content {
	font-family: Arial, Helvetica, sans-serif;
}
.postid-378 .evolution-blog-single .blog-content p,
.postid-378 .evolution-blog-single .blog-content ul li,
.postid-378 .evolution-blog-single .blog-content th,
.postid-378 .evolution-blog-single .blog-content td {
	color: #333333;
}
/* Section-intro labels like "Work Streams and Stay Periods:" and
   "Eligibility Criteria:" are plain bold <p> tags (not real headings), so
   they were still getting the shared 40px paragraph margin - excessive
   given how tightly headings/images are already spaced on this post. */
.postid-378 .evolution-blog-single .blog-content p {
	margin: 0 0 16px;
}
/* This post's headings are sub-section labels within one long article,
   not page-level titles - the shared 34px/43px h2-h6 size (tuned for the
   more typical case of one or two real section headings per post) read
   as oversized/heavy-handed for how many of these there are here in a
   row. Smaller and tighter, still clearly distinct from body text. */
.postid-378 .evolution-blog-single .blog-content h2,
.postid-378 .evolution-blog-single .blog-content h3,
.postid-378 .evolution-blog-single .blog-content h4,
.postid-378 .evolution-blog-single .blog-content h6 {
	font-size: 22px;
	line-height: 28px;
	margin: 0 0 14px;
}
/* The 5 visa-type <h5> labels ("Student Visa (Subclass 500)" etc.) were
   asked to match the plain bold-paragraph style already used for
   "Work Streams and Stay Periods:" (a <p><b> - same font-size/color/
   weight/margin as this post's regular body text, bolded only via the
   inner <b>/<strong>, not via heading-level styling). */
.postid-378 .evolution-blog-single .blog-content h5 {
	color: #333333;
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
	margin: 0 0 16px;
}
/* This post's inline images sit directly between a table/list and the
   next heading with no other spacing of their own - the shared 40px
   bottom margin (tuned for the more typical case of an image followed by
   body paragraph text) reads as excessive here given how tightly this
   post's headings are already spaced (14px). */
.postid-378 .evolution-blog-single .blog-content img {
	margin-bottom: 16px;
}
.postid-378 .evolution-blog-single .blog-content ul,
.postid-378 .evolution-blog-single .blog-content table {
	margin-bottom: 16px;
}
/* CTA buttons ("Book A FREE Consultation" / "Evolution's Digital Handbook")
   are bare <a> tags in the raw content with an evo-cta-button class added
   to them, styled here to match legacy's Elementor button widget on this
   post (post-3965.css, confirmed live: #6B5CF6 background, 8px radius) -
   not scoped to .postid-378 so any other post can reuse the same class. */
.evolution-blog-single .blog-content a.evo-cta-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 16px;
	padding: 14px 40px;
	border-radius: 8px;
	background-color: #6B5CF6;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	line-height: normal;
	text-align: center;
	text-decoration: none;
}
/* The paragraph wrapping these buttons inherits the shared postid-378
   `p { margin: 0 0 16px }` rule (top explicitly 0), so there was no
   breathing room between the preceding body paragraph and the button
   block - added only above the first button, not between the two
   stacked buttons themselves. */
.evolution-blog-single .blog-content a.evo-cta-button:first-of-type {
	margin-top: 24px;
}
.evolution-blog-single .blog-content a.evo-cta-button:hover {
	background-color: #5a4de0;
	color: #fff;
}
/* This post's raw content opens with a leftover Elementor <h1><a> wrapping
   its own title as a link out to nsw.gov.au - with no h1 rule anywhere in
   this file it rendered at the browser's huge default h1 size, far bigger
   than the shared 18px body-paragraph text. Shrunk below body-text size
   as requested. */
.postid-376 .evolution-blog-single .blog-content h1 {
	font-size: 14px;
	line-height: 20px;
	margin: 0 0 16px;
}
/* This post's 3 landmark-name sub-headings ("Sydney Opera House" etc.)
   were plain <p> tags (converted to <h3> here) rendering at the same
   18px as body text - tripled from that 18px baseline as requested,
   overriding the shared 34px h2-h6 size used elsewhere. Body text darkened
   to match the treatment already applied to the sous-vide post (375). */
.postid-372 .evolution-blog-single .blog-content h3 {
	font-size: 40px;
	font-weight: 400;
	line-height: 50px;
	margin: 0 0 24px;
}
.postid-372 .evolution-blog-single .blog-content p {
	color: #3A3D42;
}
/* Image captions ("Study anytime and anywhere." etc.) were <h2> tags,
   rendering as giant bold section headings instead of small italic
   captions sitting close under their image - confirmed live against
   evolution.edu.au/mastering-kitchen-management-down-under-the-digital-
   advantage/, which shows these centered, small, italic and muted grey
   directly beneath each image. Converted to <p class="evo-image-caption">
   in the raw content; not scoped to one post so any post can reuse it. */
.postid-377 .evolution-blog-single .blog-content img {
	margin-bottom: 8px;
}
/* Requested darker body text on this post - same treatment already
   applied to the sous-vide (375) and dive-into-culture (372) posts. */
.postid-377 .evolution-blog-single .blog-content p:not(.evo-image-caption) {
	color: #3A3D42;
}
.evolution-blog-single .blog-content p.evo-image-caption {
	margin: 0 0 32px;
	font-size: 15px;
	font-style: italic;
	text-align: center;
	color: #8A8F98;
}
/* This post's 8 bulleted sections were rebuilt from fake Word-paste
   mso-list markup into real <ul><li>, which fixes the indent/spacing the
   user asked about via the shared list rules above - darkened text to
   match the treatment already applied elsewhere. */
.postid-374 .evolution-blog-single .blog-content p,
.postid-374 .evolution-blog-single .blog-content ul li {
	color: #3A3D42;
}
/* The 8 section-label + bullet-list groups sat flush with the intro
   paragraph above - wrapped in <div class="evo-indent-block"> in the raw
   content so this whole section (labels included) could be indented as
   one block, distinct from the surrounding paragraphs before/after it. */
.postid-374 .evolution-blog-single .blog-content .evo-indent-block {
	padding-left: 24px;
}
/* This post's 8 New Year's greetings were fake Word-paste mso-list <p>
   tags where the bullet was immediately followed by a literal newline
   (wpautop turned it into a <br>), so each item rendered as "bullet" on
   its own line and the text on the next - rebuilt into a real <ul><li>.
   Indented per request, and darkened text to match other posts. */
.postid-371 .evolution-blog-single .blog-content ul {
	padding-left: 24px;
}
.postid-371 .evolution-blog-single .blog-content p,
.postid-371 .evolution-blog-single .blog-content ul li {
	color: #3A3D42;
}
/* This post's 4 section headings ("A Global Classroom in Sydney" etc.)
   had a literal newline inside their <b> wrapper (wpautop turned it into
   a <br>, forcing 2 lines) plus the shared 34px/bold h2 style, wrapping
   further - stripped the newline/<b> from the content and shrunk here so
   each one fits on a single line. */
.postid-371 .evolution-blog-single .blog-content h2,
.postid-371 .evolution-blog-single .blog-content h3 {
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
}
/* Same paragraph/text/heading treatment as the New Year's Greetings post
   (371) applied here: same artifacts (inline-styled <p>/<h3> tags with
   embedded mid-sentence newlines wpautop turned into unwanted <br>s,
   overriding this stylesheet's margin/line-height via inline precedence)
   were found and fixed in this post's raw content too. */
.postid-370 .evolution-blog-single .blog-content p {
	color: #3A3D42;
}
.postid-370 .evolution-blog-single .blog-content h3 {
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
}
/* This post's 3 body paragraphs each carried their own individual
   gradient background, rendering as 3 separate boxed paragraphs instead
   of one continuous shared box like the legacy page (confirmed live
   against evolution.edu.au's version of this post) - moved the gradient
   onto a single wrapping <div class="evo-shared-bg"> in the raw content
   and stripped it from the individual paragraphs. */
.postid-347 .evolution-blog-single .blog-content .evo-shared-bg {
	background: linear-gradient(141deg, rgb(238, 238, 238) 86%, rgb(169, 184, 195) 93%);
	padding: 1.25em 2.375em;
	margin-bottom: 40px;
}
.postid-347 .evolution-blog-single .blog-content .evo-shared-bg p {
	margin-bottom: 20px;
}
.postid-347 .evolution-blog-single .blog-content .evo-shared-bg p:last-child {
	margin-bottom: 0;
}
.postid-347 .evolution-blog-single .blog-content .evo-shared-bg p {
	color: #3A3D42;
}
/* "A Sweet Victory: Experiencing the Thrill of Winning!" is the post's
   title paragraph, using WP core's has-medium-font-size preset (20px) -
   sized up a bit per request. */
.postid-347 .evolution-blog-single .blog-content .has-medium-font-size {
	font-size: 24px;
}
/* This post's image caption ("Mr. Stuart Page...") started as a
   <figcaption class="wp-element-caption"> but is now a standalone <p>
   with that same class (the photo it described was removed, caption kept
   as its own line) - target the class itself so this still applies
   regardless of the element it lands on. Left-aligned and sized up per
   request, overriding WP core's default centered/small caption style.
   Body text darkened to match the treatment already applied elsewhere. */
.postid-346 .evolution-blog-single .blog-content .wp-element-caption {
	text-align: left;
	font-size: 16px;
}
.postid-346 .evolution-blog-single .blog-content p {
	color: #3A3D42;
}
/* This post's 2 paragraphs both carry has-background (white, so
   effectively invisible against the page), and WP core's own
   :where(p.has-background) rule already adds 1.25em top+bottom padding
   to each - combined with this stylesheet's shared 40px paragraph
   margin, that stacked up to a large blank gap between them. Removing
   the margin here leaves just the core padding as spacing. */
.postid-345 .evolution-blog-single .blog-content p {
	margin-bottom: 0;
}
/* Same issue as post 345 (Paid to Learn): all 3 paragraphs here carry
   has-background (white), so WP core's own padding plus this
   stylesheet's shared 40px margin stacked into a large blank gap. */
.postid-344 .evolution-blog-single .blog-content p {
	margin-bottom: 0;
}