/*
Theme Name: LuckyAussieWorld QVX
Description: Astra child theme for this install. Token layer, shell and card system.
Author: LuckyAussieWorld
Template: astra
Version: 2.0.0
Text Domain: qvx
*/

/* ---------------------------------------------------------------
   Token register. Every colour, spacing and type value used by a
   fragment resolves through these custom properties. A literal hex
   inside a fragment is a defect.
   --------------------------------------------------------------- */

:root {
	--qvx-ink: #101820;
	--qvx-ink-2: #2c3846;
	--qvx-muted: #5c6b7a;
	--qvx-faint: #8a97a4;
	--qvx-line: #dde3ea;
	--qvx-line-2: #eef2f6;
	--qvx-paper: #ffffff;
	--qvx-wash: #f4f6f8;
	--qvx-accent: #0f5242;
	--qvx-accent-2: #12705a;
	--qvx-accent-wash: rgba(15, 82, 66, 0.07);
	--qvx-gold: #b8860b;
	--qvx-gutter: 1.25rem;
	--qvx-radius: 12px;
	--qvx-radius-sm: 8px;
	--qvx-measure: 70rem;
	--qvx-shadow: 0 1px 2px rgba(16, 24, 32, 0.05), 0 4px 14px rgba(16, 24, 32, 0.05);
	--qvx-shadow-hover: 0 2px 4px rgba(16, 24, 32, 0.06), 0 10px 26px rgba(16, 24, 32, 0.09);
	--qvx-step-0: 0.875rem;
	--qvx-step-1: 1rem;
	--qvx-step-2: 1.2rem;
	--qvx-step-3: 1.55rem;
	--qvx-step-4: 2.1rem;
	--qvx-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--qvx-paper-2: #fcfdfe;
	--qvx-accent-ink: #0b3d31;
}

/* ---------------------------------------------------------------
   Gate 7e. Astra sets .ast-container { display: flex }. Never write
   #primary { width: auto; margin: 0 }. Without these two rules
   #primary collapses as a flex item and content pins to the left
   edge on a 1920px viewport.
   --------------------------------------------------------------- */

#content .ast-container,
.ast-container {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
}

#primary,
.site-main,
#main {
	width: 100% !important;
	max-width: 100% !important;
	flex: 1 1 100% !important;
	margin-inline: auto !important;
}

/* Kill Astra's own paddings and sidebar furniture on these pages. */
.qvx-page #content,
.qvx-page .site-content,
.qvx-page .ast-container,
.qvx-page #primary,
.qvx-page .site-main {
	padding: 0 !important;
	margin: 0 !important;
}

.qvx-page #secondary,
.qvx-page .widget-area {
	display: none !important;
}

body.qvx-page,
body.qvx-page .site,
body.qvx-page #page {
	background: var(--qvx-wash);
}

body.qvx-page .qvx-main {
	background: transparent;
}

/* ---------------------------------------------------------------
   Base typography for the shell.
   --------------------------------------------------------------- */

.qvx-wrap,
.qvx-topbar__inner,
.qvx-header__inner,
.qvx-masthead__inner,
.qvx-footer__inner {
	width: 100%;
	max-width: var(--qvx-measure);
	margin-inline: auto;
	padding-inline: var(--qvx-gutter);
}

.qvx-page,
.qvx-content {
	font-family: var(--qvx-font);
	-webkit-font-smoothing: antialiased;
}

/* ---------------------------------------------------------------
   Top bar. Gate 7d: the tagline sits INSIDE .qvx-topbar__inner,
   before its closing div.
   --------------------------------------------------------------- */

.qvx-topbar {
	background: var(--qvx-accent);
	color: #d8ece6;
	font-size: 0.78rem;
	letter-spacing: 0.01em;
}

.qvx-topbar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem 1.25rem;
	min-height: 2.5rem;
}

