/*
 * Life Math Money theme styles.
 *
 * theme.json holds the colours, fonts and link colours; this file does the layout pieces blocks
 * have no setting for. Sizes are copied from the Elementor site as rendered on 24 Oct 2026
 * (block-theme/baseline/tokens.json). Breakpoints match Elementor's: phones up to 767px,
 * tablets up to 1024px.
 *
 * Class names never contain "ad": ad blockers hide elements with those names.
 */

:root {
	--lmm-red: var(--wp--preset--color--red);
	--lmm-gold: var(--wp--preset--color--gold);
	--lmm-dark: var(--wp--preset--color--dark);
	--lmm-border: var(--wp--preset--color--border);
	--lmm-montserrat: var(--wp--preset--font-family--montserrat);
	--lmm-roboto: var(--wp--preset--font-family--roboto);
}

body {
	-webkit-font-smoothing: antialiased;
}

/* ---------- Hello Elementor's base styles ----------
   Rules copied from Hello or Elementor keep the weight (specificity) they had there, so that WordPress's and the
   plugins' rules still win or lose against them as on live; tools/style_audit.py compares the result. */

/* ----------
   The old site loaded Hello Elementor's reset on every page: border-box sizing everywhere, and table, label and
   form styles that the plugins inside posts and comments (polls, tables of contents, Posts Table Pro, wpDiscuz,
   MailOptin) were drawn against. Copied from its reset.css 3.5.1; the form and table rules are kept to posts and
   comments, where those plugins are. Comments also kept Hello's system font. */

*,
::before,
::after {
	box-sizing: border-box;
}

/* Hello's element defaults (zero specificity, so every other rule still wins over them). Hello made <hr>
   content-box, but Elementor's `.elementor *` rule turned everything on the page back to border-box. */
:where(hr) {
	height: 0;
	overflow: visible;
}

:where(pre) {
	font-family: monospace;
	font-size: 1em;
	white-space: pre-wrap;
}

:where(abbr[title]) {
	border-block-end: none;
	text-decoration: underline dotted;
}

:where(b, strong) {
	font-weight: bolder;
}

:where(code, kbd, samp) {
	font-family: monospace;
	font-size: 1em;
}

:where(small) {
	font-size: 80%;
}

:where(sub, sup) {
	position: relative;
	font-size: 75%;
	line-height: 0;
	vertical-align: baseline;
}

:where(sub) {
	bottom: -0.25em;
}

:where(sup) {
	top: -0.5em;
}

:where(img) {
	height: auto;
	max-width: 100%;
	border-style: none;
}

/* Keyboard focus: a black outline with a white halo */
[tabindex]:not([tabindex="-1"]):focus-visible,
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	box-shadow: 0 0 0 4px #fff;
	outline: 2px solid #000;
	outline-offset: 2px;
}

/* Elementor took the halo off links (the skip link, outside Elementor, kept it); search fields fade it in */
a:focus-visible {
	box-shadow: none;
}

a.skip-link:focus-visible {
	box-shadow: 0 0 0 4px #fff;
	color: #333;
}

.wp-block-search__input {
	transition: all 0.3s;
}

[tabindex]:not([tabindex="-1"]):focus:not(:focus-visible),
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) {
	box-shadow: none;
	outline: none;
}

#comments,
#wpd-bubble-wrapper {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

:where(#comments) p {
	margin-block: 0 0.9rem;
}

/* Hello's comment styles (theme.css). wpDiscuz's comments carry the same classes (comment, avatar), so on live
   these placed its avatars, and the "Author" badge over the top of the author's picture. (Hello's underline for
   .comments-area links lost to wpDiscuz's own link rules on live, so it is left out.) */
#comments .comment-list {
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	list-style: none;
}

#comments .comment,
#comments .pingback {
	position: relative;
}

#comments .comment .comment-body,
#comments .pingback .comment-body {
	display: flex;
	flex-direction: column;
	padding-block: 30px;
	padding-inline: 60px 0;
	border-block-end: 1px solid #ccc;
}

#comments .comment .avatar,
#comments .pingback .avatar {
	position: absolute;
	left: 0;
	margin-inline-end: 10px;
	border-radius: 50%;
}

#comments .comment-meta {
	display: flex;
	justify-content: space-between;
	margin-block-end: 0.9rem;
}

#comments .comment-metadata,
#comments .reply {
	font-size: 11px;
	line-height: 1;
}

#comments .children {
	position: relative;
	margin: 0;
	padding-inline-start: 30px;
	list-style: none;
}

#comments .children li:last-child {
	padding-block-end: 0;
}

#comments ol.comment-list .children::before {
	content: "\21AA";
	position: absolute;
	top: 45px;
	left: 0;
	display: inline-block;
	width: auto;
	font-size: 1em;
	font-weight: 400;
	line-height: 1;
}

@media (min-width: 768px) {
	#comments :is(.comment-author, .comment-metadata) {
		line-height: 1;
	}
}

@media (max-width: 767px) {
	#comments .comment .comment-body {
		padding: 30px 0;
	}

	#comments .children {
		padding-inline-start: 20px;
	}

	#comments .comment .avatar {
		position: inherit;
		float: left;
	}
}

.hide {
	display: none !important;
}

/* Each selector keeps the weight it had in Hello's reset (an element 0,0,1; an attribute 0,1,0), so the plugins'
   own form rules win or lose against them exactly as on live. Grouping `select` or `button` inside :is() with
   attribute selectors would give them the attribute's weight. */
:where(.lmm-article, #comments, .post-password-form) label {
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
}

:where(.lmm-article, #comments, .post-password-form) :is(button, input, optgroup, select, textarea) {
	margin: 0;
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.5;
}

