/*
 * Buying an ad — the chooser, sign-up steps, checkout, upload, status
 * timeline and Listings & ads rows (inc/ad-purchase-flow.php,
 * inc/ad-upload.php) — and, since 2026-09-17, the Directory listings band and
 * tier columns that share /advertise/ with them (inc/standard-pages.php).
 *
 * From the Claude Design handoff of 2026-09-17. Tokens only: every colour,
 * size and space is a var(--lts-*) from ltsq-tokens.css. Radius 0, no shadows
 * on cards, colour-only transitions. Loaded after ltsq-design-system.css on
 * the pages of the journey only.
 */

/* --------------------------------------------------------------------------
 * Shared
 * ------------------------------------------------------------------------ */

.ltsq-adflow,
.ltsq-adtask,
.ltsq-adcheckout,
.ltsq-bizsignup,
.ltsq-adrows,
.ltsq-adhelp {
	font-family: var(--lts-font-ui);
	color: var(--lts-text);
}

.ltsq-adflow { margin: 0 0 var(--lts-space-5); }

.ltsq-adflow__h2 {
	margin: 0 0 var(--lts-space-3);
	padding: 0 0 var(--lts-space-2);
	border-bottom: var(--lts-rule-section);
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-section-header);
	font-weight: 800;
	letter-spacing: var(--lts-ls-section-header);
	text-transform: uppercase;
	color: var(--lts-ink);
}

.ltsq-adflow__title {
	margin: 0 0 var(--lts-space-2);
	font-family: var(--lts-font-display);
	font-size: var(--lts-fs-page-title);
	font-weight: 600;
	line-height: var(--lts-lh-page-title);
	color: var(--lts-ink);
}

.ltsq-adflow__title:focus { outline: none; }

.ltsq-adflow__lede {
	max-width: var(--lts-measure-dek);
	margin: 0 0 var(--lts-space-4);
	font-size: 18px;
	line-height: var(--lts-lh-dek);
	color: var(--lts-text-dek);
}

.ltsq-adflow__eyebrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0 0 var(--lts-space-2);
	font-size: var(--lts-fs-meta);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-teal-pressed);
}

.ltsq-adflow__eyebrow-extra {
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--lts-text-muted);
}

.ltsq-adflow .screen-reader-text,
.ltsq-adtask .screen-reader-text,
.ltsq-adrows .screen-reader-text,
.ltsq-adsteps .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.ltsq-adflow .ltsq-btn,
.ltsq-adtask .ltsq-btn,
.ltsq-bizsignup .ltsq-btn,
.ltsq-adrows .ltsq-btn,
.ltsq-adminis .ltsq-btn,
.ltsq-adhelp .ltsq-btn {
	min-height: 48px;
}

.ltsq-adflow .ltsq-btn[disabled],
.ltsq-adtask .ltsq-btn[disabled] {
	opacity: .45;
	cursor: not-allowed;
}

.ltsq-adflow a:not(.ltsq-btn),
.ltsq-adtask a:not(.ltsq-btn),
.ltsq-bizsignup a:not(.ltsq-btn),
.ltsq-adrows a:not(.ltsq-btn),
.ltsq-adcheckout a:not(.ltsq-btn) {
	color: var(--lts-teal-pressed);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Touch or pointer copy ("Tap to choose" / "Drag a file here"). */
.ltsq-only-touch { display: none; }
@media (hover: none) and (pointer: coarse) {
	.ltsq-only-touch { display: inline; }
	.ltsq-only-pointer { display: none; }
}

/*
 * A full-width band of page content with the same gutter as .ltsq-pagegrid
 * (db-migrations/16 wraps the chooser and the upload page in it).
 */
.ltsq-pagewide {
	max-width: calc(var(--lts-maxw) + (var(--lts-gutter) * 2));
	margin: 0 auto;
	padding: 28px var(--lts-gutter) 0;
	box-sizing: border-box;
}

.ltsq-pagewide + .ltsq-pagegrid { padding-top: 0; }

/* --------------------------------------------------------------------------
 * A. /advertise/ — How it works
 * ------------------------------------------------------------------------ */

.ltsq-adhow__list.ltsq-adhow__list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 1px;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: ltsq-adhow;
	background: var(--lts-border);
	border: 1px solid var(--lts-border);
}

.ltsq-adhow__step {
	counter-increment: ltsq-adhow;
	margin: 0;
	padding: 14px 16px;
	background: var(--lts-bg);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
}

.ltsq-adhow__step::before {
	content: counter(ltsq-adhow);
	display: block;
	margin-bottom: 4px;
	font-size: 11px;
	font-weight: 800;
	color: var(--lts-teal-pressed);
}

@media (max-width: 900px) {
	.ltsq-adhow__list.ltsq-adhow__list {
		display: block;
		padding-left: 1.4em;
		list-style: decimal;
		background: none;
		border: 0;
	}
	.ltsq-adhow__step {
		padding: 0;
		font-size: 15px;
		font-weight: 400;
		line-height: 1.75;
	}
	.ltsq-adhow__step::before { content: none; }
}

/* --------------------------------------------------------------------------
 * A. Product cards
 * ------------------------------------------------------------------------ */

.ltsq-adbuys {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--lts-space-4);
}

@media (max-width: 900px) {
	.ltsq-adbuys { grid-template-columns: minmax(0, 1fr); }
}

.ltsq-adbuy {
	display: flex;
	flex-direction: column;
	gap: var(--lts-space-3);
	padding: var(--lts-space-4);
	border: 1px solid var(--lts-border);
	border-top: 3px solid var(--lts-ink);
	background: var(--lts-bg);
	scroll-margin-top: 90px;
}

.ltsq-adbuy--events_sponsor { border-top-color: var(--lts-event); }

.ltsq-adbuy > * { margin: 0; }

