@import url("icons/font-awesome.css"); /* Ref: https://fontawesome.com/search?o=r&m=free */
@import url("icons/bootstrap-icons.css"); /* Ref: https://icons.getbootstrap.com/#icons */
@import url("icons/unicons.css"); /* Ref: https://iconscout.com/unicons/explore/line */

[class*="fa-"],
[class*=" fa-"],
[class*="bi-"],
[class*=" bi-"],
[class*="uil-"],
[class*=" uil-"] {
	display: inline-block;
	line-height: inherit;
	font-display: swap;
}

[class*="fa-"]::before,
[class*=" fa-"]::before,
[class*="bi-"]::before,
[class*=" bi-"]::before,
[class*="uil-"]::before,
[class*=" uil-"]::before {
	display: inline-flex;
	align-self: center;
	justify-self: center;
	line-height: inherit;
}

.icon-lg {
	font-size: 1.3333333333333333em;
	line-height: 0.75em;
	vertical-align: -15%;
}
.icon-2x {
	font-size: 2em;
}
.icon-3x {
	font-size: 3em;
}
.icon-4x {
	font-size: 4em;
}
.icon-5x {
	font-size: 5em;
}
.icon-fw {
	width: 1.2857142857142858em;
	text-align: center;
}

.icon-border {
	padding: 0.2em 0.25em 0.15em;
	border: solid 0.08em #eeeeee;
	border-radius: 0.1em;
}
.icon.pull-left {
	margin-right: 0.3em;
}
.icon.pull-right {
	margin-left: 0.3em;
}
.icon-spin {
	-webkit-animation: spin 2s infinite linear;
	-moz-animation: spin 2s infinite linear;
	-o-animation: spin 2s infinite linear;
	animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
	0% {
		-moz-transform: rotate(0deg);
	}
	100% {
		-moz-transform: rotate(359deg);
	}
}
@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(359deg);
	}
}
@-o-keyframes spin {
	0% {
		-o-transform: rotate(0deg);
	}
	100% {
		-o-transform: rotate(359deg);
	}
}
@-ms-keyframes spin {
	0% {
		-ms-transform: rotate(0deg);
	}
	100% {
		-ms-transform: rotate(359deg);
	}
}
@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(359deg);
	}
}
.icon-rotate-90 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}
.icon-rotate-180 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}
.icon-rotate-270 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	transform: rotate(270deg);
}
.icon-flip-horizontal {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
	-webkit-transform: scale(-1, 1);
	-moz-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	transform: scale(-1, 1);
}
.icon-flip-vertical {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
	-webkit-transform: scale(1, -1);
	-moz-transform: scale(1, -1);
	-ms-transform: scale(1, -1);
	-o-transform: scale(1, -1);
	transform: scale(1, -1);
}
.icon-stacked {
	position: relative;
	display: inline-block;
	width: 2em;
	height: 2em;
	line-height: 2em;
	vertical-align: middle;
}
.icon-stacked-1x,
.icon-stacked-2x {
	position: absolute;
	left: 0;
	width: 100%;
	text-align: center;
}
.rtl .icon-stacked-1x,
.rtl .icon-stacked-2x {
	left: auto;
	right: 0;
}
.icon-stacked-1x {
	line-height: inherit;
}
.icon-stacked-2x {
	font-size: 2em;
}
.icon-inverse {
	color: #ffffff;
}
/**
 * Swiper 11.0.5
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2023 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: November 22, 2023
 */

 @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
/* ----------------------------------------------------------------
	Canvas: SAAS 2
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------
	FONTS
---------------------------------------------------------------------------- */

:root {
	--cnvs-themecolor: #3E45EB;
	--cnvs-themecolor-rgb: 62, 69, 235;
	--cnvs-gradient-color: linear-gradient(to right, #f6955c, #f23457);

	--cnvs-body-image: url('images/new/blur-bg.png');

	--cnvs-saas-color-1: #FFF7EF;
	--cnvs-saas-color-2: #F9FAF6;

	--cnvs-font-size-h1:	2.75rem;
	--cnvs-font-size-h2:	2rem;
	--cnvs-font-size-h3:	1.75rem;
	--cnvs-font-size-h4:	1.5rem;
	--cnvs-font-size-h5:	1rem;
	--cnvs-font-size-h6:	0.875rem;
	--cnvs-section-padding: 6rem;
	--bs-body-font-size: 1.125rem;

	--cnvs-primary-font: 'DM Sans', sans-serif;
	--cnvs-body-font: 'DM Sans', sans-serif;
	--cnvs-secondary-font: 'Cookie', cursive;
	--cnvs-other-font: 'Marcellus', serif;

	--cnvs-slider-arrow-color: var(--cnvs-contrast-300);
	--cnvs-slider-arrows-bg-color: transparent;
	--cnvs-slider-arrows-bg-hover-color: var(--cnvs-slider-arrows-bg-color);
	--cnvs-slider-arrows-size: 34px;
	--cnvs-canvas-slider-dots-size: 0.725rem;
	--cnvs-card-rounded: 20px;
}

:root,
.not-dark {
	--cnvs-heading-color: var(--cnvs-contrast-1000);
}

.fw-bolder {
	font-weight: 600 !important;
}

.rounded-xxl {
	border-radius: var(--cnvs-card-rounded);
}

.gradient-color {
	background-image: var(--cnvs-gradient-color) !important;
}

.gradient-text {
    font-family: var(--cnvs-secondary-font);
	padding: 0 5px;
	font-size: 120%;
}

.cnvs-bg-color-1 {
	background-color: var(--cnvs-saas-color-1)  !important;
}

.cnvs-bg-color-2 {
	background-color: var(--cnvs-saas-color-2)  !important;
}
.second-bg-color {
    background-color: var(--cnvs-secondcolor) !important;
}
#header {
	--cnvs-primary-menu-font-size: 1.125rem;
	--cnvs-primary-menu-tt:	none;
	--cnvs-primary-menu-ls:	0;
    --cnvs-primary-menu-padding-x: 20px;
    --cnvs-primary-menu-font-weight: 400;
	--cnvs-primary-menu-font: var(--cnvs-body-font);
}

#wrapper {
	background: var(--cnvs-body-bg);
	background-image: var(--cnvs-body-image);
	background-repeat: repeat-y;
	background-position: center top;
	background-size: 100% auto;
}