:where(.lmm-article, #comments, .post-password-form) :is(input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"]),
:where(.lmm-article, #comments, .post-password-form) select,
:where(.lmm-article, #comments, .post-password-form) textarea {
	width: 100%;
	padding: 0.5rem 1rem;
	border: 1px solid #666;
	border-radius: 3px;
	transition: all 0.3s;
}

:where(.lmm-article, #comments, .post-password-form) :is(input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"]):focus,
:where(.lmm-article, #comments, .post-password-form) select:focus,
:where(.lmm-article, #comments, .post-password-form) textarea:focus {
	border-color: #333;
}

:where(.lmm-article, #comments, .post-password-form) :is(button, input) {
	overflow: visible;
}

:where(.lmm-article, #comments, .post-password-form) :is(button, select) {
	text-transform: none;
}

:where(.lmm-article, #comments, .post-password-form) :is([type="button"], [type="reset"], [type="submit"]),
:where(.lmm-article, #comments, .post-password-form) button {
	-webkit-appearance: button;
	width: auto;
}

:where(.lmm-article, #comments, .post-password-form) :is([type="button"], [type="submit"]),
:where(.lmm-article, #comments, .post-password-form) button {
	display: inline-block;
	padding: 0.5rem 1rem;
	border: 1px solid #c36;
	border-radius: 3px;
	background-color: transparent;
	color: #c36;
	font-size: 1rem;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	user-select: none;
	transition: all 0.3s;
}

:where(.lmm-article, #comments, .post-password-form) :is([type="button"], [type="submit"]):is(:hover, :focus),
:where(.lmm-article, #comments, .post-password-form) button:is(:hover, :focus) {
	background-color: #c36;
	color: #fff;
	text-decoration: none;
}

:where(.lmm-article, #comments, .post-password-form) fieldset {
	padding: 0.35em 0.75em 0.625em;
}

:where(.lmm-article, #comments, .post-password-form) legend {
	box-sizing: border-box;
	display: table;
	max-width: 100%;
	padding: 0;
	color: inherit;
	white-space: normal;
}

:where(.lmm-article, #comments, .post-password-form) progress {
	vertical-align: baseline;
}

:where(.lmm-article, #comments, .post-password-form) textarea {
	overflow: auto;
	resize: vertical;
}

:where(.lmm-article, #comments, .post-password-form) :is([type="checkbox"], [type="radio"]) {
	padding: 0;
}

:where(.lmm-article, #comments, .post-password-form) [type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

:where(.lmm-article, #comments, .post-password-form) select {
	display: block;
}

/* Hello's list reset (it applied everywhere on live): no margins above or below, no border or outline */
:where(.lmm-article, #comments) :is(dd, dl, dt, li, ol, ul) {
	margin-block: 0;
	border: 0;
	outline: 0;
	background: transparent;
	font-size: 100%;
	vertical-align: baseline;
}

/* Every enabled button shows the hand pointer, as with Hello's reset on live */
:is([type="button"], [type="submit"]):not(:disabled),
button:not(:disabled) {
	cursor: pointer;
}

/* A link with no address and no tabindex (an anchor, or a script's control like the comment editor's "Edit"
   and "Remove") takes the text colour, as Hello's reset gave it */
a:not([href]):not([tabindex]),
a:not([href]):not([tabindex]):is(:focus, :hover) {
	color: inherit;
	text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
	outline: 0;
}

/* Password-protected pages and posts: Hello Elementor's form, 500px wide and centred with 50px above and
   below, the label over its field and the button 3px beside it. A block theme wraps the button in
   span.wp-block-button and gives it the theme's button classes, so those are reset here. */
.post-password-form.post-password-form {
	max-width: 500px;
	margin: 50px auto;
}

/* On live its 50px merged with the title's 16px below; WordPress's content wrapper (flow-root) keeps margins
   apart, so a form at the top of a plain page gets the difference */
.lmm-plain__content > .post-password-form.post-password-form:first-child {
	margin-top: 34px;
}

.post-password-form p {
	display: flex;
	align-items: flex-end;
	width: 100%;
}

.post-password-form .wp-block-button {
	display: flex;
	margin-inline-start: 3px;
}

.post-password-form .wp-block-button__link.wp-block-button__link {
	padding: 0.5rem 1rem;
	border: 1px solid #c36;
	border-radius: 3px;
	background-color: transparent;
	color: #c36;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-transform: none;
}

.post-password-form .wp-block-button__link.wp-block-button__link:is(:hover, :focus) {
	background-color: #c36;
	color: #fff;
}

/* Classic post content (Hello Elementor's theme.css and reset.css): WordPress alignment classes, captions and
   table spacing. Two classes, so they win over WordPress's own layout margins (.is-layout-flow > .alignright
   gives 2em) as they did on the old site. */
:is(.lmm-article__content, .lmm-plain__content) .alignright {
	float: right;
	margin-left: 1rem;
}

:is(.lmm-article__content, .lmm-plain__content) .alignleft {
	float: left;
	margin-right: 1rem;
}

:is(.lmm-article__content, .lmm-plain__content) .aligncenter {
	clear: both;
	margin-inline: auto;
}

/* Hello's display: block keeps its single-class weight, so WordPress's picture rule (display: table, which makes
   a caption as wide as its picture) still wins over it, as on live */
:where(.lmm-article__content, .lmm-plain__content) .aligncenter {
	display: block;
}

:is(.lmm-article__content, .lmm-plain__content) .wp-caption {
	max-width: 100%;
	margin-block-end: 1.25rem;
}

:is(.lmm-article__content, .lmm-plain__content) .wp-caption.alignleft {
	margin: 5px 20px 20px 0;
}

:is(.lmm-article__content, .lmm-plain__content) .wp-caption.alignright {
	margin: 5px 0 20px 20px;
}

:is(.lmm-article__content, .lmm-plain__content) .wp-caption img {
	display: block;
	margin-inline: auto;
}

:is(.lmm-article__content, .lmm-plain__content) .wp-caption-text {
	margin: 0;
}

:is(.lmm-article__content, .lmm-plain__content) figcaption {
	color: #333;
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	line-height: 1.4;
}

:is(.lmm-article__content, .lmm-plain__content) table {
	margin-block-end: 15px;
}

/* WordPress's flow layout zeroes the margins of the content's direct children; Elementor didn't, so figures
   (tables, embeds, block images) keep their 1em under them, quotes their 1em above and below and code its 1em.
   Blocks nested inside quotes, groups and columns keep WordPress's own 24px gap (functions.php). */
:is(.lmm-article__content, .lmm-plain__content) > figure {
	margin-block-end: 1em;
}

:is(.lmm-article__content, .lmm-plain__content) > :is(pre, blockquote) {
	margin-block: 1em;
}

/* Elementor's `.elementor hr { margin-top: 0 }` */
.lmm-article__content hr {
	margin-top: 0;
}

/* Separators in posts keep the browser's own grey for <hr>, as on live (the theme's light grey is for the
   Contact page) */
:where(.lmm-article__content) .wp-block-separator {
	color: revert;
}

/* Column blocks keep WordPress's 1.75em under them, as on live */
:is(.lmm-article__content, .lmm-plain__content) > .wp-block-columns {
	margin-block-end: 1.75em;
}

/* The flow layout also zeroes the last element's bottom margin, with two classes (> :last-child). On live a post
   ending in a picture, embed, table or heading kept that margin above "You may also like", so it stays here. */
.wp-block-post-content:is(.lmm-article__content, .lmm-plain__content) > :is(figure, pre, blockquote):last-child {
	margin-block-end: 1em;
}

.wp-block-post-content:is(.lmm-article__content, .lmm-plain__content) > .wp-block-columns:last-child {
	margin-block-end: 1.75em;
}

.wp-block-post-content.lmm-article__content > :is(h1, h2, h3, h4, h5, h6):last-child {
	margin-block-end: 1rem;
}

/* Embeds, iframes and videos fill the text column and never run past it, as Elementor's rule made them on live
   (a 560px YouTube frame was wider than a phone) */
.lmm-article__content :is(embed, iframe, object, video) {
	max-width: 100%;
	width: 100%;
	margin: 0;
	border: none;
	line-height: 1;
}

/* The table of contents box (LuckyWP) keeps its plugin's 32px above and below; at the very top of a post its
   margin merged into the space above on live, so it gets none there */
.lmm-article__content .lwptoc {
	margin-block: 32px;
}

.lmm-article__content > .lwptoc:first-child {
	margin-block-start: 0;
}

:where(.lmm-article__content) table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	background-color: transparent;
	font-size: 0.9em;
}

:where(.lmm-article__content) table :is(td, th) {
	padding: 15px;
	border: 1px solid hsla(0, 0%, 50%, 0.502);
	line-height: 1.5;
	vertical-align: top;
}

:where(.lmm-article__content) table th {
	font-weight: 700;
}

:where(.lmm-article__content) table :is(tfoot, thead) th {
	font-size: 1em;
}

:where(.lmm-article__content) table caption + thead tr:first-child :is(td, th),
:where(.lmm-article__content) table colgroup + thead tr:first-child :is(td, th),
:where(.lmm-article__content) table thead:first-child tr:first-child :is(td, th) {
	border-block-start: 1px solid hsla(0, 0%, 50%, 0.502);
}

:where(.lmm-article__content) table tbody > tr:nth-child(odd) > :is(td, th) {
	background-color: hsla(0, 0%, 50%, 0.071);
}

:where(.lmm-article__content) table tbody tr:hover > :is(td, th) {
	background-color: hsla(0, 0%, 50%, 0.102);
}

:where(.lmm-article__content) table tbody + tbody {
	border-block-start: 2px solid hsla(0, 0%, 50%, 0.502);
}

@media (max-width: 767px) {
	:where(.lmm-article__content) table table {
		font-size: 0.8em;
	}

	:where(.lmm-article__content) table table :is(td, th) {
		padding: 7px;
		line-height: 1.3;
	}

	:where(.lmm-article__content) table table th {
		font-weight: 400;
	}
}

/* Buttons fade on hover over 0.3s, as Hello Elementor's and Elementor's buttons did */
:where(button, [type="button"], [type="submit"]),
.wp-block-button__link {
	transition: all 0.3s;
}

/* ---------- Headers ---------- */

.lmm-header {
	position: relative;
	margin-top: 10px;
}

.lmm-header__banner.lmm-header__banner {
	box-sizing: border-box;
	display: grid;
	align-items: center;
	min-height: 199px;
	margin: 0 0 5px;
}

.lmm-header__banner a {
	background: var(--lmm-dark);
}

.lmm-header__banner a,
.lmm-navbar__logo a,
.lmm-promo a,
.lmm-footer__logo a {
	display: block;
}

.lmm-header__banner img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: auto 1920 / 295;
}

.lmm-navbar {
	background: var(--lmm-dark);
	align-items: center;
	gap: 0;
}

.lmm-header:not(.lmm-header--post) .lmm-navbar {
	align-items: center;
}

.lmm-header:not(.lmm-header--post) nav.lmm-menu.wp-block-navigation {
	flex: 0 0 75%;
	margin-bottom: -3px;
}

.lmm-header:not(.lmm-header--post) .lmm-menu .wp-block-navigation__container {
	flex-wrap: wrap;
	width: 100%;
}

.lmm-menu .wp-block-navigation-item__content {
	white-space: nowrap;
}

.lmm-header:not(.lmm-header--post) .lmm-menu .wp-block-navigation-item {
	flex: 1 1 auto;
}

.lmm-header:not(.lmm-header--post) .lmm-menu .wp-block-navigation-item__content {
	width: 100%;
	text-align: center;
}

.lmm-header--post {
	margin-top: 0;
	background: var(--lmm-dark);
}

.lmm-header--post .lmm-navbar {
	height: 58px;
}

.lmm-header--post nav.lmm-menu.wp-block-navigation {
	padding: 0 10px;
	font-size: 14px;
}

.lmm-header--post .lmm-menu .wp-block-navigation-item {
	flex: 1 1 auto;
}

.lmm-header--post .lmm-menu .wp-block-navigation-item__content {
	width: 100%;
	text-align: center;
}

/* Desktop post header as Elementor sized it: 20px at the sides, 10px above and below the row, and the menu
   15px into that on both, so a menu too wide for one line (1025-1050px) wraps whole items onto a second row */
@media (min-width: 1025px) {
	.lmm-header--post {
		padding-inline: 20px;
	}

	.lmm-header--post .lmm-navbar {
		height: auto;
		min-height: 58px;
		padding-block: 10px;
	}

	.lmm-header--post nav.lmm-menu.wp-block-navigation {
		margin-block: -15px;
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__container {
		flex-wrap: wrap;
	}
}

.lmm-navbar__logo {
	flex: 0 0 19%;
	margin: 0;
}

.lmm-navbar__logo img {
	display: block;
	width: 100%;
	max-width: 247px;
	height: auto;
	aspect-ratio: auto 1920 / 295;
}

/* Main menu (the block copies its classes onto the inner <ul> too, hence nav.) */
nav.lmm-menu.wp-block-navigation {
	position: static;
	flex: 1 1 auto;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 20px;
	color: #fff;
	gap: 0;
}

.lmm-header--post .lmm-menu .wp-block-navigation__container {
	width: 100%;
	justify-content: space-between;
}

.lmm-menu .wp-block-navigation__container {
	gap: 0;
}

.lmm-menu .wp-block-navigation-item__content {
	display: block;
	padding: 24px 15px;
	color: #fff;
}

.lmm-menu .wp-block-navigation-item__content:hover,
.lmm-header:not(.lmm-header--post) .lmm-menu .current-menu-item > .wp-block-navigation-item__content {
	background: var(--lmm-red);
	color: #fff;
}

.lmm-header--post .lmm-menu .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	background: transparent;
	color: var(--wp--preset--color--bright-red);
}

/* Header search: white text on the dark bar, icon button on the right */
.lmm-navbar__search {
	flex: 0 0 25%;
	align-self: center;
	box-sizing: border-box;
	margin: 0;
	padding-right: 15px;
}

.lmm-navbar__search .wp-block-search__inside-wrapper {
	border: 0;
	padding: 0;
	background: transparent;
}

.lmm-navbar__search .wp-block-search__input {
	height: 50px;
	padding: 0 16.6667px;
	border: 0;
	border-radius: 3px;
	line-height: 15px;
	background: transparent;
	color: #fff;
	font-family: var(--lmm-roboto);
	font-size: 15px;
}

.lmm-navbar__search .wp-block-search__input::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

.lmm-navbar__search .wp-block-search__button {
	flex: 0 0 50px;
	width: 50px;
	margin: 0;
	padding: 0;
	border: 0;
	background: var(--lmm-dark);
	color: #fff;
}

.lmm-navbar__search .wp-block-search__button,
.lmm-side-box--search .wp-block-search__button {
	transition: color 0.2s, background 0.2s;
}

.lmm-navbar__search .wp-block-search__button:is(:hover, :focus-visible),
.lmm-side-box--search .wp-block-search__button:is(:hover, :focus-visible) {
	outline: none;
	background: var(--lmm-red);
}

/* Font Awesome's magnifier at 16px, as on the Elementor site (functions.php swaps the icon) */
.lmm-navbar__search .wp-block-search__button svg,
.lmm-side-box--search .wp-block-search__button svg {
	width: 16px;
	min-width: 16px;
	height: 16px;
	fill: currentColor;
}

/* Reading progress bar on posts (assets/js/reading-progress.js fills it) */
.lmm-progress {
	position: sticky;
	top: 0;
	z-index: 9999;
	height: 7px;
	background: var(--lmm-dark);
	pointer-events: none;
}

.admin-bar .lmm-progress {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.lmm-progress__bar {
	width: 0;
	height: 100%;
	background: linear-gradient(#ff0000 0%, #f2295b 100%);
}

/* ---------- Main areas ---------- */

.lmm-main {
	margin-top: 20px;
	margin-bottom: 20px;
}

/* WordPress columns let words break anywhere (word-break and overflow-wrap: break-word); Elementor's didn't.
   It let table columns shrink mid-word, and beside a wide floated picture on phones it split words letter by
   letter where live moves them below the picture. Only links keep it, so a long address wraps inside the box. */
.lmm-layout > .wp-block-column {
	word-break: normal;
	overflow-wrap: normal;
}

.lmm-article__content a {
	overflow-wrap: break-word;
}

.lmm-layout.wp-block-columns {
	display: grid;
	grid-template-columns: minmax(0, 70%) minmax(0, 30%);
	justify-content: space-between;
	align-items: start;
	gap: 0;
	margin: 0;
}

/* Bordered boxes (category list, search results, pages, 404) */
.lmm-box {
	border: 1px solid var(--lmm-border);
	padding: 30px;
	margin-bottom: 10px;
}

.lmm-box__title,
.lmm-box .wp-block-query-title {
	margin: 0 0 40px;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 900;
	font-style: italic;
	line-height: 1;
	text-transform: uppercase;
	color: var(--lmm-red);
}

/* ---------- Post (single) ---------- */

.lmm-layout > .lmm-article.lmm-article {
	margin-right: 50px;
}

.lmm-article {
	background: #fff;
	box-shadow: 0 0 50px -10px rgba(0, 0, 0, 0.15);
	padding: 30px 30px 0;
}

.lmm-layout > .lmm-sidebar {
	padding: 15px;
}

/* The article's pieces sit as Elementor spaced them, not with WordPress's default block gap */
.lmm-article.lmm-article > * {
	margin-block-start: 0;
}

.lmm-article__category {
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.6px;
	line-height: 18px;
	text-transform: uppercase;
	color: var(--lmm-dark);
	margin-bottom: 10px;
}

.lmm-article__category a {
	transition: color 0.2s;
}

.lmm-article__title {
	margin: 0;
	font-family: var(--lmm-montserrat);
	font-size: 32px;
	font-weight: 900;
	font-style: italic;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--lmm-dark);
}

.lmm-article .lmm-article__meta {
	gap: 16px;
	margin: 0;
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	font-weight: 700;
	line-height: 18px;
	text-transform: capitalize;
	color: #000;
}

.lmm-article .lmm-article__image {
	margin: 0 0 20px;
}

.lmm-article__image img {
	border-radius: 3px;
}

.lmm-article .lmm-article__content {
	margin-top: 30px;
	font-family: var(--lmm-roboto);
}

/* From the old Customizer CSS (#article-text rules), !important as there, so they also reach plugin
   content in posts (poll answers, tables of contents) */
.lmm-article__content p {
	margin-bottom: 30px !important;
}

.lmm-article__content :is(hr, ul, ol, img) {
	margin-bottom: 15px !important;
}

.lmm-article__content figcaption {
	margin-top: -10px !important;
}

/* Hello's paragraph and heading margins at Hello's weight, so inside quotes, groups and columns WordPress's 24px
   gap wins over them as on live; at the top level of a post they also have to beat the flow layout's zero */
:where(.lmm-article__content) p {
	margin-top: 0;
}

:where(.lmm-article__content) :is(h1, h2, h3, h4, h5, h6) {
	margin-block: 0.5rem 1rem;
}

.lmm-article__content > :is(h1, h2, h3, h4, h5, h6) {
	margin-block: 0.5rem 1rem;
}

.lmm-article__content :is(h1, h2, h3, h4, h5, h6) {
	color: #000;
}

/* Hello's img rule, at its single-element weight so plugin and block rules for pictures still win over it */
:where(.lmm-article__content) img {
	max-width: 100%;
	height: auto;
}

/* "You may also like" */
.lmm-article .lmm-related__title {
	margin: 30px 0 20px;
	font-family: var(--lmm-montserrat);
	font-size: 32px;
	font-weight: 900;
	font-style: italic;
	text-transform: uppercase;
	color: var(--lmm-dark);
}

.lmm-related .wp-block-post-template {
	gap: 35px 30px;
}

.lmm-related .wp-block-post-featured-image {
	margin: 0 0 20px;
	aspect-ratio: 160 / 136;
}

.lmm-related .wp-block-post-featured-image img {
	height: 100%;
	object-fit: cover;
}

.lmm-related .wp-block-post-title {
	margin: 0;
	font-family: var(--lmm-montserrat);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: capitalize;
}

.lmm-related .wp-block-post-title a {
	color: #000;
}

.lmm-related .wp-block-post-title a:hover {
	color: var(--lmm-red);
}

.lmm-related .wp-block-post-featured-image img {
	transition: filter 0.3s;
}

.lmm-related .wp-block-post-featured-image img:hover {
	filter: brightness(1.15) contrast(1.15) saturate(1.08) blur(0px) hue-rotate(0deg);
}

.lmm-article .wp-block-comments {
	margin-top: 20px;
}

/* ---------- Sidebars ---------- */

.lmm-sidebar > aside > * + * {
	margin-top: 0;
}

.lmm-sidebar .lmm-follow + * {
	margin-top: 1px;
}

.lmm-sidebar > aside > .lmm-promo:has(.wp-image-15755),
.lmm-sidebar > aside > .lmm-xbutton + .lmm-promo,
.lmm-sidebar .lmm-blogroll {
	margin-top: 20px;
}

.lmm-sidebar .lmm-disclosure {
	margin-top: 40px;
}

/* Post sidebar: Elementor's boxes are sections with 20px below too, so the last one leaves 20px more
   above the footer (between boxes it folds into the 20px / 40px above the next) */
.single .lmm-sidebar :is(.lmm-blogroll, .lmm-disclosure) {
	margin-bottom: 20px;
}

/* Article archives page: a 1335px section right under the header, columns 69.96% / 30.04% (15px inside),
   the box 10px down with 4px corners; the category menu 18px under the title and 12px above the list */
.lmm-main.lmm-main--archive-page {
	margin-top: 0;
	margin-bottom: 0;
}

.lmm-layout.lmm-layout--archive.wp-block-columns {
	grid-template-columns: 69.963% 30.037%;
}

.lmm-layout--archive .lmm-page__content > .lmm-box.lmm-box {
	margin-top: 10px;
	padding: 29px 30px 30px;
	border-radius: 4px;
}

.lmm-layout--archive .lmm-box__title.lmm-box__title {
	padding-bottom: 0;
}

.lmm-layout--archive .lmm-catmenu select {
	margin: 18px 0 12px;
}

.lmm-layout--archive .lmm-box > .wp-block-query {
	padding-top: 0;
}

.lmm-sidebar.lmm-sidebar--archive > aside > :first-child {
	margin-top: 20px;
}

.lmm-sidebar--archive .lmm-disclosure.lmm-disclosure {
	margin-bottom: 20px;
}

.lmm-sidebar--archive .lmm-side-title.lmm-side-title:has(+ .lmm-follow) {
	margin-top: 0;
}

/* Article archives sidebar: every picture 20px below what comes before it */
.lmm-sidebar--archive .lmm-promo {
	margin-top: 20px;
}

.lmm-side-box {
	border: 1px solid var(--lmm-border);
	border-radius: 3px;
	padding: 30px 30px 23px;
}

/* Section titles drawn like Elementor's divider: the text (up to 95% wide, 20px either side) between two
   2px lines on a row 99% wide; a title long enough to wrap pushes the lines to nothing. */
.lmm-side-title.lmm-side-title {
	display: flex;
	align-items: center;
	gap: 0;
	width: 99%;
	margin: 20px 0;
	font-family: var(--lmm-montserrat);
	font-size: 22px;
	font-weight: 900;
	font-style: italic;
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
	color: var(--lmm-dark);
}

.lmm-side-title::before,
.lmm-side-title::after {
	content: "";
	flex: 1 1 0;
	min-width: 0;
	border-top: 2px solid #000;
}

.lmm-side-title__text {
	flex: 0 0 auto;
	max-width: 95%;
	margin: 0 20px;
	text-align: left;
}

.lmm-side-title.lmm-side-title:has(+ .lmm-follow) {
	margin-bottom: 10px;
}

/* Follower counts: two 155px boxes a row, 5px either side and 10px below each */
.lmm-follow.lmm-follow {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin: 0;
}

.lmm-follow__box.lmm-follow__box {
	position: relative;
	margin: 0 5px 10px;
	padding: 10px 0;
	text-align: center;
	border-bottom: 2px solid var(--lmm-follow-color);
	color: #333;
	transition: background-color 0.2s, color 0.2s;
}

.lmm-follow--x { --lmm-follow-color: #0f1419; }
.lmm-follow--instagram { --lmm-follow-color: #3f729b; }
.lmm-follow--youtube { --lmm-follow-color: #cd332d; }
.lmm-follow--mail { --lmm-follow-color: #00a154; }

.lmm-follow__box .wp-block-icon {
	display: flex;
	justify-content: center;
	margin-bottom: 6px;
	color: var(--lmm-follow-color);
}

.lmm-follow__box .wp-block-icon svg {
	width: 32px;
	height: 32px;
	fill: currentColor;
}

.lmm-follow__count {
	margin: 0 0 2px;
	font-family: var(--lmm-montserrat);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
}

.lmm-follow__count a {
	color: inherit;
}

/* The whole box is clickable through the count's link */
.lmm-follow__count a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.lmm-follow__label {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.5px;
	line-height: 1.5;
	text-transform: uppercase;
}

.lmm-follow__box:hover {
	background: var(--lmm-follow-color);
	color: #fff;
}

.lmm-follow__box:hover .wp-block-icon {
	color: #fff;
}

/* Book and product images */
.lmm-promo {
	margin: 0;
}

.lmm-promo img {
	display: block;
	width: 100%;
	height: auto;
}

/* Pictures Elementor showed at their own size, centred, so they stop growing on tablets: the book covers
   (640px), The Wife Guide (800px) and the No-BS Resume (768px) */
.lmm-promo img:is(.wp-image-24202, .wp-image-24204, .wp-image-24205) {
	max-width: 640px;
	margin-inline: auto;
}

.lmm-promo img.wp-image-24647 {
	max-width: 800px;
	margin-inline: auto;
}

.lmm-promo img.wp-image-19607 {
	max-width: 768px;
	margin-inline: auto;
}

/* "Top … Articles" lists: 70px thumbnail and title */
/* 6px above the rows and 40px below them, as padding so it adds to the next title's 20px */
.lmm-side-list.lmm-side-list {
	margin: 0;
	padding-bottom: 40px;
}

.lmm-side-list.lmm-side-list .wp-block-post-template {
	display: grid;
	gap: 16px;
	margin: 0;
	padding: 6px 0 0;
	list-style: none;
}

.lmm-side-row {
	gap: 14px;
}

.lmm-side-row .wp-block-post-featured-image {
	flex: 0 0 70px;
	margin: 0;
}

.lmm-side-row .wp-block-post-featured-image img {
	width: 70px;
	height: 70px;
	object-fit: cover;
	border-radius: 4px;
}

.lmm-side-row .wp-block-post-title {
	margin: 0;
	font-family: var(--lmm-montserrat);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
}

/* "Get The Art of X" button */
.lmm-xbutton .wp-block-button {
	width: 100%;
}

.lmm-xbutton .wp-block-button__link {
	display: block;
	width: 100%;
	padding: 15px 30px;
	border: 0;
	background: #0a0e12;
	color: #00ff92;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 1.6px;
	text-align: center;
	text-transform: uppercase;
}

.lmm-xbutton .wp-block-button__link:hover {
	background: #0a0e12;
	color: #fff;
}

/* Blogroll */
.lmm-blogroll .lmm-side-title.lmm-side-title {
	width: 100%;
	margin: 0 0 20px;
	font-size: 20px;
	line-height: 20px;
	text-transform: capitalize;
}

.lmm-blogroll__list {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}

/* Elementor's icon list: 15px between links, with the divider drawn in that space rather than as a border */
.lmm-blogroll__list li {
	position: relative;
	padding: 0 0 7.5px;
}

.lmm-blogroll__list li + li {
	margin-top: 7.5px;
}

.lmm-blogroll__list li:last-child {
	padding-bottom: 0;
}

.lmm-blogroll__list li:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
	border-top: 1px solid var(--lmm-border);
}

/* Affiliate disclosure */
.lmm-disclosure__title {
	margin: 0 0 5px;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 900;
	font-style: italic;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--lmm-dark);
}

.lmm-disclosure p {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: #000;
}

.lmm-disclosure.lmm-disclosure {
	padding-bottom: 18px;
}

/* Podcast player pins to the top of the screen while the home list scrolls (desktop); the sidebar column
   runs the full height of the list so it has room to travel */
.lmm-podcast {
	position: sticky;
	top: 0;
}

.lmm-main--home .lmm-layout > .lmm-sidebar {
	align-self: stretch;
}

.lmm-main--home .lmm-sidebar > aside {
	height: 100%;
}

/* 6px under the player: on the Elementor site it sat inline, on the text line */
.lmm-podcast.lmm-podcast {
	padding-bottom: 6px;
}

.lmm-podcast iframe {
	display: block;
	width: 100%;
	border: 0;
}

/* ---------- Home list ---------- */

/* A white panel with the same soft shadow as posts, 50px from the sidebar */
.lmm-layout > .lmm-list-box.lmm-list-box {
	margin-right: 50px;
	padding: 30px;
	border: 0;
	background: #fff;
	box-shadow: 0 0 50px -10px rgba(0, 0, 0, 0.15);
}

.lmm-home-list .wp-block-post-template {
	display: grid;
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Each row: picture column 45%, text column 50%, 10px inside each; 50px and a black line below */
.lmm-home-row.lmm-home-row {
	gap: 0;
	align-items: stretch;
	padding: 0 0 50px;
	border-bottom: 1px solid #000;
}

.lmm-home-row__image.lmm-home-row__image {
	flex: 0 0 45%;
	box-sizing: border-box;
	margin: 0;
	padding: 10px;
}

.lmm-home-row__image img {
	display: block;
	width: 100%;
	height: auto;
}

.lmm-home-row__text.lmm-home-row__text {
	flex: 0 0 50%;
	box-sizing: border-box;
	min-width: 0;
	padding: 10px;
}

.lmm-home-row__meta {
	gap: 6px;
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	font-weight: 700;
	line-height: 18px;
	text-transform: uppercase;
	color: var(--lmm-red);
}

.lmm-by::before {
	content: "By ";
}

.lmm-home-row__title {
	margin: 10px 0 20px;
	font-family: var(--lmm-montserrat);
	font-size: 35px;
	font-weight: 700;
	line-height: 1.2;
}

.lmm-home-row__title a {
	color: #000;
}

.lmm-home-row__title a:hover {
	color: #000;
}

.lmm-home-row__image a {
	height: auto;
}

.lmm-home-row__image img {
	transition: all 0.3s;
}

.lmm-home-row__image img:hover {
	filter: brightness(1.1) contrast(1.1) saturate(1.1) blur(0px) hue-rotate(0deg);
}

.lmm-home-row__excerpt {
	font-size: 16px;
	line-height: 1.5;
	color: var(--wp--preset--color--gray);
}

.lmm-home-row__excerpt p {
	margin: 0;
}

/* Elementor's excerpt: 0.9rem under the text, then a -20px widget margin */
.lmm-home-row__excerpt.lmm-home-row__excerpt {
	margin-bottom: -5.6px;
}

.lmm-main--home .lmm-pagination.lmm-pagination {
	margin-top: 0;
	gap: 0;
	font-size: 16px;
	line-height: 24px;
}

.lmm-main--home .lmm-pagination .page-numbers {
	margin: 0 5px;
}

/* Elementor's pagination has a space (4.5px) between "Previous" / "Next" and the numbers; core's has none */
.lmm-main--home .lmm-pagination .wp-block-query-pagination-previous {
	margin-right: 9.5px;
}

.lmm-main--home .lmm-pagination .wp-block-query-pagination-next {
	margin-left: 9.5px;
}

.lmm-main--home .lmm-pagination .page-numbers.current {
	color: var(--wp--preset--color--body);
}

/* Home sidebar: starts at the top; 20px under the follower boxes; 40px under "Latest Podcasts" */
.lmm-sidebar > aside > :first-child {
	margin-top: 0;
}

.lmm-main--home .lmm-sidebar .lmm-follow + * {
	margin-top: 20px;
}

/* The title sits 20px into the block, the player 20px under it, as Elementor's divider widget placed them */
.lmm-podcast .lmm-side-title.lmm-side-title {
	margin: 0 0 20px;
	padding-top: 20px;
}

.lmm-home-row__excerpt .wp-block-post-excerpt__more-link {
	color: inherit;
}

/* ---------- Category, tag and date lists ---------- */

.lmm-rows .wp-block-post-template {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Elementor's loop rows: 11px above and below, a light line under each, the date in a 96px column and the
   title 16px after it, both at the top when the title runs to two lines */
.lmm-row.lmm-row {
	align-items: flex-start;
	gap: 16px;
	padding: 11px 0;
	border-bottom: 1px solid #e8e8e8;
}

.lmm-row__date {
	flex: 0 0 96px;
	white-space: nowrap;
	font-family: var(--lmm-montserrat);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.6;
	color: var(--lmm-dark);
}

/* The date links to its month but keeps the dark colour, hovered or not, as on live */
.lmm-row__date a,
.lmm-row__date a:is(:hover, :focus) {
	color: inherit;
}

/* Category, tag and date pages: "Previous" / "Next" stay red when there is no page to go to */
.lmm-rows .lmm-pagination .is-disabled {
	color: var(--lmm-red);
}

/* .lmm-rows in front keeps the page text spacing (.lmm-page__content p) off the titles on Article Archives */
.lmm-rows .lmm-row__title {
	margin: 0;
	font-family: var(--lmm-montserrat);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.45;
}

/* Category, tag and date pages: Elementor's column (15px inside) holding a box 10px down with rounded corners */
.lmm-main.lmm-main--archive {
	margin: 0;
	padding: 15px 15px 16px;
}

.lmm-main--archive .lmm-box--list.lmm-box--list {
	max-width: 1270px;
	margin: 10px auto 0;
	padding-top: 29px;
	border-radius: 4px;
}

.lmm-box--list > .wp-block-query {
	padding-top: 20px;
}

/* Search results: the cards start right under the title; pagination 40px below them at 16px */
.lmm-box--list > .wp-block-query.lmm-cards {
	padding-top: 0;
}

.lmm-cards .lmm-pagination.lmm-pagination {
	margin-top: 40px;
	font-size: 16px;
	line-height: 24px;
}

.lmm-box--list .lmm-pagination.lmm-pagination {
	gap: 0;
}

.lmm-box--list .lmm-pagination .page-numbers,
.lmm-box--list .lmm-pagination > * {
	margin: 0 7px;
}

/* Search results: the links run as one line of text that wraps on narrow screens (Elementor's pagination is
   plain inline links), 2.5px either side of each number, with the space between them (4.5px) */
.lmm-cards .lmm-pagination.lmm-pagination {
	display: block;
	text-align: center;
}

.lmm-cards .lmm-pagination .wp-block-query-pagination-numbers {
	display: inline;
}

.lmm-cards .lmm-pagination .page-numbers,
.lmm-cards .lmm-pagination > * {
	margin: 0 2.5px;
}

.lmm-cards .lmm-pagination .wp-block-query-pagination-previous {
	margin: 0 7px 0 0;
}

.lmm-cards .lmm-pagination .wp-block-query-pagination-next {
	margin: 0 0 0 7px;
}

/* Pagination */
.lmm-pagination {
	gap: 14px;
	margin-top: 28px;
	font-family: var(--lmm-montserrat);
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}

.lmm-pagination .page-numbers {
	margin: 0;
}

.lmm-pagination .page-numbers.current {
	color: var(--lmm-dark);
}

/* "See all articles" box: 1140px wide and centred, 30px inside (23px at the bottom) */
.lmm-box--cta.lmm-box--cta {
	max-width: 1140px;
	margin: 9px auto 0;
	padding: 30px 30px 23px;
	border-radius: 4px;
}

.lmm-box--cta {
	text-align: center;
	font-size: 18px;
	color: #000;
}

.lmm-box--cta p {
	margin: 0 0 0.9rem;
}

.lmm-outline-button .wp-block-button__link {
	padding: 25px 50px;
	border: 2px solid #000;
	background: transparent;
	color: var(--lmm-dark);
	font-size: 20px;
	font-weight: 900;
	font-style: italic;
	letter-spacing: 0;
}

.lmm-outline-button .wp-block-button__link:hover {
	background: var(--lmm-dark);
	color: #fff;
}

/* ---------- Search results cards ---------- */

.lmm-cards .wp-block-post-template {
	gap: 40px 20px;
}

.lmm-card {
	height: 100%;
	border-radius: 3px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
	transition: all 0.25s;
}

.lmm-card:hover {
	box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
}

.lmm-card .wp-block-post-featured-image {
	margin: 0;
}

/* Elementor's card skin: a dark fade up from the bottom of each picture, half as strong while the card is
   hovered */
.lmm-card .wp-block-post-featured-image a {
	position: relative;
	display: block;
}

.lmm-card .wp-block-post-featured-image a::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0) 75%);
	pointer-events: none;
	transition: all 0.3s ease-out;
}

.lmm-card:hover .wp-block-post-featured-image a::after {
	opacity: 0.5;
}

/* A search with no results: Elementor's grey message, in the first card's place */
.lmm-cards .lmm-no-results.lmm-no-results {
	width: calc((100% - 40px) / 3);
	margin: 0;
	font-family: var(--lmm-roboto);
	font-size: 16px;
	line-height: 24px;
	color: #7a7a7a;
}

/* Elementor drew post-list pictures 1% oversize inside their frame */
.lmm-card .wp-block-post-featured-image img,
.lmm-related .wp-block-post-featured-image img {
	transform: scale(1.01);
}

.lmm-card__title {
	margin: 0;
	padding: 20px 15px 25px;
	font-family: var(--lmm-montserrat);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
}

.lmm-card__title a {
	color: var(--lmm-dark);
}

/* A post with no featured image: the title starts at the top of the card, as Elementor's did */
.lmm-card > .lmm-card__title:first-child {
	padding-top: 0;
}

/* Search box used on the 404 page and empty results */
/* The field sits in a light grey box with 3px corners; the button is as wide as its text plus 16.67px each side */
.lmm-search-box .wp-block-search__inside-wrapper {
	padding: 0;
	border: 0;
	border-radius: 3px;
	background: #ededed;
}

.lmm-search-box .wp-block-search__input {
	height: 50px;
	padding: 0 16.6667px;
	border: 0;
	border-radius: 3px;
	background: transparent;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	line-height: 16px;
}

.lmm-search-box .wp-block-search__button {
	flex: 0 0 auto;
	min-width: 145px;
	margin: 0;
	padding: 0 16.6667px;
	letter-spacing: normal;
	border: 0;
	background: var(--lmm-red);
	color: #fff;
	font-family: var(--lmm-montserrat);
	font-weight: 700;
	text-transform: uppercase;
}

/* ---------- 404 ---------- */

/* Elementor's 404 was a page of its own, with no header or footer: one full-screen section 20px from the top
   (at the top on tablets and phones), 15px inside, the two boxes centred in it, 20px apart; the lower one split
   50% / 15% / 34.67% */
.lmm-main.lmm-main--404 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
	min-height: 100vh;
	margin: 20px 0 0;
	padding: 15px;
}

.lmm-main--404 > * {
	width: 100%;
}

.lmm-box--404-title.lmm-box--404-title {
	margin-bottom: 20px;
}

.lmm-box--404-title .lmm-box__title {
	margin: 0;
}

.lmm-404.wp-block-columns {
	display: grid;
	grid-template-columns: 50% 15% 34.666%;
	gap: 0;
	margin: 0;
}

.lmm-404 .lmm-search-box {
	margin-right: 50px;
}

.lmm-404__hint.lmm-404__hint {
	margin: 0 0 20px;
	font-family: var(--lmm-montserrat);
	font-size: 15px;
	line-height: 1.3;
	color: #000;
}

.lmm-404__links {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--lmm-montserrat);
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 24px;
}

.lmm-404__links li {
	padding-bottom: 5px;
}

.lmm-404__links li + li {
	margin-top: 5px;
}

.lmm-404__links li:last-child {
	padding-bottom: 0;
}

.lmm-404__links a {
	display: flex;
	align-items: center;
	color: var(--lmm-dark);
	transition: color 0.3s;
}

.lmm-404__links a:hover {
	color: var(--lmm-red);
}

.lmm-404 .lmm-search-box .wp-block-search__button {
	transition: color 0.2s, background 0.2s;
}

.lmm-404 .lmm-search-box .wp-block-search__button:hover {
	background: #92001e;
}

/* Font Awesome's angle-right (as on the Elementor site) in a 17.5px slot plus 5px before the text, in the link's colour */
.lmm-404__links a::before {
	content: "";
	flex: 0 0 14px;
	height: 14px;
	margin-right: 8.5px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath d='M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath d='M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lmm-sidebar img.wp-image-15755,
.lmm-sidebar img.wp-image-19607,
.lmm-side-promos img.wp-image-24734 {
	transition: all 0.3s;
}

.lmm-sidebar img.wp-image-15755:hover,
.lmm-sidebar img.wp-image-19607:hover {
	filter: brightness(1.15) contrast(1.15) saturate(1.15) blur(0px) hue-rotate(0deg);
}

.lmm-side-promos img.wp-image-24734:hover {
	filter: brightness(1.08) contrast(1.08) saturate(1.08) blur(0px) hue-rotate(0deg);
}

.page-id-1214 .lmm-item__image img,
.page-id-1248 .lmm-item__image img {
	filter: brightness(1) contrast(1) saturate(1.15) blur(0px) hue-rotate(0deg);
}

/* ---------- Pages ---------- */

.lmm-page__content {
	font-size: 18px;
	color: #000;
}

.lmm-page__content > * + * {
	margin-top: 10px;
}

/* Page boxes: 30px inside at the top and sides; at the bottom only the last paragraph's own 0.9rem, as in
   Elementor. The gap under the title is padding, so a subheading's top margin adds to it as on live. */
.lmm-page__content .lmm-box.lmm-box {
	padding: 30px 30px 0;
}

/* Elementor gave the legal and category boxes 69px on top and pulled the column up 40px, so the title starts
   29px inside the border */
.lmm-page__content > .lmm-box:not(.lmm-box--title, .lmm-box--aside) {
	padding-top: 29px;
}

.lmm-page__content .lmm-box__title {
	margin-bottom: 0;
	padding-bottom: 20px;
}

/* Text spacing inside page boxes, as in the old text widgets: paragraphs and lists 0.9rem apart,
   headings with Hello Elementor's base spacing (0.5rem above, 1rem below) */
.lmm-page__content p {
	margin-top: 0;
	margin-bottom: 0.9rem;
}

.lmm-page__content :is(ul, ol) {
	margin-top: 0;
	margin-bottom: 0;
}

/* The old theme's empty widget area left one blank line on the medical disclaimer */
.lmm-page__content .lmm-box > p.lmm-blank-line.lmm-blank-line {
	margin: 0;
}

/* The affiliate program's lists were followed by empty paragraphs on the live page */
.page-id-2475 .lmm-page__content :is(ul, ol) {
	margin-bottom: 0.9rem;
}

.lmm-page__content :is(h2, h3, h4, h5, h6):not(.lmm-section-title) {
	margin-top: 0.5rem;
	margin-bottom: 1rem;
}

.lmm-page__content .lmm-box > p:last-child {
	margin-bottom: 0.9rem;
}

/* Pages: Elementor's section (30px above and below) with two columns of 2/3 and 1/3, 15px inside each */
.lmm-main--page {
	margin-top: 30px;
	margin-bottom: 30px;
}

/* Pages whose Elementor section had other margins on desktop (page ids are the same on live and staging) */
@media (min-width: 1025px) {
	.page-id-1214 .lmm-main.lmm-main--page,
	.page-id-1248 .lmm-main.lmm-main--page {
		margin-top: 20px;
		margin-bottom: 0;
	}

	.page-id-1492 .lmm-main.lmm-main--page {
		margin-bottom: 20px;
	}
}

.lmm-layout--page.wp-block-columns {
	grid-template-columns: 66.666% 33.334%;
	gap: 0;
}

.lmm-layout--page > .wp-block-column {
	padding: 15px;
}

.lmm-center {
	text-align: center;
}

/* Per-screen text alignment carried over from Elementor (tablet and phone rules are further down) */
.lmm-ta-center {
	text-align: center;
}

.lmm-ta-right {
	text-align: right;
}

/* Product and book lists: the title box, headings and entries stack with Elementor's section margins, which
   add up rather than collapse (title box 20px under; first heading 20px under; every later heading and
   entry 10px over) */
.lmm-page__content:has(> .lmm-item),
.lmm-page__content .wp-block-column:has(> .lmm-item) {
	display: flex;
	flex-direction: column;
}

.lmm-page__content .lmm-box--title.lmm-box--title {
	margin: 0 0 20px;
	padding: 30px;
}

.lmm-box--title .lmm-box__title.lmm-box__title {
	margin: 0;
	padding: 0;
}

/* Section headings drawn like Elementor's divider: 15px inside, the text between two 1.5px lines 10px away.
   The text never gives up room to the lines: it may take 95% of the width before it wraps, and then starts
   10px in (the 10px gaps are margins on the lines, so a line with no room simply disappears) */
.lmm-section-title.lmm-section-title {
	display: grid;
	grid-template-columns: minmax(10px, 1fr) fit-content(95%) minmax(0, 1fr);
	align-items: center;
	gap: 0;
	margin: 10px 0 0;
	padding: 15px;
	font-family: var(--lmm-montserrat);
	font-size: 18px;
	font-weight: 900;
	font-style: italic;
	line-height: 18px;
	text-transform: uppercase;
	text-align: center;
	color: var(--lmm-dark);
}

.lmm-section-title::before,
.lmm-section-title::after {
	content: "";
	min-width: 0;
	border-top: 1.5px solid var(--lmm-dark);
}

.lmm-section-title::before {
	margin-right: 10px;
}

.lmm-section-title::after {
	margin-left: 10px;
}

/* Product and book entries: picture column 20%, text column 80% with 20px before the text; the shorter
   of the two is centred against the other */
.lmm-item.wp-block-columns {
	display: grid;
	grid-template-columns: 20% 80%;
	align-items: center;
	gap: 0;
	margin: 10px 0 0;
	padding: 30px;
	border: 1px solid var(--lmm-border);
	color: var(--lmm-dark);
}

.lmm-item__image .wp-block-image {
	margin: 0;
}

/* Pictures at their own size, centred, shrinking only when the column is narrower (as Elementor showed them) */
.lmm-item__image img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	border-radius: 3px;
}

/* border-box: core gives a vertically aligned column width 100%, which the padding would push past the card */
.lmm-item__text.lmm-item__text {
	box-sizing: border-box;
	padding: 0 0 0 20px;
}

.lmm-box--title + .lmm-section-title.lmm-section-title {
	margin: 0 0 20px;
}

/* Approved products: the entries' text is black (dark grey on the book list), except the first entry, whose
   Elementor text used the site's dark grey */
.page-id-1214 .lmm-item.wp-block-columns {
	color: #000;
}

.page-id-1214 .lmm-box--title + .lmm-section-title + .lmm-item.lmm-item {
	margin-top: 0;
	color: var(--lmm-dark);
}

/* Elementor kept the last paragraph's 0.9rem in the entry (WordPress's column layout drops it) */
.lmm-item .lmm-item__text > :last-child {
	margin-bottom: 0.9rem;
}

/* Two half-width columns (contact): 29px above the text (Elementor's 69px less 40px) and 30px under it */
.lmm-layout--half.wp-block-columns {
	grid-template-columns: 50% 50%;
}

.lmm-layout--half .lmm-box.lmm-box {
	padding-top: 29px;
	padding-bottom: 30px;
}

.lmm-box--aside {
	font-size: 15px;
	color: var(--lmm-dark);
}

/* Article archives: category menu */
.lmm-catmenu select {
	width: 100%;
	max-width: 340px;
	margin: 0 0 12px;
	padding: 10px 14px;
	border: 1px solid #dadada;
	border-radius: 4px;
	background-color: #f1f1f1;
	font-family: var(--lmm-montserrat);
	font-size: 14px;
	font-weight: 600;
	color: var(--lmm-dark);
	cursor: pointer;
	transition: all 0.3s;
}

/* Categories page: every category with its post count */
.lmm-catlist {
	margin: 0;
	padding: 0;
	list-style: none;
	columns: 2 240px;
	column-gap: 40px;
	font-family: var(--lmm-montserrat);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
}

.lmm-catlist li {
	break-inside: avoid;
	padding: 6px 0;
	border-bottom: 1px solid var(--lmm-border);
}

.lmm-catlist .children {
	margin: 6px 0 0;
	padding-left: 18px;
	list-style: none;
	font-weight: 500;
}

.lmm-catlist .children li:last-child {
	border-bottom: 0;
}

/* Page sidebar: The Art of X, the crypto banner, Live Intentionally */
.lmm-side-promos.lmm-box {
	margin: 0;
	padding: 30px 30px 23px;
	border-radius: 3px;
}


.lmm-side-promos > * + * {
	margin-top: 20px;
}

.lmm-side-promos .lmm-xbutton {
	margin-top: 0;
}

/* Crypto banner: Elementor's call-to-action box, 35px inside, so on a narrow sidebar the button text wraps
   and the box grows */
.lmm-crypto.wp-block-cover {
	padding: 35px;
	overflow: hidden;
}

.lmm-crypto .wp-block-cover__image-background {
	transform: scale(1.2);
	transition: transform 1.5s;
}

.lmm-crypto:hover .wp-block-cover__image-background {
	transform: scale(1);
}

.lmm-crypto .wp-block-cover__background.wp-block-cover__background {
	opacity: 1;
	background-color: transparent;
	transition: background-color 1.5s;
}

.lmm-crypto:hover .wp-block-cover__background.wp-block-cover__background {
	background-color: rgba(0, 0, 0, 0.3);
}

.lmm-crypto .wp-block-buttons {
	transition: transform 1s;
}

.lmm-crypto:hover .wp-block-buttons {
	transform: scale(1.1);
}

.lmm-crypto .wp-block-button__link::after {
	content: "";
	position: absolute;
	inset: -500px;
}

.lmm-crypto .wp-block-button__link {
	padding: 15px 30px;
	line-height: 12px;
	letter-spacing: normal;
	white-space: normal;
	border-radius: 0;
	background: #1f2024;
	color: #fff;
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	font-weight: 700;
	font-style: italic;
	text-transform: uppercase;
}

/* Sidebar search: a white 50px field with a 1px grey border and rounded corners, black 50px icon button */
.lmm-side-box--search .wp-block-search__inside-wrapper {
	box-sizing: border-box;
	height: 50px;
	padding: 0;
	border: 1px solid var(--lmm-border);
	border-radius: 3px;
	background: #fff;
}

.lmm-side-box--search .wp-block-search__input {
	height: 48px;
	padding: 0 16.6667px;
	border: 0;
	background: transparent;
	font-size: 15px;
	line-height: 15px;
}

.lmm-side-box--search .wp-block-search__button {
	flex: 0 0 50px;
	width: 50px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: #000;
	color: #fff;
}

/* ---------- Plain pages (default page template): Hello Elementor's own page look, as on the live site ---------- */

.lmm-plain {
	box-sizing: border-box;
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 1rem;
	line-height: 1.5;
	color: #333;
}

.lmm-plain .lmm-plain__title {
	margin: 0.5rem 0 1rem;
	font-family: inherit;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
}

.lmm-plain .lmm-plain__content {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
}

.lmm-plain__content :is(h2, h3, h4, h5, h6) {
	font-family: inherit;
	color: inherit;
}

.lmm-plain__content p {
	margin: 0 0 0.9rem;
}

.lmm-plain__content :is(ul, ol) {
	margin: 0;
	padding-left: 40px;
}

@media (max-width: 1199px) {
	.lmm-plain {
		max-width: 800px;
	}
}

@media (max-width: 991px) {
	.lmm-plain {
		max-width: 600px;
	}
}

@media (max-width: 767px) {
	.lmm-plain {
		max-width: 500px;
	}
}

@media (max-width: 575px) {
	.lmm-plain {
		max-width: none;
		padding: 0 10px;
	}

	.lmm-plain .lmm-plain__title {
		padding: 0 10px;
	}
}

/* ---------- Footer ---------- */

/* As Elementor's footer: no side padding, the copyright column 15px in from its left edge */
.lmm-footer {
	background: var(--wp--preset--color--darker);
	padding: 8px 0;
	color: #fff;
}

.lmm-footer__row {
	gap: 0;
}

.lmm-footer__copy {
	flex: 0 0 31.083%;
	margin: 0;
	padding-left: 15px;
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	line-height: 1.91;
}

.lmm-footer__menu .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--yellow);
}

nav.lmm-footer__menu {
	flex: 0 0 68.917%;
	justify-content: center;
	font-family: var(--lmm-montserrat);
	font-size: 12px;
	line-height: 20px;
	text-transform: uppercase;
	gap: 0;
}

.lmm-footer__menu .wp-block-navigation__container {
	justify-content: center;
}

.lmm-footer__menu .wp-block-navigation__container {
	gap: 0;
}

/* Elementor's menu divider: a 2px grey line after every link but the last, so a wrapped row never starts with one */
.lmm-footer__menu .wp-block-navigation-item:not(:last-child)::after {
	content: "";
	align-self: center;
	height: 9.1px;
	border-left: 2px solid #7a7a7a;
}

.lmm-footer__menu .wp-block-navigation-item__content {
	padding: 3px 10px;
	color: #fff;
	transition: all 0.4s;
}

.lmm-footer__menu .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--yellow);
}

.lmm-footer__logo {
	display: none;
}

.lmm-disclosure.lmm-disclosure {
	border-radius: 4px;
}

.single .lmm-footer.lmm-footer {
	padding-top: 5px;
	padding-bottom: 5px;
}

/* MailOptin forms: inputs and button at Hello Elementor's 1rem / 1.5 (MailOptin sets its own size on wider screens) */
.moOptinForm input {
	font-size: 1rem;
	line-height: 1.5;
}

/* Post newsletter form: 20px above the email field on every screen size (from the old Customizer CSS) */
#RCHJIMgPcs_inpost .boldy_main-form {
	padding-top: 20px !important;
}

/* Red line beside quotes in older posts' plain <blockquote> (the old Customizer CSS, at its weight) */
.single-post blockquote {
	border-left: 4px solid #b10024;
	padding-left: 1em;
	margin-left: 0;
	margin-right: 0;
}

/* The newsletter form under each post sat outside the post text on live, so its field and button took Hello's
   system font from the page (its headings set their own) */
.lmm-article > .moOptinForm {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* wpDiscuz floating comment bubble sits above the bottom bar (from the old Customizer CSS) */
#wpd-bubble-wrapper {
	bottom: 65px !important;
}

/* ---------- Tablets and phones (up to 1024px) ---------- */

/* Elementor's drop-down: its height cap grows from 0 to the screen's height while it stretches down from the top
   (the clip stands in for its overflow: hidden) */
@keyframes lmm-menu-unroll {
	from {
		max-height: 0;
		clip-path: inset(0);
		transform: scaleY(0);
	}

	to {
		max-height: 100vh;
		clip-path: inset(0);
		transform: scaleY(1);
	}
}

@media (max-width: 1024px) {
	.lmm-header {
		margin-top: 0;
	}

	.lmm-header__banner.lmm-header__banner {
		min-height: 130px;
		margin: 0;
		padding: 10px;
		background: var(--lmm-dark);
	}

	.lmm-layout.wp-block-columns,
	.lmm-main--home .lmm-layout.wp-block-columns {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
	}

	.lmm-main {
		padding-left: 20px;
		padding-right: 20px;
	}

	/* Home: the list box runs edge to edge */
	.lmm-main.lmm-main--home {
		margin: 0;
		padding-left: 0;
		padding-right: 0;
	}

	.lmm-layout > .lmm-list-box.lmm-list-box {
		margin-right: 0;
	}

	.lmm-ta-tablet-center {
		text-align: center;
	}

	.lmm-ta-tablet-left {
		text-align: left;
	}

	.lmm-layout--page.wp-block-columns {
		gap: 0;
	}

	/* Book Recommendations' P.S. box: 18px text on tablets and phones */
	.lmm-box--aside {
		font-size: 18px;
	}

	/* Article Archives: the list runs full width with the sidebar under it, as on the Elementor site */
	.lmm-layout.lmm-layout--archive.wp-block-columns {
		grid-template-columns: minmax(0, 1fr);
	}

	.lmm-main.lmm-main--page {
		margin-top: 0;
		margin-bottom: 0;
		padding-left: 0;
		padding-right: 0;
	}

	/* These two kept their desktop section margins on tablets and phones */
	.page-id-834 .lmm-main.lmm-main--page {
		margin: 30px 0;
	}

	.page-id-1492 .lmm-main.lmm-main--page {
		margin: 30px 0 20px;
	}

	/* The menu folds into the red button up to 1024px (core folds it only below 600px) */
	.lmm-menu .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.lmm-menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.lmm-menu .wp-block-navigation__responsive-container-open,
	.lmm-menu .wp-block-navigation__responsive-container-close {
		color: var(--wp--preset--color--bright-red);
	}

	.lmm-header:not(.lmm-header--post) .lmm-navbar {
		height: 50px;
		align-items: center;
	}

	.lmm-header:not(.lmm-header--post) nav.lmm-menu.wp-block-navigation {
		flex: 0 0 10%;
	}

	.lmm-menu .wp-block-navigation__responsive-container-open {
		box-sizing: border-box;
		width: 30px;
		height: 30px;
		margin-left: 20px;
		padding: 5px;
		border-radius: 3px;
		background: rgba(0, 0, 0, 0.05);
	}

	.lmm-menu .wp-block-navigation__responsive-container-open svg,
	.lmm-menu .wp-block-navigation__responsive-container-close svg {
		width: 20px;
		height: 20px;
	}

	/* The open menu drops down across the full width, a set distance under the menu button as on the
	   Elementor site: main header 5px under it, post header 23px under it (tablets below) */
	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open {
		position: absolute;
		top: calc(100% - 5px);
		left: 0;
		right: 0;
		bottom: auto;
		height: auto;
		padding: 0;
		overflow: visible;
		background: var(--lmm-dark);
		color: #fff;
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		padding: 0;
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		gap: 0;
		width: 100%;
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__responsive-container.is-menu-open {
		top: calc(50% + 38px);
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		width: 100%;
	}

	/* Items: 16px, left-aligned, 20px inside; the current page in yellow */
	.lmm-header .lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		padding: 20px;
		font-size: 16px;
		text-align: left;
	}

	.lmm-header .lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
	.lmm-header .lmm-menu .wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
		background: transparent;
		color: var(--wp--preset--color--yellow);
	}

	/* While the menu is open its button hides, so only the close (X) shows in that spot */
	.lmm-menu:has(.is-menu-open) .wp-block-navigation__responsive-container-open {
		visibility: hidden;
	}

	/* The two swap at once, as Elementor's toggle icons do; the site-wide 0.3s button transition kept the menu
	   button showing over the opening menu */
	.lmm-menu .wp-block-navigation__responsive-container-open,
	.lmm-menu .wp-block-navigation__responsive-container-close {
		transition: none;
	}

	/* The menu unrolls from the top over 0.3s like Elementor's drop-down, instead of core's fade of the whole
	   overlay. The dark background moves onto the list, so the close (X) above it shows at once. */
	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open {
		animation: none;
		background-color: transparent !important;
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		background-color: var(--lmm-dark);
		transform-origin: top;
	}

	@media (prefers-reduced-motion: no-preference) {
		.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
			animation: lmm-menu-unroll 0.3s;
		}
	}

	/* The page still scrolls under the open menu, as on live (core locks it for its full-screen overlay) */
	html.has-modal-open {
		overflow: visible;
	}

	/* The close (X) button takes the menu button's place and look */
	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: -35px;
		left: 20px;
		right: auto;
		width: 30px;
		height: 30px;
		padding: 5px;
		border-radius: 3px;
		background: rgba(0, 0, 0, 0.05);
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: -53px;
	}

	.lmm-header:not(.lmm-header--post) .lmm-navbar__search {
		flex: 0 0 90%;
		padding-right: 45px;
	}

	/* Post header, as Elementor laid it out on tablets: 10px / 30px inside; the menu button (10px into its 24%)
	   and the logo (filling its 75%) share 80% of the width, so the logo grows with the screen */
	.lmm-header--post {
		padding: 10px 30px;
	}

	.lmm-header--post > .lmm-navbar.lmm-navbar {
		width: 80%;
		height: auto;
		margin-left: 0 !important;
		margin-right: auto !important;
		flex-direction: row-reverse;
		justify-content: flex-end;
		gap: 0;
	}

	.lmm-header--post nav.lmm-menu.wp-block-navigation {
		flex: 0 0 24%;
		box-sizing: border-box;
		padding: 0 10px;
	}

	.lmm-header--post .lmm-navbar__logo {
		flex: 0 0 75%;
	}

	.lmm-header--post .lmm-navbar__logo img {
		max-width: none;
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__responsive-container-open {
		margin-left: 0;
	}

	/* Posts: the article runs edge to edge (30px inside), the sidebar below it 15px inside */
	.single .lmm-main.lmm-main {
		margin: 0;
		padding-left: 0;
		padding-right: 0;
	}

	.lmm-layout > .lmm-article.lmm-article {
		margin-right: 0;
	}

}