.qvx-topbar__name {
	color: #ffffff;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}

.qvx-topbar__name:hover {
	color: #a8e6d0;
	text-decoration: none;
}

.qvx-topbar__tagline,
.qvx-topbar__help {
	margin: 0;
	color: #c2ddd4;
	font-size: 0.78rem;
	line-height: 1.4;
}

.qvx-topbar__help {
	text-align: right;
}

/* ---------------------------------------------------------------
   Header: masthead name and the bar share one sticky strip.
   --------------------------------------------------------------- */

.qvx-header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: var(--qvx-paper);
	border-bottom: 1px solid var(--qvx-line);
	box-shadow: 0 1px 0 rgba(16, 24, 32, 0.02);
}

.qvx-header__inner {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.25rem;
	padding-block: 0.5rem;
}

.qvx-masthead {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	flex: 0 0 auto;
	min-width: 0;
}

.qvx-masthead__inner {
	padding: 0;
}

.qvx-masthead__name {
	margin: 0;
	color: var(--qvx-accent);
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.015em;
	white-space: nowrap;
}

.qvx-masthead__name a {
	color: inherit;
	text-decoration: none;
}

.qvx-masthead__line {
	margin: 0.08rem 0 0;
	color: var(--qvx-faint);
	font-size: 0.62rem;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	white-space: nowrap;
}

/* ---------------------------------------------------------------
   Navigation. Section 8: let the row wrap, never scroll it.
   --------------------------------------------------------------- */

.qvx-nav {
	background: none;
	border: 0;
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	justify-content: flex-end;
}

.qvx-nav__row {
	display: flex;
	flex-wrap: nowrap;
	overflow: visible;
	align-items: center;
	justify-content: flex-end;
	gap: 0.05rem 0.08rem;
	margin: 0;
	padding: 0;
	list-style: none;
	min-width: 0;
}

.qvx-nav__item {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	flex: 0 0 auto;
}

.qvx-nav__link {
	display: inline-block;
	padding: 0.36rem 0.42rem;
	color: var(--qvx-ink-2);
	font-size: 0.755rem;
	font-weight: 600;
	line-height: 1.22;
	text-decoration: none;
	border-radius: var(--qvx-radius-sm);
	transition: background 0.14s ease, color 0.14s ease;
	white-space: nowrap;
}

.qvx-nav__link:hover,
.qvx-nav__link:focus,
.qvx-nav__item:hover > .qvx-nav__link,
.qvx-nav__item:focus-within > .qvx-nav__link {
	color: var(--qvx-accent);
	background: var(--qvx-accent-wash);
	text-decoration: none;
}

.qvx-nav__link--front {
	color: var(--qvx-accent);
}

/* Dropdowns. Hidden by default, opened by pointer and by focus. */
.qvx-nav__panel {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 40;
	display: block;
	overflow: visible;
	min-width: 16rem;
	max-width: 22rem;
	margin: 0;
	padding: 0.4rem;
	list-style: none;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow-hover);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s;
}