/* Swiper Tabs */
.swiper-pagination-progress {
	--cnvs-swiper-bar-size: 2px;
	--cnvs-swiper-bar-color:  var(--cnvs-contrast-200);
	--cnvs-swiper-bar-active-color: var(--cnvs-contrast-1000);
	position: absolute;
	left: 0;
	bottom: 0px;
	width: 100%;
	height: auto;
	border-radius: 0;
	opacity: 1;
	margin: 0px;
	background-color: transparent;
}
.swiper-pagination-progress .swiper-pagination-bar,
.swiper-pagination-progress .swiper-pagination-bar-active {
	position: absolute;
	bottom: 0;
	border-radius: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: var(--cnvs-swiper-bar-size);
	margin: 0px;
	background-color: var(--cnvs-swiper-bar-color);
}

.swiper-pagination-progress .swiper-pagination-bar-active {
	z-index: 2;
	width: 0%;
	background-color: var(--cnvs-swiper-bar-active-color);
}
.active .swiper-pagination-progress .swiper-pagination-bar-active {
	animation-name: swiperbarAnim;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
	animation-direction: alternate;
	animation-fill-mode: forwards;
}
@keyframes swiperbarAnim {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

.swiper-tab-link {
	--swiper-tab-title: #AAA;
	--swiper-tab-content: ;
	counter-increment: step-counter;
	position: relative;
	overflow: hidden;
	margin-bottom: 5px;
	padding: 20px 0;
	cursor: pointer;
}

.swiper-tab-link::before {
	content: "0" counter(step-counter)'.';
	position: relative;
	display: inline-block;
	font-size: 26px;
    font-weight: 600;
    min-width: 50px;
	margin-right: 5px;
	color: var(--swiper-tab-title);
    font-family: monospace;
	line-height: 1;
}

.swiper-tab-link .swiper-tab-title {
	display: inline-block;
	color: var(--swiper-tab-title);
	margin-bottom: 0;
	font-size: calc(1.275rem + 0.3vw);
}

.swiper-tab-link .swiper-tab-content {
	margin-bottom: 0;
	padding-top: 10px;
    margin-left: 5px;
	line-height: 0;
	opacity: 0;
	vertical-align:middle;
	font-size: 1rem;
	transition: line-height 0.6s cubic-bezier(.4,0,.2,1), opacity .1s .1s cubic-bezier(.4,0,.2,1);
}

@media (min-width: 768px) {
    .swiper-tab-link .swiper-tab-content {
        margin-left: 60px;
    }
}

.swiper-tab-link.active .swiper-tab-content {
	opacity: .8;
	line-height: var(--cnvs-line-height-content);
	transition: line-height 0.5s cubic-bezier(.4,0,.2,1), opacity .15s .15s cubic-bezier(.4,0,.2,1);
}

.swiper-tab-link.active {
	--swiper-tab-title: #000;
}

.back-shadow {
	---cnvs-back-shadow-size: 5px;
	---cnvs-back-shadow-bg: var(--cnvs-contrast-1000);
	---cnvs-back-shadow-color: var(--cnvs-contrast-0);
	position: relative;
	background-color: var(---cnvs-back-shadow-color);
	border: 1px solid var(---cnvs-back-shadow-bg);
	margin-left: var(---cnvs-back-shadow-size);
	margin-bottom: var(---cnvs-back-shadow-size);
	box-shadow: calc(-1 * var(---cnvs-back-shadow-size)) var(---cnvs-back-shadow-size) 0 var(---cnvs-back-shadow-bg);
}


.pricing-bg {
	position: absolute;
	left: 0;
	top: 0;
	transform: scale(120%);
	z-index: -1;
	opacity: 0.4;
	object-fit: cover;
	width: 100%;
}

.pts-left,
.pts-right {
	font-weight: 600 !important;
}


.toggle {
    --cnvs-toggle-base-color: var(--cnvs-heading-color);
    --cnvs-toggle-font-size: 1.125rem;
    --cnvs-toggle-title-color: var(--cnvs-heading-color);
    --cnvs-toggle-content-padding: 1.5rem 1.75rem;
    margin: 0 0 30px 0;
}

.toggle-header {
	border-radius: var(--cnvs-card-rounded);
	font-weight: 600;
}

.toggle-content {
	padding: 1.5rem 0;
	padding-bottom: .75rem;
	opacity: .8;
	margin-bottom: 0;
}

.toggle-closed {
	transition: .2s;
	opacity: .2;
}

.toggle-active .toggle-closed {
	display: block;
	transform: rotate(45deg);
	opacity: 1;
}

.pricing-tenure-switcher .btn-group {
    background-color: var(--cnvs-contrast-200);
    padding: 6px;
}

.pricing-tenure-switcher .btn-group .btn {
    --bs-btn-border-width: 0;
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: 0.425rem;
    --bs-btn-font-size: var(--bs-body-font-size);
    --bs-btn-font-weight: 500;
    border-radius: var(--bs-border-radius-pill) !important;
}

.pricing-tenure-switcher .btn-check:checked + .btn {
    background-color: var(--cnvs-contrast-900);
	color: #FFF;
}
/* ----------------------------------------------------------------
	Canvas: Landing
-----------------------------------------------------------------*/

:root {
	--cnvs-themecolor: #3D80E4;
	--cnvs-themecolor-rgb: 61, 128, 228;
	--cnvs-secondary-color: #FF3A33;

	--cnvs-body-font: 'Source Sans Pro', sans-serif;
	--cnvs-primary-font: 'Roboto', sans-serif;
}

#header {
	--cnvs-primary-menu-font-weight: 500;
	--cnvs-primary-menu-font-size:	1rem;
	--cnvs-primary-menu-tt:	none;
	--cnvs-primary-menu-ls:	0;
	--cnvs-primary-menu-submenu-font-weight:	400;
	--cnvs-primary-menu-submenu-hover-font-weight: 500;
	--cnvs-primary-menu-submenu-tt:	none;
}

#header {
	--cnvs-primary-menu-submenu-font-size: 15px;
	--cnvs-primary-menu-submenu-color: #666;
	--cnvs-primary-menu-submenu-hover-bg: transparent;
}

.is-expanded-menu .menu-container > .menu-item {
	--cnvs-primary-menu-hover-color: #FFF !important;
	--cnvs-primary-menu-active-color: #FFF !important;
}