/* ---------- Tablets only (768-1024px) ---------- */

@media (min-width: 768px) and (max-width: 1024px) {
	/* Crypto banner on tablets: 200px tall, its button text 32px (Elementor's tablet settings) */
	.lmm-crypto.wp-block-cover {
		min-height: 200px !important;
	}

	.lmm-crypto .wp-block-button__link {
		font-size: 32px;
		line-height: 1;
	}

	/* Affiliate disclosure and blogroll on tablets: Elementor's tablet sizes (28px / 16px, links 14px) */
	.lmm-disclosure__title {
		font-size: 28px;
	}

	.lmm-disclosure p {
		font-size: 16px;
	}

	.lmm-blogroll__list {
		font-size: 14px;
	}

	.lmm-cards .lmm-no-results.lmm-no-results {
		width: calc((100% - 20px) / 2);
	}

	/* Footer on tablets: the links in a full-width row on top, the copyright centred under them */
	.lmm-footer .lmm-footer__row.lmm-footer__row {
		flex-direction: column-reverse;
		align-items: stretch;
	}

	nav.lmm-footer__menu.lmm-footer__menu {
		flex: 0 0 auto;
	}

	.lmm-footer__menu .wp-block-navigation-item__content.wp-block-navigation-item__content {
		padding-left: 8px;
		padding-right: 8px;
	}

	.lmm-footer__copy.lmm-footer__copy {
		flex: 0 0 auto;
		margin: 20px 0 5px;
		text-align: center;
	}

	.single .lmm-footer__copy.lmm-footer__copy {
		margin-bottom: 40px;
	}

	/* Search results and "You may also like": two a row on tablets */
	.lmm-cards .wp-block-post-template,
	.lmm-related .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.lmm-main.lmm-main--404 {
		margin-top: 0;
	}

	.lmm-box--404-title .lmm-box__title {
		line-height: 1.6;
	}

	.lmm-404.wp-block-columns {
		grid-template-columns: 30% 70%;
	}

	.lmm-404 > .wp-block-column:first-child {
		grid-column: 1 / -1;
		margin-bottom: 40px;
	}

	/* Elementor's tablet menu button: 25px icon in a 37.5px box; on the main header 30px in, 7.75px from the top */
	.lmm-menu .wp-block-navigation__responsive-container-open {
		width: 37.5px;
		height: 37.5px;
		padding: 6.25px;
	}

	.lmm-menu .wp-block-navigation__responsive-container-open svg {
		width: 25px;
		height: 25px;
	}

	.lmm-header:not(.lmm-header--post) .lmm-menu .wp-block-navigation__responsive-container-open {
		margin-left: 30px;
	}

	.lmm-header:not(.lmm-header--post) nav.lmm-menu.wp-block-navigation {
		margin-bottom: -3px;
	}

	.lmm-menu .wp-block-navigation__responsive-container-close svg {
		width: 25px;
		height: 25px;
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open {
		top: calc(100% - 5.75px);
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__responsive-container.is-menu-open {
		top: calc(50% + 61.25px);
	}

	.lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: -36.5px;
		left: 30px;
		width: 37.5px;
		height: 37.5px;
		padding: 6.25px;
	}

	.lmm-header--post .lmm-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: -80px;
		left: 40px;
	}
}

