/* =============================================================================
 * 40-content.css -- prose inside the sheet.
 *
 * BYTE-IDENTICAL across both sites.
 *
 * This file is what repairs GlobeFreight's 17 classic pages -- FAQs, Glossary,
 * ICExpress T&Cs (27,217 B), Our Mission, and all four core service pages (Air
 * Freight, Sea Freight, Road Freight, Clearing & Forwarding). They are plain
 * post_content: headings, paragraphs and lists, currently rendering through
 * TwentyTwentyFour's block templates, which is precisely why they look broken.
 *
 * They render through _shared/php/compat-astra.php's fallback loop into
 * .qt-entry__content. Every rule here is scoped to that container -- never to
 * a bare element -- so Elementor page content and plugin markup are untouched.
 *
 * Provenance for the values: 10-reset.css already carries the measured base
 * typography (AT 16px/26.4px #334155; GF 15px/1.5625 #333333) and the measured
 * heading scale. This file adds only RHYTHM and the container-scoped
 * exceptions, so there is exactly one home per fact.
 * ========================================================================== */

/* ---- entry shell --------------------------------------------------------- */
.qt-main {
	padding-block: var(--qt-space-5);
}

.qt-entry {
	margin-block-end: var(--qt-space-5);
}

.qt-entry:last-child {
	margin-block-end: 0;
}

/* MEASURED AT (post-158, the one classic post with a real title):
 *   h1.entry-title 32px / 38.4px / 600 #1E293B, margin 0 0 19.2px,
 *   inside a WHITE article -- 14.63:1. */
.qt-entry__title {
	font-size: var(--qt-fs-h1);
	font-family: var(--qt-font-heading);
	font-weight: var(--qt-fw-heading);
	line-height: var(--qt-lh-h1);
	letter-spacing: var(--qt-ls-heading);
	color: var(--qt-ink-heading);
	margin-block: 0 var(--qt-space-3);
}

.qt-entry__title a {
	color: inherit;
	text-decoration: none;
}

.qt-entry__title a:hover,
.qt-entry__title a:focus {
	text-decoration: underline;
}

/* ---- prose ---------------------------------------------------------------
 * Scoped. Not `p`, not `ul`.
 *
 * NO max-width here, deliberately. Neither harvest measures a measure-inside-
 * the-measure: AT's classic post body renders at the full 630px content column
 * and GF's #inner is width:100%. Inventing a reading measure would change the
 * live AutoTransport look and break the empty-diff pass condition. If the
 * owner later wants one, it is a design decision with one home: this rule. */
.qt-entry__content {
	font-size: var(--qt-fs-base);
	line-height: var(--qt-lh-body);
	color: var(--qt-ink);
}

/* MEASURED heading rhythm.
 *   AT  h2 30px/39px margin 45px 0 19px;  h3 24px/31.2px margin 0 0 20px
 *   GF  every heading margin 0 0 10px, line-height 1.25; h2 30, h3 24, h4 20 */
.qt-entry__content h2 {
	margin-block: var(--qt-space-5) var(--qt-space-2);
}

.qt-entry__content h3 {
	margin-block: var(--qt-space-4) var(--qt-space-2);
}

.qt-entry__content h4 {
	margin-block: var(--qt-space-3) var(--qt-space-2);
}

/* MEASURED: AT p margin-bottom 25.6px; GF .entry-content p margin 0 0 25px. */
.qt-entry__content p {
	margin-block: 0 var(--qt-space-4);
}

.qt-entry__content ul,
.qt-entry__content ol {
	margin-block: 0 var(--qt-space-4);
	padding-inline-start: calc(var(--qt-gutter) * 1.5);
}

.qt-entry__content li {
	margin-block-end: var(--qt-space-1);
	line-height: var(--qt-lh-body);
}