* {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.button,
.btn { transition: transform 0.45s cubic-bezier(0.2, 0.7, .3, 1); }

.button:hover,
.btn:hover { transform: translateX(-4px); }

.text-muted { color: #9BB0BF !important; }

.bgsecondary { background-color: var(--cnvs-secondary-color, #FF3A33); }

.sub-menu-container .menu-item > .menu-link i {
	margin-right: 15px;
	color: var(--cnvs-themecolor, #3D80E4);
	font-size: 18px;
}

.sub-menu-container:not(.mega-menu-column),
.mega-menu-content {
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 15px 18px;
	margin-top: -1px;
}

.slider-element {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.slide-imgs .iphone-img {
	position: relative;
	z-index: 1;
	width: 330px;
	-webkit-transform: perspective(1400px) rotateY(-20deg) rotateX(10deg) rotateZ(6deg) scale(0.8) translateX(50%) translateY(6%);
	transform: perspective(1400px) rotateY(-20deg) rotateX(10deg) rotateZ(6deg) scale(0.8) translateX(50%) translateY(6%);
	transition: transform 0.45s cubic-bezier(0.2, 0.7, .3, 1);
}

.slide-imgs:hover .iphone-img {
	-webkit-transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.95) translateX(40%) translateY(8%);
	transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.95) translateX(40%) translateY(8%);
}

.slide-imgs .card-img {
	position: absolute;
	bottom: 10px;
	left: -90px;
	width: 360px;
	transition: opacity 0.65s cubic-bezier(0.2, 0.7, .3, 1);
	z-index: 1;
}

.slider-element  { z-index: 1; }

.section-clients {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 45px 0;
	background-color: #FFF;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.section-clients img { width: 100px; }

.section-features { padding: 120px }

.heading-block h2 {
	font-size: 52px;
	line-height: 1.3;
	font-weight: 900;
	letter-spacing: -1px;
}

.heading-block h3 {
	font-size: 32px;
	line-height: 1.2;
	font-weight: 700;
}

.features-items .feature-box .fbox-icon {
	--f-icon-size: 42px;
	position: relative;
	margin-bottom: 34px;
	width: 42px;
	height: 42px;
	width: var(--f-icon-size);
	height: var(--f-icon-size);
}

.features-items .feature-box .fbox-icon i {
	background-color: transparent !important;
	color: var(--cnvs-themecolor, #3D80E4);
	font-size: 42px;
	font-size: var(--f-icon-size);
}

.features-items .fbox-desc h3 {
	font-size: 19px;
	text-transform: none;
	font-weight: 800;
	letter-spacing: 0;
}

.owl-stage-outer { padding: 0; }

.owl-stage-outer .owl-stage-outer-bg {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	-webkit-background-size: contain;
	background-size: contain;
	background-image: url('images/section/device.png');
	background-repeat: no-repeat;
	background-position: center center;
	transform: translate(-50%,-50%);
	z-index: 1;
}

.owl-item img {
	width: 100%;
	transform: scale(0.85);
	transition: transform .3s cubic-bezier(0.2, 0.7, .3, 1);
}

.owl-item.active.center img {
	transform: scale(0.95);
}

.owl-carousel .owl-dots .owl-dot {
	opacity: .3;
	margin-top: 40px;
	width: 20px;
	height: 5px;
	border-radius: 4px;
	transition: all .3s cubic-bezier(0.2, 0.7, .3, 1);
}

.owl-carousel .owl-dots .owl-dot.active { width: 50px; }

.pricing-table .card {
	border-radius: 20px;
	padding: 25px 40px;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: -1px -1px;
	background-size: 102% 160px;
	border-color: rgba(255, 255, 255, 0.3);
}

.pricing-table .card h2 { font-size: 48px; }

.pricing-table .card p {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.6 !important;
}

.pricing-table .card .iconlist {
	font-size: 15px;
	font-weight: 500;
	color: #888;
	font-family: 'Roboto';
}

.pricing-table .card .iconlist li:not(:last-child) { margin-bottom: 7px; }

.toggle-wrap {
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 10px;
}

.toggle {
	padding: 18px 30px;
	margin-bottom: 0;
	background-color: rgba(255,255,255,0.1);
	border-bottom: 1px solid rgba(255,255,255,0.15);
	transition: background-color .2s ease;
}

.toggle:first-child {
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.toggle:last-child {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.toggle:last-child { border-bottom: 0; }

.toggle .togglet {
	font-size: 19px;
	padding-left: 0;
	font-weight: 600;
	color: #F5F5F5;
}

.toggle:hover { background-color: rgba(255,255,255,0.15); }

.device-video-wrap { position: relative; }

.device-video-wrap img {
	position: relative;
	margin: 0 auto;
	max-width: 1024px;
}

.device-video-wrap video {
	position: absolute;
	top: 35px;
	left: 33%;
	max-width: 40%;
	z-index: 1;
	transform: translate(-50%);
}

.device-video-wrap::before,
.dotted-bg::before {
	content: "";
	position: absolute;
	display: block;
	top: 40%;
	left: 35%;
	width: 110%;
	height: 120%;
	background-size: 12px 12px;
	background-position: center;
	transform: translate(-50%, -50%);
	background-image: radial-gradient(#3D80E4 14%, transparent 14%);
	-webkit-mask-image: radial-gradient(rgba(0,0,0,1),rgba(0,0,0,0) 75%);
	mask-image: radial-gradient(rgba(0,0,0,1),rgba(0,0,0,0) 75%);
	z-index: 0;
}

.dotted-bg::before { background-image: radial-gradient(rgba(255, 255, 255, 0.2) 14%, transparent 14%); }
.dotted-bg.dotted-bg-dark::before { background-image: radial-gradient(rgba(4, 4, 4, 0.2) 14%, transparent 14%); }

.device-video-wrap > * {
	position: relative;
	z-index: 1;
}

.feature-box.fbox-plain .fbox-icon i { font-size: 36px; }

.testimonial .flexslider .slider-wrap img {
	display: block;
	width: auto;
	margin: 0 auto;
	max-height: 80px;
	margin-bottom: 30px;
}

.testimonial .testi-content p {
	font-size: 28px;
	font-weight: 500;
	font-style: normal;
	line-height: 1.5 !important;
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
}

.dark .testimonial .testi-content p { color: #FFF; }
.dark .testimonial .testi-meta span { color: rgba(255, 255, 255, .5); }

.flex-prev,
.flex-next {
	width: 45px;
	height: 45px;
	border-radius: 50%;
}

.dark .flex-prev,
.dark .flex-next { background-color: #FFF !important; }

.flex-next i,
.flex-prev i {
	font-size: 24px;
	height: 45px;
	line-height: 45px;
	color: #111;
	text-shadow: none;
}

.flex-next i { margin-left: 2px; }
.flex-prev i { margin-left: -1px; }

.skills li {
	height: 12px;
	border-radius: 10px;
}

.skills li .progress { border-radius: 10px; }

.skills li .progress-percent {
	top: -38px;
	right: -60px;
	padding: 5px 10px;
	text-align: center;
	color: #FFF;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.24);
	height: auto;
	z-index: 2;
	font-size: 17px;
	line-height: 16px;
	text-shadow: none;
}

.text-nowrap {
	width: 600px;
	position: relative;
	z-index: 2;
	background-color: #FFF;
	transform: translateX(6%);
	padding: 0 20px 10px;
}

/* Responsive Device less than 992px (.device-md <)
-----------------------------------------------------------------*/
@media (max-width: 991.98px) {

	.display-3 {
		font-size: 7vw;
	}

	.slide-imgs .iphone-img {
		-webkit-transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.85) translateX(20%) translateY(0%) !important;
		transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.85) translateX(20%) translateY(0%) !important;
	}

	.slider-element { padding-top: 30px; }

	.section-features { padding: 60px }

	.testimonial .testi-content p { font-size: 20px; }

	.testimonial .testi-content p { max-width: 600px; }

	.sub-menu-container:not(.mega-menu-column),
	.mega-menu-content {
		border-radius: 0;
		margin-top: 0;
	}

	.dark .menu-container > .menu-item > .menu-link,
	.dark .sub-menu-container .menu-item > .menu-link { color: #FFF; }

	.text-nowrap {
		width: 100%;
		position: relative;
		z-index: 2;
		transform: none;
		padding: 0;
	}

}

/* Responsive Device less than 768px (.device-sm <)
-----------------------------------------------------------------*/
@media (max-width:767.98px) {

	.section-clients {
		position: relative;
		bottom: auto;
	}

	.testimonial .testi-content p { max-width: 300px; }

}
/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* ── Primary nav text style — restored from the live production
     site's own custom.css (fetched from aioncalls.com directly for
     comparison). The theme's default nav text is uppercase, bold,
     letter-spaced — production overrides it to normal-case, lighter
     weight, no letter-spacing, which is what actually keeps every
     nav item (incl. "AIonChats Live" and "Industries We Serve") on
     one line at normal padding. This block replaces earlier
     speculative padding/width hacks that were band-aids for the
     wrong root cause. ── */
#header {
  --cnvs-primary-menu-padding-x: 20px;
  --cnvs-primary-menu-font-size: 1rem;
  --cnvs-primary-menu-tt: none;
  --cnvs-primary-menu-ls: 0;
  --cnvs-primary-menu-font-weight: 500;
  --cnvs-primary-menu-font: var(--cnvs-body-font);
  --cnvs-primary-menu-submenu-font-weight: 400;
  --cnvs-primary-menu-submenu-hover-font-weight: 500;
  --cnvs-primary-menu-submenu-tt: none;
  --cnvs-primary-menu-submenu-font-size: 15px;
  --cnvs-primary-menu-submenu-color: #666;
  --cnvs-primary-menu-submenu-hover-bg: transparent;
}
.is-expanded-menu .menu-container > .menu-item {
  --cnvs-primary-menu-hover-color: #FFF !important;
  --cnvs-primary-menu-active-color: #FFF !important;
}
.sub-menu-container .menu-item > .menu-link i {
  margin-right: 15px;
  color: var(--cnvs-themecolor, #3D80E4);
  font-size: 18px;
}

/* ── Hero/header overlap fix (index_new.html only, structurally):
     that page's #wrapper stays open around the entire body instead
     of closing right after </header> like every other page and
     production do — so its hero picks up the theme's ".include-header"
     negative top margin (meant to tuck the hero behind a TRANSPARENT
     header) against our SOLID header, and paints over its top edge.
     Cancel the negative margin whenever the header isn't transparent. ── */
.is-expanded-menu #header:not(.transparent-header) + .include-header {
  margin-top: 0 !important;
}

/* ── Sitewide header/hero overlap fix: `.sticky-header #header-wrap`
     is `position: fixed` from page load (not just after scrolling),
     so its parent `#wrapper` collapses to near-zero height. The very
     next element — every hero section using `.include-header` — then
     starts at the true top of the page and renders UNDER the fixed
     header instead of below it. `.include-header` is meant for a
     TRANSPARENT header (nav text overlaid on the hero image), but
     every page here uses a solid header, so the fixed bar visually
     covers/overlaps the top of the hero content (badge, heading).
     Push every such hero down by the real rendered header height
     instead — applies to every page sharing this markup pattern
     (`#wrapper` closing right after `</header>`, hero as its very
     next sibling), so this one rule fixes it everywhere at once. ── */
#wrapper + .slider-element.include-header {
  padding-top: var(--cnvs-header-height, 100px) !important;
}

/* ── Keep "Get Started" on the same row as the nav (additive, does
     NOT touch the nav-text-style block above). Our nav has more items
     than production's (we added "AIonChats Live" + the nested
     "Industries We Serve" groups), so #logo and .header-misc — both
     forced into a fixed 16.67% grid column (col-lg-2) regardless of
     their actual content size — still leave too little room for the
     button even with the correct compact nav text. Let both size to
     their real content instead, and stop the row from wrapping. ── */
@media (min-width: 992px) {
  #header #logo {
    flex: 0 0 auto;
    width: auto;
    margin-right: 1.5rem;
  }
  #header .header-misc {
    flex: 0 0 auto;
    width: auto;
  }
  #header .header-row {
    flex-wrap: nowrap;
  }
}

/* ── "Industries We Serve" dropdown: AIonCalls and AIonChats shown as
     two side-by-side columns in one panel, both visible immediately —
     not nested flyout submenus needing a second hover.

     IMPORTANT: the theme has a higher-specificity rule —
     ".is-expanded-menu .menu-container > .menu-item:not(.mega-menu)
     .sub-menu-container:not([class*=col-]):not([class=col])" — that
     force-sets width back to its 240px default on ANY submenu whose
     class doesn't contain "col-"/"col". That compound selector beats
     a plain single class on specificity alone, so width (and display,
     to be safe) need !important here to actually win. This is also
     exactly why the layout was rendering as one vertical column
     instead of two side-by-side ones — the panel was silently being
     clamped back to 240px, too narrow for a flex row to show. ── */
.aion-industries-panel {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: 720px !important;
  max-width: 92vw !important;
  padding: 16px 0 !important;
}
.aion-industries-col {
  padding: 0 20px;
  list-style: none;
  min-width: 0;
}
.aion-industries-col.aion-col-calls  { flex: 0 0 34% !important; }
.aion-industries-col.aion-col-chats  { flex: 0 0 66% !important; }
.aion-industries-channels {
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.aion-industries-col + .aion-industries-col {
  border-left: 1px solid rgba(255, 255, 255, .08);
}
.aion-industries-col-title {
  font-family: var(--cnvs-primary-menu-submenu-font, inherit);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--cnvs-themecolor, #3D80E4);
  padding: 4px 10px 12px;
}
.aion-industries-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.aion-industries-list .menu-item {
  border-top: 0 !important;
}
.aion-industries-list .menu-item > .menu-link {
  border-radius: 8px;
  padding-left: 10px !important;
  padding-right: 10px !important;
  transition: background-color .15s ease, color .15s ease;
}
.aion-industries-list .menu-item > .menu-link:hover {
  background-color: rgba(61, 128, 228, .08);
}
/* ── Multi-Agent Workspace's children (Omnichannel Deployment,
     For Agencies) nested directly beneath it, instead of sitting in
     their own grid column — keeps the whole mega-menu to exactly two
     columns (AIonCalls | AIonChats). ── */
.aion-industries-sublist {
  list-style: none;
  margin: 2px 0 6px 14px;
  padding: 0 0 2px 12px;
  border-left: 2px solid rgba(61, 128, 228, .25);
}
.aion-industries-sublist .menu-item > .menu-link {
  font-size: 13px;
  opacity: .82;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.aion-industries-sublist .menu-item > .menu-link:hover {
  opacity: 1;
}

@media (max-width: 991px) {
  .aion-industries-panel {
    display: block !important;
    width: 100% !important;
  }
  .aion-industries-col.aion-col-calls,
  .aion-industries-col.aion-col-chats {
    flex: 1 1 100% !important;
  }
  .aion-industries-col + .aion-industries-col {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .08);
    margin-top: 8px;
    padding-top: 8px;
  }
}
/* ═══════════════════════════════════════════
     PAGE CSS — aclive- namespace
     "AIonChats Live" page + its home-page teaser section.
     Lives in its own folder (static/assets/css/aionchats/)
     per team convention: only new pages reference this file,
     legacy pages are untouched.
     RULES:
       RULE 1  Custom classes  → aclive- prefix
       RULE 2  Keyframes       → aclive- prefix
       RULE 3  Canvas overrides→ scoped to section ID
       RULE 4  No bare names   → never .card / .container
       RULE 5  Responsive      → scoped inside @media
═══════════════════════════════════════════ */

:root {
  --aclive-bg:        #06060f;
  --aclive-surface:   rgba(255,255,255,.03);
  --aclive-border:    rgba(255,255,255,.09);
  --aclive-purple:    #7c3aed;
  --aclive-purplelt:  #9d6bff;
  --aclive-purpled:   rgba(124,58,237,.12);
  --aclive-cyan:      #06b6d4;
  --aclive-green:     #10b981;
  --aclive-amber:     #f59e0b;
  --aclive-white:     #f1f0ff;
  --aclive-muted:     #7b7a9e;
  --ff-head: 'Space Grotesk', sans-serif;
  --ff-body: 'Plus Jakarta Sans', sans-serif;
}

/* ═══ RULE 2 — KEYFRAMES ═══ */
@keyframes aclive-float      { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes aclive-dot-pulse  { 0%,100% { box-shadow: 0 0 0 0 rgba(16,185,129,.5); } 50% { box-shadow: 0 0 0 6px transparent; } }
@keyframes aclive-live-pulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .55; transform: scale(1.3); } }
@keyframes aclive-typing     { 0%,60%,100% { transform: translateY(0); opacity:.4; } 30% { transform: translateY(-4px); opacity: 1; } }
@keyframes aclive-sweep      { 0% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -240; } }
@keyframes aclive-count-glow { 0%,100% { text-shadow: 0 0 0 transparent; } 50% { text-shadow: 0 0 18px currentColor; } }

/* ═══ RULE 1 — 1. HERO ═══ */
#aclive-hero .slider-inner {
  background:
    radial-gradient(ellipse 65% 55% at 72% 40%, rgba(16,185,129,.14) 0%, transparent 60%),
    radial-gradient(ellipse 40% 45% at 12% 78%, rgba(124,58,237,.08) 0%, transparent 55%),
    linear-gradient(160deg, #04040e 0%, #070714 40%, #0a0a1c 100%) !important;
}
.aclive-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 3rem; align-items: center; padding: 90px 0 60px; }
.aclive-live-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--ff-head); font-size: .72rem; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--aclive-green);
  border: 1px solid rgba(16,185,129,.32); background: rgba(16,185,129,.09);
  border-radius: 50px; padding: .45rem 1rem; margin-bottom: 1.5rem;
}
.aclive-live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--aclive-green); position: relative; }
.aclive-live-dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%; background: var(--aclive-green);
  animation: aclive-live-pulse 1.6s infinite;
}
.aclive-hero-h1 { font-family: var(--ff-head); font-weight: 700; font-size: clamp(2.1rem, 4vw, 3.35rem); line-height: 1.12; color: var(--aclive-white); margin-bottom: 1.25rem; }
.aclive-hero-h1 .aclive-grad {
  background: linear-gradient(135deg, var(--aclive-green) 0%, var(--aclive-cyan) 45%, var(--aclive-purplelt) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.aclive-hero-lead { font-family: var(--ff-body); font-size: 1.05rem; line-height: 1.7; color: rgba(241,240,255,.78); max-width: 560px; margin-bottom: 1.75rem; }
.aclive-hero-lead strong { color: var(--aclive-white); font-weight: 600; }

.aclive-trust-badges { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.75rem; }
.aclive-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--ff-body); font-size: .78rem; font-weight: 600;
  padding: .4rem .85rem; border-radius: 50px; border: 1px solid transparent;
}
.aclive-badge.g { color: var(--aclive-green); background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.25); }
.aclive-badge.p { color: var(--aclive-purplelt); background: rgba(124,58,237,.1); border-color: rgba(124,58,237,.28); }
.aclive-badge.c { color: var(--aclive-cyan); background: rgba(6,182,212,.1); border-color: rgba(6,182,212,.25); }