.ltsq-adbuy__kicker {
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: var(--lts-ls-kicker);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-adbuy .ltsq-adbuy__title {
	margin: -8px 0 0;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.15;
	color: var(--lts-ink);
}

.ltsq-adbuy__sub {
	font-size: 15px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adbuy__body {
	display: flex;
	gap: var(--lts-space-4);
	align-items: flex-start;
}

.ltsq-adbuy .ltsq-adbuy__h4 {
	margin: 0 0 6px;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-ink);
}

.ltsq-adbuy .ltsq-adbuy__where ul {
	margin: 0 0 8px;
	padding: 0 0 0 1.1em;
	font-size: var(--lts-fs-excerpt);
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adbuy__where li { padding: 0; }

.ltsq-adbuy__never,
.ltsq-adbuy__free {
	margin: 0;
	font-size: var(--lts-fs-excerpt);
	line-height: 1.6;
	color: var(--lts-text);
}

.ltsq-adbuy__dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 8px;
	background: var(--lts-teal);
	vertical-align: 1px;
}

.ltsq-adbuy__assure {
	font-size: var(--lts-fs-meta);
	line-height: 1.6;
	color: var(--lts-text-muted);
}

@media (max-width: 640px) {
	.ltsq-adbuy { padding: var(--lts-space-3); }
	.ltsq-adbuy .ltsq-adbuy__title { font-size: 24px; }
	.ltsq-adbuy__body { flex-direction: column; gap: var(--lts-space-3); }
}

/* The page sketch. */
.ltsq-admap {
	flex: 0 0 168px;
	width: 168px;
	margin: 0;
	padding: 8px;
	box-sizing: border-box;
	background: var(--lts-surface);
	border: 1px solid var(--lts-border);
	--ltsq-admap: var(--lts-ink);
}

.ltsq-admap--events_sponsor { --ltsq-admap: var(--lts-event); }

.ltsq-admap__bar {
	display: block;
	height: 10px;
	margin-bottom: 6px;
	background: var(--lts-ink);
}

.ltsq-admap__page {
	display: flex;
	gap: 6px;
}

.ltsq-admap__col {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	padding-top: 2px;
}

.ltsq-admap__line {
	display: block;
	height: 8px;
	background: var(--lts-border);
}

.ltsq-admap__line:nth-child(2n) { width: 80%; }

.ltsq-admap__well {
	display: flex;
	flex: 0 0 52px;
	align-items: center;
	justify-content: center;
	height: 48px;
	box-sizing: border-box;
	border: 2px solid var(--ltsq-admap);
	background: var(--lts-bg);
	font-size: 7px;
	font-weight: 800;
	letter-spacing: .5px;
	line-height: 1.1;
	text-align: center;
	text-transform: uppercase;
	color: var(--ltsq-admap);
}

.ltsq-admap__caption {
	margin-top: 6px;
	font-size: var(--lts-fs-badge);
	font-weight: 700;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

/* Events sponsor taken. */
.ltsq-adtaken {
	padding: 14px 16px;
	border: 1px solid var(--lts-border);
	border-left: 4px solid var(--lts-notice);
	background: var(--lts-surface);
	font-size: var(--lts-fs-excerpt);
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adtaken p { margin: 0 0 6px; }
.ltsq-adtaken p:last-child { margin-bottom: 0; }
.ltsq-adtaken strong { color: var(--lts-text); }

.ltsq-adtaken__head {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--lts-text);
}

/* The length choice: real radios, styled as rows. */
.ltsq-adbuy__form {
	display: flex;
	flex-direction: column;
	gap: var(--lts-space-3);
	padding-top: var(--lts-space-3);
	border-top: var(--lts-rule-hairline);
}

.ltsq-adlength {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0;
	margin: 0;
	padding: 0;
	border: 1px solid var(--lts-border);
	min-width: 0;
}

.ltsq-adlength__legend {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0 0 8px;
	font-size: var(--lts-fs-label);
	font-weight: 700;
	color: var(--lts-text);
	background: var(--lts-bg);
	box-shadow: 0 -1px 0 var(--lts-bg), -1px 0 0 var(--lts-bg), 1px 0 0 var(--lts-bg), 0 1px 0 var(--lts-border);
	grid-column: 1 / -1;
}

.ltsq-adlength__opt {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	min-height: 48px;
	margin: 0;
	padding: 12px 14px;
	cursor: pointer;
	transition: background-color var(--lts-transition), box-shadow var(--lts-transition);
}

.ltsq-adlength__opt + .ltsq-adlength__opt { border-left: 1px solid var(--lts-border); }

.ltsq-adlength__opt input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}

.ltsq-adlength__opt:has(input:checked) {
	background: var(--lts-surface);
	box-shadow: inset 0 0 0 2px var(--lts-teal);
}

.ltsq-adlength__opt:has(input:focus-visible) {
	outline: var(--lts-focus-ring);
	outline-offset: var(--lts-focus-offset);
}

.ltsq-adlength__name {
	font-size: 15px;
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adlength__price {
	font-size: 14px;
	color: var(--lts-text-dek);
}

.ltsq-adlength__opt:has(input:checked) .ltsq-adlength__price { color: var(--lts-text); font-weight: 700; }

.ltsq-adlength__save {
	display: inline-block;
	margin-left: 6px;
	padding: 3px 6px;
	background: var(--lts-teal);
	color: #fff;
	font-size: var(--lts-fs-badge);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	vertical-align: 2px;
}

@media (max-width: 640px) {
	.ltsq-adlength { grid-template-columns: minmax(0, 1fr); }
	.ltsq-adlength__opt {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	.ltsq-adlength__opt + .ltsq-adlength__opt { border-left: 0; border-top: 1px solid var(--lts-border); }
	.ltsq-adlength__best { display: none; }
}

.ltsq-adbuy__go {
	width: 100%;
	font-size: 15px;
	text-align: center;
	line-height: 1.3;
}

.ltsq-adbuy__go.is-empty {
	background: var(--lts-bg);
	color: var(--lts-ink);
	box-shadow: inset 0 0 0 2px var(--lts-ink);
}

/* Help row. */
.ltsq-adhelp {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 340px);
	gap: var(--lts-space-4);
	align-items: start;
	margin: 0 0 var(--lts-space-5);
}

.ltsq-adhelp__ask {
	padding: 18px 20px;
	border: 1px solid var(--lts-border);
	border-left: 4px solid var(--lts-ink);
	background: var(--lts-surface);
	font-size: 15px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adhelp__ask p { margin: 0 0 12px; }
.ltsq-adhelp__ask p:last-child { margin: 0; }

.ltsq-adhelp .ltsq-adhelp__title {
	margin: 0 0 8px;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 22px;
	font-weight: 600;
	color: var(--lts-ink);
}

.ltsq-adhelp__example { margin: 0; }

.ltsq-adhelp__note {
	max-width: 300px;
	margin: 8px 0 0;
	font-size: var(--lts-fs-meta);
	line-height: 1.6;
	color: var(--lts-text-muted);
}

.ltsq-adsample {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	width: 300px;
	max-width: 100%;
	aspect-ratio: 300 / 250;
	box-sizing: border-box;
	padding: 24px;
	border: 1px solid var(--lts-border);
	background: var(--lts-surface);
}

.ltsq-adsample__name {
	font-family: var(--lts-font-display);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--lts-ink);
}

.ltsq-adsample__rule {
	display: block;
	width: 48px;
	height: 2px;
	margin: 4px 0;
	background: var(--lts-teal);
}

.ltsq-adsample__line { font-size: 14px; color: var(--lts-text-dek); }

.ltsq-adsample__url {
	margin-top: 6px;
	font-size: 12px;
	font-weight: 700;
	color: var(--lts-teal-pressed);
}

@media (max-width: 900px) {
	.ltsq-adhelp { grid-template-columns: minmax(0, 1fr); }
}

/* The inquiry form the "Ask a question" button jumps to. */
#ltsq-ad-ask { scroll-margin-top: 90px; }

/* --------------------------------------------------------------------------
 * B/C. Steps and the order summary
 * ------------------------------------------------------------------------ */

.ltsq-adsteps.ltsq-adsteps {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0 0 var(--lts-space-3);
	padding: 0;
	list-style: none;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	font-weight: 700;
	color: var(--lts-text-muted);
}

.ltsq-adsteps__step {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 0;
}

.ltsq-adsteps__step + .ltsq-adsteps__step::before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 1px;
	margin-right: 6px;
	background: var(--lts-border);
}

.ltsq-adsteps__step.is-done { color: var(--lts-teal-pressed); }

@media (max-width: 640px) {
	.ltsq-adsteps.ltsq-adsteps { gap: 4px 6px; font-size: 12px; }
	.ltsq-adsteps__step + .ltsq-adsteps__step::before { width: 10px; margin-right: 4px; }
}
.ltsq-adsteps__step.is-current { color: var(--lts-text); }

.ltsq-adsummary {
	padding: 20px;
	border: 1px solid var(--lts-border);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
	font-size: 14px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adsummary > p { margin: 0 0 8px; }
.ltsq-adsummary > p:last-child { margin-bottom: 0; }

.ltsq-adsummary__kicker {
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: var(--lts-ls-kicker);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-adsummary .ltsq-adsummary__title {
	margin-bottom: 2px;
	font-family: var(--lts-font-display);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--lts-ink);
}

.ltsq-adsummary__meta { font-weight: 600; color: var(--lts-text); }

.ltsq-adsummary .ltsq-adsummary__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin: 12px 0;
	padding-top: 12px;
	border-top: var(--lts-rule-hairline);
	font-size: 15px;
}

.ltsq-adsummary__total strong {
	font-size: 22px;
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adsummary__assure { font-size: var(--lts-fs-meta); color: var(--lts-text-muted); }

.ltsq-adsummary--compact { margin: 0 0 var(--lts-space-3); padding: 14px; }
.ltsq-adsummary--compact .ltsq-adsummary__title { font-size: 20px; }

@media (max-width: 640px) {
	.ltsq-adsummary { padding: 14px; }
	.ltsq-adsummary .ltsq-adsummary__title { font-size: 20px; }
	.ltsq-adsummary__total strong { font-size: 18px; }
}

/* --------------------------------------------------------------------------
 * B. Business sign-up, as a step of buying
 * ------------------------------------------------------------------------ */

.ltsq-signin.ltsq-bizsignup--ad { max-width: calc(1080px + (var(--lts-gutter) * 2)); }
.ltsq-signin.ltsq-bizsignup--narrow { max-width: calc(640px + (var(--lts-gutter) * 2)); }

.ltsq-bizsignup__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: var(--lts-space-5);
	align-items: start;
}

@media (max-width: 900px) {
	.ltsq-bizsignup__grid { grid-template-columns: minmax(0, 1fr); gap: var(--lts-space-4); }
	/* The summary first on a phone: the buyer sees what this is for. */
	.ltsq-bizsignup__side { order: -1; }
}

.ltsq-bizform__row { margin: 0 0 var(--lts-space-3); }

.ltsq-bizform__row label {
	display: block;
	margin-bottom: 6px;
	font-size: var(--lts-fs-label);
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-bizform__control {
	position: relative;
	display: block;
	max-width: 460px;
}

.ltsq-bizsignup .ltsq-bizform__row input {
	width: 100%;
	max-width: 460px;
	min-height: 48px;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid var(--lts-border);
	border-radius: var(--lts-radius);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-input);
	color: var(--lts-text);
}

.ltsq-bizform__control input[type="password"],
.ltsq-bizform__control input[data-revealed] { padding-right: 76px; }

.ltsq-bizform__reveal {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 64px;
	height: 100%;
	padding: 0 12px;
	border: 0;
	background: transparent;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	font-weight: 700;
	color: var(--lts-teal-pressed);
	cursor: pointer;
}

.ltsq-bizform__help {
	display: block;
	margin-top: 6px;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

.ltsq-bizsignup .ltsq-bizform__row.has-error input { border-color: var(--lts-alert); }

.ltsq-bizform__submit { min-width: 260px; }

@media (max-width: 640px) {
	.ltsq-bizform__submit { width: 100%; }
}

.ltsq-bizsignup__owner {
	max-width: 76ch;
	margin: var(--lts-space-4) 0 0;
	padding: 12px 14px;
	border: 1px solid var(--lts-border);
	border-left: 4px solid var(--lts-ink);
	background: var(--lts-surface);
	font-size: var(--lts-fs-meta);
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-bizcheck__sent { margin: 0 0 8px; font-size: 16px; }

.ltsq-bizcheck__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin: var(--lts-space-3) 0;
}

.ltsq-bizsignup__go { min-width: 260px; }

.ltsq-bizsignup .ltsq-adsummary { margin-bottom: var(--lts-space-3); }

/* --------------------------------------------------------------------------
 * C. Checkout, for an ad
 * ------------------------------------------------------------------------ */

.ltsq-adcheckout__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	gap: var(--lts-space-5);
	align-items: start;
}

/* The block's own sidebar repeats the summary; ours carries the promises. */
.ltsq-adcheckout .wc-block-checkout.wc-block-components-sidebar-layout { display: block; }
.ltsq-adcheckout .wc-block-components-main { width: 100% !important; padding-right: 0 !important; }
.ltsq-adcheckout .wc-block-checkout__sidebar { width: 100% !important; padding-left: 0 !important; margin-top: var(--lts-space-3); }

/* Our summary replaces the block's own (which shows plugin wording). */
.ltsq-adcheckout .wc-block-checkout__sidebar { display: none !important; }

.ltsq-adcheckout .wc-block-components-checkout-place-order-button {
	min-height: 52px;
	border-radius: var(--lts-radius);
	background: var(--lts-teal);
	color: #fff;
	font-family: var(--lts-font-ui);
	font-size: 16px;
	font-weight: 700;
}

.ltsq-adcheckout .wc-block-components-checkout-place-order-button:hover,
.ltsq-adcheckout .wc-block-components-checkout-place-order-button:focus {
	background: var(--lts-teal-pressed);
	color: #fff;
}

.ltsq-adcheckout .wc-block-components-checkout-place-order-button:disabled,
.ltsq-adcheckout .wc-block-components-checkout-place-order-button--loading { opacity: .45; }

.ltsq-adcheckout .wc-block-checkout__order-notes,
.ltsq-adcheckout .wp-block-woocommerce-checkout-order-note-block,
.ltsq-adcheckout .wc-block-components-totals-coupon { display: none !important; }

.ltsq-adcheckout__trust {
	margin: var(--lts-space-3) 0 0;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

.ltsq-adcheckout__side { position: sticky; top: 24px; }

@media (max-width: 900px) {
	.ltsq-adcheckout__grid { grid-template-columns: minmax(0, 1fr); gap: var(--lts-space-3); }
	.ltsq-adcheckout__side { position: static; order: -1; }
}

/* The page's own (now empty) title band on an ad checkout. */
.ltsq-is-ad-checkout .entry-title:empty,
.ltsq-is-ad-checkout .main_title:empty,
.ltsq-is-ad-checkout .et_pb_post_title .entry-title:empty { display: none; }

/* --------------------------------------------------------------------------
 * D. The upload task
 * ------------------------------------------------------------------------ */

.ltsq-adtask { margin: 0 0 var(--lts-space-5); }

.ltsq-adtask__item + .ltsq-adtask__item { margin-top: var(--lts-space-5); }

.ltsq-adupload__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
	gap: var(--lts-space-5);
	align-items: start;
}

.ltsq-adupload__grid:has(.ltsq-adupload__insitu[hidden]) { grid-template-columns: minmax(0, 640px); }

@media (max-width: 980px) {
	.ltsq-adupload__grid,
	.ltsq-adupload__grid:has(.ltsq-adupload__insitu[hidden]) { grid-template-columns: minmax(0, 1fr); }
}

.ltsq-adupload__insitu {
	padding-left: var(--lts-space-4);
	border-left: var(--lts-rule-column);
}

@media (max-width: 980px) {
	.ltsq-adupload__insitu { padding-left: 0; border-left: 0; }
}

.ltsq-adupload__group { margin: 0 0 var(--lts-space-4); }

.ltsq-adupload .ltsq-adupload__label {
	display: block;
	margin: 0 0 6px;
	font-size: var(--lts-fs-label);
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adupload__zone {
	position: relative;
	border: 2px dashed var(--lts-teal);
	background: var(--lts-surface);
	transition: background-color var(--lts-transition), border-color var(--lts-transition);
}

.ltsq-adupload__zone.is-dragover { background: var(--lts-bg); border-color: var(--lts-teal-pressed); }

/* The input stays in the page (focusable, labelled); the label is the target. */
.ltsq-adupload__file {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.ltsq-adupload__file:focus-visible + .ltsq-adupload__drop {
	outline: var(--lts-focus-ring);
	outline-offset: var(--lts-focus-offset);
}

.ltsq-adupload__drop {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 24px 16px;
	text-align: center;
	color: var(--lts-teal-pressed);
	cursor: pointer;
}

.ltsq-adupload__cta {
	font-size: 16px;
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adupload__help {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adupload__choose { pointer-events: none; min-height: 48px; }

.ltsq-adupload__alt {
	margin: 8px 0 0;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

/* The chosen image, at its real size. */
.ltsq-adupload__preview { margin: 0 0 12px; }

.ltsq-adupload__frame {
	display: inline-block;
	max-width: 100%;
	padding: 12px;
	border: 1px solid var(--lts-border);
	background: var(--lts-bg);
}

.ltsq-adupload__frame img {
	display: block;
	width: 300px;
	max-width: 100%;
	height: auto;
}

.ltsq-adupload__ok {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 8px 0 2px;
	font-size: 14px;
	font-weight: 700;
	color: var(--lts-teal-pressed);
}

.ltsq-adupload__file-meta {
	margin: 0;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

.ltsq-adupload__again {
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-weight: 700;
	color: var(--lts-teal-pressed);
	text-decoration: underline;
	cursor: pointer;
}

/* A rejected file: a grey block with its real dimensions. */
.ltsq-adupload__reject {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 300px;
	aspect-ratio: 300 / 160;
	margin: 0 0 6px;
	background: var(--lts-border);
	font-weight: 800;
	color: var(--lts-text-dek);
}

/* The link field. */
.ltsq-adupload .ltsq-adupload__input {
	display: block;
	width: 100%;
	min-height: 48px;
	box-sizing: border-box;
	margin: 0 0 6px;
	padding: 10px 12px;
	border: 1px solid var(--lts-border);
	border-radius: var(--lts-radius);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-input);
	color: var(--lts-text);
}

.ltsq-adupload .ltsq-adupload__link.has-error .ltsq-adupload__input { border-color: var(--lts-alert); }

.ltsq-adupload__help.is-ok { font-weight: 700; color: var(--lts-teal-pressed); }

.ltsq-adupload__fielderr {
	margin: 6px 0 0;
	font-size: var(--lts-fs-meta);
	font-weight: 700;
	color: var(--lts-alert);
}

.ltsq-adupload__send {
	width: 100%;
	min-height: 52px !important;
	font-size: 16px;
}

.ltsq-adupload__assure {
	margin: 8px 0 0;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

.ltsq-adupload__sending { margin-top: 12px; }
.ltsq-adupload__sending p { margin: 0 0 6px; font-weight: 700; }

.ltsq-adprogress {
	display: block;
	width: 160px;
	height: 4px;
	background: var(--lts-border);
	overflow: hidden;
}

.ltsq-adprogress span {
	display: block;
	width: 40%;
	height: 100%;
	background: var(--lts-teal);
}

/* Error panels (upload and server). */
.ltsq-aderror {
	margin: 0 0 12px;
	padding: 14px 16px;
	border-left: 4px solid var(--lts-alert);
	background: var(--lts-surface);
	font-size: 14px;
	line-height: 1.6;
}

.ltsq-aderror p { margin: 0 0 6px; }
.ltsq-aderror p:last-child { margin: 0; }

.ltsq-aderror__head {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--lts-alert);
}

.ltsq-aderror__fact { color: var(--lts-text); }
.ltsq-aderror__todo { color: var(--lts-text-dek); }

/* How it will look beside an article. */
.ltsq-adinsitu {
	display: flex;
	gap: 16px;
	padding: 16px;
	border: 1px solid var(--lts-border);
	background: var(--lts-bg);
}

.ltsq-adinsitu__article {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.ltsq-adinsitu__kicker {
	font-size: 9px;
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-news);
}

.ltsq-adinsitu__title {
	font-family: var(--lts-font-display);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--lts-ink);
}

.ltsq-adinsitu__line {
	display: block;
	height: 6px;
	background: var(--lts-border);
}

.ltsq-adinsitu__line:nth-child(3n) { width: 70%; }

.ltsq-adinsitu__rail {
	flex: 0 0 150px;
	padding-left: 12px;
	border-left: var(--lts-rule-column);
}

.ltsq-adinsitu__label,
.ltsq-adcreative__label {
	display: block;
	margin: 0 0 4px;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-adinsitu__well img {
	display: block;
	width: 150px;
	height: auto;
}

@media (min-width: 981px) {
	.ltsq-adinsitu { flex-direction: column; }
	.ltsq-adinsitu__rail { flex: none; padding-left: 0; padding-top: 12px; border-left: 0; border-top: var(--lts-rule-column); }
	.ltsq-adinsitu__well img { width: 300px; }
}

/* Panels: what happens next, approved, ended. */
.ltsq-adpanel {
	margin: 0 0 var(--lts-space-3);
	padding: 16px 18px;
	border-left: 4px solid var(--lts-ink);
	background: var(--lts-surface);
	font-size: 15px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adpanel--ok { border-left-color: var(--lts-teal); }
.ltsq-adpanel p { margin: 0 0 8px; }
.ltsq-adpanel p:last-child { margin: 0; }
.ltsq-adpanel strong { color: var(--lts-text); }

.ltsq-adtask .ltsq-adpanel__title,
.ltsq-adpanel .ltsq-adpanel__title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 6px;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: 15px;
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adpanel--ok .ltsq-adpanel__title .ltsq-icon { color: var(--lts-teal-pressed); }

.ltsq-adnext { max-width: 640px; margin-top: var(--lts-space-4); }

.ltsq-adconfirming { max-width: 640px; }
.ltsq-adconfirming .ltsq-adprogress { margin: 4px 0 8px; }


.ltsq-adlater {
	max-width: 640px;
	margin-top: var(--lts-space-4);
	padding-top: var(--lts-space-4);
	border-top: var(--lts-rule-hairline);
	font-size: 15px;
	line-height: 1.6;
	color: var(--lts-text-dek);
}

.ltsq-adlater p { margin: 0 0 12px; }

.ltsq-adtask .ltsq-adlater__title {
	margin: 0 0 6px;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: 15px;
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-adlater__alt { font-size: var(--lts-fs-meta); color: var(--lts-text-muted); }

.ltsq-adcreative { margin: 0 0 var(--lts-space-3); }

.ltsq-adcreative img {
	display: block;
	width: 300px;
	max-width: 100%;
	height: auto;
	border: 1px solid var(--lts-border);
}

.ltsq-adcreative__link { margin: 6px 0 0; font-size: var(--lts-fs-meta); color: var(--lts-text-muted); }

.ltsq-adstatus { margin: 0 0 var(--lts-space-4); }

.ltsq-adstatus .ltsq-adstatus__name {
	margin: 0 0 var(--lts-space-3);
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 22px;
	font-weight: 600;
	color: var(--lts-ink);
}

.ltsq-adstatus__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin: var(--lts-space-4) 0 0;
}

.ltsq-adreceipt {
	margin-top: var(--lts-space-5);
	padding-top: var(--lts-space-3);
	font-family: var(--lts-font-ui);
}

@media (max-width: 640px) {
	.ltsq-adflow__title { font-size: 28px; line-height: 1.12; }
	.ltsq-adflow__lede { font-size: 15px; }
}

/* --------------------------------------------------------------------------
 * E. The status timeline
 * ------------------------------------------------------------------------ */

.ltsq-adtimeline.ltsq-adtimeline {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--lts-font-ui);
}

.ltsq-adtimeline__step {
	position: relative;
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	margin: 0;
	padding: 24px 12px 0 0;
}

/* The connector to the next step. */
.ltsq-adtimeline__step::after {
	content: "";
	position: absolute;
	top: 6px;
	left: 14px;
	right: 0;
	height: 2px;
	background: var(--lts-border);
}

.ltsq-adtimeline__step:last-child::after { display: none; }
.ltsq-adtimeline__step.is-done::after { background: var(--lts-teal); }

.ltsq-adtimeline__mark {
	position: absolute;
	top: 0;
	left: 0;
	width: 14px;
	height: 14px;
	box-sizing: border-box;
	background: var(--lts-bg);
	box-shadow: inset 0 0 0 2px var(--lts-border);
}

.ltsq-adtimeline__step.is-done .ltsq-adtimeline__mark { background: var(--lts-teal); box-shadow: none; }
.ltsq-adtimeline__step.is-current .ltsq-adtimeline__mark { box-shadow: inset 0 0 0 2px var(--lts-ink); }

.ltsq-adtimeline__label {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--lts-text);
}

.ltsq-adtimeline__step.is-next .ltsq-adtimeline__label { color: var(--lts-text-muted); }

.ltsq-adtimeline__sub {
	font-size: var(--lts-fs-meta);
	line-height: 1.45;
	color: var(--lts-text-muted);
}

@media (max-width: 640px) {
	.ltsq-adtimeline.ltsq-adtimeline { flex-direction: column; }
	.ltsq-adtimeline__step { padding: 0 0 18px 28px; }
	.ltsq-adtimeline__step::after {
		top: 14px;
		bottom: 0;
		left: 6px;
		right: auto;
		width: 2px;
		height: auto;
	}
	.ltsq-adtimeline__label { font-size: 15px; }
}

.ltsq-adtimeline-line {
	display: none;
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--lts-text-dek);
}

.ltsq-adtimeline-line strong { color: var(--lts-text); }

/* --------------------------------------------------------------------------
 * F. Listings & ads
 * ------------------------------------------------------------------------ */

.ltsq-adrows.ltsq-adrows {
	margin: 0 0 var(--lts-space-3);
	padding: 0;
	list-style: none;
	border: 1px solid var(--lts-border);
}

.ltsq-adrow {
	display: flex;
	gap: var(--lts-space-4);
	margin: 0;
	padding: 20px;
}

.ltsq-adrow + .ltsq-adrow { border-top: 1px solid var(--lts-border); }

.ltsq-adrow__what { flex: 0 0 280px; min-width: 0; }
.ltsq-adrow__progress { flex: 1 1 auto; min-width: 0; }

.ltsq-adrow__act {
	display: flex;
	flex: 0 0 200px;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
}

.ltsq-adrows .ltsq-adrow__name {
	margin: 0 0 4px;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--lts-ink);
}

.ltsq-adrow__meta {
	margin: 0 0 10px;
	font-size: 14px;
	color: var(--lts-text-dek);
}

.ltsq-adrow__extra,
.ltsq-adrow__note {
	margin: 10px 0 0;
	font-size: var(--lts-fs-meta);
	color: var(--lts-text-muted);
}

.ltsq-adrow__note { margin: 0; }

.ltsq-adrow__receipt { font-size: 14px; }

.ltsq-adrow__alt {
	font-size: var(--lts-fs-meta);
	text-align: center;
}

.ltsq-adrow__extensions {
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--lts-fs-meta);
	line-height: 1.7;
	color: var(--lts-text-muted);
}

.ltsq-adrow__extensions li { margin: 0; padding: 0; }

/* Naming an ad: a plain form, closed until asked for. */
.ltsq-adrename {
	margin: 10px 0 0;
	font-size: var(--lts-fs-meta);
}

.ltsq-adrename > summary {
	cursor: pointer;
	font-weight: 700;
	color: var(--lts-teal-pressed);
}

.ltsq-adrename form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.ltsq-adrename__input {
	flex: 1 1 160px;
	min-height: 44px;
	box-sizing: border-box;
	padding: 8px 10px;
	border: 1px solid var(--lts-border);
	border-radius: var(--lts-radius);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
	font-size: 14px;
	color: var(--lts-text);
}

.ltsq-adrows .ltsq-adrename__save { min-height: 44px; padding: 8px 14px; }
.ltsq-adrename .ltsq-adupload__help { flex: 1 1 100%; margin: 0; }

/*
 * The account view's content column is narrower than the handoff's 1280
 * artboard: there, the timeline takes its own full-width line under the name
 * and the action.
 */
.ltsq-adrows.ltsq-adrows { container-type: inline-size; }

@container (max-width: 1000px) {
	.ltsq-adrow { flex-wrap: wrap; row-gap: 16px; }
	.ltsq-adrow__what { flex: 1 1 260px; }
	.ltsq-adrow__act { flex: 0 0 200px; }
	.ltsq-adrow__progress { order: 3; flex: 1 1 100%; }
}

.ltsq-adbadge {
	display: inline-block;
	padding: 5px 8px;
	font-family: var(--lts-font-ui);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	line-height: 1.2;
	text-transform: uppercase;
}

.ltsq-adbadge--todo { background: var(--lts-ink); color: #fff; }
.ltsq-adbadge--review { background: var(--lts-surface); box-shadow: inset 0 0 0 1px var(--lts-ink); color: var(--lts-ink); }
.ltsq-adbadge--running { background: var(--lts-teal-pressed); color: #fff; }
.ltsq-adbadge--ended { background: var(--lts-surface); box-shadow: inset 0 0 0 1px var(--lts-border); color: var(--lts-text-muted); }

@media (max-width: 900px) {
	.ltsq-adrows.ltsq-adrows { border: 0; }
	.ltsq-adrow {
		flex-direction: column;
		gap: 12px;
		margin: 0 0 12px;
		padding: 16px;
		border: 1px solid var(--lts-border);
	}
	.ltsq-adrow + .ltsq-adrow { border-top: 1px solid var(--lts-border); }
	.ltsq-adrow--paid_no_image { border-left: 4px solid var(--lts-ink); }
	.ltsq-adrow__what,
	.ltsq-adrow__act { flex: none; }
	.ltsq-adrow__progress .ltsq-adtimeline { display: none; }
	.ltsq-adrow__progress .ltsq-adtimeline-line { display: block; }
	.ltsq-adrow__what { display: flex; flex-direction: column; }
	.ltsq-adrow__what .ltsq-adbadge { order: -1; align-self: flex-start; margin-bottom: 8px; }
	.ltsq-adrows .ltsq-adrow__progress { order: 2; }
	.ltsq-adrows .ltsq-adrow__act { order: 3; }
	.ltsq-adrows .ltsq-adrow__name { font-size: 20px; }
}

/* .ltsq-adbuymore — the "buy another" row under the ad rows — went on
   2026-09-17 with the panel header that replaced it. */

.ltsq-adempty {
	margin: 0 0 var(--lts-space-3);
	padding: 18px 20px;
	border: 1px solid var(--lts-border);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
}

.ltsq-adempty__title {
	margin: 0 0 4px;
	font-family: var(--lts-font-display);
	font-size: 22px;
	font-weight: 600;
	color: var(--lts-ink);
}

.ltsq-adempty__body { margin: 0; font-size: 15px; color: var(--lts-text-dek); }

.ltsq-adminis {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 var(--lts-space-4);
}

.ltsq-admini {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 16px;
	border: 1px solid var(--lts-border);
	border-top: 3px solid var(--lts-ink);
	font-family: var(--lts-font-ui);
}

.ltsq-admini + .ltsq-admini { border-top-color: var(--lts-event); }

.ltsq-adminis .ltsq-admini__name {
	margin: 0;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 20px;
	font-weight: 600;
	color: var(--lts-ink);
}

.ltsq-admini__body { margin: 0; font-size: 14px; line-height: 1.6; color: var(--lts-text-dek); }

@media (max-width: 640px) {
	.ltsq-adminis { grid-template-columns: minmax(0, 1fr); }
	.ltsq-admini .ltsq-btn { width: 100%; }
}

/* --------------------------------------------------------------------------
 * F2. Listings & ads — the two panels, and the listing rows
 *
 * From the Claude Design handoff of 2026-09-17. The ads half of this view was
 * already a designed row component; the listings half was an .ltsq-orgtable
 * with a 640px minimum and no stacking treatment of its own, so it scrolled
 * sideways on a phone while the ads directly under it restacked into cards.
 * Same page, two different eras.
 *
 * Both halves are now the same frame: a ruled panel with a heading, a count and
 * one primary action, accented by what it holds — Directory green over the
 * listings, ink over the ads.
 * ------------------------------------------------------------------------ */

.ltsq-bizpanel {
	margin: 0 0 var(--lts-space-5);
	border: 1px solid var(--lts-border);
	border-radius: var(--lts-radius);
}

.ltsq-bizpanel--listings { border-top: var(--lts-stream-border-top) solid var(--lts-directory); }
.ltsq-bizpanel--ads { border-top: var(--lts-stream-border-top) solid var(--lts-ink); }

.ltsq-bizpanel__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--lts-space-3);
	padding: 16px 20px;
	border-bottom: 1px solid var(--lts-border);
	background: var(--lts-surface);
}

.ltsq-bizpanel .ltsq-bizpanel__title {
	flex: 1;
	min-width: 0;
	margin: 0;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 24px;
	font-weight: 600;
	color: var(--lts-ink);
}

.ltsq-bizpanel__count.ltsq-bizpanel__count {
	margin: 0;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-bizpanel__action.ltsq-bizpanel__action {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: #fff;
}

/* The action is coloured by what the panel holds, not by the site primary. */
.ltsq-bizpanel--listings .ltsq-bizpanel__action { background: var(--lts-directory); }
.ltsq-bizpanel--ads .ltsq-bizpanel__action { background: var(--lts-teal); }

.ltsq-bizpanel--listings .ltsq-bizpanel__action:hover,
.ltsq-bizpanel--listings .ltsq-bizpanel__action:focus,
.ltsq-bizpanel--ads .ltsq-bizpanel__action:hover,
.ltsq-bizpanel--ads .ltsq-bizpanel__action:focus {
	color: #fff;
	filter: var(--lts-stream-hover-filter);
}

/* Both halves' row lists sit flush inside the panel, and the ads list drops the
   border it carried when it stood alone. */
.ltsq-bizpanel .ltsq-adrows.ltsq-adrows,
.ltsq-bizpanel .ltsq-bizrows {
	margin: 0;
	border: 0;
}

/* An empty panel keeps its own frame rather than drawing a second one inside. */
.ltsq-bizpanel .ltsq-empty,
.ltsq-bizpanel .ltsq-adempty {
	margin: 0;
	border: 0;
	background: var(--lts-bg);
}

/* The empty ads state explains the two products underneath. Standing alone it
   supplied its own gutter from the page; inside the panel it needs one. */
.ltsq-bizpanel .ltsq-adminis {
	margin: 0;
	padding: 0 20px 20px;
}

/* The rows ------------------------------------------------------------- */

.ltsq-bizrows {
	margin: 0;
	padding: 0;
	list-style: none;
	container-type: inline-size;
}

.ltsq-bizrow {
	display: flex;
	flex-wrap: wrap;
	gap: var(--lts-space-4);
	row-gap: var(--lts-space-3);
	margin: 0;
	padding: 20px;
}

.ltsq-bizrow + .ltsq-bizrow { border-top: 1px solid var(--lts-border); }

/* Changes held for an editor: the amber the rest of the site uses for "someone
   has to look at this", on the edge where it is visible while scanning. */
.ltsq-bizrow--held { border-left: var(--lts-stream-border-left) solid var(--lts-notice); }

.ltsq-bizrow__what { flex: 1 1 260px; min-width: 0; }
.ltsq-bizrow__plan { flex: 1 1 240px; min-width: 0; }

.ltsq-bizrow__act {
	display: flex;
	flex: 0 1 190px;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	min-width: 170px;
}

.ltsq-bizrow__badges.ltsq-bizrow__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 8px;
	padding: 0;
}

.ltsq-bizrows .ltsq-bizrow__name {
	margin: 0 0 4px;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--lts-ink);
}

.ltsq-bizrow__name a { color: var(--lts-ink); text-decoration: none; }
.ltsq-bizrow__name a:hover,
.ltsq-bizrow__name a:focus { color: var(--lts-directory); }

.ltsq-bizrow__meta.ltsq-bizrow__meta {
	margin: 0;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: 14px;
	line-height: 1.5;
	color: var(--lts-text-dek);
}

/* The paid-placement label CLAUDE.md requires, outlined so it reads as a
   statement about the listing rather than as another status badge. */
.ltsq-bizrow__tag.ltsq-bizrow__tag {
	display: inline-block;
	margin: 8px 0 0;
	padding: 3px 7px;
	border: 1px solid var(--lts-directory);
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-badge);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-directory);
}

