/* Brand Logo Grid for Elementor
 * Every value here is a starting point. The widget's Style tab overrides them.
 */

.blg-widget {
	--blg-duration: 300ms;
	--blg-scale: 1;
	--blg-scale-hover: 1.05;
	--blg-lift: 0px;
	--blg-focus: #f1e4e8;
	box-sizing: border-box;
	width: 100%;
}

.blg-widget *,
.blg-widget *::before,
.blg-widget *::after {
	box-sizing: border-box;
}

/* ---------- Header ---------- */

.blg-widget .blg-header {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 72px;
	margin-bottom: 140px;
}

.blg-widget .blg-intro {
	flex: 0 1 auto;
	max-width: 340px;
	color: #cfc3c7;
	font-size: 17px;
	line-height: 1.3;
	text-align: justify;
}

.blg-widget .blg-intro > *:last-child {
	margin-bottom: 0;
}

.blg-widget .blg-intro p {
	margin: 0 0 0.75em;
	color: inherit;
}

.blg-widget .blg-controls {
	display: flex;
	flex: 1 1 auto;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 44px;
	min-width: 0;
}

/* ---------- Sort dropdown ---------- */

.blg-widget .blg-sort {
	--blg-arrow-color: #e9dfe2;
	--blg-arrow-size: 9px;
	--blg-arrow-offset: 18px;
	position: relative;
	width: 210px;
	max-width: 100%;
	flex: 0 1 auto;
}

.blg-widget .blg-sort-select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 18px calc(var(--blg-arrow-offset) + var(--blg-arrow-size) * 2 + 12px) 18px 16px;
	font-family: inherit;
	font-size: 18px;
	line-height: 1.2;
	color: #e9dfe2;
	background: transparent;
	background-image: none;
	border: 2px solid #e9dfe2;
	border-radius: 0;
	box-shadow: none;
	cursor: pointer;
	transition: color var(--blg-duration), background-color var(--blg-duration), border-color var(--blg-duration);
}

.blg-widget .blg-sort-select::-ms-expand {
	display: none;
}

.blg-widget .blg-sort-select option {
	color: #1c0a0f;
	background-color: #ffffff;
}

.blg-widget .blg-sort::after {
	content: "";
	position: absolute;
	top: 50%;
	right: var(--blg-arrow-offset);
	width: 0;
	height: 0;
	border-left: var(--blg-arrow-size) solid transparent;
	border-right: var(--blg-arrow-size) solid transparent;
	border-top: calc(var(--blg-arrow-size) * 1.1) solid var(--blg-arrow-color);
	transform: translateY(-50%);
	pointer-events: none;
	transition: border-top-color var(--blg-duration);
}

/* ---------- Search ---------- */

.blg-widget .blg-search {
	--blg-icon-size: 26px;
	--blg-icon-offset: 16px;
	position: relative;
	width: 470px;
	max-width: 100%;
	min-width: 180px;
	flex: 0 1 auto;
}

.blg-widget .blg-search-input,
.blg-widget .blg-search-input[type="search"] {
	-webkit-appearance: none;
	appearance: none;
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 20px 16px;
	font-family: inherit;
	font-size: 18px;
	line-height: 1.2;
	color: #2a1419;
	background-color: #f1e3e7;
	border: 2px solid transparent;
	border-radius: 0;
	box-shadow: none;
	outline: none;
	transition: color var(--blg-duration), background-color var(--blg-duration), border-color var(--blg-duration);
}

.blg-widget .blg-search.has-icon .blg-search-input {
	padding-right: calc(var(--blg-icon-size) + var(--blg-icon-offset) + 12px);
}

.blg-widget .blg-search-input::placeholder {
	color: #3a2127;
	opacity: 1;
}

.blg-widget .blg-search-input::-webkit-search-decoration,
.blg-widget .blg-search-input::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

