/*
 * Siebert Sales Team: the Supreme "card carousel" shown as a static directory (Home + About Us).
 * Six agents never need a carousel: everyone is visible at once, nothing is cut off, no swiping on phones.
 * team.js removes the carousel script's hold on the markup; this stylesheet lays it out as a grid regardless.
 */
body.sb-brand .dsm_card_carousel { overflow: visible !important; }
body.sb-brand .dsm_card_carousel .swiper-container { overflow: visible !important; padding: 0 !important; height: auto !important; }
body.sb-brand .dsm_card_carousel .swiper-wrapper {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	width: auto !important;
	height: auto !important;
	transform: none !important;
	transition: none !important;
}
body.sb-brand .dsm_card_carousel .swiper-slide-duplicate { display: none !important; }
body.sb-brand .dsm_card_carousel :is(.swiper-button-next, .swiper-button-prev, .swiper-pagination, [class*="swiper-button"]) { display: none !important; }

body.sb-brand .dsm_card_carousel .dsm_card_carousel_child { width: auto !important; height: auto !important; margin: 0 !important; opacity: 1 !important; transform: none !important; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child .et_pb_module_inner {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	height: 100%;
	background: #fff;
	border: 1px solid var(--sb-line, #dfe6ec);
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(30, 50, 70, .05), 0 14px 28px -20px rgba(30, 50, 70, .35);
	transition: box-shadow .2s, transform .2s;
}
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child:hover .et_pb_module_inner { box-shadow: 0 18px 34px -18px rgba(30, 50, 70, .45); transform: translateY(-2px); }

body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_image_wrapper { position: relative; margin: 0 !important; height: 100%; min-height: 168px; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_image_wrapper img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center 22%; border-radius: 0 !important; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_badge_text {
	position: absolute !important; left: 10px !important; bottom: 10px !important; right: auto !important; top: auto !important;
	padding: 4px 10px !important; border-radius: 999px;
	background: rgba(255, 255, 255, .94) !important; color: var(--sb-steel, #5c87a3) !important;
	font: 700 10.5px/1.2 var(--sb-head, Raleway, sans-serif) !important; letter-spacing: .04em;
	box-shadow: 0 4px 10px -4px rgba(0, 0, 0, .3);
}
body.sb-brand .dsm_card_carousel .dsm_card_wrapper { display: flex; flex-direction: column; justify-content: center; gap: 6px; min-width: 0; padding: 16px 14px !important; }
body.sb-brand .dsm_card_carousel .dsm_card_title { margin: 0 !important; padding: 0 !important; font: 800 19px/1.2 var(--sb-head, Raleway, sans-serif) !important; color: var(--sb-navy, #1e3246) !important; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description p { margin: 0 !important; padding: 0 !important; font-size: 14.5px; line-height: 1.8; color: var(--sb-ink, #1b2a38); }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description a:not(.et_pb_button) { color: var(--sb-steel, #5c87a3); overflow-wrap: anywhere; text-decoration: none; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description a:not(.et_pb_button):hover { text-decoration: underline; }

/* The icon font isn't loaded on these pages, and the agents were entered in different ways: hide the old <i> icons
   and draw one consistent icon on the phone and email links themselves (team.js makes sure every number is a link). */
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description i.fa { display: none !important; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description :is(a[href^="tel:"], a[href^="mailto:"])::before {
	content: ""; display: inline-block; width: 15px; height: 15px; margin-right: 8px; vertical-align: -2px;
	background: var(--sb-dusty, #7698b3);
	-webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;
}
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description a[href^="tel:"]::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.6a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.6a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E"); }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description a[href^="mailto:"]::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zm9 7.2L4.4 7H4v.7l8 5.5 8-5.5V7h-.4zM4 9.6V17h16V9.6l-8 5.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zm9 7.2L4.4 7H4v.7l8 5.5 8-5.5V7h-.4zM4 9.6V17h16V9.6l-8 5.5z'/%3E%3C/svg%3E"); }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description a[href^="mailto:"] { font-size: 13.5px; white-space: nowrap; }
body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_description p { line-height: 2 !important; }
body.sb-brand .dsm_card_carousel .et_pb_button_wrapper { margin-top: 6px; }
body.sb-brand .dsm_card_carousel .et_pb_button_wrapper .et_pb_button { padding: 8px 18px !important; font-size: 13.5px !important; }

@media (max-width: 1199px) {
	body.sb-brand .dsm_card_carousel .swiper-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
	body.sb-brand .dsm_card_carousel .swiper-wrapper { grid-template-columns: 1fr; gap: 14px; }
	body.sb-brand .dsm_card_carousel .dsm_card_carousel_child .et_pb_module_inner { grid-template-columns: 100px minmax(0, 1fr); }
	body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_image_wrapper { min-height: 150px; }
	body.sb-brand .dsm_card_carousel .dsm_card_carousel_child_badge_text { left: 6px !important; bottom: 6px !important; padding: 3px 8px !important; font-size: 9.5px !important; }
	body.sb-brand .dsm_card_carousel .dsm_card_wrapper { padding: 12px 14px !important; }
	body.sb-brand .dsm_card_carousel .dsm_card_title { font-size: 18px !important; }
}
@media (prefers-reduced-motion: reduce) { body.sb-brand .dsm_card_carousel .dsm_card_carousel_child .et_pb_module_inner { transition: none; } }