.ltsq-bizrow__label.ltsq-bizrow__label {
	margin: 0 0 4px;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: var(--lts-ls-badge);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-bizrow__type.ltsq-bizrow__type {
	margin: 0;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--lts-text);
}

.ltsq-bizrow__note.ltsq-bizrow__note {
	margin: 6px 0 0;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	line-height: 1.6;
	color: var(--lts-text-muted);
}

.ltsq-bizrow__act .ltsq-btn { min-height: 44px; }

.ltsq-bizrow__link {
	font-size: var(--lts-fs-meta);
	text-align: center;
}

/*
 * The same reflow as the ad rows, but NOT at the same width, and the difference
 * is the point. Section F wraps at 1000px because an ad row carries a
 * four-step timeline with dates under it. A listing row carries a tier, a
 * renewal line and a button: 260 + 240 + 190 plus two 24px gaps is 738px, and
 * the account's own content column measures about 972px. Reusing 1000px here
 * meant the three columns the design draws never once appeared — measured, not
 * assumed. 760px is the width at which they genuinely stop fitting.
 */
@container (max-width: 760px) {
	.ltsq-bizrow__what { flex: 1 1 260px; }
	.ltsq-bizrow__act { flex: 0 0 190px; }
	.ltsq-bizrow__plan { order: 3; flex: 1 1 100%; }
}

