/**
 * Quote form styles.
 *
 * Selectors stay inside .travinfo-quote and set their own values rather than
 * taking the theme's, because the form has to look the same on any theme.
 * Colours, type and radii come from custom properties so a site can rebrand
 * without forking. Type is the one exception that is inherited: the family is
 * declared once, on the block below, and nothing else names a face.
 *
 * Palette: the brand navy carries structure (bands, buttons, money), the brand
 * gold is graphical only — rules, the progress track, focus rings, the stub
 * perforation. Gold never sits behind small text, because gold and white do not
 * reach a readable contrast ratio; --tvq-gold-ink and --tvq-gold-light are the
 * text-safe versions for light and dark backgrounds.
 */
/* The notice is also rendered on its own, outside the card, so it has to carry
   the tokens itself. */
.travinfo-quote,
.travinfo-quote__notice {
	/* Brand */
	--tvq-navy: #283d75;
	--tvq-navy-deep: #1c2c56;
	--tvq-navy-ink: #18213f;
	--tvq-gold: #b49532;
	--tvq-gold-ink: #8a6f1d;
	--tvq-gold-light: #e3c66d;
	--tvq-white: #fff;

	/* Surfaces, derived from the navy so nothing reads as neutral grey */
	--tvq-mist: #f4f6fb;
	--tvq-wash: #faf6ec;
	--tvq-line: #dde2ee;
	--tvq-muted: #5b6580;

	/* Feedback */
	--tvq-danger: #a5342c;
	--tvq-danger-bg: #fbf2f0;
	--tvq-danger-ink: #7a251f;

	/* One typeface for the whole plugin: Roboto. There is deliberately a single
	   token and a single declaration, on the block below, so no rule can
	   introduce a second face — weight, size, letter-spacing and tabular
	   figures carry the differences the old display and monospace faces used to
	   carry. Arial and Helvetica are close enough in metrics that the layout
	   holds if the webfont is blocked. */
	--tvq-font: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* Metrics */
	--tvq-radius: 14px;
	--tvq-radius-sm: 9px;
	--tvq-gap: 18px;
	--tvq-pad: 32px;

	box-sizing: border-box;
	color: var(--tvq-navy-ink);
	font-family: var(--tvq-font);
	font-size: 16px;
	line-height: 1.55;
}

/* One card: the agency band, the step track and the body are bands inside it
   rather than three stacked boxes. The gold rule sits on the card border, so it
   is there whether or not the affiliate band is rendered. */
.travinfo-quote {
	max-width: 960px;
	margin: 0 auto;
	border: 1px solid var(--tvq-line);
	border-top: 3px solid var(--tvq-gold);
	border-radius: var(--tvq-radius);
	background: var(--tvq-white);
	box-shadow: 0 1px 2px rgba(24, 33, 63, 0.04), 0 18px 40px -24px rgba(24, 33, 63, 0.28);
	overflow: hidden;
}

.travinfo-quote *,
.travinfo-quote *::before,
.travinfo-quote *::after {
	box-sizing: inherit;
}

/* Agency header ---------------------------------------------------------- */

/* Full bleed navy band at the top of the card. Rendered only when the visitor
   arrived through an affiliate link, so the card has to look finished without
   it — hence the gold rule living on the card border instead of on the band. */
.travinfo-quote__agency {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	padding: 20px var(--tvq-pad);
	background: var(--tvq-navy);
	color: var(--tvq-white);
}