.qvx-nav__item:hover > .qvx-nav__panel,
.qvx-nav__item:focus-within > .qvx-nav__panel {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.qvx-nav__panel-item,
.qvx-nav__child {
	margin: 0;
	padding: 0;
	list-style: none;
}

.qvx-nav__child a {
	display: block;
	padding: 0.4rem 0.55rem;
	color: var(--qvx-ink-2);
	font-size: 0.82rem;
	font-weight: 400;
	line-height: 1.4;
	text-decoration: none;
	border-radius: calc(var(--qvx-radius-sm) - 2px);
}

.qvx-nav__child a:hover,
.qvx-nav__child a:focus {
	color: var(--qvx-accent);
	background: var(--qvx-accent-wash);
	text-decoration: none;
}

@media (max-width: 1400px) {
	.qvx-nav__link {
		padding: 0.34rem 0.34rem;
		font-size: 0.7rem;
	}

	.qvx-masthead__name {
		font-size: 0.94rem;
	}
}

@media (max-width: 1280px) {
	.qvx-nav__link {
		padding: 0.32rem 0.28rem;
		font-size: 0.66rem;
	}

	.qvx-masthead__line {
		display: none;
	}
}

@media (max-width: 1100px) {
	.qvx-header__inner {
		flex-wrap: wrap;
	}

	.qvx-nav {
		flex: 1 1 100%;
		justify-content: flex-start;
	}

	.qvx-nav__row {
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.qvx-nav__link {
		padding: 0.34rem 0.44rem;
		font-size: 0.78rem;
	}

	.qvx-nav__panel {
		position: static;
		max-width: 100%;
		display: none;
		margin-top: 0.25rem;
		padding: 0.25rem 0 0.25rem 0.6rem;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
		border: 0;
		border-left: 2px solid var(--qvx-line);
		border-radius: 0;
	}

	.qvx-nav__item:hover > .qvx-nav__panel,
	.qvx-nav__item:focus-within > .qvx-nav__panel {
		display: block;
	}
}

/* ---------------------------------------------------------------
   Page body. The fragment is wrapped in .qvx-page, so the heading
   rules target the wrapper and the h1 class the fragment carries.
   --------------------------------------------------------------- */

.qvx-main,
.qvx-content {
	display: block;
	width: 100%;
	max-width: var(--qvx-measure);
	margin-inline: auto;
	padding: var(--qvx-step-3) var(--qvx-gutter) var(--qvx-step-4);
}

.qvx-page {
	display: block;
	width: 100%;
	max-width: 100%;
	margin-inline: auto;
}

.qvx-page h1,
.qvx-page .qvx-page__h1,
.qvx-content h1 {
	max-width: 100%;
	margin: 0 auto 1.35rem;
	padding-bottom: 0.9rem;
	color: var(--qvx-ink);
	font-size: clamp(1.65rem, 1.4rem + 1.1vw, 2.5rem);
	font-weight: 800;
	line-height: 1.14;
	letter-spacing: -0.022em;
	position: relative;
}

.qvx-page h1::after,
.qvx-page .qvx-page__h1::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 4.5rem;
	height: 4px;
	background: var(--qvx-accent);
	border-radius: 2px;
}

.qvx-page h2 {
	max-width: 100%;
	margin: 2.35rem auto 0.9rem;
	padding: 0.15rem 0 0.15rem 0.75rem;
	color: var(--qvx-ink);
	font-size: clamp(1.25rem, 1.1rem + 0.55vw, 1.6rem);
	font-weight: 750;
	line-height: 1.28;
	letter-spacing: -0.012em;
	border-left: 3px solid var(--qvx-accent);
}

.qvx-page h3 {
	max-width: 100%;
	margin: 1.6rem auto 0.6rem;
	color: var(--qvx-ink-2);
	font-size: 1.16rem;
	font-weight: 700;
	line-height: 1.35;
}

.qvx-page h4 {
	max-width: 100%;
	margin: 1.3rem auto 0.5rem;
	color: var(--qvx-ink-2);
	font-size: 1rem;
	font-weight: 700;
}

.qvx-page p,
.qvx-page li {
	color: var(--qvx-ink-2);
	font-size: var(--qvx-step-1);
	line-height: 1.72;
}

.qvx-page p {
	max-width: 100%;
	margin: 0 auto 1rem;
}

.qvx-page > p,
.qvx-page > ul,
.qvx-page > ol,
.qvx-page > h2,
.qvx-page > h3 {
	max-width: 46rem;
	margin-inline: auto;
	width: 100%;
}

.qvx-page li {
	margin-bottom: 0.4rem;
}

.qvx-page ul,
.qvx-page ol {
	max-width: 100%;
	margin: 0 auto 1.1rem;
	padding-left: 1.35rem;
}

.qvx-page a {
	color: var(--qvx-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}

.qvx-page a:hover {
	color: var(--qvx-accent-2);
	text-decoration-thickness: 2px;
}

.qvx-page strong {
	color: var(--qvx-ink);
	font-weight: 700;
}

.qvx-page ul li::marker {
	color: var(--qvx-faint);
}

/* ---------------------------------------------------------------
   Standfirst and lead-in.
   --------------------------------------------------------------- */

.qvx-standfirst {
	position: relative;
	max-width: 100%;
	margin: 0 auto 1.4rem;
	padding: 1.25rem 1.5rem 1.25rem 1.6rem;
	color: var(--qvx-ink-2);
	font-size: 1.06rem;
	line-height: 1.66;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-left: 4px solid var(--qvx-accent);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow);
	overflow: hidden;
}

.qvx-standfirst p {
	margin: 0;
	color: var(--qvx-ink-2);
	font-size: 1.06rem;
	line-height: 1.66;
}

.qvx-leadin {
	max-width: 100%;
	margin: 0 auto 1.4rem;
	padding: 1rem 1.25rem;
	color: var(--qvx-muted);
	font-size: 0.92rem;
	line-height: 1.65;
	background: var(--qvx-accent-wash);
	border-radius: var(--qvx-radius-sm);
}

.qvx-leadin p {
	margin: 0 0 0.6rem;
	color: var(--qvx-muted);
	font-size: 0.92rem;
}

.qvx-leadin p:last-child {
	margin-bottom: 0;
}

.qvx-crumbs {
	max-width: 100%;
	margin: 0 auto 0.9rem;
	color: var(--qvx-faint);
	font-size: 0.8rem;
	line-height: 1.5;
}

.qvx-crumbs a {
	color: var(--qvx-muted);
	text-decoration: none;
}

.qvx-crumbs a:hover {
	text-decoration: underline;
}

/* ---------------------------------------------------------------
   Contents bar.
   --------------------------------------------------------------- */

.qvx-contents {
	max-width: 100%;
	margin: 0 auto 1.9rem;
	padding: 1.2rem 1.4rem;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow);
	position: relative;
}

