.ba-projects {
	--ba-projects-background: var(--ba-color-white, #fff);
	--ba-projects-heading: var(--ba-color-secondary, #121212);
	--ba-projects-paragraph: var(--ba-color-secondary, #121212);
	--ba-projects-width: clamp(280px, 30vw, 640px);
	--ba-projects-width-tablet: clamp(260px, 42vw, 520px);
	--ba-projects-width-mobile: 80vw;
	--ba-projects-gap: 20px;
	--ba-projects-gap-tablet: 18px;
	--ba-projects-gap-mobile: 14px;
	--ba-projects-padding-y: 112px;
	--ba-projects-padding-y-tablet: 80px;
	--ba-projects-padding-y-mobile: 56px;
	--ba-projects-anchor-offset: 160px;
	--ba-projects-admin: 0px;
	min-width: 0;
	max-width: 100%;
	padding-block: var(--ba-projects-padding-y);
	background: var(--ba-projects-background);
	scroll-margin-top: calc(var(--ba-projects-anchor-offset) + var(--ba-projects-admin));
	font-family: var(--ba-font-body, "Plus Jakarta Sans", Arial, sans-serif);
}
.ba-projects, .ba-projects * { box-sizing: border-box; }
.ba-projects .ba-projects-container { width: min(calc(100% - var(--ba-gutter, 48px) * 2), var(--ba-container-max, 1280px)); margin-inline: auto; }
.ba-projects .ba-projects-header { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: end; gap: clamp(32px, 5vw, 80px); margin-bottom: clamp(32px, 4vw, 56px); }
.ba-projects .ba-projects-heading { margin: 0; color: var(--ba-projects-heading); font: 600 clamp(32px, 3.4vw, 52px)/1.1 var(--ba-font-heading, "Space Grotesk", Arial, sans-serif); letter-spacing: -.03em; text-wrap: balance; overflow-wrap: anywhere; }
.ba-projects .ba-projects-paragraph { margin: 0; max-width: 540px; color: var(--ba-projects-paragraph); font: 400 17px/1.75 var(--ba-font-body, "Plus Jakarta Sans", Arial, sans-serif); overflow-wrap: anywhere; }
/* Default is an in-flow native strip; enhancement measures the true client viewport,
   including scrollbar width and boxed-parent offset, without body overflow overrides. */
.ba-projects .ba-projects-viewport { width: var(--ba-projects-bleed-width, 100%); margin-left: var(--ba-projects-bleed-offset, 0px); overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; }
.ba-projects .ba-projects-track, .ba-projects .ba-projects-unit { display: flex; width: max-content; }
.ba-projects .ba-projects-unit { flex: 0 0 auto; }
.ba-projects .ba-projects-gallery { display: flex; flex: 0 0 auto; gap: var(--ba-projects-gap); padding: 0 var(--ba-projects-gap) 0 0; margin: 0; list-style: none; }
.ba-projects .ba-projects-item { position: relative; flex: 0 0 var(--ba-projects-width); width: var(--ba-projects-width); aspect-ratio: 4 / 3; border-radius: 0; overflow: hidden; }
.ba-projects .ba-projects-image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--ba-projects-focal-x, 50%) var(--ba-projects-focal-y, 50%); border-radius: 0; }
.ba-projects.is-animated:not(.is-manual) .ba-projects-viewport { overflow-x: hidden; }
.ba-projects.is-animated:not(.is-manual) .ba-projects-track { animation: ba-projects-travel var(--ba-projects-duration, 45s) linear infinite; animation-delay: var(--ba-projects-phase, 0s); }
.ba-projects.is-animated.is-paused .ba-projects-track, .ba-projects.is-animated.is-offscreen .ba-projects-track, .ba-projects.is-animated.is-hidden .ba-projects-track { animation-play-state: paused; }
.ba-projects.is-manual [data-ba-projects-clone] { display: none; }
.ba-projects .ba-projects-viewport:focus-visible { outline: 3px solid var(--ba-color-primary, #e84a10); outline-offset: -3px; }
.ba-projects .ba-projects-controls { display: flex; justify-content: flex-end; margin-top: 24px; }
.ba-projects .ba-projects-controls[hidden] { display: none; }
.ba-projects .ba-projects-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; border: 1px solid var(--ba-color-tertiary, #e7e3de); border-radius: 0; background: var(--ba-color-white, #fff); color: var(--ba-color-secondary, #121212); cursor: pointer; }
.ba-projects .ba-projects-toggle svg { display: block; flex: none; }
.ba-projects .ba-projects-toggle svg[hidden] { display: none; }
.ba-projects .ba-projects-toggle:focus-visible { outline: 2px solid var(--ba-color-secondary, #121212); outline-offset: 4px; }
body.admin-bar .ba-projects { --ba-projects-admin: 32px; }
@keyframes ba-projects-travel { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(-1 * var(--ba-projects-distance)), 0, 0); } }
@media (hover: hover) and (pointer: fine) { .ba-projects .ba-projects-viewport:hover .ba-projects-track { animation-play-state: paused; } .ba-projects .ba-projects-toggle:hover { border-color: var(--ba-color-secondary, #121212); } }
@media (max-width: 1024px) {
	.ba-projects { padding-block: var(--ba-projects-padding-y-tablet); }
	.ba-projects .ba-projects-header { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.ba-projects .ba-projects-heading { max-width: 780px; }
	.ba-projects .ba-projects-gallery { gap: var(--ba-projects-gap-tablet); padding-right: var(--ba-projects-gap-tablet); }
	.ba-projects .ba-projects-item { flex-basis: var(--ba-projects-width-tablet); width: var(--ba-projects-width-tablet); }
	.ba-projects .ba-projects-image { object-position: var(--ba-projects-focal-x-tablet, var(--ba-projects-focal-x, 50%)) var(--ba-projects-focal-y-tablet, var(--ba-projects-focal-y, 50%)); }
}
@media (max-width: 782px) { body.admin-bar .ba-projects { --ba-projects-admin: 46px; } }
@media (max-width: 767px) {
	.ba-projects { padding-block: var(--ba-projects-padding-y-mobile); }
	.ba-projects .ba-projects-container { width: calc(100% - clamp(24px, 6vw, 36px) * 2); }
	.ba-projects .ba-projects-heading { font-size: clamp(28px, 6.5vw, 36px); }
	.ba-projects .ba-projects-paragraph { font-size: 16px; }
	.ba-projects .ba-projects-gallery { gap: var(--ba-projects-gap-mobile); padding-right: var(--ba-projects-gap-mobile); }
	.ba-projects .ba-projects-item { flex-basis: var(--ba-projects-width-mobile); width: var(--ba-projects-width-mobile); }
	.ba-projects .ba-projects-image { object-position: var(--ba-projects-focal-x-mobile, var(--ba-projects-focal-x-tablet, var(--ba-projects-focal-x, 50%))) var(--ba-projects-focal-y-mobile, var(--ba-projects-focal-y-tablet, var(--ba-projects-focal-y, 50%))); }
}
@media (prefers-reduced-motion: reduce) { .ba-projects .ba-projects-track, .ba-projects.is-animated:not(.is-manual) .ba-projects-track { animation: none; } .ba-projects [data-ba-projects-clone] { display: none; } .ba-projects.is-animated:not(.is-manual) .ba-projects-viewport { overflow-x: auto; } }
