@media only screen and (max-width: 3000px) and (min-width: 2500.98px) {
	.container {
		max-width: 2100px;
	}



}

@media only screen and (max-width: 2500px) and (min-width: 1921px) {
	.container {
		max-width: 1800px;
	}
	
}

@media only screen and (max-width: 1920px) and (min-width: 1500px) {
	.container {
		max-width: 1600px;
	}

}

@media only screen and (max-width: 1600px) {}

@media only screen and (max-width: 1445px) {}

@media only screen and (max-width: 1366px) {
	html {
		font-size: 15px;
	}
}

@media (max-width: 1199.98px) {
	html {
		font-size: 14px;
	}
}

@media (max-width: 991.98px) {
	html {
		font-size: 13px;
	}
}

@media (max-width: 767.98px) {
	html { font-size: 12px; }
}

@media (max-width: 575.98px) {}

@media (max-width: 320.98px) {}

/* ============ Mobile responsiveness overrides ============ */
img, video, figure { max-width: 100%; height: auto; }
body { overflow-x: hidden; }

/* Quote modal: hidden by default, responsive when opened */
.project-modal-overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 10000;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(0,0,0,.62);
	backdrop-filter: blur(6px);
}
.project-modal-overlay.active { display: flex; }
.project-modal-box {
	position: relative;
	width: min(680px, 100%);
	max-height: calc(100dvh - 48px);
	overflow-y: auto;
	padding: 34px;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 28px 80px rgba(0,0,0,.28);
}
.project-modal-close {
	position: absolute;
	right: 16px;
	top: 14px;
	width: 38px;
	height: 38px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: #eef0f3;
	color: #090909;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
}
.project-modal-header { text-align: center; padding: 4px 22px 22px; }
.project-modal-tag { display: block; color: var(--primary); font-weight: 600; margin-bottom: 4px; }
.project-modal-header h2 { font-size: 2.55rem; line-height: 1.05; margin: 0 0 8px; color: #090909; }
.project-modal-header p { margin: 0; color: #333; }
.project-modal-form { display: grid; gap: 14px; }
.pm-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pm-field { display: grid; gap: 6px; }
.pm-field label { color: #090909; font-size: .92rem; font-weight: 600; }
.project-modal-form input,
.project-modal-form select,
.project-modal-form textarea {
	width: 100%;
	min-width: 0;
	border: 1px solid rgba(0,0,0,.18);
	border-radius: 8px;
	padding: 12px 13px;
	background: #fff;
	color: #090909;
	font: inherit;
}
.project-modal-form textarea { min-height: 118px; resize: vertical; }
.pm-submit-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 52px;
	border: 0;
	border-radius: 8px;
	background: linear-gradient(90deg, rgba(31, 63, 211, 1) 0%, rgba(33, 199, 247, 1) 51%);
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}
.pm-submit-btn svg { width: 18px; height: 18px; }
.pm-success { text-align: center; }
@media (max-width: 1199.98px) {
	.container { width: 100%; max-width: 100%; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; }
}


@media (max-width: 1199.98px) {
	header { position: sticky; top: 0; padding: 0 !important; overflow: visible; box-shadow: 0 6px 22px rgba(0,0,0,.08); }
	header .navbar { width: 100%; display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; background: #eef0f3; padding: 0.45rem 0.85rem !important; gap: 0.6rem; }
	.navbar-brand { width: auto; margin: 0 !important; padding: 0 !important; display: flex; align-items: center; min-width: 0; background: transparent !important; clip-path: none !important; }
	.navbar-brand img { max-height: 42px; width: auto; max-width: 118px; object-fit: contain; }
	.navbar-toggler { display: inline-grid !important; place-items: center; width: 42px; height: 42px; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 50%; background: #fff !important; box-shadow: 0 8px 18px rgba(0,0,0,.12); grid-column: 2 / 3; }
	.navbar-toggler .toggler-icon { width: 23px !important; height: 18px !important; }
	.navbar-toggler .toggler-icon span { height: 2px !important; background: #090909 !important; }
	.navbar-toggler .toggler-icon span:nth-child(2) { top: 8px !important; }
	.navbar-toggler .toggler-icon span:nth-child(3) { top: 16px !important; }
	.navbar-toggler.active .toggler-icon span:nth-child(1),
	.navbar-toggler.active .toggler-icon span:nth-child(3) { top: 8px !important; }
	.navbar-collapse.side-menu {
		display: block !important;
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: min(84vw, 330px) !important;
		height: 100dvh !important;
		background: #ffffff !important;
		padding: 0 !important;
		transform: translateX(-105%) !important;
		transition: transform .32s ease !important;
		box-shadow: 18px 0 44px rgba(0,0,0,.22) !important;
		z-index: 9999 !important;
		overflow-y: auto !important;
	}
	.navbar-collapse.side-menu.open,
	.navbar-collapse.side-menu.show { transform: translateX(0) !important; left: 0 !important; }
	.side-header { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: 1rem 1.1rem; border-bottom: 1px solid rgba(0,0,0,.08); background: #f7f9f8; }
	.side-logo { min-width: 0; }
	.side-logo img { max-width: 116px; height: auto !important; object-fit: contain; }
	.menu-close { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; border: 0 !important; background: #eef0f3 !important; color: #090909; line-height: 1; font-size: 22px; }
	.menu-overlay { display: block !important; position: fixed; inset: 0; background: rgba(0,0,0,.48); opacity: 0; visibility: hidden; transition: .25s ease; z-index: 9998; }
	.menu-overlay.active { opacity: 1; visibility: visible; }
	.navbar-nav { display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important; width: 100% !important; padding: 0.7rem 0 !important; margin: 0 !important; list-style: none; }
	.navbar-nav .nav-item { width: 100% !important; min-width: 0; }
	.navbar-nav .nav-link { display: block !important; padding: 0.95rem 1.25rem !important; color: #090909 !important; font-size: 1rem !important; line-height: 1.2 !important; text-align: left; text-decoration: none !important; border-bottom: 1px solid rgba(0,0,0,.07) !important; white-space: normal; }
	.navbar-nav .nav-link br { display: none; }
	.head-btn.auth-buttons { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0.7rem; margin: 0 !important; padding: 1rem 1.1rem 1.25rem; border-top: 1px solid rgba(0,0,0,.08); }
	.head-btn .themeBtn { width: 100%; min-width: 0; text-align: center; padding: 0.78rem 0.7rem !important; font-size: 0.78rem !important; line-height: 1; white-space: nowrap; border: 0; cursor: pointer; border-radius: 999px; }
	body.menu-open .navbar-toggler { visibility: hidden !important; pointer-events: none !important; }
	body.menu-open { overflow: hidden; }
	.mouse-cursor { display: none !important; }
}

@media (max-width: 991.98px) {
	.main-slider { height: auto !important; min-height: 720px; background: #eef0f3; }
	.homeSlider.swiper-container { position: relative; height: auto; min-height: 720px; }
	.homeSlider .slide-inner { position: relative; min-height: 720px; height: auto; padding: 92px 0 56px; background-size: cover; background-position: center; justify-content: flex-start; }
	.homeSlider .swiper-wrapper,
	.homeSlider .swiper-slide { height: auto; }
	.slideOne .mainHead { font-size: 42px; line-height: 1.1; word-break: break-word; }
	.slideOne p { font-size: 15px; }
	.slideOne .top-bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
	.main-slider .right-content { margin-top: 28px; min-height: 310px; display: flex; align-items: flex-end; justify-content: center; }
	.main-slider .right-content .women-img,
	.main-slider .right-content .design-1,
	.main-slider .right-content .design-2,
	.main-slider .right-content .logos .logo { opacity: 1 !important; transform: none !important; }
	.main-slider .right-content .women-img { top: 0; max-width: 250px; }
	.main-slider .right-content .women-img:before { width: 260px; height: 260px; opacity: 1 !important; transform: scale(1) !important; }
	.main-slider .design-1 { left: 3%; top: 48%; max-width: 92px; }
	.main-slider .design-2 { right: 2%; top: 57%; max-width: 92px; }
	.main-slider .logos .logo { max-width: 42px; }
	.main-slider .logos .logo:nth-child(1) { top: 48%; right: 21%; }
	.main-slider .logos .logo:nth-child(2) { top: 58%; right: 15%; }
	.main-slider .logos .logo:nth-child(3) { bottom: 18%; left: 15%; }
	.main-slider .logos .logo:nth-child(4) { bottom: 9%; left: 28%; }
	.header_links { display: none !important; }
	.arrow { bottom: 22px; z-index: 2; }
}
@media (max-width: 575.98px) {
	.main-slider { min-height: 760px; }
	.homeSlider.swiper-container { min-height: 760px; }
	.homeSlider .slide-inner { min-height: 760px; padding-top: 72px; }
	.slideOne { min-height: 0; justify-content: flex-start; padding-top: 0; }
	.slideOne .mainHead { font-size: 34px; }
	.main-slider .wl-span { font-size: 19px; line-height: 1.3; }
	.main-slider p { font-size: 14px; line-height: 1.45; max-width: 100%; }
	.slideOne .top-bar { flex-direction: column; align-items: stretch; }
	.slideOne .top-bar .themeBtn, .slideOne .top-bar .call-us-btn { width: 100%; justify-content: center; text-align: center; }
	.call-us-btn { padding-left: 0; }
}

@media (max-width: 991.98px) {
	.inner-banner { min-height: 300px; padding: 72px 0 38px; background-size: cover !important; background-position: center !important; display: flex; align-items: center; }
	.inner-banner .mainHead { font-size: 42px; }
	.price-banner, .about-banner, .services-banner { min-height: 320px; }
}
@media (max-width: 575.98px) {
	.inner-banner .mainHead { font-size: 32px; }
	.inner-banner { min-height: 260px; padding: 55px 0 35px; }
	.price-banner, .about-banner, .services-banner, .porfolio-banner, .contact-banner { min-height: 260px; }
}

@media (max-width: 991.98px) {
	section { padding-top: 50px; padding-bottom: 50px; }
	.heading-sec h2, section h2 { font-size: 30px; line-height: 1.2; }
	section h3 { font-size: 22px; }
	section p { font-size: 15px; line-height: 1.6; }
	[data-aos],
	.images-content .brillint-img,
	.images-content .brillint-text,
	.section-3 .content,
	.section-3 .web-post,
	.section-4 .portfolio-box,
	.section-6 .img-box,
	.section-6 .direction-banner::before,
	.section-13 .aniamtion-img .animate-1,
	.section-13 .aniamtion-img .animate-2 { opacity: 1 !important; transform: none !important; visibility: visible !important; }
	.row { row-gap: 24px; }
	.bg-sec .content,
	.section-13 .content,
	.section-11 .content,
	.section-7 .content { width: 100% !important; padding-left: 0 !important; }
	.section-7 .row { align-items: center; }
	.section-7 .content h2 { font-size: 34px; line-height: 1.08; }
	.section-7 figure { max-width: 440px; margin-left: auto; margin-right: auto; }
	.section-12 h2,
	.section-4 h2 { font-size: 34px; line-height: 1.14; }
	.section-12 p { font-size: 18px; padding-bottom: 1.6rem; }
	.section-12 .headin-para p { width: 100%; font-size: 15px; }
}
@media (max-width: 575.98px) {
	.heading-sec h2, section h2 { font-size: 26px; }
	.section-7 .content h2 { font-size: 40px; }
	.section-7 .content p { font-size: 16px; line-height: 1.55; }
	.section-7 .row > .col-md-6:has(figure) { order: 2; }
	.section-7 .row > .col-md-6:has(.content) { order: 1; }
	.bg-sec .row > .col-md-6:has(figure) { order: 2; }
}

@media (max-width: 767.98px) {
	.section-5 { padding-top: 50px; overflow: hidden; }
	.section-5:before { height: 100%; min-height: 900px; background-size: cover; }
	.section-5 .heading-sec h2 { font-size: 24px; line-height: 1.22; }
	.ul-pkg { display: grid !important; grid-template-columns: 1fr; gap: 14px; justify-content: stretch; padding: 0; margin: 24px 0 28px; list-style: none; }
	.ul-pkg li { width: 100%; }
	.ul-pkg li a { display: block; text-align: center; padding: 10px 12px; font-size: 14px; border: 1px solid rgba(255,255,255,.4); border-radius: 6px; color: #fff; text-decoration: none; }
	.ul-pkg li a.active { background: rgba(255,255,255,.15); }
	.pkg-content { margin-bottom: 20px; padding: 24px 18px; max-height: none !important; }
	.section-15 .pkg-content { max-height: none; }
	.section-4 { overflow: hidden; }
	.section-4 .porfolio-after { display: none; }
	.section-4 h2 { font-size: 30px; }
	.ul-tab { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 28px; padding-bottom: 0 !important; }
	.ul-tab li:first-child { grid-column: 1 / -1; justify-self: center; width: min(220px, 100%); }
	.ul-tab li a { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: center; padding: 10px 14px; text-align: center; font-size: 15px; }
	.section-4 .content-img .row { row-gap: 12px; }
	.section-4 .content-img figure { margin: 0.7rem 0; }
}

@media (max-width: 767.98px) {
	.talk-heading { font-size: 60px; line-height: 1; text-align: center; }
	.talk-heading .lets, .talk-heading .talk { display: inline-block; }
}
@media (max-width: 575.98px) {
	.talk-heading { font-size: 44px; }
}

@media (max-width: 767.98px) {
	.section-7 .content { margin-top: 20px; }
	.section-7 figure { margin: 0 auto 20px; text-align: center; }
}

@media (max-width: 767.98px) {
	.my-orders-banner, .contact-banner { padding: 80px 0 40px; text-align: center; }
	form input, form textarea, form select { width: 100%; }
	.orders-stats { display: grid; grid-template-columns: 1fr; gap: 12px; }
	.orders-grid { grid-template-columns: 1fr !important; }
	.contact-sec-1 { position: static !important; transform: none !important; margin: 0 auto; }
	.section-tell { padding: 35px 0 20px; }
	.address-tab { flex: 0 0 100%; max-width: 100%; margin-bottom: 20px; font-size: 16px; }
	.address-tab .tel-icon { width: 96px; height: 96px; }
	.tel-icon i { font-size: 2.1rem; }
	.address-tab p { font-size: 18px; padding: 8px 0 4px; }
	.address-tab a { overflow-wrap: anywhere; }
	.contact-sec { padding-top: 20px; }
	.contact-sec .sec-heading { padding-top: 0; }
	section.contact-sec h2 { font-size: 34px; line-height: 1.18; padding: 0 0 1.6rem; }
	form.contact-form .form-control { padding: 1rem; }
}

@media (max-width: 991.98px) {
	.section-14 { overflow: hidden; }
	.section-14 .content { padding: 28px 18px !important; }
	.section-14 h2 { font-size: 2rem !important; line-height: 1.15 !important; text-align: center; margin-bottom: 1rem; }
	.section-14 .button-box,
	.section-14 .btn-style { width: 100%; display: grid !important; grid-template-columns: 1fr; gap: 12px; }
	.section-14 .themeBtn,
	.section-14 .call-us-btn,
	.section-14 .chat-btn { width: 100%; min-width: 0; justify-content: center; text-align: center; padding: 0.95rem 1rem !important; white-space: normal; }
	.section-14 .themeBtn img { flex: 0 0 auto; max-width: 24px; }
}

@media (max-width: 767.98px) {
	footer .row > [class*="col-"] { margin-bottom: 30px; }
	footer { text-align: center; }
	footer ul { padding: 0; list-style: none; }
	.legal-card { padding: 20px !important; }
	.legal-card h2 { font-size: 22px; }
}

.swiper-container { overflow: hidden; }

/* Optimized background assets */
.about-banner { background-image: url('/images/about-banner.webp') !important; }
.services-banner { background-image: url('/images/services-banner.webp') !important; }
.porfolio-banner { background-image: url('/images/porfolio-banner.webp') !important; }
.contact-banner { background-image: url('/images/contact-banner.webp') !important; }
footer { background-image: url('/images/footer-bg.webp') !important; }
.testimonial-section { background-image: url('/images/transparent-dot.webp') !important; }
.section-5:before { background-image: url('/images/our-pkg-bg.webp') !important; }
.services-sec:after { background-image: url('/images/before-ser.webp') !important; }
.section-6 .direction-banner::before { background-image: url('/images/left-direction.webp') !important; }
.section-6 .direction-banner::after { background-image: url('/images/right-direction.webp') !important; }
.contact-sec:before { background-image: url('/images/dot-contact.png') !important; } /* the .webp conversion lost its alpha channel and rendered as a solid gray slab */

/* Final mobile clamps for the ported template */
@media (max-width: 991.98px) {
	/* Keep template reveal-animation elements visible on mobile. The original
	   template hides these until scroll observers add .animate; in React/mobile
	   that observer can replay and remove visibility after the page has loaded. */
	[data-aos],
	[data-aos].aos-init,
	[data-aos].aos-animate,
	.main-slider .right-content,
	.main-slider .right-content .women-img,
	.main-slider .right-content .women-img:before,
	.main-slider .design-1,
	.main-slider .design-2,
	.main-slider .logos .logo,
	.section-2 .images-content,
	.section-2 .images-content .brillint-img,
	.section-2 .images-content .brillint-text,
	.section-3 .swiper-slide .content,
	.section-3 .swiper-slide .web-post,
	.section-4,
	.section-4 .portfolio-box,
	.section-6,
	.section-6 .direction-banner:before,
	.section-6 .direction-banner:after,
	.section-13 .aniamtion-img .animate-1,
	.section-13 .aniamtion-img .animate-2 {
		opacity: 1 !important;
		visibility: visible !important;
	}
	[data-aos],
	[data-aos].aos-init,
	[data-aos].aos-animate,
	.main-slider .right-content .women-img,
	.main-slider .design-1,
	.main-slider .design-2,
	.main-slider .logos .logo,
	.section-2 .images-content .brillint-img,
	.section-2 .images-content .brillint-text,
	.section-3 .swiper-slide .content,
	.section-3 .swiper-slide .web-post,
	.section-4 .portfolio-box {
		transform: none !important;
	}
	.main-slider .right-content.animate .women-img,
	.main-slider .right-content.animate .women-img:before,
	.main-slider .right-content.animate .design-1,
	.main-slider .right-content.animate .design-2,
	.main-slider .right-content.animate .logo,
	.section-2 .images-content.animate .brillint-img,
	.section-2 .images-content.animate .brillint-text,
	.section-3 .swiper-slide-active .content,
	.section-3 .swiper-slide-active .web-post,
	.section-4.animate .portfolio-box,
	.section-6.animate .direction-banner:before,
	.section-6.animate .direction-banner:after {
		animation-name: none !important;
	}
	html,
	body,
	#root { width: 100%; max-width: 100%; overflow-x: hidden; }
	main,
	section,
	.container,
	.container-fluid { max-width: 100%; }
	.swiper,
	.swiper-container { max-width: 100vw !important; }
	.swiper-pointer-events,
	.swiper-pointer-events .swiper-wrapper,
	.swiper-pointer-events .swiper-slide {
		opacity: 1 !important;
		visibility: visible !important;
	}
	/* Legacy static fallback (only used for single-slide hero) */
	.mobile-swiper-static { height: auto !important; overflow: visible !important; pointer-events: auto !important; }
	.mobile-swiper-static .swiper-wrapper {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 18px !important;
		width: 100% !important;
		height: auto !important;
		transform: translate3d(0, 0, 0) !important;
		transition-duration: 0ms !important;
	}
	.mobile-swiper-static .swiper-slide {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		margin-right: 0 !important;
		transform: none !important;
	}
	.mobile-swiper-static .swiper-slide-duplicate,
	.mobile-swiper-static .swiper-pagination,
	.mobile-swiper-static .swiper-scrollbar { display: none !important; }
	.homeSlider .swiper-slide,
	.homeSlider .slide-inner { max-width: 100vw !important; }
	.homeSlider.homeSlider-static .swiper-wrapper { transform: translate3d(0, 0, 0) !important; transition-duration: 0ms !important; }
	.homeSlider.homeSlider-static .swiper-slide { width: 100vw !important; max-width: 100vw !important; margin-right: 0 !important; }
	.homeSlider.homeSlider-static .swiper-slide-duplicate { display: none !important; }
	.homeSlider.homeSlider-static .swiper-pagination { display: none !important; }
	.homeSlider .slide-inner { background-image: url('/images/Banner.jpg') !important; }
	.homeSlider .slide-inner > .container,
	.homeSlider .slideOne,
	.homeSlider .slideOne > * { position: relative !important; z-index: 5 !important; opacity: 1 !important; visibility: visible !important; transform: none !important; }
	.homeSlider .slide-inner::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(0,0,0,.5), rgba(0,0,0,.18)); pointer-events: none; }
	.homeSlider .slide-inner { isolation: isolate; }
	.price-banner { background-image: linear-gradient(90deg, rgba(23, 12, 132, 0.58), rgba(23, 12, 132, 0.28)), url('/__l5e/assets-v1/29bd0806-b9b5-49c9-b564-31c4daf54584/price-banner.png') !important; }
	.inner-banner,
	.about-banner,
	.services-banner,
	.porfolio-banner,
	.price-banner,
	.contact-banner { background-size: cover !important; background-position: center !important; }
	.price-banner h1 { color: #fff !important; text-shadow: 0 2px 12px rgba(0,0,0,.3); }
	.section-1 .satisfaction-slider .content { justify-content: center; padding: 2.4rem 0.7rem; gap: 1rem; }
	.section-1 .satisfaction-slider .content h3 { font-size: 1.25rem; line-height: 1.15; letter-spacing: 1px; }
	.section-2 .content,
	.section-2 .content p { width: 100% !important; }
	.section-2 .content h2 { font-size: 2.45rem; line-height: 1.12; }
	.section-2 .top-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
	.section-2 .top-bar .themeBtn { margin-left: 0; }
	.images-content { min-height: 420px; margin-top: 2rem; overflow: hidden; }
	.images-content .brillint-img:nth-child(1) { left: 18%; top: 0; width: 70%; }
	.images-content .brillint-img:nth-child(2) { left: 0; top: 210px; width: 70%; }
	.images-content .brillint-img:nth-child(3) { left: 8%; top: 150px; width: 36%; }
	.images-content .img-4 { right: 8%; top: 190px; width: 30%; }
	.images-content .brillint-text { left: 55%; top: 72px; width: 38%; font-size: 0.95rem; }
	.services-sec .swiper-slide,
	.section-12 .webSlider .swiper-slide,
	.section-12 .webSlider .swiper-slide.active,
	.testimonialSlider .swiper-slide,
	.satisfaction-slider .swiper-slide { width: calc(100vw - 40px) !important; max-width: calc(100vw - 40px) !important; }
	.section-12 .webSlider .swiper-slide img { width: 100%; height: auto; }
	.process-subtitle,
	.process-heading { font-size: 1.9rem !important; line-height: 1.2; }
	.process-desc { font-size: 1rem !important; }
}

@media (max-width: 575.98px) {
	header .navbar { padding: 0.45rem 0.7rem !important; column-gap: 0.35rem; }
	.navbar-brand img { max-height: 38px; max-width: 108px; }
	.navbar-nav { gap: 0 !important; }
	.navbar-nav .nav-link { font-size: 0.98rem !important; padding: 0.95rem 1.2rem !important; }
	.head-btn.auth-buttons { gap: 0.65rem; }
	.head-btn .themeBtn { font-size: 0.76rem !important; padding: 0.78rem 0.65rem !important; }
	.main-slider { min-height: 710px; }
	.homeSlider.swiper-container { min-height: 710px; }
	.homeSlider .slide-inner { min-height: 710px; padding-top: 54px; }
	.slideOne .mainHead { font-size: 2.1rem; line-height: 1.06; }
	.main-slider .right-content { min-height: 280px; margin-top: 16px; }
	.main-slider .right-content .women-img { max-width: 235px; }
	.main-slider .right-content .women-img:before { width: 245px; height: 245px; }
	.main-slider .themeBtn { padding: 1rem 1.4rem; }
	.call-us-btn { gap: 0.75rem; }
	.call-text span:last-child { font-size: 1.65rem; }
	.section-2 .content h2 { font-size: 2.25rem; }
	.section-2 .content span { font-size: 1.15rem; }
	.images-content { min-height: 360px; }
	.section-12 .webSlider .swiper-slide,
	.section-12 .webSlider .swiper-slide.active { width: calc(100vw - 40px) !important; }
	.section-15 h2 { font-size: 2.1rem; line-height: 1.18; }
}

@media (max-width: 380px) {
	.navbar-brand img { max-height: 34px; max-width: 96px; }
	.navbar-toggler { width: 38px; height: 38px; }
	.navbar-nav .nav-link { font-size: 0.95rem !important; padding: 0.88rem 1.1rem !important; }
	.head-btn .themeBtn { font-size: 0.72rem !important; padding: 0.72rem 0.55rem !important; }
}

/* Testimonials, Let's Talk, Footer mobile polish */
@media (max-width: 991.98px) {
	.testimonial-section { padding: 40px 0 !important; overflow: hidden; }
	.testimonial-section h2 { font-size: 2.2rem !important; line-height: 1.08 !important; text-align: center; margin-bottom: 0.35rem; }
	.testimonial-section > .container > p { text-align: center; padding: 0 0 1rem !important; }
	.testimonial-section .display-images-left,
	.testimonial-section .display-images-right { display: none !important; }
	.testimonial-section .row { display: block; }
	.testimonial-section .col-md-6 { width: 100%; max-width: 100%; flex: 0 0 100%; }
	.testimonial-section .testimonial-slide { width: 100%; max-width: 100%; padding: 0 8px 28px; overflow: hidden; }
	.testimonial-section .swiper-wrapper { align-items: stretch; }
	.testimonial-section .swiper-slide { width: 100% !important; max-width: calc(100vw - 40px) !important; text-align: center; padding: 20px 12px; box-sizing: border-box; }
	.testimonial-section .swiper-slide > figure:first-of-type img { max-width: 90px; height: auto; margin: 0 auto; }
	.testimonial-section .swiper-slide p { font-size: 15px; line-height: 1.55; padding: 0 4px !important; }
	.testimonial-slide .swiper-pagination { top: auto !important; bottom: 0 !important; position: relative; margin-top: 10px; }
}

@media (max-width: 767.98px) {
	.talk-heading { font-size: clamp(4rem, 20vw, 7rem) !important; line-height: 0.95; text-align: center; margin: 24px 0 32px; letter-spacing: 0; overflow-wrap: normal; }
	.talk-heading .lets, .talk-heading .talk { display: inline-block; padding: 0 0.06em; }

	footer { text-align: center; padding: 42px 0 0 !important; background-position: center top !important; background-size: cover !important; clear: both; position: relative; z-index: 1; }
	footer .container { padding: 0 20px; }
	footer .row.footer-row { display: block; border-bottom: 1px solid rgba(255,255,255,.28); padding-bottom: 22px; }
	footer .row.footer-row > .col-md-12 > .row { display: block; row-gap: 30px; }
	footer .col-md-4 { width: 100%; max-width: 100%; flex: 0 0 100%; margin-bottom: 0; }
	footer .col-md-12 { width: 100%; max-width: 100%; }
	footer .footer-logo:before,
	footer .footer-logo:after { display: none; }
	footer .contact-details,
	footer .contact-frm { height: auto !important; justify-content: flex-start !important; margin: 0 !important; }
	footer .contact-details h4,
	footer .contact-frm h4 { font-size: 1.45rem; padding-bottom: 1rem; }
	footer .contact-details ul { padding: 0; list-style: none; }
	footer .contact-details li,
	footer .contact-details li a { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; word-break: break-word; padding-right: 0; line-height: 1.4; }
	footer .footer-logo { text-align: center; }
	footer .footer-logo img { max-width: 140px; margin: 24px auto 0; }
	footer .social-icon { display: flex; justify-content: center; gap: 12px; padding: 0; list-style: none; }
	footer .contact-frm h4 { text-align: center; }
	footer .contact-frm form { position: relative; display: grid; grid-template-columns: 1fr; gap: 10px; max-width: 340px; margin: 0 auto; width: 100%; }
	footer .contact-frm input,
	footer .contact-frm button { width: 100%; position: static !important; right: auto !important; }
	footer .contact-frm input { padding: 0.8rem 1rem; }
	footer .contact-frm button { padding: 0.8rem 1rem; }
	footer .footer-menu ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 18px; padding: 0; list-style: none; }
	.copyright { text-align: center; padding: 14px 20px; font-size: 13px; }
	.copyright p { word-break: break-word; }
}

/* Contact page mobile repair */
@media (max-width: 991.98px) {
	.section-tell { padding: 34px 0 20px !important; overflow: visible; }
	.contact-sec-1 { position: static !important; inset: auto !important; transform: none !important; margin: 0 auto !important; }
	.section-tell .row { row-gap: 16px; }
	.address-tab { flex: 0 0 100% !important; max-width: 100% !important; width: 100% !important; padding: 18px 14px; margin: 0 0 12px !important; border-radius: 12px; background: #fff; box-shadow: 0 8px 28px rgba(0,0,0,.08); font-size: 15px !important; }
	.address-tab .tel-icon { width: 78px !important; height: 78px !important; }
	.tel-icon i { font-size: 1.8rem !important; }
	.address-tab p { font-size: 17px !important; padding: 8px 0 3px !important; }
	.address-tab a { max-width: 100%; overflow-wrap: anywhere; }
	.contact-sec { margin-bottom: 0 !important; padding: 32px 0 36px !important; overflow: hidden; }
	.contact-sec:before { display: none; }
	.contact-sec .sec-heading { padding-top: 0 !important; }
	section.contact-sec h2 { font-size: 2rem !important; line-height: 1.14 !important; padding: 0 0 1.6rem !important; }
	form.contact-form .row { row-gap: 12px; }
	form.contact-form button { width: min(100%, 260px); padding: 0.95rem 1.2rem !important; margin-top: 0.8rem !important; }
}

@media (max-width: 480px) {
	section.contact-sec h2 { font-size: 1.65rem !important; }
	.talk-heading { font-size: clamp(3.5rem, 19vw, 5.8rem) !important; }
}

/* Service blocks: keep headings clear of decorative service images/icons */
@media (max-width: 991.98px) {
	.section-7 { overflow: hidden; }
	.section-7 .row { display: flex; flex-direction: column; }
	.section-7 .content { position: relative; z-index: 2; background: rgba(255,255,255,.88); border-radius: 10px; padding: 4px 0 12px !important; }
	.section-7.bg-sec .content { background: transparent !important; padding: 0 !important; }
	.section-7 .content h2 { position: relative; z-index: 3; margin-bottom: 12px; }
	.section-7 figure { position: relative; z-index: 1; max-height: 430px; overflow: hidden; }
	.section-7 figure img,
	.section-7 figure video { max-height: 430px; object-fit: contain; }
}

/* Final mobile repair pass */
@media (max-width: 1199.98px) {
	header { z-index: 1000; }
	body.menu-open header .navbar-toggler,
	header .navbar-toggler.active {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
	.navbar-collapse.side-menu { visibility: hidden !important; pointer-events: none !important; }
	.navbar-collapse.side-menu.open,
	.navbar-collapse.side-menu.show { visibility: visible !important; pointer-events: auto !important; }
	.navbar-nav .nav-link { font-weight: 600; letter-spacing: 0; }
	.head-btn.auth-buttons .themeBtn { text-transform: uppercase; }
}

@media (max-width: 991.98px) {
	.services-sec { padding-top: 38px !important; overflow: hidden; }
	.services-sec:after { opacity: 0.28; width: 100%; height: 360px; top: 12px; right: -42%; background-size: contain; z-index: 0; }
	.services-sec .heading-sec { position: relative; z-index: 2; display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 0 20px 24px !important; }
	.services-sec .heading-sec h2 { font-size: 2.7rem !important; line-height: 1.05 !important; position: relative; z-index: 3; }
	.services-sec .heading-sec p { margin: 0; position: relative; z-index: 3; }
	.services-sec .swiper-button-next { position: static !important; width: 54px !important; height: 54px !important; margin: 0 !important; grid-column: 2; grid-row: 1 / span 2; background: rgba(255,255,255,.82); z-index: 4; }
	.services-sec .swiper-button-next figure { font-size: 0.82rem; }
	.services-sec .container-fluid { padding-left: 20px !important; padding-right: 20px !important; }
	.services-sec .servicesslider { overflow: visible !important; }
	.services-sec .servicesslider .swiper-wrapper { align-items: stretch; }
	.services-sec .servicesslider .swiper-slide { padding: 10px 0 !important; width: min(84vw, 340px) !important; max-width: min(84vw, 340px) !important; height: auto; }
	.services-sec .servicesslider .services-wrapp { min-height: 310px; padding: 30px 18px !important; border-radius: 26px !important; }
	.services-sec .services-img { width: min(170px, 52vw); margin: 0 auto; }
	.services-sec .services-img::before { width: 88% !important; height: 86% !important; left: -10px !important; top: -10px !important; border-radius: 16px 0 0 0; }
	.services-sec .services-content h3 { font-size: 1.65rem !important; line-height: 1.12 !important; overflow-wrap: anywhere; }

	.section-6 { overflow: hidden; }
	.section-6 .direction-banner { padding: 38px 20px !important; }
	.section-6 .direction-banner:before,
	.section-6 .direction-banner:after { opacity: .22 !important; background-size: 230px auto !important; height: 100% !important; top: 0 !important; }
	.section-6 .direction-banner:before { left: -96px !important; }
	.section-6 .direction-banner:after { right: -142px !important; }
	.section-6 .direction-banner h2 { font-size: 2.15rem !important; line-height: 1.14 !important; }
	.section-6 .btn-style { display: grid !important; grid-template-columns: 1fr; gap: 14px !important; width: min(100%, 330px); margin: 0 auto; padding-top: 22px !important; }
	.section-6 .btn-style .themeBtn,
	.section-6 .chat-btn { width: 100%; min-width: 0; min-height: 54px; display: flex !important; align-items: center; justify-content: center; text-align: center; padding: 0.9rem 1.15rem !important; white-space: normal; line-height: 1.2; border-radius: 4px; }
	.section-6 .btn-style .themeBtn { overflow-wrap: anywhere; }
	.section-6 .chat-btn figure { flex: 0 0 auto; width: 34px; margin: 0; }
	.section-6 .chat-btn p { margin: 0; }
	.section-6 .chat-btn p:nth-child(1) { font-size: 1rem !important; }
	.section-6 .chat-btn p:nth-child(2) { font-size: 1.08rem !important; }

	.testimonial-section { min-height: auto !important; padding: 42px 0 34px !important; background-size: 360px auto !important; }
	.testimonial-section .container { overflow: hidden; }
	.testimonial-section h2 { font-size: 2.35rem !important; }
	.testimonial-section .row { margin-left: 0; margin-right: 0; }
	.testimonial-section .col-md-3 { display: none !important; }
	.testimonial-section .swiper-wrapper { align-items: stretch; }
	.testimonial-section .swiper-slide { margin-right: 0 !important; }

	.contact-sec-1 .row,
	.section-tell .row { margin-left: 0; margin-right: 0; }
	.section-tell { background: #eef0f3; }
	.contact-sec-1 > .row > .col-md-11 { padding-left: 0; padding-right: 0; }
	.address-tab { min-height: 182px; }
	.contact-sec { clear: both; background-position: center bottom !important; background-size: cover !important; }
	.contact-sec .col-lg-10 { width: 100%; }
	form.contact-form .form-group { margin-bottom: 12px; }
	form.contact-form textarea.form-control { min-height: 150px; }

	.project-modal-overlay { padding: 14px !important; overflow-y: auto !important; }
	.project-modal-box { width: min(100%, 520px) !important; max-height: calc(100dvh - 28px); overflow-y: auto; padding: 22px 16px !important; }
	.project-modal-header h2 { font-size: 1.9rem !important; }
	.pm-field-row { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
	.project-modal-form input,
	.project-modal-form select,
	.project-modal-form textarea { width: 100% !important; min-width: 0; }

	.section-12 { padding: 46px 0 34px !important; overflow: hidden; }
	.section-12 .container { max-width: 100%; overflow: hidden; }
	.section-12 h2 { font-size: 3.15rem !important; line-height: 1.05 !important; max-width: 720px; margin: 0 auto 10px; }
	.section-12 > .container > p { font-size: 1.22rem !important; line-height: 1.35 !important; padding: 0 12px 22px !important; }
	.section-12 .webSlider .swiper { padding: 20px 0 18px !important; overflow: visible; }
	.section-12 .webSlider .swiper-slide { width: min(78vw, 420px) !important; max-width: 78vw !important; }
	.section-12 .webSlider .swiper-slide img { height: 245px !important; border-radius: 14px !important; }
	.section-12 .webSlider .swiper-slide a { border-radius: 14px !important; }
	.section-12 .webSlider .swiper-pagination { margin-top: 14px !important; }
	.section-12 .headin-para { padding-top: 20px !important; }
	.section-12 .headin-para p { width: 100% !important; max-width: 660px; font-size: 1rem !important; line-height: 1.65 !important; padding: 0 12px !important; }

	.section-14 { padding: 52px 20px !important; overflow: hidden; }
	.section-14 .content { display: grid !important; grid-template-columns: 1fr !important; gap: 22px !important; justify-items: center; text-align: center; }
	.section-14 .content > .row { width: 100%; display: grid !important; grid-template-columns: 1fr !important; row-gap: 18px; margin: 0 !important; }
	.section-14 .content > .row > [class*="col-"] { width: 100% !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
	.section-14 .content h2 { font-size: 2.65rem !important; line-height: 1.08 !important; margin: 0; max-width: 560px; }
	.section-14 .button-box { display: grid !important; gap: 14px; width: min(100%, 340px); margin: 0 auto; }
	.section-14 .btn-style { display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; width: min(100%, 340px); justify-content: stretch !important; }
	.section-14 .themeBtn,
	.section-14 .call-us-btn,
	.section-14 .chat-btn { width: 100%; min-height: 54px; display: flex !important; align-items: center; justify-content: center; text-align: center; padding: 0.88rem 1rem !important; white-space: normal; line-height: 1.2; }
	.section-14 .chat-btn figure { flex: 0 0 auto; width: 34px; margin: 0; }
}

@media (max-width: 767.98px) {
	.talk-heading { display: flex; align-items: baseline; justify-content: center; gap: 0.08em; min-height: 0; padding: 0 !important; }
	.talk-heading .lets,
	.talk-heading .talk { display: inline-block !important; }
	footer { overflow: hidden; }
	footer .footer-row { align-items: flex-start !important; }
	footer .contact-details,
	footer .footer-logo,
	footer .contact-frm { padding: 0 0 24px; }
	footer .contact-details h4,
	footer .contact-frm h4 { color: #fff; line-height: 1.25; }
	footer .contact-details ul { display: grid !important; grid-template-columns: 1fr; gap: 10px !important; }
	footer .contact-details li img,
	footer .contact-details a img { width: 18px; height: 18px; object-fit: contain; }
	footer .footer-logo p { padding-top: 1rem !important; }
	footer .social-icon li a { width: 42px; height: 42px; }
	footer .contact-frm form { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
	footer .contact-frm input { height: 46px; text-align: center; }
	footer .contact-frm button { height: 46px; display: grid; place-items: center; }
	footer .footer-menu ul { margin-top: 8px !important; border-top: 1px solid rgba(255,255,255,.22); padding-top: 16px !important; gap: 10px 16px !important; }
	.section-12 h2 { font-size: 2.35rem !important; }
	.section-12 > .container > p { font-size: 1.05rem !important; }
	.section-12 .webSlider .swiper-slide { width: 82vw !important; max-width: 82vw !important; transform: scale(.9); }
	.section-12 .webSlider .swiper-slide-active { transform: scale(1); }
	.section-12 .webSlider .swiper-slide img { height: 210px !important; }
	.section-12 .ws-arrow { width: 40px !important; height: 40px !important; }
	.section-14 .content h2 { font-size: 2.1rem !important; }
	.services-sec .heading-sec { grid-template-columns: 1fr auto !important; }
	.services-sec .heading-sec h2 { font-size: 2rem !important; }
	.services-sec .servicesslider .swiper-slide { width: calc(100vw - 40px) !important; max-width: calc(100vw - 40px) !important; }
	.services-sec .servicesslider .services-wrapp { min-height: 285px; }
}

@media (max-width: 430px) {
	.section-6 .direction-banner h2 { font-size: 1.85rem !important; }
	.services-sec .heading-sec h2 { font-size: 1.75rem !important; }
	.services-sec .heading-sec p { font-size: 0.92rem !important; }
	.project-modal-header h2 { font-size: 1.65rem !important; }
	.section-12 h2 { font-size: 2rem !important; }
	.section-12 .webSlider .swiper-slide img { height: 185px !important; }
	.section-14 { padding: 44px 14px !important; }
	.section-14 .content h2 { font-size: 1.86rem !important; }
}

/* ============ Additional fixes ============ */
/* Social icons: always show icon + circle, mobile-friendly */
footer .social-icon li a {
	color: #fff !important;
	background: linear-gradient(90deg, rgba(31,59,209,1) 0%, rgba(33,199,247,1) 60%);
	border-color: transparent !important;
	display: inline-grid !important;
	place-items: center;
	line-height: 1;
}
footer .social-icon li a svg,
footer .social-icon li a i { color: #fff; }

/* Process cards: icon presentation */
.process-icon {
	background: linear-gradient(135deg, rgba(31,59,209,.10), rgba(33,199,247,.10));
	border-radius: 22px;
	color: var(--primary, #1f3bd1);
}
.process-icon i { font-size: 2.2rem; line-height: 1; }
.process-card:hover .process-icon {
	background: linear-gradient(135deg, rgba(31,59,209,1), rgba(33,199,247,1));
	color: #fff;
}

/* Services section: prevent decorative bg overflow on any device */
.services-sec { overflow: hidden; }
.services-sec:after { max-width: 100vw; pointer-events: none; }

/* Request-a-Quote CTA: make responsive from tablet down */
@media (max-width: 1199.98px) {
	.section-6 .btn-style {
		display: flex !important;
		flex-wrap: wrap;
		justify-content: center;
		gap: 14px !important;
	}
	.section-6 .btn-style .themeBtn,
	.section-6 .chat-btn {
		white-space: normal;
		max-width: 100%;
	}
}

/* Footer subscribe form: prevent input hiding behind absolute button */
footer .contact-frm form { position: relative; }
@media (min-width: 992px) {
	.contact-frm input { width: 100% !important; padding-right: 150px; box-sizing: border-box; }
}
@media (min-width: 992px) {
	.contact-frm button { right: 6px !important; top: 50%; transform: translateY(-50%); padding: 10px 1.6rem !important; }
}

/* Logo / header compactness override */
.navbar-brand img { max-height: 60px; width: auto; }
.navbar-brand { padding: 0.8rem 5rem 0.6rem 3.5rem !important; }

/* ============ UI/UX audit fixes (2026-09) ============ */

/* --- Desktop header: make the expanded nav fit between 1200px and 1920px.
   Root cause: .navbar-nav { width: 76%; gap: 6rem } applied to BOTH nav lists,
   so the two lists + auth buttons totalled ~150% of the bar and overflowed
   the viewport at 1200-1600px (Sign In/Up pushed offscreen). --- */
@media (min-width: 1200px) {
	header .navbar { flex-wrap: nowrap; }
	header .navbar-collapse.side-menu {
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		flex: 1 1 auto;
		min-width: 0;
		gap: 1.6rem;
		padding-right: 1.25rem;
	}
	header .navbar-nav { width: auto !important; flex-wrap: nowrap; gap: clamp(1rem, 2.4vw, 4rem); }
	header .navbar-nav .nav-link { white-space: nowrap; }
	header .navbar-nav.product-subnav {
		gap: clamp(0.7rem, 1.3vw, 1.5rem);
		padding-left: 1.4rem;
		border-left: 1px solid rgba(9, 9, 9, 0.16);
	}
	header .head-btn.auth-buttons { flex-shrink: 0; }
}
@media (min-width: 1200px) and (max-width: 1599.98px) {
	.navbar-brand { padding: 0.7rem 2.4rem 0.6rem 1.6rem !important; }
	.navbar-brand img { max-height: 46px; }
	header .navbar-nav .nav-link { font-size: 0.95rem !important; }
	header .navbar-nav.product-subnav .nav-link { font-size: 0.85rem !important; }
	.head-btn .themeBtn { padding: 0.55rem 1.05rem !important; font-size: 0.78rem !important; }
}

/* --- Footer quick links: 10 items with a 5rem gap can never fit on one line
   below ~1500px; the centered flex row spilled outside the viewport. --- */
footer .footer-menu ul {
	flex-wrap: wrap !important;
	gap: 0.9rem 2rem !important;
	justify-content: center;
}

/* --- Pre-animation AOS states (zoom-out starts at scale(1.2), fade-left/right
   start translated 100px) widen the page before each section scrolls into
   view. Clip horizontal overflow on animated sections so the page never
   gains a latent horizontal scroll area. overflow-x: clip does not create a
   scroll container, so sticky elements and vertical layout are unaffected. --- */
.testimonial-section,
section:has([data-aos]),
section:has(.images-content) { overflow-x: clip; }

/* --- Missing assets: price-banner.png (was an external 24MB upload that no
   longer resolves) and contact-f-bottom.png 404 on every visit. Both already
   rendered without the image, so make that state intentional. --- */
.price-banner { background-image: linear-gradient(100deg, #170c84 0%, #1f3fd3 55%, #21c7f7 130%) !important; }
.contact-sec { background-image: none !important; }

/* --- btnHover() splits .themeBtn labels into per-letter divs (SplitType), so
   a tight button wraps mid-word ("PROJ / ECT"). The split only runs on
   desktop (>991px), where buttons should stay on one line anyway. --- */
@media (min-width: 992px) {
	.themeBtn { white-space: nowrap; }
}

/* ============ Second visual polish pass (2026-09) ============ */

/* Footer "Subscribe to our Newsletter": the heading had no color rule and
   inherited near-black (#1b1d1c), invisible on the dark footer photo. */
footer .contact-frm h4 { color: var(--white, #fff); }

/* "Tell Us What You Want to Build" (navy .direction-banner): the paragraph had
   no color rule and inherited near-black body text on the navy background. */
.section-6 .direction-banner p { color: rgba(255, 255, 255, 0.88); position: relative; z-index: 2; }

/* Header Sign In / Sign Up: .themeBtn was designed for <a> tags; on <button>
   elements the UA default "2px outset black" border showed as a dark double
   edge / hidden layer around the pill. Normalize buttons using the class. */
button.themeBtn { border: 0; cursor: pointer; -webkit-appearance: none; appearance: none; }
button.themeBtn:focus-visible { outline: 2px solid #21c7f7; outline-offset: 2px; }

/* Package cards: the theme styled the price h4 bright red on the blue gradient
   card. With "Custom Quote" replacing the placeholder $00.00, use brand white
   at a size that fits the longer label. */
.section-15 .pkg-content h4,
.section-5 .pkg-content h4 { color: #fff; font-size: 2.1rem; }

/* Letter-split headings: chars are inline-block divs, so they can wrap
   mid-word inside their word wrapper. Only allow wraps between words. */
.mainHead .word { white-space: nowrap; display: inline-block; }

/* Footer social icons: the gradient painted under the (transparent) 1px border
   ring — background-clip defaults to border-box — leaving a dark sliver
   protruding at the left/right of each circle. Remove the border entirely and
   clip the background to the padding box. */
footer .social-icon li a {
	border: 0 !important;
	border-radius: 50% !important;
	background-clip: padding-box !important;
	overflow: hidden;
}
footer .social-icon li { background: none; border: 0; }

/* "Have a brilliant idea" collage: the children are absolutely positioned with
   %-offsets of the column width, so on very wide screens (or low browser zoom)
   the pieces drift apart. Cap the collage at its design width. */
.images-content { max-width: 480px; margin-left: auto; }

/* Footer newsletter: the SUBSCRIBE button floated 6px inside the input,
   leaving a white sliver of input visible to its right. Anchor it flush to the
   input's right edge, full height, rounding only the outer corners. */
@media (min-width: 992px) {
	footer .contact-frm button {
		right: 0 !important;
		top: 0 !important;
		bottom: 0;
		transform: none !important;
		height: 100%;
		border-radius: 0 5px 5px 0 !important;
		padding: 0 1.7rem !important;
	}
}

/* Collage pieces are decorative: never intercept clicks (img-2 was covering
   the right edge of the VIEW MORE button), and keep the overlapping team
   photo clear of the text column's CTA at desktop widths. */
.images-content .brillint-img,
.images-content .brillint-text { pointer-events: none; }
@media (min-width: 992px) {
	.images-content .brillint-img:nth-child(2) { left: -33%; }
}

/* "Our Services" slider: kill the leftover 220x250 cyan panel the template
   shows behind the ACTIVE slide's icon (designed for the original big image
   cards; on the current navy icon cards it reads as a stray light-blue block
   that jumps between cards while sliding). */
.services-img::before,
.servicesslider .swiper-slide.swiper-slide-active .services-img::before { display: none !important; }

/* Normalize the service icon box: icon assets have very different natural
   sizes (58px to 178px tall), which misaligned card headings. */
.services-sec .services-wrapp .services-img {
	height: 130px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 1.3rem;
}
.services-sec .services-wrapp .services-img img {
	max-height: 100%;
	max-width: 150px;
	width: auto;
	height: auto;
}

/* Collage brand logo (img-4): the theme positions it under the caption
   ("Make your business prosper…") but never constrains its size, so the raw
   logo rendered at 344px and covered the photos. Size it to the caption
   column at desktop; the <=991px rules already set width: 30%. */
@media (min-width: 992px) {
	.images-content .img-4 { width: clamp(110px, 30%, 150px); right: 4%; top: 205px; }
}

/* voxo-card grids ("Custom Software, Mobile Apps & AI", "Our Products"):
   cards are already equal height (height: 100%), but the CTA sat directly
   after the content, so shorter cards showed their button higher. Pin the
   CTA to the card bottom. */
.voxo-card { display: flex; flex-direction: column; }
.voxo-card > ul { margin-bottom: 14px; }
.voxo-card .themeBtn { margin-top: auto !important; align-self: flex-start; }

/* Product cards (home "Our Products", portfolio "Our Own Platforms"):
   the three hero screenshots have different aspect ratios (1408x1200 vs
   1280x960), so image heights differed card-to-card. Give every card the
   same media box and crop with object-fit. Also let the uppercase eyebrow
   wrap: it was nowrap and got truncated by the card's overflow: hidden. */
.voxo-card figure {
	height: 220px;
	width: 100%;
	overflow: hidden;
	border-radius: 14px;
	margin: 0 0 16px;
}
.voxo-card figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}
.voxo-card .eyebrow { white-space: normal; display: block; line-height: 1.6; }

/* Long-label CTAs inside cards ("Show Us Your Current Workflow"): the global
   desktop .themeBtn { white-space: nowrap } made it wider than its card, and
   the card's overflow: hidden cut it. Buttons now letter-split as words,chars
   (see custom.min.js btnHover), so allowing wrap inside cards breaks lines at
   word boundaries only. */
.themeBtn .word { white-space: nowrap; display: inline-block; }
@media (min-width: 992px) {
	.voxo-card .themeBtn {
		white-space: normal;
		text-align: center;
		max-width: 100%;
		line-height: 1.35;
	}
}