.qvx-contents::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--qvx-accent) 0%, rgba(15, 82, 66, 0.15) 100%);
	border-radius: var(--qvx-radius) var(--qvx-radius) 0 0;
}

.qvx-contents__title {
	margin: 0 0 0.65rem;
	color: var(--qvx-faint);
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.qvx-contents ol,
.qvx-contents ul,
.qvx-contents__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.3rem 1.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.qvx-contents li {
	margin: 0;
	padding: 0;
	color: var(--qvx-ink-2);
	font-size: 0.88rem;
	line-height: 1.5;
	list-style: none;
}

.qvx-contents a {
	display: block;
	padding: 0.1rem 0;
	color: var(--qvx-ink-2);
	text-decoration: none;
	border-bottom: 1px dotted var(--qvx-line);
}

.qvx-contents a:hover {
	color: var(--qvx-accent);
	border-bottom-color: var(--qvx-accent);
}

@media (max-width: 700px) {
	.qvx-contents ol,
	.qvx-contents ul,
	.qvx-contents__list {
		grid-template-columns: 1fr;
	}
}
/* ---------------------------------------------------------------
   Board: the sponsored block. A three column card, not a text run.
   Column order on desktop is brand | terms | score, and it stacks
   on small screens.
   --------------------------------------------------------------- */

.qvx-board {
	display: block;
	max-width: 100%;
	margin: 1.75rem auto 2rem;
	padding: 1.15rem;
	background: var(--qvx-paper-2);
	border: 1px solid var(--qvx-line);
	border-top: 3px solid var(--qvx-accent);
	border-radius: var(--qvx-radius);
	box-shadow: 0 2px 6px rgba(16, 24, 32, 0.06), 0 12px 32px rgba(16, 24, 32, 0.07);
}

.qvx-board__head {
	display: none;
}

.qvx-board__note {
	margin: 0;
	color: var(--qvx-muted);
	font-size: 0.9rem;
	line-height: 1.6;
}

.qvx-offer {
	display: grid;
	grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr) minmax(9rem, 11rem);
	grid-template-areas: "brand terms score";
	align-items: start;
	gap: 0.5rem 1.5rem;
	max-width: 100%;
	margin: 0;
	padding: 1.15rem 1.25rem;
	background: var(--qvx-paper);
	border: 0;
	border-bottom: 1px solid var(--qvx-line-2);
	border-radius: 0;
	transition: background 0.16s ease;
}

.qvx-board .qvx-offer:last-of-type {
	border-bottom: 0;
}

.qvx-board .qvx-offer:nth-child(odd) {
	background: var(--qvx-paper);
}

.qvx-board .qvx-offer:nth-child(even) {
	background: #fbfcfd;
}

.qvx-offer:hover {
	background: var(--qvx-accent-wash);
}

.qvx-offer__brand {
	grid-area: brand;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 0;
}

.qvx-offer__name {
	display: block;
	color: var(--qvx-ink);
	font-size: 1.16rem;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.015em;
	word-break: break-word;
}

