/* Referrals page (/referrals/) — generated by build/referrals.py.
   Only what Elementor cannot express: step rings, numbered badges, dotted
   connectors, icon tinting on navy. Prefix: bw-ref-. */

.bw-ref-gold { color: var(--bw-gold); }
.bw-ref-light { font-weight: 400; }

/* --- Our Referral Process ------------------------------------------------ */
.bw-ref-step { position: relative; --bw-ref-c: var(--e-global-color-teal, #2A8A8C); }
.bw-ref-step--blue   { --bw-ref-c: var(--e-global-color-blue, #3F6FB8); }
.bw-ref-step--gold   { --bw-ref-c: var(--bw-gold); }
.bw-ref-step--purple { --bw-ref-c: var(--e-global-color-purple, #7A5CB2); }

.e-con.bw-ref-step__ring {
	position: relative; flex: 0 0 auto; width: 78px; height: 78px; min-height: 0;
	border-radius: 50%; background: #fff;
	border: 1.5px solid color-mix(in srgb, var(--bw-ref-c) 45%, #fff);
	box-shadow: 0 4px 14px rgba(11, 31, 79, .06);
}
.bw-ref-step__ring .elementor-widget-image { width: 50px; }
.bw-ref-step__ring > .bw-ref-step__badge {
	position: absolute; left: -23px; bottom: -9px; width: auto; margin: 0;
}
.bw-ref-badge {
	display: flex; align-items: center; justify-content: center;
	width: 23px; height: 23px; border-radius: 50%;
	background: var(--bw-ref-c); color: #fff;
	font: 700 11.5px/1 var(--bw-sans);
}
.bw-ref-step__text { width: 100%; }

/* Dotted arrow between steps — only while they sit side by side. */
@media (min-width: 1025px) {
	.bw-ref-step:not(:last-child)::after,
	.bw-ref-step:not(:last-child)::before {
		content: ""; position: absolute; pointer-events: none;
	}
	.bw-ref-step:not(:last-child)::after {
		top: 38px; height: 0;
		left: calc(50% + 39px + 18px); right: calc(-50% + 39px + 18px);
		border-top: 2px dotted color-mix(in srgb, var(--bw-navy) 60%, #fff);
	}
	.bw-ref-step:not(:last-child)::before {
		top: 34px; left: auto; bottom: auto; width: 8px; height: 8px;
		right: calc(-50% + 39px + 18px); background: none; opacity: 1;
		border-top: 2px solid color-mix(in srgb, var(--bw-navy) 60%, #fff);
		border-right: 2px solid color-mix(in srgb, var(--bw-navy) 60%, #fff);
		transform: rotate(45deg);
	}
}

/* Phone: vertical timeline — ring left, words right, dotted line down. */
@media (max-width: 767px) {
	.bw-ref-steps { padding-left: 18px !important; }
	.e-con.bw-ref-step__ring { width: 64px; height: 64px; }
	.bw-ref-step__ring .elementor-widget-image { width: 34px; }
	.e-con.bw-ref-step { flex-wrap: nowrap !important; }
	.e-con.bw-ref-step__text { flex: 1 1 0 !important; width: auto !important; min-width: 0; padding-top: 6px; }
	.bw-ref-step__body br { display: none; }
	.bw-ref-step:not(:last-child)::after {
		content: ""; position: absolute; left: 31px; top: 76px; bottom: -22px;
		border-left: 2px dotted color-mix(in srgb, var(--bw-navy) 55%, #fff);
	}
}

.bw-ref-ribbon .elementor-widget-icon { flex: 0 0 auto; width: auto; }
.bw-ref-ribbon .elementor-icon { display: flex; }
@media (min-width: 768px) {
	.bw-ref-ribbon { justify-content: center; }
}

/* --- Who Can Refer? ------------------------------------------------------ */
.bw-ref-who__card { box-shadow: 0 2px 10px rgba(11, 31, 79, .04); }
.bw-ref-who__card .elementor-widget-image { width: 58px; }

/* --- What We Need -------------------------------------------------------- */
.bw-ref-need__item .elementor-widget-image { flex: 0 0 30px; width: 30px; }
.bw-ref-need__item .elementor-widget-heading { flex: 1 1 0; min-width: 0; }
.bw-ref-secure__icon { flex: 0 0 auto !important; }
.bw-ref-secure__words { flex: 1 1 0 !important; min-width: 0; }
@media (max-width: 1024px) {
	.bw-ref-secure { justify-content: flex-start; }
	.bw-ref-secure__body br { display: none; }
}
@media (max-width: 767px) {
	.bw-ref-need__item br { display: none; }
	.bw-ref-secure { flex-wrap: wrap !important; }
}

/* --- How to Make a Referral ---------------------------------------------- */
.bw-ref-how__cards { align-items: stretch !important; }
@media (min-width: 1025px) {
	.bw-ref-how__cards { align-items: center !important; }
	.bw-ref-how__card { align-self: stretch; margin-block: 8px; }
}
.bw-ref-how__icon, .bw-ref-help__icon { flex: 0 0 auto !important; }
.bw-ref-how__words, .bw-ref-help__words { flex: 1 1 0 !important; min-width: 0; }
/* The action sits under the words column (icon 50 + gap 22). */
.bw-ref-how__card > .elementor-widget-button,
.bw-ref-how__card > .bw-ref-phone { margin-left: 72px; }
.bw-ref-how__card > .elementor-widget-button { width: auto; align-self: flex-start; }
.bw-ref-how__card { justify-content: space-between !important; }
.bw-ref-how__link .elementor-icon-list-item a { min-height: 24px; }
.bw-ref-email .elementor-icon-list-text { white-space: nowrap; font-size: 12.5px; }
.bw-ref-how__card--email { min-width: 0; }

.bw-ref-help__icon img, .bw-ref-value__ring img { filter: brightness(0) invert(1); }
.bw-ref-help .elementor-widget-button { width: 100%; }
.bw-ref-help { align-self: stretch; }

@media (max-width: 1366px) and (min-width: 1025px) {
	.bw-ref-email .elementor-icon-list-text { white-space: normal; overflow-wrap: anywhere; }
}
@media (max-width: 1024px) {
	.bw-ref-how__card > .elementor-widget-button,
	.bw-ref-how__card > .bw-ref-phone { margin-left: 72px; }
}
@media (max-width: 767px) {
	.bw-ref-how__card > .elementor-widget-button,
	.bw-ref-how__card > .bw-ref-phone { margin-left: 0; }
	.bw-ref-email .elementor-icon-list-text { white-space: normal; overflow-wrap: anywhere; font-size: 14px; }
	.bw-ref-how__link .elementor-icon-list-item a { min-height: 44px; }
	.bw-ref-how__words br, .bw-ref-help__body br { display: none; }
}

/* Important note */
.e-con.bw-ref-note__icon {
	flex: 0 0 50px !important; height: 50px; min-height: 0; border-radius: 50%;
	border: 1.5px solid var(--bw-gold); justify-content: center; align-items: center;
}
.bw-ref-note__words { min-width: 0; }
.bw-ref-note__art { flex: 0 0 auto !important; width: auto !important; }
@media (max-width: 767px) {
	.bw-ref-note { flex-wrap: wrap !important; }
	.bw-ref-note__art { display: none !important; }
	.bw-ref-note__words br { display: none; }
}

/* --- Working Together (navy) --------------------------------------------- */
.e-con.bw-ref-value__ring {
	flex: 0 0 auto; width: 50px; height: 50px; min-height: 0; border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, .85);
}
.bw-ref-value + .bw-ref-value { border-left: 1px solid rgba(255, 255, 255, .22); }
@media (max-width: 767px) {
	.bw-ref-value + .bw-ref-value { border-left: 0; }
	.bw-ref-together__body br { display: none; }
}

/* Flex "grow" in Elementor also sets shrink 0 on a content-sized basis, which
   pushed the note's art off the row at tablet. Grow from zero instead. */
.e-con.bw-ref-note__words { flex: 1 1 0 !important; }

/* Finger-sized buttons wherever the layout is touch-likely. */
@media (max-width: 1024px) {
	.bw-ref-process .elementor-button, .bw-ref-needs .elementor-button,
	.bw-ref-how .elementor-button, .bw-ref-together .elementor-button {
		min-height: 46px; display: inline-flex; align-items: center;
	}
	.bw-ref-how__link .elementor-icon-list-item a { min-height: 44px; }
}

/* Phone: the design's forced line breaks only make sense at desktop measure. */
@media (max-width: 767px) {
	.bw-ref-who__card br, .bw-ref-value br, .bw-hero__sub br { display: none; }
}

/* Small laptops (1025-1300): the 1260 grid no longer fits, so drop the
   design's forced breaks, widen the Secure Referral panel and take the four
   referral routes to two-up. */
@media (min-width: 1025px) and (max-width: 1300px) {
	.bw-ref-who__card br, .bw-ref-step__body br, .bw-ref-need__item br,
	.bw-ref-secure__body br, .bw-ref-how__words br, .bw-ref-help__body br, .bw-ref-value br { display: none; }
	.e-con.bw-ref-secure { flex: 0 0 310px !important; width: 310px !important; }
	.e-con.bw-ref-need { flex: 1 1 0 !important; min-width: 0; }
	.bw-ref-how__cards { flex-wrap: wrap !important; align-items: stretch !important; }
	.e-con.bw-ref-how__card, .e-con.bw-ref-help {
		flex: 0 0 calc(50% - 10px) !important; width: calc(50% - 10px) !important; margin-block: 0;
	}
	.bw-ref-email .elementor-icon-list-text { white-space: nowrap; overflow-wrap: normal; }
}
.bw-ref-needs .elementor-button-text, .bw-ref-how .elementor-button-text { white-space: nowrap; }