.aclive-btn-p, .aclive-btn-g {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--ff-head); font-size: .88rem; font-weight: 700;
  padding: .85rem 1.85rem; border-radius: 10px; text-decoration: none !important;
  transition: transform .2s, box-shadow .2s, color .2s, background .2s;
}
.aclive-btn-p { background: var(--aclive-green); color: #052014 !important; }
.aclive-btn-p:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(16,185,129,.4); }
.aclive-btn-g { background: transparent; color: var(--aclive-white) !important; border: 1px solid var(--aclive-border); }
.aclive-btn-g:hover { border-color: rgba(157,107,255,.45); background: rgba(124,58,237,.06); }

.aclive-hero-stats { display: flex; gap: 2rem; margin-top: 1.75rem; flex-wrap: wrap; }
.aclive-stat { display: flex; flex-direction: column; }
.aclive-stat-n { font-family: var(--ff-head); font-size: 1.6rem; font-weight: 700; }
.aclive-stat-l { font-family: var(--ff-body); font-size: .74rem; color: var(--aclive-muted); }
.aclive-hero-visual { display: flex; justify-content: center; }

/* ═══ RULE 1 — SHARED SECTION STYLES ═══ */
.aclive-sec { padding: 90px 0; }
.aclive-kicker {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--ff-head); font-size: .68rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: var(--aclive-green);
  border: 1px solid rgba(16,185,129,.28); background: rgba(16,185,129,.08);
  border-radius: 50px; padding: .35rem .9rem; margin-bottom: 1rem;
}
.aclive-kicker-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--aclive-green); }
.aclive-h2 { font-family: var(--ff-head); font-weight: 700; color: var(--aclive-white); font-size: clamp(1.8rem, 3.5vw, 3rem); line-height: 1.15; letter-spacing: -0.02em; margin-bottom: 1rem; }
.aclive-lead { font-family: var(--ff-body); font-weight: 300; color: rgba(241,240,255,.72); line-height: 1.75; font-size: .98rem; }