.qvx-offer__rail {
	display: inline-block;
	align-self: flex-start;
	padding: 0.12rem 0.45rem;
	color: var(--qvx-muted);
	font-size: 0.68rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: var(--qvx-line-2);
	border-radius: 4px;
}

.qvx-offer__terms {
	grid-area: terms;
	min-width: 0;
}

.qvx-offer__lines {
	margin: 0.5rem 0 0;
	padding-left: 1.05rem;
	list-style: disc;
}

.qvx-offer__line {
	margin: 0 0 0.25rem;
	color: var(--qvx-muted);
	font-size: 0.84rem;
	line-height: 1.5;
	list-style: disc;
}

.qvx-offer__line::marker {
	color: var(--qvx-line);
}

.qvx-offer__pay {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin: 0.7rem 0 0;
	padding: 0;
	list-style: none;
}

.qvx-offer__payitem {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 1;
}

.qvx-pay {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.2rem 0.5rem 0.2rem 0.3rem;
	color: var(--qvx-muted);
	font-size: 0.7rem;
	font-weight: 600;
	line-height: 1.3;
	background: var(--qvx-wash);
	border: 1px solid var(--qvx-line);
	border-radius: 999px;
}

.qvx-pay__mark {
	display: inline-block;
	width: 0.85rem;
	height: 0.85rem;
	background: var(--qvx-accent);
	border-radius: 50%;
	opacity: 0.55;
}

.qvx-pay__label {
	white-space: nowrap;
}

.qvx-offer__score {
	grid-area: score;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.3rem;
	text-align: right;
}

.qvx-offer__rating {
	display: inline-block;
	padding: 0.18rem 0.55rem;
	color: #6d4f04;
	font-size: 0.82rem;
	font-weight: 800;
	line-height: 1.3;
	background: #fdf4dc;
	border: 1px solid #f0e0b0;
	border-radius: 999px;
	white-space: nowrap;
}

.qvx-offer__votes {
	color: var(--qvx-faint);
	font-size: 0.74rem;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
}

.qvx-offer__button {
	display: inline-block;
	width: 100%;
	margin-top: 0.35rem;
	padding: 0.66rem 0.9rem;
	color: #ffffff;
	font-size: 0.8rem;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	background: linear-gradient(180deg, var(--qvx-accent-2) 0%, var(--qvx-accent) 100%);
	border: 1px solid var(--qvx-accent-ink);
	border-radius: var(--qvx-radius-sm);
	box-shadow: 0 1px 2px rgba(11, 61, 49, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.12);
	transition: background 0.15s ease, box-shadow 0.15s ease;
	white-space: nowrap;
}

.qvx-offer__button:hover,
.qvx-offer__button:focus {
	color: #ffffff;
	background: linear-gradient(180deg, var(--qvx-accent) 0%, var(--qvx-accent-ink) 100%);
	box-shadow: 0 3px 12px rgba(11, 61, 49, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12);
	text-decoration: none;
}

.qvx-board__disclaimer {
	margin: 0.9rem 0 0;
	padding-top: 0.85rem;
	color: var(--qvx-faint);
	font-size: 0.76rem;
	line-height: 1.6;
	border-top: 1px solid var(--qvx-line-2);
}

.qvx-board__disclaimer a {
	color: var(--qvx-muted);
	text-decoration: underline;
}

/* Chips inside a card. */
.qvx-chip {
	display: inline-block;
	margin: 0 0.3rem 0.3rem 0;
	padding: 0.24rem 0.65rem;
	color: var(--qvx-ink);
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.35;
	background: var(--qvx-wash);
	border: 1px solid var(--qvx-line);
	border-radius: 999px;
}

.qvx-chip--money {
	color: #0a4a3b;
	background: #e6f4ef;
	border-color: #bfe0d5;
}

.qvx-chip--spins {
	color: #7a5605;
	background: #fdf4dc;
	border-color: #edd9a4;
}

/* Card grid stacking, tablet then phone. */
@media (max-width: 900px) {
	.qvx-offer {
		grid-template-columns: minmax(0, 1fr) minmax(8.5rem, 10rem);
		grid-template-areas:
			"brand score"
			"terms terms";
		gap: 0.65rem 1rem;
	}
}