.blg-widget .blg-search-icon {
	position: absolute;
	top: 50%;
	right: var(--blg-icon-offset);
	width: var(--blg-icon-size);
	height: var(--blg-icon-size);
	color: #1c0a0f;
	transform: translateY(-50%);
	pointer-events: none;
	transition: color var(--blg-duration);
}

/* Visible keyboard focus for both controls */
.blg-widget .blg-sort-select:focus-visible,
.blg-widget .blg-search-input:focus-visible {
	outline: 2px solid var(--blg-focus);
	outline-offset: 3px;
}

/* ---------- Grid ---------- */

.blg-widget .blg-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	column-gap: 40px;
	row-gap: 60px;
	align-items: stretch;
}

.blg-widget .blg-item {
	position: relative;
	display: flex;
	min-width: 0;
	transform: translateY(0);
	transition:
		transform var(--blg-duration) ease,
		background-color var(--blg-duration),
		border-color var(--blg-duration),
		box-shadow var(--blg-duration);
}

.blg-widget .blg-item[hidden] {
	display: none !important;
}

.blg-widget .blg-item:not([class*="elementor-animation-"]):hover,
.blg-widget .blg-item:not([class*="elementor-animation-"]):focus-within {
	transform: translateY(calc(var(--blg-lift) * -1));
}

.blg-widget .blg-item-inner {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	width: 100%;
	color: inherit;
	text-decoration: none;
}

.blg-widget a.blg-item-inner:focus-visible {
	outline: 2px solid var(--blg-focus);
	outline-offset: 4px;
}

.blg-widget .blg-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 220px;
	overflow: visible;
}

.blg-widget .blg-logo img {
	display: block;
	width: auto;
	height: auto;
	max-width: 90%;
	max-height: 100%;
	object-fit: contain;
	transform: scale(var(--blg-scale));
	transition:
		transform var(--blg-duration) ease,
		filter var(--blg-duration),
		opacity var(--blg-duration);
}

/* SVG logos with no intrinsic size need a width to show up */
.blg-widget .blg-logo img[src$=".svg"] {
	width: 100%;
}

.blg-widget .blg-item:hover .blg-logo img,
.blg-widget .blg-item:focus-within .blg-logo img {
	transform: scale(var(--blg-scale-hover));
}

.blg-widget .blg-name {
	display: block;
	margin-top: 12px;
	text-align: center;
	color: #cfc3c7;
	transition: color var(--blg-duration);
}

/* Fade in when a logo reappears after filtering */
.blg-animate-yes .blg-widget .blg-item {
	animation: blg-fade-in calc(var(--blg-duration) + 100ms) ease both;
}

@keyframes blg-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* ---------- Empty + utilities ---------- */

.blg-widget .blg-no-results {
	margin: 0;
	padding: 40px 0;
	color: #cfc3c7;
	text-align: center;
}

.blg-widget .blg-no-results[hidden] {
	display: none;
}

.blg-widget .blg-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ---------- Responsive fallbacks (Elementor controls override these) ---------- */

@media (max-width: 1024px) {
	.blg-widget .blg-header { gap: 32px; margin-bottom: 80px; }
	.blg-widget .blg-controls { gap: 20px; }
	.blg-widget .blg-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 28px; row-gap: 40px; }
	.blg-widget .blg-logo { height: 170px; }
}

@media (max-width: 767px) {
	.blg-widget .blg-header { flex-direction: column; align-items: stretch; gap: 20px; margin-bottom: 48px; }
	.blg-widget .blg-intro { max-width: 100%; text-align: left; }
	.blg-widget .blg-controls { gap: 12px; }
	.blg-widget .blg-sort,
	.blg-widget .blg-search { width: 100%; min-width: 0; }
	.blg-widget .blg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; row-gap: 24px; }
	.blg-widget .blg-logo { height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
	.blg-widget .blg-item,
	.blg-widget .blg-logo img {
		animation: none !important;
		transition: none !important;
	}
}
