/* Hero trust chips */

.tessa-product .ts-chips {
	margin: 26px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	list-style: none;
}

.tessa-product .ts-chips li {
	padding: 5px 10px;
	border: 1px solid var(--tp-line);
	border-radius: 3px;
	font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
	font-size: 0.6875rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--tp-muted);
	background: #fff;
}

/* Editions: one comparison matrix in black and white. Cloud plans sit under a
   white group header, the Sovereign column is dark top to bottom, the recommended
   plan has ink rails and the checks are ink. Below 900px the table becomes one
   accordion per plan. */

.tessa-product .tp-matrix-wrap {
	border: 1px solid var(--tp-line);
	border-radius: 6px;
	background: #fff;
	overflow: hidden;
}

.tessa-product .tp-matrix {
	width: 100%;
	border-collapse: collapse;
}

.tessa-product .tp-matrix th,
.tessa-product .tp-matrix td {
	padding: 12px 16px;
	text-align: left;
	vertical-align: top;
	border-top: 1px solid var(--tp-line-soft);
	font-size: 0.875rem;
	font-weight: 400;
}

.tessa-product .tp-matrix thead th {
	border-top: 0;
}

.tessa-product .tp-matrix-groups th {
	padding: 10px 16px;
	border-bottom: 1px solid var(--tp-line);
	vertical-align: middle;
}

.tessa-product .tp-matrix-group {
	font-size: 0.8125rem;
	font-weight: 700;
}

.tessa-product .tp-matrix-group-name {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	line-height: 1.2;
}

.tessa-product .tp-matrix-group svg {
	flex: none;
}

.tessa-product .tp-matrix-group.is-cloud {
	background: #fff;
	color: var(--tp-ink);
}

.tessa-product .tp-matrix-group.is-sovereign {
	background: #171717;
	color: #fff;
	border-bottom-color: #2a2a2a;
}

.tessa-product .tp-matrix-group small {
	display: block;
	margin-top: 3px;
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.4;
}

.tessa-product .tp-matrix-group.is-cloud small {
	color: var(--tp-muted);
}

.tessa-product .tp-matrix-group.is-sovereign small {
	color: rgba(237, 237, 237, 0.7);
}

.tessa-product .tp-matrix-plans th {
	padding: 18px 16px;
	border-bottom: 1px solid var(--tp-line);
	vertical-align: top;
}

.tessa-product .tp-matrix-plans th:first-child {
	vertical-align: bottom;
}

.tessa-product .tp-matrix-plans th:first-child,
.tessa-product .tp-matrix tbody th {
	width: 230px;
}

.tessa-product .tp-matrix-label {
	font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--tp-faint);
}

.tessa-product .tp-matrix-plan {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tessa-product .tp-matrix-plan-name {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--tp-ink);
}

.tessa-product .tp-matrix-plan-who {
	margin-top: 2px;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.5;
	color: var(--tp-faint);
}

/* Reserve two subtitle lines in the desktop header so names, prices, and buttons align across plans. */
.tessa-product .tp-matrix-plans .tp-matrix-plan-who {
	min-height: 36px;
}

.tessa-product .tp-matrix-price {
	font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
	font-size: 1.5rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	line-height: 1;
	color: var(--tp-ink);
}

.tessa-product .tp-matrix-price-unit {
	margin-top: 2px;
	font-size: 0.75rem;
	color: var(--tp-faint);
}

.tessa-product .tp-matrix-price-hint {
	margin-top: 5px;
	font-size: 0.75rem;
	font-variant-numeric: tabular-nums;
	color: var(--tp-faint);
}

.tessa-product .tp-matrix .tp-button {
	min-height: 34px;
	padding: 0 14px;
	border-radius: 8px;
	align-self: flex-start;
	font-size: 0.8125rem;
}

.tessa-product .tp-matrix tbody th {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--tp-muted);
}

.tessa-product .tp-matrix .is-featured {
	background: #fff;
	border-left: 2px solid var(--tp-ink);
	border-right: 2px solid var(--tp-ink);
}

.tessa-product .tp-matrix-plans th.is-featured {
	padding-top: 15px;
	border-top: 3px solid var(--tp-ink);
}

.tessa-product .tp-matrix .is-dark {
	background: #171717;
	color: #ededed;
	border-top-color: #2a2a2a;
}

.tessa-product .tp-matrix .is-dark .tp-matrix-plan-name,
.tessa-product .tp-matrix .is-dark .tp-matrix-price {
	color: #fff;
}

.tessa-product .tp-matrix .is-dark .tp-matrix-plan-who,
.tessa-product .tp-matrix .is-dark .tp-matrix-price-unit {
	color: rgba(237, 237, 237, 0.7);
}

.tessa-product .tp-matrix .is-dark .tp-button-secondary,
.tessa-product .tp-plan-acc.is-dark .tp-button-secondary {
	background: #fff;
	border-color: #fff;
	color: var(--tp-ink);
}