@media (max-width: 560px) {
	.qvx-board {
		padding: 0.75rem;
	}

	.qvx-offer {
		grid-template-columns: 1fr;
		grid-template-areas:
			"brand"
			"terms"
			"score";
		padding: 1rem;
	}

	.qvx-offer__score {
		align-items: stretch;
		text-align: left;
		border-top: 1px solid var(--qvx-line-2);
		padding-top: 0.75rem;
	}

	.qvx-offer__button {
		width: 100%;
	}
}

/* ---------------------------------------------------------------
   Tables.
   --------------------------------------------------------------- */

.qvx-table-scroll {
	width: 100%;
	max-width: 100%;
	margin: 1.5rem auto;
	overflow-x: auto;
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow);
	-webkit-overflow-scrolling: touch;
}

.qvx-table,
.qvx-compare {
	width: 100%;
	min-width: 44rem;
	max-width: 100%;
	margin: 0 auto;
	border-collapse: collapse;
	background: var(--qvx-paper);
	font-size: 0.87rem;
}

.qvx-table caption,
.qvx-compare caption {
	padding: 0.8rem 1rem;
	color: var(--qvx-ink);
	font-size: 0.86rem;
	font-weight: 700;
	line-height: 1.45;
	text-align: left;
	background: var(--qvx-wash);
	border-bottom: 1px solid var(--qvx-line);
}

.qvx-table th,
.qvx-table td,
.qvx-compare th,
.qvx-compare td {
	padding: 0.68rem 0.85rem;
	vertical-align: top;
	text-align: left;
	border-bottom: 1px solid var(--qvx-line-2);
}

.qvx-table thead th,
.qvx-compare thead th {
	color: var(--qvx-ink);
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	background: var(--qvx-wash);
	border-bottom: 1px solid var(--qvx-line);
}

.qvx-table tbody th,
.qvx-compare tbody th {
	color: var(--qvx-ink);
	font-weight: 700;
}

.qvx-table td,
.qvx-compare td {
	color: var(--qvx-muted);
	line-height: 1.55;
}

.qvx-table tbody tr:nth-child(even),
.qvx-compare tbody tr:nth-child(even) {
	background: #fbfcfd;
}

.qvx-table tbody tr:last-child th,
.qvx-table tbody tr:last-child td,
.qvx-compare tbody tr:last-child th,
.qvx-compare tbody tr:last-child td {
	border-bottom: 0;
}

.qvx-table__note {
	max-width: 100%;
	margin: 0.7rem auto 0;
	color: var(--qvx-faint);
	font-size: 0.78rem;
	line-height: 1.55;
}

/* ---------------------------------------------------------------
   Figures.
   --------------------------------------------------------------- */

.qvx-figure {
	max-width: 100%;
	margin: 1.75rem auto;
	padding: 0;
}

.qvx-figure img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	background: var(--qvx-paper);
	box-shadow: var(--qvx-shadow);
}

.qvx-figure__caption,
.qvx-figure figcaption {
	max-width: 100%;
	margin: 0.6rem auto 0;
	color: var(--qvx-faint);
	font-size: 0.8rem;
	line-height: 1.55;
}
/* ---------------------------------------------------------------
   Calculator.
   --------------------------------------------------------------- */

.qvx-calc {
	max-width: 100%;
	margin: 1.75rem auto;
	padding: 1.25rem 1.35rem;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow);
}

.qvx-calc__title {
	margin: 0 0 0.9rem;
	color: var(--qvx-ink);
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1.3;
}

.qvx-calc__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem 0.85rem;
	margin: 0 0 0.85rem;
}

.qvx-calc__label {
	flex: 1 1 12rem;
	margin: 0;
	color: var(--qvx-ink-2);
	font-size: 0.88rem;
	line-height: 1.45;
}

.qvx-calc__input,
.qvx-calc__select {
	flex: 0 1 9rem;
	min-width: 6rem;
	padding: 0.55rem 0.65rem;
	color: var(--qvx-ink);
	font-size: 0.9rem;
	line-height: 1.4;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius-sm);
}

