/**
 * RB Projects & Ventures (formerly RB Noile Services) — widget styles
 * Noile-style service layouts for Elementor. Colours fall back to the Noile
 * theme's own custom properties when the theme is active, so the widget
 * follows the theme's palette; the font is Jost (the site font). Every value
 * can be overridden from the widget's Style tab (--rbns-* properties on .rbns).
 * Authored with CSS logical properties so RTL mirrors automatically.
 */

.rbns {
	--rbns-accent: var(--noile-base, #FC164B);
	--rbns-dark: var(--noile-primary, #1d1d1d);
	--rbns-text: #6b6b6b;
	--rbns-light: var(--noile-white2, #f6f6f6);
	--rbns-border: #eeeeee;
	--rbns-hover-bg: var(--rbns-dark);
	--rbns-hover-border: var(--rbns-dark);
	--rbns-font: "Jost", "Segoe UI", sans-serif;
	--rbns-heading: "Jost", "Segoe UI", sans-serif;
	--rbns-cols: 4;
	--rbns-gap: 24px;
	--rbns-align: start;
	--rbns-flex: flex-start;
	--rbns-icon: 60px;
	--rbns-media-gap: 34px;
	--rbns-tag-gap: 90px;
	--rbns-tile-h: 438px;
	--rbns-head-gap: 50px;
	--rbns-circle-size: 164px;
	--rbns-circle-speed: 10s;
	--rbns-arrow-size: 186px;

	position: relative;
	font-family: var(--rbns-font);
	color: var(--rbns-dark);
	line-height: 1.75;
}

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

/* The Noile theme sets its own font on every <p>; keep Jost. */
.rbns p {
	font-family: inherit;
}

/* Layout defaults (the Columns / Alignment controls override these). */
.rbns--l2,
.rbns--l3,
.rbns--l4,
.rbns--l6,
.rbns--l7 {
	--rbns-align: center;
	--rbns-flex: center;
	--rbns-icon: 70px;
	--rbns-media-gap: 40px;
}

.rbns--l2 { --rbns-cols: 6; }
.rbns--l3 { --rbns-cols: 3; --rbns-tile-h: 320px; }
.rbns--l4 { --rbns-tile-h: 320px; }
.rbns--l5 { --rbns-cols: 3; }
.rbns--l7 { --rbns-tile-h: 320px; }

/* ---- Grid ---- */
.rbns-body {
	position: relative;
	z-index: 1;
}

.rbns-grid {
	display: grid;
	grid-template-columns: repeat(var(--rbns-cols), minmax(0, 1fr));
	gap: var(--rbns-gap);
}

.rbns-col {
	position: relative;
	display: flex;
	min-width: 0;
}

.rbns-col > .rbns-item {
	flex: 1 1 auto;
	width: 100%;
}

.rbns-col:hover {
	z-index: 2;
}

/* Joined tiles: overlap each border by 1px so neighbours share one line. */
.rbns--joined .rbns-tiles {
	--rbns-gap: 0px;
	padding-block-start: 1px;
	padding-inline-start: 1px;
}

.rbns--joined .rbns-tiles > .rbns-col {
	margin-block-start: -1px;
	margin-inline-start: -1px;
}

/* ---- Item basics ---- */
.rbns-item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: var(--rbns-flex);
	text-align: var(--rbns-align);
	border: 1px solid transparent;
	transition: background-color 0.4s ease, border-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
}

.rbns--lift .rbns-item:hover {
	transform: translateY(-8px);
	box-shadow: 0 22px 44px rgba(0, 0, 0, 0.08);
}

.rbns .rbns-title {
	margin: 0 0 6px;
	font-family: var(--rbns-heading);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	color: var(--rbns-title-c, var(--rbns-dark));
	transition: color 0.3s ease;
}

.rbns .rbns-title a,
.rbns .rbns-title a:hover {
	color: inherit;
	text-decoration: none;
	display: inline;
}

.rbns-item:hover .rbns-title {
	color: var(--rbns-title-hc, var(--rbns-title-c, var(--rbns-dark)));
}

.rbns-sub {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rbns-sub-c, var(--rbns-accent));
	transition: color 0.3s ease;
}

.rbns-desc {
	margin: 0;
	font-size: 15px;
	line-height: 1.75;
	color: var(--rbns-desc-c, var(--rbns-text));
	transition: color 0.3s ease;
}

.rbns-desc p {
	margin: 0;
}

/* Whole card clickable: the title link stretches over the card. */
.rbns--cardlink .rbns-title__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.rbns-card__foot {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: var(--rbns-flex);
	width: 100%;
	margin-top: auto;
	padding-top: 28px;
}

/* ---- Media (icon or image) ---- */
.rbns-media {
	display: flex;
	justify-content: var(--rbns-flex);
	width: 100%;
	margin-bottom: var(--rbns-media-gap);
	line-height: 0;
}

.rbns-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: var(--rbns-icon-pad, 0);
	border-radius: var(--rbns-icon-r, 0);
	background: var(--rbns-icon-bg, transparent);
	color: var(--rbns-icon-c, var(--rbns-dark));
	font-size: var(--rbns-icon);
	line-height: 1;
	transition: color 0.4s ease, background-color 0.4s ease, transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.rbns-icon i {
	display: block;
	font-size: inherit;
	line-height: 1;
}

.rbns-icon svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.rbns-item:hover .rbns-icon {
	color: var(--rbns-icon-hc, var(--rbns-icon-c, var(--rbns-dark)));
	background: var(--rbns-icon-hbg, var(--rbns-icon-bg, transparent));
}

.rbns-media__img {
	display: block;
	width: 80px;
	max-width: 100%;
	height: auto;
	transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.rbns-img--cover .rbns-media__img {
	width: 100%;
	height: 220px;
	object-fit: cover;
}

/* Icon / image hover motion (Animation → Icon / image on hover). */
.rbns-ifx--bounce .rbns-item:hover .rbns-media > * { transform: translateY(-10px); }
.rbns-ifx--spin .rbns-media { perspective: 600px; }
.rbns-ifx--spin .rbns-item:hover .rbns-media > * { transform: rotateY(360deg); }
.rbns-ifx--pulse .rbns-item:hover .rbns-media > * { transform: scale(1.14); }
.rbns-ifx--swing .rbns-item:hover .rbns-media > * { animation: rbnsSwing 0.9s ease both; }

/* ---- Noile button: a red corner stripe; hover sweeps a fill across ---- */
.rbns .rbns-btn,
.rbns a.rbns-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 28px 9px;
	overflow: hidden;
	isolation: isolate;
	font-family: var(--rbns-heading);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.57;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	color: var(--rbns-btn-c, var(--rbns-dark));
	background: var(--rbns-btn-bg, var(--rbns-light));
	transition: color 0.4s ease;
	cursor: pointer;
}

.rbns .rbns-btn::before,
.rbns .rbns-btn::after {
	content: "";
	position: absolute;
	inset-inline-end: -18px;
	bottom: -85px;
	height: 194px;
	z-index: -1;
	transform: rotate(45deg);
	transition: all 0.6s ease-out;
}

.rbns .rbns-btn::before {
	width: 20px;
	background: var(--rbns-btn-stripe, var(--rbns-accent));
}

.rbns .rbns-btn::after {
	width: 0;
	background: var(--rbns-btn-hbg, var(--rbns-dark));
}

.rbns a.rbns-btn:hover,
.rbns a.rbns-btn:focus-visible {
	color: var(--rbns-btn-hc, #ffffff);
}

.rbns a.rbns-btn:hover::after,
.rbns a.rbns-btn:focus-visible::after {
	width: calc(100% + 80px);
	transform: rotate(0deg);
}

[dir="rtl"] .rbns .rbns-btn::before,
[dir="rtl"] .rbns .rbns-btn::after {
	transform: rotate(-45deg);
}

[dir="rtl"] .rbns a.rbns-btn:hover::after,
[dir="rtl"] .rbns a.rbns-btn:focus-visible::after {
	transform: rotate(0deg);
}

.rbns .rbns-btn--dark {
	--rbns-btn-bg: var(--rbns-dark);
	--rbns-btn-c: #ffffff;
	--rbns-btn-hbg: var(--rbns-accent);
	padding: 18px 32px 16px;
	font-weight: 600;
}

/* ==== Layouts 1 & 5 — tag cards ==== */
.rbns-card--tag {
	height: 100%;
	padding: 49px 30px 39px;
	border-color: var(--rbns-light);
	background: var(--rbns-card-bg, #ffffff);
}

/* The border draws round the card from two corners on hover. */
.rbns-card--tag::before,
.rbns-card--tag::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border: 0 solid transparent;
	transition: width 0.6s linear, height 0.6s linear, border-color 0.2s linear;
	pointer-events: none;
}

.rbns-card--tag::before {
	left: -1px;
	bottom: -1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
}

.rbns-card--tag::after {
	right: -1px;
	top: -1px;
	border-top-width: 1px;
	border-right-width: 1px;
}

.rbns-card--tag:hover {
	border-color: transparent;
}

.rbns-card--tag:hover::before,
.rbns-card--tag:hover::after {
	width: calc(100% + 2px);
	height: calc(100% + 2px);
	border-color: var(--rbns-hover-border);
}

.rbns-card__top {
	display: flex;
	justify-content: var(--rbns-flex);
	width: 100%;
}

.rbns-tag {
	display: inline-block;
	margin-bottom: var(--rbns-tag-gap);
	padding: 8px 22px;
	border-radius: 50px;
	font-family: var(--rbns-heading);
	font-size: 14px;
	line-height: 1;
	text-transform: capitalize;
	color: var(--rbns-dark);
	background: var(--rbns-light);
	transition: background-color 0.4s ease, color 0.4s ease;
}

.rbns-card--tag:hover .rbns-tag {
	color: #ffffff;
	background: var(--rbns-dark);
}

/* Floating dotted shape, out in the side margin (hidden on narrower screens). */
.rbns-float {
	position: absolute;
	top: -70px;
	inset-inline-start: -150px;
	width: 120px;
	height: auto;
	z-index: 0;
	pointer-events: none;
	animation: rbnsSquare 20s linear infinite alternate;
}

.rbns-float circle {
	fill: var(--rbns-dark);
	fill-opacity: 0.18;
}

.rbns-float .rbns-float__a {
	fill: var(--rbns-accent);
	fill-opacity: 0.9;
}

/* Rotating circle text beside the cards. */
.rbns-cornercircle {
	position: absolute;
	inset-inline-end: -88px;
	bottom: 153px;
	z-index: -1;
}

/* ==== Tiles (layouts 2, 3, 4, 6, 7) ==== */
.rbns-tile {
	justify-content: center;
	min-height: var(--rbns-tile-h);
	padding: 40px 30px;
	border-color: var(--rbns-border);
	background: var(--rbns-card-bg, transparent);
}

.rbns .rbns-tile .rbns-title {
	font-size: 24px;
	line-height: 1.25;
}

.rbns-tile--circle,
.rbns-tile--image,
.rbns-tile--arrow {
	align-items: center;
	text-align: center;
}

.rbns-tile__link {
	display: inline-flex;
	color: inherit;
	text-decoration: none;
}

/* Hover: dark outline + red icon and title (layouts 2 & 6). */
.rbns-hover--outline .rbns-tile:hover,
.rbns-tile--circle:hover,
.rbns-tile--image:hover {
	border-color: var(--rbns-hover-border);
}

.rbns-hover--outline .rbns-tile:hover .rbns-icon {
	color: var(--rbns-icon-hc, var(--rbns-accent));
}

.rbns-hover--outline .rbns-tile:hover .rbns-title {
	color: var(--rbns-title-hc, var(--rbns-accent));
}

/* Hover: fill dark or red, white text (layouts 3, 4 & 7). */
.rbns-hover--dark .rbns-tile:not(.rbns-tile--circle):not(.rbns-tile--image):not(.rbns-tile--arrow):hover {
	background: var(--rbns-hover-bg);
	border-color: var(--rbns-hover-bg);
}

.rbns-hover--accent .rbns-tile:not(.rbns-tile--circle):not(.rbns-tile--image):not(.rbns-tile--arrow):hover {
	background: var(--rbns-accent);
	border-color: var(--rbns-accent);
}

.rbns-hover--dark .rbns-tile:hover .rbns-icon,
.rbns-hover--accent .rbns-tile:hover .rbns-icon {
	color: var(--rbns-icon-hc, #ffffff);
}

.rbns-hover--dark .rbns-tile:hover .rbns-title,
.rbns-hover--accent .rbns-tile:hover .rbns-title {
	color: var(--rbns-title-hc, #ffffff);
}

.rbns-hover--dark .rbns-tile:hover .rbns-desc,
.rbns-hover--accent .rbns-tile:hover .rbns-desc {
	color: rgba(255, 255, 255, 0.78);
}

.rbns-hover--accent .rbns-tile:hover .rbns-sub {
	color: #ffffff;
}

/* Big outlined letter / image tile. */
.rbns-letter {
	display: block;
	font-family: var(--rbns-heading);
	font-size: clamp(140px, 17vw, 280px);
	font-weight: 700;
	line-height: 0.9;
	color: transparent;
	-webkit-text-stroke: 1px var(--rbns-letter-c, #e2e2e2);
	transition: -webkit-text-stroke-color 0.4s ease, transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
	user-select: none;
}

.rbns-tile--image:hover .rbns-letter {
	-webkit-text-stroke-color: var(--rbns-accent);
	transform: scale(1.04);
}

.rbns-tile__img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* ---- Rotating circle text ---- */
.rbns-circle {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--rbns-circle-size);
	height: var(--rbns-circle-size);
}

.rbns-circle__spin {
	position: absolute;
	inset: 0;
	display: block;
	animation: rbnsSpin var(--rbns-circle-speed) linear infinite;
}

.rbns-circle__svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.rbns-circle__svg text {
	font-family: var(--rbns-font);
	font-size: 13px;
	letter-spacing: 0;
	text-transform: uppercase;
	fill: var(--rbns-circle-c, rgba(29, 29, 29, 0.4));
	transition: fill 0.3s ease;
}

.rbns-circle__svg .rbns-circle__a {
	fill: var(--rbns-circle-a, var(--rbns-accent));
}

.rbns-tile--circle:hover .rbns-circle__svg text,
.rbns-cornercircle:hover .rbns-circle__svg text {
	fill: var(--rbns-accent);
}

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

/* ---- Round two-line "View / All Services" button ---- */
.rbns a.rbns-arrowbtn {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--rbns-arrow-size);
	height: var(--rbns-arrow-size);
	border: 1px solid var(--rbns-arrow-c, var(--rbns-dark));
	border-radius: 50%;
	color: var(--rbns-arrow-c, var(--rbns-dark));
	text-align: start;
	text-decoration: none;
	transition: background-color 0.4s ease, color 0.4s ease;
}

.rbns a.rbns-arrowbtn::before {
	content: "";
	position: absolute;
	top: -1px;
	left: -10px;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border-left: 1px solid var(--rbns-arrow-c, var(--rbns-dark));
	z-index: -1;
	transition: all 0.4s ease-in-out;
}

[dir="rtl"] .rbns a.rbns-arrowbtn::before {
	left: auto;
	right: -10px;
	border-left: 0;
	border-right: 1px solid var(--rbns-arrow-c, var(--rbns-dark));
}

.rbns-arrowbtn__t {
	display: block;
	font-family: var(--rbns-heading);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.56;
	text-transform: capitalize;
}

.rbns-arrowbtn__ico {
	display: inline-block;
	vertical-align: -2px;
	margin-inline-start: 6px;
	transition: transform 0.4s ease;
}

[dir="rtl"] .rbns-arrowbtn__ico {
	transform: scaleX(-1);
}

.rbns a.rbns-arrowbtn:hover,
.rbns a.rbns-arrowbtn:focus-visible {
	color: #ffffff;
	background: var(--rbns-arrow-hbg, var(--rbns-dark));
}

.rbns a.rbns-arrowbtn:hover::before,
.rbns a.rbns-arrowbtn:focus-visible::before {
	left: 0;
}

[dir="rtl"] .rbns a.rbns-arrowbtn:hover::before,
[dir="rtl"] .rbns a.rbns-arrowbtn:focus-visible::before {
	left: auto;
	right: 0;
}

.rbns a.rbns-arrowbtn:hover .rbns-arrowbtn__ico {
	transform: rotate(45deg);
}

[dir="rtl"] .rbns a.rbns-arrowbtn:hover .rbns-arrowbtn__ico {
	transform: scaleX(-1) rotate(45deg);
}

/* Faint diagonal bands behind layouts 2 & 6. */
.rbns-bands {
	position: absolute;
	inset-inline-end: -10px;
	bottom: 0;
	z-index: 0;
	width: clamp(180px, 26vw, 380px);
	line-height: 0;
	pointer-events: none;
	animation: rbnsZumpX 1s ease-in-out infinite alternate;
}

.rbns-bands svg {
	display: block;
	width: 100%;
	height: auto;
}

.rbns-bands path {
	fill: var(--rbns-dark);
	fill-opacity: 0.05;
}

[dir="rtl"] .rbns-bands {
	scale: -1 1;
}

/* ==== Layout 3 — intro column + tiles ==== */
.rbns-l3 {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
	gap: 24px;
	align-items: start;
}

.rbns-l3__intro {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: start;
	padding-block: 10px;
}

.rbns-l3 .rbns-head {
	margin-bottom: 0;
}

.rbns-l3 .rbns-head__text {
	margin-bottom: 60px;
}

/* ==== Layout 8 — numbered cards ==== */
.rbns-card--num {
	overflow: hidden;
	isolation: isolate;
	height: 100%;
	padding: 48px 30px 38px;
	background: var(--rbns-card-bg, var(--rbns-light));
}

.rbns-card--num > *:not(.rbns-card__hover):not(.rbns-num) {
	position: relative;
	z-index: 1;
}

.rbns-num {
	position: absolute;
	top: 18px;
	inset-inline-end: 26px;
	z-index: 1;
	font-family: var(--rbns-heading);
	font-size: 64px;
	font-weight: 800;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1px var(--rbns-num-c, rgba(29, 29, 29, 0.22));
	transition: -webkit-text-stroke-color 0.4s ease;
}

.rbns-card__hover {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-position: center;
	background-size: cover;
	opacity: 0;
	transform: scale(1.12);
	transition: opacity 0.5s ease, transform 1s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.rbns-card__hover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--rbns-hover-bg);
	opacity: 0.82;
}

.rbns-card--num::after {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	bottom: 0;
	z-index: 2;
	width: 100%;
	height: 3px;
	background: var(--rbns-accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}

[dir="rtl"] .rbns-card--num::after {
	transform-origin: right center;
}

.rbns-card--num:hover {
	background: var(--rbns-hover-bg);
}

.rbns-card--num:hover::after {
	transform: scaleX(1);
}

.rbns-card--num:hover .rbns-card__hover {
	opacity: 1;
	transform: none;
}

.rbns-card--num:hover .rbns-title {
	color: var(--rbns-title-hc, #ffffff);
}

.rbns-card--num:hover .rbns-desc {
	color: rgba(255, 255, 255, 0.78);
}

.rbns-card--num:hover .rbns-icon {
	color: var(--rbns-icon-hc, var(--rbns-accent));
}

.rbns-card--num:hover .rbns-num {
	-webkit-text-stroke-color: var(--rbns-accent);
}

/* ---- Section heading ---- */
.rbns-head {
	position: relative;
	z-index: 1;
	margin-bottom: var(--rbns-head-gap);
}

.rbns-head__top {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	color: var(--rbns-accent);
}

.rbns-head__mark {
	display: block;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
}

.rbns-head__tagline {
	display: inline-block;
	font-family: var(--rbns-font);
	font-size: 18px;
	line-height: 1.875;
	text-transform: capitalize;
	color: inherit;
}

.rbns .rbns-head__title {
	margin: 0;
	font-family: var(--rbns-heading);
	font-size: clamp(30px, 3.4vw, 48px);
	font-weight: 600;
	line-height: 1.208;
	color: var(--rbns-dark);
}

.rbns-head__title span {
	color: var(--rbns-accent);
}

.rbns-head__text {
	max-width: 640px;
	margin: 18px 0 0;
	font-size: 16px;
	line-height: 1.8;
	color: var(--rbns-text);
}

.rbns-head--center {
	text-align: center;
}

.rbns-head--center .rbns-head__top {
	justify-content: center;
}

.rbns-head--center .rbns-head__text {
	margin-inline: auto;
}

.rbns-tri {
	display: inline-block;
	width: 9px;
	height: 10px;
	background: var(--rbns-accent);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.rbns-tri--end {
	clip-path: polygon(100% 0, 0 50%, 100% 100%);
}

/* ---- Closing line ---- */
.rbns-bottom {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 16px 24px;
	margin-top: 44px;
	text-align: center;
}

.rbns-bottom__text {
	margin: 0;
	font-size: 16px;
	color: var(--rbns-text);
}

.rbns-bottom__text span {
	font-weight: 700;
	color: var(--rbns-dark);
}

/* ==== Carousels (layouts 5, 6, 7) ==== */
.rbns-carousel {
	position: relative;
}

.rbns-track {
	display: flex;
	gap: var(--rbns-gap);
	margin-block: -14px;
	padding-block: 14px;
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.rbns-track::-webkit-scrollbar {
	display: none;
}

.rbns-slide {
	flex: 0 0 calc((100% - (var(--rbns-cols) - 1) * var(--rbns-gap)) / var(--rbns-cols));
	scroll-snap-align: start;
}

.rbns-car-ui {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	margin-top: 36px;
}

.rbns-carousel.is-static .rbns-car-ui {
	display: none;
}

.rbns button.rbns-car-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--rbns-nav-c, var(--rbns-dark));
	border-radius: 50%;
	background: transparent;
	color: var(--rbns-nav-c, var(--rbns-dark));
	cursor: pointer;
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}

.rbns button.rbns-car-btn:hover,
.rbns button.rbns-car-btn:focus-visible {
	border-color: var(--rbns-nav-hbg, var(--rbns-accent));
	background: var(--rbns-nav-hbg, var(--rbns-accent));
	color: #ffffff;
}

.rbns button.rbns-car-btn:disabled {
	opacity: 0.35;
	cursor: default;
}

[dir="rtl"] .rbns-car-btn svg {
	transform: scaleX(-1);
}

.rbns-dots {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}

.rbns button.rbns-dot {
	width: 10px;
	height: 10px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--rbns-dot-c, rgba(29, 29, 29, 0.2));
	cursor: pointer;
	transition: background-color 0.3s ease, transform 0.3s ease;
}

.rbns button.rbns-dot.is-on {
	background: var(--rbns-dot-a, var(--rbns-accent));
	transform: scale(1.3);
}

.rbns-empty {
	margin: 0;
	padding: 30px;
	border: 1px dashed #cccccc;
	text-align: center;
}

/* ---- Keyframes ---- */
@keyframes rbnsSpin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@keyframes rbnsZumpX {
	from { transform: translateX(0); }
	to { transform: translateX(-13px); }
}

@keyframes rbnsSquare {
	0% { transform: translate(0, 0) rotate(0deg); }
	25% { transform: translate(30px, 0) rotate(15deg); }
	50% { transform: translate(30px, 30px) rotate(0deg); }
	75% { transform: translate(0, 30px) rotate(-15deg); }
	100% { transform: translate(0, 0) rotate(0deg); }
}

@keyframes rbnsSwing {
	20% { transform: rotate(15deg); }
	40% { transform: rotate(-10deg); }
	60% { transform: rotate(5deg); }
	80% { transform: rotate(-5deg); }
	100% { transform: rotate(0deg); }
}

/* ---- Scroll entrance (Noile WOW fadeInUp, staggered by --rbns-i) ----
   Hidden states apply only once the script has marked the widget (.rbns-js),
   so without JS everything is visible. */
@media (prefers-reduced-motion: no-preference) {
	.rbns.rbns-js .rbns-reveal {
		opacity: 0;
		transition: opacity var(--rbns-dur, 1300ms) ease, transform var(--rbns-dur, 1300ms) cubic-bezier(0.2, 0.7, 0.2, 1);
		transition-delay: calc(var(--rbns-i, 0) * var(--rbns-step, 100ms));
	}
	.rbns.rbns-js[data-rbns-anim="fadeInUp"] .rbns-reveal { transform: translateY(60px); }
	.rbns.rbns-js[data-rbns-anim="fadeInLeft"] .rbns-reveal { transform: translateX(-60px); }
	.rbns.rbns-js[data-rbns-anim="fadeInRight"] .rbns-reveal { transform: translateX(60px); }
	[dir="rtl"] .rbns.rbns-js[data-rbns-anim="fadeInLeft"] .rbns-reveal { transform: translateX(60px); }
	[dir="rtl"] .rbns.rbns-js[data-rbns-anim="fadeInRight"] .rbns-reveal { transform: translateX(-60px); }
	.rbns.rbns-js[data-rbns-anim="zoomIn"] .rbns-reveal { transform: scale(0.82); }
	.rbns.rbns-js[data-rbns-anim="flipInX"] .rbns-reveal { transform: perspective(900px) rotateX(-75deg); transform-origin: 50% 0; }
	.rbns.rbns-js .rbns-reveal.is-in {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rbns *,
	.rbns *::before,
	.rbns *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ---- Responsive ---- */
@media (max-width: 1599px) {
	.rbns .rbns-tile .rbns-title { font-size: 20px; }
	.rbns-float { inset-inline-start: -110px; width: 90px; }
}

@media (max-width: 1399px) {
	.rbns--l2 { --rbns-cols: 4; }
	.rbns--l2 .rbns-col--letter,
	.rbns--l2 .rbns-col--circle,
	.rbns-cornercircle,
	.rbns-float { display: none; }
}

@media (max-width: 1199px) {
	.rbns--l1,
	.rbns--l8 { --rbns-cols: 3; }
	.rbns-bands { display: none; }
}

@media (max-width: 991px) {
	.rbns-l3 { grid-template-columns: minmax(0, 1fr); }
	.rbns-l3 .rbns-head__text { margin-bottom: 30px; }
	.rbns-float { display: none; }
}

@media (max-width: 767px) {
	.rbns { --rbns-tag-gap: 50px; --rbns-tile-h: 0px; }
	.rbns-tile { padding: 40px 24px; }
	.rbns-letter { font-size: 150px; }
}

/* ---- Category filter buttons (services from the admin) ---- */
.rbns-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: var(--rbns-flex);
	gap: 10px;
	margin: 0 0 32px;
}

.rbns button.rbns-filter__btn {
	margin: 0;
	padding: 9px 22px;
	border: 1px solid var(--rbns-chip-bd, var(--rbns-border));
	border-radius: 50px;
	background: var(--rbns-chip-bg, transparent);
	color: var(--rbns-chip-c, var(--rbns-dark));
	font-family: var(--rbns-heading);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	text-transform: none;
	cursor: pointer;
	transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.rbns button.rbns-filter__btn:hover,
.rbns button.rbns-filter__btn:focus-visible,
.rbns button.rbns-filter__btn.is-on {
	border-color: var(--rbns-chip-abg, var(--rbns-dark));
	background: var(--rbns-chip-abg, var(--rbns-dark));
	color: var(--rbns-chip-ac, #ffffff);
}

.rbns .rbns-col[hidden] {
	display: none !important;
}