.tessa-product .tp-matrix-check {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--tp-ink);
}

.tessa-product .is-dark .tp-matrix-check {
	color: #fff;
}

.tessa-product .tp-matrix-none {
	color: #a0a0a8;
}

.tessa-product .is-dark .tp-matrix-none {
	color: rgba(237, 237, 237, 0.4);
}

.tessa-product .tp-matrix-note {
	margin-top: 16px;
	font-size: 0.875rem;
	color: var(--tp-muted);
}

.tessa-product .tp-matrix-legal {
	margin-top: 12px;
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--tp-muted);
}

.tessa-product .tp-matrix-legal a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Pricing page */

/* The pricing page is read on white; the table follows the centred hero. */
.tessa-pricing .tp-tiers-section {
	padding-top: 24px;
	background: #fff;
}

.tessa-pricing .tp-pricing-heading {
	margin-bottom: 28px;
}

/* Mobile: one accordion per plan */

.tessa-product .tp-matrix-mobile {
	display: none;
	flex-direction: column;
	gap: 8px;
}

.tessa-product .tp-matrix-mgroup {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	border-radius: 6px;
	font-size: 0.8125rem;
	font-weight: 700;
}

.tessa-product .tp-matrix-mgroup span {
	font-weight: 500;
}

.tessa-product .tp-matrix-mgroup.is-cloud {
	background: #fff;
	color: var(--tp-ink);
}

.tessa-product .tp-matrix-mgroup.is-cloud span {
	color: var(--tp-muted);
}

.tessa-product .tp-matrix-mgroup.is-sovereign {
	margin-top: 12px;
	background: #171717;
	color: #fff;
}

.tessa-product .tp-matrix-mgroup.is-sovereign span {
	color: rgba(237, 237, 237, 0.7);
}

.tessa-product .tp-plan-acc {
	border: 1px solid var(--tp-line);
	border-radius: 6px;
	background: #fff;
	overflow: hidden;
}

.tessa-product .tp-plan-acc.is-featured {
	border-color: var(--tp-ink);
}

.tessa-product .tp-plan-acc.is-dark {
	background: #171717;
	border-color: #171717;
	color: #ededed;
}

.tessa-product .tp-plan-acc summary {
	list-style: none;
	cursor: pointer;
	padding: 14px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.tessa-product .tp-plan-acc summary::-webkit-details-marker {
	display: none;
}

.tessa-product .tp-plan-acc.is-featured summary {
	background: #fff;
}

.tessa-product .tp-plan-acc-head,
.tessa-product .tp-plan-acc-price {
	display: flex;
	flex-direction: column;
}

.tessa-product .tp-plan-acc-head {
	flex: 1;
	min-width: 0;
}

.tessa-product .tp-plan-acc-price {
	text-align: right;
}

.tessa-product .tp-plan-acc .tp-matrix-price {
	font-size: 1.125rem;
}

.tessa-product .tp-plan-acc .tp-matrix-price-unit {
	margin-top: 2px;
	font-size: 0.6875rem;
}

.tessa-product .tp-plan-acc .tp-matrix-price-hint {
	display: block;
	margin-top: 3px;
	font-size: 0.6875rem;
	color: var(--tp-faint);
}

.tessa-product .tp-plan-acc.is-dark .tp-matrix-plan-name,
.tessa-product .tp-plan-acc.is-dark .tp-matrix-price {
	color: #fff;
}

.tessa-product .tp-plan-acc.is-dark .tp-matrix-plan-who,
.tessa-product .tp-plan-acc.is-dark .tp-matrix-price-unit {
	color: rgba(237, 237, 237, 0.7);
}

.tessa-product .tp-plan-acc-chev {
	flex: none;
	color: var(--tp-faint);
	transition: transform 120ms ease;
}

.tessa-product .tp-plan-acc[open] .tp-plan-acc-chev {
	transform: rotate(180deg);
}

.tessa-product .tp-plan-acc-body {
	padding: 4px 16px 16px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tessa-product .tp-plan-acc-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 11px 0;
	border-top: 1px solid var(--tp-line-soft);
	font-size: 0.875rem;
}

.tessa-product .tp-plan-acc-row > span:first-child {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--tp-muted);
}

.tessa-product .tp-plan-acc-row > span:last-child {
	text-align: right;
}

.tessa-product .tp-plan-acc.is-dark .tp-plan-acc-row {
	border-top-color: #2a2a2a;
}

.tessa-product .tp-plan-acc.is-dark .tp-plan-acc-row > span:first-child {
	color: rgba(237, 237, 237, 0.7);
}

.tessa-product .tp-plan-acc .tp-button {
	width: 100%;
}

@media (max-width: 900px) {
	.tessa-product .tp-matrix-wrap {
		display: none;
	}

	.tessa-product .tp-matrix-mobile {
		display: flex;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tessa-product .tp-plan-acc-chev {
		transition: none;
	}
}