/* Campaign LP adjustments — client feedback via Guy, 2026-08-11.
 *
 * Kept in a separate file loaded AFTER lp-legacy.css so that stylesheet stays a
 * verbatim copy of the old theme's, and every intentional departure from the
 * restored design is visible in one place.
 *
 * Asked for:
 *   mobile  — larger logos; model name at the top of the image, not the bottom
 *   desktop — Bentley mark is squashed, Orchid mark is too small
 *   desktop — title slightly smaller and not bold
 *   both    — a line under the model name
 */

/* ---------- Logos: stop forcing both dimensions ----------
   The old rules pinned width AND height, so the marks rendered off their true
   proportions: the Bentley mark measured 100x78 (ratio 1.28) against a natural
   1.78 — 28% horizontally compressed — and Orchid 115x52 against 2.51. Setting
   height back to auto is what actually un-squashes them; the size bumps below
   are the separate, requested change. */

.HeaderLp img,
.BottomLogoBanner img {
	height: auto !important;
}

/* `.HeaderLp` is a flexbox, and flex items stretch on the cross axis by
   default — so the shorter Orchid mark was being pulled to the height of the
   taller Bentley one and distorted regardless of `height: auto`. Top-align the
   row and each mark keeps its own proportions. */
.HeaderLp {
	align-items: flex-start;
}

/* Desktop */
@media (min-width: 768px) {
	.page-template-newLpBentley .HeaderLp img {
		width: auto !important;
		max-width: 160px !important;
	}
	.page-template-newLpBentley .HeaderLp img.orchidLogoPc {
		max-width: 150px !important;
		margin-top: 6px;
	}
}

/* Mobile — both marks were rendering small: 65x37 and 55x22. */
@media (max-width: 767.98px) {
	.page-template-newLpBentley .HeaderLp img.Blogo {
		width: 110px !important;
		max-width: 110px !important;
	}
	.page-template-newLpBentley .BottomLogoBanner img.OSCLogo {
		width: 95px !important;
		max-width: 95px !important;
	}
}

/* ---------- Title ----------
   Desktop was 55px/700. Slightly smaller and regular weight, as asked. The
   family stays the old theme's BentleyLight. */
.page-template-newLpBentley .BannerText h1,
.page-template-newLpBentley .MobileTextTop h1 {
	font-weight: 400;
}
.page-template-newLpBentley .BannerText h1 {
	font-size: 44px;
}

/* Model name above the image rather than sitting at its foot. The old rule set
   `top: auto; bottom: 45px` — this puts it back to the top edge. */
@media (max-width: 767.98px) {
	.page-template-newLpBentley .MobileTextTop {
		top: 18px !important;
		bottom: auto !important;
	}
	.page-template-newLpBentley .MobileTextTop h1 {
		font-size: 20px;
	}
}

/* ---------- Sub-heading under the model name ----------
   Uses `.SmallerText`, which is the old design's own mechanism for a second
   line (it carried the Mulliner campaign's strapline). Sized in `em` so it
   tracks the title at every breakpoint instead of needing its own ladder.
   Renders nothing until the Sub-heading field on the page is filled in. */
.page-template-newLpBentley .BannerText h1 span.SmallerText,
.page-template-newLpBentley .MobileTextTop h1 span.SmallerText {
	display: block;
	font-size: 0.52em;
	font-weight: 400;
	line-height: 1.3;
	margin-top: 0.35em;
	letter-spacing: 0.02em;
	text-transform: none;
}