/*
 * ISC Choice Cards
 * LS Jordan Design
 *
 * Defaults match the approved v5 home page "three choices" row.
 * Every rule is scoped under .isc-cc-wrap so theme and Elementor Site Kit
 * link and button styles cannot override the cards.
 */

.isc-cc-wrap {
	--isc-cc-hl: #3C6E73;
	--isc-cc-hl-hover: #2F5A5E;
	--isc-cc-hl-title: #ffffff;
	--isc-cc-hl-text: #ffe0d5;
	--isc-cc-hl-cta: #ffffff;
	--isc-cc-bg: #ffffff;
	--isc-cc-border: #e5d9cc;
	--isc-cc-border-hover: #3d2144;
	--isc-cc-title: #33283a;
	--isc-cc-text: #6b5e72;
	--isc-cc-cta: #3C6E73;
	--isc-cc-radius: 24px;
	--isc-cc-border-w: 1px;
	--isc-cc-pulse-speed: 2.6s;
	--isc-cc-ease: cubic-bezier(.22, 1, .36, 1);
	box-sizing: border-box;
	padding: 56px 40px 40px;
	background: var(--isc-cc-section-bg, transparent);
	font-family: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
}
.isc-cc-wrap *, .isc-cc-wrap *::before, .isc-cc-wrap *::after { box-sizing: border-box; }

.isc-cc-wrap .isc-cc {
	display: grid;
	grid-template-columns: var(--isc-cc-tpl, var(--isc-cc-tpl-bp, var(--isc-cc-tpl-auto)));
	gap: 18px;
	margin: 0 auto;
	width: 100%;
	/* Room for the pulse ring so it is never clipped by the row */
	padding: 4px;
}

/* ---------- Card ---------- */
.isc-cc-wrap .isc-cc__card {
	/* Theme shield: Hello Elementor / Site Kit style every link and button */
	white-space: normal; text-transform: none; letter-spacing: normal; text-decoration: none;
	overflow-wrap: break-word; word-break: normal; hyphens: manual; user-select: auto; margin: 0; min-width: 0;

	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 34px 30px;
	border-radius: var(--isc-cc-radius);
	border: var(--isc-cc-border-w) solid var(--isc-cc-border);
	background-color: var(--cc-bg, var(--isc-cc-bg));
	color: var(--cc-text, var(--isc-cc-text));
	transition: background-color .25s ease, border-color .25s ease, transform .3s var(--isc-cc-ease), box-shadow .3s ease;
}
.isc-cc-wrap .isc-cc__card:is(:hover, :focus-visible) {
	border-color: var(--isc-cc-border-hover);
	color: var(--cc-text, var(--isc-cc-text));
	text-decoration: none;
}
.isc-cc-wrap .isc-cc__card:focus { color: var(--cc-text, var(--isc-cc-text)); }
.isc-cc-wrap .isc-cc__card:focus-visible { outline: 3px solid var(--cc-hl, var(--isc-cc-hl)); outline-offset: 3px; }
.isc-cc-wrap .isc-cc--lift .isc-cc__card:hover { transform: translateY(-3px); }

.isc-cc-wrap .isc-cc__title {
	margin: 0; padding: 0;
	font-family: "Bricolage Grotesque", "Public Sans", sans-serif;
	font-size: 22px; font-weight: 600; line-height: 1.2; letter-spacing: normal; text-transform: none;
	color: var(--cc-title, var(--isc-cc-title));
	text-wrap: balance;
}
.isc-cc-wrap .isc-cc__text {
	display: block; font-size: 15px; line-height: 1.55;
	color: var(--cc-text, var(--isc-cc-text));
	text-wrap: pretty;
}
.isc-cc-wrap .isc-cc__cta {
	margin-top: auto; padding-top: 2px;
	display: block;
	font-weight: 700; font-size: 15px; line-height: 1.3;
	color: var(--cc-cta, var(--isc-cc-cta));
}
.isc-cc-wrap .isc-cc__glue { white-space: nowrap; }
.isc-cc-wrap .isc-cc__arrow {
	display: inline-flex; align-items: center; line-height: 1; margin-left: .35em; vertical-align: -0.05em;
	transition: transform .3s var(--isc-cc-ease);
}
.isc-cc-wrap .isc-cc__arrow svg { width: 1em; height: 1em; fill: currentColor; }
.isc-cc-wrap .isc-cc--arrow-motion .isc-cc__card:is(:hover, :focus-visible) .isc-cc__arrow { transform: translateX(5px); }