.travinfo-quote__agency .travinfo-affiliate-name {
	margin-right: auto;
	font-size: 1.2em;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.travinfo-quote__agency-code {
	padding: 5px 13px;
	border: 1px solid rgba(227, 198, 109, 0.55);
	border-radius: 999px;
	color: var(--tvq-gold-light);
	font-size: 0.72em;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Step indicator --------------------------------------------------------- */

/* Two tabs whose bottom edge doubles as the progress track: one filled gold
   segment per completed step, sitting on the hairline below the strip. */
.travinfo-quote__steps {
	position: relative;
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0 var(--tvq-pad);
	background: var(--tvq-mist);
	border-bottom: 1px solid var(--tvq-line);
	counter-reset: tvq-step;
}

.travinfo-quote__steps li {
	counter-increment: tvq-step;
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 16px 8px;
	color: var(--tvq-muted);
	font-size: 0.78em;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	transition: color 0.2s ease;
}

.travinfo-quote__steps li::before {
	content: counter(tvq-step);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex: 0 0 28px;
	border: 1px solid var(--tvq-line);
	border-radius: 50%;
	background: var(--tvq-white);
	color: var(--tvq-muted);
	font-size: 0.95em;
	letter-spacing: 0;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

/* The progress segment. Transparent until the step is reached. */
.travinfo-quote__steps li::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 3px;
	background: transparent;
	transition: background 0.25s ease;
}

.travinfo-quote__steps li.is-current,
.travinfo-quote__steps li.is-done {
	color: var(--tvq-navy);
}

.travinfo-quote__steps li.is-current::before,
.travinfo-quote__steps li.is-done::before {
	background: var(--tvq-navy);
	border-color: var(--tvq-navy);
	color: var(--tvq-white);
}

.travinfo-quote__steps li.is-current::after,
.travinfo-quote__steps li.is-done::after {
	background: var(--tvq-gold);
}

.travinfo-quote__steps li.is-done::before {
	content: "\2713";
}

/* Layout ----------------------------------------------------------------- */

.travinfo-quote__step {
	padding: var(--tvq-pad);
	animation: tvq-rise 0.4s cubic-bezier(0.2, 0.7, 0.3, 1) both;
}

.travinfo-quote__body {
	padding: var(--tvq-pad);
}

.travinfo-quote__step-head {
	margin-bottom: 28px;
}

.travinfo-quote__eyebrow {
	margin: 0 0 10px;
	color: var(--tvq-gold-ink);
	font-size: 0.72em;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.travinfo-quote__title {
	margin: 0;
	color: var(--tvq-navy);
	font-size: 1.85em;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.travinfo-quote__lead {
	max-width: 52ch;
	margin: 8px 0 0;
	color: var(--tvq-muted);
	font-size: 0.94em;
}

/* Section headings carry a short gold rule instead of a full divider, so the
   eye reads them as markers in a document rather than as new boxes. */
.travinfo-quote__subtitle {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 36px 0 16px;
	color: var(--tvq-navy);
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.travinfo-quote__subtitle::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: linear-gradient(90deg, var(--tvq-gold) 0, var(--tvq-line) 60px);
}

/* min() keeps the track from forcing a horizontal scrollbar when the form is
   dropped into a column narrower than one field. */
.travinfo-quote__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
	gap: var(--tvq-gap);
}

/* space-between pins the control to the bottom of the grid cell, so a label
   that wraps to two lines does not push its own field out of line with the
   rest of the row. */
.travinfo-quote__field {
	margin: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 7px;
	min-width: 0;
}

.travinfo-quote__field--wide {
	grid-column: 1 / -1;
}

.travinfo-quote__field label {
	color: var(--tvq-muted);
	font-size: 0.7em;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-transform: uppercase;
}

/* Controls --------------------------------------------------------------- */

.travinfo-quote input[type="text"],
.travinfo-quote input[type="email"],
.travinfo-quote input[type="tel"],
.travinfo-quote input[type="date"],
.travinfo-quote select {
	width: 100%;
	max-width: 100%;
	min-height: 46px;
	margin: 0;
	padding: 11px 14px;
	border: 1px solid var(--tvq-line);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-white);
	color: var(--tvq-navy-ink);
	font-family: inherit;
	font-size: 0.97em;
	line-height: 1.4;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	appearance: none;
	-webkit-appearance: none;
}

.travinfo-quote input[type="date"],
.travinfo-quote input[type="tel"] {
	font-variant-numeric: tabular-nums;
}

.travinfo-quote input:hover:not([readonly]),
.travinfo-quote select:hover {
	border-color: #c3cbdf;
}

.travinfo-quote input:focus,
.travinfo-quote select:focus {
	outline: none;
	border-color: var(--tvq-navy);
	box-shadow: 0 0 0 3px rgba(180, 149, 50, 0.32);
}

/* Values the form works out on its own: shown as figures, not as fields the
   visitor could type into. */
.travinfo-quote input[readonly] {
	border-color: transparent;
	background: var(--tvq-mist);
	color: var(--tvq-navy);
	font-size: 0.95em;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	cursor: default;
}

.travinfo-quote input[readonly]::placeholder {
	color: #a7b0c4;
}

.travinfo-quote input[readonly]:focus {
	border-color: transparent;
}

.travinfo-quote select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23283d75' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 38px;
}

/* Travelers -------------------------------------------------------------- */

/* The legend is floated so it lays out as a normal block heading inside the
   card instead of breaking the fieldset border. Keeping fieldset/legend markup
   is what groups each traveler for screen readers. */
.travinfo-quote__traveler {
	position: relative;
	border: 1px solid var(--tvq-line);
	border-left: 3px solid var(--tvq-gold);
	border-radius: var(--tvq-radius-sm);
	padding: 18px 20px 20px;
	margin: 0 0 14px;
	background: var(--tvq-white);
	min-width: 0;
	animation: tvq-rise 0.32s cubic-bezier(0.2, 0.7, 0.3, 1) both;
}

.travinfo-quote__traveler-title {
	display: block;
	float: left;
	width: auto;
	max-width: calc(100% - 80px);
	margin: 0;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--tvq-mist);
	color: var(--tvq-navy);
	font-size: 0.7em;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.travinfo-quote__traveler > .travinfo-quote__grid {
	clear: both;
	padding-top: 18px;
}

.travinfo-quote__remove {
	position: absolute;
	top: 18px;
	right: 18px;
	background: none;
	border: 0;
	border-radius: 4px;
	padding: 2px 4px;
	color: var(--tvq-muted);
	cursor: pointer;
	font-family: inherit;
	font-size: 0.78em;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: color 0.15s ease;
}

.travinfo-quote__remove:hover,
.travinfo-quote__remove:focus-visible {
	color: var(--tvq-danger);
}

/* Annexes ---------------------------------------------------------------- */

/* Additional benefits: one framed group per traveler, holding whichever
   benefits the plan prices for their age. */
.travinfo-quote__benefits {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px dashed var(--tvq-line);
}

.travinfo-quote__benefits-title {
	margin: 0;
	color: var(--tvq-navy);
	font-size: 1em;
	font-weight: 700;
}

.travinfo-quote__benefits-lead {
	margin: 4px 0 0;
	color: var(--tvq-muted, #5b6580);
	font-size: 0.86em;
}

.travinfo-quote__addons {
	margin-top: 18px;
	padding: 16px 18px;
	border: 1px solid var(--tvq-line);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-mist);
}

.travinfo-quote__addon + .travinfo-quote__addon {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--tvq-line);
}

