/* why-readylinks.css — the "Why ReadyLinks" section: hub, outcome pages, and
 * the rebuilt casino stories. Palette follows the site: primary #063F5B,
 * gold #EEBF41, DM Sans via theme.css. */

.rl-why-hero {
	background: radial-gradient(120% 150% at 85% -20%, #0d5f88 0%, #063F5B 52%, #04283a 100%);
	color: #fff;
	padding: 72px 0 64px;
	position: relative;
	overflow: hidden;
}
.rl-why-hero:before {
	content: "";
	position: absolute; inset: 0;
	background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
	background-size: 34px 34px;
	-webkit-mask: radial-gradient(75% 130% at 82% 0, #000, transparent 72%);
	mask: radial-gradient(75% 130% at 82% 0, #000, transparent 72%);
}
.rl-why-hero .container { position: relative; }
.rl-why-kicker {
	font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
	color: #EEBF41; margin-bottom: 12px;
}
.rl-why-hero h1 { font-size: 2.6rem; font-weight: 700; line-height: 1.12; max-width: 720px; color: #fff; }
.rl-why-cta h2, .rl-why-trust h2 { color: #fff; }
.rl-why-hero .rl-why-sub { color: #c9dcea; font-size: 1.12rem; max-width: 640px; margin-top: 14px; }
.rl-why-hero .btn-light { color: #063F5B; font-weight: 600; }
.rl-why-hero .btn-outline-light { font-weight: 600; }

/* proof strip */
.rl-why-proof { background: #04283a; color: #fff; padding: 18px 0; }
.rl-why-proof .row { row-gap: 14px; }
.rl-why-proof b { display: block; font-size: 1.35rem; font-weight: 700; color: #EEBF41; }
.rl-why-proof span { font-size: .82rem; color: #a8c4d6; line-height: 1.35; display: block; }

/* generic section chrome */
.rl-why-section { padding: 64px 0; }
.rl-why-section--tint { background: #f6f8fa; }
.rl-why-section h2 { font-size: 1.9rem; font-weight: 700; color: #063F5B; }
.rl-why-section .rl-why-lead { color: #4a5b6a; max-width: 720px; margin-top: 10px; }

/* cards */
.rl-why-cards { margin-top: 34px; row-gap: 24px; }
.rl-why-card {
	background: #fff; border: 1px solid #e3e9ef; border-radius: 14px;
	padding: 26px 24px; height: 100%; display: flex; flex-direction: column;
	transition: box-shadow .18s ease, transform .18s ease;
}
.rl-why-card:hover { box-shadow: 0 14px 34px -18px rgba(6,63,91,.35); transform: translateY(-2px); }
.rl-why-card .rl-why-card-icon {
	width: 44px; height: 44px; border-radius: 11px; background: #eaf1f6; color: #063F5B;
	display: flex; align-items: center; justify-content: center; font-size: 1.15rem; margin-bottom: 16px;
}
.rl-why-card h3 { font-size: 1.12rem; font-weight: 700; color: #063F5B; }
.rl-why-card p { color: #4a5b6a; font-size: .95rem; margin: 8px 0 14px; }
.rl-why-card .rl-why-card-cta {
	margin-top: auto; font-weight: 600; color: #0d6efd; text-decoration: none; font-size: .95rem;
}
.rl-why-card .rl-why-card-cta:hover { text-decoration: underline; }

/* problem cards (outcome pages) — quiet, no hover lift */
.rl-why-card--problem { background: #f6f8fa; border-color: #e3e9ef; }
.rl-why-card--problem:hover { box-shadow: none; transform: none; }
.rl-why-card--problem .rl-why-card-icon { background: #fff; }

/* flagship proof tabs */
.rl-why-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 26px; }
.rl-why-tab {
	appearance: none; border: 1px solid #cfd9e3; background: #fff; color: #063F5B;
	border-radius: 999px; padding: 8px 18px; font-weight: 600; font-size: .92rem; cursor: pointer;
}
.rl-why-tab.active { background: #063F5B; color: #fff; border-color: #063F5B; }
.rl-why-tabpanes { margin-top: 24px; }
.rl-why-tabpane { display: none; }
.rl-why-tabpane.active { display: block; }
.rl-why-story {
	background: #fff; border: 1px solid #e3e9ef; border-radius: 16px; overflow: hidden;
}
.rl-why-story .row { min-height: 260px; }
.rl-why-story-media { background: #eef3f7 center/cover no-repeat; min-height: 220px; }
.rl-why-story-body { padding: 30px 30px 26px; }
.rl-why-story-body .rl-why-story-tag {
	font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #b07c12;
}
.rl-why-story-body h3 { font-size: 1.3rem; font-weight: 700; color: #063F5B; margin-top: 6px; }
.rl-why-story-body p { color: #4a5b6a; margin-top: 10px; }

/* trust band */
.rl-why-trust { background: #063F5B; color: #fff; }
.rl-why-trust h2, .rl-why-trust h3 { color: #fff; }
.rl-why-trust .rl-why-lead { color: #c9dcea; }
.rl-why-trust-fact { border-left: 3px solid #EEBF41; padding-left: 16px; margin-top: 22px; }
.rl-why-trust-fact b { display: block; font-size: 1.02rem; }
.rl-why-trust-fact span { color: #a8c4d6; font-size: .9rem; }
.rl-why-logos { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; margin-top: 26px; }
.rl-why-logo {
	background: #fff; border-radius: 10px; padding: 12px 20px; display: flex;
	align-items: center; justify-content: center; min-height: 62px; min-width: 130px; flex: 0 1 auto;
}
.rl-why-logo img { max-height: 34px; max-width: 130px; width: auto; }
.rl-why-logo--text { color: #063F5B; font-weight: 700; font-size: .95rem; letter-spacing: .02em; }

/* tool cards */
.rl-why-tool { text-decoration: none; display: block; height: 100%; }
.rl-why-tool .rl-why-card { border-bottom: 3px solid #EEBF41; }

/* CTA band */
.rl-why-cta { background: linear-gradient(100deg, #063F5B, #0a5678); color: #fff; padding: 52px 0; }
.rl-why-cta h2 { color: #fff; font-size: 1.7rem; font-weight: 700; }
.rl-why-cta p { color: #c9dcea; }

/* outcome pages: capability rows + featured products */
.rl-why-capability { display: flex; gap: 18px; margin-top: 26px; }
.rl-why-capability .rl-why-card-icon { flex: none; }
.rl-why-capability h3 { font-size: 1.05rem; font-weight: 700; color: #063F5B; }
.rl-why-capability p { color: #4a5b6a; font-size: .95rem; margin: 6px 0 4px; }
.rl-why-capability a { font-weight: 600; font-size: .92rem; }

.rl-why-product {
	background: #fff; border: 1px solid #e3e9ef; border-radius: 14px; padding: 20px;
	display: flex; gap: 18px; align-items: center; height: 100%; text-decoration: none;
}
.rl-why-product img { max-height: 54px; max-width: 130px; }
.rl-why-product b { color: #063F5B; display: block; }
.rl-why-product span { color: #4a5b6a; font-size: .88rem; }

/* buttons on the dark hero / CTA bands — the theme's .btn-light goes muddy
   on navy, so pin the two states explicitly */
.rl-why-hero .btn-light, .rl-why-cta .btn-light {
	background: #fff; border: 1px solid #fff; color: #063F5B; font-weight: 600;
}
.rl-why-hero .btn-light:hover, .rl-why-cta .btn-light:hover,
.rl-why-hero .btn-light:focus, .rl-why-cta .btn-light:focus {
	background: #EEBF41; border-color: #EEBF41; color: #063F5B;
}
.rl-why-hero .btn-outline-light, .rl-why-cta .btn-outline-light {
	color: #fff; border: 1px solid rgba(255,255,255,.75); font-weight: 600; background: transparent;
}
.rl-why-hero .btn-outline-light:hover, .rl-why-cta .btn-outline-light:hover,
.rl-why-hero .btn-outline-light:focus, .rl-why-cta .btn-outline-light:focus {
	background: rgba(255,255,255,.14); border-color: #fff; color: #fff;
}

/* next-outcome cards — replaces the bare sibling links */
.rl-why-next { background: #f6f8fa; padding: 46px 0 56px; }
.rl-why-next .rl-why-next-kicker {
	font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
	color: #b07c12; margin-bottom: 18px;
}
.rl-why-next a.rl-why-card {
	text-decoration: none; flex-direction: row; align-items: center; gap: 16px; padding: 20px 22px;
}
.rl-why-next a.rl-why-card .rl-why-card-icon { margin-bottom: 0; flex: none; }
.rl-why-next a.rl-why-card h3 { font-size: 1.02rem; margin: 0; }
.rl-why-next a.rl-why-card p { margin: 4px 0 0; font-size: .88rem; }
.rl-why-next a.rl-why-card .rl-why-next-arrow {
	margin-left: auto; color: #0d6efd; font-weight: 700; font-size: 1.1rem; flex: none;
}

/* story pages */
.rl-why-storyhero { padding: 64px 0 46px; }
.rl-why-storyhero .rl-why-cable {
	display: inline-block; background: #eaf1f6; color: #063F5B; font-weight: 700;
	border-radius: 999px; padding: 6px 16px; font-size: .88rem; margin-top: 16px;
}
.rl-why-storybody h2 { font-size: 1.45rem; margin-top: 38px; }
.rl-why-storybody p { color: #3d4e5c; font-size: 1.02rem; line-height: 1.7; margin-top: 14px; }
.rl-why-quotefacts {
	background: #f6f8fa; border: 1px solid #e3e9ef; border-radius: 14px; padding: 22px 24px; margin-top: 26px;
}
.rl-why-quotefacts li { color: #3d4e5c; margin: 6px 0; }

@media (max-width: 767.98px) {
	.rl-why-hero { padding: 52px 0 44px; }
	.rl-why-hero h1 { font-size: 1.9rem; }
	.rl-why-section { padding: 46px 0; }
	.rl-why-capability { flex-direction: column; gap: 10px; }
}