/* ═══ RULE 1 — FEATURE / DEPLOY STEP CARDS ═══ */
.aclive-card {
  background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  border-radius: 16px; padding: 1.75rem; height: 100%;
  transition: border-color .3s, transform .3s;
}
.aclive-card:hover { border-color: rgba(16,185,129,.38); transform: translateY(-4px); }
.aclive-icon-box {
  width: 50px; height: 50px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: var(--aclive-purpled); border: 1px solid rgba(124,58,237,.25);
  color: var(--aclive-purplelt); font-size: 1.35rem; margin-bottom: 1.1rem;
}
.aclive-card h3 { font-family: var(--ff-head); font-weight: 700; font-size: 1.02rem; color: var(--aclive-white); margin-bottom: .55rem; }
.aclive-card p { font-family: var(--ff-body); font-size: .86rem; color: var(--aclive-muted); line-height: 1.65; margin: 0; }
.aclive-card ul { list-style: none; padding: 0; margin: .75rem 0 0; }
.aclive-card ul li {
  font-family: var(--ff-body); font-size: .82rem; color: rgba(241,240,255,.7);
  padding: .3rem 0 .3rem 1.4rem; position: relative; line-height: 1.5;
}
.aclive-card ul li::before {
  content: "\f26e"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: .3rem;
  color: var(--aclive-green); font-size: .82rem;
}

