/* ============================================================================
   EUX Blocks — eux/tyro-rba (RBA / Calculator callout section)
   Three themes: dark (default), cream, light.
   Purple radial gradient only active on dark.
   ============================================================================ */

.eux-block--tyro-rba {
	display: block;
	position: relative;
	overflow: hidden;
	padding-block: 96px;
}

/* ---- Theme backgrounds --------------------------------------------------- */
.eux-block--tyro-rba.eux-tyro-rba--dark  { background: #0a0a0a; }
.eux-block--tyro-rba.eux-tyro-rba--cream { background: var(--eux-cream-100); }
.eux-block--tyro-rba.eux-tyro-rba--light { background: var(--eux-white); }

/* Purple radial glow — dark only */
.eux-block--tyro-rba.eux-tyro-rba--dark::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(800px 320px at 80% 20%, rgba(166, 89, 248, 0.18), transparent 60%),
		radial-gradient(600px 240px at 10% 90%, rgba(166, 89, 248, 0.10), transparent 60%);
	pointer-events: none;
}

/* ---- Container ----------------------------------------------------------- */
.eux-block--tyro-rba .eux-tyro-rba__container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 48px;
	position: relative;
	z-index: 1;
}

/* ---- Columns — defend against Salient flex-grow -------------------------- */
.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols {
	gap: 64px;
	margin: 0;
	align-items: center;
}

@media (min-width: 901px) {
	.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols > .wp-block-column.eux-tyro-rba__calc-col {
		flex: 0 0 42% !important;
		max-width: 42%;
	}
	.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols > .wp-block-column.eux-tyro-rba__copy-col {
		flex: 0 0 calc(58% - 64px) !important;
		max-width: 58%;
	}
}

@media (max-width: 900px) {
	.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols {
		flex-wrap: wrap !important;
		gap: 48px;
	}
	.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols > .wp-block-column {
		flex-basis: 100% !important;
		max-width: 100% !important;
	}
}

/* ============================================================================
   COPY COLUMN — dark theme (default)
   ============================================================================ */

.eux-tyro-rba--dark .eux-tyro-rba__title {
	font-family: var(--eux-font-display) !important;
	font-weight: 400 !important;
	font-size: clamp(32px, 3.8vw, 48px) !important;
	line-height: 1.08 !important;
	letter-spacing: -0.022em !important;
	color: var(--eux-cream) !important;
	margin: 0 0 20px !important;
	text-wrap: balance;
}

.eux-tyro-rba--dark .eux-tyro-rba__title em {
	font-style: italic;
	font-weight: 300;
	color: var(--eux-woo-300);
}

.eux-tyro-rba--dark .eux-tyro-rba__body {
	font-family: var(--eux-font-body) !important;
	font-size: 16px !important;
	line-height: 1.65 !important;
	color: rgba(244, 240, 236, 0.7) !important;
	margin: 0 0 12px !important;
}

.eux-tyro-rba--dark .eux-tyro-rba__list {
	list-style: none !important;
	padding: 0 !important;
	margin: 20px 0 24px !important;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.eux-tyro-rba--dark .eux-tyro-rba__list li,
.eux-tyro-rba--dark .eux-tyro-rba__list .wp-block-list-item {
	position: relative;
	padding-left: 20px;
	list-style: none !important;
	font-family: var(--eux-font-body) !important;
	font-size: 15px !important;
	color: rgba(244, 240, 236, 0.75) !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}

.eux-tyro-rba--dark .eux-tyro-rba__list li::before,
.eux-tyro-rba--dark .eux-tyro-rba__list .wp-block-list-item::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 8px;
	height: 1.5px;
	background: var(--eux-woo-300);
}

.eux-tyro-rba--dark .eux-tyro-rba__list li::marker,
.eux-tyro-rba--dark .eux-tyro-rba__list .wp-block-list-item::marker {
	content: '' !important;
}

.eux-tyro-rba--dark .eux-tyro-rba__legal {
	font-family: var(--eux-font-mono) !important;
	font-size: 10.5px !important;
	line-height: 1.55 !important;
	color: rgba(244, 240, 236, 0.35) !important;
	margin: 0 !important;
	max-width: 52ch;
}

/* ============================================================================
   COPY COLUMN — cream + light themes (shared, ink-on-light)
   ============================================================================ */