.qvx-calc__input:focus,
.qvx-calc__select:focus {
	outline: none;
	border-color: var(--qvx-accent);
	box-shadow: 0 0 0 3px var(--qvx-accent-wash);
}

.qv.qvx-calc__button {
	display: inline-block;
	padding: 0.6rem 1.15rem;
	color: #ffffff;
	font-size: 0.84rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.02em;
	background: var(--qvx-accent);
	border: 1px solid var(--qvx-accent);
	border-radius: var(--qvx-radius-sm);
	cursor: pointer;
	transition: background 0.15s ease;
}

.qvx-calc__button:hover,
.qvx-calc__button:focus {
	background: var(--qvx-accent-2);
	border-color: var(--qvx-accent-2);
}

.qvx-calc__out {
	margin: 0;
	padding: 0.8rem 1rem;
	color: var(--qvx-ink);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.5;
	background: var(--qvx-accent-wash);
	border-radius: var(--qvx-radius-sm);
}

/* ---------------------------------------------------------------
   FAQ.
   --------------------------------------------------------------- */

.qvx-faq {
	max-width: 100%;
	margin: 2.25rem auto 0;
}

.qvx-faq__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.qvx-faq__q,
.qvx-faq dt {
	margin: 1.25rem 0 0;
	padding: 0.9rem 0 0;
	color: var(--qvx-ink);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.45;
	list-style: none;
	border-top: 1px solid var(--qvx-line-2);
}

.qvx-faq__a,
.qvx-faq dd {
	margin: 0.4rem 0 0;
	padding: 0;
	color: var(--qvx-ink-2);
	font-size: 0.95rem;
	line-height: 1.7;
	list-style: none;
}

.qvx-faq dl {
	margin: 0;
}

/* Native disclosure widget, when a fragment uses details/summary. */
.qvx-faq details {
	padding: 0.85rem 0;
	border-top: 1px solid var(--qvx-line-2);
}

.qvx-faq summary {
	color: var(--qvx-ink);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.45;
	cursor: pointer;
}

.qvx-faq details p {
	margin: 0.5rem 0 0;
	color: var(--qvx-ink-2);
	font-size: 0.95rem;
	line-height: 1.7;
}

/* ---------------------------------------------------------------
   Licence aside, compliance, onward.
   --------------------------------------------------------------- */

.qvx-licence {
	max-width: 100%;
	margin: 1.9rem auto 0;
	padding: 1.15rem 1.35rem;
	color: var(--qvx-muted);
	font-size: 0.84rem;
	line-height: 1.6;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-left: 3px solid var(--qvx-faint);
	border-radius: var(--qvx-radius);
}

.qvx-licence p {
	margin: 0 0 0.6rem;
	color: var(--qvx-muted);
	font-size: 0.84rem;
}

.qvx-licence p:last-child {
	margin-bottom: 0;
}

.qvx-onward {
	display: block;
	max-width: 100%;
	margin: 2.25rem auto 0;
	padding: 1.25rem 1.35rem;
	background: var(--qvx-paper);
	border: 1px solid var(--qvx-line);
	border-radius: var(--qvx-radius);
	box-shadow: var(--qvx-shadow);
}

.qvx-onward__title {
	margin: 0 0 0.75rem;
	color: var(--qvx-ink);
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.3;
}

.qvx-onward ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.qvx-onward__item {
	margin: 0 0 0.45rem;
	padding: 0 0 0.45rem;
	color: var(--qvx-ink-2);
	font-size: 0.9rem;
	line-height: 1.55;
	list-style: none;
	border-bottom: 1px solid var(--qvx-line-2);
}

.qvx-onward__item:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: 0;
}

.qvx-onward a {
	color: var(--qvx-accent);
	text-decoration: underline;
}

/* ---------------------------------------------------------------
   Compliance block (section 5). One agreed wording, everywhere.
   --------------------------------------------------------------- */

.qvx-compliance {
	max-width: 100%;
	margin: 2rem auto 0;
	padding: 1.15rem 1.35rem;
	color: #4a5c4e;
	font-size: 0.82rem;
	line-height: 1.62;
	background: var(--qvx-accent-wash);
	border: 1px solid rgba(15, 82, 66, 0.18);
	border-left: 3px solid var(--qvx-accent);
	border-radius: var(--qvx-radius);
}