.aclive-step-card { position: relative; background: var(--aclive-surface); border: 1px solid var(--aclive-border); border-radius: 16px; padding: 1.75rem; height: 100%; }
.aclive-step-num {
  position: absolute; top: -14px; left: 1.5rem; width: 30px; height: 30px; border-radius: 50%;
  background: var(--aclive-green); color: #052014; font-family: var(--ff-head); font-weight: 700; font-size: .85rem;
  display: flex; align-items: center; justify-content: center;
}
.aclive-step-card h3 { font-family: var(--ff-head); font-weight: 700; font-size: 1rem; color: var(--aclive-white); margin: .5rem 0 .5rem; }
.aclive-step-card p { font-family: var(--ff-body); font-size: .85rem; color: var(--aclive-muted); line-height: 1.6; margin: 0; }
.aclive-step-arrow { display: flex; align-items: center; justify-content: center; color: var(--aclive-border); font-size: 1.5rem; }

/* ═══ RULE 1 — DEEP-DIVE TEASER CARDS (link out to Omnichannel / Multi-Agent pages) ═══ */
.aclive-teaser-card {
  background: linear-gradient(135deg, rgba(124,58,237,.07), rgba(6,182,212,.05));
  border: 1px solid var(--aclive-border); border-radius: 18px; padding: 2rem; height: 100%;
  transition: transform .3s, border-color .3s;
}
.aclive-teaser-card:hover { transform: translateY(-4px); border-color: rgba(16,185,129,.35); }
.aclive-teaser-card h3 { font-family: var(--ff-head); font-weight: 700; font-size: 1.2rem; color: var(--aclive-white); margin: 1rem 0 .6rem; }
.aclive-teaser-card p { font-family: var(--ff-body); font-size: .88rem; color: var(--aclive-muted); line-height: 1.7; margin-bottom: 1.1rem; }

