/* Drake seasonal-recruiting landing page (tax-xpert-assist). AB#375065.
   Scoped under .dxa so styles don't leak into the shared shell. */

.dxa {
	--dxa-brand: #003b71;
	--dxa-accent: #1b75bc;
	--dxa-body: #31435a;
	--dxa-border: #d8e0ea;
	--dxa-bg-soft: #f3f7fc;
	color: var(--dxa-body);
	line-height: 1.55;
}

.dxa * {
	box-sizing: border-box;
}

.dxa .dxa-container {
	max-width: 1160px;
	margin: 0 auto;
	padding: 0 24px;
	width: 100%;
}

/* ---------- Hero (TaxAct-style banner) ---------- */
.dxa-hero {
	min-height: 460px;
	display: flex;
	align-items: center;
	background-color: var(--dxa-bg-soft);
	background-image:
		linear-gradient(90deg, var(--dxa-bg-soft) 30%, rgba(243, 247, 252, 0) 62%),
		url("https://images.ctfassets.net/8ciosupf5c48/2pSFZGvJShxrYtq4HPkjGM/a5da38df4d67bc848b2d37037f50278a/tax-xpert-assist-hero.png?fm=webp&q=80&w=1440");
	background-repeat: no-repeat, no-repeat;
	background-position: center, right center;
	background-size: cover, cover;
	padding: 40px 0;
}

.dxa-hero-content {
	max-width: 540px;
}

.dxa-hero-img-mobile {
	display: none;
}

.dxa-hero h1 {
	font-size: 48px;
	line-height: 1.1;
	font-weight: 800;
	color: #1a1a1a;
	margin: 0 0 14px;
}

.dxa-hero-sub {
	font-size: 20px;
	font-weight: 700;
	color: #1a1a1a;
	margin: 0;
	max-width: 340px;
}

/* ---------- Role details ---------- */
.dxa-details {
	padding: 48px 0;
}

.dxa-details-title {
	font-size: 30px;
	line-height: 1.2;
	color: var(--dxa-accent);
	margin: 0 0 20px;
}

.dxa-details p {
	font-size: 16px;
	margin: 0 0 16px;
}

.dxa-list {
	margin: 20px 0;
	padding: 0;
	list-style: none;
}

.dxa-list li {
	position: relative;
	padding: 0 0 12px 30px;
	font-size: 16px;
}

.dxa-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	width: 18px;
	height: 18px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322a06b' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: center;
}

/* ---------- Contact / opportunities note + buttons ---------- */
.dxa-contact {
	margin-top: 28px;
}

.dxa-contact h3 {
	font-size: 20px;
	font-weight: 700;
	color: var(--dxa-accent);
	margin: 0 0 6px;
}

.dxa-contact p {
	margin: 0;
	font-size: 16px;
}

.dxa-contact a {
	color: #1a1a1a;
	font-weight: 700;
	text-decoration: underline;
}

.dxa-btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 26px;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	cursor: pointer;
}

.dxa-btn-primary {
	background: var(--dxa-accent);
	color: #fff;
	border: 1px solid var(--dxa-accent);
}

.dxa-btn-primary:hover {
	background: var(--dxa-brand);
	border-color: var(--dxa-brand);
}

.dxa-btn-outline {
	background: #fff;
	color: var(--dxa-accent);
	border: 1px solid var(--dxa-accent);
}

/* ---------- Why Join Us (stacked list) ---------- */
.dxa-benefits {
	padding: 56px 0;
	background: var(--dxa-bg-soft);
}

.dxa-benefits h2 {
	font-size: 30px;
	color: var(--dxa-accent);
	margin: 0 0 28px;
}

.dxa-benefit {
	max-width: 860px;
	margin: 0 0 20px;
}

.dxa-benefit h3 {
	font-size: 17px;
	color: #1a1a1a;
	margin: 0 0 6px;
}

.dxa-benefit p {
	margin: 0;
	font-size: 16px;
}

/* ---------- Cross-promotion / legal ---------- */
.dxa-cross {
	padding: 40px 0;
}

.dxa-cross h3 {
	font-size: 20px;
	font-weight: 700;
	color: var(--dxa-accent);
	margin: 0 0 6px;
}

.dxa-cross p {
	margin: 0;
	font-size: 16px;
}

.dxa-legal {
	padding: 8px 0 48px;
	font-size: 13px;
	color: #6b6885;
	text-align: center;
}

.dxa-legal a {
	color: #000;
	font-weight: 700;
	text-decoration: underline;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.dxa-hero {
		display: flex;
		flex-direction: column;
		min-height: 0;
		background-image: none;
		padding: 0;
	}

	/* Text first, image below (matches TaxAct mobile layout) */
	.dxa-hero .dxa-container {
		order: 1;
		padding-top: 28px;
		padding-bottom: 28px;
	}

	.dxa-hero-img-mobile {
		order: 2;
		display: block;
		width: 100%;
		height: 240px;
		object-fit: cover;
		object-position: right center;
		margin: 0;
	}

	.dxa-hero-content {
		max-width: none;
	}

	.dxa-hero h1 {
		font-size: 30px;
	}
}