@media (max-width: 900px) {

	.ltsq-bizpanel__head { padding: 14px 16px; }
	.ltsq-bizpanel .ltsq-bizpanel__title { font-size: 21px; }
	.ltsq-bizpanel__action.ltsq-bizpanel__action { flex: 1 1 100%; justify-content: center; }

	.ltsq-bizrow {
		flex-direction: column;
		gap: 12px;
		padding: 16px;
	}

	.ltsq-bizrow__what,
	.ltsq-bizrow__plan,
	.ltsq-bizrow__act { flex: none; min-width: 0; }

	/* The container query above still has an opinion about order at this width,
	   so both are re-asserted rather than left to cascade order. */
	.ltsq-bizrows .ltsq-bizrow__plan { order: 2; }
	.ltsq-bizrows .ltsq-bizrow__act { order: 3; }
	.ltsq-bizrows .ltsq-bizrow__name { font-size: 20px; }
}

/* --------------------------------------------------------------------------
 * G. /advertise/ — the Directory listings band and the tier columns
 *
 * From the Claude Design handoff of 2026-09-17. The ad products above this are
 * rich cards and the listing tiers below them were a three-column table with a
 * 640px minimum inside a 1fr/320px grid, so on anything narrower than a laptop
 * the thing a business is meant to buy scrolled sideways inside its own box.
 *
 * FULL BLEED WITHOUT A WIDTH HACK. /advertise/ carries
 * _et_pb_page_layout = et_full_width_page (db-migrations/09), so the band runs
 * the viewport simply by not capping itself, exactly as .ltsq-pagewide and
 * .ltsq-alertband already do. No negative margins, no 100vw, no scrollbar bug.
 *
 * The band carries data-stream="directory", so every --lts-stream* token inside
 * it — including .ltsq-btn--stream's fill — resolves to the Directory green
 * without a single green hex being written here.
 * ------------------------------------------------------------------------ */