/* ═══ RULE 1 — CHAT MOCKUP (shared by hero + proof + home teaser) ═══ */
.aclive-mock-frame {
  background: #0b0b18; border: 1px solid var(--aclive-border); border-radius: 18px;
  max-width: 420px; margin: 0 auto; overflow: hidden; box-shadow: 0 30px 80px rgba(0,0,0,.45);
}
.aclive-mock-topbar { display: flex; align-items: center; gap: 6px; padding: .85rem 1rem; border-bottom: 1px solid var(--aclive-border); background: rgba(255,255,255,.02); }
.aclive-mock-dot { width: 9px; height: 9px; border-radius: 50%; }
.aclive-mock-live { margin-left: auto; display: flex; align-items: center; gap: 5px; font-family: var(--ff-head); font-size: .65rem; font-weight: 700; color: var(--aclive-green); }
.aclive-mock-body { padding: 1.25rem; display: flex; flex-direction: column; gap: .7rem; min-height: 230px; }
.aclive-mock-bubble { max-width: 78%; padding: .65rem .9rem; border-radius: 14px; font-family: var(--ff-body); font-size: .82rem; line-height: 1.5; }
.aclive-mock-bubble.bot { background: rgba(16,185,129,.13); color: var(--aclive-white); align-self: flex-start; border-bottom-left-radius: 4px; }
.aclive-mock-bubble.user { background: rgba(255,255,255,.06); color: rgba(241,240,255,.85); align-self: flex-end; border-bottom-right-radius: 4px; }
.aclive-mock-chips { display: flex; gap: .5rem; flex-wrap: wrap; align-self: flex-start; }
.aclive-mock-chip { font-size: .74rem; font-family: var(--ff-body); color: var(--aclive-purplelt); border: 1px solid rgba(157,107,255,.35); border-radius: 50px; padding: .35rem .8rem; }
.aclive-mock-typing { display: flex; gap: 4px; align-self: flex-start; padding: .5rem .9rem; }
.aclive-mock-typing span { width: 6px; height: 6px; border-radius: 50%; background: var(--aclive-green); animation: aclive-typing 1.4s infinite; }
.aclive-mock-typing span:nth-child(2) { animation-delay: .2s; }
.aclive-mock-typing span:nth-child(3) { animation-delay: .4s; }
.aclive-mock-caption { text-align: center; font-family: var(--ff-body); font-size: .8rem; color: var(--aclive-muted); margin-top: 1.25rem; }

