/* Miles and Points Guru - reading experience. Added 2026-07-25.

   Measured problems this fixes, taken from the live CSS:
     body        14px / 21px Verdana      too small for long-form reading
     text colour #000000 pure black       harsh; 21:1 contrast is not a virtue
     link colour #4db2ec on white         2.36:1, fails WCAG AA (needs 4.5:1)
     headings    line-height 1 in places  display type needs tight, not zero

   Deliberately scoped to article content. Global body font-size is NOT touched:
   the Newspaper theme sizes its header, nav, sidebar and widgets off that value,
   and raising it would break the chrome.

   Typefaces are unchanged (Montserrat, already loaded via the Elementor global
   kit). This pass is size, leading, measure and colour only. */


/* 1. Article body ------------------------------------------------------- */

.td-post-content,
.td-post-content p,
.td-post-content li,
.tdb_single_content,
.tdb_single_content p,
.tdb_single_content li {
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	line-height: 1.65;
	color: #2b3033;
}

.td-post-content p,
.tdb_single_content p {
	margin: 0 0 1.35em;
}

/* Measure. At 740px an 18px line runs to roughly 78 characters, past the
   comfortable 60-75 band. Cap text elements only so images, tables and
   embeds keep the full column width. */
.td-post-content > p,
.td-post-content > ul,
.td-post-content > ol,
.td-post-content > blockquote,
.tdb_single_content > p,
.tdb_single_content > ul,
.tdb_single_content > ol,
.tdb_single_content > blockquote {
	max-width: 68ch;
}


/* 2. Lists -------------------------------------------------------------- */

.td-post-content ul,
.td-post-content ol,
.tdb_single_content ul,
.tdb_single_content ol {
	margin: 0 0 1.35em;
	padding-left: 1.5em;
}

.td-post-content li,
.tdb_single_content li {
	margin-bottom: 0.5em;
}

.td-post-content li > ul,
.td-post-content li > ol,
.tdb_single_content li > ul,
.tdb_single_content li > ol {
	margin: 0.5em 0 0.5em;
}


/* 3. Headings within articles ------------------------------------------
   Big type needs less leading, not more. The theme leaves some heading
   line-heights at 1, which clips descenders; 1.15-1.25 is the working band. */

.td-post-content h2,
.tdb_single_content h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 27px;
	line-height: 1.2;
	font-weight: 700;
	color: #14171a;
	letter-spacing: -0.01em;
	margin: 2em 0 0.6em;
}

.td-post-content h3,
.tdb_single_content h3 {
	font-family: 'Montserrat', sans-serif;
	font-size: 21px;
	line-height: 1.25;
	font-weight: 600;
	color: #14171a;
	margin: 1.6em 0 0.5em;
}

.td-post-content h4,
.tdb_single_content h4 {
	font-size: 19px;
	line-height: 1.3;
	font-weight: 600;
	color: #14171a;
	margin: 1.4em 0 0.4em;
}

/* A heading straight after another heading should not carry a full gap. */
.td-post-content h2 + h3,
.tdb_single_content h2 + h3 {
	margin-top: 0.8em;
}


/* 4. Links --------------------------------------------------------------
   The theme blue (#4db2ec) measures 2.36:1 against white. That is not
   readable body-link contrast. #1b7bb0 is the same blue family at 4.66:1,
   which clears WCAG AA. */

.td-post-content a,
.tdb_single_content a {
	color: #1b7bb0;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	text-decoration-thickness: 1px;
	text-decoration-color: rgba(27, 123, 176, 0.4);
	transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.td-post-content a:hover,
.tdb_single_content a:hover {
	color: #12557a;
	text-decoration-color: #12557a;
}

/* Do not underline links that wrap an image. */
.td-post-content a:has(img),
.tdb_single_content a:has(img) {
	text-decoration: none;
}


/* 5. Emphasis, quotes, tables ------------------------------------------- */

.td-post-content strong,
.tdb_single_content strong {
	font-weight: 600;
	color: #14171a;
}

.td-post-content blockquote,
.tdb_single_content blockquote {
	border-left: 3px solid #1b7bb0;
	padding: 0.2em 0 0.2em 1.2em;
	margin: 1.8em 0;
	font-style: normal;
	color: #40474b;
}

/* Award charts and rate tables carry a lot of this site's value.
   Tabular figures keep the digit columns aligned. */
.td-post-content table,
.tdb_single_content table {
	font-size: 17px;
	line-height: 1.5;
	font-variant-numeric: tabular-nums;
	border-collapse: collapse;
	width: 100%;
	margin: 1.6em 0;
}

.td-post-content th,
.td-post-content td,
.tdb_single_content th,
.tdb_single_content td {
	padding: 0.6em 0.8em;
	border-bottom: 1px solid #e4e7e9;
	text-align: left;
}

.td-post-content th,
.tdb_single_content th {
	font-weight: 600;
	color: #14171a;
	border-bottom-width: 2px;
}


/* 6. Horizontal rules ---------------------------------------------------
   The bank posts use <hr /> as a section divider, so give it real breathing
   room rather than the browser default. */

.td-post-content hr,
.tdb_single_content hr {
	border: 0;
	border-top: 1px solid #e4e7e9;
	margin: 2.4em 0;
	max-width: 68ch;
}


/* 7. Images -------------------------------------------------------------
   Prevent layout shift and let figures breathe. */

.td-post-content img,
.tdb_single_content img {
	height: auto;
	max-width: 100%;
}

.td-post-content figure,
.tdb_single_content figure {
	margin: 1.8em 0;
}

.td-post-content figcaption,
.tdb_single_content figcaption {
	font-size: 15px;
	line-height: 1.5;
	color: #6b7378;
	margin-top: 0.6em;
}


/* 8. Mobile -------------------------------------------------------------
   Slightly smaller body, and the measure cap is irrelevant on a narrow
   screen so it is released. */

@media (max-width: 767px) {

	.td-post-content,
	.td-post-content p,
	.td-post-content li,
	.tdb_single_content,
	.tdb_single_content p,
	.tdb_single_content li {
		font-size: 17px;
		line-height: 1.6;
	}

	.td-post-content > p,
	.td-post-content > ul,
	.td-post-content > ol,
	.td-post-content > blockquote,
	.tdb_single_content > p,
	.tdb_single_content > ul,
	.tdb_single_content > ol,
	.tdb_single_content > blockquote {
		max-width: none;
	}

	.td-post-content h2,
	.tdb_single_content h2 {
		font-size: 23px;
	}

	.td-post-content h3,
	.tdb_single_content h3 {
		font-size: 19px;
	}

	.td-post-content table,
	.tdb_single_content table {
		display: block;
		overflow-x: auto;
		white-space: nowrap;
	}
}