/*
 * Divi gives every .entry-content p a padding-bottom of 1em at (0,1,1), which a
 * single class loses to — so the 24px price sat 24px clear of its own alternate
 * line and the kicker 11px clear of the heading. Measured, not guessed. Doubling
 * the class is the file's existing answer to Divi specificity (section D).
 */
.ltsq-listingband__kicker.ltsq-listingband__kicker,
.ltsq-listingband__dek.ltsq-listingband__dek,
.ltsq-tiercol__kicker.ltsq-tiercol__kicker,
.ltsq-tiercol__price.ltsq-tiercol__price,
.ltsq-tiercol__alt.ltsq-tiercol__alt {
	padding: 0;
}

.ltsq-tiercols__foot.ltsq-tiercols__foot { padding: 16px 24px; }

/* .ltsq-pagewide ends with zero bottom padding (it was written to butt against
   .ltsq-pagegrid). The band now comes between them and needs its own air. */
.ltsq-pagewide + .ltsq-listingband { margin-top: 44px; }

.ltsq-listingband {
	background: var(--lts-surface);
	border-top: var(--lts-rule-section);
	border-bottom: var(--lts-rule-section);
}

.ltsq-listingband__inner {
	max-width: calc(var(--lts-maxw) + (var(--lts-gutter) * 2));
	margin: 0 auto;
	padding: 44px var(--lts-gutter) 40px;
	box-sizing: border-box;
}

