/**
 * IPIE sidebar marketing widgets (Reasons + Step-by-Step).
 *
 * Shared styles for the two presentational cards rendered by
 * includes/utility/widgets/marketing-widgets.php. Enqueued at render time by
 * ipie_enqueue_marketing_widgets_assets() so it loads only on pages where a
 * widget appears. The font families (Inter + Zilla Slab) are enqueued
 * alongside this file by the same function.
 */

.ipie-reasons-widget,
.ipie-step-widget {
	width: 100%;
	margin-bottom: 20px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0,17,28,.35);
	box-sizing: border-box;
}
.ipie-reasons-widget *,
.ipie-step-widget * { box-sizing: border-box; }

@keyframes ipie-mw-arrow { 0%,100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
.ipie-mw-arrow { display: inline-block; animation: ipie-mw-arrow 1.4s ease-in-out infinite; }

/* Widget A — Reasons */
.ipie-reasons-widget {
	background: var(--ipie-primary, #002b41);
	color: #fff;
	font-family: 'Zilla Slab', Georgia, serif;
}
.ipie-reasons-widget__accent { height: 5px; background: var(--ipie-accent, #ffd600); }
.ipie-reasons-widget__header { display: flex; align-items: flex-start; gap: 14px; padding: 22px 22px 18px; }
.ipie-reasons-widget__count {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 900; font-size: 62px; line-height: .82; color: var(--ipie-accent, #ffd600); letter-spacing: -2px;
}
.ipie-reasons-widget__heading {
	margin: 0;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 800; font-size: 20px; line-height: 1.08; color: #fff;
}
.ipie-reasons-widget__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.10); }
.ipie-reasons-widget__list li { margin: 0; }
.ipie-reasons-widget__row {
	display: flex; align-items: center; gap: 13px; padding: 13px 22px;
	color: #fff; text-decoration: none;
	border-bottom: 1px solid rgba(255,255,255,.08);
	transition: background .15s ease;
}
.ipie-reasons-widget__row:hover,
.ipie-reasons-widget__row:focus { background: #063a54; color: #fff; }
/* Sidebar white links gain an underline on hover; extra class in the selector
   outranks the theme's icon-link exclusion (which carries :hover). */
.ipie-reasons-widget .ipie-reasons-widget__row:hover,
.ipie-reasons-widget .ipie-reasons-widget__row:focus { text-decoration: underline; }
.ipie-reasons-widget__index {
	min-width: 24px; text-align: right;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 800; font-size: 15px; color: var(--ipie-accent, #ffd600); font-variant-numeric: tabular-nums;
}
.ipie-reasons-widget__text { font-weight: 500; font-size: 15px; line-height: 1.25; color: #fff; }
.ipie-reasons-widget__cta {
	display: flex; justify-content: center; align-items: center; gap: 8px;
	padding: 15px 20px; background: var(--ipie-accent, #ffd600); color: var(--ipie-primary, #002b41); text-decoration: none;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 800; font-size: 13px; letter-spacing: .6px; text-transform: uppercase;
	transition: background .15s ease;
}
.ipie-reasons-widget__cta:hover,
.ipie-reasons-widget__cta:focus { background: #ffe34d; color: var(--ipie-primary, #002b41); }

/* Widget B — Step-by-Step */
/* Own coral accent, deliberately distinct from the gold the reasons widget
   takes from --ipie-accent. #ff8e6b clears 4.5:1 on both gradient ends
   (5.04 / 6.25) where the original #ff7a52 fell short (4.40). */
.ipie-step-widget {
	position: relative;
	--sbs-accent: #ff8e6b;
	background: linear-gradient(135deg, #0d404b 0%, #07303a 100%);
	font-family: 'Zilla Slab', Georgia, serif;
}
.ipie-step-widget__watermark {
	position: absolute; right: -20px; bottom: -20px;
	width: 200px; height: 200px; opacity: .08; pointer-events: none;
}
.ipie-step-widget__content { position: relative; padding: 22px; }
.ipie-step-widget__eyebrow {
	margin: 0;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 700; font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--sbs-accent);
}
.ipie-step-widget__title {
	margin: 9px 0 0;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 800; font-size: 22px; line-height: 1.12; color: #fff;
}
.ipie-step-widget__subtitle {
	margin: 10px 0 0; max-width: 230px;
	font-weight: 500; font-size: 15px; line-height: 1.35; color: rgba(255,255,255,.86);
}
.ipie-step-widget__quote {
	margin: 16px 0 0; padding-left: 13px; max-width: 235px;
	border-left: 3px solid var(--sbs-accent);
	font-weight: 500; font-style: italic; font-size: 15px; line-height: 1.35; color: #fff;
}
.ipie-step-widget__cta {
	margin-top: 18px; display: inline-flex; align-items: center; gap: 8px;
	padding: 11px 18px; border-radius: 2px;
	background: var(--sbs-accent); color: var(--ipie-primary, #002b41); text-decoration: none;
	box-shadow: 0 6px 16px rgba(255,142,107,.30);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 800; font-size: 13px; letter-spacing: .5px; text-transform: uppercase;
	transition: background .15s ease;
}
.ipie-step-widget__cta:hover,
.ipie-step-widget__cta:focus { background: #ffa891; color: var(--ipie-primary, #002b41); }