/* ---------- Highlighted card ---------- */
.isc-cc-wrap .isc-cc__card.is-highlight {
	background-color: var(--cc-bg, var(--cc-hl, var(--isc-cc-hl)));
	border-color: var(--cc-bg, var(--cc-hl, var(--isc-cc-hl)));
	color: var(--cc-text, var(--isc-cc-hl-text));
}
.isc-cc-wrap .isc-cc__card.is-highlight .isc-cc__title { color: var(--cc-title, var(--isc-cc-hl-title)); }
.isc-cc-wrap .isc-cc__card.is-highlight .isc-cc__text { color: var(--cc-text, var(--isc-cc-hl-text)); }
.isc-cc-wrap .isc-cc__card.is-highlight .isc-cc__cta { color: var(--cc-cta, var(--isc-cc-hl-cta)); }
.isc-cc-wrap .isc-cc__card.is-highlight:is(:hover, :focus-visible) {
	/* A per-card highlight darkens itself; otherwise use the section hover color */
	background-color: var(--cc-bg, color-mix(in srgb, var(--cc-hl, var(--isc-cc-hl-hover)) var(--cc-hover-mix, 100%), #000));
	border-color: var(--cc-bg, color-mix(in srgb, var(--cc-hl, var(--isc-cc-hl-hover)) var(--cc-hover-mix, 100%), #000));
	color: var(--cc-text, var(--isc-cc-hl-text));
}
.isc-cc-wrap .isc-cc__card.is-highlight.has-own-hl { --cc-hover-mix: 82%; }
.isc-cc-wrap .isc-cc__card.is-highlight:focus { color: var(--cc-text, var(--isc-cc-hl-text)); }

/* ---------- Pulse (the v5 "softPulse") ---------- */
.isc-cc-wrap .isc-cc__card.has-pulse {
	--cc-ring: var(--isc-cc-pulse, color-mix(in srgb, var(--cc-hl, var(--isc-cc-hl)) 45%, transparent));
	animation: iscCcPulse var(--isc-cc-pulse-speed) ease-out 1.2s infinite;
}
@keyframes iscCcPulse {
	0% { box-shadow: 0 0 0 0 var(--cc-ring); }
	70% { box-shadow: 0 0 0 16px transparent; }
	100% { box-shadow: 0 0 0 0 transparent; }
}

/* ---------- Image background (sits over the card color) ---------- */
.isc-cc-wrap .isc-cc__media {
	position: absolute; inset: 0; z-index: -1; overflow: hidden; border-radius: inherit; pointer-events: none;
}
.isc-cc-wrap .isc-cc__img {
	position: absolute; inset: 0; background-size: cover; background-repeat: no-repeat;
	opacity: var(--cc-img-opacity, .3);
	mix-blend-mode: var(--cc-img-blend, normal);
	transform-origin: center;
	transition: transform 1.6s var(--isc-cc-ease);
}
.isc-cc-wrap .isc-cc__card.has-zoom:is(:hover, :focus-visible) .isc-cc__img { transform: scale(1.07); }

/* ---------- Fade in on scroll ---------- */
.isc-cc-wrap .isc-cc--enter.is-armed .isc-cc__card { opacity: 0; transform: translateY(18px); }
.isc-cc-wrap .isc-cc--enter.is-armed.is-in .isc-cc__card {
	opacity: 1; transform: none;
	transition: opacity .7s var(--isc-cc-ease), transform .7s var(--isc-cc-ease), background-color .25s ease, border-color .25s ease, box-shadow .3s ease;
	transition-delay: calc(var(--i, 0) * 90ms), calc(var(--i, 0) * 90ms), 0s, 0s, 0s;
}

/* Editor-only note */
.isc-cc-wrap .isc-cc__note { margin: 0 0 12px; padding: 10px 14px; border-radius: 10px; background: #fff6e5; color: #5a3a00; font-size: 13px; }

/* ---------- Responsive fallbacks (the Elementor "Cards per row" control overrides these) ---------- */
@media (max-width: 1024px) {
	.isc-cc-wrap { padding: 40px 28px 32px; }
	.isc-cc-wrap .isc-cc { --isc-cc-tpl-bp: repeat(2, minmax(0, 1fr)); }
	.isc-cc-wrap .isc-cc--span-first.is-odd > .isc-cc__card:first-child { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
	.isc-cc-wrap { padding: 28px 18px 24px; }
	.isc-cc-wrap .isc-cc { --isc-cc-tpl-bp: minmax(0, 1fr); gap: 14px; }
	.isc-cc-wrap .isc-cc__card { padding: 24px 22px; border-radius: 20px; }
	.isc-cc-wrap .isc-cc__title { font-size: 21px; }
	.isc-cc-wrap .isc-cc__card.is-highlight .isc-cc__title { font-size: 23px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.isc-cc-wrap .isc-cc__card, .isc-cc-wrap .isc-cc__img, .isc-cc-wrap .isc-cc__arrow { animation: none !important; transition: none !important; transform: none !important; }
	.isc-cc-wrap .isc-cc--enter.is-armed .isc-cc__card { opacity: 1; }
}