.ltsq-listingband__kicker {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 10px;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--lts-stream-text);
}

.ltsq-listingband__swatch {
	width: 8px;
	height: 8px;
	flex: none;
	background: var(--lts-stream);
}

/* Doubled, because Divi's .entry-content h2 is (0,1,1) and a single class loses
   to it — the same reason the list selectors in section D are doubled. */
.ltsq-listingband__title.ltsq-listingband__title {
	margin: 0 0 12px;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 36px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--lts-ink);
}

.ltsq-listingband__dek {
	max-width: 64ch;
	margin: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-body);
	line-height: 1.7;
	color: var(--lts-text-body);
}

/* The panel ------------------------------------------------------------- */

.ltsq-tiercols {
	margin: 28px 0 0;
	background: var(--lts-bg);
	border: 1px solid var(--lts-border);
	border-top: var(--lts-stream-border-top) solid var(--lts-stream);
	border-radius: var(--lts-radius);
}

.ltsq-tiercols__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
}

.ltsq-tiercol {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 28px 24px;
}

.ltsq-tiercol + .ltsq-tiercol { border-left: 1px solid var(--lts-border); }

.ltsq-tiercol__kicker {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-kicker);
	font-weight: 800;
	letter-spacing: var(--lts-ls-kicker);
	text-transform: uppercase;
	color: var(--lts-text-muted);
}