.qvx-compliance p {
	margin: 0 0 0.6rem;
	color: var(--qvx-muted);
	font-size: 0.82rem;
	line-height: 1.62;
}

.qvx-compliance p:last-child {
	margin-bottom: 0;
}

/* ---------------------------------------------------------------
   Standalone offer blocks a fragment may write directly.
   --------------------------------------------------------------- */

.qvx-offer:not(.qvx-board .qvx-offer) {
	display: block;
	margin: 0 auto 1.25rem;
	padding: 1.15rem 1.25rem;
	box-shadow: var(--qvx-shadow);
}

.qvx-outbound {
	display: inline-block;
	padding: 0.6rem 1.1rem;
	color: #ffffff;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
	background: var(--qvx-accent);
	border-radius: var(--qvx-radius-sm);
}

.qvx-outbound:hover,
.qvx-outbound:focus {
	color: #ffffff;
	background: var(--qvx-accent-2);
	text-decoration: none;
}

.qvx-wide {
	max-width: 100%;
	margin: 1.75rem auto;
}

/* Fixture classes. Not renamed, not removed. */
.qvx-reach,
.qvx-silent,
.qvx-margin,
.qvx-whose,
.qvx-instrument,
.qvx-cite {
	font-style: normal;
}

.qvx-silent {
	color: var(--qvx-faint);
}

.qvx-margin {
	color: var(--qvx-muted);
	font-size: 0.8rem;
}

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

.qvx-footer {
	padding-block: 2.5rem;
	color: #b6c3cf;
	font-size: 0.84rem;
	line-height: 1.6;
	background: var(--qvx-ink);
	border-top: 0;
}

.qvx-footer__head {
	margin: 0 0 0.5rem;
	color: #ffffff;
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.qvx-footer__block p,
.qvx-footer p {
	margin: 0 0 0.7rem;
	max-width: 100%;
	color: #b6c3cf;
	font-size: 0.84rem;
	line-height: 1.62;
}

.qvx-footer__credit .qvx-silent {
	color: #ffffff;
	font-size: 0.84rem;
	font-weight: 700;
}

.qvx-footer__note {
	grid-column: 1 / -1;
	color: #8a97a4;
	font-size: 0.78rem;
	line-height: 1.6;
}

.qvx-footer a {
	color: #7fd4b8;
	text-decoration: underline;
}

.qvx-footer a:hover {
	color: #a8e6d0;
}

.qvx-footer__nav {
	grid-column: 1 / -1;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.qvx-footer__credit {
	grid-column: 1 / -1;
	margin: 0;
	padding-top: 0.9rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.qvx-footer__inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	gap: 1.5rem 2rem;
}

.qvx-footer__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.qvx-footer__list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------------------------------------------------------------
   Small screens.
   --------------------------------------------------------------- */

@media (max-width: 640px) {
	:root {
		--qvx-gutter: 1rem;
		--qvx-step-4: 1.75rem;
		--qvx-step-3: 1.375rem;
		--qvx-step-2: 1.125rem;
		--qvx-measure: 100%;
	}

	.qvx-topbar__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.2rem;
	}

	.qvx-topbar__help {
		text-align: left;
	}

	.qvx-header__inner {
		flex-direction: column;
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 0.3rem;
	}

	.qvx-nav {
		flex: 1 1 100%;
		justify-content: flex-start;
	}

	.qvx-nav__row {
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 0.05rem;
	}

	.qvx-nav__link {
		padding: 0.32rem 0.4rem;
		font-size: 0.76rem;
	}

	.qvx-main,
	.qvx-content {
		padding-block: 1.25rem 2rem;
	}

	.qvx-page p,
	.qvx-page li {
		font-size: 0.95rem;
		line-height: 1.68;
	}

	.qvx-standfirst,
	.qvx-standfirst p {
		font-size: 1rem;
	}

	.qvx-table,
	.qvx-compare {
		min-width: 38rem;
	}

	.qvx-faq__q,
	.qvx-faq dt {
		margin-top: 1rem;
	}
}