/* ═══ RULE 1 — ANALYTICS PREVIEW ═══ */
.aclive-dash-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--aclive-border); border-radius: 14px; overflow: hidden; border: 1px solid var(--aclive-border); }
.aclive-dash-stat { background: #0b0b18; padding: 1.2rem 1rem; text-align: center; }
.aclive-dash-stat-n { font-family: var(--ff-head); font-weight: 700; font-size: 1.6rem; color: var(--aclive-white); display: block; animation: aclive-count-glow 3s infinite; }
.aclive-dash-stat-l { font-family: var(--ff-body); font-size: .72rem; color: var(--aclive-muted); }

/* ═══ RULE 1 — FAQ ═══ */
.aclive-faq-item { border-bottom: 1px solid var(--aclive-border); padding: 1.1rem 0; }
.aclive-faq-btn {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  width: 100%; background: none; border: none; padding: 0; text-align: left;
  cursor: pointer; font-family: var(--ff-head); font-weight: 600; font-size: .95rem; color: var(--aclive-white);
}
.aclive-faq-icon i { color: var(--aclive-green); transition: transform .3s; flex-shrink: 0; }
.aclive-faq-item.aclive-faq-open .aclive-faq-icon i { transform: rotate(45deg); }
.aclive-faq-answer { overflow: hidden; max-height: 0; transition: max-height .4s cubic-bezier(.4,0,.2,1); }
.aclive-faq-item.aclive-faq-open .aclive-faq-answer { max-height: 400px; }
.aclive-faq-answer-inner { font-family: var(--ff-body); font-size: .87rem; color: var(--aclive-muted); line-height: 1.7; padding-top: .75rem; }

/* ═══ RULE 1 — CONNECTION DIAGRAM (illustration section) ═══ */
.aclive-diagram-wrap { max-width: 760px; margin: 0 auto; }

/* ═══ RULE 1 — VISUAL STACK (channel badges + connector + mock frame,
     fills the hero/teaser right column instead of leaving it blank) ═══ */
.aclive-visual-stack { display: flex; flex-direction: column; align-items: center; width: 100%; }
.aclive-visual-badges {
  display: flex; justify-content: space-between; align-items: center;
  width: 100%; max-width: 300px; margin-bottom: -6px; position: relative; z-index: 2;
}
.aclive-vbadge {
  width: 54px; height: 54px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
  animation: aclive-float 4.5s ease-in-out infinite;
}
.aclive-vbadge:nth-child(2) { animation-delay: .35s; }
.aclive-vbadge:nth-child(3) { animation-delay: .7s; }
.aclive-vbadge:nth-child(4) { animation-delay: 1.05s; }
.aclive-vbadge.web i  { color: #06b6d4; }
.aclive-vbadge.ig i   { color: #E1306C; }
.aclive-vbadge.fb i   { color: #1877F2; }
.aclive-vbadge.wa i   { color: #25D366; }
.aclive-visual-connector { width: 220px; height: auto; margin: 0 auto; position: relative; z-index: 1; }
.aclive-visual-stack .aclive-mock-frame { margin-top: -4px; }

/* ═══ RULE 1 — TRUST STRIP (real images: avatars + flags) ═══ */
.aclive-trust-strip {
  display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap;
  background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  border-radius: 16px; padding: 1.25rem 1.5rem; margin-top: 2rem;
}
.aclive-trust-avatars { display: flex; align-items: center; }
.aclive-trust-avatars img {
  width: 40px; height: 40px; border-radius: 50%; object-fit: cover;
  border: 2px solid #0b0b18; margin-left: -10px;
}
.aclive-trust-avatars img:first-child { margin-left: 0; }
.aclive-trust-flags { display: flex; align-items: center; gap: 6px; }
.aclive-trust-flags img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; }
.aclive-trust-text { font-family: var(--ff-body); font-size: .85rem; color: rgba(241,240,255,.8); }
.aclive-trust-text strong { color: var(--aclive-white); font-family: var(--ff-head); }

/* ═══ RULE 1 — CHANNEL INTEGRATION PILLS (reused: hero, home teaser, feature card) ═══ */
.aclive-channel-row { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1.5rem 0; }
.aclive-channel-row.sm { gap: .5rem; margin: .9rem 0 0; }
.aclive-channel-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  border-radius: 50px; padding: .55rem 1.1rem;
  font-family: var(--ff-body); font-size: .8rem; font-weight: 600; color: rgba(241,240,255,.85);
  transition: transform .25s, border-color .25s;
}
.aclive-channel-row.sm .aclive-channel-pill { padding: .35rem .8rem; font-size: .72rem; }
.aclive-channel-pill:hover { transform: translateY(-2px); }
.aclive-channel-pill i { font-size: 1.05rem; }
.aclive-channel-pill .aclive-status {
  font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  padding: .15rem .5rem; border-radius: 50px; margin-left: 2px;
}
.aclive-channel-pill .aclive-status.live { color: var(--aclive-green); background: rgba(16,185,129,.14); }
.aclive-channel-pill .aclive-status.beta { color: var(--aclive-amber); background: rgba(245,158,11,.14); }
.aclive-channel-pill .aclive-status.soon { color: var(--aclive-muted); background: rgba(255,255,255,.06); }
.aclive-channel-pill.website i   { color: #06b6d4; }
.aclive-channel-pill.facebook i  { color: #1877F2; }
.aclive-channel-pill.instagram i { color: #E1306C; }
.aclive-channel-pill.whatsapp i  { color: #25D366; }
.aclive-channel-pill.whatsapp { opacity: .6; }

/* ═══ RULE 1 — MINI ANALYTICS CARD + ICON DATA TILES
     (home page teaser right column, below the mock frame) ═══ */
.aclive-analytics-card {
  background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  border-radius: 16px; padding: 1.25rem 1.25rem .5rem; margin-top: 1.5rem;
}
.aclive-analytics-title {
  display: flex; align-items: center; gap: 7px;
  font-family: var(--ff-head); font-size: .8rem; font-weight: 700; color: var(--aclive-white);
  margin-bottom: .5rem;
}
.aclive-analytics-title i { color: var(--aclive-green); }
.aclive-analytics-svg { width: 100%; height: auto; display: block; }
.aclive-analytics-caption {
  text-align: center; font-family: var(--ff-body); font-size: .68rem; color: var(--aclive-muted);
  padding-bottom: .5rem;
}

.aclive-data-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: 1.25rem; }
.aclive-data-tile {
  display: flex; align-items: center; gap: .7rem;
  background: var(--aclive-surface); border: 1px solid var(--aclive-border);
  border-radius: 12px; padding: .85rem .95rem;
  transition: transform .25s, border-color .25s;
}
.aclive-data-tile:hover { transform: translateY(-2px); border-color: rgba(16,185,129,.35); }
.aclive-data-tile .aclive-icon-box { width: 38px; height: 38px; font-size: 1.05rem; margin-bottom: 0; flex-shrink: 0; }
.aclive-data-num { font-family: var(--ff-head); font-weight: 700; font-size: 1.1rem; color: var(--aclive-white); display: block; line-height: 1.15; }
.aclive-data-label { font-family: var(--ff-body); font-size: .68rem; color: var(--aclive-muted); }

/* ═══ RULE 1 — HOME PAGE TEASER SECTION (#aionchats-teaser) ═══ */
#aionchats-teaser { background: linear-gradient(180deg, transparent, rgba(16,185,129,.03) 30%, transparent); }
.aclive-home-badges { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.25rem 0 1.75rem; }
.aclive-home-checklist { list-style: none; padding: 0; margin: 1.25rem 0; display: flex; flex-direction: column; gap: .6rem; }
.aclive-home-checklist li {
  display: flex; align-items: flex-start; gap: 10px;
  font-family: var(--ff-body); font-size: .88rem; color: rgba(241,240,255,.82); line-height: 1.6;
}
.aclive-home-checklist li i { color: var(--aclive-green); margin-top: 3px; flex-shrink: 0; }

/* ═══ RULE 5 — RESPONSIVE ═══
     Every custom aclive- component covered explicitly, not just the
     hero, so nothing overflows/clips/hides on real mobile widths. ═══ */
@media (max-width: 991px) {
  .aclive-hero-grid { grid-template-columns: 1fr; padding: 60px 0 50px; gap: 2rem; }
  .aclive-hero-visual { order: -1; max-width: 340px; margin: 0 auto; width: 100%; }
  .aclive-dash-stats { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  .aclive-sec { padding: 55px 0; }
  .aclive-h2 { font-size: clamp(1.4rem, 6vw, 1.9rem); }
  .aclive-step-arrow { transform: rotate(90deg); margin: -0.5rem auto; }
  .aclive-hero-stats { gap: 1.1rem 1.5rem; }
  .aclive-card, .aclive-step-card, .aclive-teaser-card { padding: 1.35rem; }
  .aclive-dash-stats { grid-template-columns: 1fr 1fr; }
  .aclive-dash-stat { padding: 1rem .6rem; }
  .aclive-dash-stat-n { font-size: 1.3rem; }
  .aclive-mock-body { min-height: 0; }
  .aclive-channel-row { gap: .5rem; }
  .aclive-channel-pill { padding: .45rem .85rem; font-size: .74rem; }
  .aclive-trust-strip { flex-direction: column; align-items: flex-start; gap: .8rem; padding: 1.1rem; }
  .aclive-vbadge { width: 46px; height: 46px; font-size: 1.2rem; }
  .aclive-visual-badges { max-width: 260px; }
  .aclive-visual-connector { width: 190px; }
  .aclive-data-grid { grid-template-columns: 1fr; }
  .aclive-analytics-card { padding: 1rem 1rem .4rem; }
}

@media (max-width: 575px) {
  .aclive-trust-badges, .aclive-home-badges { gap: .4rem; }
  .aclive-mock-frame { max-width: 100%; width: 100%; }
  .aclive-hero-visual { max-width: 100%; }
  .aclive-hero-stats { gap: .9rem 1.25rem; }
  .aclive-stat-n { font-size: 1.3rem; }
  .aclive-channel-row { flex-direction: column; align-items: flex-start; }
  .aclive-channel-pill { width: 100%; box-sizing: border-box; }
  .aclive-dash-stats { grid-template-columns: 1fr; }
  .aclive-btn-p, .aclive-btn-g { width: 100%; justify-content: center; padding: .8rem 1.2rem; }
  .aclive-icon-box { width: 44px; height: 44px; font-size: 1.15rem; }
  .aclive-faq-btn { font-size: .88rem; }
  .aclive-live-badge { font-size: .66rem; }
}

/* Belt-and-braces: prevent any fixed-width custom component from
   forcing horizontal scroll on very narrow viewports. */
@media (max-width: 420px) {
  .aclive-hero-h1 { font-size: clamp(1.7rem, 9vw, 2.1rem); }
  .aclive-mock-bubble { max-width: 88%; font-size: .78rem; }
}