.ltsq-tiercol--chosen .ltsq-tiercol__kicker { color: var(--lts-stream-text); }

.ltsq-tiercol__swatch {
	width: 8px;
	height: 8px;
	flex: none;
	background: var(--lts-stream);
}

.ltsq-tiercols .ltsq-tiercol__name {
	margin: 0 0 12px;
	padding: 0;
	font-family: var(--lts-font-display);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--lts-ink);
}

.ltsq-tiercol__price {
	margin: 0;
	font-family: var(--lts-font-ui);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.1;
	color: var(--lts-ink);
}

/* A tier that cannot be bought yet says so in the muted voice, so it does not
   read as a price. */
.ltsq-tiercol__price--soon {
	font-size: 20px;
	font-weight: 700;
	color: var(--lts-text-muted);
}

.ltsq-tiercol__alt {
	margin: 6px 0 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	line-height: 1.5;
	color: var(--lts-text-muted);
}

/* What you get ---------------------------------------------------------- */

.ltsq-tiercols .ltsq-tiercol__features,
.ltsq-tiercol .ltsq-tiercol__features {
	flex: 1;
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: var(--lts-rule-hairline);
	list-style: none;
}

.ltsq-tiercols .ltsq-tiercol__feature {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 10px;
	padding: 0;
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-excerpt);
	line-height: 1.5;
	color: var(--lts-text-dek);
}