.travinfo-quote__addon.is-incomplete {
	padding: 12px 14px;
	border-radius: var(--tvq-radius-sm);
	outline: 2px solid rgba(192, 57, 43, 0.35);
	outline-offset: 1px;
}

.travinfo-quote__traveler.has-benefit-gap .travinfo-quote__benefits {
	border-top-color: rgba(192, 57, 43, 0.55);
}

.travinfo-quote__addon-title {
	display: block;
	margin-bottom: 4px;
	color: var(--tvq-navy);
	font-size: 0.92em;
	font-weight: 700;
	line-height: 1.4;
}

.travinfo-quote__addon-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
}

.travinfo-quote__addon-options label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-right: 0;
	padding: 8px 18px;
	border: 1px solid var(--tvq-line);
	border-radius: 999px;
	background: var(--tvq-white);
	color: var(--tvq-navy-ink);
	cursor: pointer;
	font-size: 0.9em;
	font-weight: 600;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.travinfo-quote__addon-options label:hover {
	border-color: var(--tvq-navy);
}

/* accent-color already marks the choice everywhere; :has() upgrades the whole
   pill to a filled state where it is supported. */
.travinfo-quote__addon-options input[type="radio"] {
	margin: 0;
	accent-color: var(--tvq-navy);
}

.travinfo-quote__addon-options label:has(input:checked) {
	border-color: var(--tvq-navy);
	background: var(--tvq-navy);
	color: var(--tvq-white);
}

