/*****************************************************************
    Template Name    : Cyberguard - Cyber Security Services HTML5 Resposive Website Template
    Author           : Barakah Themes
    Version          : 1.0
    Created          : 2025
    File Description : Main css file of the template
*****************************************************************/

/*****************************************************************

** - 01 - Default CSS
** - 02 - Preloader Section CSS
** - 03 - Navbar Section CSS
** - 04 - Home Section CSS
** - 05 - About Section CSS
** - 06 - Services Section CSS
** - 07 - Services Details CSS
** - 08 - Choose Section CSS
** - 09 - Overview Section CSS
** - 10 - Features Section CSS
** - 11 - Counter Section CSS
** - 12 - Portfolio Section CSS
** - 13 - Portfolio Details CSS
** - 14 - Team Section CSS
** - 15 - Testimonial Section CSS
** - 16 - Hire Section CSS
** - 17 - Price Section CSS
** - 18 - Faq Section CSS
** - 19 - Blog Section CSS
** - 20 - Blog Details CSS
** - 21 - Partner Section CSS
** - 22 - Other Page Banner Title CSS
** - 23 - Contact Page CSS
** - 24 - Coming Soon Page CSS
** - 25 - 404 Error Page CSS
** - 26 - Terms & Conditions
** - 27 - Privacy Policy CSS
** - 28 - Footer & Copyright Section CSS

*****************************************************************/

/**************************************
 ** - 01 - Default CSS
 **************************************/
*, *:before, *:after {
  box-sizing: border-box;
}

* {
  scroll-behavior: inherit !important;
}

html, body {
  height: auto;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  box-sizing: border-box;
}

body {
	padding: 0;
	margin: 0;
	font-size: 16px;
	font-family: 'Kumbh Sans', sans-serif;
}

img {
	max-width: 100%;
	height: auto;
	border-radius: 3px;
}

button {
	outline: 0 !important;
}

dl, ol, ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.d-table {
	width: 100%;
	height: 100%;
}

.d-table-cell {
	vertical-align: middle;
}

.ptb-100 {
	padding-top: 100px;
	padding-bottom: 100px;
}

.pb-20 {
	padding-bottom: 20px;
}
.pb-30 {
	padding-bottom: 30px;
}
.pb-40 {
	padding-bottom: 40px;
}
.pb-50 {
	padding-bottom: 50px;
}
.pb-60 {
	padding-bottom: 60px;
}
.pb-70 {
	padding-bottom: 70px;
}
.pb-80 {
	padding-bottom: 80px;
}
.pb-90 {
	padding-bottom: 90px;
}

.pb-100 {
	padding-bottom: 100px;
}

.pt-20 {
	padding-top: 20px;
}
.pt-30 {
	padding-top: 30px;
}
.pt-40 {
	padding-top: 40px;
}
.pt-50 {
	padding-top: 50px;
}
.pt-60 {
	padding-top: 60px;
}
.pt-70 {
	padding-top: 70px;
}
.pt-80 {
	padding-top: 80px;
}
.pt-90 {
	padding-top: 90px;
}
.pt-100 {
	padding-top: 100px;
}

.mt-20 {
	margin-top: 20px;
}
.mt-30 {
	margin-top: 30px;
}
.mt-40 {
	margin-top: 40px;
}
.mt-50 {
	margin-top: 50px;
}
.mt-60 {
	margin-top: 60px;
}
.mt-70 {
	margin-top: 70px;
}
.mt-80 {
	margin-top: 80px;
}
.mt-90 {
	margin-top: 90px;
}
.mt-100 {
	margin-top: 100px;
}

.mt-20 {
	margin-bottom: 20px;
}
.mt-30 {
	margin-bottom: 30px;
}
.mb-40 {
	margin-bottom: 40px;
}
.mb-50 {
	margin-bottom: 50px;
}
.mb-60 {
	margin-bottom: 60px;
}
.mb-70 {
	margin-bottom: 70px;
}
.mb-80 {
	margin-bottom: 80px;
}
.mb-90 {
	margin-bottom: 90px;
}
.mb-100 {
	margin-bottom: 100px;
}

.bg-grey {
	background-color: #f8f8fe;
}

.section-padding {
	padding: 100px 0;
}

a {
	text-decoration: none;
	-webkit-transition: 0.4s !important;
	transition: 0.4s !important;
	outline: 0 !important;
	color: #505060;
}

a:hover {
	text-decoration: none;
	color: #f44336 ;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-weight: 600;
	line-height: 1.4;
	font-family: 'Kumbh Sans', sans-serif;
}

p {
	font-size: 16px;
	line-height: 1.8;
	color: #5f5f5f;
	margin-bottom: 15px;
	font-weight: 400;
	font-family: 'Kumbh Sans', sans-serif;
}

p:last-child {
	margin-bottom: 0;
}

.default-btn {
	border: none;
	position: relative;
	display: inline-block;
	text-align: center;
	overflow: hidden;
	z-index: 1;
	color: #ffffff;
	background-color: #f44336 ;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 50px;
	font-weight: 600;
	font-size: 16px;
	padding-left: 33px;
	padding-right: 33px;
	padding-top: 13px;
	padding-bottom: 13px;
}

.default-btn span {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	background-color: #ffc107;
	-webkit-transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
	transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: -1;
	border-radius: 30px;
}

.default-btn:hover, .default-btn:focus {
	color: #ffffff;
}

.default-btn:hover span, .default-btn:focus span {
	width: 225%;
	height: 562.5px;
}

.default-btn-one {
	border: none;
	position: relative;
	display: inline-block;
	text-align: center;
	overflow: hidden;
	z-index: 1;
	color: #f44336 ;
	background-color: #ffffff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 50px;
	font-weight: 600;
	font-size: 16px;
	padding-left: 33px;
	padding-right: 33px;
	padding-top: 13px;
	padding-bottom: 13px;
	margin-top: 5px;
	margin-right: 20px;
	box-shadow: 0 7px 25px rgb(123,104,238,0.25);
}

.default-btn-one span {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	background-color: #ffc107;
	-webkit-transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
	transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: -1;
	border-radius: 30px;
}

.default-btn-one:hover, .default-btn-one:focus {
	color: #ffffff;
}

.default-btn-one:hover span, .default-btn-one:focus span {
	width: 225%;
	height: 562.5px;
}

.btn-style-four {
	position: relative;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    padding-left: 15px;
}
.btn-style-four:before {
    position: absolute;
    content: '';
    width: 7px;
    height: 7px;
    left: 0px;
    top: 16px;
    border-radius: 50%;
    transition: all 500ms ease;
}
.btn-style-four:before{
	background: #f44336 ;
}

.btn-style-four{
	color: #2d275e;
}

.btn-style-four span{
	font-size: 23px;
	padding-left: 5px;
}
.btn-style-four:hover{
	color: #f44336  !important;
}


.section-title {
	text-align: center;
	margin-bottom: 65px;
	line-height: 1.5;
}

.section-title h6 {
	position: relative;
	z-index: 1;
	color: #f44336 ;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
	display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.section-title h6:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    bottom: 2px;
    height: 8px;
    background-color: rgb(255, 193, 7, 0.5);
}

.section-title h2 {
	color: #505060;
	font-size: 38px;
	font-weight: 700;
	margin: 0 0 0 0;
}