/* :not() EXCLUDES buttons rather than out-specifying them. A button placed in
 * content is not a link and must not take link colour -- MEASURED on the payment
 * page, where `.qt-entry__content a` (0,2,0) beat `.qt-btn--cta` (0,1,0) and
 * painted the CTA #5397B4 on #C2431C = 1.57:1, far worse than the 3.39 it was
 * meant to avoid. Winning by specificity here would just start an arms race the
 * next component loses; excluding by shape ends it. */
.qt-entry__content a:not([class*="qt-btn"]) {
	color: var(--qt-link);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.qt-entry__content a:not([class*="qt-btn"]):hover,
.qt-entry__content a:not([class*="qt-btn"]):focus {
	color: var(--qt-link-hover);
}

.qt-entry__content blockquote {
	border-inline-start: 3px solid var(--qt-rule);
	margin-inline: 0;
	padding: var(--qt-space-2) var(--qt-gutter);
	font-style: italic;
	color: var(--qt-ink-muted);
}

.qt-entry__content img,
.qt-entry__content figure {
	margin-block: var(--qt-space-4);
	border-radius: var(--qt-radius);
}

/* The ICExpress T&Cs page is 27,217 bytes of dense prose and the Glossary is
 * 4,416 -- both are long-form and both are where line-length and line-height
 * actually matter. Re-check against one of them, not against Our Mission
 * (945 B), if the rhythm above is ever changed. */

/* ---- tables --------------------------------------------------------------
 * Scoped, and horizontally scrollable so a wide table never forces the PAGE to
 * scroll sideways. The 0px-overflow gate at 390 is measured on the document,
 * and a table is the usual culprit.
 *
 * `table` is styled ONLY under .qt-entry__content -- never bare. Gravity Forms
 * 1.8.18 and Forminator both render tables in their own markup. */
.qt-entry__content table {
	display: block;
	overflow-x: auto;
	max-width: 100%;
	width: 100%;
	border-collapse: collapse;
	font-size: var(--qt-fs-small);
	margin-block: 0 var(--qt-space-4);
}

.qt-entry__content th,
.qt-entry__content td {
	padding: var(--qt-space-1) var(--qt-space-2);
	border: var(--qt-border-w) solid var(--qt-rule);
	text-align: start;
	vertical-align: top;
}

.qt-entry__content th {
	font-weight: var(--qt-fw-heading);
	color: var(--qt-ink-heading);
}

/* ---- archive / search ---------------------------------------------------- */
.qt-archive__header {
	margin-block-end: var(--qt-space-5);
}

.qt-archive__title {
	font-size: var(--qt-fs-h1);
	font-family: var(--qt-font-heading);
	font-weight: var(--qt-fw-heading);
	line-height: var(--qt-lh-h1);
	color: var(--qt-ink-heading);
	margin-block: 0 var(--qt-space-2);
}

.qt-entry__excerpt {
	color: var(--qt-ink);
	margin-block-end: var(--qt-space-3);
}

.qt-entry__pagelinks {
	margin-block: var(--qt-space-3);
}

/* Targets >= 24x24 measured with the label. */
.qt-pagination a,
.qt-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding-inline: var(--qt-space-2);
	border: var(--qt-border-w) solid var(--qt-rule);
	border-radius: var(--qt-radius);
	text-decoration: none;
	color: var(--qt-link);
}

.qt-pagination .page-numbers.current {
	background-color: var(--qt-accent);
	border-color: var(--qt-accent);
	color: var(--qt-accent-contrast);
}

/* ---- 404 -----------------------------------------------------------------
 * One of AutoTransport's five previously unreachable non-Elementor surfaces.
 * It now gets chrome for free; this gives it real content styling too. */
.qt-entry--404,
.qt-entry--empty {
	padding-block: var(--qt-space-5);
	text-align: center;
}

.qt-entry--404 .qt-searchform,
.qt-entry--empty .qt-searchform {
	justify-content: center;
	max-width: 30rem;
	margin-inline: auto;
}