.eux-tyro-rba--cream .eux-tyro-rba__title,
.eux-tyro-rba--light .eux-tyro-rba__title {
	font-family: var(--eux-font-display) !important;
	font-weight: 400 !important;
	font-size: clamp(32px, 3.8vw, 48px) !important;
	line-height: 1.08 !important;
	letter-spacing: -0.022em !important;
	color: var(--eux-ink-900) !important;
	margin: 0 0 20px !important;
	text-wrap: balance;
}

.eux-tyro-rba--cream .eux-tyro-rba__title em,
.eux-tyro-rba--light .eux-tyro-rba__title em {
	font-style: italic;
	font-weight: 300;
	color: var(--eux-woo-purple);
}

.eux-tyro-rba--cream .eux-tyro-rba__body,
.eux-tyro-rba--light .eux-tyro-rba__body {
	font-family: var(--eux-font-body) !important;
	font-size: 16px !important;
	line-height: 1.65 !important;
	color: var(--eux-ink-700) !important;
	margin: 0 0 12px !important;
}

.eux-tyro-rba--cream .eux-tyro-rba__list,
.eux-tyro-rba--light .eux-tyro-rba__list {
	list-style: none !important;
	padding: 0 !important;
	margin: 20px 0 24px !important;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.eux-tyro-rba--cream .eux-tyro-rba__list li,
.eux-tyro-rba--cream .eux-tyro-rba__list .wp-block-list-item,
.eux-tyro-rba--light .eux-tyro-rba__list li,
.eux-tyro-rba--light .eux-tyro-rba__list .wp-block-list-item {
	position: relative;
	padding-left: 20px;
	list-style: none !important;
	font-family: var(--eux-font-body) !important;
	font-size: 15px !important;
	color: var(--eux-ink-700) !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}

.eux-tyro-rba--cream .eux-tyro-rba__list li::before,
.eux-tyro-rba--cream .eux-tyro-rba__list .wp-block-list-item::before,
.eux-tyro-rba--light .eux-tyro-rba__list li::before,
.eux-tyro-rba--light .eux-tyro-rba__list .wp-block-list-item::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 8px;
	height: 1.5px;
	background: var(--eux-woo-purple);
}

.eux-tyro-rba--cream .eux-tyro-rba__list li::marker,
.eux-tyro-rba--cream .eux-tyro-rba__list .wp-block-list-item::marker,
.eux-tyro-rba--light .eux-tyro-rba__list li::marker,
.eux-tyro-rba--light .eux-tyro-rba__list .wp-block-list-item::marker {
	content: '' !important;
}

.eux-tyro-rba--cream .eux-tyro-rba__legal,
.eux-tyro-rba--light .eux-tyro-rba__legal {
	font-family: var(--eux-font-mono) !important;
	font-size: 10.5px !important;
	line-height: 1.55 !important;
	color: var(--eux-ink-500) !important;
	margin: 0 !important;
	max-width: 52ch;
}

/* ============================================================================
   CTA button — shared across all themes
   ============================================================================ */

.eux-block--tyro-rba .eux-tyro-rba__ctas {
	margin: 0 0 20px !important;
}

.eux-block--tyro-rba .eux-tyro-rba__ctas .wp-block-button {
	width: auto !important;
}

.eux-block--tyro-rba .eux-tyro-rba__ctas .wp-block-button__link {
	background: var(--eux-woo-purple) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 8px !important;
	padding: 14px 24px !important;
	font-family: var(--eux-font-display) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: -0.01em !important;
	transition: background 180ms, transform 180ms !important;
	width: auto !important;
}

.eux-block--tyro-rba .eux-tyro-rba__ctas .wp-block-button__link:hover {
	background: #5a0bb8 !important;
	transform: translateY(-1px) !important;
}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */

@media (min-width: 901px) and (max-width: 1399px) {
	.eux-block--tyro-rba { padding-block: 80px; }
	.eux-block--tyro-rba .eux-tyro-rba__container { padding: 0 40px; }
	.eux-block--tyro-rba .wp-block-columns.eux-tyro-rba__cols { gap: 48px; }
}

@media (max-width: 900px) {
	.eux-block--tyro-rba { padding-block: 64px; }
	.eux-block--tyro-rba .eux-tyro-rba__container { padding: 0 32px; }
}

@media (max-width: 580px) {
	.eux-block--tyro-rba .eux-tyro-rba__container { padding: 0 24px; }
}