.travinfo-quote__addon-options label:has(input:checked) input[type="radio"] {
	accent-color: var(--tvq-gold-light);
}

.travinfo-quote__addon-options label:focus-within {
	box-shadow: 0 0 0 3px rgba(180, 149, 50, 0.32);
}

.travinfo-quote__footnote {
	display: block;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid var(--tvq-line);
	color: var(--tvq-muted);
	font-size: 0.8em;
	line-height: 1.65;
}

/* Running totals --------------------------------------------------------- */

/* The payoff of the form, so it is the one reversed panel in the flow: money
   always appears white on navy, here and on the summary. */
.travinfo-quote__totals {
	margin-top: 30px;
	padding: 24px 26px;
	border-radius: var(--tvq-radius);
	background: var(--tvq-navy);
	color: var(--tvq-white);
}

.travinfo-quote__totals-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
	gap: var(--tvq-gap);
}

.travinfo-quote__totals .travinfo-quote__field label {
	color: var(--tvq-gold-light);
}

.travinfo-quote__totals .travinfo-quote__field input[readonly] {
	min-height: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--tvq-white);
	font-size: 1.7em;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.travinfo-quote__totals .travinfo-quote__field input[readonly]::placeholder {
	color: rgba(255, 255, 255, 0.35);
}

.travinfo-quote__totals .travinfo-quote__field input[readonly]:focus {
	box-shadow: none;
}

.travinfo-quote__totals-note {
	margin: 18px 0 0;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	color: rgba(255, 255, 255, 0.72);
	font-size: 0.8em;
}

/* Actions ---------------------------------------------------------------- */

.travinfo-quote__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 26px 0 0;
}

.travinfo-quote__button {
	appearance: none;
	border: 1px solid var(--tvq-navy);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-navy);
	color: var(--tvq-white);
	cursor: pointer;
	font-family: inherit;
	font-size: 0.82em;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	padding: 14px 30px;
	transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.travinfo-quote__button:hover {
	background: var(--tvq-navy-deep);
	border-color: var(--tvq-navy-deep);
	transform: translateY(-1px);
	box-shadow: 0 8px 18px -10px rgba(24, 33, 63, 0.7);
}

.travinfo-quote__button:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(180, 149, 50, 0.45);
}

.travinfo-quote__button--secondary {
	background: var(--tvq-white);
	color: var(--tvq-navy);
}

.travinfo-quote__button--secondary:hover {
	background: var(--tvq-mist);
	color: var(--tvq-navy-deep);
	box-shadow: none;
}

.travinfo-quote__button[disabled] {
	opacity: 0.4;
	cursor: not-allowed;
	background: var(--tvq-navy);
	border-color: var(--tvq-navy);
	transform: none;
	box-shadow: none;
}

/* Messages --------------------------------------------------------------- */

.travinfo-quote__errors {
	border: 1px solid rgba(165, 52, 44, 0.28);
	border-left: 3px solid var(--tvq-danger);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-danger-bg);
	color: var(--tvq-danger-ink);
	padding: 14px 18px;
	margin: var(--tvq-pad) var(--tvq-pad) 24px;
	font-size: 0.92em;
}

.travinfo-quote__errors ul {
	margin: 0;
	padding-left: 18px;
}

/* Not a mistake the visitor made: the plan cannot price this trip, so it reads
   as an attention note rather than an error. */
.travinfo-quote__blocked,
.travinfo-quote__traveler-error {
	border: 1px solid var(--tvq-gold);
	border-left: 3px solid var(--tvq-gold);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-wash);
	color: var(--tvq-gold-ink);
	padding: 13px 16px;
	margin: 18px 0 0;
	font-size: 0.88em;
	font-weight: 600;
}