/* ---------- Phones (up to 767px) ---------- */

@media (max-width: 767px) {
	.lmm-header__banner.lmm-header__banner {
		min-height: 39px;
	}

	/* Article Archives on phones: no box, so the list runs 15px from the edges; the title stays 30px */
	.lmm-layout--archive .lmm-page__content > .lmm-box.lmm-box {
		margin-top: 2px;
		padding: 0;
		border: 0;
	}

	.lmm-layout--archive .lmm-box__title.lmm-box__title {
		font-size: 30px;
		line-height: 30px;
	}

	/* Post header on phones: 7px / 30px / 7px / 10px inside; menu button (10px into its 20%) and logo (74%)
	   share 85% of the width; the bar is at least 50px tall */
	.lmm-header--post {
		padding: 7px 30px 7px 10px;
	}

	.lmm-header--post > .lmm-navbar.lmm-navbar {
		width: 85%;
	}

	/* min-width 0: on the narrowest phones the 20% is less than the button, which then overhangs, as on live */
	.lmm-header--post nav.lmm-menu.wp-block-navigation {
		flex-basis: 20%;
		min-width: 0;
		padding: 10px;
	}

	.lmm-header--post .lmm-navbar__logo {
		flex-basis: 74%;
	}

	.lmm-article__title,
	.lmm-article .lmm-related__title {
		font-size: 26px;
	}

	.lmm-blogroll__list {
		font-size: 15px;
		line-height: 22.5px;
	}

	.lmm-related .wp-block-post-template {
		grid-template-columns: 1fr;
	}

	.lmm-related .wp-block-post-featured-image {
		aspect-ratio: 2 / 1;
	}

	/* Post footer on phones: the links wrap centred in rows, the copyright under them; no logo */
	.single .lmm-footer.lmm-footer {
		padding: 10px 0;
	}

	.single .lmm-footer .lmm-footer__row.lmm-footer__row {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.single nav.lmm-footer__menu {
		order: 1;
		padding: 0 15px;
		font-size: 15px;
	}

	.single .lmm-footer__menu .wp-block-navigation__container {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0;
	}

	.single .lmm-footer__menu .wp-block-navigation-item.wp-block-navigation-item {
		order: 0;
	}

	.single .lmm-footer__menu .wp-block-navigation-item__content.wp-block-navigation-item__content {
		padding: 3px 10px;
	}

	.single .lmm-footer__copy.lmm-footer__copy {
		order: 2;
		margin: 20px 0 40px;
		padding: 0 15px;
	}

	.single .lmm-footer__logo.lmm-footer__logo {
		display: none;
	}

	/* Home: 30px / 20px inside the list, picture above text with no gap */
	.lmm-layout > .lmm-list-box.lmm-list-box {
		padding: 30px 20px;
	}

	.lmm-home-row.lmm-home-row {
		flex-direction: column;
		gap: 0;
	}

	.lmm-podcast.lmm-podcast {
		margin-top: 20px;
	}

	.lmm-podcast .lmm-side-title.lmm-side-title {
		display: none;
	}

	.lmm-home-row__image,
	.lmm-home-row__text {
		flex-basis: auto;
		width: 100%;
	}

	.lmm-box {
		padding: 30px 16px;
	}

	.lmm-box__title,
	.lmm-box .wp-block-query-title {
		font-size: 26px;
	}

	.lmm-page__content .lmm-box__title {
		font-size: 20px;
	}

	.lmm-row.lmm-row {
		flex-direction: column;
		align-items: flex-start;
		gap: 2px;
	}

	/* Category, tag, date and search pages: the box keeps 30px inside on phones */
	.lmm-main--archive .lmm-box--list.lmm-box--list {
		padding-left: 30px;
		padding-right: 30px;
	}

	.lmm-box--cta p {
		font-size: 13px;
		line-height: 1.5;
	}

	.lmm-box--cta .lmm-outline-button .wp-block-button__link {
		font-size: 18px;
		line-height: 18px;
	}

	.lmm-row__date {
		flex-basis: auto;
	}

	.lmm-cards .wp-block-post-template {
		grid-template-columns: 1fr;
	}

	.lmm-cards .lmm-no-results.lmm-no-results {
		width: 100%;
	}

	.lmm-item.wp-block-columns {
		grid-template-columns: 1fr;
	}

	.lmm-item__text.lmm-item__text {
		padding-top: 0;
	}

	.lmm-item__image img {
		margin-bottom: 20px;
	}

	.lmm-item__image .lmm-flush-mobile img {
		margin-bottom: 0;
	}

	.lmm-section-title.lmm-section-title {
		font-size: 16px;
		line-height: 16px;
	}

	.lmm-crypto {
		display: none;
	}


	.lmm-disclosure {
		display: none;
	}

	.lmm-podcast {
		position: static;
	}

	.lmm-ta-mobile-center {
		text-align: center;
	}

	.lmm-ta-mobile-left {
		text-align: left;
	}

	/* 404 on phones: the section starts at the top and is only as tall as the boxes; columns stack */
	.lmm-main.lmm-main--404 {
		display: block;
		min-height: 0;
		margin: 0;
		padding: 15px;
	}

	.lmm-box--404-title.lmm-box--404-title {
		padding: 30px;
	}

	.lmm-box--404-title .lmm-box__title.lmm-box__title {
		font-size: 20px;
		line-height: 32px;
	}

	.lmm-404 > .wp-block-column:nth-child(3) {
		padding-top: 10px;
	}

	.lmm-box--404.lmm-box--404 {
		padding: 20px;
	}

	.lmm-404.wp-block-columns {
		grid-template-columns: 1fr;
	}

	.lmm-404 .lmm-search-box {
		margin: 0 0 40px;
	}

	.lmm-404__hint.lmm-404__hint {
		font-size: 16px;
		line-height: 30px;
	}

	/* Elementor's phone setting: the button 2.2 times the field's height */
	.lmm-404 .lmm-search-box .wp-block-search__button {
		min-width: 110px;
	}

	.lmm-fs-mobile-16 {
		font-size: 16px;
	}

	/* Header: menu button in the left fifth (centred in the bar), search in the rest */
	.lmm-header:not(.lmm-header--post) nav.lmm-menu.wp-block-navigation {
		flex: 0 0 20%;
		margin-bottom: 0;
	}

	.lmm-header:not(.lmm-header--post) .lmm-navbar__search {
		flex: 0 0 80%;
		padding-right: 20px;
	}

	/* Footer: square logo and links side by side, copyright centred underneath, links in Elementor's
	   phone order (Affiliate Program, Affiliate Disclosure, Privacy Policy, Medical, Site-wide) */
	.lmm-footer.lmm-footer {
		padding: 20px 0 10px;
	}

	/* Footer on phones: logo and links side by side in two halves, both at the bottom of the row (the logo
	   fills its half less 20px each side, so it grows with the screen), the copyright across underneath */
	.lmm-footer .lmm-footer__row {
		display: grid;
		grid-template-columns: 50% 50%;
		grid-template-areas: "logo menu" "copy copy";
		gap: 0;
		align-items: end;
	}

	.lmm-footer__logo {
		display: block;
		grid-area: logo;
		margin: 0;
		padding: 0 20px;
	}

	/* The logo's own proportions, so the lazy-load placeholder takes its final size */
	.lmm-footer__logo img {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: auto 1000 / 692;
	}

	nav.lmm-footer__menu {
		grid-area: menu;
		padding-right: 20px;
		font-size: 14px;
	}

	/* Elementor's icon list: 20px links, 5px apart */
	.lmm-footer__menu .wp-block-navigation__container {
		flex-direction: column;
		align-items: flex-start;
		gap: 5px;
	}

	.lmm-footer__menu .wp-block-navigation-item:nth-child(1) { order: 3; }
	.lmm-footer__menu .wp-block-navigation-item:nth-child(2) { order: 1; }
	.lmm-footer__menu .wp-block-navigation-item:nth-child(3) { order: 2; }
	.lmm-footer__menu .wp-block-navigation-item:nth-child(4) { order: 4; }
	.lmm-footer__menu .wp-block-navigation-item:nth-child(5) { order: 5; }

	.lmm-footer__menu .wp-block-navigation-item:not(:last-child)::after {
		content: none;
	}

	.single .lmm-footer__menu .wp-block-navigation-item:not(:last-child)::after {
		content: "";
	}

	.lmm-footer__menu .wp-block-navigation-item__content {
		padding: 0;
	}

	.lmm-footer__copy {
		grid-area: copy;
		padding: 20px 15px 5px;
		text-align: center;
	}
}

/* ---------- Printing (Hello Elementor's print rules, as the old site printed) ---------- */

@media print {
	*,
	::before,
	::after {
		background: transparent !important;
		box-shadow: none !important;
		color: #000 !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]::after {
		content: " (" attr(href) ")";
	}

	abbr[title]::after {
		content: " (" attr(title) ")";
	}

	a[href^="#"]::after,
	a[href^="javascript:"]::after {
		content: "";
	}

	pre {
		white-space: pre-wrap !important;
	}

	blockquote,
	pre {
		border: 1px solid #ccc;
		break-inside: avoid;
	}

	thead {
		display: table-header-group;
	}

	img,
	tr {
		break-inside: avoid;
	}

	h2,
	h3,
	p {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		break-after: avoid;
	}
}