.color-text {
    color: #f44336 ;
	background: linear-gradient(90deg, #f44336, #ffffff, #ffcc31);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.valign {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

/* [ Start Overlay ] */
[data-overlay-dark],
[data-overlay-light] {
	position: relative;
}

[data-overlay-dark] .container,
[data-overlay-light] .container {
	position: relative;
	z-index: 2;
}

[data-overlay-dark]:before,
[data-overlay-light]:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
}

[data-overlay-dark]:before {
	background: #02050b;
}

[data-overlay-light]:before {
	background: #fff;
}

[data-overlay-dark] h1,
[data-overlay-dark] h2,
[data-overlay-dark] h3,
[data-overlay-dark] h4,
[data-overlay-dark] h5,
[data-overlay-dark] h6,
[data-overlay-dark] span,
.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-dark span,
.bg-color h1,
.bg-color h2,
.bg-color h3,
.bg-color h4,
.bg-color h5,
.bg-color h6,
.bg-color span {
	color: #fff;
}

[data-overlay-dark] p,
.bg-dark p,
.bg-color p {
	color: #dad6d6;
}

[data-overlay-dark="0"]:before,
[data-overlay-light="0"]:before {
	opacity: 0;
}

[data-overlay-dark="1"]:before,
[data-overlay-light="1"]:before {
	opacity: .1;
}

[data-overlay-dark="2"]:before,
[data-overlay-light="2"]:before {
	opacity: .2;
}

[data-overlay-dark="3"]:before,
[data-overlay-light="3"]:before {
	opacity: .3;
}

[data-overlay-dark="4"]:before,
[data-overlay-light="4"]:before {
	opacity: .4;
}

[data-overlay-dark="5"]:before,
[data-overlay-light="5"]:before {
	opacity: .5;
}

[data-overlay-dark="6"]:before,
[data-overlay-light="6"]:before {
	opacity: .6;
}

[data-overlay-dark="7"]:before,
[data-overlay-light="7"]:before {
	opacity: .7;
}

[data-overlay-dark="8"]:before,
[data-overlay-light="8"]:before {
	opacity: .8;
}

[data-overlay-dark="9"]:before,
[data-overlay-light="9"]:before,
[data-overlay-color="9"]:before {
	opacity: .9;
}

[data-overlay-dark="10"]:before,
[data-overlay-light="10"]:before {
	opacity: 1;
}

/* [ End Overlay ] */
/*
 .... - - .--. ... ---... -..-. -..-. .-- .-- .-- .-.-.- - . -- .--. .-.. .- - . -- --- -. ... - . .-. .-.-.- -.-. --- -- -..-. .- ..- - .... --- .-. ... -..-. -... .- .-. .- -.- .- .... - .... . -- . ... -..-.
*/

/*****************************************
 ** - 00 -  Go Top CSS
 ******************************************/
.go-top {
	position: fixed;
	cursor: pointer;
	top: 0;
	right: 15px;
	color: #ffffff;
	background-color: #f44336 ;
	text-align: center;
	z-index: 4;
	width: 45px;
	height: 45px;
	line-height: 45px;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: .9s;
	transition: .9s;
	border-radius: 3px;
}

.go-top.active {
	top: 97%;
	-webkit-transform: translateY(-98%);
	transform: translateY(-98%);
	opacity: 1;
	visibility: visible;
}

.go-top i {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.go-top i:last-child {
	opacity: 0;
	visibility: hidden;
	top: 60%;
}

.go-top::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	background: #505060;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 3px;
}

.go-top:hover, .go-top:focus {
	color: #ffffff;
}

.go-top:hover::before, .go-top:focus::before {
	opacity: 1;
	visibility: visible;
}

.go-top:hover i:first-child, .go-top:focus i:first-child {
	opacity: 0;
	top: 0;
	visibility: hidden;
}

.go-top:hover i:last-child, .go-top:focus i:last-child {
	opacity: 1;
	visibility: visible;
	top: 50%;
}

/**************************************
 ** - 02 - Preloader Section CSS
 **************************************/
.preloader {
    position: fixed;
    z-index: 999999;
    background-color: #ffffff;
    width: 100%;
    height: 100%;
    text-align: center;
    left: 0;
    right: 0;
}
.preloader .lds-spinner {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.preloader .lds-spinner div {
    -webkit-transform-origin: 40px 40px;
    transform-origin: 40px 40px;
    -webkit-animation: lds-spinner 1.2s linear infinite;
    animation: lds-spinner 1.2s linear infinite;
}
.preloader .lds-spinner div::after {
    content: " ";
    display: block;
    position: absolute;
    top: 5px;
    left: 35px;
    width: 5px;
    height: 20px;
    border-radius: 20%;
    background: #f44336 ;
}
.preloader .lds-spinner div:nth-child(1){
    -webkit-transform:rotate(0deg);
    transform:rotate(0deg);
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s
}
.preloader .lds-spinner div:nth-child(2){
    -webkit-transform:rotate(30deg);
    transform:rotate(30deg);
    -webkit-animation-delay:-1s;
    animation-delay:-1s
}
.preloader .lds-spinner div:nth-child(3){
    -webkit-transform:rotate(60deg);
    transform:rotate(60deg);
    -webkit-animation-delay:-.9s;
    animation-delay:-.9s
}
.preloader .lds-spinner div:nth-child(4){
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
    -webkit-animation-delay:-.8s;
    animation-delay:-.8s
}
.preloader .lds-spinner div:nth-child(5){
    -webkit-transform:rotate(120deg);
    transform:rotate(120deg);
    -webkit-animation-delay:-.7s;
    animation-delay:-.7s
}
.preloader .lds-spinner div:nth-child(6){
    -webkit-transform:rotate(150deg);
    transform:rotate(150deg);
    -webkit-animation-delay:-.6s;
    animation-delay:-.6s
}
.preloader .lds-spinner div:nth-child(7){
    -webkit-transform:rotate(180deg);
    transform:rotate(180deg);
    -webkit-animation-delay:-.5s;
    animation-delay:-.5s
}
.preloader .lds-spinner div:nth-child(8){
    -webkit-transform:rotate(210deg);
    transform:rotate(210deg);
    -webkit-animation-delay:-.4s;
    animation-delay:-.4s
}
.preloader .lds-spinner div:nth-child(9){
    -webkit-transform:rotate(240deg);
    transform:rotate(240deg);
    -webkit-animation-delay:-.3s;
    animation-delay:-.3s
}
.preloader .lds-spinner div:nth-child(10){
    -webkit-transform:rotate(270deg);
    transform:rotate(270deg);
    -webkit-animation-delay:-.2s;
    animation-delay:-.2s
}
.preloader .lds-spinner div:nth-child(11){
    -webkit-transform:rotate(300deg);
    transform:rotate(300deg);
    -webkit-animation-delay:-.1s;
    animation-delay:-.1s
}
.preloader .lds-spinner div:nth-child(12){
    -webkit-transform:rotate(330deg);
    transform:rotate(330deg);
    -webkit-animation-delay:0s;
    animation-delay:0s
}
@-webkit-keyframes lds-spinner{
    0%{
        opacity:1
    }
    100%{
        opacity:0
    }
}
@keyframes lds-spinner{
    0%{
        opacity:1
    }
    100%{
        opacity:0
    }
}

/**************************************
 ** - 03 - Navbar Section CSS
 **************************************/
.cyberguard-responsive-nav {
	display: none;
}

.cyberguard-nav {
	background-color: transparent;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-right: 0;
	padding-left: 0;
}

.cyberguard-nav .navbar {
	padding-right: 0;
	padding-top: 0;
	padding-left: 0;
	padding-bottom: 0;
}

.cyberguard-nav .navbar ul {
	padding-left: 0;
	list-style-type: none;
	margin-bottom: 0;
}

.cyberguard-nav .navbar .navbar-nav {
	margin: auto;
}

.cyberguard-nav .navbar .navbar-nav .nav-item {
	position: relative;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 0;
	padding-right: 0;
}

.cyberguard-nav.index-navber .navbar .navbar-nav .nav-item a {
	color: #555;
}
.cyberguard-nav .navbar .navbar-nav .nav-item a {
	font-size: 16.5px;
	font-weight: 600;
	color: #fff;
	text-transform: capitalize;
	padding-left: 0;
	padding-right: 0;
	padding-top: 0;
	padding-bottom: 0;
	margin-left: 15px;
	margin-right: 15px;
}
/*
.cyberguard-nav .navbar .navbar-nav .nav-item a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item a.active {
	color: #f44336 ;
}
*/
.cyberguard-nav .navbar .navbar-nav .nav-item a i {
	font-size: 10px;
	position: relative;
	top: -1px;
	margin-left: 1px;
}

.cyberguard-nav .navbar .navbar-nav .nav-item:last-child a {
	margin-right: 0;
}

.cyberguard-nav .navbar .navbar-nav .nav-item:first-child a {
	margin-left: 0;
}
/*
.cyberguard-nav .navbar .navbar-nav .nav-item:hover a, .cyberguard-nav .navbar .navbar-nav .nav-item:focus a, .cyberguard-nav .navbar .navbar-nav .nav-item.active a {
	color: #f44336 ;
}
*/
.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu {
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	background: #ffffff;
	position: absolute;
	border: none;
	top: 80px;
	left: 0;
	width: 230px;
	z-index: 99;
	display: block;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
    overflow: hidden;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	padding: 0px;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li {
	padding: 0;
	border-bottom: 1px solid #f1f1f1;
}
.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li:last-child {
	border-bottom: 0px solid transparent;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
	text-transform: capitalize;
	padding: 10px 15px;
	margin: 0;
	position: relative;
	color: #505060;
	font-size: 15px;
	font-weight: 600;
	border-left: 3px solid transparent;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active {
	color: #f44336 ;
	background: #f8f8f8;
	padding-left: 20px;
	border-left: 3px solid #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu {
	left: -245px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a {
	color: #696997;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu {
	left: -245px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
	color: #696997;
	text-transform: capitalize;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
	left: -245px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
	color: #696997;
	text-transform: capitalize;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
	left: 195px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
	color: #696997;
	text-transform: capitalize;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
	left: 195px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
	color: #696997;
	text-transform: capitalize;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
	left: 195px;
	top: 0;
	opacity: 0;
	visibility: hidden;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
	color: #696997;
	text-transform: capitalize;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li.active a {
	color: #f44336 ;
}

.cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: 100%;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.cyberguard-nav .navbar .other-option {
	margin-left: 0;
	margin-top: 5px;
}

.cyberguard-nav .navbar .other-option .default-btn {
    font-size: 16px;
	box-shadow: 0 2px 15px rgb(123, 104, 238, 0.15);
}

.cyberguard-nav .navbar .other-option .default-btn.nav-btn-1 {
	margin-right: 15px;
}

.cyberguard-nav .black-logo {
	display: none;
}

.navbar-area {
	background-color: transparent;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	position: absolute;
	z-index: 999;
	left: 0;
	top: 0;
	width: 100%;
	height: auto;
}

.navbar-area.is-sticky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	-webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
	box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
	background: #ffffff !important;
	-webkit-animation: 500ms ease-in-out 0s normal fadeInDown;
	animation: 500ms ease-in-out 0s normal fadeInDown;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.navbar-area.is-sticky .navbar-nav .nav-item a {
	color: #505050;
}

.navbar-area.is-sticky .navbar-nav .nav-item a:hover, .navbar-area.is-sticky .navbar-nav .nav-item a:focus, .navbar-area.is-sticky .navbar-nav .nav-item a.active {
	color: #f44336 ;
}

.navbar-area.is-sticky .cyberguard-nav .navbar-brand .white-logo {
	display: none;
}

.navbar-area.is-sticky .cyberguard-nav .navbar-brand .black-logo {
	display: block;
}

@media only screen and (max-width: 991px) {
	.navbar-area {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.navbar-area.is-sticky {
		border-bottom: none;
		-webkit-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
		box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.navbar-area.is-sticky .logo .white-logo {
		display: none;
	}

	.navbar-area.is-sticky .logo .black-logo {
		display: block;
	}

	.cyberguard-responsive-nav {
		display: block;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu {
		position: relative;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .mean-nav ul {
		font-size: 15px;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .mean-nav ul li a {
		font-size: 15px;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .mean-nav ul li a.active {
		color: #f44336 ;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .mean-nav ul li li a {
		font-size: 15px;
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .navbar-nav {
		overflow-y: scroll;
		height: 270px;
		-webkit-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
		box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
	}

	.cyberguard-responsive-nav .cyberguard-responsive-menu.mean-container .others-options {
		display: none;
	}

	.cyberguard-responsive-nav.index-navber-responsive .mean-container a.meanmenu-reveal {
		color: #505060;
	}

	.cyberguard-responsive-nav .mean-container a.meanmenu-reveal {
		color: #505060;
	}

	.cyberguard-responsive-nav .mean-container a.meanmenu-reveal span {
		background: #505060;
	}

	.cyberguard-responsive-nav .logo {
		position: relative;
		width: 50%;
		z-index: 999;
	}

	.cyberguard-responsive-nav .logo .white-logo {
		display: block;
	}

	.cyberguard-responsive-nav .logo .black-logo {
		display: none;
	}

	.cyberguard-nav {
		display: none;
	}
}

/**************************************
 ** - 04 - Home Section CSS
 **************************************/
.home-area {
	overflow: hidden;
	position: relative;
	z-index: 1;
	height: 720px;
	min-height: 100vh;
	background: url(../img/home-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.home-area:before {
    content: "";
    position: absolute;
	z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
	opacity: 0.97;
	background-color: #182850;
	background: linear-gradient(-90deg, transparent, rgb(12, 50, 70) 70%);
}


.grey-cr {
    height: 500px;
    width: 500px;
    border-radius: 500px;
    position: absolute;
    bottom: -20%;
    left: -10%;
	z-index: -1;
    background: rgb(215, 215, 215, 0.17);
}
.main-banner-content {
	padding-top: 100px;
}

.main-banner-content h6 {
	color: #fff;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.main-banner-content h1 {
	color: #fff;
	font-size: 50px;
	font-weight: 700;
	margin: 0 0 20px 0;
}

.main-banner-content p {
	color: #fff;
	font-size: 16px;
	margin: 0 0 0 0;
}

.main-banner-content .banner-btn {
	margin-top: 25px;
}

.home-area .banner-image {
    text-align: center;
    padding-top: 70px;
}

.home-area .creative-shape {
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: auto;
    z-index: -1;
}

/**************************************
 ** - 04.2 - Home Slider Section CSS
 **************************************/
.home2-slider-section {
	position: relative;
	z-index: 1;
	
}
.single-slider-item {
	position: relative;
	z-index: 1;
	display: flex;
    align-items: center;
    height: 800px;
    min-height: 100vh;
    background-image: url(../img/slider-1.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 100px;
}
.single-slider-item:before {
    content: "";
    position: absolute;
	z-index: -1;
    top: 0;
    left: 0;
    right: 0;
	bottom: 0;
    width: 100%;
    height: 100%;
	opacity: 0.7;
	background-color: #10184c;
}

.single-slider-item.bg-1 {
    background-image: url(../img/slider-1.jpg);
}
.single-slider-item.bg-2 {
    background-image: url(../img/slider-2.jpg);
}
.single-slider-item.bg-3 {
    background-image: url(../img/slider-3.jpg);
}

.slider-content {
    position: relative;
    z-index: 1;
    max-width: 700px;
}

.slider-content h1 {
    color: #ffffff;
    font-size: 60px;
    font-weight: 700;
    margin-bottom: 15px;
}

.slider-content p {
    color: #ffffff;
	font-size: 16px;
    line-height: 1.8;
    margin-bottom: 0;
}

.slider-content .banner-btn {
    padding: 0;
    margin-top: 30px;
    margin-bottom: 0
}

.slider-container.owl-theme .owl-nav {
    margin-top: 0;
    position: absolute;
    right: 3%;
    top: 45%;
    -webkit-transform: translateY(-45%) translateX(-3%);
    transform: translateY(-45%) translateX(-3%)
}

.slider-container.owl-theme .owl-nav [class*=owl-] {
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: 20px;
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 5px;
    background-color: rgb(255, 255, 255, 0.2);
    border: 0;
    margin: 15px 0;
    -webkit-transition: .5s;
    transition: .5s;
}

.slider-container.owl-theme .owl-nav [class*=owl-]:hover {
    background-color: #f44336 ;
}

.slider-container.owl-theme .owl-dots {
    margin-top: 0;
    position: absolute;
    left: 50%;
    bottom: 10px;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
}

.slider-container.owl-theme .owl-dots .owl-dot.active span {
    width: 20px;
    height: 7px;
    background-color: #ffbf00 !important;
    -webkit-box-shadow: 0 1px 5px rgb(255, 193, 7, 0.5);
    box-shadow: 0 1px 5px rgb(255, 193, 7, 0.5);
    transition: .3s;
}
.slider-container.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 7px;
    display: block;
    margin: 5px 5px;
    background-color: #ffffff;
    border: 2px solid transparent;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 3px;
    transition: .3s;
}

.slider-container.owl-theme .owl-dots .owl-dot:hover span {
	border: 2px solid #ffffff;
	background-color: transparent;
	transition: .3s;
}

.slider-container.owl-theme .owl-dots .owl-dot.active:hover span {
	border: 2px solid #ffbf00;
	background-color: transparent !important;
	transition: .3s;
}

.slider-content .social-icon-list li {
    display: inline-block;
    margin: 5px 5px;
}

.slider-content .social-icon-list li a {
    color: #fff !important;
    font-size: 18px !important;
    width: 40px;
    height: 40px;
    line-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border: 1px solid rgb(255, 255, 255, 0.2);
    background-color: rgb(255, 255, 255, 0.3);
    -webkit-transition: all .3s;
    transition: all .3s;
}

.slider-content .social-icon-list li a:hover {
    color: #fff;
    border: 1px solid #f44336 ;
    background-color: #f44336 ;
}

.slider-content .social-icon-list {
    margin-bottom: 20px;
}

/**************************************
 ** - 05 - About Section CSS
 **************************************/
.about-section {
	position: relative;
	z-index: 1;
}
.about-content {
    margin-left: 0px;
}

.about-content h6 {
	color: #f44336 ;
	font-size: 15px;
	font-weight: 700;
	margin-bottom: 10px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.about-content h2 {
	font-size: 40px;
	font-weight: 700;
	margin-bottom: 20px;
}

.about-content p {
	margin-bottom: 25px;
}
.about-content .about-btn {
    margin-top: 30px;
}

.about-content .about-feature-list {
}

.about-content .about-feature-list li {
	color: #404040;
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 15px;
    padding: 25px 25px;
    border-radius: 10px;
    background-color: #eff2ff;
    display: flex;
    align-items: center;
	max-width: 500px;
}

.about-content .about-feature-list li:last-child {
    margin-bottom: 0px;
}

.about-content .about-feature-list i {
	color: #fff;
    font-size: 14px;
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    margin-right: 12px;
    background-color: #f44336 ;
    border-left: 1px solid rgb(0, 0, 0, 0.1);
    border-radius: 10px;
    text-align: center;
}

.about-us-image{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 25px;
	margin-right: 20px;
}

.about-image-box{
	width: calc(50% - 15px);
}

.about-img-2{
	margin-bottom: 25px;
}

.about-img-1 figure,
.about-img-2 figure,
.about-img-3 figure{
	display: block;
	border-radius: 15px;
	margin: 0;
}

.about-img-1 img,
.about-img-2 img,
.about-img-3 img{
	width: 100%;
	object-fit: cover;
	border-radius: 15px;
}

.about-img-1 img{
	aspect-ratio: 1 / 1.91;
}

.about-img-2 img,
.about-img-3 img{
	aspect-ratio: 1 / 1.07;
}

/**************************************
 ** - 06 - Services Section CSS
 **************************************/
.services-section .section-title {
	margin-bottom: 35px;
}

.single-services-item {
	position: relative;
	z-index: 1;
	display: block;
	padding: 40px 35px;
	text-align: left;
	border-radius: 12px;
	background-color: #ffffff;
	margin-top: 30px;
	overflow: hidden;
	-webkit-box-shadow: 0px 2px 25px 0px rgb(110, 110, 110, 0.12);
    -moz-box-shadow: 0px 2px 25px 0px rgb(110, 110, 110, 0.12);
    box-shadow: 0px 2px 25px 0px rgb(110, 110, 110, 0.12);
    -webkit-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
/*
.single-services-item:before {
    content: "";
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 50%;
    opacity: 0.5;
    background-image: url(../img/shape.png);
    background-repeat: no-repeat;
}
*/
.single-services-item:after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: auto;
	left: 0;
	right: 0;
	height: 0;
	border-radius: 10px;
    background-color: #f44336;
	-moz-transition: ease all 0.45s;
	-o-transition: ease all 0.45s;
	-webkit-transition: ease all 0.45s;
	transition: ease all 0.45s;
}

.single-services-item:hover:after {
	bottom: 0;
	top: auto;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}

/*
.single-services-item::before {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: 0;
    right: 0;
    width: 70%;
    height: 3px;
    margin: 0 auto;
    border-radius: 5px;
    background-color: #f44336 ;
    background-image: linear-gradient(-135deg, #611bdd 0%, #f44336  100%);
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
}
.single-services-item:hover::before {
    width: 100%;
    height: 100%;
}
*/

.services-icon {
	position: relative;
	z-index: 1;
	width: 85px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 15px;
    border-radius: 20px;
	background-color: transparent;
    margin-bottom: 25px;
}
/*
.single-services-item:hover .services-icon {
    padding: 8px 15px;
    border-radius: 15px;
	background-color: #ffffff;
}
*/
.single-services-item:hover .services-icon img {
    filter: brightness(0) invert(1);
}


.services-icon img {
	-moz-transition: ease all 0.45s;
	-o-transition: ease all 0.45s;
	-webkit-transition: ease all 0.45s;
	transition: ease all 0.45s;
}

.single-services-item h3 {
	font-size: 20px;
    font-weight: 700;
	margin-bottom: 0;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
}

.single-services-item h3 a {
	display: inline-block;
}

.single-services-item p {
	font-size: 16px;
	margin-top: 15px;
	margin-bottom: 0;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
    will-change: transform;
}

.single-services-item .services-btn-link {
    margin-top: 20px;
    display: flex;
    align-items: center;
}

.single-services-item .services-btn-link .services-link {
    display: inline-block;
    font-size: 16px;
    color: #f44336 ;
    font-weight: 600;
	display: flex;
    align-items: center;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
}

.single-services-item .services-btn-link .services-link i {
    color: #f44336;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
}

.single-services-item:hover {
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}
/*
.single-services-item:hover .services-icon {
    background: #fff;
}
*/
.single-services-item:hover h3 {
	color: #fff;
}
.single-services-item:hover p {
	color: #fff;
}
.single-services-item:hover .services-btn-link .services-link {
	color: #fff;
}
.single-services-item:hover .services-btn-link .services-link i {
	color: #fff;
}

/************************************************
 ** - 07 - Services Details CSS
 ************************************************/
.services-details-image {
	text-align: center;
    margin-bottom: 40px;
}
.services-details-image img {
    border-radius: 5px;
}

.services-details-content h3 {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 15px;
}
.services-details-content .features-text {
    margin-top: 20px;
}

.services-details-content .features-text h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
}

.services-details-content .features-text .service-features-list {
    margin-bottom: 25px;
}

.services-details-content .features-text .service-features-list li {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.services-details-content .features-text .service-features-list li:last-child {
    margin-bottom: 0px;
}

.services-details-content .features-text .service-features-list i {
    color: #ffffff;
    font-size: 10px;
    height: 20px;
    width: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 5px;
    display: inline-block;
    margin-right: 10px;
    background-color: #f44336 ;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
}

.services-widget .widget {
	padding: 30px 25px;
	margin-top: 35px;
    border-radius: 5px;
	background-color: rgb(11, 11, 49, 0.05);
}

.services-widget .widget:first-child {
	margin-top: 0;
}

.services-widget .widget .widget-title {
	position: relative;
	font-size: 22px;
	font-weight: 700;
	padding-bottom: 10px;
	margin-bottom: 30px;
	text-transform: capitalize;
	border-bottom: 1px solid #ffffff;
}

.services-widget .widget .widget-title::before {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 50px;
	height: 1px;
	background-color: #f44336 ;
}

.services-widget .widget_categories ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.services-widget .widget_categories ul li {
	position: relative;
	color: #747576;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 12px;
}

.services-widget .widget_categories ul li:last-child {
	margin-bottom: 0;
}


.services-widget .widget_categories ul li a {
	color: #ffffff;
	font-size: 16px;
	font-weight: 600;
    padding: 12px 15px;
    display: block;
    border-radius: 5px;
    background-color: #f44336 ;
    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}

.services-widget .widget_categories ul li a:hover {
	color: #ffffff;
    background-color: #ffc107;
}
.widget_download_btn a {
    padding: 12px 20px;
    display: block;
    border-radius: 5px;
}
.widget_download_btn a:first-child {
    margin: 0 0 12px;
}

/**************************************
 ** - 08 - Choose Section CSS
 **************************************/
.choose-images {
	position: relative;
	z-index: 1;
	text-align: center;
    margin-right: 30px;
    border-radius: 12px;
    overflow: hidden;
}
.choose-content-info h6 {
    color: #f44336 ;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.choose-content-info h2 {
    font-size: 38px;
	font-weight: 700;
    margin-bottom: 35px;
}

.choose-feature-box {
    margin-top: 25px;
}
.choose-content-2 .choose-feature-box {
    margin-top: 0px;
}

.choose-content .choose-single-feature {
	position: relative;
    padding: 0;
    margin-bottom: 30px;
}
.choose-content-2 .choose-single-feature {
    margin-bottom: 45px;
}

.choose-single-feature:last-child {
	margin-bottom: 0px;
}
.choose-features-icon {
    position: absolute;
    z-index: 1;
	left: 0;
	top: 0;
    text-align: center;
    border-radius: 5px;
    border: 0;
}

.choose-features-icon img {
	width: 85px;
    height: 85px;
	padding: 12px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-bottom: 25px;
	border-radius: 12px;
	background-color: #ffffff;
	-webkit-box-shadow: -1px 2px 10px 0px rgb(0, 0, 0, 0.1);
	box-shadow: -1px 2px 10px 0px rgb(0, 0, 0, 0.1);
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.choose-features-info {
    padding-left: 110px;
}

.choose-features-info p {
    margin: 0;
}

.choose-features-info h3 {
    font-size: 20px;
	margin-bottom: 10px;
}

.overlay-video-play-btn {
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: inline-block;
}

.popup-video{
    display: inline-block;
}
.popup-video:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 100px;
    height: 100px;
	background-color: #ffffff;
    border-radius: 50%;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
}
.popup-video i {
    position: relative;
    z-index: 9;
    color: #2196f3;
    font-size: 22px;
    width: 80px;
    height: 80px;
	padding-left: 3px;
    border-radius: 100%;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
}


@-webkit-keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

/**************************************
 ** - 09 - Overview Section CSS
 **************************************/
.overview-content h6 {
    color: #f44336 ;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.overview-content h2 {
	color: #505060;
	font-size: 38px;
	font-weight: 700;
	margin: 8px 0 15px 0;
}

.overview-content p {
	margin: 0 0 0 0;
}

.overview-content .features-list {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding-left: 0;
	list-style-type: none;
	margin-bottom: 0;
	margin-top: 16px;
	margin-left: -10px;
	margin-right: -10px;
}

.overview-content .features-list li {
	-ms-flex: 0 0 50%;
	-webkit-box-flex: 0;
	flex: 0 0 50%;
	max-width: 50%;
	margin-top: 25px;
	padding-left: 10px;
	padding-right: 10px;
	display: flex;
	align-items: center;
}

.overview-content .features-list li i {
    color: #f44336 ;
    font-size: 18px;
    margin-right: 8px;
}
.overview-image {
	text-align: center;
	border-radius: 12px;
	overflow: hidden;
}

/**************************************
 ** - 10 - Feature Section CSS
 **************************************/
.feature-single-item {
    position: relative;
	z-index: 1;
    padding: 40px 30px;
	text-align: left;
    border-radius: 12px;
    background-color: #ffffff;
	-webkit-box-shadow: 0px 10px 57px 0px rgba(0, 0, 0, 0.08);
	box-shadow: 0px 10px 57px 0px rgba(0, 0, 0, 0.08);
    transition: all .4s ease;
	margin-bottom: 30px;
}
.feature-single-item:hover {
    transform: translate(0, -10px);
}
.feature-single-item h3 {
	color: #0b0b31;
    font-size: 20px;
    margin-bottom: 15px;
}
.feature-single-item img {
	width: 70px;
	margin: auto;
	margin-bottom: 25px;
}

.feature-btn-box .read-more {
    display: flex;
    align-items: center;
    justify-content: center;
}

/**************************************
 ** - 11 - Counter Section CSS
 **************************************/
.counter-area {
	text-align: center;
	position: relative;
	z-index: 1;
	color: #fff;
	text-align: center;
	background: url(../img/banner-bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}
.counter-area::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	opacity: 0.6;
	background-color: #10184c;
}
.counter-area .section-title h5 {
	color: #ffffff;
}
.counter-area .section-title h2 {
	color: #fff;
}
.single-counter {
    padding: 30px 0;
}

.counter-contents h2 {
	color: #fff;
	font-size: 45px;
	font-weight: 700;
	margin-bottom: 5px;
	word-spacing: -10px;
}
.counter-contents h3 {
	color: #fff;
	font-size: 18px;
	font-weight: 600;
}

/**************************************
 ** - 12 - Portfolio Section CSS
 **************************************/
.portfolio-section {
	position: relative;
}
.portfolio-section .section-title {
    margin-bottom: 35px;
}

.portfolio-item {
	position: relative;
	display: block;
    border-radius: 12px;
	overflow: hidden;
    background-color: #fff;
	box-shadow: 0px 5px 15px 0px rgba(56, 81, 120, 0.10);
	margin-top: 30px;
}
.portfolio-item .portfolio-img {
	position: relative;
	z-index: 1;
	overflow: hidden;
    border-radius: 5px;
}

.portfolio-item .portfolio-img:before {
	content: '';
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	bottom: 0;
    height: 45%;
	border-radius: 5px;
	background-color: #000000;
	background: linear-gradient(to top, rgb(4, 40, 92), transparent);
    background-image: linear-gradient(0deg, rgb(4, 40, 92), transparent);
    transition: height .5s ease-in-out;
    will-change: transition;
}
.portfolio-item:hover .portfolio-img:before {
    height: 70%;
}

.portfolio-item .portfolio-img img {
	width: 100%;
    border-radius: 5px;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
.portfolio-item:hover .portfolio-img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.portfolio-item .portfolio-content-info {
	padding: 25px 25px;
}
.portfolio-item .portfolio-content-info p {
    color: #f44336 ;
    font-size: 15px;
    font-weight: 700;
    -webkit-transition: all .4s;
    transition: all .4s;
    margin-bottom: 0;
}
.portfolio-item .portfolio-content-info h3 {
    color: #1b1b1b;
    font-size: 20px;
    font-weight: 700;
    -webkit-transition: all .4s;
    transition: all .4s;
    margin-top: 8px;
    margin-bottom: 20px;
}
.portfolio-item .portfolio-content-info .portfolio-link-icon {
    color: #fff;
    text-align: center;
    display: inline-block;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 700;
    border-radius: 10px 30px 30px 10px;
    overflow: hidden;
    background-color: #ffc107;
}

.portfolio-item .portfolio-content-info .portfolio-link-icon i {
    font-size: 20px;
    display: flex;
	align-items: center;
    margin-left: 0px;
}

.portfolio-item .portfolio-content-info .portfolio-link-icon:hover {
    color: #fff;
    background-color: #f44336 ;
}

/*****************************************
 ** - 13 - Portfolio Details CSS
 *****************************************/
.portfolio-details-image {
	text-align: center;
	margin-bottom: 45px;
	border-radius: 12px;
	overflow: hidden;
}
.portfolio-details-desc h2 {
	margin-bottom: 20px;
    font-size: 35px;
    font-weight: 700;
}

.portfolio-details-desc h3 {
	margin-bottom: 13px;
	font-size: 25px;
}

.portfolio-details-desc .features-text {
	margin-top: 25px;
	margin-bottom: 25px;
}

.portfolio-details-desc .features-text h4 {
	margin-bottom: 12px;
	font-size: 20px;
	font-weight: 600;
}

.portfolio-details-desc .features-text h4 i {
	font-size: 16px;
	margin-right: 4px;
	color: #f44336 ;
}

.portfolio-details-desc .portfolio-details-info {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
	margin-top: 35px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box {
	-ms-flex: 0 0 20%;
	-webkit-box-flex: 0;
	flex: 0 0 20%;
	max-width: 20%;
	padding-left: 15px;
	padding-right: 15px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box h4 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 15px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box span {
	display: block;
	color: #333;
	font-size: 16px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box .social {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.portfolio-details-desc .portfolio-details-info .single-info-box .social li {
	display: inline-block;
	margin-right: 8px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box .social li a {
	color: #f44336 ;
	display: inline-block;
	background: transparent;
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	border: 1px dashed #f44336 ;
	border-radius: 25px;
}

.portfolio-details-desc .portfolio-details-info .single-info-box .social li a:hover {
	color: #fff;
	background-color: #f44336 ;
}

.portfolio-details-desc .portfolio-details-info .single-info-box .default-btn {
	padding: 10px 30px;
}

/**************************************
 ** - 14 - Team Section CSS
 **************************************/
.team-area {
}

.team-area .section-title {
	margin-bottom: 35px;
}
.single-team-box {
	margin-top: 30px;
	overflow: hidden;
    background-color: #fff;
    border-radius: 12px;
	-webkit-box-shadow: 0px 2px 30px 0px rgb(82, 90, 101, 0.1);
	box-shadow: 0px 2px 30px 0px rgb(82, 90, 101, 0.1);
	-webkit-transition: 0.5s;
	transition: 0.5s;
}
.team-image {
	position: relative;
    z-index: 1;
    border-radius: 5px;
    overflow: hidden;
    margin: 0 auto;
}

.team-image::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    background-color: #000;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}
.single-team-box:hover .team-image::before {
    opacity: .8;
    visibility: visible;
}

.single-team-box .team-image img {
	width: 100%;
	height: auto;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}

.single-team-box:hover .team-image img {
	-webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.team-social-icon {
	margin-top: 15px;
	text-align: center;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}
.single-team-box:hover .team-social-icon {
    bottom: 20px;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}

.team-social-icon a {
    margin: 5px;
    color: #f44336 ;
	font-size: 16px;
	display: inline-block;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
	will-change: transform;
}
.team-social-icon a i {
	color: #f44336 ;
    font-size: 18px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid #f44336 ;
    background-color: transparent;
    display: block;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.team-social-icon a i:hover {
    color: #fff;
    border: 1px solid #f44336 ;
    background: #f44336 ;
}

.team-info {
    padding: 20px 15px 20px;
    text-align: center;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
.team-info h3 {
	color: #333;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 5px;
}
.team-info span {
	color: #f44336 ;
	font-size: 16px;
	font-weight: 500;
	display: block;
}

/**************************************
 ** - 15 - Testimonial Section CSS
 **************************************/
.testimonial-section {
	position: relative;
	z-index: 1;
	text-align: center;
}

.single-testimonial {
	position: relative;
	background: #eff2ff;
	padding: 30px 25px;
	border-radius: 12px;
}

.single-testimonial .testimonial-content {
	margin-bottom: 25px;
	text-align: center;
}

.single-testimonial .rating-box {
	margin-bottom: 10px;
}
.rating-box ul li {
	display: inline-block;
	margin-right: 0px;
}

.rating-box ul li i {
	color: #ffce39;
	font-size: 16px;
}

.single-testimonial .testimonial-content p {
	font-size: 16px;
	color: #333;
	font-style: italic;
	line-height: 1.8;
	letter-spacing: 1px;
}

.single-testimonial .avatar {
	margin: 0 auto;
	margin-bottom: 15px;
}

.single-testimonial .avatar img {
	border-radius: 50%;
	border: 5px solid #f8f8f8;
	width: 90px;
	margin: 0 auto;
}

.single-testimonial .testimonial-bio {
	text-align: center;
}

.single-testimonial .testimonial-bio .bio-info h3 {
	color: #333;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 5px;
}

.single-testimonial .testimonial-bio .bio-info span {
	color: #f44336 ;
	font-size: 16px;
	font-weight: 500;
}

.testimonial-slider.owl-theme .owl-nav {
	opacity: 0;
	visibility: hidden;
	margin-top: 0;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.testimonial-slider.owl-theme .owl-nav [class*=owl-] {
	position: absolute;
	left: 10px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	margin: 0;
	padding: 0;
	background-color: #fff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	color: #333;
	font-size: 18px;
	width: 50px;
	height: 45px;
	line-height: 50px;
}

.testimonial-slider.owl-theme .owl-nav [class*=owl-].owl-next {
	left: auto;
	right: 10px;
}

.testimonial-slider.owl-theme .owl-nav [class*=owl-]:hover {
	color: #f44336 ;
	background-color: transparent;
}

.testimonial-slider.owl-theme .owl-dots {
	line-height: .01;
	margin-top: 30px;
	margin-bottom: 0;
}

.testimonial-slider.owl-theme .owl-dots .owl-dot span {
	width: 10px;
	height: 10px;
	margin: 0 4px;
	background-color: #fff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	border-radius: 30px;
}

.testimonial-slider.owl-theme .owl-dots .owl-dot:hover span {
	background-color: #f44336 ;
}

.testimonial-slider.owl-theme .owl-dots .owl-dot.active span {
	background-color: #f44336 ;
}

.testimonial-slider.owl-theme:hover .owl-nav {
	opacity: 1;
	visibility: visible;
}

/**********************************************
 ** - 15.2 - Testimonial Two Section CSS
 **********************************************/
.testimonial-design-two {
	position: relative;
	z-index: 1;
}

.testimonial-design-two .section-title {
    margin-bottom: 30px;
}

.testimonial-design-two .owl-stage-outer {
	margin: 0 -8px;
	padding-left: 8px;
	padding-top: .35rem;
}
.single-testimonial-two .testimonial-two-content {
    display: block;
    margin: 0px 15px;
}
.testimonial-two-content .testimonial-text {
	position: relative;
    display: block;
    background: #fff;
    padding: 45px 30px 40px 30px;
    margin: 40px 0px;
    box-shadow: 0 10px 35px 15px #ededf1;
    border-radius: 5px;
}
.testimonial-two-content .testimonial-text:after {
	position: absolute;
    content: '';
    background: #ffffff;
    width: 50px;
    height: 50px;
    left: 25px;
    bottom: -20px;
    transform: rotate(-45deg);
}
.testimonial-two-content .testimonial-text .logo-box {
    display: inline-block;
    margin-bottom: 10px;
}

.testimonial-two-content .testimonial-text p {
}

.testimonial-two-content .testimonial-text .rating-box {
	margin-top: 15px;
}

.testimonial-two-content .testimonial-text .rating-box ul li {
	display: inline-block;
}

.testimonial-two-content .testimonial-text .rating-box ul li i {
	color: #ffce39;
	font-size: 16px;
}
.testimonial-two-content .author-info-box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: row;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    text-align: left;
	padding: 20px 0px;
	margin-left: 10px;
}

.testimonial-two-content .author-info-box .author-img img {
    border-radius: 50%;
    border: 5px solid #fff;
    width: 90px;
    margin: 0 auto;
	-webkit-box-shadow: 0 3px 15px rgba(218, 225, 232, 0.85);
	box-shadow: 0 3px 15px rgba(218, 225, 232, 0.85);
}
.testimonial-two-content .author-info-box .author-img {
	margin-right: 18px;
}
.testimonial-two-content .author-info-box h3 {
    color: #333;
    font-size: 18px;
    font-weight: 600;
    margin-top: 0;
}

.testimonial-two-content .author-info-box span {
	color: #f44336 ;
    font-size: 16px;
    font-weight: 500;
}

/* owl theme */

.owl-theme .owl-nav.disabled+.owl-dots {
	margin-top: 20px;
}
.owl-theme .owl-dots .owl-dot span {
	width: 7px;
	height: 7px;
	margin: 5px 5px;
	background-color: rgba(0, 0, 0, 0.1);
	display: block;
	-webkit-backface-visibility: visible;
	transition: opacity .2s ease;
	border-radius: 3px;
	transition: .3s;
	border: 2px solid transparent;
}
.owl-theme .owl-dots .owl-dot.active span {
	background-color: #5764ec !important;
	width: 7px;
	height: 7px;
	transition: .3s;
	-webkit-box-shadow: 0 1px 5px #5764ec;
	box-shadow: 0 1px 5px #5764ec;
}
.owl-theme .owl-dots .owl-dot:hover span {
	background-color: transparent;
	border: 2px solid #5764ec;
	transition: .3s;
}

/**************************************
 ** - 16 - Hire Section CSS
 **************************************/
.hire-section {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 100px 0;
	background-image: url(../img/banner-bg.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.hire-section::before {
	content: "";
	position: absolute;
    z-index: -1;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	opacity: 0.6;
	background-color: #10184c;
}

.hire-content h6 {
	font-size: 16px;
	font-weight: 600;
	color: #f44336 ;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.hire-content h2 {
	font-size: 38px;
	color: #fff;
	margin: 0;
	font-weight: 700;
}

.hire-content p {
	color: #fff;
	font-size: 16px;
	margin: 20px 0 0 0;
}

.hire-content .hire-btn {
	margin-top: 20px;
}

.hire-content .hire-btn .default-btn {
    margin-right: 15px;
}

/**************************************
 ** - 17 - Price Section CSS
 **************************************/
.price-area {
}
.price-area .section-title {
    text-align: center;
    margin-bottom: 35px;
}
.single-price-item {
	margin-top: 30px;
}

.single-price-item-details {
	position: relative;
    z-index: 1;
	padding: 10px 25px;
	background-color: #ffffff;
	box-shadow: 0 3px 30px -3px rgba(0, 0, 0, 0.1);
	border-radius: 12px;
	overflow: hidden;
}

.single-price-item-details:after {
	content: "";
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 30%;
    opacity: 1;
    background-image: url(../img/pricing-shape.png);
    background-repeat: no-repeat;
}
/*
.single-price-item-details:hover {
    transform: translate3d(0, -5px, 0);
    -webkit-transform: translate3d(0, -5px, 0);
    -webkit-box-shadow: 0 10px 40px rgba(0,0,0,.1);
    box-shadow: 0 10px 40px rgba(0,0,0,.1);
}
*/

.single-price-item .pricing-header {
	display: block;
	position: relative;
	padding: 40px 15px;
	text-align: center;
	border-bottom: 1px solid #f1f1f1;
}

.single-price-item .pricing-header .pricing-title {
	color: #404040;
	font-size: 33px;
	font-weight: 700;
}

.single-price-item .pricing-body {
	margin-bottom: 30px;
}

.single-price-item .pricing-body .price-content {
	text-align: center;
	margin: 15px 0;
	margin-bottom: 10px;
}


.single-price-item .pricing-body .price-content .price {
	color: #f44336 ;
	font-size: 38px;
	font-weight: 700;
}

.single-price-item .pricing-body .price-content .period {
	color: #333;
	font-size: 15px;
	font-weight: 700;
}

.single-price-item .pricing-body .list {
	text-align: left;
}

.single-price-item .pricing-body .list li {
	color: #404040;
	font-size: 16px;
	margin-bottom: 12px;
}
.single-price-item .pricing-body .list li p {
	color: #404040;
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 12px;
}
.single-price-item .pricing-body .list li i {
    color: #ffc107;
    font-size: 15px;
    margin-right: 3px;
}

.single-price-item .pricing-btn-box {
	text-align: center;
    margin-top: 0;
    margin-bottom: 20px;
}

.single-price-item .pricing-btn-box a {
}

.pricing-recommended-plan {
    padding: 8px;
    text-align: center;
	border-radius: 10px;
    background-color: #f44336 ;
    background-image: linear-gradient(360deg, #f44336  0%, #ffc107 100%);
	overflow: hidden;
}

.pricing-recommended-plan h5 {
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
	padding-bottom: 8px;
    display: inline-block;
    margin: 0;
}

/**********************************
 ** - 18 - Faq Section CSS
 **********************************/
.faq-accordion .accordion {
	list-style-type: none;
	padding: 0;
	margin: 0;
	padding-left: 0;
	margin-bottom: 0;
	position: relative;
}

.faq-accordion .accordion .accordion-item {
	display: block;
	border: 0;
    margin-bottom: 0px;
    border-bottom: 1px solid rgb(231 231 231);
}

.faq-accordion .accordion .accordion-item:last-child {
	margin-bottom: 0;
}

.faq-accordion .accordion .accordion-item .accordion-title {
    color: #333;
    position: relative;
    font-size: 18px;
    font-weight: 600;
    display: block;
    padding: 25px 0;
    background-color: transparent;
    border-radius: 0;
    cursor: pointer;
}

.faq-accordion .accordion .accordion-item .accordion-title:hover {
    color: #f44336 ;
}
.faq-accordion .accordion .accordion-item .active.accordion-title {
    color: #f44336 ;
}

.faq-accordion .accordion .accordion-item .accordion-title i {
	position: absolute;
	right: 15px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	color: #333;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	font-size: 15px;
}

.faq-accordion .accordion .accordion-item .active.accordion-title i {
	color: #f44336 ;
}

.faq-accordion .accordion .accordion-item .accordion-title.active i::before {
	content: "\f0d8";
}

.faq-accordion .accordion .accordion-item .accordion-content {
	display: none;
    color: #fff;
    font-size: 15px;
    padding-bottom: 20px;
    margin-bottom: 0;
    padding: 20px 20px;
    background: #f44336 ;
    border-radius: 10px;
}

.faq-accordion .accordion .accordion-item .accordion-content.show {
	display: block;
}

.faq-section.home-faq .section-title {
    text-align: left;
    line-height: 1.5;
    margin-bottom: 35px;
}

.home-faq .faq-accordion .accordion .accordion-item {
	display: block;
	border: 0;
	margin-bottom: 15px;
	background-color: transparent;
	position: relative;
}

.home-faq .faq-accordion .accordion .accordion-item .accordion-title {
	position: relative;
    color: #333;
    font-size: 18px;
    font-weight: 600;
    display: block;
    padding: 12px 20px;
    border-radius: 10px;
    padding-right: 25px;
    border-left: 0px solid #ffc107;
    border-bottom: 0px solid #c1c1c1;
    cursor: pointer;
    background-color: #e1e1ff;
	margin-bottom: 10px;
}

.home-faq .faq-accordion .accordion .accordion-item .active.accordion-title {
    color: #ffffff;
    background-color: #f44336 ;
    background-image: linear-gradient(90deg, #f44336  0%, #ffc107 100%);
}
.home-faq .faq-accordion .accordion .accordion-item .active.accordion-title i {
    color: #ffffff;
}
.faq-img {
	text-align: center;
    border-radius: 12px;
    overflow: hidden;
    margin-right: 30px;
}
.home-faq .faq-accordion .accordion .accordion-item .accordion-content {
    color: #404040;
    font-size: 15px;
    padding-bottom: 20px;
    margin-bottom: 0;
    padding: 20px 20px;
    background-color: #ffffff;
    border-radius: 10px;
}

/**************************************
 ** - 19 - Blog Section CSS
 **************************************/
.blog-single-item {
	border-radius: 12px;
	overflow: hidden;
	background-color: #ffffff;
	position: relative;
	margin-bottom: 30px;
	-webkit-box-shadow: 0px 2px 30px 0px rgb(82, 90, 101, 0.1);
	box-shadow: 0px 2px 30px 0px rgb(82, 90, 101, 0.1);
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.blog-single-item .blog-description {
	border-top: none;
	text-align: left;
	padding: 25px 25px;
}

.blog-single-item .blog-description .blog-list {
	padding-left: 0;
	margin-bottom: 10px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.blog-single-item .blog-description .blog-list li {
	list-style-type: none;
	display: inline-block;
	font-size: 16px;
	font-weight: 500;
	margin-right: 15px;
	color: #f44336 ;
}

.blog-single-item .blog-description .blog-list li:last-child {
	margin-right: 0;
}

.blog-single-item .blog-description .blog-list li i {
	margin-right: 3px;
	position: relative;
	top: -1px;
}

.blog-single-item .blog-description .blog-list li i::before {
	font-size: 16px;
}

.blog-single-item .blog-description .blog-list a {
	color: #f44336 ;
	text-decoration: none;
}

.blog-single-item .blog-description .blog-content {
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.blog-single-item .blog-description .blog-content h3 {
	color: #505060;
	font-size: 18px;
	margin-bottom: 15px;
	line-height: 25px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	line-height: 32px;
	font-weight: 600;
	display: inline-block;
}

.blog-single-item .blog-description .blog-content h3:hover {
	color: #f44336 ;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	text-decoration: none;
}

.blog-single-item .blog-description .blog-content p {
	margin: 0;
	font-size: 16px;
	color: #6a6c72;
}

.blog-single-item .blog-description .blog-content a {
	text-decoration: none;
}

.blog-single-item .blog-description .blog-content .blog-btn {
	margin-top: 20px;
}

.blog-single-item:hover .blog-content h3 {
	color: #f44336 ;
}

/************************************************
 ** - 19 - Blog Page Number Pagination CSS
 ************************************************/
.pagination-area {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
	margin-top: 20px;
}

.pagination-area .page-numbers {
    color: #f44336 ;
    font-size: 18px;
    font-weight: 600;
    width: 45px;
    height: 45px;
    margin: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: 1px solid #f44336 ;
    border-radius: 8px;
}

.pagination-area .page-numbers.current, .pagination-area .page-numbers:hover, .pagination-area .page-numbers:focus {
	background: #f44336 ;
	color: #ffffff;
	-webkit-box-shadow: 0 2px 10px 0 #d8dde6;
	box-shadow: 0 2px 10px 0 #d8dde6;
}

/**************************************
 ** - 20 - Blog Details CSS
 **************************************/
.blog-details-desc .article-content {
	margin-top: 30px;
}

.blog-details-desc .article-content .entry-meta {
	margin-bottom: -8px;
}

.blog-details-desc .article-content .entry-meta ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.blog-details-desc .article-content .entry-meta ul li {
	position: relative;
	display: inline-block;
	color: #505060;
	margin-right: 21px;
}

.blog-details-desc .article-content .entry-meta ul li span {
	display: inline-block;
	color: #505060;
	font-weight: 500;
}

.blog-details-desc .article-content .entry-meta ul li a {
	display: inline-block;
	color: #5f5f5f;
}

.blog-details-desc .article-content .entry-meta ul li a:hover {
	color: #f44336 ;
}

.blog-details-desc .article-content .entry-meta ul li i {
	color: #f44336 ;
	margin-right: 2px;
}

.blog-details-desc .article-content .entry-meta ul li::before {
	content: '';
	position: absolute;
	top: 12px;
	right: -15px;
	width: 6px;
	height: 1px;
	background: #f44336 ;
}

.blog-details-desc .article-content .entry-meta ul li:last-child {
	margin-right: 0;
}

.blog-details-desc .article-content .entry-meta ul li:last-child::before {
	display: none;
}

.blog-details-desc .article-content h3 {
	margin-bottom: 15px;
	margin-top: 25px;
	font-size: 24px;
}

.blog-details-desc .article-content .wp-block-gallery.columns-3 {
	padding-left: 0;
	list-style-type: none;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -10px;
	margin-left: -10px;
	margin-bottom: 30px;
	margin-top: 30px;
}

.blog-details-desc .article-content .wp-block-gallery.columns-3 li {
	-ms-flex: 0 50%;
	-webkit-box-flex: 0;
	flex: 0 50%;
	max-width: 50%;
	padding-right: 10px;
	padding-left: 10px;
}

.blog-details-desc .article-content .wp-block-gallery.columns-3 li figure {
	margin-bottom: 0;
}

.blog-details-desc .article-footer {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-top: 30px;
}

.blog-details-desc .article-footer .article-tags {
	-ms-flex: 0 0 50%;
	-webkit-box-flex: 0;
	flex: 0 0 50%;
	max-width: 50%;
	color: #5f5f5f;
}

.blog-details-desc .article-footer .article-tags span {
	display: inline-block;
	color: #333;
	font-size: 16px;
	font-weight: 600;
	margin-right: 5px;
}

.blog-details-desc .article-footer .article-tags a:last-child {
    margin-right: 0px;
}
.blog-details-desc .article-footer .article-tags a {
    display: inline-block;
    color: #f44336 ;
    font-weight: 600;
    font-size: 14px !important;
    padding: 6px 13px;
    border: 1px solid #f44336 ;
    background: transparent;
    margin-top: 8px;
    margin-right: 5px;
    border-radius: 50px;
}

.blog-details-desc .article-footer .article-tags a:hover {
    color: #ffffff;
    background-color: #f44336 ;
    border-color: #f44336 ;
}

.blog-details-desc .article-footer .article-share {
	-ms-flex: 0 0 50%;
	-webkit-box-flex: 0;
	flex: 0 0 50%;
	max-width: 50%;
}

.blog-details-desc .article-footer .article-share .social {
	padding-left: 0;
	list-style-type: none;
	text-align: right;
	margin-bottom: 0;
}

.blog-details-desc .article-footer .article-share .social li {
	display: inline-block;
	margin-right: 5px;
}
.blog-details-desc .article-footer .article-share .social li:last-child {
	margin-right: 0;
}

.blog-details-desc .article-footer .article-share .social li span {
	display: inline-block;
	margin-right: 5px;
	color: #333;
	font-size: 16px;
	font-weight: 600;
}

.blog-details-desc .article-footer .article-share .social li a {
    display: inline-block;
}

.blog-details-desc .article-footer .article-share .social li a i {
    color: #f44336 ;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    display: inline-block;
    background: transparent;
    border: 1px solid #f44336 ;
    border-radius: 25px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.blog-details-desc .article-footer .article-share .social li a i:hover {
	color: #ffffff;
	background-color: #f44336 ;
}

.blog-details-desc .post-navigation {
	margin-top: 30px;
}

blockquote, .blockquote {
	overflow: hidden;
	background-color: #fafafa;
	padding: 50px !important;
	position: relative;
	text-align: center;
	z-index: 1;
	margin-bottom: 20px;
	margin-top: 20px;
}

blockquote p, .blockquote p {
	color: #505060;
	line-height: 1.6;
	margin-bottom: 0;
	font-style: italic;
	font-weight: 500;
	font-size: 24px !important;
}

blockquote cite, .blockquote cite {
	display: none;
}

blockquote::before, .blockquote::before {
	color: #efefef;
	content: "\f10e";
	position: absolute;
	left: 50px;
	top: -50px;
	z-index: -1;
	font-family: "Font Awesome 5 Free";
	font-size: 140px;
	font-weight: 900;
}

blockquote::after, .blockquote::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background-color: #f44336 ;
	margin-top: 20px;
	margin-bottom: 20px;
}

.post-navigation {
	border-top: 1px solid #eeeeee;
	border-bottom: 1px solid #eeeeee;
	padding-top: 20px;
	padding-bottom: 20px;
}

.post-navigation .navigation-links {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.post-navigation .navigation-links .nav-previous {
	-ms-flex: 0 0 50%;
	-webkit-box-flex: 0;
	flex: 0 0 50%;
	max-width: 50%;
}

.post-navigation .navigation-links .nav-previous a i {
	margin-right: 2px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.post-navigation .navigation-links .nav-previous a:hover i {
	margin-right: 0;
}

.post-navigation .navigation-links .nav-next {
	-ms-flex: 0 0 50%;
	-webkit-box-flex: 0;
	flex: 0 0 50%;
	max-width: 50%;
	text-align: right;
}

.post-navigation .navigation-links .nav-next a i {
	margin-left: 2px;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.post-navigation .navigation-links .nav-next a:hover i {
	margin-left: 0;
}

.post-navigation .navigation-links div a {
	display: inline-block;
	font-weight: 600;
}

.comments-area {
	padding: 25px;
	margin-top: 30px;
	-webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.08);
	box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.08);
	background-color: #ffffff;
}

.comments-area .comments-title {
	position: relative;
	margin-bottom: 30px;
	line-height: initial;
	font-size: 24px;
	font-weight: 600;
}

.comments-area ol, .comments-area ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.comments-area .comment-list {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.comments-area .comment-body {
	border-bottom: 1px solid #eeeeee;
	padding-left: 65px;
	color: #505060;
	font-size: 14px;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.comments-area .comment-list .children {
    padding-left: 90px;
}
.comments-area .comment-body .reply {
	margin-top: 15px;
}

.comments-area .comment-body .reply a {
	border: 1px solid #ded9d9;
	color: #505060;
	display: inline-block;
	padding: 5px 20px;
	border-radius: 30px;
	text-transform: capitalize;
	position: relative;
	z-index: 1;
	font-size: 16px;
	font-weight: 600;
}

.comments-area .comment-body .reply a:hover {
	color: #ffffff;
	background-color: #f44336 ;
	border-color: #f44336 ;
}

.comments-area .comment-author {
	font-size: 17px;
	margin-bottom: 0.1em;
	position: relative;
	z-index: 2;
}

.comments-area .comment-author .avatar {
	height: 50px;
	left: -65px;
	position: absolute;
	width: 50px;
}

.comments-area .comment-author .fn {
	font-weight: 600;
}

.comments-area .comment-author .says {
	display: none;
}

.comments-area .comment-metadata {
	margin-bottom: .8em;
	color: #5f5f5f;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 400;
}

.comments-area .comment-metadata a {
	color: #5f5f5f;
}

.comments-area .comment-metadata a:hover {
	color: #f44336 ;
}

.comments-area .comment-respond {
	margin-top: 30px;
}

.comments-area .comment-respond .comment-reply-title {
	margin-bottom: 0;
	position: relative;
	font-size: 24px;
	font-weight: 600;
}

.comments-area .comment-respond .comment-reply-title #cancel-comment-reply-link {
	display: inline-block;
}

.comments-area .comment-respond .comment-form {
	overflow: hidden;
}

.comments-area .comment-respond .comment-notes {
	margin-bottom: 0;
	margin-top: 10px;
}

.comments-area .comment-respond .comment-form-comment {
	margin-top: 20px;
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.comments-area .comment-respond label {
	display: block;
	font-weight: 600;
	color: #505060;
	margin-bottom: 5px;
}

.comments-area .comment-respond input[type="date"], .comments-area .comment-respond input[type="time"], .comments-area .comment-respond input[type="datetime-local"], .comments-area .comment-respond input[type="week"], .comments-area .comment-respond input[type="month"], .comments-area .comment-respond input[type="text"], .comments-area .comment-respond input[type="email"], .comments-area .comment-respond input[type="url"], .comments-area .comment-respond input[type="password"], .comments-area .comment-respond input[type="search"], .comments-area .comment-respond input[type="tel"], .comments-area .comment-respond input[type="number"], .comments-area .comment-respond textarea {
	display: block;
	width: 100%;
	background-color: #ffffff;
	border: 1px solid #eeeeee;
	padding: 0.625em 0.7375em;
	outline: 0;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.comments-area .comment-respond input[type="date"]:focus, .comments-area .comment-respond input[type="time"]:focus, .comments-area .comment-respond input[type="datetime-local"]:focus, .comments-area .comment-respond input[type="week"]:focus, .comments-area .comment-respond input[type="month"]:focus, .comments-area .comment-respond input[type="text"]:focus, .comments-area .comment-respond input[type="email"]:focus, .comments-area .comment-respond input[type="url"]:focus, .comments-area .comment-respond input[type="password"]:focus, .comments-area .comment-respond input[type="search"]:focus, .comments-area .comment-respond input[type="tel"]:focus, .comments-area .comment-respond input[type="number"]:focus, .comments-area .comment-respond textarea:focus {
	border-color: #f44336 ;
}

.comments-area .comment-respond .comment-form-author {
	float: left;
    width: 50%;
    padding-right: 10px;
    margin-top: 20px;
    margin-bottom: 0;
}

.comments-area .comment-respond .comment-form-email {
    float: left;
    width: 50%;
    padding-left: 12px;
    margin-top: 20px;
    margin-bottom: 0;
}

.comments-area .comment-respond .form-submit {
	float: left;
	width: 100%;
}

.comments-area .comment-respond .form-submit input {
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 30px;
	display: inline-block;
	cursor: pointer;
	outline: 0;
	border: none;
	border: none;
	border-radius: 5px;
	background-color: #f44336 ;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.comments-area .comment-respond .form-submit input:hover, .comments-area .comment-respond .form-submit input:focus {
	color: #ffffff;
	background-color: #505060;
}

/************************************************
 ** - 20 - Blog Page Sidebar Widget CSS
 ************************************************/
.widget-area .widget {
	padding: 30px 25px;
    border-radius: 5px;
	margin-top: 35px;
	background-color: rgb(11, 11, 49, 0.05);
}

.widget-area .widget:first-child {
	margin-top: 0;
}

.widget-area .widget .widget-title {
	position: relative;
	font-size: 22px;
	padding-bottom: 10px;
	margin-bottom: 25px;
	border-bottom: 1px solid #ffffff;
	text-transform: capitalize;
}

.widget-area .widget .widget-title::before {
	content: '';
	position: absolute;
	background: #f44336 ;
	bottom: -1px;
	left: 0;
	width: 50px;
	height: 1px;
}

.widget-area .widget_search {
}

.widget-area .widget_search form {
	position: relative;
}

.widget-area .widget_search form label {
	display: block;
	margin-bottom: 0;
}

.widget-area .widget_search form .screen-reader-text {
	display: none;
}

.widget-area .widget_search form .search-field {
	font-size: 16px;
	font-weight: 500;
	height: 50px;
	padding: 6px 15px;
	width: 100%;
	display: block;
	outline: 0;
	border: 1px solid #eeeeee;
	background-color: #ffffff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.widget-area .widget_search form .search-field:focus {
	border-color: #f44336 ;
}

.widget-area .widget_search form button {
	position: absolute;
	right: 0;
	outline: 0;
	bottom: 0;
	height: 50px;
	width: 50px;
	z-index: 1;
	border: none;
	color: #ffffff;
	background-color: #f44336 ;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.widget-area .widget_search form button:hover {
	background-color: #505060;
	color: #ffffff;
}

.widget-area .widget_cyberguard_posts_thumb {
	position: relative;
	overflow: hidden;
}

.widget-area .widget_cyberguard_posts_thumb .item {
	overflow: hidden;
	margin-bottom: 15px;
}

.widget-area .widget_cyberguard_posts_thumb .item:last-child {
	margin-bottom: 0;
}

.widget-area .widget_cyberguard_posts_thumb .item .thumb {
    float: left;
    width: 100px;
    overflow: hidden;
    border-radius: 3px;
    margin-right: 12px;
}

.widget-area .widget_cyberguard_posts_thumb .item .info {
	overflow: hidden;
	margin-top: 0px;
}

.widget-area .widget_cyberguard_posts_thumb .item .info span {
	display: block;
	color: #5f5f5f;
	text-transform: capitalize;
	margin-top: 3px;
	font-size: 14px;
}

.widget-area .widget_cyberguard_posts_thumb .item .info .title {
	margin-bottom: 0;
	line-height: 1.4;
	font-size: 16px;
}

.widget-area .widget_cyberguard_posts_thumb .item .info .title a {
	display: inline-block;
}

.widget-area .widget_recent_entries ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.widget-area .widget_recent_entries ul li {
	position: relative;
	margin-bottom: 12px;
	color: #505060;
	padding-left: 14px;
	line-height: 1.5;
	font-weight: 400;
	font-size: 15.5px;
}

.widget-area .widget_recent_entries ul li:last-child {
	margin-bottom: 0;
}

.widget-area .widget_recent_entries ul li::before {
	background: #f44336 ;
	height: 8px;
	width: 8px;
	content: '';
	left: 0;
	top: 7px;
	position: absolute;
	border-radius: 50px;
	border-right-style: inset;
}

.widget-area .widget_recent_entries ul li a {
	display: inline-block;
	color: #505060;
}

.widget-area .widget_recent_entries ul li a:hover {
	color: #f44336 ;
}

.widget-area .widget_recent_entries ul li .post-date {
	display: block;
	font-size: 13px;
	color: #5f5f5f;
	margin-top: 4px;
}

.widget-area .widget_categories ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.widget-area .widget_categories ul li {
	color: #5f5f5f;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 12px;
}

.widget-area .widget_categories ul li:last-child {
	margin-bottom: 0;
}

.widget-area .widget_categories ul li a {
	color: #505060;
	font-size: 16px;
	font-weight: 600;
    padding: 12px 15px;
	display: flex;
    justify-content: space-between;
    background-color: #fff;
    border-radius: 5px;
}

.widget-area .widget_categories ul li a:hover {
	color: #fff;
    background: #f44336 ;
}

.widget-area .widget_categories ul li .post-count {
	float: right;
}

.widget-area .widget_meta ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.widget-area .widget_meta ul li {
	position: relative;
	margin-bottom: 12px;
	color: #505060;
	padding-left: 14px;
	font-size: 15.5px;
	font-weight: 400;
}

.widget-area .widget_meta ul li:last-child {
	margin-bottom: 0;
}

.widget-area .widget_meta ul li::before {
	background: #f44336 ;
	height: 8px;
	width: 8px;
	content: '';
	left: 0;
	top: 7px;
	position: absolute;
	border-radius: 50px;
	border-right-style: inset;
}

.widget-area .widget_meta ul li a {
	display: inline-block;
	color: #505060;
}

.widget-area .widget_meta ul li a:hover {
	color: #f44336 ;
}

.widget-area .widget_tag_cloud .widget-title {
	margin-bottom: 12px;
}

.widget-area .tagcloud a {
    display: inline-block;
    color: #505060;
	font-size: 16px;
	font-weight: 600;
    padding: 10px 12px;
    margin-top: 10px;
    margin-right: 8px;
    background-color: #fff;
    border-radius: 5px;
}

.widget-area .tagcloud a:hover, .widget-area .tagcloud a:focus {
	color: #ffffff;
	background-color: #f44336 ;
	border-color: #f44336 ;
}

.widget-area .widget_event_details ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.widget-area .widget_event_details ul li {
	border-bottom: 1px solid #eeeeee;
	color: #888f96;
	padding-bottom: 10px;
	padding-top: 10px;
}

.widget-area .widget_event_details ul li:first-child {
	padding-top: 0;
}

.widget-area .widget_event_details ul li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.widget-area .widget_event_details ul li span {
	display: inline-block;
	color: #505060;
	font-weight: 400;
}

.widget-area .widget_event_details ul li a {
	display: inline-block;
	color: #888f96;
}

.widget-area .widget_event_details ul li a:hover {
	color: #f44336 ;
}

/**************************************
 ** - 21 - Partner Section CSS
 **************************************/
.partner-section {
	position: relative;
	background-color: #fff;
	overflow: hidden;
	z-index: 1;
}

.partner-list {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -5px;
	margin-left: -5px;
}

.partner-list .partner-item {
	-ms-flex: 0 0 20%;
	-webkit-box-flex: 0;
	flex: 0 0 20%;
	max-width: 20%;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 20px;
}

.partner-list .partner-item a {
	display: block;
    text-align: center;
    position: relative;
    padding: 0px 0px;
    overflow: hidden;
    border-radius: 10px;
    background-color: #ffffff;
	box-shadow: 0px 5px 20px rgb(34, 34, 129, 0.1);
}

/**************************************
 ** - 21.2 - Partner Slider CSS
 **************************************/
.partner-area {
	padding: 70px 0px;
}

.partner-slide-item {
	padding: 0px 0px;
	margin: 0px 15px;
}

.partner-area .partner-carousel img {
	max-width: 100%;
	width: inherit!important;
	margin: 0 auto;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.partner-area .partner-carousel img:hover {
	opacity: .7;
	cursor: pointer;
}

/**********************************************
 ** - 22 - Other Page Banner Title CSS
 **********************************************/
.page-title-area {
	position: relative;
	z-index: 1;
	background-image: url(../img/banner-bg.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 400px;
}

.page-title-area::before {
	content: "";
	position: absolute;
	z-index: -1;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
	opacity: 0.6;
    background-color: #10184c;
}

.page-title-content {
	text-align: center;
	margin-top: 45px;
}

.page-title-content h2 {
	margin-bottom: 0;
	color: #ffffff;
	font-size: 38px;
	font-weight: 700;
}

.page-title-content ul {
	padding-left: 0;
	list-style-type: none;
	margin-top: 12px;
	margin-bottom: 0;
}

.page-title-content ul li {
	color: #ffffff;
	display: inline-block;
	position: relative;
	font-weight: 600;
	font-size: 17px;
	margin-left: 10px;
	margin-right: 10px;
}

.page-title-content ul li a {
	display: inline-block;
	color: #ffffff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.page-title-content ul li a:hover {
	color: #f44336 ;
}

.page-title-content ul li::before {
    content: '';
    position: absolute;
    right: -15px;
    top: 10px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #ffc107;
}

.page-title-content ul li:last-child::before {
	display: none;
}

.item-bg1 {
	background-image: url(../img/page-title-bg-2.jpg);
}

.item-bg2 {
	background-image: url(../img/page-title-bg-3.jpg);
}

/**************************************
 ** - 23 - Contact Page CSS
 **************************************/
.contact-form .form-group {
	margin-bottom: 30px;
}

.contact-form form .form-control {
	background-color: #ffffff;
	border: none;
	height: 54px;
	font-size: 16px;
	border: 1px solid #e6e6e6;
}

.contact-form form .form-control:focus {
	border: 1px solid #f44336 ;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.contact-form form textarea.form-control {
	height: auto;
	padding-top: 15px;
	line-height: initial;
}

.contact-info-box .single-contact-box {
	text-align: center;
	background-color: #ffffff;
	padding: 0px 25px;
	margin-top: 30px;
}

.single-contact-box img {
	margin-bottom: 30px;
}

 
.contact-section .contact-form-1 form .form-control {
    font-size: 15px;
    width: 100%;
    padding: 10px 20px;
    height: 52px;
    color: #333;
    border: none;
    background-color: #f3f3f3;
    font-weight: 600;
    border-radius: 5px;
    text-transform: capitalize;
    border-left: 2px solid #b4b7bd;
    transition: all 0.4s;
}
.contact-section .contact-form-1 form input:focus,
.contact-section .contact-form-1 form textarea:focus {
	outline: none;
	border: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	border-left: 2px solid #f44336 ;
}
.contact-information-box-1 {
    background: #fff;
    padding: 25px 20px;
    border-radius: 5px;
    border-bottom: 2px solid #f44336 ;
	-webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
	box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
}
.contact-information-box-1 .single-contact-info-box {
    position: relative;
    z-index: 1;
    padding: 10px 10px;
    display: block;
    border-radius: 3px;
    text-align: left;
    margin-bottom: 10px;
    overflow: hidden;
}
.contact-information-box-1 .contact-info {
	position: relative;
    z-index: 1;
}

.contact-information-box-1 .contact-info h6 {
	font-weight: 600;
    font-size: 18px;
    color: #333;
    margin-bottom: 7px;
    text-transform: capitalize;
}

.contact-information-box-1 .contact-info p {
	color: #333;
	font-size: 14px;
	font-weight: 500;
	margin: 0;
}
.contact-information-box-1 .single-contact-info-box .contact-info-bg-icon {
    color: #f44336 ;
    opacity: .2;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25px;
    margin: 0 auto;
    z-index: -1;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
.contact-information-box-1 .single-contact-info-box .contact-info-bg-icon i {
    font-size: 100px;
}
.contact-section .contact-form .form-group {
    margin-bottom: 30px;
}
.contact-section .contact-form form textarea.form-control {
    height: auto;
    padding-top: 15px;
    line-height: initial;
}

.contact-section .form-message {
	margin: 0;
}
.contact-section .form-message.success {
	background: #03b103;
	color: #fff;
	padding: 10px 15px;
	border-radius: 3px;
	margin-bottom: 30px;
}

.contact-section .form-message.error {
	background: #ff4d15;
	color: #fff;
	padding: 10px 15px;
	border-radius: 3px;
	margin-bottom: 30px;
}

/**************************************
 ** - 23 - Map Section CSS
 **************************************/
.map-section {
    margin-bottom: -10px;
}

.map-section .google-map iframe {
    width: 100%;
    height: 500px;
    border: 0;
}

/**************************************
 ** - 24 - Coming Soon Page CSS
 **************************************/
.coming-soon-area {
	position: relative;
	z-index: 1;
    height: 800px;
    min-height: 100vh;
    padding: 120px 0;
	background-image: url(../img/banner-bg.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.coming-soon-area::before {
	position: absolute;
	content: '';
	z-index: -1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0.3;
	background-color: #10184c;
}

.coming-soon-area .social-list {
	text-align: center;
	margin-top: 50px;
}

.coming-soon-area .social-list li {
	display: inline-block;
}

.coming-soon-area .social-list li.list-heading {
	display: block;
	color: #ffffff;
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 500;
}

.coming-soon-area .social-list li a {
	display: inline-block;
}

.coming-soon-area .social-list li a i {
	color: #ffffff;
	font-size: 16px;
	width: 38px;
	height: 38px;
	line-height: 38px;
	border-radius: 50%;
	display: inline-block;
	background-color: #f44336 ;
	border: 1px solid #f44336 ;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	margin: 0 2px;
}

.coming-soon-area .social-list li a i:hover {
    color: #ffffff;
    border: 1px solid #ffffff;
    background-color: transparent;
}

.coming-soon-content {
	max-width: 830px;
	text-align: center;
	margin: 0 auto;
}

.coming-soon-content h1 {
	color: #ffffff;
	margin-bottom: 15px;
	font-size: 46px;
	font-weight: 600;
}

.coming-soon-content p {
	color: #ffffff;
	margin: 0 auto;
	max-width: 620px;
	line-height: 30px;
}

.coming-soon-content form {
	position: relative;
	margin: 35px auto 55px;
	max-width: 520px;
}

.coming-soon-content form .email-input {
	display: block;
	width: 100%;
	height: 56px;
	border: none;
	-webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 5px rgba(255, 255, 255, 0.3);
	box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 5px rgba(255, 255, 255, 0.3);
	border-radius: 40px;
	padding: 15px 25px;
	outline: 0 !important;
	background: #F1F2F3;
}

.coming-soon-content form .submit-btn {
	position: absolute;
	right: 3px;
	top: 3px;
	height: 50px;
	background: #f44336 ;
	color: #ffffff;
	border: none;
	border-radius: 40px;
	width: 130px;
	outline: 0 !important;
	cursor: pointer;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 600;
}

.coming-soon-content form .submit-btn:hover, .coming-soon-content form .submit-btn:focus {
	background-color: #f44336 ;
}

.coming-soon-content #timer div {
	background: #ffffff;
	display: inline-block;
	border-radius: 50%;
	width: 120px;
	height: 120px;
	color: #f44336 ;
	-webkit-box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.5);
	box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.5);
	margin: 0 10px;
	padding-top: 18px;
	font-size: 40px;
	font-weight: 600;
}

.coming-soon-content #timer div span {
	display: block;
	margin-top: -4px;
	color: #777777;
	font-size: 15px;
	font-weight: 600;
}

/**************************************
 ** - 25 - 404 Error Page CSS
 **************************************/
.error-area {
	padding: 50px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
	
}

.error-content {
	text-align: center;
	margin: 0 auto;
	max-width: 700px;
}

.error-content h3 {
	font-size: 35px;
	font-weight: 700;
	margin-top: 20px;
	margin-bottom: 18px;
}

.error-content p {
	max-width: 520px;
	margin: 0 auto 20px;
	line-height: 30px;
}

.error-content .default-btn-one {
	display: inline-block;
	padding: 12px 30px;
	background: #7b68ee;
	border: 2px solid #7b68ee;
	color: #ffffff;
	font-size: 16px;
	font-weight: 400;
	-webkit-transition: .6s;
	transition: .6s;
	margin-right: 0;
}

.error-content .default-btn-one:hover {
	text-decoration: none;
	background-color: #ffffff;
	color: #7b68ee;
}

/**********************************
 ** - 26 - Terms & Conditions
 **********************************/
.single-privacy h3 {
	font-size: 22px;
	margin: 0 0 12px 0;
}

/***********************************
 ** - 27 - Privacy Policy CSS
 ***********************************/
.single-terms h3 {
	font-size: 22px;
	margin: 0 0 12px 0;
}

/**********************************************
 ** - 28 - Footer & Copyright Section CSS
 **********************************************/
.footer-area {
	position: relative;
	z-index: 1;
	padding: 100px 0;
	background-image: url(../img/banner-bg.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.footer-area::before {
	content: "";
	position: absolute;
    z-index: -1;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	opacity: 0.90;
	background-color: #10184c;
}
.footer-about {
    padding-right: 15px;
}
.footer-logo {
	margin-bottom: 20px;
	display: inline-block;
}

.footer-list h5 {
	font-size: 18px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 25px;
}

.footer-list p {
	font-size: 16px;
	color: #efefef;
}

.footer-list ul li {
	margin-bottom: 12px;
	color: #efefef;
}

.footer-list ul li:last-child {
	margin-bottom: 0px;
}

.footer-list .footer-contact-info ul li i {
	color: #ffffff;
	font-size: 16px;
	margin-right: 5px;
}

.footer-list ul li a {
	display: inline-block;
	font-size: 16px;
	color: #efefef;
}

.footer-list ul li a:hover {
	color: #f44336 ;
    text-decoration: underline;
}

.footer-contact-info .footer-contact-list li span {
	display: inline-block;
	color: #efefef;
	font-size: 16px;
	font-weight: 700;
}

.footer-social-icon {
	margin-top: 25px;
}

.footer-social-icon li {
	margin-right: 10px;
	display: inline-block;
}

.footer-social-icon li a {
	color: #f44336  !important;
	font-size: 20px !important;
	width: 40px;
	height: 40px;
	line-height: 40px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid rgb(255, 255, 255, 0.25);
    background: #ffffff;
	display: block;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.footer-social-icon li a:hover {
	color: #fff !important;
    border: 1px solid #f44336 ;
	background: #f44336 ;
}

.newsletter-form {
	max-width: 580px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
}

.newsletter-form .input-newsletter {
	display: block;
	color: #0b0b31;
	width: 100%;
	height: 54px;
	font-weight: 500;
	padding-left: 15px;
	border-radius: 3px;
	outline: 0;
	border: none;
	margin-bottom: 20px;
	background-color: #ffffff;
}

.newsletter-form .input-newsletter::-webkit-input-placeholder {
	color: #747576;
}

.newsletter-form .input-newsletter:-ms-input-placeholder {
	color: #747576;
}

.newsletter-form .input-newsletter::-ms-input-placeholder {
	color: #747576;
}

.newsletter-form .input-newsletter::placeholder {
	color: #747576;
}

.newsletter-form button {
	width: 100%;
	color: #ffffff;
	font-size: 16px;
	border: none;
    height: 46px;
    line-height: 46px;
	padding: 0 20px;
	border-radius: 3px;
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
    will-change: transform;
}
/* .- ..- - .... --- .-. ---... / -... .- .-. .- -.- .- .... / - .... . -- . ... */
.copyright-area {
    padding: 35px 0;
    border-top: 1px solid rgb(255, 255, 255, 0.15);
    background-color: #10184c;
}

.copyright-area p {
	color: #efefef;
	font-size: 16px;
}

.copyright-area ul {
	padding-left: 0;
	margin-bottom: 0;
	list-style-type: none;
	text-align: right;
}

.copyright-area ul li {
	display: inline-block;
	color: #efefef;
	font-size: 16px;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}

.copyright-area ul li a {
	display: inline-block;
	color: #efefef;
}

.copyright-area ul li a:hover {
	color: #f44336 ;
}

.copyright-area ul li::before {
	content: '';
	position: absolute;
	top: 5px;
	right: -13px;
	width: 1px;
	height: 14px;
	background-color: #ffffff;
}

.copyright-area ul li:last-child {
	margin-right: 0;
}

.copyright-area ul li:last-child::before {
	display: none;
}

.copyright-area ul li:first-child {
	margin-left: 0;
}


/* ===================================
   Home Slider Round Navigation Buttons
   =================================== */

.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {
    width:55px;
    height:55px;
    border-radius:50% !important;
    background:rgba(255,255,255,0.15) !important;
    border:1px solid rgba(255,255,255,0.5) !important;
    color:#ffffff !important;
    font-size:22px !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    transition:all .35s ease;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.slider-container .owl-nav button.owl-prev {
    left:40px;
}

.slider-container .owl-nav button.owl-next {
    right:40px;
}

.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {
    background:#ff4b3e !important;
    border-color:#ff4b3e !important;
    color:#fff !important;
    transform:translateY(-50%) scale(1.12);
}

.slider-container .owl-nav button i {
    line-height:1;
}

@media(max-width:768px){
    .slider-container .owl-nav button.owl-prev,
    .slider-container .owl-nav button.owl-next {
        width:42px;
        height:42px;
        font-size:16px !important;
    }

    .slider-container .owl-nav button.owl-prev {
        left:15px;
    }

    .slider-container .owl-nav button.owl-next {
        right:15px;
    }
}


/* =========================================
   Slider Navigation Final Optimization
   ========================================= */

/* remove slider dark overlay */
.single-slider-item:before,
.single-slider-item::before,
.bg-img:before,
.bg-img::before {
    display:none !important;
    opacity:0 !important;
}


/* owl navigation buttons */
.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {

    width:56px !important;
    height:56px !important;

    border-radius:50% !important;

    background:rgba(255,255,255,0.25) !important;

    border:1px solid rgba(255,255,255,0.8) !important;

    color:#ffffff !important;

    display:flex !important;
    align-items:center;
    justify-content:center;

    position:absolute !important;

    top:50% !important;

    transform:translateY(-50%);

    transition:all .3s ease;

}


/* left button */
.slider-container .owl-nav button.owl-prev {

    left:35px !important;

}


/* right button */
.slider-container .owl-nav button.owl-next {

    right:35px !important;

}


/* hover */
.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {

    background:#ff4b3e !important;

    border-color:#ff4b3e !important;

    transform:
    translateY(-50%)
    scale(1.12);

}


/* icon */
.slider-container .owl-nav button i {

    font-size:20px;

}


/* mobile */
@media(max-width:768px){

.slider-container .owl-nav button.owl-prev {
    left:15px !important;
}

.slider-container .owl-nav button.owl-next {
    right:15px !important;
}

.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {

    width:42px !important;
    height:42px !important;

}

}


/* =========================================
   Owl Carousel Navigation Button Final Fix
   ========================================= */

.slider-container .owl-nav {
    position:absolute !important;
    width:100% !important;
    top:50% !important;
    left:0 !important;
    transform:translateY(-50%) !important;
    margin:0 !important;
    pointer-events:none;
    z-index:20;
}


.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {

    position:absolute !important;

    top:0 !important;

    width:56px !important;
    height:56px !important;

    border-radius:50% !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:rgba(255,255,255,.25) !important;

    border:1px solid rgba(255,255,255,.8) !important;

    color:#fff !important;

    pointer-events:auto;

    transition:all .3s ease !important;

}


.slider-container .owl-nav button.owl-prev {
    left:30px !important;
}


.slider-container .owl-nav button.owl-next {
    right:30px !important;
}


.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {

    background:#ff4b3e !important;

    border-color:#ff4b3e !important;

    transform:scale(1.12) !important;

}


.slider-container .owl-nav button i {
    font-size:22px !important;
}


@media(max-width:768px){

.slider-container .owl-nav button.owl-prev {
    left:15px !important;
}

.slider-container .owl-nav button.owl-next {
    right:15px !important;
}

.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {

    width:42px !important;
    height:42px !important;

}

}


/* =========================================
   Owl Carousel Button Hover Bounce Fix
   ========================================= */


/* 默认状态 */

.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {

    transition:
        transform .35s cubic-bezier(.34,1.56,.64,1),
        background .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;

}



/* 鼠标悬停弹跳 */

.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {

    background:#ff4b3e !important;

    border-color:#ff4b3e !important;

    transform:
        translateY(-8px)
        scale(1.12) !important;

    box-shadow:
        0 10px 25px rgba(255,75,62,.45) !important;

}



/* 点击反馈 */

.slider-container .owl-nav button.owl-prev:active,
.slider-container .owl-nav button.owl-next:active {

    transform:
        translateY(-2px)
        scale(.95) !important;

}


/* 箭头轻微放大 */

.slider-container .owl-nav button:hover i {

    transform:scale(1.15);

}


.slider-container .owl-nav button i {

    transition:transform .3s ease;

}



/* =========================================
   Owl Carousel Button Hover No Bounce Fix
   ========================================= */

/* 禁止鼠标悬停弹跳、位移、缩放 */

.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {
    transform: none !important;
    background: #ff4b3e !important;
    border-color: #ff4b3e !important;
    box-shadow: none !important;
}

/* 禁止箭头放大 */
.slider-container .owl-nav button:hover i {
    transform: none !important;
}

/* 仅保留颜色过渡 */
.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {
    transition:
        background .3s ease,
        border-color .3s ease !important;
}



/* =====================================
   FINAL FIX: Disable Owl Button Bounce
   ===================================== */

.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {
    transform: none !important;
    animation: none !important;
    margin: 0 !important;
    top: 0 !important;
    box-shadow: none !important;
}

.slider-container .owl-nav button:hover i {
    transform: none !important;
}

.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {
    transition:
        background .3s ease,
        border-color .3s ease !important;
}

.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {
    background: #ff4b3e !important;
    border-color: #ff4b3e !important;
}


/* ===== Modern Dynamic Hero Slider v9 ===== */
.home-slider-section{
    position:relative;
    overflow:hidden;
}
.modern-hero-slider{
    height:820px;
    min-height:100vh;
    overflow:hidden;
    background-position:center;
    animation:heroZoom 12s ease-in-out infinite alternate;
}
.modern-hero-slider:before{
    background:linear-gradient(90deg,
    rgba(5,15,45,.92) 0%,
    rgba(5,15,45,.55) 45%,
    rgba(5,15,45,.18) 100%);
    opacity:1;
}
.slider-content{
    animation:contentRise 1s ease both;
}
.slider-content h1{
    font-size:68px;
    letter-spacing:-1px;
    line-height:1.12;
    text-shadow:0 10px 30px rgba(0,0,0,.25);
}
.slider-content p{
    max-width:620px;
    font-size:18px;
}
.slider-glow{
    position:absolute;
    width:450px;
    height:450px;
    right:8%;
    top:20%;
    background:radial-gradient(circle,rgba(0,184,255,.35),transparent 65%);
    filter:blur(20px);
    animation:glowMove 6s infinite alternate;
}
.slider-particles span{
    position:absolute;
    display:block;
    width:8px;
    height:8px;
    border-radius:50%;
    background:rgba(255,255,255,.65);
    animation:floatParticle 10s infinite;
}
.slider-particles span:nth-child(1){left:15%;top:30%;animation-delay:0s}
.slider-particles span:nth-child(2){left:45%;top:70%;animation-delay:2s}
.slider-particles span:nth-child(3){right:20%;top:35%;animation-delay:4s}
.slider-particles span:nth-child(4){right:8%;bottom:20%;animation-delay:6s}

.slider-container.owl-carousel .owl-item.active .modern-hero-slider{
    animation-play-state:running;
}
.slider-container.owl-theme .owl-dots{
    position:absolute;
    bottom:45px;
    left:50%;
    transform:translateX(-50%);
}
.slider-container.owl-theme .owl-dots .owl-dot span{
    width:12px;
    height:12px;
    border-radius:50%;
    transition:.4s;
}
.slider-container.owl-theme .owl-dots .owl-dot.active span{
    width:36px;
    border-radius:10px;
}

@keyframes heroZoom{
    from{background-size:100%}
    to{background-size:108%}
}
@keyframes contentRise{
    from{opacity:0;transform:translateY(40px)}
    to{opacity:1;transform:none}
}
@keyframes glowMove{
    from{transform:translate(0,0)}
    to{transform:translate(-50px,40px)}
}
@keyframes floatParticle{
    0%,100%{transform:translateY(0);opacity:.3}
    50%{transform:translateY(-80px);opacity:1}
}
@media(max-width:991px){
 .slider-content h1{font-size:42px}
 .modern-hero-slider{height:700px}
}

/* ===== Slider Navigation Fix v10: Disable Hover Jitter ===== */
.slider-container .owl-nav button,
.slider-container .owl-nav button.owl-prev,
.slider-container .owl-nav button.owl-next {
    position: relative !important;
    transform: none !important;
    animation: none !important;
    transition: background-color .25s ease,
                border-color .25s ease,
                color .25s ease !important;
    will-change: auto !important;
}

.slider-container .owl-nav button:hover,
.slider-container .owl-nav button.owl-prev:hover,
.slider-container .owl-nav button.owl-next:hover {
    transform: none !important;
    animation: none !important;
    top: 0 !important;
    left: auto !important;
    margin: inherit !important;
}

.slider-container .owl-nav button:hover i {
    transform: none !important;
    animation: none !important;
}

.slider-container .owl-nav button:active {
    transform: none !important;
}


/* v11 slider navigation stability fix */
.slider-container.owl-theme .owl-nav {
    position: absolute;
    right: 35px;
    top: 50%;
    margin: 0;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 18px;
    z-index: 20;
}

.slider-container.owl-theme .owl-nav [class*=owl-] {
    position: relative;
    width: 58px;
    height: 58px;
    margin: 0;
    padding: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.55);
    color:#fff;
    transition: background-color .3s ease, color .3s ease, border-color .3s ease;
    transform:none!important;
    animation:none!important;
}

.slider-container.owl-theme .owl-nav [class*=owl-]:hover {
    background:#fff;
    color:#111;
    border-color:#fff;
    transform:none!important;
}

.slider-container.owl-theme .owl-nav button:focus,
.slider-container.owl-theme .owl-nav button:active {
    outline:none;
    transform:none!important;
}

.slider-container.owl-theme .owl-dots {
    bottom:25px;
}

.single-slider-item {
    overflow:hidden;
}

.single-slider-item img {
    max-width:100%;
}

@media(max-width:768px){
    .slider-container.owl-theme .owl-nav {
        right:15px;
    }
    .slider-container.owl-theme .owl-nav [class*=owl-] {
        width:45px;
        height:45px;
    }
}

/* v12 final owl slider isolation fix */
.home-slider-section,
.home-slider-section .slider-container,
.home-slider-section .owl-stage-outer,
.home-slider-section .owl-stage,
.home-slider-section .owl-item {
    position: relative;
}

.home-slider-section .slider-container.owl-carousel {
    overflow: hidden;
}

.home-slider-section .slider-container.owl-theme .owl-nav {
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 0 !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
    display: block !important;
    pointer-events: none;
    z-index: 99;
}

.home-slider-section .slider-container.owl-theme .owl-nav button,
.home-slider-section .slider-container.owl-theme .owl-nav button.owl-prev,
.home-slider-section .slider-container.owl-theme .owl-nav button.owl-next {
    position: absolute !important;
    top: -29px !important;
    width: 58px !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: auto;
    background: rgba(255,255,255,.18) !important;
    border: 1px solid rgba(255,255,255,.65) !important;
    color:#fff !important;
    transform:none !important;
    animation:none !important;
    transition:background-color .25s ease,color .25s ease,border-color .25s ease !important;
}

.home-slider-section .slider-container.owl-theme .owl-nav button.owl-prev {
    left:40px !important;
}

.home-slider-section .slider-container.owl-theme .owl-nav button.owl-next {
    right:40px !important;
}

.home-slider-section .slider-container.owl-theme .owl-nav button:hover {
    background:#fff !important;
    color:#111 !important;
    border-color:#fff !important;
    transform:none !important;
}

.home-slider-section .slider-container.owl-theme .owl-nav button i,
.home-slider-section .slider-container.owl-theme .owl-nav button span {
    transform:none !important;
    animation:none !important;
}

@media(max-width:768px){
    .home-slider-section .slider-container.owl-theme .owl-nav button.owl-prev{
        left:15px !important;
    }
    .home-slider-section .slider-container.owl-theme .owl-nav button.owl-next{
        right:15px !important;
    }
}


/* ================================
   Slider content center layout fix
   ================================ */

.home-slider-section .modern-hero-slider .container{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
}

.home-slider-section .modern-hero-slider .row{
    width:100%;
    height:100%;
    justify-content:center;
    align-items:center;
}

.home-slider-section .modern-hero-slider .col-lg-8{
    width:100%;
    max-width:900px;
    flex:0 0 900px;
}

.home-slider-section .slider-content{
    width:100%;
    text-align:center;
    margin:0 auto;
    position:relative;
    z-index:5;
}

.home-slider-section .slider-content h1,
.home-slider-section .slider-content p{
    margin-left:auto;
    margin-right:auto;
}

.home-slider-section .slider-content p{
    max-width:700px;
}

.home-slider-section .banner-btn{
    justify-content:center;
    display:flex;
    gap:18px;
}

@media(max-width:991px){
    .home-slider-section .modern-hero-slider .col-lg-8{
        flex:0 0 100%;
        max-width:100%;
    }
}


/* ===== Industrial Header Redesign ===== */
.industrial-topbar{
    background:#17232d;
    color:#fff;
    font-size:14px;
    height:42px;
    display:flex;
    align-items:center;
}
.industrial-topbar .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.industrial-topbar span{
    margin-right:28px;
    opacity:.95;
}
.industrial-topbar i{
    color:#f39a1e;
    margin-right:8px;
}
.industrial-header{
    position:relative;
    background:#fff;
    box-shadow:0 3px 15px rgba(0,0,0,.05);
}
.industrial-header .cyberguard-nav{
    padding:18px 0;
}
.industrial-header .navbar-brand img{
    max-height:62px;
    width:auto;
    transition:.3s;
}
.industrial-header .navbar-nav .nav-item a{
    color:#1c2733;
    font-size:17px;
    font-weight:700;
    margin:0 18px;
}
.industrial-header .navbar-nav .nav-item a:hover,
.industrial-header .navbar-nav .nav-item a.active{
    color:#e88a12;
}
.industrial-header .default-btn{
    background:#e88a12;
    border-radius:12px;
    padding:16px 32px;
    font-weight:700;
}
.industrial-header.is-sticky{
    background:#fff!important;
}
.industrial-header.is-sticky .cyberguard-nav{
    padding:10px 0;
}
.industrial-header.is-sticky .navbar-brand img{
    max-height:48px;
}
.industrial-header.is-sticky + .main-banner,
.industrial-header.is-sticky + section{
    margin-top:100px;
}
@media(max-width:991px){
 .industrial-topbar{display:none}
 .industrial-header .cyberguard-nav{padding:12px 0}
}


/* ==========================================================
   V18 - Flat, balanced desktop navigation
   Goal: clean / spacious / flat / commercial B2B style
   Content and WordPress menu structure remain unchanged.
   ========================================================== */

/* ---------- Layout width ---------- */
.industrial-topbar .container,
.industrial-header .cyberguard-nav > .container,
.industrial-header .cyberguard-responsive-nav > .container {
    width: 100%;
    max-width: 1900px !important;
    margin: 0 auto;
    padding-left: 30px;
    padding-right: 30px;
}

/* ---------- Top information bar: slim and quiet ---------- */
.industrial-topbar {
    position: relative;
    z-index: 1001;
    height: 38px;
    min-height: 38px;
    padding: 0;
    background: #17232d;
    border: 0;
    color: #edf2f5;
    font-size: 13px;
    line-height: 1;
    font-weight: 500;
}

.industrial-topbar .container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.industrial-topbar .topbar-left,
.industrial-topbar .topbar-right {
    display: flex;
    align-items: center;
    gap: 22px;
    min-width: 0;
}

.industrial-topbar .topbar-right {
    margin-left: auto;
}

.industrial-topbar span {
    display: inline-flex;
    align-items: center;
    margin: 0 !important;
    white-space: nowrap;
    opacity: .96;
}

.industrial-topbar i {
    width: 16px;
    margin-right: 7px;
    color: #e9890b;
    font-size: 14px;
    text-align: center;
}

/* ---------- Main navigation shell ---------- */
.navbar-area.industrial-header {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    z-index: 1000;
    background: #ffffff !important;
    border-bottom: 1px solid #edf0f2;
    box-shadow: none;
}

.industrial-header .cyberguard-nav {
    padding: 0;
    background: #ffffff;
}

.industrial-header .cyberguard-nav .navbar {
    width: 100%;
    min-height: 96px;
    padding: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

/* ---------- Logo ---------- */
.industrial-header .cyberguard-nav .navbar-brand {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    margin: 0 42px 0 0;
    padding: 0;
}

.industrial-header .cyberguard-nav .navbar-brand .white-logo {
    display: none !important;
}

.industrial-header .cyberguard-nav .navbar-brand .black-logo {
    display: block !important;
}

.industrial-header .navbar-brand img {
    display: block;
    width: auto;
    max-width: 320px;
    max-height: 64px;
    object-fit: contain;
    border-radius: 0;
    transition: none !important;
}

/* ---------- Center menu ---------- */
.industrial-header .cyberguard-nav .navbar-collapse {
    min-width: 0;
    flex: 1 1 auto;
    display: flex !important;
    align-items: center;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 28px;
    margin: 0 auto;
    padding: 0;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 96px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #1d2934 !important;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 650;
    letter-spacing: -.15px;
    text-transform: none;
    white-space: nowrap;
    box-shadow: none !important;
    transition: color .2s ease !important;
}

/* Keep any caret compact. This also removes the oversized square toggle
   produced by some Bootstrap/Walker combinations. */
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a i,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > i,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > button,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > .submenu-toggle,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > .dropdown-toggle:not(a) {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 0 7px !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #1d2934 !important;
    box-shadow: none !important;
    line-height: 1 !important;
    font-size: 11px !important;
    position: static !important;
    transform: none !important;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a i {
    top: 0;
    margin-left: 7px !important;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a.dropdown-toggle::after {
    margin-left: 7px;
    vertical-align: middle;
    border-top-width: 5px;
    border-right-width: 4px;
    border-left-width: 4px;
}

/* Flat hover: text + small underline only */
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 22px;
    width: 0;
    height: 2px;
    border-radius: 2px;
    background: #e88400;
    transform: translateX(-50%);
    transition: width .22s ease;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:hover > a,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:focus-within > a {
    color: #d77700 !important;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:hover > a::before,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:focus-within > a::before {
    width: 24px;
}

/* Active item: flat text + underline, no card/pill */
.industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-item > a,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-parent > a,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .current_page_item > a,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item.active > a,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a.active {
    color: #d77700 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-item > a::before,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-parent > a::before,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .current_page_item > a::before,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item.active > a::before,
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a.active::before {
    width: 30px;
}

/* Remove older active pseudo elements if present */
.industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::after {
    box-shadow: none;
}

/* ---------- Dropdown: flat white panel ---------- */
.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu {
    top: calc(100% + 1px);
    left: -18px;
    width: 248px;
    padding: 8px 0;
    overflow: visible;
    border: 1px solid #e9edf0;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(21, 38, 54, .10);
}

.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item:hover > .dropdown-menu {
    top: 100%;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li {
    padding: 0;
    border-bottom: 0;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
    margin: 0 !important;
    padding: 11px 18px !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #31404d !important;
    font-size: 14.5px;
    line-height: 1.4;
    font-weight: 550;
    box-shadow: none !important;
}

.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover,
.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus,
.industrial-header .cyberguard-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active {
    padding-left: 18px !important;
    border-left-color: #e88400 !important;
    color: #c96b00 !important;
    background: #fff9f2 !important;
}

/* ---------- Right CTA: flat rectangle, not oversized ---------- */
.industrial-header .cyberguard-nav .navbar .other-option {
    flex: 0 0 auto;
    margin: 0 0 0 38px;
}

.industrial-header .cyberguard-nav .navbar .other-option .default-btn {
    min-width: 174px;
    min-height: 52px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    overflow: hidden;
    border: 1px solid #e88400;
    border-radius: 8px;
    background: #e88400;
    color: #ffffff !important;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: none !important;
    transition: background-color .2s ease, border-color .2s ease !important;
}

.industrial-header .cyberguard-nav .navbar .other-option .default-btn::after {
    content: "\2192";
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
}

.industrial-header .cyberguard-nav .navbar .other-option .default-btn span {
    display: none !important;
}

.industrial-header .cyberguard-nav .navbar .other-option .default-btn:hover,
.industrial-header .cyberguard-nav .navbar .other-option .default-btn:focus {
    color: #ffffff !important;
    background: #cf7600;
    border-color: #cf7600;
    box-shadow: none !important;
    transform: none !important;
}

/* ---------- Sticky: same visual language, slightly shorter ---------- */
.navbar-area.industrial-header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #ffffff !important;
    border-bottom: 1px solid #e6eaed;
    box-shadow: 0 6px 20px rgba(18, 36, 52, .08);
}

.industrial-header.is-sticky .cyberguard-nav {
    padding: 0;
}

.industrial-header.is-sticky .cyberguard-nav .navbar {
    min-height: 78px;
}

.industrial-header.is-sticky .navbar-brand img {
    max-height: 52px;
}

.industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
    min-height: 78px;
}

.industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before {
    bottom: 15px;
}

.industrial-header.is-sticky .cyberguard-nav .navbar .other-option .default-btn {
    min-height: 46px;
    min-width: 160px;
}

.industrial-header.is-sticky + .main-banner,
.industrial-header.is-sticky + section {
    margin-top: 0;
}

/* ---------- Desktop scaling ---------- */
@media (max-width: 1700px) and (min-width: 1400px) {
    .industrial-header .cyberguard-nav .navbar-brand {
        margin-right: 32px;
    }

    .industrial-header .navbar-brand img {
        max-width: 285px;
        max-height: 58px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        gap: 21px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        font-size: 16px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option {
        margin-left: 28px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option .default-btn {
        min-width: 158px;
        padding: 0 18px;
        font-size: 15px;
    }
}

@media (max-width: 1399px) and (min-width: 1200px) {
    .industrial-topbar .container,
    .industrial-header .cyberguard-nav > .container {
        padding-left: 22px;
        padding-right: 22px;
    }

    .industrial-header .cyberguard-nav .navbar-brand {
        margin-right: 22px;
    }

    .industrial-header .navbar-brand img {
        max-width: 235px;
        max-height: 54px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        gap: 13px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        font-size: 14.5px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option {
        margin-left: 18px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option .default-btn {
        min-width: 142px;
        min-height: 48px;
        padding: 0 14px;
        font-size: 14px;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    .industrial-topbar {
        font-size: 12px;
    }

    .industrial-header .cyberguard-nav .navbar {
        min-height: 84px;
    }

    .industrial-header .cyberguard-nav .navbar-brand {
        margin-right: 14px;
    }

    .industrial-header .navbar-brand img {
        max-width: 190px;
        max-height: 48px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        gap: 8px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        min-height: 84px;
        font-size: 13px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before {
        bottom: 16px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option {
        margin-left: 12px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option .default-btn {
        min-width: 118px;
        min-height: 44px;
        padding: 0 12px;
        font-size: 12.5px;
        gap: 7px;
    }
}

/* ---------- Mobile ---------- */
@media (max-width: 991px) {
    .industrial-topbar {
        display: none !important;
    }

    .navbar-area.industrial-header,
    .navbar-area.industrial-header.is-sticky {
        padding: 0;
        min-height: 72px;
        background: #ffffff !important;
        border-bottom: 1px solid #e7ebee;
        box-shadow: none;
    }

    .industrial-header .cyberguard-responsive-nav {
        display: block;
        padding: 9px 0;
    }

    .industrial-header .cyberguard-responsive-nav .cyberguard-responsive-menu {
        min-height: 54px;
        display: flex;
        align-items: center;
    }

    .industrial-header .cyberguard-responsive-nav .logo {
        width: auto;
        max-width: 72%;
    }

    .industrial-header .cyberguard-responsive-nav .logo .white-logo {
        display: none !important;
    }

    .industrial-header .cyberguard-responsive-nav .logo .black-logo {
        display: block !important;
        width: auto;
        max-height: 48px;
        border-radius: 0;
    }

    .industrial-header .mean-container a.meanmenu-reveal {
        top: 50% !important;
        right: 24px !important;
        transform: translateY(-50%);
        color: #1d2934 !important;
    }

    .industrial-header .mean-container a.meanmenu-reveal span {
        background: #1d2934 !important;
    }

    .industrial-header .mean-container .mean-nav {
        margin-top: 63px;
        background: #ffffff;
        box-shadow: 0 12px 25px rgba(18, 36, 52, .10);
    }

    .industrial-header .mean-container .mean-nav ul li a {
        color: #263542;
        background: #ffffff;
        border-top: 1px solid #edf0f2;
        font-size: 14px;
        font-weight: 600;
    }

    .industrial-header .mean-container .mean-nav ul li a:hover,
    .industrial-header .mean-container .mean-nav ul li a.active {
        color: #c96b00;
        background: #fff9f2;
    }
}

@media (max-width: 575px) {
    .industrial-header .cyberguard-responsive-nav > .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .industrial-header .cyberguard-responsive-nav .logo .black-logo {
        max-height: 42px;
        max-width: 230px;
    }

    .industrial-header .mean-container a.meanmenu-reveal {
        right: 16px !important;
    }
}

/* ==========================================================
   V19 - Even Full-Width Navigation Distribution
   Goal: evenly spaced, clean, flat, balanced across header
   ========================================================== */

@media (min-width: 1200px) {
    /* Use the full available header width instead of bunching items in center */
    .industrial-header .cyberguard-nav > .container {
        max-width: 100% !important;
        width: 100%;
        padding-left: clamp(24px, 2.2vw, 42px);
        padding-right: clamp(24px, 2.2vw, 42px);
    }

    .industrial-header .cyberguard-nav .navbar {
        width: 100%;
        min-height: 92px;
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }

    /* Logo remains stable on the left */
    .industrial-header .cyberguard-nav .navbar-brand {
        flex: 0 0 auto;
        margin: 0 clamp(24px, 2.2vw, 44px) 0 0;
    }

    .industrial-header .navbar-brand img {
        max-width: clamp(235px, 15.2vw, 305px);
        max-height: 60px;
    }

    /* Menu + CTA consume all remaining width */
    .industrial-header .cyberguard-nav .navbar-collapse {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
        display: flex !important;
        align-items: center;
    }

    /* Each top-level menu item gets an equal cell.
       This produces true even distribution regardless of label length. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        flex: 1 1 0;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        padding: 0;
        display: flex;
        align-items: stretch;
        justify-content: space-between;
        gap: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item {
        flex: 1 1 0;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        align-items: stretch;
        justify-content: center;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        width: 100%;
        min-width: 0;
        min-height: 92px;
        padding: 0 8px !important;
        margin: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        white-space: nowrap;
        font-size: clamp(14.5px, .9vw, 17px);
        font-weight: 650;
        letter-spacing: -.12px;
    }

    /* Keep flat hover/active indicator centered inside each equal cell */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before {
        bottom: 18px;
        height: 2px;
    }

    /* CTA is visually separated but still part of the overall rhythm */
    .industrial-header .cyberguard-nav .navbar .other-option {
        flex: 0 0 auto;
        margin: 0 0 0 clamp(24px, 2vw, 40px);
    }

    .industrial-header .cyberguard-nav .navbar .other-option .default-btn {
        min-width: clamp(150px, 8.8vw, 174px);
        min-height: 50px;
        padding: 0 20px;
        border-radius: 7px;
        font-size: clamp(14px, .85vw, 16px);
    }

    /* Sticky keeps the same even distribution */
    .industrial-header.is-sticky .cyberguard-nav .navbar {
        min-height: 76px;
    }

    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        min-height: 76px;
    }

    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before {
        bottom: 14px;
    }
}

/* Medium desktop: retain even rhythm without forcing equal-width cells too hard */
@media (min-width: 992px) and (max-width: 1199px) {
    .industrial-header .cyberguard-nav > .container {
        max-width: 100% !important;
        width: 100%;
        padding-left: 18px;
        padding-right: 18px;
    }

    .industrial-header .cyberguard-nav .navbar-brand {
        margin-right: 18px;
    }

    .industrial-header .cyberguard-nav .navbar-collapse {
        flex: 1 1 0;
        min-width: 0;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        flex: 1 1 0;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        gap: 0 !important;
        justify-content: space-between;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item {
        flex: 0 0 auto;
        margin: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        padding: 0 5px !important;
        font-size: 12.6px;
        letter-spacing: -.2px;
    }

    .industrial-header .cyberguard-nav .navbar .other-option {
        margin-left: 16px;
    }
}

/* ==========================================================
   V20 - Equal Visual Spacing Navigation
   Goal: every top-level label has the same visible gap,
         while the menu fills the available navigation area.
   ========================================================== */

@media (min-width: 1200px) {
    .industrial-header .cyberguard-nav > .container {
        width: 100%;
        max-width: 100% !important;
        padding-left: clamp(28px, 2.1vw, 42px);
        padding-right: clamp(28px, 2.1vw, 42px);
    }

    .industrial-header .cyberguard-nav .navbar {
        width: 100%;
        min-height: 90px;
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }

    /* Keep logo compact and visually separated from the menu. */
    .industrial-header .cyberguard-nav .navbar-brand {
        flex: 0 0 auto !important;
        margin: 0 clamp(26px, 2vw, 40px) 0 0 !important;
        padding: 0 !important;
    }

    .industrial-header .navbar-brand img {
        max-width: clamp(230px, 15vw, 300px);
        max-height: 58px;
    }

    /* The collapse area owns the remaining width. */
    .industrial-header .cyberguard-nav .navbar-collapse {
        display: flex !important;
        align-items: center;
        flex: 1 1 0 !important;
        min-width: 0;
    }

    /* KEY FIX:
       Natural-width items + space-evenly = equal visible whitespace
       between the right edge of one label and the left edge of the next.
       Do not use equal-width cells here. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: space-evenly !important;
        gap: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        width: auto !important;
        min-width: 0 !important;
        min-height: 90px;
        margin: 0 !important;
        padding: 0 6px !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        column-gap: 9px;
        color: #172635 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        font-size: clamp(15.5px, .9vw, 17px);
        line-height: 1;
        font-weight: 650;
        letter-spacing: -0.12px;
        white-space: nowrap;
        text-align: center;
        box-shadow: none !important;
        transition: color .22s ease !important;
    }

    /* Dropdown arrow belongs to its label; it does not create another menu cell. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a i {
        position: relative;
        top: 0;
        margin: 0 !important;
        font-size: 12px;
        line-height: 1;
        color: currentColor;
        transition: color .22s ease !important;
    }

    /* Flat hover: text color only. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:hover > a,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:focus-within > a {
        color: #d97800 !important;
        background: transparent !important;
    }

    /* Clean active underline, centered under the actual label. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-item > a,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-parent > a,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current_page_item > a,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item.active > a,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a.active {
        color: #d97800 !important;
        background: transparent !important;
        border: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::before,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a::after {
        display: none !important;
        content: none !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-item > a::after,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current-menu-parent > a::after,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .current_page_item > a::after,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item.active > a::after,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a.active::after {
        content: "" !important;
        display: block !important;
        position: absolute;
        left: 50%;
        bottom: 15px;
        width: 30px;
        height: 3px;
        border-radius: 3px;
        background: #e38208;
        transform: translateX(-50%);
    }

    /* CTA remains compact; avoid stealing too much room from menu spacing. */
    .industrial-header .cyberguard-nav .navbar .other-option {
        flex: 0 0 auto !important;
        margin: 0 0 0 clamp(24px, 1.8vw, 34px) !important;
    }

    .industrial-header .cyberguard-nav .navbar .other-option .default-btn {
        min-width: clamp(146px, 8.4vw, 168px);
        min-height: 48px;
        padding: 0 20px;
        border-radius: 6px;
        font-size: clamp(14px, .82vw, 15.5px);
        box-shadow: none !important;
    }

    /* Sticky state keeps exactly the same spacing logic. */
    .industrial-header.is-sticky .cyberguard-nav .navbar {
        min-height: 74px;
    }

    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        min-height: 74px;
    }

    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .current-menu-item > a::after,
    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .current-menu-parent > a::after,
    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .current_page_item > a::after,
    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item.active > a::after,
    .industrial-header.is-sticky .cyberguard-nav .navbar .navbar-nav > .nav-item > a.active::after {
        bottom: 11px;
    }
}

/* 992-1199px: same visual rule, slightly tighter typography. */
@media (min-width: 992px) and (max-width: 1199px) {
    .industrial-header .cyberguard-nav > .container {
        max-width: 100% !important;
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .industrial-header .cyberguard-nav .navbar-collapse {
        flex: 1 1 0 !important;
        min-width: 0;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav {
        flex: 1 1 0 !important;
        width: auto !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center;
        justify-content: space-evenly !important;
        gap: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item {
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item > a {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 3px !important;
        font-size: 12.4px;
        letter-spacing: -.16px;
        white-space: nowrap;
    }

    .industrial-header .cyberguard-nav .navbar .other-option {
        margin-left: 12px !important;
    }
}

/* ==========================================================
   V21 - Products Mega Dropdown Optimization
   Purpose: keep long product category lists fully visible,
            compact, balanced and easy to scan.
   The Products item is the 3rd top-level navigation item.
   ========================================================== */

@media (min-width: 1200px) {
    /* Products: convert long vertical list into a clean mega dropdown. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) {
        position: relative;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu {
        left: 50% !important;
        right: auto !important;
        top: calc(100% + 2px) !important;
        width: min(760px, calc(100vw - 64px)) !important;
        max-width: calc(100vw - 64px) !important;
        max-height: min(620px, calc(100vh - 130px));
        margin: 0 !important;
        padding: 18px !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: minmax(46px, auto);
        column-gap: 16px;
        row-gap: 4px;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        transform: translateX(-50%);
        border: 1px solid #e8edf1 !important;
        border-radius: 10px !important;
        background: #ffffff !important;
        box-shadow: 0 18px 42px rgba(21, 39, 54, .14) !important;
        scrollbar-width: thin;
        scrollbar-color: #c8d0d6 transparent;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3):hover > .dropdown-menu,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3):focus-within > .dropdown-menu {
        top: 100% !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li > a {
        width: 100% !important;
        min-height: 46px;
        margin: 0 !important;
        padding: 10px 14px !important;
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        overflow: visible !important;
        color: #243746 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 6px !important;
        font-size: 15px !important;
        line-height: 1.35 !important;
        font-weight: 600 !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
        word-break: normal;
        overflow-wrap: anywhere;
        text-transform: none !important;
        box-shadow: none !important;
        transition: color .18s ease, background-color .18s ease !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li > a:hover,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li > a:focus,
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li.current-menu-item > a {
        padding-left: 14px !important;
        color: #d97800 !important;
        background: #fff7ed !important;
    }

    /* Keep child arrows aligned and prevent them from compressing text. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li > a i {
        flex: 0 0 auto;
        margin-left: auto !important;
        padding-left: 10px;
    }

    /* Scrollbar is intentionally subtle when the viewport is short. */
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu::-webkit-scrollbar {
        width: 6px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu::-webkit-scrollbar-thumb {
        background: #c8d0d6;
        border-radius: 10px;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu::-webkit-scrollbar-track {
        background: transparent;
    }
}

/* Large screens: use three columns so the Products list stays short. */
@media (min-width: 1600px) {
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu {
        width: min(980px, calc(100vw - 96px)) !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 18px;
        padding: 20px !important;
    }
}

/* 992-1199px: preserve full text with a two-column compact dropdown. */
@media (min-width: 992px) and (max-width: 1199px) {
    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu {
        left: 50% !important;
        right: auto !important;
        width: min(620px, calc(100vw - 32px)) !important;
        max-width: calc(100vw - 32px) !important;
        max-height: calc(100vh - 110px);
        padding: 14px !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px 12px;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        transform: translateX(-50%) !important;
        border-radius: 8px !important;
    }

    .industrial-header .cyberguard-nav .navbar .navbar-nav > .nav-item:nth-child(3) > .dropdown-menu > li > a {
        min-height: 42px;
        padding: 9px 11px !important;
        font-size: 13.5px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }
}
/*产品推荐css*/
/* ==========================================================
   FEATURED PRODUCTS
   Category ID = 508

   Desktop:
   3 Columns × 3 Rows

   Tablet:
   2 Columns

   Mobile:
   1 Column
   ========================================================== */



/* ==========================================================
   Section
   ========================================================== */

.featured-products-section {

	position: relative;

	padding: 85px 0 90px;

	background: #f6f8fa;

}



/* ==========================================================
   Heading
   ========================================================== */

.featured-products-heading {

	max-width: 760px;

	margin: 0 auto 48px;

	text-align: center;

}


.featured-products-subtitle {

	display: inline-block;

	margin-bottom: 11px;

	color: #e78300;

	font-size: 14px;

	line-height: 1;

	font-weight: 700;

	letter-spacing: 1.5px;

	text-transform: uppercase;

}


.featured-products-heading h2 {

	margin: 0 0 14px;

	color: #172635;

	font-size: 40px;

	line-height: 1.2;

	font-weight: 700;

}


.featured-products-heading p {

	max-width: 670px;

	margin: 0 auto;

	color: #707b84;

	font-size: 16px;

	line-height: 1.75;

}



/* ==========================================================
   Products Grid
   ========================================================== */

.featured-products-row {

	display: flex;

	flex-wrap: wrap;

}


.featured-product-column {

	display: flex;

}



/* ==========================================================
   Product Card
   ========================================================== */

.featured-product-card {

	position: relative;

	display: flex;

	flex-direction: column;

	width: 100%;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	overflow: hidden;

	background: #ffffff;

	border: 1px solid #e1e6ea;

	border-radius: 8px;

	transition:
			transform .25s ease,
			border-color .25s ease,
			box-shadow .25s ease;

}


.featured-product-card:hover {

	transform: translateY(-4px);

	border-color: #d8dfe4;

	box-shadow:
			0 16px 36px
			rgba(23, 38, 53, .09);

}



/* ==========================================================
   Product Image Area

   重点修改：
   1. 图片区域显著放大
   2. 去掉原有 padding
   3. 图片最大化显示
   4. 保持完整，不裁切
   ========================================================== */

.featured-product-image {

	position: relative;

	width: 100%;

	aspect-ratio: 1 / .90;

	overflow: hidden;

	background: #ffffff;

	border-bottom: 1px solid #e8edf0;

}



/* 主图链接 */

.featured-product-image-main-link {

	display: flex !important;

	width: 100%;

	height: 100%;

	align-items: center;

	justify-content: center;

	overflow: hidden;

}



/* ==========================================================
   Product Main Image

   取消 padding，使主图真正放大
   ========================================================== */

.featured-product-thumbnail {

	display: block;

	width: 100% !important;

	height: 100% !important;

	max-width: none !important;

	padding: 0 !important;

	margin: 0 !important;

	object-fit: contain;

	object-position: center;

	background: #ffffff;

	border-radius: 0 !important;

	transition:
			transform .35s ease;

}



/* 鼠标经过轻微放大 */

.featured-product-card:hover
.featured-product-thumbnail {

	transform: scale(1.035);

}



/* ==========================================================
   重要：
   彻底禁止旧 Featured 标签再次显示
   ========================================================== */

.featured-product-badge {

	display: none !important;

}



/* ==========================================================
   Image Arrow
   ========================================================== */

.featured-product-image-link {

	position: absolute;

	right: 18px;

	bottom: 18px;

	z-index: 5;

	display: flex;

	width: 48px;

	height: 48px;

	align-items: center;

	justify-content: center;

	color: #172635 !important;

	background: rgba(255, 255, 255, .96);

	border: 1px solid #dce3e8;

	border-radius: 50%;

	opacity: 0;

	visibility: hidden;

	transform: translateY(8px);

	box-shadow:
			0 6px 20px
			rgba(23, 38, 53, .09);

	transition:
			opacity .25s ease,
			visibility .25s ease,
			transform .25s ease,
			color .2s ease,
			background-color .2s ease,
			border-color .2s ease !important;

}


.featured-product-image-link i {

	font-size: 15px;

}


.featured-product-card:hover
.featured-product-image-link {

	opacity: 1;

	visibility: visible;

	transform: translateY(0);

}


.featured-product-image-link:hover {

	color: #ffffff !important;

	background: #e78300;

	border-color: #e78300;

}



/* ==========================================================
   Product Content
   ========================================================== */

.featured-product-content {

	display: flex;

	flex: 1;

	flex-direction: column;

	padding: 23px 24px 25px;

}



/* ==========================================================
   Product Title
   ========================================================== */

.featured-product-title {

	min-height: 58px;

	margin: 0 0 12px;

	color: #172635;

	font-size: 20px;

	line-height: 1.45;

	font-weight: 700;

}


.featured-product-title a {

	color: #172635;

	text-decoration: none;

	transition:
			color .2s ease !important;

}


.featured-product-title a:hover {

	color: #e78300;

}



/* ==========================================================
   Product Description
   ========================================================== */

.featured-product-description {

	margin-bottom: 20px;

	color: #727d86;

	font-size: 14px;

	line-height: 1.75;

}



/* ==========================================================
   Product Footer
   ========================================================== */

.featured-product-footer {

	margin-top: auto;

	padding-top: 17px;

	border-top:
			1px solid #edf0f2;

}



/* ==========================================================
   View Details
   ========================================================== */

.featured-product-btn {

	display: inline-flex;

	align-items: center;

	gap: 9px;

	color: #172635 !important;

	font-size: 14px;

	line-height: 1;

	font-weight: 700;

	text-decoration: none;

	transition:
			color .2s ease !important;

}


.featured-product-btn i {

	color: #e78300;

	font-size: 12px;

	transition:
			transform .2s ease;

}


.featured-product-btn:hover {

	color: #e78300 !important;

}


.featured-product-btn:hover i {

	transform: translateX(4px);

}



/* ==========================================================
   View All Products
   ========================================================== */

.featured-products-more {

	margin-top: 20px;

	text-align: center;

}


.featured-products-all-btn {

	display: inline-flex;

	min-height: 52px;

	padding: 0 28px;

	align-items: center;

	justify-content: center;

	gap: 10px;

	color: #ffffff !important;

	background: #e78300;

	border: 1px solid #e78300;

	border-radius: 5px;

	font-size: 15px;

	line-height: 1;

	font-weight: 700;

	text-decoration: none;

	transition:
			background-color .2s ease,
			border-color .2s ease !important;

}


.featured-products-all-btn:hover {

	color: #ffffff !important;

	background: #c97000;

	border-color: #c97000;

}



/* ==========================================================
   No Products
   ========================================================== */

.featured-products-empty {

	width: 100%;

	padding: 55px 20px;

	text-align: center;

	background: #ffffff;

	border: 1px solid #e1e6ea;

	border-radius: 8px;

}


.featured-products-empty h3 {

	margin: 0 0 8px;

	color: #172635;

	font-size: 22px;

}


.featured-products-empty p {

	margin: 0;

	color: #727d86;

}



/* ==========================================================
   Large Desktop
   >= 1400px

   主图进一步突出
   ========================================================== */

@media (min-width: 1400px) {

	.featured-product-image {

		aspect-ratio: 1 / .88;

	}

}



/* ==========================================================
   Desktop
   >= 992px
   3 columns
   ========================================================== */

@media (min-width: 992px) {

	.featured-product-column {

		width: 33.333333%;

	}

}



/* ==========================================================
   Desktop 992 - 1199
   ========================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

	.featured-products-section {

		padding: 75px 0 80px;

	}


	.featured-product-image {

		aspect-ratio: 1 / .92;

	}


	.featured-product-content {

		padding: 21px 20px 23px;

	}


	.featured-product-title {

		font-size: 18px;

	}

}



/* ==========================================================
   Tablet
   768 - 991
   2 columns
   ========================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

	.featured-products-section {

		padding: 65px 0 70px;

	}


	.featured-products-heading {

		margin-bottom: 38px;

	}


	.featured-products-heading h2 {

		font-size: 34px;

	}


	.featured-product-image {

		aspect-ratio: 1 / .92;

	}


	.featured-product-title {

		min-height: 52px;

		font-size: 18px;

	}

}



/* ==========================================================
   Mobile
   <= 767px
   1 column
   ========================================================== */

@media (max-width: 767px) {

	.featured-products-section {

		padding: 50px 0 55px;

	}


	.featured-products-heading {

		margin-bottom: 32px;

		padding: 0 10px;

	}


	.featured-products-subtitle {

		font-size: 12px;

		letter-spacing: 1.2px;

	}


	.featured-products-heading h2 {

		margin-bottom: 12px;

		font-size: 28px;

	}


	.featured-products-heading p {

		font-size: 14px;

		line-height: 1.7;

	}


	.featured-product-card {

		height: auto;

		margin-bottom: 22px;

	}


	.featured-product-image {

		aspect-ratio: 1 / .92;

	}


	.featured-product-content {

		padding: 20px;

	}


	.featured-product-title {

		min-height: auto;

		font-size: 19px;

	}


	/*
     * 手机没有 hover，
     * 因此箭头默认显示
     */
	.featured-product-image-link {

		width: 44px;

		height: 44px;

		right: 14px;

		bottom: 14px;

		opacity: 1;

		visibility: visible;

		transform: none;

	}


	.featured-products-more {

		margin-top: 12px;

	}

}



/* ==========================================================
   Small Mobile
   <= 480px
   ========================================================== */

@media (max-width: 480px) {

	.featured-product-image {

		aspect-ratio: 1 / .94;

	}


	.featured-product-content {

		padding: 18px;

	}


	.featured-product-title {

		font-size: 18px;

	}


	.featured-products-all-btn {

		width: 100%;

		max-width: 280px;

	}

}
/* ==========================================================
   Featured Products 主图最终修复
   去除左右白边 / 图片铺满 / 不变形
   ========================================================== */

.featured-products-section .featured-product-image {
	position: relative !important;

	width: 100% !important;

	/* 产品图基本为方图，使用 1:1 */
	aspect-ratio: 1 / 1 !important;

	height: auto !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;

	background: #ffffff !important;

	border: 0 !important;
	border-bottom: 1px solid #e8edf0 !important;
}


/* 主图链接占满整个区域 */
.featured-products-section .featured-product-image-main-link,
.featured-products-section .featured-product-image > a:first-child {

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;
}


/* 主图真正铺满 */
.featured-products-section .featured-product-thumbnail {

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	max-width: none !important;
	max-height: none !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	/*
     * cover 不会拉伸变形，
     * 只会在图片比例不一致时裁切少量边缘
     */
	object-fit: cover !important;

	object-position: center center !important;

	background: transparent !important;

	transform: none;

	transition: transform .35s ease !important;
}


/* 鼠标经过轻微放大 */
.featured-products-section
.featured-product-card:hover
.featured-product-thumbnail {

	transform: scale(1.025) !important;
}


/* 防止 Bootstrap / 主题 img-fluid 限制图片尺寸 */
.featured-products-section
.featured-product-image img {

	width: 100% !important;

	height: 100% !important;

	max-width: none !important;

	margin: 0 !important;

	padding: 0 !important;
}


/* ==========================================================
   PC
   ========================================================== */

@media (min-width: 992px) {

	.featured-products-section .featured-product-image {

		aspect-ratio: 1 / 1 !important;

	}

}


/* ==========================================================
   Tablet
   ========================================================== */

@media (min-width: 768px) and (max-width: 991px) {

	.featured-products-section .featured-product-image {

		aspect-ratio: 1 / 1 !important;

	}

}


/* ==========================================================
   Mobile
   ========================================================== */

@media (max-width: 767px) {

	.featured-products-section .featured-product-image {

		aspect-ratio: 1 / 1 !important;

	}

}
/*首页产品中心*/
/* ==========================================================
   INDUSTRIAL PRODUCT CATALOG V3
   Export B2B Industrial Product Layout
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

.industrial-catalog-section {

	position: relative;

	padding: 68px 0 76px;

	overflow: hidden;

	background:
			linear-gradient(
					180deg,
					#ffffff 0%,
					#fafbfc 100%
			);

}



/* subtle background */
.industrial-catalog-section::before {

	content: "";

	position: absolute;

	top: -120px;
	right: -180px;

	width: 440px;
	height: 440px;

	border-radius: 50%;

	background:
			radial-gradient(
					circle,
					rgba(227, 131, 0, .05) 0%,
					rgba(227, 131, 0, 0) 70%
			);

	pointer-events: none;

}



/* ==========================================================
   HEADER
   ========================================================== */

.industrial-catalog-header {

	position: relative;

	z-index: 2;

	display: grid;

	grid-template-columns:
        minmax(0, 1.05fr)
        minmax(360px, .95fr);

	gap: 64px;

	align-items: end;

	margin-bottom: 42px;

	padding-bottom: 28px;

	border-bottom:
			1px solid #e3e8ec;

}



/* ==========================================================
   KICKER
   ========================================================== */

.industrial-catalog-kicker {

	position: relative;

	display: inline-flex;

	margin-bottom: 13px;

	padding-left: 30px;

	align-items: center;

	color: #d97900;

	font-size: 13px;

	line-height: 1;

	font-weight: 700;

	letter-spacing: 1.7px;

	text-transform: uppercase;

}


.industrial-catalog-kicker::before {

	content: "";

	position: absolute;

	left: 0;

	width: 20px;

	height: 2px;

	background:
			#e78300;

}



/* ==========================================================
   H2
   ========================================================== */

.industrial-catalog-heading h2 {

	max-width: 670px;

	margin: 0;

	color: #132a3a;

	font-size: 40px;

	line-height: 1.17;

	font-weight: 700;

	letter-spacing: -.6px;

}



/* ==========================================================
   HEADER INTRO
   ========================================================== */

.industrial-catalog-intro {

	max-width: 570px;

	justify-self: end;

}


.industrial-catalog-intro p {

	margin: 0 0 15px;

	color: #65727c;

	font-size: 15px;

	line-height: 1.8;

}



/* ==========================================================
   TOP LINK
   ========================================================== */

.industrial-catalog-top-link {

	display: inline-flex;

	align-items: center;

	gap: 10px;

	color: #d97900 !important;

	font-size: 14px;

	line-height: 1;

	font-weight: 700;

	text-decoration: none;

}


.industrial-catalog-top-link i {

	font-size: 13px;

	transition:
			transform .22s ease;

}


.industrial-catalog-top-link:hover i {

	transform:
			translateX(5px);

}



/* ==========================================================
   GRID
   ========================================================== */

.industrial-catalog-grid {

	position: relative;

	z-index: 2;

	display: flex;

	flex-wrap: wrap;

}


.industrial-catalog-column {

	display: flex;

}



/* ==========================================================
   CARD
   ========================================================== */

.industrial-catalog-card {

	position: relative;

	display: flex;

	flex-direction: column;

	width: 100%;

	height: calc(100% - 26px);

	margin-bottom: 26px;

	overflow: hidden;

	background:
			#ffffff;

	border:
			1px solid #dfe5e9;

	border-radius:
			6px;

	box-shadow:
			0 3px 12px
			rgba(20, 42, 57, .035);

	transition:
			border-color .24s ease,
			box-shadow .24s ease;

}


.industrial-catalog-card:hover {

	border-color:
			#c8d2d9;

	box-shadow:
			0 16px 35px
			rgba(20, 42, 57, .08);

}



/* ==========================================================
   CARD TOP LINE
   ========================================================== */

.industrial-catalog-card::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;

	z-index: 10;

	width: 0;

	height: 3px;

	background:
			#e78300;

	transition:
			width .3s ease;

}


.industrial-catalog-card:hover::before {

	width: 100%;

}



/* ==========================================================
   PRODUCT IMAGE AREA

   重点：
   1:1 大图片
   完整显示
   不裁切
   ========================================================== */

.industrial-catalog-media {

	position: relative;

	width: 100%;

	/*
     * 方形大图
     */
	aspect-ratio: 1 / 1;

	overflow: hidden;

	background:
			#f4f6f7;

	border-bottom:
			1px solid #e3e8ec;

}



/* ==========================================================
   IMAGE LINK
   ========================================================== */

.industrial-catalog-image-link {

	display: flex;

	width: 100%;

	height: 100%;

	align-items: center;

	justify-content: center;

	margin: 0;

	padding: 0;

	overflow: hidden;

	background:
			#ffffff;

}



/* ==========================================================
   MAIN IMAGE
   ========================================================== */

.industrial-catalog-image {

	display: block;

	width: 100% !important;

	height: 100% !important;

	max-width: 100% !important;

	max-height: 100% !important;

	margin: 0 !important;

	padding: 0 !important;


	/*
     * contain：
     *
     * 完整显示整张图片
     * 不裁掉顶部
     * 不裁掉底部
     * 不拉伸
     */
	object-fit:
			contain !important;


	object-position:
			center center !important;


	background:
			#ffffff;


	border:
			0 !important;


	border-radius:
			0 !important;


	transform:
			none !important;


	transition:
			transform .32s ease;

}



/*
 * Hover：
 * 非常轻微的放大
 *
 * 和上一个板块保持不同
 */
.industrial-catalog-card:hover
.industrial-catalog-image {

	transform:
			scale(1.012) !important;

}



/* ==========================================================
   NUMBER
   ========================================================== */

.industrial-catalog-number {

	position: absolute;

	right: 15px;

	bottom: 15px;

	z-index: 5;

	display: flex;

	min-width: 44px;

	height: 32px;

	padding:
			0 10px;

	align-items: center;

	justify-content: center;

	color:
			#ffffff;

	background:
			rgba(20, 43, 59, .90);

	border-radius:
			2px;

	font-size:
			12px;

	line-height:
			1;

	font-weight:
			700;

	letter-spacing:
			1px;

	box-shadow:
			0 4px 14px
			rgba(20, 43, 59, .12);

}



/* ==========================================================
   BODY
   ========================================================== */

.industrial-catalog-body {

	display: flex;

	flex: 1;

	flex-direction: column;

	padding:
			22px
			24px
			23px;

}



/* ==========================================================
   CATEGORY
   ========================================================== */

.industrial-catalog-category {

	margin-bottom:
			9px;

}


.industrial-catalog-category a {

	color:
			#d97900;

	font-size:
			11.5px;

	line-height:
			1.3;

	font-weight:
			700;

	letter-spacing:
			.7px;

	text-decoration:
			none;

	text-transform:
			uppercase;

}



/* ==========================================================
   PRODUCT TITLE
   ========================================================== */

.industrial-catalog-product-title {

	min-height:
			52px;

	margin:
			0
			0
			10px;

	font-size:
			20px;

	line-height:
			1.38;

	font-weight:
			700;

}


.industrial-catalog-product-title a {

	color:
			#142b3b;

	text-decoration:
			none;

	transition:
			color .2s ease;

}


.industrial-catalog-product-title a:hover {

	color:
			#d97900;

}



/* ==========================================================
   DESCRIPTION
   ========================================================== */

.industrial-catalog-description {

	margin:
			0
			0
			18px;

	color:
			#707b83;

	font-size:
			14px;

	line-height:
			1.68;

}



/* ==========================================================
   FOOTER
   ========================================================== */

.industrial-catalog-footer {

	margin-top:
			auto;

	padding-top:
			15px;

	border-top:
			1px solid #e8edef;

}



/* ==========================================================
   PRODUCT LINK
   ========================================================== */

.industrial-catalog-product-link {

	display:
			inline-flex;

	align-items:
			center;

	gap:
			10px;

	color:
			#152c3c !important;

	font-size:
			14px;

	line-height:
			1;

	font-weight:
			700;

	text-decoration:
			none;

}


.industrial-catalog-product-link i {

	color:
			#e78300;

	font-size:
			13px;

	transition:
			transform .22s ease;

}


.industrial-catalog-product-link:hover {

	color:
			#d97900 !important;

}


.industrial-catalog-product-link:hover i {

	transform:
			translateX(6px);

}



/* ==========================================================
   BOTTOM
   ========================================================== */

.industrial-catalog-bottom {

	position:
			relative;

	z-index:
			2;

	margin-top:
			16px;

	text-align:
			center;

}



/* ==========================================================
   VIEW ALL BUTTON
   ========================================================== */

.industrial-catalog-view-all {

	display:
			inline-flex;

	min-height:
			50px;

	padding:
			0 27px;

	align-items:
			center;

	justify-content:
			center;

	gap:
			10px;

	color:
			#142b3b !important;

	background:
			#ffffff;

	border:
			1px solid #cbd4da;

	border-radius:
			3px;

	font-size:
			14px;

	line-height:
			1;

	font-weight:
			700;

	text-decoration:
			none;

	transition:
			color .22s ease,
			background-color .22s ease,
			border-color .22s ease;

}


.industrial-catalog-view-all i {

	color:
			#d97900;

	transition:
			color .22s ease,
			transform .22s ease;

}


.industrial-catalog-view-all:hover {

	color:
			#ffffff !important;

	background:
			#142b3b;

	border-color:
			#142b3b;

}


.industrial-catalog-view-all:hover i {

	color:
			#ffffff;

	transform:
			translateX(5px);

}



/* ==========================================================
   EMPTY
   ========================================================== */

.industrial-catalog-empty {

	width:
			100%;

	padding:
			50px 20px;

	text-align:
			center;

	background:
			#f7f9fa;

	border:
			1px solid #e2e7eb;

	border-radius:
			4px;

}


.industrial-catalog-empty h3 {

	margin:
			0
			0
			7px;

	color:
			#142b3b;

	font-size:
			22px;

}


.industrial-catalog-empty p {

	margin:
			0;

	color:
			#707b83;

}



/* ==========================================================
   LARGE DESKTOP
   ========================================================== */

@media (min-width: 1200px) {

	.industrial-catalog-media {

		aspect-ratio:
				1 / 1;

	}

}



/* ==========================================================
   DESKTOP
   ========================================================== */

@media (min-width: 992px) {

	.industrial-catalog-column {

		width:
				33.333333%;

	}

}



/* ==========================================================
   DESKTOP 992 - 1199
   ========================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

	.industrial-catalog-section {

		padding:
				60px
				0
				68px;

	}


	.industrial-catalog-header {

		gap:
				38px;

	}


	.industrial-catalog-heading h2 {

		font-size:
				35px;

	}


	.industrial-catalog-media {

		aspect-ratio:
				1 / 1;

	}


	.industrial-catalog-body {

		padding:
				20px;

	}


	.industrial-catalog-product-title {

		font-size:
				18px;

	}

}



/* ==========================================================
   TABLET
   ========================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

	.industrial-catalog-section {

		padding:
				56px
				0
				62px;

	}


	.industrial-catalog-header {

		grid-template-columns:
            1fr;

		gap:
				18px;

		margin-bottom:
				34px;

		padding-bottom:
				24px;

	}


	.industrial-catalog-intro {

		max-width:
				720px;

		justify-self:
				start;

	}


	.industrial-catalog-heading h2 {

		font-size:
				33px;

	}


	.industrial-catalog-media {

		aspect-ratio:
				1 / 1;

	}


	.industrial-catalog-product-title {

		min-height:
				50px;

		font-size:
				18px;

	}

}



/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

	.industrial-catalog-section {

		padding:
				45px
				0
				52px;

	}


	.industrial-catalog-header {

		display:
				block;

		margin-bottom:
				28px;

		padding-bottom:
				22px;

	}


	.industrial-catalog-heading h2 {

		font-size:
				28px;

		line-height:
				1.24;

		letter-spacing:
				-.3px;

	}


	.industrial-catalog-intro {

		margin-top:
				17px;

	}


	.industrial-catalog-intro p {

		font-size:
				14px;

		line-height:
				1.7;

	}


	.industrial-catalog-card {

		height:
				auto;

		margin-bottom:
				21px;

	}


	.industrial-catalog-media {

		aspect-ratio:
				1 / 1;

	}


	.industrial-catalog-body {

		padding:
				19px;

	}


	.industrial-catalog-product-title {

		min-height:
				auto;

		font-size:
				19px;

	}


	.industrial-catalog-description {

		font-size:
				13.5px;

	}


	.industrial-catalog-view-all {

		width:
				100%;

		max-width:
				280px;

	}

}
/*营销*/
/* ==========================================================
   PRODUCT FEATURE SECTION
   ========================================================== */

.product-feature-section {
	position: relative;
	background: #ffffff;
}


/* Section title */
.product-feature-title {
	max-width: 820px;
	margin: 0 auto 42px;
	text-align: center;
}

.product-feature-title h6 {
	margin-bottom: 10px;
	color: #e78300;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}

.product-feature-title h2 {
	margin-bottom: 14px;
	color: #172635;
	font-size: 38px;
	line-height: 1.2;
	font-weight: 700;
}

.product-feature-title p {
	max-width: 700px;
	margin: 0 auto;
	color: #6b7680;
	font-size: 15px;
	line-height: 1.75;
}


/* Card */
.product-feature-item {
	position: relative;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 32px 30px 30px;

	background: #ffffff;

	border: 1px solid #e5e9ed;
	border-radius: 8px;

	box-shadow:
			0 4px 15px
			rgba(23, 38, 53, .035);

	transition:
			border-color .22s ease,
			box-shadow .22s ease,
			transform .22s ease;
}

.product-feature-item:hover {
	transform: translateY(-4px);

	border-color: #d6dde3;

	box-shadow:
			0 14px 32px
			rgba(23, 38, 53, .08);
}


/* orange accent */
.product-feature-item::before {
	content: "";

	position: absolute;

	top: 0;
	left: 30px;

	width: 42px;
	height: 3px;

	background: #e78300;
}


/* icon */
.product-feature-icon {
	display: flex;

	width: 58px;
	height: 58px;

	margin-bottom: 22px;

	align-items: center;
	justify-content: center;

	background: #fff7ed;

	border-radius: 8px;
}

.product-feature-icon img {
	display: block;

	width: 32px;
	height: 32px;

	object-fit: contain;
}


/* title */
.product-feature-item h3 {
	margin: 0 0 12px;

	color: #172635;

	font-size: 21px;
	line-height: 1.35;

	font-weight: 700;
}


/* description */
.product-feature-item p {
	margin: 0;

	color: #6b7680;

	font-size: 14px;
	line-height: 1.75;
}


/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {

	.product-feature-title h2 {
		font-size: 32px;
	}

	.product-feature-item {
		padding: 28px 24px;
	}

}


/* Mobile */
@media (max-width: 767px) {

	.product-feature-title {
		margin-bottom: 32px;
	}

	.product-feature-title h2 {
		font-size: 27px;
	}

	.product-feature-title p {
		font-size: 14px;
	}

	.product-feature-item {
		height: auto;

		padding: 26px 22px;
	}

	.product-feature-item h3 {
		font-size: 19px;
	}

}
/* ==========================================================
   WHY CHOOSE US - COMPACT LAYOUT FIX
   修复：顶部空白过大 + 图标区域过宽 + 排列不协调
   ========================================================== */

/* ----------------------------------------------------------
   1. 整个板块上下间距
   ---------------------------------------------------------- */

.choose-area,
.choose-area.section-padding {
	padding-top: 8px !important;
	padding-bottom: 58px !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}


/* 如果上一个板块就是 Product Feature，进一步收紧衔接 */
.product-feature-section {
	padding-bottom: 35px !important;
	margin-bottom: 0 !important;
}

.product-feature-section + .choose-area {
	padding-top: 42px !important;
}


/* ----------------------------------------------------------
   2. 左右两栏重新协调
   ---------------------------------------------------------- */

.choose-area .container > .row {
	align-items: center !important;
	--bs-gutter-x: 52px;
}


/* 左图 */
.choose-area .choose-images {
	width: 100% !important;
	margin: 0 !important;
}


/* 右侧内容 */
.choose-area .choose-content {
	width: 100%;
	padding-left: 5px !important;
	margin: 0 !important;
}


/* ----------------------------------------------------------
   3. 标题区域压缩
   ---------------------------------------------------------- */

.choose-area .choose-content-info {
	margin: 0 0 22px !important;
	padding: 0 !important;
}


.choose-area .choose-content-info h6 {
	margin: 0 0 10px !important;

	color: #e78300;

	font-size: 13px;
	line-height: 1;

	font-weight: 700;
	letter-spacing: 1.5px;

	text-transform: uppercase;
}


.choose-area .choose-content-info h2 {
	margin: 0 0 15px !important;

	color: #172635;

	font-size: 37px;
	line-height: 1.2;

	font-weight: 700;

	letter-spacing: -.4px;
}


.choose-area .choose-content-info > p {
	margin: 0 !important;

	color: #68747e;

	font-size: 15px;
	line-height: 1.75;
}


/* ----------------------------------------------------------
   4. Features 外层
   ---------------------------------------------------------- */

.choose-area .choose-feature-box {
	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}


/* ----------------------------------------------------------
   5. 单个 Feature
   核心修复红框里的大空白
   ---------------------------------------------------------- */

.choose-area .choose-single-feature {
	position: relative;

	display: grid !important;

	grid-template-columns: 48px minmax(0, 1fr);

	column-gap: 16px !important;

	align-items: start !important;

	width: 100% !important;

	margin: 0 !important;

	padding: 18px 0 !important;

	border-bottom: 1px solid #e5eaee;
}


.choose-area .choose-single-feature:first-child {
	padding-top: 8px !important;
}


.choose-area .choose-single-feature:last-child {
	padding-bottom: 5px !important;

	border-bottom: 0;
}


/* ----------------------------------------------------------
   6. 图标盒子
   红框这里原来太宽，现在严格限制 48px
   ---------------------------------------------------------- */

.choose-area .choose-features-icon {
	position: static !important;

	display: flex !important;

	flex: none !important;

	width: 48px !important;
	min-width: 48px !important;
	max-width: 48px !important;

	height: 48px !important;
	min-height: 48px !important;

	margin: 0 !important;
	padding: 0 !important;

	align-items: center !important;
	justify-content: center !important;

	background: #fff7ed !important;

	border: 1px solid #f0d9ba !important;
	border-radius: 7px !important;

	box-shadow: none !important;

	transform: none !important;
}


/* 图标本身 */
.choose-area .choose-features-icon img {
	display: block !important;

	width: 25px !important;
	height: 25px !important;

	max-width: 25px !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain;
}


/* ----------------------------------------------------------
   7. Feature 文字
   ---------------------------------------------------------- */

.choose-area .choose-features-info {
	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}


.choose-area .choose-features-info h3 {
	margin: 0 0 6px !important;

	color: #172635;

	font-size: 18px;
	line-height: 1.35;

	font-weight: 700;
}


.choose-area .choose-features-info p {
	margin: 0 !important;

	color: #6c7881;

	font-size: 14px;
	line-height: 1.65;
}


/* ----------------------------------------------------------
   8. 左图尺寸与右侧文字高度协调
   ---------------------------------------------------------- */

.choose-area .choose-images {
	position: relative;

	overflow: hidden;

	border-radius: 10px;

	background: #fff;

	box-shadow:
			0 12px 32px
			rgba(20, 42, 57, .08);
}


.choose-area .choose-images > img {
	display: block;

	width: 100% !important;
	height: 560px !important;

	margin: 0 !important;

	object-fit: cover;
	object-position: center;

	border-radius: 10px;
}


/* ----------------------------------------------------------
   9. 左图底部信息框
   ---------------------------------------------------------- */

.choose-area .choose-image-info {
	left: 20px !important;
	bottom: 20px !important;

	min-width: 200px !important;

	padding: 13px 17px !important;
}


.choose-area .choose-image-info strong {
	font-size: 16px !important;
}


/* ----------------------------------------------------------
   10. CTA
   ---------------------------------------------------------- */

.choose-area .choose-product-actions {
	display: flex;

	align-items: center;

	gap: 20px;

	margin-top: 22px !important;
}


/* ==========================================================
   1200 - 1399
   ========================================================== */

@media (min-width: 1200px) and (max-width: 1399px) {

	.choose-area .choose-content-info h2 {
		font-size: 34px;
	}

	.choose-area .choose-images > img {
		height: 540px !important;
	}

}


/* ==========================================================
   Tablet
   ========================================================== */

@media (min-width: 768px) and (max-width: 991px) {

	.choose-area,
	.choose-area.section-padding {
		padding-top: 40px !important;
		padding-bottom: 50px !important;
	}


	.choose-area .choose-content {
		margin-top: 32px !important;

		padding-left: 0 !important;
	}


	.choose-area .choose-content-info h2 {
		font-size: 31px;
	}


	.choose-area .choose-images > img {
		height: auto !important;
	}


	.choose-area .choose-single-feature {
		grid-template-columns:
            46px
            minmax(0, 1fr);

		column-gap: 14px !important;
	}


	.choose-area .choose-features-icon {
		width: 46px !important;
		min-width: 46px !important;

		height: 46px !important;
		min-height: 46px !important;
	}

}


/* ==========================================================
   Mobile
   ========================================================== */

@media (max-width: 767px) {

	.choose-area,
	.choose-area.section-padding {
		padding-top: 32px !important;
		padding-bottom: 42px !important;
	}


	.choose-area .choose-content {
		margin-top: 27px !important;

		padding-left: 0 !important;
	}


	.choose-area .choose-content-info {
		margin-bottom: 18px !important;
	}


	.choose-area .choose-content-info h2 {
		font-size: 27px;

		line-height: 1.27;
	}


	.choose-area .choose-content-info > p {
		font-size: 14px;

		line-height: 1.7;
	}


	.choose-area .choose-images > img {
		height: auto !important;
	}


	.choose-area .choose-single-feature {
		grid-template-columns:
            42px
            minmax(0, 1fr);

		column-gap: 13px !important;

		padding: 15px 0 !important;
	}


	.choose-area .choose-features-icon {
		width: 42px !important;
		min-width: 42px !important;
		max-width: 42px !important;

		height: 42px !important;
		min-height: 42px !important;
	}


	.choose-area .choose-features-icon img {
		width: 23px !important;
		height: 23px !important;
	}


	.choose-area .choose-features-info h3 {
		font-size: 16.5px;
	}


	.choose-area .choose-features-info p {
		font-size: 13.5px;

		line-height: 1.65;
	}


	.choose-area .choose-product-actions {
		margin-top: 18px !important;

		flex-direction: column;

		align-items: flex-start;

		gap: 14px;
	}

}

/* ==========================================================
   OUR CASES
   Category ID = 510

   主图重点：
   1:1
   contain
   完整显示
   不裁切
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

.our-cases-section {

	position: relative;

	background: #ffffff;

}


/* ==========================================================
   TITLE
   ========================================================== */

.our-cases-title {

	max-width: 780px;

	margin:
			0 auto 44px;

	text-align:
			center;

}


.our-cases-title .sub-title {

	color: #e78300;

	font-size: 13px;

	font-weight: 700;

	letter-spacing: 1.5px;

	text-transform: uppercase;

}


.our-cases-title h2 {

	margin-bottom: 13px;

	color: #172635;

	font-size: 40px;

	line-height: 1.2;

	font-weight: 700;

}


.our-cases-title > p {

	max-width: 690px;

	margin:
			14px auto 0;

	color: #6b7680;

	font-size: 15px;

	line-height: 1.75;

}


/* ==========================================================
   GRID
   ========================================================== */

.our-cases-grid {

	display: flex;

	flex-wrap: wrap;

}


.our-case-column {

	display: flex;

}


/* ==========================================================
   CASE CARD
   ========================================================== */

.our-case-item {

	display: flex;

	flex-direction: column;

	width: 100%;

	height: calc(100% - 30px);

	margin-bottom: 30px;

	overflow: hidden;

	background: #ffffff;

	border:
			1px solid #e3e8ec;

	border-radius:
			10px;

	box-shadow:
			0 5px 18px
			rgba(23, 38, 53, .04);

	transition:
			border-color .22s ease,
			box-shadow .22s ease;

}


.our-case-item:hover {

	border-color:
			#d3dbe1;

	box-shadow:
			0 15px 35px
			rgba(23, 38, 53, .09);

}


/* ==========================================================
   CASE IMAGE

   这里是关键修复：
   不再使用 4:3 + cover
   ========================================================== */

.our-case-item .portfolio-img,
.our-case-image {

	position: relative;

	width: 100% !important;

	/*
     * 方形区域
     * 更适合你的产品宣传图
     */
	aspect-ratio:
			1 / 1 !important;

	height:
			auto !important;

	margin:
			0 !important;

	padding:
			0 !important;

	overflow:
			hidden !important;

	background:
			#ffffff !important;

	border-radius:
			10px 10px 0 0 !important;

}


/* ==========================================================
   IMAGE LINK
   ========================================================== */

.our-case-item .portfolio-img > a {

	display:
			flex !important;

	width:
			100% !important;

	height:
			100% !important;

	align-items:
			center;

	justify-content:
			center;

	margin:
			0 !important;

	padding:
			0 !important;

	overflow:
			hidden !important;

	background:
			#ffffff;

}


/* ==========================================================
   IMAGE

   contain:
   完整显示顶部
   完整显示底部
   不拉伸
   不裁切
   ========================================================== */

.our-case-item .portfolio-img img {

	display:
			block !important;

	width:
			100% !important;

	height:
			100% !important;

	max-width:
			100% !important;

	max-height:
			100% !important;

	margin:
			0 !important;

	padding:
			0 !important;

	object-fit:
			contain !important;

	object-position:
			center center !important;

	background:
			#ffffff;

	border:
			0 !important;

	border-radius:
			10px 10px 0 0 !important;

	transform:
			none !important;

	transition:
			transform .3s ease;

}


/*
 * Hover 只轻微放大
 */
.our-case-item:hover
.portfolio-img img {

	transform:
			scale(1.012) !important;

}


/* ==========================================================
   CONTENT
   ========================================================== */

.our-case-item
.portfolio-content-info {

	position:
			relative;

	display:
			flex;

	flex:
			1;

	flex-direction:
			column;

	padding:
			23px 24px 24px;

}


/* ==========================================================
   CATEGORY
   ========================================================== */

.our-case-category {

	margin:
			0 0 8px !important;

}


.our-case-category a {

	color:
			#e78300 !important;

	font-size:
			12px;

	line-height:
			1.3;

	font-weight:
			700;

	letter-spacing:
			.7px;

	text-transform:
			uppercase;

	text-decoration:
			none;

}


/* ==========================================================
   TITLE
   ========================================================== */

.our-case-item
.portfolio-content-info h3 {

	min-height:
			55px;

	margin:
			0 0 10px;

	font-size:
			20px;

	line-height:
			1.4;

	font-weight:
			700;

}


.our-case-item
.portfolio-content-info h3 a {

	color:
			#172635;

	text-decoration:
			none;

}


.our-case-item
.portfolio-content-info h3 a:hover {

	color:
			#e78300;

}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.our-case-description {

	margin:
			0 0 15px !important;

	padding-right:
			45px;

	color:
			#707b83 !important;

	font-size:
			14px;

	line-height:
			1.65;

}


/* ==========================================================
   ARROW
   ========================================================== */

.our-case-item
.portfolio-link-icon {

	margin-top:
			auto;

}


/* ==========================================================
   VIEW ALL
   ========================================================== */

.our-cases-more {

	margin-top:
			18px;

	text-align:
			center;

}


/* ==========================================================
   EMPTY
   ========================================================== */

.our-cases-empty {

	padding:
			50px 20px;

	text-align:
			center;

	background:
			#f7f9fa;

	border:
			1px solid #e3e8ec;

	border-radius:
			8px;

}


.our-cases-empty h3 {

	margin-bottom:
			8px;

	color:
			#172635;

}


.our-cases-empty p {

	margin:
			0;

	color:
			#707b83;

}


/* ==========================================================
   TABLET
   ========================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

	.our-cases-title {

		margin-bottom:
				36px;

	}


	.our-cases-title h2 {

		font-size:
				34px;

	}


	.our-case-item
	.portfolio-img {

		aspect-ratio:
				1 / 1 !important;

	}


	.our-case-item
	.portfolio-content-info h3 {

		font-size:
				18px;

	}

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

	.our-cases-title {

		margin-bottom:
				30px;

	}


	.our-cases-title h2 {

		font-size:
				28px;

	}


	.our-cases-title > p {

		font-size:
				14px;

	}


	.our-case-item {

		height:
				auto;

		margin-bottom:
				22px;

	}


	.our-case-item
	.portfolio-img {

		aspect-ratio:
				1 / 1 !important;

	}


	.our-case-item
	.portfolio-content-info {

		padding:
				20px;

	}


	.our-case-item
	.portfolio-content-info h3 {

		min-height:
				auto;

		font-size:
				19px;

	}


	.our-case-description {

		padding-right:
				0;

	}

}
/*视频弹出*/

/* =========================================================
   VIDEO COVER
========================================================= */

.choose-video-cover {
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: 18px;
	background: #f4f4f4;
}


/* Cover */
.choose-video-cover > img {
	display: block;

	width: 100%;
	height: auto;

	object-fit: cover;

	border-radius: 18px;

	transition: transform 0.6s ease;
}


/* Light hover */
.choose-video-cover:hover > img {
	transform: scale(1.015);
}



/* =========================================================
   IMAGE INFORMATION
========================================================= */

.choose-image-info {
	pointer-events: none;
}



/* =========================================================
   PLAY BUTTON
========================================================= */

.choose-popup-play {

	position: absolute !important;

	top: 50% !important;
	left: 50% !important;

	transform: translate(-50%, -50%) !important;

	width: 200px !important;
	height: 200px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: none !important;
	outline: none !important;

	background: transparent !important;

	display: flex !important;

	align-items: center !important;
	justify-content: center !important;

	cursor: pointer !important;

	opacity: 1 !important;
	visibility: visible !important;

	pointer-events: auto !important;

	z-index: 50 !important;

}


/* Prevent theme hover animation */
.choose-popup-play:hover,
.choose-popup-play:focus,
.choose-popup-play:active {

	transform: translate(-50%, -50%) !important;

	top: 50% !important;
	left: 50% !important;

}



/* =========================================================
   OUTER CIRCLE
========================================================= */

.choose-popup-play-outer {

	width: 200px;
	height: 200px;

	border-radius: 50%;

	background: rgba(255,255,255,0.28);

	display: flex;

	align-items: center;
	justify-content: center;

	transition:
			background 0.3s ease,
			transform 0.3s ease;

}



/* =========================================================
   INNER CIRCLE
========================================================= */

.choose-popup-play-inner {

	width: 120px;
	height: 120px;

	border-radius: 50%;

	background: #ffffff;

	display: flex;

	align-items: center;
	justify-content: center;

	box-shadow:
			0 15px 45px rgba(0,0,0,0.16);

	transition:
			transform 0.3s ease,
			box-shadow 0.3s ease;

}



/* Play icon */
.choose-popup-play-inner i {

	color: #2196f3;

	font-size: 36px;

	line-height: 1;

	margin-left: 7px;

	transition: color 0.3s ease;

}



/* Hover */
.choose-popup-play:hover .choose-popup-play-outer {

	background: rgba(255,255,255,0.40);

}


.choose-popup-play:hover .choose-popup-play-inner {

	transform: scale(1.04);

	box-shadow:
			0 18px 50px rgba(0,0,0,0.22);

}


.choose-popup-play:hover .choose-popup-play-inner i {

	color: #087ee5;

}



/* =========================================================
   VIDEO MODAL
========================================================= */

.choose-video-modal {

	position: fixed;

	top: 0;
	left: 0;

	width: 100vw;
	height: 100vh;

	display: flex;

	align-items: center;
	justify-content: center;

	padding: 70px 30px 30px;

	opacity: 0;

	visibility: hidden;

	pointer-events: none;

	z-index: 2147483000;

	transition:
			opacity 0.3s ease,
			visibility 0.3s ease;

}



/* Open */
.choose-video-modal.is-open {

	opacity: 1;

	visibility: visible;

	pointer-events: auto;

}



/* =========================================================
   DARK OVERLAY
========================================================= */

.choose-video-modal-overlay {

	position: absolute;

	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	background: rgba(0,0,0,0.90);

	cursor: pointer;

	z-index: 1;

}



/* =========================================================
   VIDEO DIALOG
========================================================= */

.choose-video-modal-dialog {

	position: relative;

	width: 90%;

	max-width: 1100px;

	max-height: 85vh;

	margin: auto;

	background: #000000;

	border-radius: 14px;

	box-shadow:
			0 30px 100px rgba(0,0,0,0.55);

	z-index: 2;

}



/* =========================================================
   VIDEO
========================================================= */

.choose-video-modal-dialog video {

	display: block;

	width: 100%;

	height: auto;

	max-height: 82vh;

	margin: 0;

	padding: 0;

	background: #000000;

	border-radius: 14px;

	object-fit: contain;

}



/* =========================================================
   CLOSE BUTTON
========================================================= */

.choose-video-modal-close {

	position: absolute !important;

	top: -54px !important;
	right: 0 !important;

	width: 44px !important;
	height: 44px !important;

	padding: 0 !important;
	margin: 0 !important;

	border: none !important;
	border-radius: 50% !important;

	background: #ffffff !important;

	color: #111111 !important;

	font-family: Arial, sans-serif !important;

	font-size: 31px !important;

	font-weight: 300 !important;

	line-height: 42px !important;

	text-align: center !important;

	cursor: pointer !important;

	z-index: 5 !important;

	transition:
			background 0.25s ease,
			color 0.25s ease !important;

}


.choose-video-modal-close:hover {

	background: #2196f3 !important;

	color: #ffffff !important;

}



/* =========================================================
   DISABLE PAGE SCROLL
========================================================= */

html.choose-video-open,
body.choose-video-open {

	overflow: hidden !important;

}



/* =========================================================
   TABLET
========================================================= */

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

	.choose-video-cover {

		margin-bottom: 35px;

	}


	.choose-popup-play,
	.choose-popup-play-outer {

		width: 150px !important;
		height: 150px !important;

	}


	.choose-popup-play-inner {

		width: 92px;
		height: 92px;

	}


	.choose-popup-play-inner i {

		font-size: 28px;

		margin-left: 5px;

	}


	.choose-video-modal {

		padding:
				70px
				20px
				20px;

	}


	.choose-video-modal-dialog {

		width: 95%;

	}

}



/* =========================================================
   MOBILE
========================================================= */

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

	.choose-video-cover,
	.choose-video-cover > img {

		border-radius: 12px;

	}


	.choose-popup-play,
	.choose-popup-play-outer {

		width: 110px !important;
		height: 110px !important;

	}


	.choose-popup-play-inner {

		width: 68px;
		height: 68px;

	}


	.choose-popup-play-inner i {

		font-size: 21px;

		margin-left: 4px;

	}


	.choose-video-modal {

		padding:
				65px
				12px
				15px;

	}


	.choose-video-modal-dialog {

		width: 100%;

		border-radius: 10px;

	}


	.choose-video-modal-dialog video {

		border-radius: 10px;

	}


	.choose-video-modal-close {

		top: -50px !important;

		width: 40px !important;
		height: 40px !important;

		line-height: 38px !important;

		font-size: 28px !important;

	}

}
/* =========================================================
   BLOG / NEWS - CORPORATE BLUE STYLE
   仅作用于首页新闻区域
========================================================= */

.corporate-blog {
	--corporate-blue: #0B5ED7;
	--corporate-blue-dark: #084298;
	--corporate-blue-light: #EAF2FF;
}


/* =========================================================
   Section Title
========================================================= */

.corporate-blog .section-title h6,
.corporate-blog .section-title .sub-title {
	color: var(--corporate-blue) !important;
}


/* =========================================================
   Blog Date
========================================================= */

.corporate-blog .blog-list {
	margin: 0;
	padding: 0;
}

.corporate-blog .blog-list li {
	list-style: none;
}

.corporate-blog .blog-list li a {
	color: var(--corporate-blue) !important;
	text-decoration: none;
}

.corporate-blog .blog-list li i {
	color: var(--corporate-blue) !important;
	margin-right: 8px;
}


/* =========================================================
   Blog Title
========================================================= */

.corporate-blog .blog-content h3 a {
	transition: color 0.3s ease;
}

.corporate-blog .blog-content h3 a:hover {
	color: var(--corporate-blue) !important;
}


/* =========================================================
   Read More Button
========================================================= */

.corporate-blog .blog-btn .default-btn {
	background: #254b82 !important;
	border-color: var(--corporate-blue) !important;
	color: #ffffff !important;
	transition: all 0.3s ease;
}


/* 模板按钮内部动画层 */
.corporate-blog .blog-btn .default-btn span {
	background: var(--corporate-blue-dark) !important;
}

.corporate-blog .blog-btn .default-btn::before,
.corporate-blog .blog-btn .default-btn::after {
	background: var(--corporate-blue-dark) !important;
}


/* Read More Hover */
.corporate-blog .blog-btn .default-btn:hover {
	background: var(--corporate-blue-dark) !important;
	border-color: var(--corporate-blue-dark) !important;
	color: #ffffff !important;
}

.corporate-blog .blog-btn .default-btn:hover span {
	background: var(--corporate-blue-dark) !important;
}


/* =========================================================
   More News Button
========================================================= */

.corporate-blog .blog-more-btn {
	text-align: center;
	margin-top: 25px;
	margin-bottom: 30px;
}

.corporate-blog .blog-more-btn .default-btn-one {
	background: #f43636  !important;
	border-color: var(--corporate-blue) !important;
	color: #ffffff !important;
	transition: all 0.3s ease;
}

.corporate-blog .blog-more-btn .default-btn-one span {
	background: var(--corporate-blue-dark) !important;
}

.corporate-blog .blog-more-btn .default-btn-one::before,
.corporate-blog .blog-more-btn .default-btn-one::after {
	background: var(--corporate-blue-dark) !important;
}

.corporate-blog .blog-more-btn .default-btn-one:hover {
	background: var(--corporate-blue-dark) !important;
	border-color: var(--corporate-blue-dark) !important;
	color: #ffffff !important;
}


/* =========================================================
   Blog Image
========================================================= */

.corporate-blog .blog-image {
	overflow: hidden;
}

.corporate-blog .blog-image img {
	width: 100%;
	display: block;
}


/* =========================================================
   Responsive
========================================================= */

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

	.corporate-blog .blog-more-btn {
		margin-top: 10px;
	}

}
/* =========================================================
   COMPANY CERTIFICATIONS
========================================================= */

.certificate-area {

	position: relative;

	width: 100%;

	padding: 85px 0 90px;

	background: #f7f8fc;

	overflow: hidden;

}


/* =========================================================
   CONTAINER
========================================================= */

.certificate-container {

	width: 100%;

	max-width: 1920px;

	margin: 0 auto;

	padding-left: 90px;
	padding-right: 90px;

}


/* =========================================================
   TITLE
========================================================= */

.certificate-section-title {

	margin-bottom: 42px;

	text-align: center;

}


.certificate-section-title h6 {

	margin-bottom: 14px;

	color: #FFC107 !important;

}


.certificate-section-title h2 {

	margin-bottom: 0;

}


/* =========================================================
   SLIDER
========================================================= */

.certificate-slider-wrapper {

	position: relative;

	width: 100%;

}


/* =========================================================
   TRACK
========================================================= */

.certificate-track {

	display: flex;

	align-items: stretch;

	gap: 28px;

	width: 100%;

	overflow-x: auto;

	overflow-y: hidden;

	scroll-behavior: smooth;

	scroll-snap-type: x mandatory;

	scrollbar-width: none;

	-ms-overflow-style: none;

	padding:
			8px
			2px
			12px;

}


/* Chrome / Safari */

.certificate-track::-webkit-scrollbar {

	display: none;

}


/* =========================================================
   ITEM

   PC严格一屏4个
========================================================= */

.certificate-item {

	flex:

			0 0

			calc(
					(100% - 84px) / 4
			);

	min-width: 0;

	scroll-snap-align: start;

	text-align: center;

}


/* =========================================================
   CARD
========================================================= */

.certificate-card {

	position: relative;

	display: flex;

	align-items: center;
	justify-content: center;

	width: 100%;

	height: 360px;

	padding: 16px;

	box-sizing: border-box;

	background: #ffffff;

	border: 1px solid #e1e6ee;

	border-radius: 18px;

	overflow: hidden;

	transition:
			border-color 0.3s ease,
			box-shadow 0.3s ease,
			transform 0.3s ease;

}


/* =========================================================
   IMAGE LINK
========================================================= */

.certificate-image-link {

	display: flex;

	align-items: center;
	justify-content: center;

	width: 100%;

	height: 100%;

}


/* =========================================================
   IMAGE
========================================================= */

.certificate-card img {

	display: block;

	width: auto;

	height: auto;

	max-width: 100%;

	max-height: 100%;

	margin: 0 auto;

	object-fit: contain;

	object-position: center;

}


/* =========================================================
   HOVER
========================================================= */

.certificate-card:hover {

	border-color: #FFC107;

	transform: translateY(-4px);

	box-shadow:
			0 15px 38px
			rgba(25, 45, 80, 0.10);

}


/* =========================================================
   NAME
========================================================= */

.certificate-name {

	width: 100%;

	min-height: 54px;

	padding:
			14px
			8px
			0;

	box-sizing: border-box;

	color: #172b4d;

	font-size: 18px;

	font-weight: 700;

	line-height: 1.4;

	text-align: center;

	overflow: hidden;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

}


/* =========================================================
   LEFT / RIGHT BUTTON
========================================================= */

.certificate-nav {

	position: absolute;

	top: 44%;

	z-index: 30;

	display: flex;

	align-items: center;
	justify-content: center;

	width: 58px;

	height: 58px;

	padding: 0;

	margin: 0;

	border: none;

	border-radius: 50%;

	background: #FFC107;

	color: #ffffff;

	cursor: pointer;

	box-shadow:
			0 8px 28px
			rgba(0, 0, 0, 0.16);

	transform:
			translateY(-50%);

	transition:
			background-color 0.25s ease,
			opacity 0.25s ease,
			box-shadow 0.25s ease;

}


/* LEFT */

.certificate-prev {

	left: -64px;

}


/* RIGHT */

.certificate-next {

	right: -64px;

}


/* ICON */

.certificate-nav i {

	color: #ffffff;

	font-size: 21px;

}


/* Hover */

.certificate-nav:hover {

	background: #E0A800;

	transform:
			translateY(-50%);

}


/* 禁止按钮乱跳 */

.certificate-nav:focus,
.certificate-nav:active {

	outline: none;

	transform:
			translateY(-50%);

}


/* 到达边缘后的按钮 */

.certificate-nav.is-disabled {

	opacity: 0.30;

	cursor: default;

}


/* =========================================================
   1400
========================================================= */

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

	.certificate-container {

		padding-left: 75px;
		padding-right: 75px;

	}


	.certificate-card {

		height: 340px;

	}


	.certificate-prev {

		left: -52px;

	}


	.certificate-next {

		right: -52px;

	}

}


/* =========================================================
   1199
   一屏3个
========================================================= */

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

	.certificate-item {

		flex:

				0 0

				calc(
						(100% - 56px) / 3
				);

	}


	.certificate-card {

		height: 350px;

	}

}


/* =========================================================
   991
   一屏2个
========================================================= */

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

	.certificate-area {

		padding:
				70px
				0
				75px;

	}


	.certificate-container {

		padding-left: 55px;
		padding-right: 55px;

	}


	.certificate-item {

		flex:

				0 0

				calc(
						(100% - 24px) / 2
				);

	}


	.certificate-track {

		gap: 24px;

	}


	.certificate-card {

		height: 360px;

	}


	.certificate-prev {

		left: -38px;

	}


	.certificate-next {

		right: -38px;

	}

}


/* =========================================================
   MOBILE
   一屏1个
========================================================= */

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

	.certificate-area {

		padding:
				55px
				0
				60px;

	}


	.certificate-container {

		padding-left: 28px;
		padding-right: 28px;

	}


	.certificate-section-title {

		margin-bottom: 30px;

	}


	.certificate-track {

		gap: 18px;

	}


	.certificate-item {

		flex:
				0 0
				100%;

	}


	.certificate-card {

		height: 380px;

	}


	.certificate-name {

		font-size: 16px;

	}


	.certificate-nav {

		width: 46px;

		height: 46px;

	}


	.certificate-prev {

		left: -18px;

	}


	.certificate-next {

		right: -18px;

	}


	.certificate-nav i {

		font-size: 17px;

	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

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

	.certificate-container {

		padding-left: 20px;
		padding-right: 20px;

	}


	.certificate-card {

		height: 350px;

	}

}
/* =========================================================
   FORCE REPLACE OLD LDS SPINNER
   HVOF SUPERSONIC SPRAY PRELOADER
   必须放在 style.css 最底部
========================================================= */


/* -------------------------
   加载背景
------------------------- */

.preloader {
	position: fixed !important;
	left: 0 !important;
	top: 0 !important;

	width: 100% !important;
	height: 100% !important;

	z-index: 99999999 !important;

	background:
			radial-gradient(
					circle at center,
					#102e44 0%,
					#071723 45%,
					#02080e 100%
			) !important;
}


/* -------------------------
   强制删除旧转圈布局
------------------------- */

.preloader .lds-spinner {
	position: relative !important;

	width: 620px !important;
	height: 190px !important;

	margin: 0 auto !important;

	display: block !important;

	transform: none !important;
}


/* 清除旧 spinner 的所有样式 */

.preloader .lds-spinner > div {
	position: absolute !important;

	width: auto !important;
	height: auto !important;

	left: auto !important;
	top: auto !important;

	margin: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	transform: none !important;
	transform-origin: center !important;

	background: none !important;

	opacity: 1 !important;

	animation: none !important;

	box-shadow: none !important;
}


/* 关键：
   原来的 spinner 经常用 div:after 画红色短线，
   必须彻底清除
*/

.preloader .lds-spinner > div::after {
	content: none !important;
	display: none !important;
}


/* =========================================================
   喷枪主体
   用 lds-spinner 自己的 before 绘制
========================================================= */

.preloader .lds-spinner::before {
	content: "" !important;

	position: absolute !important;

	left: 25px !important;
	top: 72px !important;

	width: 145px !important;
	height: 48px !important;

	border-radius: 12px 4px 4px 12px !important;

	background:
			linear-gradient(
					180deg,
					#f4f7f8 0%,
					#899ba6 18%,
					#dbe4e8 43%,
					#566a76 72%,
					#bdc9cf 100%
			) !important;

	border:
			1px solid rgba(255,255,255,.4) !important;

	box-shadow:
			0 8px 20px rgba(0,0,0,.55),
			inset 0 1px 2px rgba(255,255,255,.9) !important;

	z-index: 20 !important;

	animation:
			hvofGunVibration .07s linear infinite !important;
}


/* =========================================================
   工件
   用 lds-spinner 的 after 绘制
========================================================= */

.preloader .lds-spinner::after {
	content: "" !important;

	position: absolute !important;

	right: 30px !important;
	top: 38px !important;

	width: 42px !important;
	height: 118px !important;

	border-radius: 5px !important;

	background:
			linear-gradient(
					90deg,
					#27333a 0%,
					#9facb3 18%,
					#d7dfe3 35%,
					#72818a 58%,
					#344149 78%,
					#1d272d 100%
			) !important;

	box-shadow:
			-8px 5px 25px rgba(0,0,0,.55),
			-5px 0 15px rgba(0,190,255,.25) !important;

	z-index: 30 !important;
}


/* =========================================================
   DIV 1
   金属枪管
========================================================= */

.preloader .lds-spinner > div:nth-child(1) {

	display: block !important;

	left: 155px !important;
	top: 82px !important;

	width: 62px !important;
	height: 28px !important;

	background:
			linear-gradient(
					180deg,
					#f0f4f6 0%,
					#667984 45%,
					#c7d2d7 100%
			) !important;

	clip-path:
			polygon(
					0 8%,
					100% 28%,
					100% 72%,
					0 92%
			) !important;

	z-index: 21 !important;

	animation:
			hvofGunVibration .07s linear infinite !important;
}


/* =========================================================
   DIV 2
   喷嘴发光
========================================================= */

.preloader .lds-spinner > div:nth-child(2) {

	display: block !important;

	left: 211px !important;
	top: 90px !important;

	width: 14px !important;
	height: 13px !important;

	border-radius: 50% !important;

	background: #ffffff !important;

	box-shadow:
			0 0 5px #ffffff,
			0 0 12px #43e6ff,
			0 0 24px #00a8ff,
			0 0 40px #006eff !important;

	z-index: 25 !important;

	animation:
			hvofNozzlePulse .08s linear infinite alternate !important;
}


/* =========================================================
   DIV 3
   外层超音速蓝焰
========================================================= */

.preloader .lds-spinner > div:nth-child(3) {

	display: block !important;

	left: 220px !important;
	top: 79px !important;

	width: 320px !important;
	height: 38px !important;

	border-radius:
			5px 100% 100% 5px !important;

	transform-origin:
			left center !important;

	background:
			linear-gradient(
					90deg,

					rgba(115,245,255,.95) 0%,

					rgba(0,207,255,.9) 15%,

					rgba(0,139,255,.8) 35%,

					rgba(0,84,255,.48) 65%,

					rgba(0,60,255,.08) 88%,

					transparent 100%

			) !important;

	filter:
			blur(7px) !important;

	z-index: 5 !important;

	animation:
			hvofOuterJet .15s ease-in-out infinite alternate !important;
}


/* =========================================================
   DIV 4
   蓝色火焰主体
========================================================= */

.preloader .lds-spinner > div:nth-child(4) {

	display: block !important;

	left: 220px !important;
	top: 85px !important;

	width: 295px !important;
	height: 26px !important;

	border-radius:
			4px 100% 100% 4px !important;

	transform-origin:
			left center !important;

	background:
			linear-gradient(
					90deg,

					#d5fcff 0%,

					#61ecff 12%,

					#00c8ff 30%,

					#007aff 60%,

					rgba(0,80,255,.25) 85%,

					transparent 100%

			) !important;

	filter:
			blur(2px) !important;

	z-index: 7 !important;

	animation:
			hvofBlueJet .09s linear infinite alternate !important;
}


/* =========================================================
   DIV 5
   白色高速焰芯
========================================================= */

.preloader .lds-spinner > div:nth-child(5) {

	display: block !important;

	left: 220px !important;
	top: 94px !important;

	width: 245px !important;
	height: 8px !important;

	border-radius:
			3px 100% 100% 3px !important;

	transform-origin:
			left center !important;

	background:
			linear-gradient(
					90deg,

					#ffffff 0%,

					#ffffff 15%,

					#bdfaff 38%,

					#36dfff 60%,

					rgba(0,120,255,.5) 83%,

					transparent 100%

			) !important;

	box-shadow:
			0 0 4px #ffffff,
			0 0 10px #55ecff,
			0 0 18px #009cff !important;

	z-index: 10 !important;

	animation:
			hvofCoreJet .06s linear infinite alternate !important;
}


/* =========================================================
   DIV 6 - 12
   HVOF 高速喷涂粉末
========================================================= */

.preloader .lds-spinner > div:nth-child(n+6) {

	display: block !important;

	left: 220px !important;

	width: 5px !important;
	height: 5px !important;

	border-radius: 50% !important;

	background:
			#ffd044 !important;

	box-shadow:
			0 0 3px #ffffff,
			0 0 7px #ffbe00,
			0 0 12px rgba(255,115,0,.85) !important;

	z-index: 18 !important;

	opacity: 0 !important;

	animation:
			hvofPowder .58s linear infinite !important;
}


/* 每颗粒纵向位置 */

.preloader .lds-spinner > div:nth-child(6) {
	top: 91px !important;
	animation-delay: 0s !important;
}

.preloader .lds-spinner > div:nth-child(7) {
	top: 84px !important;
	animation-delay: .08s !important;
}

.preloader .lds-spinner > div:nth-child(8) {
	top: 101px !important;
	animation-delay: .16s !important;
}

.preloader .lds-spinner > div:nth-child(9) {
	top: 88px !important;
	animation-delay: .24s !important;
}

.preloader .lds-spinner > div:nth-child(10) {
	top: 106px !important;
	animation-delay: .32s !important;
}

.preloader .lds-spinner > div:nth-child(11) {
	top: 80px !important;
	animation-delay: .40s !important;
}

.preloader .lds-spinner > div:nth-child(12) {
	top: 96px !important;
	animation-delay: .48s !important;
}


/* =========================================================
   在工件前增加撞击光
========================================================= */

.preloader .d-table-cell {
	position: relative !important;
}


/* =========================================================
   动画关键帧
========================================================= */


/* 喷枪高频微震 */

@keyframes hvofGunVibration {

	0% {
		transform: translate(0,0);
	}

	25% {
		transform: translate(.8px,-.4px);
	}

	50% {
		transform: translate(0,.5px);
	}

	75% {
		transform: translate(-.8px,-.3px);
	}

	100% {
		transform: translate(0,0);
	}

}


/* 喷嘴脉冲 */

@keyframes hvofNozzlePulse {

	from {
		transform: scale(.75);
		opacity: .65;
	}

	to {
		transform: scale(1.5);
		opacity: 1;
	}

}


/* 外焰 */

@keyframes hvofOuterJet {

	0% {

		transform:
				scaleX(.90)
				scaleY(.70);

		opacity: .48;
	}

	100% {

		transform:
				scaleX(1.08)
				scaleY(1.20);

		opacity: .95;
	}

}


/* 蓝焰 */

@keyframes hvofBlueJet {

	from {

		transform:
				scaleX(.91)
				scaleY(.85);

		opacity: .72;
	}

	to {

		transform:
				scaleX(1.07)
				scaleY(1.12);

		opacity: 1;
	}

}


/* 高速核心 */

@keyframes hvofCoreJet {

	from {

		transform:
				scaleX(.88);

		opacity: .7;
	}

	to {

		transform:
				scaleX(1.12);

		opacity: 1;
	}

}


/* 粉末高速飞向工件 */

@keyframes hvofPowder {

	0% {

		transform:
				translateX(0)
				scale(.4);

		opacity: 0;
	}


	8% {

		opacity: 1;

	}


	70% {

		opacity: 1;

	}


	100% {

		transform:
				translateX(350px)
				scale(1.15);

		opacity: 0;

	}

}


/* =========================================================
   手机适配
========================================================= */

@media (max-width: 767px) {

	.preloader .lds-spinner {

		width: 620px !important;

		transform:
				scale(.52) !important;

		transform-origin:
				center center !important;

		margin-left:
				calc(50% - 310px) !important;

	}

}
/* =========================================================
   THERMAL SPRAY PAGE TITLE BANNER
========================================================= */

.thermal-spray-title-area {
	position: relative !important;

	width: 100%;

	min-height: 430px;

	overflow: hidden;

	background-position: center center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;

	display: flex;
	align-items: center;
}


/* 深色遮罩 */

.thermal-banner-overlay {
	position: absolute;

	inset: 0;

	z-index: 1;

	background:
			linear-gradient(
					90deg,
					rgba(3, 12, 20, .94) 0%,
					rgba(5, 21, 34, .86) 35%,
					rgba(4, 19, 31, .64) 62%,
					rgba(1, 10, 18, .76) 100%
			);
}


/* 蓝色环境光 */

.thermal-spray-title-area::before {
	content: "";

	position: absolute;

	width: 600px;
	height: 600px;

	right: -220px;
	top: -280px;

	z-index: 2;

	border-radius: 50%;

	background:
			radial-gradient(
					circle,
					rgba(0, 179, 255, .18) 0%,
					rgba(0, 126, 255, .07) 42%,
					transparent 70%
			);

	animation:
			thermalAmbientPulse 4s ease-in-out infinite alternate;
}


/* =========================================================
   标题
========================================================= */

.thermal-spray-title-area .d-table {
	position: relative;

	z-index: 20;

	width: 100%;
}


.thermal-title-content {
	position: relative;

	max-width: 620px;

	text-align: left !important;
}


/* 小标题 */

.thermal-small-title {
	display: inline-flex;
	align-items: center;

	margin-bottom: 15px;

	color: #67dcff;

	font-size: 12px;
	font-weight: 700;

	letter-spacing: 3px;
}


.thermal-small-title::before {
	content: "";

	width: 34px;
	height: 2px;

	margin-right: 12px;

	background: #00c8ff;

	box-shadow:
			0 0 8px rgba(0, 200, 255, .85);
}


/* 主标题 */

.thermal-title-content h2 {
	margin: 0 0 18px !important;

	color: #ffffff !important;

	font-size: clamp(34px, 4vw, 58px) !important;

	line-height: 1.12 !important;

	font-weight: 800 !important;

	letter-spacing: -1px;

	text-shadow:
			0 5px 25px rgba(0, 0, 0, .4);
}


/* 面包屑 */

.thermal-title-content ul {
	margin: 0 !important;
	padding: 0 !important;

	display: flex;

	align-items: center;

	gap: 12px;
}


.thermal-title-content ul li {
	color: rgba(255,255,255,.72) !important;

	font-size: 14px;
}


.thermal-title-content ul li a {
	color: #ffffff !important;

	transition: .25s;
}


.thermal-title-content ul li a:hover {
	color: #37d4ff !important;
}


.thermal-title-content ul li + li::before {
	content: "/";

	margin-right: 12px;

	color: #36cfff;
}


/* =========================================================
   热喷涂动画主体
========================================================= */

.thermal-spray-animation {
	position: absolute;

	right: 4%;

	top: 50%;

	width: 590px;
	height: 220px;

	transform: translateY(-50%);

	z-index: 8;

	pointer-events: none;
}


/* =========================================================
   喷枪
========================================================= */

.thermal-gun {
	position: absolute;

	left: 0;
	top: 80px;

	width: 175px;
	height: 70px;

	z-index: 20;

	animation:
			thermalGunShake .075s linear infinite;
}


/* 枪身 */

.thermal-gun-body {
	position: absolute;

	left: 0;
	top: 8px;

	width: 108px;
	height: 46px;

	border-radius:
			12px 5px 5px 12px;

	background:
			linear-gradient(
					180deg,
					#eef4f7 0%,
					#899da9 18%,
					#d8e2e7 43%,
					#566a76 72%,
					#b9c7ce 100%
			);

	border:
			1px solid rgba(255,255,255,.4);

	box-shadow:
			0 10px 25px rgba(0,0,0,.45),
			inset 0 1px 2px rgba(255,255,255,.9);
}


/* 枪身黑色控制区域 */

.thermal-gun-body::before {
	content: "";

	position: absolute;

	left: 16px;
	top: 10px;

	width: 54px;
	height: 25px;

	border-radius: 5px;

	background:
			linear-gradient(
					180deg,
					#243b49,
					#0d1921
			);
}


.thermal-gun-body span {
	position: absolute;

	bottom: 7px;
	left: 18px;

	width: 65px;
	height: 2px;

	background:
			rgba(255,255,255,.25);
}


/* 枪管 */

.thermal-gun-barrel {
	position: absolute;

	left: 100px;
	top: 17px;

	width: 46px;
	height: 28px;

	background:
			linear-gradient(
					180deg,
					#e5edef,
					#5e717c 48%,
					#c3cfd5
			);

	clip-path:
			polygon(
					0 10%,
					100% 28%,
					100% 72%,
					0 90%
			);
}


/* 喷嘴 */

.thermal-gun-nozzle {
	position: absolute;

	left: 141px;
	top: 20px;

	width: 35px;
	height: 22px;

	background:
			linear-gradient(
					180deg,
					#eef3f5,
					#485b66 50%,
					#c8d3d8
			);

	clip-path:
			polygon(
					0 8%,
					100% 30%,
					100% 70%,
					0 92%
			);
}


.thermal-gun-nozzle::after {
	content: "";

	position: absolute;

	right: -5px;
	top: 6px;

	width: 9px;
	height: 10px;

	border-radius: 50%;

	background: #ffffff;

	box-shadow:
			0 0 5px #ffffff,
			0 0 12px #00d8ff,
			0 0 25px #008cff,
			0 0 42px #006aff;

	animation:
			thermalNozzleFlash .1s linear infinite alternate;
}


/* =========================================================
   高速焰流
========================================================= */

.thermal-flame {
	position: absolute;

	left: 176px;
	top: 92px;

	width: 310px;
	height: 48px;

	transform-origin:
			left center;

	z-index: 8;

	animation:
			thermalJetPulse .12s ease-in-out infinite alternate;
}


/* 外层辉光 */

.thermal-flame-glow {
	position: absolute;

	left: 0;
	top: 0;

	width: 100%;
	height: 48px;

	border-radius:
			2px 100% 100% 2px;

	background:
			linear-gradient(
					90deg,
					rgba(80,236,255,.9) 0%,
					rgba(0,184,255,.8) 25%,
					rgba(0,100,255,.42) 62%,
					transparent 100%
			);

	filter:
			blur(10px);

	opacity: .75;

	animation:
			thermalJetGlow .17s ease-in-out infinite alternate;
}


/* 蓝色焰流 */

.thermal-flame-blue {
	position: absolute;

	left: 0;
	top: 10px;

	width: 95%;
	height: 28px;

	border-radius:
			3px 100% 100% 3px;

	background:
			linear-gradient(
					90deg,
					#b7f9ff 0%,
					#47e9ff 12%,
					#00c8ff 28%,
					#007bff 58%,
					rgba(0,70,255,.28) 82%,
					transparent 100%
			);

	filter:
			blur(2px);

	animation:
			thermalBlueJet .08s linear infinite alternate;
}


/* 白色核心 */

.thermal-flame-core {
	position: absolute;

	left: 0;
	top: 20px;

	width: 74%;
	height: 8px;

	border-radius:
			2px 100% 100% 2px;

	background:
			linear-gradient(
					90deg,
					#ffffff,
					#ffffff 15%,
					#b8faff 38%,
					#23dfff 64%,
					transparent
			);

	box-shadow:
			0 0 5px #fff,
			0 0 12px #31dbff,
			0 0 22px #008cff;

	animation:
			thermalCoreJet .06s linear infinite alternate;
}


/* =========================================================
   喷涂颗粒
========================================================= */

.thermal-particles {
	position: absolute;

	left: 180px;
	top: 76px;

	width: 350px;
	height: 90px;

	z-index: 18;
}


.thermal-particles i {
	position: absolute;

	left: 0;

	width: 4px;
	height: 4px;

	border-radius: 50%;

	background: #ffd44a;

	box-shadow:
			0 0 4px #fff,
			0 0 8px #ffb000,
			0 0 13px rgba(255,100,0,.8);

	opacity: 0;

	animation:
			thermalParticleFly .62s linear infinite;
}


/* 颗粒位置 */

.thermal-particles i:nth-child(1) {
	top: 34px;
	animation-delay: 0s;
}

.thermal-particles i:nth-child(2) {
	top: 26px;
	animation-delay: .04s;
}

.thermal-particles i:nth-child(3) {
	top: 45px;
	animation-delay: .08s;
}

.thermal-particles i:nth-child(4) {
	top: 30px;
	animation-delay: .12s;
}

.thermal-particles i:nth-child(5) {
	top: 51px;
	animation-delay: .16s;
}

.thermal-particles i:nth-child(6) {
	top: 22px;
	animation-delay: .20s;
}

.thermal-particles i:nth-child(7) {
	top: 40px;
	animation-delay: .24s;
}

.thermal-particles i:nth-child(8) {
	top: 56px;
	animation-delay: .28s;
}

.thermal-particles i:nth-child(9) {
	top: 29px;
	animation-delay: .32s;
}

.thermal-particles i:nth-child(10) {
	top: 47px;
	animation-delay: .36s;
}

.thermal-particles i:nth-child(11) {
	top: 20px;
	animation-delay: .40s;
}

.thermal-particles i:nth-child(12) {
	top: 38px;
	animation-delay: .44s;
}

.thermal-particles i:nth-child(13) {
	top: 53px;
	animation-delay: .48s;
}

.thermal-particles i:nth-child(14) {
	top: 32px;
	animation-delay: .52s;
}

.thermal-particles i:nth-child(15) {
	top: 43px;
	animation-delay: .56s;
}


/* =========================================================
   工件
========================================================= */

.thermal-workpiece {
	position: absolute;

	right: 10px;
	top: 46px;

	width: 42px;
	height: 125px;

	border-radius: 5px;

	background:
			linear-gradient(
					90deg,
					#24323a,
					#87969e 20%,
					#d3dde1 38%,
					#708087 60%,
					#2b3941 82%,
					#172229
			);

	box-shadow:
			-8px 5px 25px rgba(0,0,0,.5);

	z-index: 25;
}


/* 金属纹理 */

.thermal-workpiece::after {
	content: "";

	position: absolute;

	inset: 0;

	background:
			repeating-linear-gradient(
					0deg,
					transparent 0,
					transparent 6px,
					rgba(255,255,255,.035) 7px
			);
}


/* 涂层 */

.thermal-coating {
	position: absolute;

	left: -6px;
	top: 50%;

	transform:
			translateY(-50%);

	width: 7px;
	height: 12px;

	border-radius:
			4px 0 0 4px;

	background:
			linear-gradient(
					90deg,
					#ffc344,
					#876016
			);

	box-shadow:
			-4px 0 12px rgba(255,165,0,.65);

	animation:
			thermalCoatingBuild 1.5s ease-in-out infinite;
}


/* 撞击火花 */

.thermal-impact {
	position: absolute;

	left: -25px;
	top: 47px;

	width: 40px;
	height: 32px;

	border-radius: 50%;

	background:
			radial-gradient(
					circle,
					#ffffff 0%,
					rgba(255,230,120,.95) 18%,
					rgba(255,160,0,.7) 34%,
					rgba(0,190,255,.35) 55%,
					transparent 74%
			);

	filter:
			blur(3px);

	animation:
			thermalImpact .12s ease-in-out infinite alternate;
}


/* =========================================================
   动态环境光
========================================================= */

.thermal-light {
	position: absolute;

	z-index: 4;

	pointer-events: none;
}


.thermal-light-1 {
	width: 420px;
	height: 2px;

	right: 10%;
	top: 33%;

	background:
			linear-gradient(
					90deg,
					transparent,
					rgba(0,210,255,.6),
					transparent
			);

	transform:
			rotate(-8deg);

	animation:
			thermalLightMove 3s linear infinite;
}


.thermal-light-2 {
	width: 300px;
	height: 1px;

	right: 20%;
	bottom: 22%;

	background:
			linear-gradient(
					90deg,
					transparent,
					rgba(255,180,60,.5),
					transparent
			);

	transform:
			rotate(8deg);

	animation:
			thermalLightMove 4s linear infinite reverse;
}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes thermalGunShake {

	0% {
		transform: translate(0,0);
	}

	25% {
		transform: translate(.7px,-.4px);
	}

	50% {
		transform: translate(0,.4px);
	}

	75% {
		transform: translate(-.7px,-.3px);
	}

	100% {
		transform: translate(0,0);
	}

}


@keyframes thermalNozzleFlash {

	from {
		transform: scale(.75);
		opacity: .65;
	}

	to {
		transform: scale(1.4);
		opacity: 1;
	}

}


@keyframes thermalJetPulse {

	from {
		transform:
				scaleX(.92)
				scaleY(.9);
	}

	to {
		transform:
				scaleX(1.06)
				scaleY(1.08);
	}

}


@keyframes thermalJetGlow {

	from {
		opacity: .45;
		transform: scaleY(.75);
	}

	to {
		opacity: .95;
		transform: scaleY(1.18);
	}

}


@keyframes thermalBlueJet {

	from {
		transform: scaleX(.92);
		opacity: .7;
	}

	to {
		transform: scaleX(1.08);
		opacity: 1;
	}

}


@keyframes thermalCoreJet {

	from {
		transform: scaleX(.88);
		opacity: .72;
	}

	to {
		transform: scaleX(1.13);
		opacity: 1;
	}

}


@keyframes thermalParticleFly {

	0% {
		transform:
				translateX(0)
				translateY(0)
				scale(.35);

		opacity: 0;
	}

	8% {
		opacity: 1;
	}

	65% {
		opacity: 1;
	}

	100% {
		transform:
				translateX(355px)
				translateY(2px)
				scale(1.15);

		opacity: 0;
	}

}


@keyframes thermalCoatingBuild {

	0% {
		height: 10px;
	}

	35% {
		height: 45px;
	}

	70% {
		height: 90px;
	}

	100% {
		height: 112px;
	}

}


@keyframes thermalImpact {

	from {
		transform: scale(.7);
		opacity: .35;
	}

	to {
		transform: scale(1.35);
		opacity: 1;
	}

}


@keyframes thermalAmbientPulse {

	from {
		transform: scale(.85);
		opacity: .55;
	}

	to {
		transform: scale(1.15);
		opacity: 1;
	}

}


@keyframes thermalLightMove {

	from {
		transform:
				translateX(-80px)
				rotate(-8deg);

		opacity: 0;
	}

	30% {
		opacity: 1;
	}

	70% {
		opacity: .8;
	}

	to {
		transform:
				translateX(100px)
				rotate(-8deg);

		opacity: 0;
	}

}


/* =========================================================
   平板
========================================================= */

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

	.thermal-spray-animation {
		right: -80px;

		transform:
				translateY(-50%)
				scale(.8);

		opacity: .72;
	}

}


/* =========================================================
   手机
========================================================= */

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

	.thermal-spray-title-area {
		min-height: 350px;
	}


	.thermal-spray-animation {
		right: -220px;
		top: 52%;

		transform:
				translateY(-50%)
				scale(.55);

		opacity: .45;
	}


	.thermal-banner-overlay {
		background:
				linear-gradient(
						90deg,
						rgba(3,12,20,.95) 0%,
						rgba(3,15,25,.89) 62%,
						rgba(3,15,25,.72) 100%
				);
	}


	.thermal-title-content {
		max-width: 90%;
	}


	.thermal-title-content h2 {
		font-size: 34px !important;
	}


	.thermal-small-title {
		font-size: 9px;

		letter-spacing: 2px;
	}

}


/* =========================================================
   Reduce Motion
========================================================= */

@media (prefers-reduced-motion: reduce) {

	.thermal-gun,
	.thermal-gun-nozzle::after,
	.thermal-flame,
	.thermal-flame-glow,
	.thermal-flame-blue,
	.thermal-flame-core,
	.thermal-particles i,
	.thermal-coating,
	.thermal-impact,
	.thermal-light,
	.thermal-spray-title-area::before {

		animation: none !important;

	}

}
/* =========================================================
   Product category navigation
========================================================= */
.product-category-nav {
	margin: -5px 0 38px;
}

.product-category-nav-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.product-category-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 9px 18px;
	border: 1px solid #e4e8ed;
	border-radius: 8px;
	background: #fff;
	color: #252525;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	transition: all .25s ease;
}

.product-category-link:hover,
.product-category-link.is-active {
	color: #fff;
	border-color: #ff5e15;
	background: #ff5e15;
}

/* =========================================================
   Product List Template
   Desktop 3 / Tablet 2 / Mobile 1
========================================================= */
.product-list-grid {
	row-gap: 34px;
}

.product-list-column {
	display: flex;
	opacity: 0;
	transform: translateY(24px);
	animation: productCardReveal .68s cubic-bezier(.2,.75,.25,1) forwards;
	animation-delay: calc(var(--product-index, 1) * 55ms);
}

.product-list-item {
	position: relative;
	width: 100%;
	height: 100%;
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid #e9edf2;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 12px 32px rgba(18, 35, 52, .08);
	transition:
			transform .38s cubic-bezier(.2,.75,.25,1),
			box-shadow .38s ease,
			border-color .38s ease;
}

.product-list-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 6;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, #00b7ff, #ff7a18, #00b7ff);
	background-size: 220% 100%;
	transform: scaleX(.32);
	transform-origin: left center;
	opacity: .75;
	transition: transform .4s ease, opacity .4s ease;
	animation: productTopLineMove 3.8s linear infinite;
}

.product-list-item:hover {
	transform: translateY(-10px);
	border-color: rgba(255, 94, 21, .34);
	box-shadow:
			0 24px 55px rgba(18, 35, 52, .16),
			0 0 0 1px rgba(255, 94, 21, .06);
}

.product-list-item:hover::before {
	transform: scaleX(1);
	opacity: 1;
}

/* =========================================================
   Clean product main image
   仅显示真实主图，不显示灰色背景、发光、标签、扫光和装饰块
========================================================= */
.product-list-image,
.product-main-image {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	padding: 0 !important;
	margin: 0;
	min-height: 0 !important;
	aspect-ratio: auto !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	isolation: auto;
}

/*
 * 强制关闭原主题 .portfolio-img 或其它图片样式产生的伪元素装饰。
 */
.product-list-image::before,
.product-list-image::after,
.product-main-image::before,
.product-main-image::after {
	content: none !important;
	display: none !important;
	background: none !important;
	box-shadow: none !important;
	border: 0 !important;
}

/* 主图本身 */
.product-list-image img,
.product-main-image img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: auto !important;
	max-width: 100%;
	margin: 0;
	object-fit: contain;
	object-position: center center;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
	filter: none !important;
	transform: scale(1);
	transition: transform .35s cubic-bezier(.2,.75,.25,1);
}

/* 只保留轻微缩放，不增加任何背景或遮罩 */
.product-list-item:hover .product-list-image img,
.product-list-item:hover .product-main-image img {
	transform: scale(1.02);
	filter: none !important;
}

.product-list-content {
	position: relative;
	flex: 1;
	padding-top: 24px;
	transition: background .35s ease;
}

.product-list-content h3 {
	margin-bottom: 0;
}

.product-list-content h3 a {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .28s ease;
}

.product-list-item:hover .product-list-content h3 a {
	color: #ff5e15;
}

.product-card-arrow {
	transition:
			transform .32s ease,
			background .32s ease,
			color .32s ease,
			box-shadow .32s ease !important;
}

.product-list-item:hover .product-card-arrow {
	transform: translateX(4px);
	box-shadow: 0 8px 18px rgba(255,94,21,.22);
}

.product-category-description {
	max-width: 900px;
	margin: 15px auto 0;
}

.product-category-description p:last-child {
	margin-bottom: 0;
}

@keyframes productCardReveal {
	from {
		opacity: 0;
		transform: translateY(24px) scale(.985);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes productTopLineMove {
	0% { background-position: 0% 50%; }
	100% { background-position: 220% 50%; }
}

@keyframes productImageShine {
	from {
		transform: rotate(16deg) translateX(-170%);
	}
	to {
		transform: rotate(16deg) translateX(520%);
	}
}

/* =========================================================
   Pagination
========================================================= */
.product-pagination-wrap {
	margin-top: 45px;
	text-align: center;
}

.product-pagination-wrap .page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.product-pagination-wrap .page-numbers li {
	margin: 0;
}

.product-pagination-wrap .page-numbers a,
.product-pagination-wrap .page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border: 1px solid #e2e6ea;
	border-radius: 7px;
	background: #fff;
	color: #252525;
	font-weight: 600;
	transition: all .25s ease;
}

.product-pagination-wrap .page-numbers a:hover,
.product-pagination-wrap .page-numbers .current {
	color: #fff;
	border-color: #ff5e15;
	background: #ff5e15;
}

.product-empty-message {
	padding: 50px 25px;
	text-align: center;
	border: 1px solid #edf0f2;
	background: #fafbfc;
}

@media (max-width: 767px) {
	.product-category-nav {
		margin-bottom: 28px;
	}

	.product-category-nav-inner {
		justify-content: flex-start;
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 8px;
		-webkit-overflow-scrolling: touch;
	}

	.product-category-link {
		flex: 0 0 auto;
		white-space: nowrap;
	}

	.product-list-image,
	.product-main-image {
		min-height: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}
}

/* =========================================================
   Dynamic category banner + thermal spray animation
========================================================= */
.thermal-spray-title-area {
	position: relative !important;
	min-height: 430px;
	overflow: hidden;
	background-position: center center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
}

.thermal-banner-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(90deg, rgba(3,12,20,.94) 0%, rgba(5,21,34,.86) 36%, rgba(4,19,31,.58) 67%, rgba(1,10,18,.70) 100%);
}

.thermal-spray-title-area .d-table {
	position: relative;
	z-index: 20;
	width: 100%;
	min-height: 430px;
}

.thermal-title-content {
	position: relative;
	max-width: 610px;
	text-align: left !important;
}

.thermal-small-title {
	display: inline-flex;
	align-items: center;
	margin-bottom: 15px;
	color: #67dcff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 3px;
}

.thermal-small-title::before {
	content: "";
	width: 34px;
	height: 2px;
	margin-right: 12px;
	background: #00c8ff;
	box-shadow: 0 0 8px rgba(0,200,255,.85);
}

.thermal-title-content h2 {
	margin: 0 0 18px !important;
	color: #fff !important;
	font-size: clamp(34px, 4vw, 58px) !important;
	line-height: 1.12 !important;
	font-weight: 800 !important;
	letter-spacing: -1px;
	text-shadow: 0 5px 25px rgba(0,0,0,.42);
}

.thermal-title-content ul {
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	align-items: center;
	gap: 12px;
}

.thermal-title-content ul li,
.thermal-title-content ul li a {
	color: rgba(255,255,255,.82) !important;
}

.thermal-title-content ul li a:hover {
	color: #37d4ff !important;
}

.thermal-title-content ul li + li::before {
	content: "/";
	margin-right: 12px;
	color: #36cfff;
}

.thermal-spray-animation {
	position: absolute;
	right: 4%;
	top: 50%;
	width: 590px;
	height: 220px;
	transform: translateY(-50%);
	z-index: 8;
	pointer-events: none;
}

.thermal-gun {
	position: absolute;
	left: 0;
	top: 80px;
	width: 175px;
	height: 70px;
	z-index: 20;
	animation: thermalGunShake .075s linear infinite;
}

.thermal-gun-body {
	position: absolute;
	left: 0;
	top: 8px;
	width: 108px;
	height: 46px;
	border-radius: 12px 5px 5px 12px;
	background: linear-gradient(180deg,#eef4f7 0%,#899da9 18%,#d8e2e7 43%,#566a76 72%,#b9c7ce 100%);
	border: 1px solid rgba(255,255,255,.4);
	box-shadow: 0 10px 25px rgba(0,0,0,.45), inset 0 1px 2px rgba(255,255,255,.9);
}

.thermal-gun-body::before {
	content: "";
	position: absolute;
	left: 16px;
	top: 10px;
	width: 54px;
	height: 25px;
	border-radius: 5px;
	background: linear-gradient(180deg,#243b49,#0d1921);
}

.thermal-gun-body span {
	position: absolute;
	bottom: 7px;
	left: 18px;
	width: 65px;
	height: 2px;
	background: rgba(255,255,255,.25);
}

.thermal-gun-barrel {
	position: absolute;
	left: 100px;
	top: 17px;
	width: 46px;
	height: 28px;
	background: linear-gradient(180deg,#e5edef,#5e717c 48%,#c3cfd5);
	clip-path: polygon(0 10%,100% 28%,100% 72%,0 90%);
}

.thermal-gun-nozzle {
	position: absolute;
	left: 141px;
	top: 20px;
	width: 35px;
	height: 22px;
	background: linear-gradient(180deg,#eef3f5,#485b66 50%,#c8d3d8);
	clip-path: polygon(0 8%,100% 30%,100% 70%,0 92%);
}

.thermal-gun-nozzle::after {
	content: "";
	position: absolute;
	right: -5px;
	top: 6px;
	width: 9px;
	height: 10px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 5px #fff,0 0 12px #00d8ff,0 0 25px #008cff,0 0 42px #006aff;
	animation: thermalNozzleFlash .1s linear infinite alternate;
}

.thermal-flame {
	position: absolute;
	left: 176px;
	top: 92px;
	width: 310px;
	height: 48px;
	transform-origin: left center;
	z-index: 8;
	animation: thermalJetPulse .12s ease-in-out infinite alternate;
}

.thermal-flame-glow {
	position: absolute;
	inset: 0 auto auto 0;
	width: 100%;
	height: 48px;
	border-radius: 2px 100% 100% 2px;
	background: linear-gradient(90deg,rgba(80,236,255,.9) 0%,rgba(0,184,255,.8) 25%,rgba(0,100,255,.42) 62%,transparent 100%);
	filter: blur(10px);
	opacity: .75;
	animation: thermalJetGlow .17s ease-in-out infinite alternate;
}

.thermal-flame-blue {
	position: absolute;
	left: 0;
	top: 10px;
	width: 95%;
	height: 28px;
	border-radius: 3px 100% 100% 3px;
	background: linear-gradient(90deg,#b7f9ff 0%,#47e9ff 12%,#00c8ff 28%,#007bff 58%,rgba(0,70,255,.28) 82%,transparent 100%);
	filter: blur(2px);
	animation: thermalBlueJet .08s linear infinite alternate;
}

.thermal-flame-core {
	position: absolute;
	left: 0;
	top: 20px;
	width: 74%;
	height: 8px;
	border-radius: 2px 100% 100% 2px;
	background: linear-gradient(90deg,#fff,#fff 15%,#b8faff 38%,#23dfff 64%,transparent);
	box-shadow: 0 0 5px #fff,0 0 12px #31dbff,0 0 22px #008cff;
	animation: thermalCoreJet .06s linear infinite alternate;
}

.thermal-particles {
	position: absolute;
	left: 180px;
	top: 76px;
	width: 350px;
	height: 90px;
	z-index: 18;
}

.thermal-particles i {
	position: absolute;
	left: 0;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #ffd44a;
	box-shadow: 0 0 4px #fff,0 0 8px #ffb000,0 0 13px rgba(255,100,0,.8);
	opacity: 0;
	animation: thermalParticleFly .62s linear infinite;
}

.thermal-particles i:nth-child(1){top:34px;animation-delay:0s}.thermal-particles i:nth-child(2){top:26px;animation-delay:.04s}.thermal-particles i:nth-child(3){top:45px;animation-delay:.08s}.thermal-particles i:nth-child(4){top:30px;animation-delay:.12s}.thermal-particles i:nth-child(5){top:51px;animation-delay:.16s}.thermal-particles i:nth-child(6){top:22px;animation-delay:.20s}.thermal-particles i:nth-child(7){top:40px;animation-delay:.24s}.thermal-particles i:nth-child(8){top:56px;animation-delay:.28s}.thermal-particles i:nth-child(9){top:29px;animation-delay:.32s}.thermal-particles i:nth-child(10){top:47px;animation-delay:.36s}.thermal-particles i:nth-child(11){top:20px;animation-delay:.40s}.thermal-particles i:nth-child(12){top:38px;animation-delay:.44s}.thermal-particles i:nth-child(13){top:53px;animation-delay:.48s}.thermal-particles i:nth-child(14){top:32px;animation-delay:.52s}.thermal-particles i:nth-child(15){top:43px;animation-delay:.56s}

.thermal-workpiece {
	position: absolute;
	right: 10px;
	top: 46px;
	width: 42px;
	height: 125px;
	border-radius: 5px;
	background: linear-gradient(90deg,#24323a,#87969e 20%,#d3dde1 38%,#708087 60%,#2b3941 82%,#172229);
	box-shadow: -8px 5px 25px rgba(0,0,0,.5);
	z-index: 25;
}

.thermal-workpiece::after {
	content: "";
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(0deg,transparent 0,transparent 6px,rgba(255,255,255,.035) 7px);
}

.thermal-coating {
	position: absolute;
	left: -6px;
	top: 50%;
	transform: translateY(-50%);
	width: 7px;
	height: 12px;
	border-radius: 4px 0 0 4px;
	background: linear-gradient(90deg,#ffc344,#876016);
	box-shadow: -4px 0 12px rgba(255,165,0,.65);
	animation: thermalCoatingBuild 1.5s ease-in-out infinite;
}

.thermal-impact {
	position: absolute;
	left: -25px;
	top: 47px;
	width: 40px;
	height: 32px;
	border-radius: 50%;
	background: radial-gradient(circle,#fff 0%,rgba(255,230,120,.95) 18%,rgba(255,160,0,.7) 34%,rgba(0,190,255,.35) 55%,transparent 74%);
	filter: blur(3px);
	animation: thermalImpact .12s ease-in-out infinite alternate;
}

.thermal-light {
	position: absolute;
	z-index: 4;
	pointer-events: none;
}

.thermal-light-1 {
	width: 420px;
	height: 2px;
	right: 10%;
	top: 33%;
	background: linear-gradient(90deg,transparent,rgba(0,210,255,.6),transparent);
	transform: rotate(-8deg);
	animation: thermalLightMove 3s linear infinite;
}

.thermal-light-2 {
	width: 300px;
	height: 1px;
	right: 20%;
	bottom: 22%;
	background: linear-gradient(90deg,transparent,rgba(255,180,60,.5),transparent);
	transform: rotate(8deg);
	animation: thermalLightMove 4s linear infinite reverse;
}

@keyframes thermalGunShake{0%{transform:translate(0,0)}25%{transform:translate(.7px,-.4px)}50%{transform:translate(0,.4px)}75%{transform:translate(-.7px,-.3px)}100%{transform:translate(0,0)}}
@keyframes thermalNozzleFlash{from{transform:scale(.75);opacity:.65}to{transform:scale(1.4);opacity:1}}
@keyframes thermalJetPulse{from{transform:scaleX(.92) scaleY(.9)}to{transform:scaleX(1.06) scaleY(1.08)}}
@keyframes thermalJetGlow{from{opacity:.45;transform:scaleY(.75)}to{opacity:.95;transform:scaleY(1.18)}}
@keyframes thermalBlueJet{from{transform:scaleX(.92);opacity:.7}to{transform:scaleX(1.08);opacity:1}}
@keyframes thermalCoreJet{from{transform:scaleX(.88);opacity:.72}to{transform:scaleX(1.13);opacity:1}}
@keyframes thermalParticleFly{0%{transform:translateX(0) translateY(0) scale(.35);opacity:0}8%{opacity:1}65%{opacity:1}100%{transform:translateX(355px) translateY(2px) scale(1.15);opacity:0}}
@keyframes thermalCoatingBuild{0%{height:10px}35%{height:45px}70%{height:90px}100%{height:112px}}
@keyframes thermalImpact{from{transform:scale(.7);opacity:.35}to{transform:scale(1.35);opacity:1}}
@keyframes thermalLightMove{from{transform:translateX(-80px) rotate(-8deg);opacity:0}30%{opacity:1}70%{opacity:.8}to{transform:translateX(100px) rotate(-8deg);opacity:0}}

@media (max-width:1199px){
	.thermal-spray-animation{right:-80px;transform:translateY(-50%) scale(.8);opacity:.76}
}

@media (max-width:767px){
	.thermal-spray-title-area,.thermal-spray-title-area .d-table{min-height:350px}
	.thermal-spray-animation{right:-230px;top:52%;transform:translateY(-50%) scale(.55);opacity:.44}
	.thermal-banner-overlay{background:linear-gradient(90deg,rgba(3,12,20,.96) 0%,rgba(3,15,25,.91) 63%,rgba(3,15,25,.75) 100%)}
	.thermal-title-content{max-width:90%}
	.thermal-title-content h2{font-size:34px !important}
	.thermal-small-title{font-size:9px;letter-spacing:2px}
}

@media (prefers-reduced-motion: reduce){
	.thermal-gun,.thermal-gun-nozzle::after,.thermal-flame,.thermal-flame-glow,.thermal-flame-blue,.thermal-flame-core,.thermal-particles i,.thermal-coating,.thermal-impact,.thermal-light,
	.product-list-column,.product-list-item::before,.product-list-image::after{
		animation:none !important
	}

	.product-list-column{
		opacity:1 !important;
		transform:none !important;
	}
}
/*page-css*/
/* =========================================================
         Premium Industrial Dynamic Banner
         更自然的背景色 + 热喷涂识别特征 + 动态工业感
      ========================================================= */

.industrial-page-banner {
	--banner-accent: #f28a00;
	--banner-accent-2: #ffbc57;
	--banner-cyan: #27b9ea;
	position: relative !important;
	min-height: 500px !important;
	display: flex;
	align-items: center;
	overflow: hidden;
	isolation: isolate;
	padding: 0 !important;
	background:
			linear-gradient(135deg, #08111c, #0d1723) !important;
}

.industrial-banner-bg {
	position: absolute;
	inset: -3%;
	z-index: -10;
	background-image: var(--page-banner-image);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	transform: scale(1.03);
	animation: industrialBannerZoom 15s ease-in-out infinite alternate;
	will-change: transform;
}

/* 使用更高级的深灰金属叠层，避免难看的大面积蓝紫色 */
.industrial-banner-overlay {
	position: absolute;
	inset: 0;
	z-index: -9;
	background:
			linear-gradient(
					92deg,
					rgba(8, 14, 21, .54) 0%,
					rgba(10, 17, 26, .30) 33%,
					rgba(8, 14, 21, .12) 58%,
					rgba(8, 14, 21, .32) 100%
			),
			linear-gradient(
					180deg,
					rgba(18, 24, 34, .06) 0%,
					rgba(8, 14, 21, .06) 42%,
					rgba(8, 14, 21, .34) 100%
			);
}

.industrial-banner-vignette {
	position: absolute;
	inset: 0;
	z-index: -8;
	background:
			radial-gradient(circle at 16% 42%, rgba(255,166,43,.10), transparent 36%),
			radial-gradient(circle at 78% 34%, rgba(39,185,234,.10), transparent 28%),
			linear-gradient(90deg, rgba(5,9,14,.22), transparent 35%, transparent 70%, rgba(5,9,14,.14));
	pointer-events: none;
}

.industrial-banner-grid {
	position: absolute;
	inset: 0;
	z-index: -7;
	opacity: .10;
	pointer-events: none;
	background-image:
			linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
			linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image:
			linear-gradient(90deg, rgba(0,0,0,.75), rgba(0,0,0,.18) 60%, transparent 92%);
	mask-image:
			linear-gradient(90deg, rgba(0,0,0,.75), rgba(0,0,0,.18) 60%, transparent 92%);
	animation: industrialGridDrift 18s linear infinite;
}

.industrial-banner-scan {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -26%;
	z-index: -6;
	width: 18%;
	pointer-events: none;
	opacity: .42;
	transform: skewX(-18deg);
	background:
			linear-gradient(
					90deg,
					transparent 0%,
					rgba(255,255,255,.02) 28%,
					rgba(242,138,0,.09) 48%,
					rgba(255,255,255,.03) 66%,
					transparent 100%
			);
	filter: blur(1px);
	animation: industrialScanMove 8s cubic-bezier(.4,0,.2,1) infinite;
}

.industrial-banner-light {
	position: absolute;
	z-index: -5;
	border-radius: 999px;
	pointer-events: none;
	filter: blur(28px);
	opacity: .56;
}

.industrial-banner-light-a {
	width: 360px;
	height: 360px;
	left: -120px;
	top: -180px;
	background: radial-gradient(circle, rgba(255,162,38,.18) 0%, rgba(255,162,38,.05) 46%, transparent 72%);
	animation: industrialLightA 8s ease-in-out infinite alternate;
}

.industrial-banner-light-b {
	width: 320px;
	height: 320px;
	right: -90px;
	bottom: -160px;
	background: radial-gradient(circle, rgba(39,185,234,.16) 0%, rgba(39,185,234,.05) 44%, transparent 72%);
	animation: industrialLightB 9s ease-in-out infinite alternate;
}

.industrial-banner-lines {
	position: absolute;
	right: 6%;
	top: 16%;
	z-index: 1;
	width: 290px;
	height: 130px;
	pointer-events: none;
	transform: rotate(-9deg);
	opacity: .46;
}

.industrial-banner-lines span {
	position: absolute;
	right: 0;
	height: 1px;
	border-radius: 999px;
	transform-origin: right center;
	background: linear-gradient(
			90deg,
			transparent,
			rgba(255,188,87,.24),
			rgba(255,255,255,.85)
	);
	box-shadow: 0 0 10px rgba(255,166,43,.16);
	animation: industrialSpeedLine 3.4s ease-in-out infinite;
}

.industrial-banner-lines span:nth-child(1) { top: 18px; width: 220px; animation-delay: 0s; }
.industrial-banner-lines span:nth-child(2) { top: 58px; width: 152px; animation-delay: .55s; }
.industrial-banner-lines span:nth-child(3) { top: 98px; width: 246px; animation-delay: 1.05s; }

.industrial-banner-container {
	position: relative;
	z-index: 8;
	width: 100%;
	padding-top: 78px;
	padding-bottom: 78px;
}

.industrial-banner-content {
	position: relative;
	width: min(640px, 100%);
	padding: 38px 42px 36px;
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 22px;
	background:
			linear-gradient(
					135deg,
					rgba(11,18,28,.72),
					rgba(16,26,40,.42)
			);
	box-shadow:
			0 26px 64px rgba(0,0,0,.22),
			inset 0 1px 0 rgba(255,255,255,.08);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	animation: industrialContentEnter .85s cubic-bezier(.2,.78,.25,1) both;
}

.industrial-banner-content::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 42px;
	width: 118px;
	height: 3px;
	border-radius: 0 0 999px 999px;
	background: linear-gradient(90deg, var(--banner-accent), var(--banner-accent-2));
	box-shadow: 0 0 16px rgba(242,138,0,.32);
}

.industrial-banner-content::after {
	content: "";
	position: absolute;
	top: 14px;
	right: 16px;
	width: 54px;
	height: 54px;
	border-top: 1px solid rgba(39,185,234,.42);
	border-right: 1px solid rgba(39,185,234,.42);
	opacity: .62;
}

.industrial-banner-kicker {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	color: rgba(255,255,255,.82);
	font-size: 12px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: 2.6px;
	text-transform: uppercase;
}

.industrial-kicker-dot {
	position: relative;
	width: 8px;
	height: 8px;
	flex: 0 0 8px;
	border-radius: 50%;
	background: var(--banner-accent);
	box-shadow:
			0 0 0 5px rgba(242,138,0,.10),
			0 0 16px rgba(242,138,0,.52);
	animation: industrialDotPulse 1.9s ease-in-out infinite;
}

.industrial-page-banner h1 {
	margin: 0 !important;
	max-width: 580px;
	color: #ffffff !important;
	font-size: clamp(38px, 4vw, 60px) !important;
	line-height: 1.08 !important;
	font-weight: 800 !important;
	letter-spacing: -1.6px;
	text-align: left !important;
	text-shadow: 0 8px 28px rgba(0,0,0,.34);
}

.industrial-title-line {
	position: relative;
	width: 100%;
	height: 2px;
	margin: 24px 0 20px;
	overflow: hidden;
	border-radius: 999px;
	background: rgba(255,255,255,.10);
}

.industrial-title-line span {
	position: absolute;
	top: 0;
	left: 0;
	width: 132px;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--banner-accent), var(--banner-accent-2), var(--banner-cyan));
	box-shadow: 0 0 14px rgba(242,138,0,.28);
	animation: industrialTitleLine 4.5s ease-in-out infinite alternate;
}

.industrial-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	color: rgba(255,255,255,.8);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
}

.industrial-breadcrumb a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #ffffff !important;
	transition: color .25s ease, transform .25s ease;
}

.industrial-breadcrumb a:hover {
	color: #ffb54a !important;
	transform: translateX(2px);
}

.industrial-breadcrumb a i { color: var(--banner-accent); font-size: 13px; }
.industrial-breadcrumb-separator { display: inline-flex; align-items: center; color: rgba(255,255,255,.42); font-size: 10px; }
.industrial-breadcrumb-current { color: rgba(255,255,255,.74); }

.industrial-banner-corner {
	position: absolute;
	z-index: 2;
	bottom: 38px;
	width: 74px;
	height: 74px;
	pointer-events: none;
	opacity: .6;
}

.industrial-banner-corner-left {
	left: 34px;
	border-left: 1px solid rgba(255,255,255,.28);
	border-bottom: 1px solid rgba(255,255,255,.28);
}

.industrial-banner-corner-right {
	right: 34px;
	border-right: 1px solid rgba(242,138,0,.42);
	border-bottom: 1px solid rgba(242,138,0,.42);
}

/* =========================
   Ceramic spray processing scene
========================= */
.ceramic-spray-scene {
	position: absolute;
	right: 6%;
	top: 50%;
	width: 575px;
	height: 235px;
	transform: translateY(-34%);
	z-index: 4;
	pointer-events: none;
}

.ceramic-spray-gun {
	position: absolute;
	left: 4px;
	top: 72px;
	width: 150px;
	height: 86px;
	animation: ceramicGunSweep 2.8s ease-in-out infinite alternate;
}

.ceramic-gun-body {
	position: absolute;
	left: 0;
	top: 18px;
	width: 78px;
	height: 32px;
	border-radius: 14px 12px 12px 14px;
	background: linear-gradient(180deg, #dfe7ec 0%, #9caab4 44%, #5f6d77 100%);
	box-shadow: 0 8px 20px rgba(0,0,0,.22), inset 0 1px 1px rgba(255,255,255,.7);
}

.ceramic-gun-body::before {
	content: "";
	position: absolute;
	left: 10px;
	top: 8px;
	width: 30px;
	height: 12px;
	border-radius: 4px;
	background: linear-gradient(180deg, #33404a, #111a21);
}

.ceramic-gun-joint {
	position: absolute;
	left: 26px;
	top: 39px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: radial-gradient(circle, #f4f8fa 0%, #9ba8b0 48%, #4d5962 100%);
	box-shadow: 0 0 0 3px rgba(255,255,255,.08);
}

.ceramic-gun-arm {
	position: absolute;
	left: 41px;
	top: 45px;
	width: 48px;
	height: 12px;
	border-radius: 999px;
	background: linear-gradient(180deg, #bac6ce 0%, #6d7a84 100%);
	transform: rotate(-13deg);
	transform-origin: left center;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}

.ceramic-gun-nozzle {
	position: absolute;
	left: 74px;
	top: 21px;
	width: 76px;
	height: 18px;
	background: linear-gradient(180deg, #f6f8f9 0%, #c8d1d6 38%, #73808a 100%);
	clip-path: polygon(0 18%, 82% 26%, 100% 50%, 82% 74%, 0 82%);
	box-shadow: 0 0 0 1px rgba(255,255,255,.16);
}

.ceramic-gun-nozzle::after {
	content: "";
	position: absolute;
	right: -5px;
	top: 4px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #fff7e9;
	box-shadow: 0 0 7px rgba(255,255,255,.95), 0 0 16px rgba(255,177,76,.75);
	animation: ceramicNozzlePulse .18s linear infinite alternate;
}

.ceramic-spray-plume {
	position: absolute;
	left: 148px;
	top: 78px;
	width: 255px;
	height: 48px;
	transform-origin: left center;
	animation: ceramicPlumePulse .14s ease-in-out infinite alternate;
}

.ceramic-plume-glow,
.ceramic-plume-main,
.ceramic-plume-core {
	position: absolute;
	left: 0;
	border-radius: 6px 100% 100% 6px;
}

.ceramic-plume-glow {
	top: 0;
	width: 100%;
	height: 48px;
	background: linear-gradient(90deg, rgba(255,241,217,.48) 0%, rgba(255,186,97,.44) 28%, rgba(255,145,56,.28) 52%, rgba(255,255,255,.05) 82%, transparent 100%);
	filter: blur(10px);
	opacity: .92;
}

.ceramic-plume-main {
	top: 11px;
	width: 95%;
	height: 24px;
	background: linear-gradient(90deg, #fff7ea 0%, #ffd8a4 10%, #ffb457 28%, #ff8c41 48%, rgba(255,255,255,.10) 82%, transparent 100%);
	filter: blur(1.5px);
}

.ceramic-plume-core {
	top: 19px;
	width: 72%;
	height: 7px;
	background: linear-gradient(90deg, #ffffff 0%, #fff5de 18%, #ffd68d 42%, #ffb145 68%, transparent 100%);
	box-shadow: 0 0 5px rgba(255,255,255,.9), 0 0 12px rgba(255,175,72,.42);
}

.ceramic-spray-particles {
	position: absolute;
	left: 175px;
	top: 55px;
	width: 285px;
	height: 102px;
	z-index: 2;
}

.ceramic-spray-particles i {
	position: absolute;
	left: 0;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #fff0cf;
	box-shadow: 0 0 5px #fff, 0 0 10px rgba(255,177,76,.85), 0 0 16px rgba(255,142,60,.62);
	opacity: 0;
	animation: ceramicParticleFly .78s linear infinite;
}

.ceramic-spray-particles i:nth-child(1){top:24px;animation-delay:0s}
.ceramic-spray-particles i:nth-child(2){top:41px;animation-delay:.06s}
.ceramic-spray-particles i:nth-child(3){top:17px;animation-delay:.12s}
.ceramic-spray-particles i:nth-child(4){top:49px;animation-delay:.18s}
.ceramic-spray-particles i:nth-child(5){top:31px;animation-delay:.24s}
.ceramic-spray-particles i:nth-child(6){top:57px;animation-delay:.30s}
.ceramic-spray-particles i:nth-child(7){top:21px;animation-delay:.36s}
.ceramic-spray-particles i:nth-child(8){top:45px;animation-delay:.42s}
.ceramic-spray-particles i:nth-child(9){top:34px;animation-delay:.48s}
.ceramic-spray-particles i:nth-child(10){top:61px;animation-delay:.54s}
.ceramic-spray-particles i:nth-child(11){top:27px;animation-delay:.60s}
.ceramic-spray-particles i:nth-child(12){top:52px;animation-delay:.66s}

.ceramic-workpiece {
	position: absolute;
	right: 12px;
	top: 72px;
	width: 164px;
	height: 94px;
	z-index: 3;
}

.ceramic-workpiece-shadow {
	position: absolute;
	left: 16px;
	right: 10px;
	bottom: -14px;
	height: 20px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(0,0,0,.28) 0%, rgba(0,0,0,.10) 48%, transparent 80%);
	filter: blur(4px);
}

.ceramic-workpiece-body {
	position: absolute;
	left: 18px;
	top: 14px;
	width: 124px;
	height: 66px;
	border-radius: 33px;
	background: linear-gradient(180deg, #d8e0e5 0%, #a1adb4 24%, #e7edf0 46%, #98a4ab 68%, #5e6970 100%);
	box-shadow: inset 0 1px 1px rgba(255,255,255,.62), 0 8px 18px rgba(0,0,0,.18);
}

.ceramic-workpiece-front,
.ceramic-workpiece-back {
	position: absolute;
	width: 32px;
	height: 66px;
	top: 14px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 50%, #ffffff 0%, #dce3e7 18%, #9ca7ad 50%, #59646c 100%);
}

.ceramic-workpiece-front {
	right: 22px;
	box-shadow: inset -2px 0 4px rgba(255,255,255,.4);
}

.ceramic-workpiece-back {
	left: 6px;
	opacity: .84;
}

.ceramic-workpiece-grooves {
	position: absolute;
	left: 26px;
	top: 18px;
	width: 108px;
	height: 58px;
	border-radius: 30px;
	background:
			repeating-linear-gradient(
					90deg,
					rgba(255,255,255,.18) 0,
					rgba(255,255,255,.18) 4px,
					rgba(95,108,117,.06) 4px,
					rgba(95,108,117,.06) 15px
			);
	mix-blend-mode: soft-light;
	opacity: .72;
	animation: ceramicRollerRotate 2.2s linear infinite;
}

.ceramic-coating-zone {
	position: absolute;
	left: 8px;
	top: 18px;
	width: 44px;
	height: 58px;
	border-radius: 26px 0 0 26px;
	background: linear-gradient(180deg, rgba(255,251,244,.96) 0%, rgba(248,240,227,.98) 44%, rgba(227,219,205,.96) 100%);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 0 14px rgba(255,226,185,.35);
	animation: ceramicCoatingBuild 2.1s ease-in-out infinite alternate;
}

.ceramic-impact-glow {
	position: absolute;
	left: -18px;
	top: 30px;
	width: 42px;
	height: 30px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255,255,255,.95) 0%, rgba(255,225,160,.82) 24%, rgba(255,170,70,.54) 42%, transparent 72%);
	filter: blur(2.4px);
	animation: ceramicImpactPulse .16s ease-in-out infinite alternate;
}

.ceramic-rotation-ring {
	position: absolute;
	left: 36px;
	width: 86px;
	height: 86px;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,.12);
	opacity: .0;
}

.ceramic-rotation-ring-a {
	top: 4px;
	animation: ceramicRingPulse 1.9s ease-out infinite;
}

.ceramic-rotation-ring-b {
	top: 4px;
	animation: ceramicRingPulse 1.9s ease-out .95s infinite;
}

.industrial-banner-bottom-line {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9;
	height: 3px;
	overflow: hidden;
	background: linear-gradient(90deg, rgba(255,199,120,.10), rgba(255,255,255,.08), rgba(242,138,0,.22));
}

.industrial-banner-bottom-line span {
	position: absolute;
	top: 0;
	left: -25%;
	width: 25%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.88), var(--banner-accent), transparent);
	filter: blur(.2px);
	animation: industrialBottomBeam 5.2s linear infinite;
}

@keyframes industrialBannerZoom {
	0% { transform: scale(1.03) translate3d(0,0,0); }
	100% { transform: scale(1.075) translate3d(-.35%, -.28%, 0); }
}

@keyframes industrialGridDrift {
	from { background-position: 0 0, 0 0; }
	to   { background-position: 56px 56px, 56px 56px; }
}

@keyframes industrialScanMove {
	0%, 12% { left: -26%; opacity: 0; }
	26% { opacity: .40; }
	62% { opacity: .32; }
	76%, 100% { left: 118%; opacity: 0; }
}

@keyframes industrialLightA {
	from { transform: translate3d(0,0,0) scale(.92); opacity: .32; }
	to   { transform: translate3d(48px,24px,0) scale(1.08); opacity: .56; }
}

@keyframes industrialLightB {
	from { transform: translate3d(0,0,0) scale(.92); opacity: .30; }
	to   { transform: translate3d(-44px,-22px,0) scale(1.08); opacity: .52; }
}

@keyframes industrialSpeedLine {
	0%, 100% { opacity: .12; transform: scaleX(.74) translateX(28px); }
	50% { opacity: .68; transform: scaleX(1) translateX(0); }
}

@keyframes industrialContentEnter {
	from { opacity: 0; transform: translate3d(0,22px,0) scale(.988); }
	to   { opacity: 1; transform: translate3d(0,0,0) scale(1); }
}

@keyframes industrialDotPulse {
	0%,100% {
		transform: scale(.92);
		box-shadow: 0 0 0 4px rgba(242,138,0,.08), 0 0 10px rgba(242,138,0,.45);
	}
	50% {
		transform: scale(1.12);
		box-shadow: 0 0 0 8px rgba(242,138,0,.06), 0 0 18px rgba(242,138,0,.75);
	}
}

@keyframes industrialTitleLine {
	from { width: 94px; }
	to   { width: 188px; }
}

@keyframes industrialBottomBeam {
	from { left: -25%; }
	to   { left: 110%; }
}

@keyframes ceramicGunSweep {
	0%   { transform: translateY(-2px) rotate(-1.2deg); }
	100% { transform: translateY(3px) rotate(1deg); }
}

@keyframes ceramicNozzlePulse {
	from { transform: scale(.82); opacity: .74; }
	to   { transform: scale(1.28); opacity: 1; }
}

@keyframes ceramicPlumePulse {
	from { transform: scaleX(.96) scaleY(.95); opacity: .88; }
	to   { transform: scaleX(1.05) scaleY(1.08); opacity: 1; }
}

@keyframes ceramicParticleFly {
	0%   { transform: translateX(0) translateY(0) scale(.34); opacity: 0; }
	10%  { opacity: 1; }
	66%  { opacity: 1; }
	100% { transform: translateX(260px) translateY(2px) scale(1.12); opacity: 0; }
}

@keyframes ceramicRollerRotate {
	from { background-position: 0 0; }
	to   { background-position: 44px 0; }
}

@keyframes ceramicCoatingBuild {
	0%   { width: 28px; opacity: .82; }
	50%  { width: 39px; opacity: .94; }
	100% { width: 48px; opacity: 1; }
}

@keyframes ceramicImpactPulse {
	from { transform: scale(.76); opacity: .42; }
	to   { transform: scale(1.32); opacity: 1; }
}

@keyframes ceramicRingPulse {
	0%   { transform: scale(.76); opacity: 0; }
	25%  { opacity: .24; }
	100% { transform: scale(1.16); opacity: 0; }
}

/* Tablet */
@media only screen and (max-width: 991px) {
	.industrial-page-banner { min-height: 445px !important; }

	.industrial-banner-container {
		padding-top: 64px;
		padding-bottom: 64px;
	}

	.industrial-banner-content {
		width: min(600px, 88%);
		padding: 33px 34px 31px;
	}

	.industrial-page-banner h1 {
		font-size: clamp(36px, 6vw, 52px) !important;
	}

	.industrial-banner-lines {
		right: -22px;
		opacity: .32;
	}

	.ceramic-spray-scene {
		right: -22px;
		width: 420px;
		transform: translateY(-32%) scale(.84);
		opacity: .92;
	}
}

/* Mobile */
@media only screen and (max-width: 767px) {
	.industrial-page-banner { min-height: 370px !important; }

	.industrial-banner-bg {
		inset: -4%;
		background-position: center center;
	}

	.industrial-banner-overlay {
		background:
				linear-gradient(90deg, rgba(9,14,20,.62) 0%, rgba(9,14,20,.34) 56%, rgba(9,14,20,.42) 100%),
				linear-gradient(180deg, rgba(9,14,20,.06), rgba(9,14,20,.34));
	}

	.industrial-banner-vignette {
		background:
				radial-gradient(circle at 16% 42%, rgba(255,166,43,.08), transparent 36%),
				linear-gradient(90deg, rgba(5,9,14,.18), transparent 35%, transparent 70%, rgba(5,9,14,.10));
	}

	.industrial-banner-grid {
		opacity: .08;
		background-size: 38px 38px;
	}

	.industrial-banner-container {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.industrial-banner-content {
		width: 100%;
		padding: 28px 23px 27px;
		border-radius: 16px;
		-webkit-backdrop-filter: blur(7px);
		backdrop-filter: blur(7px);
	}

	.industrial-banner-content::before { left: 23px; width: 84px; }
	.industrial-banner-content::after { width: 36px; height: 36px; top: 11px; right: 12px; }

	.industrial-banner-kicker {
		margin-bottom: 12px;
		font-size: 9px;
		letter-spacing: 1.7px;
	}

	.industrial-page-banner h1 {
		font-size: clamp(31px, 10vw, 43px) !important;
		letter-spacing: -1px;
	}

	.industrial-title-line { margin: 19px 0 18px; }
	.industrial-breadcrumb { gap: 8px; font-size: 13px; }

	.industrial-banner-lines,
	.industrial-banner-corner,
	.ceramic-spray-scene {
		display: none;
	}

	.industrial-banner-light-a {
		width: 240px;
		height: 240px;
		left: -120px;
		top: -120px;
	}

	.industrial-banner-light-b {
		width: 220px;
		height: 220px;
		right: -110px;
		bottom: -120px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.industrial-banner-bg,
	.industrial-banner-grid,
	.industrial-banner-scan,
	.industrial-banner-light,
	.industrial-banner-lines span,
	.industrial-banner-content,
	.industrial-kicker-dot,
	.industrial-title-line span,
	.industrial-banner-bottom-line span,
	.ceramic-spray-gun,
	.ceramic-gun-nozzle::after,
	.ceramic-spray-plume,
	.ceramic-spray-particles i,
	.ceramic-coating-zone,
	.ceramic-impact-glow {
		animation: none !important;
	}
}

/* =========================================================
   SEO Technical Overview
   Visual direction: clean industrial / technical documentation
========================================================= */

.page-technical-overview {
	background:
			linear-gradient(
					180deg,
					#f7fbff 0%,
					#ffffff 100%
			);
}

.seo-overview-card {
	position: relative;
	overflow: hidden;
	border: 1px solid #dce8f3;
	border-radius: 28px;
	background: #ffffff;
	box-shadow:
			0 22px 65px rgba(17, 49, 87, .08);
}

.seo-overview-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background:
			linear-gradient(
					90deg,
					#10c5dd 0%,
					#2487e8 48%,
					#6875f5 100%
			);
}

/* =========================
   Top overview area
========================= */

.seo-overview-header {
	position: relative;
	padding: 62px 62px 48px;
	overflow: hidden;
	border-bottom: 1px solid #dce8f3;
	background:
			linear-gradient(
					135deg,
					#f5faff 0%,
					#edf6ff 100%
			);
}

.seo-overview-header::after {
	content: "";
	position: absolute;
	width: 410px;
	height: 410px;
	right: -95px;
	bottom: -260px;
	border: 1px solid rgba(56, 139, 222, .12);
	border-radius: 50%;
	box-shadow:
			0 0 0 44px rgba(65, 151, 232, .035),
			0 0 0 88px rgba(65, 151, 232, .025);
	pointer-events: none;
}

.seo-overview-eyebrow {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 26px;
	color: #1d6ed2;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 3px;
	line-height: 1;
}

.seo-overview-line {
	display: inline-block;
	width: 44px;
	height: 3px;
	flex: 0 0 44px;
	border-radius: 999px;
	background:
			linear-gradient(
					90deg,
					#11c1dc,
					#1d76e0
			);
}

.seo-overview-title {
	position: relative;
	z-index: 2;
	max-width: 980px;
	margin: 0 0 24px;
	color: #0d2748;
	font-size: clamp(34px, 4vw, 52px);
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: -.8px;
}

.seo-overview-summary {
	position: relative;
	z-index: 2;
	max-width: 1080px;
	margin: 0;
	color: #58718f;
	font-size: 20px;
	line-height: 1.95;
}

/* =========================
   Publish / reading / update
========================= */

.seo-overview-meta {
	position: relative;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 22px 30px;
	margin-top: 31px;
	color: #72849a;
	font-size: 14px;
	font-weight: 700;
}

.seo-meta-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.seo-meta-item i {
	color: #64809d;
	font-size: 16px;
}

.seo-meta-item time {
	margin-left: 4px;
}

/* =========================
   Main content
========================= */

.seo-overview-body {
	padding: 62px;
}

.seo-content-panel {
	position: relative;
	padding: 36px 42px;
	border: 1px solid #cee0f1;
	border-left: 5px solid #1fc0dc;
	border-radius: 20px;
	background:
			linear-gradient(
					135deg,
					#f9fcff 0%,
					#f1f7fd 100%
			);
	color: #334f70;
	font-size: 18px;
	line-height: 1.95;
}

.seo-content-panel > *:first-child {
	margin-top: 0;
}

.seo-content-panel > *:last-child {
	margin-bottom: 0;
}

/*
 * Strong semantic hierarchy for Google and users:
 * The WordPress editor controls the actual H2/H3/H4 content.
 */
.seo-content-panel h2 {
	margin-top: 40px;
	margin-bottom: 18px;
	color: #102b4c;
	font-size: 30px;
	line-height: 1.3;
}

.seo-content-panel h3 {
	margin-top: 32px;
	margin-bottom: 15px;
	color: #173657;
	font-size: 24px;
	line-height: 1.35;
}

.seo-content-panel h4 {
	margin-top: 26px;
	margin-bottom: 12px;
	color: #214161;
	font-size: 20px;
}

.seo-content-panel p {
	margin-bottom: 20px;
}

.seo-content-panel a {
	color: #1476d4;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.seo-content-panel a:hover {
	color: #0c5cac;
}

.seo-content-panel ul,
.seo-content-panel ol {
	margin: 20px 0;
	padding-left: 26px;
}

.seo-content-panel li {
	margin-bottom: 10px;
}

.seo-content-panel img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 28px auto;
	border-radius: 14px;
}

.seo-content-panel blockquote {
	margin: 28px 0;
	padding: 22px 26px;
	border-left: 4px solid #277dd6;
	background: rgba(255, 255, 255, .7);
	color: #395773;
}

.seo-content-panel table {
	width: 100%;
	margin: 28px 0;
	border-collapse: collapse;
	background: #fff;
}

.seo-content-panel th,
.seo-content-panel td {
	padding: 14px 16px;
	border: 1px solid #d9e5ef;
	text-align: left;
}

.seo-content-panel th {
	color: #153653;
	background: #eef6fc;
	font-weight: 700;
}

.page-links {
	margin-top: 30px;
	font-weight: 700;
}


.page-title-content h1 {
	margin: 0 0 18px;
	color: #ffffff;
	font-size: inherit;
	font-weight: 700;
	line-height: 1.2;
}

/* =========================================================
   Responsive
========================================================= */

@media only screen and (max-width: 991px) {
	.seo-overview-header {
		padding: 48px 38px 40px;
	}

	.seo-overview-body {
		padding: 42px 38px;
	}
}

@media only screen and (max-width: 767px) {
	.page-technical-overview {
		padding-top: 55px;
		padding-bottom: 55px;
	}

	.seo-overview-card {
		border-radius: 18px;
	}

	.seo-overview-header {
		padding: 38px 24px 32px;
	}

	.seo-overview-eyebrow {
		margin-bottom: 20px;
		font-size: 11px;
		letter-spacing: 2px;
	}

	.seo-overview-line {
		width: 32px;
		flex-basis: 32px;
	}

	.seo-overview-title {
		font-size: 31px;
	}

	.seo-overview-summary {
		font-size: 16px;
		line-height: 1.8;
	}

	.seo-overview-meta {
		align-items: flex-start;
		flex-direction: column;
		gap: 12px;
		margin-top: 24px;
	}

	.seo-overview-body {
		padding: 26px 18px;
	}

	.seo-content-panel {
		padding: 26px 22px;
		border-radius: 15px;
		font-size: 16px;
		line-height: 1.85;
	}

	.seo-content-panel h2 {
		font-size: 25px;
	}

	.seo-content-panel h3 {
		font-size: 21px;
	}
}

/* =========================================================
   Keep original right sidebar appearance
========================================================= */

.seo-services-widget {
	margin-top: 0;
}

.seo-services-widget .widget {
	width: 100%;
}

.seo-services-widget .widget + .widget {
	margin-top: 35px;
}

@media only screen and (max-width: 991px) {
	.seo-services-widget {
		margin-top: 40px;
	}
}
/*news*/
/* =========================================================
   News Center
   Keep the original uploaded blog visual style.
   Desktop: 3 columns
   Tablet: 2 columns
   Mobile: 1 column
========================================================= */

.news-center-banner,
.news-dynamic-banner {
	position: relative;
	min-height: 500px;
	display: flex;
	align-items: center;
	overflow: hidden;
	isolation: isolate;
	padding: 0 !important;
	background: #0b1118 !important;
}

/* =========================================================
   Dynamic newsroom background
========================================================= */

.news-banner-bg {
	position: absolute;
	inset: 0;
	z-index: -10;
	background:
			radial-gradient(circle at 78% 30%, rgba(48, 122, 190, .16), transparent 29%),
			radial-gradient(circle at 16% 72%, rgba(242, 138, 0, .10), transparent 28%),
			linear-gradient(
					115deg,
					#0c131c 0%,
					#101a26 42%,
					#0c151f 72%,
					#081018 100%
			);
}

.news-banner-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
			linear-gradient(
					90deg,
					rgba(255,255,255,.015),
					transparent 28%,
					transparent 72%,
					rgba(255,255,255,.012)
			);
}

.news-banner-grid {
	position: absolute;
	inset: 0;
	z-index: -8;
	opacity: .13;
	pointer-events: none;
	background-image:
			linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
			linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
	background-size: 56px 56px;
	animation: newsGridMove 18s linear infinite;
}

.news-banner-grid::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
			linear-gradient(
					90deg,
					rgba(11,17,24,.92) 0%,
					rgba(11,17,24,.48) 42%,
					rgba(11,17,24,.14) 70%,
					rgba(11,17,24,.25) 100%
			);
}

.news-banner-scan {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -20%;
	z-index: -4;
	width: 12%;
	transform: skewX(-17deg);
	pointer-events: none;
	background:
			linear-gradient(
					90deg,
					transparent 0%,
					rgba(255,255,255,.015) 20%,
					rgba(70,169,240,.12) 50%,
					rgba(255,255,255,.025) 78%,
					transparent 100%
			);
	filter: blur(1px);
	animation: newsScanMove 7s ease-in-out infinite;
}

.news-banner-glow {
	position: absolute;
	z-index: -5;
	border-radius: 50%;
	filter: blur(35px);
	pointer-events: none;
}

.news-banner-glow-left {
	width: 360px;
	height: 360px;
	left: -160px;
	bottom: -200px;
	background:
			radial-gradient(
					circle,
					rgba(242,138,0,.15),
					rgba(242,138,0,.03) 52%,
					transparent 72%
			);
	animation: newsGlowLeft 8s ease-in-out infinite alternate;
}

.news-banner-glow-right {
	width: 440px;
	height: 440px;
	right: -110px;
	top: -210px;
	background:
			radial-gradient(
					circle,
					rgba(56,154,224,.19),
					rgba(56,154,224,.04) 52%,
					transparent 72%
			);
	animation: newsGlowRight 9s ease-in-out infinite alternate;
}

/* =========================================================
   Main text content
========================================================= */

.news-banner-container {
	position: relative;
	z-index: 8;
	width: 100%;
	padding-top: 72px;
	padding-bottom: 104px;
}

.news-banner-content {
	position: relative;
	width: min(650px, 100%);
	padding: 38px 42px 36px;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 22px;
	background:
			linear-gradient(
					135deg,
					rgba(11,18,27,.82),
					rgba(17,29,43,.54)
			);
	box-shadow:
			0 28px 68px rgba(0,0,0,.24),
			inset 0 1px 0 rgba(255,255,255,.07);
	-webkit-backdrop-filter: blur(9px);
	backdrop-filter: blur(9px);
	animation: newsContentEnter .8s cubic-bezier(.2,.78,.25,1) both;
}

.news-banner-content::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 42px;
	width: 105px;
	height: 3px;
	border-radius: 0 0 999px 999px;
	background:
			linear-gradient(
					90deg,
					#f28a00,
					#ffba55
			);
	box-shadow: 0 0 16px rgba(242,138,0,.28);
}

.news-banner-content::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 14px;
	width: 56px;
	height: 56px;
	border-top: 1px solid rgba(83,181,244,.34);
	border-right: 1px solid rgba(83,181,244,.34);
}

.news-banner-eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
	color: rgba(255,255,255,.74);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 2.5px;
	line-height: 1;
}

.news-eyebrow-line {
	display: inline-block;
	width: 36px;
	height: 2px;
	border-radius: 999px;
	background:
			linear-gradient(
					90deg,
					#f28a00,
					#ffbb5d
			);
	box-shadow: 0 0 10px rgba(242,138,0,.22);
}

.news-dynamic-banner .news-banner-content h1 {
	margin: 0 !important;
	max-width: 610px;
	color: #ffffff !important;
	font-size: clamp(40px, 4.2vw, 62px) !important;
	line-height: 1.08 !important;
	font-weight: 800 !important;
	letter-spacing: -1.7px;
	text-align: left !important;
	text-shadow: 0 8px 28px rgba(0,0,0,.28);
}

.news-banner-subtitle {
	max-width: 590px;
	margin: 18px 0 24px;
	color: rgba(255,255,255,.66);
	font-size: 16px;
	line-height: 1.8;
}

.news-banner-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	color: rgba(255,255,255,.68);
	font-size: 14px;
	font-weight: 700;
}

.news-banner-breadcrumb a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #ffffff !important;
	transition:
			color .25s ease,
			transform .25s ease;
}

.news-banner-breadcrumb a:hover {
	color: #ffad38 !important;
	transform: translateX(2px);
}

.news-banner-breadcrumb a i {
	color: #f28a00;
	font-size: 13px;
}

.news-breadcrumb-separator {
	color: rgba(255,255,255,.28);
	font-size: 9px;
}

.news-breadcrumb-current {
	color: rgba(255,255,255,.67);
}

/* =========================================================
   Animated newsroom visual
========================================================= */

.news-visual-stage {
	position: absolute;
	right: 5%;
	top: 50%;
	width: 520px;
	height: 300px;
	transform: translateY(-47%);
	z-index: 4;
	pointer-events: none;
}

.news-live-badge {
	position: absolute;
	right: 20px;
	top: 4px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border: 1px solid rgba(255,255,255,.13);
	border-radius: 999px;
	color: rgba(255,255,255,.84);
	background: rgba(10,18,27,.66);
	box-shadow: 0 10px 24px rgba(0,0,0,.16);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 2px;
	-webkit-backdrop-filter: blur(7px);
	backdrop-filter: blur(7px);
}

.news-live-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ff4d43;
	box-shadow:
			0 0 0 4px rgba(255,77,67,.10),
			0 0 14px rgba(255,77,67,.7);
	animation: newsLivePulse 1.4s ease-in-out infinite;
}

.news-globe {
	position: absolute;
	right: 98px;
	top: 46px;
	width: 210px;
	height: 210px;
	border-radius: 50%;
	animation: newsGlobeFloat 5.5s ease-in-out infinite alternate;
}

.news-globe-core {
	position: absolute;
	inset: 25px;
	border-radius: 50%;
	background:
			radial-gradient(circle at 35% 30%, rgba(255,255,255,.10), transparent 33%),
			radial-gradient(circle at center, rgba(42,142,214,.15), rgba(8,18,28,.02) 67%);
	border: 1px solid rgba(90,184,246,.20);
	box-shadow:
			inset 0 0 40px rgba(63,164,229,.08),
			0 0 34px rgba(63,164,229,.08);
}

.news-globe-ring {
	position: absolute;
	inset: 14px;
	border-radius: 50%;
	border: 1px solid rgba(94,190,251,.27);
}

.news-globe-ring-1 {
	transform: rotateX(68deg);
	animation: newsGlobeSpinA 8s linear infinite;
}

.news-globe-ring-2 {
	transform: rotateY(68deg);
	animation: newsGlobeSpinB 9s linear infinite reverse;
}

.news-globe-ring-3 {
	inset: 36px;
	border-color: rgba(242,138,0,.18);
	animation: newsGlobePulse 3s ease-in-out infinite;
}

.news-globe-axis {
	position: absolute;
	left: 50%;
	top: 7px;
	bottom: 7px;
	width: 1px;
	transform: translateX(-50%);
	background:
			linear-gradient(
					180deg,
					transparent,
					rgba(255,255,255,.16),
					transparent
			);
}

.news-floating-card {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 185px;
	padding: 14px 16px;
	border: 1px solid rgba(255,255,255,.11);
	border-radius: 14px;
	background:
			linear-gradient(
					135deg,
					rgba(14,24,36,.82),
					rgba(18,31,46,.60)
			);
	box-shadow: 0 16px 36px rgba(0,0,0,.20);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.news-floating-card-1 {
	left: 5px;
	top: 58px;
	animation: newsCardFloatA 4.6s ease-in-out infinite alternate;
}

.news-floating-card-2 {
	right: 0;
	bottom: 38px;
	animation: newsCardFloatB 5s ease-in-out infinite alternate;
}

.news-card-icon {
	width: 36px;
	height: 36px;
	flex: 0 0 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	color: #ffac3d;
	background: rgba(242,138,0,.10);
	border: 1px solid rgba(242,138,0,.18);
	font-size: 15px;
}

.news-card-lines {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.news-card-lines i {
	display: block;
	height: 4px;
	border-radius: 999px;
	background:
			linear-gradient(
					90deg,
					rgba(255,255,255,.48),
					rgba(255,255,255,.14)
			);
	animation: newsCardLine 2.8s ease-in-out infinite alternate;
}

.news-card-lines i:nth-child(1) { width: 100%; }
.news-card-lines i:nth-child(2) { width: 82%; }
.news-card-lines i:nth-child(3) { width: 58%; }

.news-waveform {
	position: absolute;
	left: 65px;
	bottom: 46px;
	width: 240px;
	height: 48px;
	display: flex;
	align-items: center;
	gap: 7px;
	opacity: .72;
}

.news-waveform i {
	display: block;
	width: 3px;
	height: 10px;
	border-radius: 999px;
	background:
			linear-gradient(
					180deg,
					#55bdf8,
					#f28a00
			);
	box-shadow: 0 0 8px rgba(73,178,243,.14);
	animation: newsWave 1.25s ease-in-out infinite;
}

.news-waveform i:nth-child(2n) { animation-delay: .12s; }
.news-waveform i:nth-child(3n) { animation-delay: .24s; }
.news-waveform i:nth-child(4n) { animation-delay: .36s; }

.news-signal-lines {
	position: absolute;
	right: 2px;
	top: 98px;
	width: 130px;
	height: 80px;
}

.news-signal-lines span {
	position: absolute;
	right: 0;
	height: 1px;
	border-radius: 999px;
	background:
			linear-gradient(
					90deg,
					transparent,
					rgba(95,191,249,.55),
					rgba(255,255,255,.82)
			);
	animation: newsSignalLine 2.8s ease-in-out infinite;
}

.news-signal-lines span:nth-child(1) {
	top: 8px;
	width: 100px;
}

.news-signal-lines span:nth-child(2) {
	top: 35px;
	width: 72px;
	animation-delay: .45s;
}

.news-signal-lines span:nth-child(3) {
	top: 63px;
	width: 118px;
	animation-delay: .85s;
}

/* =========================================================
   Bottom ticker
========================================================= */

.news-banner-ticker {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	height: 50px;
	display: flex;
	align-items: stretch;
	border-top: 1px solid rgba(255,255,255,.09);
	background: rgba(7,13,20,.80);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.news-ticker-label {
	position: relative;
	z-index: 2;
	min-width: 116px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	color: #ffffff;
	background:
			linear-gradient(
					135deg,
					#d97800,
					#f28a00
			);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1.6px;
}

.news-ticker-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 0 10px rgba(255,255,255,.72);
	animation: newsTickerDot 1.3s ease-in-out infinite;
}

.news-ticker-track {
	position: relative;
	flex: 1;
	overflow: hidden;
	white-space: nowrap;
}

.news-ticker-track::before,
.news-ticker-track::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 55px;
	z-index: 2;
	pointer-events: none;
}

.news-ticker-track::before {
	left: 0;
	background:
			linear-gradient(
					90deg,
					rgba(7,13,20,.96),
					transparent
			);
}

.news-ticker-track::after {
	right: 0;
	background:
			linear-gradient(
					270deg,
					rgba(7,13,20,.96),
					transparent
			);
}

.news-ticker-content {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	display: inline-flex;
	align-items: center;
	gap: 25px;
	min-width: max-content;
	padding-left: 30px;
	color: rgba(255,255,255,.68);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .3px;
	animation: newsTickerMove 22s linear infinite;
}

.news-ticker-content i {
	display: inline-block;
	width: 5px;
	height: 5px;
	flex: 0 0 5px;
	border-radius: 50%;
	background: #f28a00;
	opacity: .78;
}

/* =========================================================
   Banner animation keyframes
========================================================= */

@keyframes newsGridMove {
	from {
		background-position: 0 0, 0 0;
	}
	to {
		background-position: 56px 56px, 56px 56px;
	}
}

@keyframes newsScanMove {
	0%, 12% {
		left: -20%;
		opacity: 0;
	}
	25% {
		opacity: .48;
	}
	68% {
		opacity: .34;
	}
	82%, 100% {
		left: 118%;
		opacity: 0;
	}
}

@keyframes newsGlowLeft {
	from {
		transform: translate3d(0,0,0) scale(.92);
		opacity: .38;
	}
	to {
		transform: translate3d(54px,-20px,0) scale(1.08);
		opacity: .64;
	}
}

@keyframes newsGlowRight {
	from {
		transform: translate3d(0,0,0) scale(.92);
		opacity: .34;
	}
	to {
		transform: translate3d(-50px,35px,0) scale(1.08);
		opacity: .62;
	}
}

@keyframes newsContentEnter {
	from {
		opacity: 0;
		transform: translateY(22px) scale(.988);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes newsLivePulse {
	0%, 100% {
		transform: scale(.86);
		box-shadow:
				0 0 0 3px rgba(255,77,67,.08),
				0 0 10px rgba(255,77,67,.58);
	}
	50% {
		transform: scale(1.12);
		box-shadow:
				0 0 0 7px rgba(255,77,67,.07),
				0 0 17px rgba(255,77,67,.86);
	}
}

@keyframes newsGlobeFloat {
	from {
		transform: translateY(-4px);
	}
	to {
		transform: translateY(7px);
	}
}

@keyframes newsGlobeSpinA {
	from {
		transform: rotateX(68deg) rotateZ(0deg);
	}
	to {
		transform: rotateX(68deg) rotateZ(360deg);
	}
}

@keyframes newsGlobeSpinB {
	from {
		transform: rotateY(68deg) rotateZ(0deg);
	}
	to {
		transform: rotateY(68deg) rotateZ(360deg);
	}
}

@keyframes newsGlobePulse {
	0%,100% {
		transform: scale(.92);
		opacity: .28;
	}
	50% {
		transform: scale(1.08);
		opacity: .62;
	}
}

@keyframes newsCardFloatA {
	from {
		transform: translate3d(0,-4px,0) rotate(-1deg);
	}
	to {
		transform: translate3d(10px,8px,0) rotate(1deg);
	}
}

@keyframes newsCardFloatB {
	from {
		transform: translate3d(0,5px,0) rotate(.8deg);
	}
	to {
		transform: translate3d(-9px,-6px,0) rotate(-.8deg);
	}
}

@keyframes newsCardLine {
	from {
		opacity: .36;
		transform: scaleX(.86);
		transform-origin: left center;
	}
	to {
		opacity: .78;
		transform: scaleX(1);
		transform-origin: left center;
	}
}

@keyframes newsWave {
	0%,100% {
		height: 10px;
		opacity: .42;
	}
	50% {
		height: 42px;
		opacity: 1;
	}
}

@keyframes newsSignalLine {
	0%,100% {
		opacity: .16;
		transform: translateX(20px) scaleX(.78);
	}
	50% {
		opacity: .78;
		transform: translateX(0) scaleX(1);
	}
}

@keyframes newsTickerDot {
	0%,100% {
		opacity: .55;
		transform: scale(.88);
	}
	50% {
		opacity: 1;
		transform: scale(1.18);
	}
}

@keyframes newsTickerMove {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

/* =========================================================
   Banner responsive
========================================================= */

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

	.news-visual-stage {
		right: -40px;
		transform: translateY(-47%) scale(.86);
		opacity: .88;
	}

	.news-banner-content {
		width: min(600px, 72%);
	}

}

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

	.news-center-banner,
	.news-dynamic-banner {
		min-height: 455px;
	}

	.news-banner-container {
		padding-top: 62px;
		padding-bottom: 94px;
	}

	.news-banner-content {
		width: min(590px, 82%);
		padding: 33px 34px 31px;
	}

	.news-visual-stage {
		right: -115px;
		transform: translateY(-47%) scale(.72);
		opacity: .54;
	}

}

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

	.news-center-banner,
	.news-dynamic-banner {
		min-height: 405px;
	}

	.news-banner-container {
		padding-top: 48px;
		padding-bottom: 92px;
	}

	.news-banner-content {
		width: 100%;
		padding: 28px 23px 27px;
		border-radius: 16px;
		background:
				linear-gradient(
						135deg,
						rgba(10,18,27,.88),
						rgba(16,27,40,.67)
				);
	}

	.news-banner-content::before {
		left: 23px;
		width: 80px;
	}

	.news-banner-content::after {
		width: 36px;
		height: 36px;
		top: 11px;
		right: 12px;
	}

	.news-banner-eyebrow {
		margin-bottom: 13px;
		font-size: 9px;
		letter-spacing: 1.7px;
	}

	.news-eyebrow-line {
		width: 28px;
	}

	.news-dynamic-banner .news-banner-content h1 {
		font-size: clamp(32px, 10vw, 44px) !important;
		letter-spacing: -1px;
	}

	.news-banner-subtitle {
		margin-top: 14px;
		margin-bottom: 20px;
		font-size: 14px;
		line-height: 1.7;
	}

	.news-banner-breadcrumb {
		font-size: 13px;
	}

	.news-visual-stage {
		display: none;
	}

	.news-banner-grid {
		background-size: 38px 38px;
		opacity: .09;
	}

	.news-banner-ticker {
		height: 46px;
	}

	.news-ticker-label {
		min-width: 90px;
		font-size: 10px;
	}

	.news-ticker-content {
		gap: 20px;
		font-size: 12px;
	}

}

@media (prefers-reduced-motion: reduce) {

	.news-banner-grid,
	.news-banner-scan,
	.news-banner-glow,
	.news-banner-content,
	.news-live-dot,
	.news-globe,
	.news-globe-ring,
	.news-globe-ring-3,
	.news-floating-card,
	.news-card-lines i,
	.news-waveform i,
	.news-signal-lines span,
	.news-ticker-dot,
	.news-ticker-content {
		animation: none !important;
	}

}


.news-center-section .row {
	row-gap: 30px;
}


.news-center-column {
	display: flex;
}


.news-center-item {
	width: 100%;
	height: 100%;
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
}


.news-center-image {
	width: 100%;
	overflow: hidden;
	background: #f7f8fa;
}


.news-center-image a {
	display: block;
	width: 100%;
}


.news-center-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform .35s ease;
}


.news-center-item:hover .news-center-image img {
	transform: scale(1.035);
}


.news-center-description {
	flex: 1;
	display: flex;
	flex-direction: column;
}


.news-center-content {
	flex: 1;
	display: flex;
	flex-direction: column;
}


.news-center-title {
	margin-bottom: 14px;
	font-size: 22px;
	line-height: 1.45;
}


.news-center-title a {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}


.news-center-content p {
	display: -webkit-box;
	overflow: hidden;
	margin-bottom: 22px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}


.news-center-content .blog-btn {
	margin-top: auto;
}


.news-center-description .blog-list li span {
	color: inherit;
}


.news-center-description .blog-list i {
	margin-right: 7px;
}


/* =========================================================
   Pagination
========================================================= */

.news-pagination {
	margin-top: 20px;
	text-align: center;
}


.news-pagination .page-numbers {
	margin: 0 4px;
}


/* =========================================================
   Empty state
========================================================= */

.news-empty {
	padding: 55px 25px;
	border: 1px solid #eef1f4;
	background: #fafbfc;
}


/* =========================================================
   Responsive
========================================================= */

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

	.news-center-section .row {
		row-gap: 24px;
	}

	.news-center-title {
		font-size: 20px;
	}

}
/*single*/
/* =========================================================
    SINGLE POST — CLEAN INDUSTRIAL NEWS DETAIL
    Content + Comments Optimization
 ========================================================= */

:root {
	--single-accent: #f28a00;
	--single-accent-dark: #d97600;
	--single-title: #14283c;
	--single-text: #4f6072;
	--single-muted: #7b8997;
	--single-border: #e5ebf0;
	--single-soft: #f7f9fb;
	--single-soft-blue: #f3f8fc;
	--single-white: #ffffff;
}

/* =========================================================
   Banner compatibility
========================================================= */

.single-post-banner {
	position: relative;
}

.single-post-banner::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(4, 15, 26, .54);
}

.single-post-banner .d-table,
.single-post-banner .d-table-cell,
.single-post-banner .container,
.single-post-banner .page-title-content {
	position: relative;
	z-index: 1;
}

.single-post-banner .page-title-content ul {
	flex-wrap: wrap;
}

.single-post-banner .page-title-content ul li:last-child {
	max-width: 520px;
}

/* =========================================================
   Article layout
========================================================= */

.single-post-section {
	background:
			linear-gradient(
					180deg,
					#f8fafc 0%,
					#ffffff 220px
			);
}

.single-post-article {
	width: 100%;
}

.single-post-featured-image {
	position: relative;
	margin-bottom: 28px;
	overflow: hidden;
	border: 1px solid var(--single-border);
	border-radius: 18px;
	background: #eef2f5;
	box-shadow: 0 14px 38px rgba(20, 40, 60, .08);
}

.single-post-featured-image::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background:
			linear-gradient(
					90deg,
					var(--single-accent),
					#ffb34d,
					transparent 75%
			);
}

.single-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 620px;
	object-fit: cover;
}

/* Main white content card */
.single-article-panel {
	position: relative;
	padding: 38px 42px 44px !important;
	border: 1px solid var(--single-border);
	border-radius: 20px;
	background: var(--single-white);
	box-shadow:
			0 16px 45px rgba(20, 40, 60, .065);
}

.single-article-panel::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 40px;
	width: 92px;
	height: 3px;
	border-radius: 0 0 999px 999px;
	background:
			linear-gradient(
					90deg,
					var(--single-accent),
					#ffbd62
			);
}

/* =========================================================
   Meta information
========================================================= */

.single-entry-meta {
	margin: 0 0 22px !important;
}

.single-entry-meta ul {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 12px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.single-entry-meta ul li {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	min-height: 36px;
	margin: 0 !important;
	padding: 7px 12px !important;
	border: 1px solid #e8edf2;
	border-radius: 8px;
	background: #f8fafc;
	color: #68798a;
	font-size: 13px;
	line-height: 1.45;
}

/* Disable separator pseudo-elements from original theme */
.single-entry-meta ul li::before,
.single-entry-meta ul li::after {
	content: none !important;
	display: none !important;
}

.single-entry-meta ul li > i {
	color: var(--single-accent);
	font-size: 13px;
}

.single-entry-meta ul li > span {
	margin: 0 !important;
	color: #647586;
	font-weight: 600;
}

.single-entry-meta ul li a,
.single-entry-meta ul li time {
	color: #34495d !important;
	font-weight: 600;
	text-decoration: none !important;
}

.single-entry-meta ul li a:hover {
	color: var(--single-accent-dark) !important;
}

/* =========================================================
   Article title
========================================================= */

.single-post-title {
	position: relative;
	margin: 0 0 30px !important;
	padding-bottom: 24px;
	color: var(--single-title) !important;
	font-size: clamp(32px, 3.2vw, 43px) !important;
	line-height: 1.22 !important;
	font-weight: 800 !important;
	letter-spacing: -.7px;
}

.single-post-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 66px;
	height: 3px;
	border-radius: 999px;
	background: var(--single-accent);
}

/* =========================================================
   Article body typography
========================================================= */

.single-post-content {
	color: var(--single-text);
	font-size: 17px;
	line-height: 1.92;
	word-break: normal;
	overflow-wrap: break-word;
}

.single-post-content > *:first-child {
	margin-top: 0 !important;
}

.single-post-content > *:last-child {
	margin-bottom: 0 !important;
}

.single-post-content p {
	margin: 0 0 22px;
	color: var(--single-text);
	font-size: inherit;
	line-height: inherit;
}

.single-post-content h2,
.single-post-content h3,
.single-post-content h4,
.single-post-content h5,
.single-post-content h6 {
	position: relative;
	color: var(--single-title);
	font-weight: 750;
	line-height: 1.35;
}

.single-post-content h2 {
	margin: 42px 0 20px;
	padding-left: 16px;
	font-size: 29px;
}

.single-post-content h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: .18em;
	bottom: .18em;
	width: 4px;
	border-radius: 999px;
	background: var(--single-accent);
}

.single-post-content h3 {
	margin: 34px 0 16px;
	font-size: 24px;
}

.single-post-content h4 {
	margin: 29px 0 14px;
	font-size: 21px;
}

.single-post-content a {
	color: #156fb6;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color .2s ease;
}

.single-post-content a:hover {
	color: var(--single-accent-dark);
}

.single-post-content ul,
.single-post-content ol {
	margin: 22px 0;
	padding-left: 24px;
}

.single-post-content li {
	margin-bottom: 10px;
	padding-left: 3px;
}

/* Content images */
.single-post-content img {
	display: block;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	border-radius: 14px;
}

.single-post-content figure {
	max-width: 100%;
	margin: 30px auto;
}

.single-post-content .wp-caption,
.single-post-content figure {
	overflow: hidden;
	border-radius: 14px;
}

.single-post-content figcaption,
.single-post-content .wp-caption-text {
	margin-top: 9px;
	color: #8794a1;
	font-size: 13px;
	line-height: 1.6;
	text-align: center;
}

.single-post-content blockquote {
	position: relative;
	margin: 30px 0;
	padding: 25px 28px 25px 34px;
	border: 1px solid #e7edf2;
	border-left: 4px solid var(--single-accent);
	border-radius: 12px;
	background:
			linear-gradient(
					135deg,
					#fafcfd,
					#f5f8fa
			);
	color: #46596b;
	font-size: 17px;
	line-height: 1.85;
}

.single-post-content blockquote p:last-child {
	margin-bottom: 0;
}

.single-post-content iframe,
.single-post-content video {
	max-width: 100%;
	border-radius: 12px;
}

.single-post-content table {
	width: 100%;
	max-width: 100%;
	margin: 28px 0;
	border-collapse: collapse;
	background: #fff;
}

.single-post-content th,
.single-post-content td {
	padding: 13px 15px;
	border: 1px solid #dfe6ec;
	vertical-align: top;
}

.single-post-content th {
	background: #f4f7f9;
	color: var(--single-title);
	font-weight: 700;
}

/* =========================================================
   Tags + Share
========================================================= */

.single-article-footer {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 25px;
	margin-top: 28px !important;
	padding: 22px 25px !important;
	border: 1px solid var(--single-border);
	border-radius: 15px;
	background: #ffffff;
	box-shadow: 0 10px 30px rgba(20,40,60,.045);
}

.single-article-footer .article-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.single-article-footer .article-tags > span:first-child {
	margin-right: 3px;
	color: var(--single-title);
	font-weight: 700;
}

.single-article-footer .article-tags a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	margin: 0 !important;
	padding: 5px 11px;
	border: 1px solid #e5eaee;
	border-radius: 999px;
	background: #f7f9fa;
	color: #536474 !important;
	font-size: 12px;
	font-weight: 600;
	transition:
			border-color .2s ease,
			color .2s ease,
			background .2s ease;
}

.single-article-footer .article-tags a:hover {
	border-color: rgba(242,138,0,.35);
	background: #fff9f1;
	color: var(--single-accent-dark) !important;
}

.article-footer .article-tags .single-no-tags {
	color: var(--single-muted);
	font-weight: 400;
}

.single-article-footer .article-share .social {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 0;
}

.single-article-footer .article-share .social li {
	margin: 0 !important;
}

.single-article-footer .article-share .social li:first-child {
	margin-right: 3px !important;
	color: var(--single-title);
	font-weight: 700;
}

.single-article-footer .article-share .social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: 35px;
	border: 1px solid #e3e8ed;
	border-radius: 50%;
	background: #f8fafb;
	color: #536474 !important;
	transition: all .22s ease;
}

.single-article-footer .article-share .social a:hover {
	border-color: var(--single-accent);
	background: var(--single-accent);
	color: #fff !important;
	transform: translateY(-2px);
}

/* =========================================================
   Previous / Next navigation
========================================================= */

.single-post-navigation {
	margin-top: 24px !important;
	padding: 0 !important;
	border: 0 !important;
}

.single-post-navigation .navigation-links {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.single-post-navigation .nav-previous,
.single-post-navigation .nav-next {
	margin: 0 !important;
}

.single-post-navigation a {
	display: flex !important;
	align-items: center;
	min-height: 58px;
	padding: 14px 18px !important;
	border: 1px solid var(--single-border);
	border-radius: 12px;
	background: #ffffff;
	color: #435466 !important;
	font-size: 14px;
	font-weight: 700;
	transition:
			border-color .25s ease,
			color .25s ease,
			box-shadow .25s ease,
			transform .25s ease;
}

.single-post-navigation .nav-next a {
	justify-content: flex-end;
}

.single-post-navigation a:hover {
	border-color: rgba(242,138,0,.36);
	color: var(--single-accent-dark) !important;
	box-shadow: 0 10px 24px rgba(20,40,60,.06);
	transform: translateY(-2px);
}

.single-post-navigation a i {
	color: var(--single-accent);
}

/* =========================================================
   COMMENTS
========================================================= */

.single-comments-wrap {
	margin-top: 32px;
}

.single-comments-wrap .comments-area {
	margin: 0 !important;
	padding: 34px 36px 38px !important;
	border: 1px solid var(--single-border);
	border-radius: 20px;
	background: #ffffff;
	box-shadow:
			0 16px 42px rgba(20,40,60,.055);
}

.single-comments-wrap .comments-title {
	position: relative;
	margin: 0 0 28px !important;
	padding: 0 0 18px !important;
	border-bottom: 1px solid #e9edf1;
	color: var(--single-title) !important;
	font-size: 27px !important;
	line-height: 1.3;
	font-weight: 800;
}

.single-comments-wrap .comments-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 58px;
	height: 2px;
	background: var(--single-accent);
}

.single-comments-wrap .comment-list {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.single-comments-wrap .comment-list > li {
	margin: 0 0 18px !important;
}

.single-comments-wrap .comment-list li::before {
	content: none !important;
}

.single-comments-wrap .comment-body {
	position: relative;
	min-height: 82px;
	margin: 0 !important;
	padding: 22px 24px 22px 92px !important;
	border: 1px solid #e7edf2;
	border-radius: 14px;
	background:
			linear-gradient(
					135deg,
					#fafcfd,
					#f7f9fb
			);
	transition:
			border-color .22s ease,
			box-shadow .22s ease;
}

.single-comments-wrap .comment-body:hover {
	border-color: #dce5ec;
	box-shadow: 0 8px 22px rgba(20,40,60,.045);
}

.single-comments-wrap .comment-author {
	position: static !important;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
}

.single-comments-wrap .comment-author .avatar {
	position: absolute !important;
	left: 22px !important;
	top: 22px !important;
	width: 52px !important;
	height: 52px !important;
	margin: 0 !important;
	border: 3px solid #ffffff;
	border-radius: 50% !important;
	object-fit: cover;
	box-shadow: 0 4px 12px rgba(20,40,60,.10);
}

.single-comments-wrap .comment-author .fn,
.single-comments-wrap .comment-author b.fn {
	color: var(--single-title);
	font-size: 15px;
	font-weight: 750;
}

.single-comments-wrap .comment-author .says {
	color: #9aa5af;
	font-size: 12px;
}

.single-comments-wrap .comment-metadata {
	margin: 5px 0 13px !important;
	font-size: 12px;
}

.single-comments-wrap .comment-metadata a {
	color: #8492a0 !important;
	text-decoration: none !important;
}

.single-comments-wrap .comment-content {
	color: #58697a;
	font-size: 14px;
	line-height: 1.8;
}

.single-comments-wrap .comment-content p {
	margin: 0 0 12px;
}

.single-comments-wrap .comment-content p:last-child {
	margin-bottom: 0;
}

.single-comments-wrap .reply {
	margin-top: 13px !important;
}

.single-comments-wrap .comment-reply-link {
	display: inline-flex !important;
	align-items: center;
	min-height: 30px;
	padding: 4px 11px !important;
	border: 1px solid rgba(242,138,0,.22);
	border-radius: 999px;
	background: #fff9f1;
	color: var(--single-accent-dark) !important;
	font-size: 11px;
	font-weight: 700;
	transition: all .2s ease;
}

.single-comments-wrap .comment-reply-link:hover {
	border-color: var(--single-accent);
	background: var(--single-accent);
	color: #ffffff !important;
}

/* Nested comments */
.single-comments-wrap .children {
	margin: 16px 0 0 32px !important;
	padding: 0 0 0 18px !important;
	border-left: 2px solid #edf1f4;
	list-style: none !important;
}

.single-comments-wrap .children > li {
	margin-bottom: 15px !important;
}

/* =========================================================
   Comment form
========================================================= */

.single-comments-wrap .comment-respond {
	margin-top: 34px !important;
	padding-top: 30px !important;
	border-top: 1px solid #e9edf1;
}

.single-comments-wrap .comment-reply-title {
	position: relative;
	margin: 0 0 22px !important;
	color: var(--single-title) !important;
	font-size: 25px !important;
	line-height: 1.3;
	font-weight: 800;
}

.single-comments-wrap .comment-notes,
.single-comments-wrap .logged-in-as {
	margin-bottom: 22px !important;
	color: #7d8a97;
	font-size: 13px;
	line-height: 1.7;
}

.single-comments-wrap .comment-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.single-comments-wrap .comment-form > p {
	margin: 0 !important;
}

.single-comments-wrap .comment-form-comment,
.single-comments-wrap .comment-notes,
.single-comments-wrap .logged-in-as,
.single-comments-wrap .comment-form-cookies-consent,
.single-comments-wrap .form-submit {
	grid-column: 1 / -1;
}

.single-comments-wrap .comment-form label {
	display: block;
	margin: 0 0 8px !important;
	color: #435466;
	font-size: 13px;
	font-weight: 700;
}

.single-comments-wrap .comment-form input[type="text"],
.single-comments-wrap .comment-form input[type="email"],
.single-comments-wrap .comment-form input[type="url"],
.single-comments-wrap .comment-form textarea {
	width: 100% !important;
	margin: 0 !important;
	border: 1px solid #dfe6ec !important;
	border-radius: 10px !important;
	background: #fbfcfd !important;
	color: #34495d !important;
	font-size: 14px !important;
	outline: none !important;
	box-shadow: none !important;
	transition:
			border-color .2s ease,
			background .2s ease,
			box-shadow .2s ease;
}

.single-comments-wrap .comment-form input[type="text"],
.single-comments-wrap .comment-form input[type="email"],
.single-comments-wrap .comment-form input[type="url"] {
	height: 48px !important;
	padding: 0 14px !important;
}

.single-comments-wrap .comment-form textarea {
	min-height: 145px !important;
	padding: 13px 14px !important;
	resize: vertical;
}

.single-comments-wrap .comment-form input:focus,
.single-comments-wrap .comment-form textarea:focus {
	border-color: rgba(242,138,0,.62) !important;
	background: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(242,138,0,.07) !important;
}

.single-comments-wrap .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: #71808f;
	font-size: 12px;
	line-height: 1.6;
}

.single-comments-wrap .comment-form-cookies-consent input {
	flex: 0 0 auto;
	margin-top: 4px !important;
}

.single-comments-wrap .form-submit {
	margin-top: 2px !important;
}

.single-comments-wrap .form-submit .submit,
.single-comments-wrap input[type="submit"] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-width: 150px;
	height: 46px;
	padding: 0 24px !important;
	border: 1px solid var(--single-accent) !important;
	border-radius: 9px !important;
	background: var(--single-accent) !important;
	color: #ffffff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	cursor: pointer;
	box-shadow: 0 8px 18px rgba(242,138,0,.16);
	transition:
			background .2s ease,
			border-color .2s ease,
			transform .2s ease,
			box-shadow .2s ease;
}

.single-comments-wrap .form-submit .submit:hover,
.single-comments-wrap input[type="submit"]:hover {
	border-color: var(--single-accent-dark) !important;
	background: var(--single-accent-dark) !important;
	transform: translateY(-1px);
	box-shadow: 0 10px 22px rgba(217,118,0,.20);
}

/* No comments / closed notice */
.single-comments-wrap .no-comments {
	margin: 20px 0 0 !important;
	padding: 13px 16px;
	border-radius: 9px;
	background: #f7f9fb;
	color: #738190;
	font-size: 13px;
}

/* =========================================================
   Sidebar — preserve original theme appearance
========================================================= */

.single-post-sidebar .widget_cyberguard_posts_thumb .item .thumb {
	overflow: hidden;
}

.single-post-sidebar .widget_cyberguard_posts_thumb .item .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.single-post-sidebar .widget_categories > ul > li {
	width: 100%;
}

.single-post-sidebar .widget_categories > ul > li > a {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.single-post-sidebar .widget_categories .categories-link-count {
	flex: 0 0 auto;
	margin-left: auto;
	white-space: nowrap;
}

.single-post-sidebar .tagcloud a {
	font-size: inherit !important;
}


/* =========================================================
   Comment Form Precision Layout
   姓名/邮箱 2列；网站整行；自定义字段自动整齐排列
========================================================= */

.single-comments-wrap .comment-form {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	column-gap: 28px !important;
	row-gap: 22px !important;
	align-items: start !important;
	width: 100% !important;
}

/* 所有表单字段容器统一 */
.single-comments-wrap .comment-form > p {
	min-width: 0 !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* 评论正文、说明、网站、Cookie、提交按钮全部占满整行 */
.single-comments-wrap .comment-form-comment,
.single-comments-wrap .comment-notes,
.single-comments-wrap .logged-in-as,
.single-comments-wrap .comment-form-url,
.single-comments-wrap .comment-form-cookies-consent,
.single-comments-wrap .form-submit {
	grid-column: 1 / -1 !important;
}

/* 姓名 / 邮箱固定左右两栏 */
.single-comments-wrap .comment-form-author {
	grid-column: 1 !important;
}

.single-comments-wrap .comment-form-email {
	grid-column: 2 !important;
}

/* 统一 Label */
.single-comments-wrap .comment-form label {
	display: block !important;
	width: 100% !important;
	margin: 0 0 9px !important;
	padding: 0 !important;
	color: #34495d !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	font-weight: 700 !important;
}

/* 统一所有文本输入框，覆盖主题原先固定宽度 */
.single-comments-wrap .comment-form input[type="text"],
.single-comments-wrap .comment-form input[type="email"],
.single-comments-wrap .comment-form input[type="url"],
.single-comments-wrap .comment-form input[type="number"],
.single-comments-wrap .comment-form input[type="tel"],
.single-comments-wrap .comment-form select {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	height: 52px !important;
	margin: 0 !important;
	padding: 0 15px !important;
	border: 1px solid #dce4eb !important;
	border-radius: 10px !important;
	background-color: #fbfcfd !important;
	color: #34495d !important;
	font-size: 14px !important;
	line-height: 50px !important;
	outline: none !important;
	box-shadow: none !important;
}

/* Select 单独处理，避免浏览器默认样式尺寸过小 */
.single-comments-wrap .comment-form select {
	padding-right: 42px !important;
	line-height: normal !important;
	cursor: pointer;
}

.single-comments-wrap .comment-form textarea {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	min-height: 155px !important;
	margin: 0 !important;
	padding: 15px 16px !important;
	border: 1px solid #dce4eb !important;
	border-radius: 10px !important;
	background: #fbfcfd !important;
	color: #34495d !important;
	font-size: 14px !important;
	line-height: 1.75 !important;
	resize: vertical;
	outline: none !important;
	box-shadow: none !important;
}

.single-comments-wrap .comment-form input:focus,
.single-comments-wrap .comment-form select:focus,
.single-comments-wrap .comment-form textarea:focus {
	border-color: rgba(242, 138, 0, .72) !important;
	background: #ffffff !important;
	box-shadow: 0 0 0 3px rgba(242, 138, 0, .08) !important;
}

/* Cookie 复选框：取消主题对 input 的统一大尺寸影响 */
.single-comments-wrap .comment-form-cookies-consent {
	display: flex !important;
	align-items: center !important;
	gap: 11px !important;
	min-height: 30px;
	padding: 2px 0 !important;
}

.single-comments-wrap .comment-form-cookies-consent input[type="checkbox"] {
	appearance: auto !important;
	-webkit-appearance: checkbox !important;
	flex: 0 0 auto !important;
	width: 17px !important;
	height: 17px !important;
	min-width: 17px !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	cursor: pointer;
}

.single-comments-wrap .comment-form-cookies-consent label {
	display: inline !important;
	width: auto !important;
	margin: 0 !important;
	color: #536474 !important;
	font-size: 13px !important;
	line-height: 1.65 !important;
	font-weight: 500 !important;
	cursor: pointer;
}

/*
 * 插件新增的“客户类型 / 评价星级”等字段通常也是 comment-form
 * 的直接 <p> 子元素。让它们自动进入两列网格，并强制控件撑满列宽。
 */
.single-comments-wrap .comment-form > p:not(
            .comment-notes
        ):not(
            .logged-in-as
        ):not(
            .comment-form-comment
        ):not(
            .comment-form-author
        ):not(
            .comment-form-email
        ):not(
            .comment-form-url
        ):not(
            .comment-form-cookies-consent
        ):not(
            .form-submit
        ) {
	grid-column: auto !important;
}

/* 如果第三方字段不是 p，也统一控件宽度 */
.single-comments-wrap .comment-form select,
.single-comments-wrap .comment-form .form-control {
	width: 100% !important;
	max-width: 100% !important;
}

/* 提交区域 */
.single-comments-wrap .form-submit {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	margin-top: 4px !important;
	padding-top: 2px !important;
}

.single-comments-wrap .form-submit .submit,
.single-comments-wrap .comment-form input[type="submit"] {
	width: auto !important;
	min-width: 180px !important;
	height: 50px !important;
	padding: 0 28px !important;
	border-radius: 10px !important;
	font-size: 14px !important;
	line-height: 50px !important;
}

/* 评论表单区域增加轻微分组感 */
.single-comments-wrap .comment-respond {
	padding: 30px !important;
	border: 1px solid #e7edf2 !important;
	border-radius: 15px !important;
	background: #fafcfd !important;
}

.single-comments-wrap .comment-respond .comment-reply-title {
	margin-bottom: 8px !important;
}

.single-comments-wrap .comment-respond .comment-notes {
	margin-bottom: 4px !important;
}

@media only screen and (max-width: 767px) {
	.single-comments-wrap .comment-form {
		grid-template-columns: 1fr !important;
		gap: 17px !important;
	}

	.single-comments-wrap .comment-form-author,
	.single-comments-wrap .comment-form-email,
	.single-comments-wrap .comment-form-url,
	.single-comments-wrap .comment-form-comment,
	.single-comments-wrap .comment-notes,
	.single-comments-wrap .logged-in-as,
	.single-comments-wrap .comment-form-cookies-consent,
	.single-comments-wrap .form-submit,
	.single-comments-wrap .comment-form > p {
		grid-column: 1 / -1 !important;
	}

	.single-comments-wrap .comment-respond {
		padding: 22px 18px !important;
	}

	.single-comments-wrap .form-submit .submit,
	.single-comments-wrap .comment-form input[type="submit"] {
		width: 100% !important;
	}
}

/* =========================================================
   Responsive
========================================================= */

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

	.single-article-panel {
		padding: 34px 32px 38px !important;
	}

	.single-comments-wrap .comments-area {
		padding: 30px 30px 34px !important;
	}

}

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

	.single-post-banner .page-title-content ul li:last-child {
		max-width: 280px;
	}

	.single-post-featured-image {
		margin-bottom: 20px;
		border-radius: 13px;
	}

	.single-article-panel {
		padding: 28px 20px 31px !important;
		border-radius: 15px;
	}

	.single-article-panel::before {
		left: 20px;
		width: 72px;
	}

	.single-entry-meta ul {
		align-items: stretch;
		gap: 8px;
	}

	.single-entry-meta ul li {
		width: 100%;
		min-height: 34px;
		padding: 7px 10px !important;
	}

	.single-post-title {
		margin-bottom: 24px !important;
		padding-bottom: 19px;
		font-size: 29px !important;
	}

	.single-post-content {
		font-size: 16px;
		line-height: 1.85;
	}

	.single-post-content h2 {
		margin-top: 34px;
		font-size: 24px;
	}

	.single-post-content h3 {
		font-size: 21px;
	}

	.single-article-footer {
		align-items: flex-start;
		flex-direction: column;
		padding: 19px 20px !important;
	}

	.single-post-navigation .navigation-links {
		grid-template-columns: 1fr;
	}

	.single-post-navigation .nav-next a {
		justify-content: flex-start;
	}

	.single-comments-wrap .comments-area {
		padding: 26px 19px 30px !important;
		border-radius: 15px;
	}

	.single-comments-wrap .comments-title {
		font-size: 23px !important;
	}

	.single-comments-wrap .comment-body {
		padding: 19px 17px 19px 72px !important;
		border-radius: 11px;
	}

	.single-comments-wrap .comment-author .avatar {
		left: 16px !important;
		top: 18px !important;
		width: 42px !important;
		height: 42px !important;
	}

	.single-comments-wrap .children {
		margin-left: 12px !important;
		padding-left: 11px !important;
	}

	.single-comments-wrap .comment-form {
		grid-template-columns: 1fr;
	}

	.single-comments-wrap .comment-form > p {
		grid-column: 1 / -1;
	}

}
/* page.php full width content fix */

.seo-overview-card{
	border:none!important;
	border-radius:0!important;
	box-shadow:none!important;
	background:transparent!important;
}

.seo-overview-body{
	padding:0!important;
}

.seo-content-panel{
	padding:0!important;
	border:none!important;
	border-left:none!important;
	border-radius:0!important;
	background:transparent!important;
}

.seo-content-panel img,
.seo-content-panel .wp-block-image img{
	width:100%!important;
	max-width:100%!important;
	height:auto!important;
	display:block!important;
	margin:0 auto 30px!important;
}

.seo-content-panel figure,
.seo-content-panel .wp-block-image{
	width:100%!important;
	margin-left:0!important;
	margin-right:0!important;
}
/* 表单整体 */
.inquiry-form-wrapper{
    background:#fff;
    padding:35px 45px;
    border-radius:16px;
}


/* 标题区域 */
.inquiry-header h2{
    font-size:38px;
    line-height:1.25;
    margin:10px 0 15px;
}


.inquiry-header p{
    font-size:18px;
    line-height:1.6;
    margin-bottom:30px;
}


/* 两列布局 */
.form-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    column-gap:35px;

    row-gap:22px;

}


/* label */
.form-item label{

    font-size:16px;

    margin-bottom:8px;

}



/* 输入框 */

.form-item input{

    height:52px;

    padding:12px 18px;

    border-radius:12px;

    font-size:16px;

}



.form-item textarea{

    min-height:130px;

    padding:15px 18px;

    border-radius:12px;

    font-size:16px;

}


/* 需求说明 */

.textarea-item{

    margin-top:22px;

}



/* 提交区域 */

.submit-area{

    margin-top:25px;

}



.submit-area input[type="submit"]{

    padding:14px 45px;

    font-size:18px;

}