.travinfo-quote__notice {
	max-width: 960px;
	margin: 0 auto;
	padding: 18px 22px;
	border: 1px solid var(--tvq-line);
	border-left: 3px solid var(--tvq-gold);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-mist);
	color: var(--tvq-navy-ink);
}

.travinfo-quote > .travinfo-quote__notice {
	margin: var(--tvq-pad);
}

/* Summary ---------------------------------------------------------------- */

.travinfo-quote--summary .travinfo-quote__thanks {
	margin: 0 0 30px;
	padding: 20px 24px;
	border: 1px solid var(--tvq-line);
	border-left: 3px solid var(--tvq-gold);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-wash);
	color: var(--tvq-navy-ink);
	font-size: 1em;
	line-height: 1.65;
}

.travinfo-quote__meta {
	list-style: none;
	margin: 0 0 30px;
	padding: 22px 24px;
	border: 1px solid var(--tvq-line);
	border-radius: var(--tvq-radius-sm);
	background: var(--tvq-mist);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
	gap: 18px 24px;
}

.travinfo-quote__meta li {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 0.98em;
	font-weight: 600;
}

.travinfo-quote__meta strong {
	color: var(--tvq-muted);
	font-size: 0.7em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.travinfo-quote__table-wrap {
	overflow-x: auto;
	margin-bottom: 30px;
}

.travinfo-quote__table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	font-size: 0.94em;
}

.travinfo-quote__table th,
.travinfo-quote__table td {
	border-bottom: 1px solid var(--tvq-line);
	padding: 13px 14px;
	text-align: left;
	vertical-align: top;
}

.travinfo-quote__table thead th {
	border-bottom: 2px solid var(--tvq-navy);
	color: var(--tvq-navy);
	font-size: 0.76em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* The stub: the two totals as one issued ticket, split by a perforation. The
   half circles are the card background showing through the clipped corners. */
.travinfo-quote__stub {
	position: relative;
	border-radius: var(--tvq-radius);
	overflow: hidden;
}

.travinfo-quote__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin: 0;
	padding: 22px 26px;
	background: var(--tvq-navy);
	color: var(--tvq-white);
}

.travinfo-quote__total strong {
	color: var(--tvq-gold-light);
	font-size: 0.72em;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.travinfo-quote__total-value {
	font-size: 1.9em;
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.travinfo-quote__total--secondary {
	position: relative;
	padding-top: 20px;
	border-top: 2px dashed rgba(227, 198, 109, 0.55);
	background: var(--tvq-navy-deep);
}

.travinfo-quote__total--secondary .travinfo-quote__total-value {
	font-size: 1.25em;
}

.travinfo-quote__total--secondary::before,
.travinfo-quote__total--secondary::after {
	content: "";
	position: absolute;
	top: -2px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--tvq-white);
	transform: translateY(-50%);
}

.travinfo-quote__total--secondary::before {
	left: -9px;
}

.travinfo-quote__total--secondary::after {
	right: -9px;
}

/* Motion ----------------------------------------------------------------- */

@keyframes tvq-rise {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.travinfo-quote,
	.travinfo-quote *,
	.travinfo-quote *::before,
	.travinfo-quote *::after {
		animation: none !important;
		transition: none !important;
	}
}

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

@media (max-width: 700px) {
	.travinfo-quote {
		--tvq-pad: 20px;
		--tvq-gap: 14px;
	}

	.travinfo-quote__title {
		font-size: 1.5em;
	}

	.travinfo-quote__steps li {
		gap: 8px;
		padding: 13px 4px;
		font-size: 0.7em;
		letter-spacing: 0.06em;
	}

	.travinfo-quote__steps li::before {
		width: 24px;
		height: 24px;
		flex: 0 0 24px;
	}

	.travinfo-quote__totals {
		padding: 20px;
	}

	.travinfo-quote__totals .travinfo-quote__field input[readonly] {
		font-size: 1.45em;
	}

	.travinfo-quote__actions .travinfo-quote__button {
		flex: 1 1 100%;
	}

	.travinfo-quote__total {
		padding: 18px 20px;
	}

	.travinfo-quote__total-value {
		font-size: 1.55em;
	}
}