.ltsq-tiercols .ltsq-tiercol__feature:last-child { margin-bottom: 0; }

.ltsq-tiercols .ltsq-tiercol__feature--lead {
	font-weight: 700;
	color: var(--lts-text);
}

.ltsq-tiercol__feature .ltsq-icon {
	flex: none;
	margin-top: 3px;
	color: var(--lts-stream);
	stroke-width: 2.5;
}

/* The one button -------------------------------------------------------- */

.ltsq-tiercols .ltsq-tiercol__cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 48px;
	margin: 24px 0 0;
	box-sizing: border-box;
	text-align: left;
}

/* The strip under the columns ------------------------------------------- */

.ltsq-tiercols__foot {
	margin: 0;
	padding: 16px 24px;
	border-top: 1px solid var(--lts-border);
	background: var(--lts-surface);
	font-family: var(--lts-font-ui);
	font-size: var(--lts-fs-meta);
	line-height: 1.7;
	color: var(--lts-text-muted);
}

/* [ltsq_selfserve_links] sits under the panel, inside the band. */
.ltsq-listingband .ltsq-selfserve-links { margin: 24px 0 0; }

/*
 * One column on a phone. The panel keeps its border and its 3px top rule; the
 * dividers that separated the columns become the rules between the rows, which
 * is the whole reason they are declared with `+` rather than :not(:first-child).
 */
@media (max-width: 900px) {

	.ltsq-listingband__inner { padding-top: 32px; padding-bottom: 32px; }
	.ltsq-listingband__title.ltsq-listingband__title { font-size: 30px; }

	.ltsq-tiercols__grid { grid-template-columns: minmax(0, 1fr); }

	.ltsq-tiercol + .ltsq-tiercol {
		border-left: 0;
		border-top: 1px solid var(--lts-border);
	}
}