@import url('all.min.css');
@import url('bootstrap.min.css');
@import url('slick.css');
@import url('slick.min.css');

body {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-size: 16px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	background: #F4F7FA;
	color: #323c46;
	padding-top: 107px;
	overflow-x: hidden;
}

section p {
	font-size: 1.05rem;
	color: #4b5563;
	line-height: 1.8;
	margin-bottom: 1rem;
}

.pricing-box h3 {
	text-transform: capitalize;
}

.footer-copyright {
	border-top: 1px solid #6a6a6a;
	padding-top: 30px;
	margin-top: 15px;
}

.faq .accordion-item {
	border-bottom: 1px solid #e2e2e2 !important;
}

.about-sec {
	background: #fff;
	position: relative;
	overflow: hidden;
}

.hero-section h3.prodcut-name {
	font-weight: 700;
	font-size: 19px;
	color: #1f2937;
	text-transform: uppercase;
	opacity: 0.8;
}

.about-img img {
	transition: transform 0.6s ease, box-shadow 0.6s ease;
}


.about-content {
	position: relative;
	z-index: 1;
}

.about-title span {
	color: #007bff;
}

.about-text {
	font-size: 1.05rem;
	color: #4b5563;
	line-height: 1.8;
	margin-bottom: 1rem;
}

.highlight-text span {
	color: #007bff;
	font-weight: 600;
}

@media (max-width: 991px) {
	.about-title {
		text-align: center;
	}

	.about-text {
		text-align: center;
	}

	.btn-primary {
		display: block;
		margin: 0 auto;
	}
}

/* header css start */
#navbarNavDropdown .dropdown-menu.dedicated-server.subchild {
	width: max-content;
	position: absolute;
	left: 100%;
	top: 0;
	display: none;
	visibility: visible;
}

#navbarNavDropdown .dropdown-menu.dedicated-server.clildmenu {
	width: 100%;
	min-width: max-content;
}

#navbarNavDropdown .navbar-nav .nav-item .subchild .nav-link {
	display: block !important;
}

#navbarNavDropdown .clildmenu .nav-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 7px 10px 7px 10px;
	gap: 13px;
}

#navbarNavDropdown .subchild {
	display: none;
}

#navbarNavDropdown .child:hover .subchild {
	display: block;
}

#navbarNavDropdown .dedicated-server.clildmenu p {
	font-size: 14px;
}

#navbarNavDropdown .dedicated-server.subchild p {
	font-size: 14px;
	font-weight: 600;
}

#navbarNavDropdown .child svg {
	font-size: 14px;
}

#navbarNavDropdown .clildmenu li {
	border-bottom: 3px solid #e1e1e1;
}

#navbarNavDropdown .child:last-child,
#navbarNavDropdown .subchild:last-child {
	border: 0;
}

#navbarNavDropdown .dropdown-toggle.parent {
	display: flex;
	align-items: center;
	gap: 7px;
}

#navbarNavDropdown .navbar {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
	padding: 10px 20px;
}

/* Navbar Links */
#navbarNavDropdown.navbar-nav .nav-link {
	font-size: 15px;
	font-weight: 600;
	color: #1f2937;
	padding: 10px 18px;
	margin: 0 4px;
	border-radius: 8px;
	transition: all 0.3s ease;
	position: relative;
}


/* Glow Underline */
#navbarNavDropdown .navbar-nav .nav-link::after {
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0%;
	height: 2px;
	width: 0;
	background: #0d47a1;
	border-radius: 50px;
	transition: width 0.3s ease;
}

#navbarNavDropdown .navbar-nav .nav-link:hover::after,
#navbarNavDropdown .navbar-nav .clildmenu .nav-link.active::after {
	width: 100%;
}

/* ===============================
        DROPDOWN MENU
        =============================== */
#navbarNavDropdown .dropdown-menu {
	border: none;
	background: #fff;
	padding: 12px 0;
	box-shadow: 0 10px 35px rgba(0, 0, 0, 0.15);
	/* transform: translateY(15px); */
	opacity: 0;
	display: none;
	transition: all 0.35s ease;

}

#navbarNavDropdown .dropdown:hover .clildmenu {
	display: block;
	visibility: visible;
}

#navbarNavDropdown .dropdown-toggle::after {
	border-top: 0px !important;
	border-right: 0px transparent !important;
	border-bottom: 0 !important;
	border-left: 0px transparent !important;
}

/* Show dropdown on hover */
#navbarNavDropdown .nav-item.dropdown:hover>.dropdown-menu {

	opacity: 1;
}

#navbarNavDropdown ul.dropdown-menu.dedicated-server.clildmenu {
	transform: translate(0px, 2px);
}

#navbarNavDropdown .navbar-nav li.nav-item.dropdown:last-of-type .clildmenu .subchild {
	right: 159px !important;
}

header .mobile-menu .nav-item .submenu-drop a.nav-link {
	color: #000000ab;
	font-weight: 500;
}

/* Dropdown items */
#navbarNavDropdown .dropdown-menu .nav-link,
#navbarNavDropdown .dropdown-menu .dropdown-item {
	padding: 8px 12px;
	font-size: 14px;
	color: #4b5563;
	border-radius: 6px;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.formsubmission .product-card {
	background: transparent;
	box-shadow: none;
}

/* Hover effect */
#navbarNavDropdown .dropdown-menu .nav-link:hover,
#navbarNavDropdown .dropdown-menu .dropdown-item:hover {
	background: #f4f8ff;
}

#navbarNavDropdown .subchild li:last-child {
	border-bottom: 0;
}

/* Chevron icon animation */
#navbarNavDropdown .dropdown-menu .fa-chevron-right {
	font-size: 12px;
	transition: transform 0.3s ease;
}

#navbarNavDropdown .dropdown-menu .nav-link:hover .fa-chevron-right {
	transform: translateX(4px);
}

/* ===============================
        SUBCHILD MENU
        =============================== */
#navbarNavDropdown .dropdown-toggle.parent svg {
	transform: rotate(89deg);
}

.mobile-menu .nav-link {
	font-weight: 600;
	color: #000000d6;
}

.mobile-menu .nav-item {
	background: #fff;
	box-shadow: 0px 0px 2px 1px #8080801c;
	padding: 4px 13px;
	margin-bottom: 1px;
	border-radius: 5px;
}

header .mobile-menu .nav-item .parent,
header .mobile-menu .nav-item .clildmenu a {
	color: #000;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

header .mobile-menu .nav-item .clildmenu-lable.dropdown-toggle {
	font-weight: 500;
	color: #000000ab;
}

header .mobile-menu .clildmenu .clildmenu-lable {
	padding: 5px 10px 5px 10px;
}

header .mobile-menu .clildmenu .dropdown.dropdown-submenu {
	border-top: 1px solid #8080802b;
}

header .mobile-menu .nav-item a {
	color: #000;
}

header .mobile-menu .nav-item .clildmenu ul.submenu {
	color: #000000ad;
	list-style: disc;
	display: none;
	padding-top: 10px;
	padding-bottom: 12px;
	border-top: 1px solid #57575724;
}

header .mobile-menu .nav-item .submenu a {
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	color: #00000099;
}

header .mobile-menu .mobile-currency select.currencySelector {
	border-color: #00000000;
	border-radius: 4px;
	padding: 10px 4px;
	color: #000;
	font-weight: 600;
	font-size: 16px;
}

header .mobile-menu .mobile-currency label {
	font-weight: 600;
}

header .mobile-menu .nav-item .clildmenu ul.submenu.show {
	display: block;
}

.mobile-menu .clildmenu {
	border: 0;
	background: transparent;
	padding: 0;
}

.mobile-menu .clildmenu .dropdown-submenu {
	padding: 2px 0px 0 0px;
}

/* Style for multi-level dropdown */
.dropdown-submenu {
	position: relative;
}

.hero-section .product-details+span {
	text-transform: capitalize;
	font-weight: 600;
}

.dropdown-submenu>.dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -5px;
}

.top-emails {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 10px;
	align-items: center;
}

.top-emails a {
	text-decoration: none;
	color: #fff;
}

ul.top-emails svg {
	font-size: 13px;
}

header {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 999;
	transition: transform 0.3s ease-in-out;
	background-color: #fff;
	box-shadow: 0px 1px 2px 0px #80808030;
}

header.is-sticky {
	position: fixed;
	background-color: #fff;
	width: 100%;
	z-index: 99;
	box-shadow: 0 0 20px 0 #afafaf66;
	-ms-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-webkit-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}

.navbar-brand img {
	width: 135px;
	height: auto;
}

.top-bar {
	background: #007BFF;
	padding: 4px 0;
	text-align: center;
}

.top-bar span {
	margin: 0;
	color: #ffff;
	font-size: 14px;
	font-weight: 600;
}

.top-bar span a {
	color: #ffff;
}

.navbar-nav.middle-nav {
	flex-direction: row;
}

.navbar-nav.middle-nav {
	flex-direction: row;
	justify-content: end;
	gap: 15px;
}

ul.navbar-nav.middle-nav a {
	font-weight: 600;
	font-size: 15px;
	border-bottom: 2px solid transparent;
	padding: 2px 0;
	color: #fff;
}

.middle-navbar span {
	font-size: 14px;
}

.middle-nav .nav-item .nav-link:hover {
	color: #e9e9e9;
}

.submenu-items img {
	width: 32px;
}

#navbarNavDropdown .nav-link:hover {
	color: #1b4a7f;
}

.navbar-nav.middle-nav ul li a {
	color: #1b4a7f;
}

.submenu-items p {
	margin: 0;
	font-weight: 600;
	font-size: 14px;
}

.faq {
	background: #fff;
}

.submenu-items span {
	margin: 0;
	font-size: 14px;
}

.submenu-bar ul {
	padding: 0;
	list-style: none;
}

.dropdown-item-currencie label {
	font-size: 16px;
	margin-bottom: 7px;
	color: #323c46;
}

.submenu-bar .dropdown-item,
.dedicated-server .dropdown-item {
	padding: 5px 12px;
}

header .dropdown-item:hover {
	background: transparent;
}

header .dropdown-item:active {
	background: transparent;
	color: #000;
}

.submenu-bar {
	gap: 10px;
}

.inner-submenu li a {
	padding: 5px 0px !important;
	font-size: 15px;
}

.submenu-bar .inner-submenu {
	padding: 10px 25px;
}

.inner-submenu span {
	font-size: 13px;
}

.big-header .dropdown-menu {
	display: block;
	visibility: hidden;
}

.mobile-menu.navbar.navbar-expand-lg {
	box-shadow: 0px 3px 6px 0px #80808054;
	position: fixed;
	top: 0;
	width: 100%;
	left: 0;
}

.mobile-menu .navbar-collapse {
	overflow-y: auto;
	height: 100vh;
	padding-top: 20px;
}

.mobile-menu .submenu-items p {
	font-weight: 400;
}

.mobile-li {
	color: #000;
	text-decoration: none;
	font-size: 18px;
}

.mobile-menu .submenu-bar .dropdown-item,
.mobile-menu .dedicated-server .dropdown-item {
	padding: 13px 4px;
}
.hero-section .product-card  .currency-col-pro {
    margin-bottom: 0px;
}
#navbarNavDropdown .nav-link {
	font-weight: 600;
	color: #4b5563;
	font-size: 15px;
}

.price-heading-col span {
	font-size: 12px;
	font-weight: 400;
	color: #5a6473;
}

.pricing-box table th {
	color: #323c46;
	vertical-align: text-top;
}

.pricing-box table tr td {
	vertical-align: middle;
	color: #323c46;
}

.pricing-box table p {
	margin: 0;
	font-size: 14px;
	line-height: 140%;
	font-weight: 600;
	margin-bottom: 10px;
}

.specifiction {
	font-size: 12px;
	font-weight: 600;
}

.pricing-box .lable-no-stop span {
	font-size: 10px;
	padding: 4px 6px;
	border-radius: 3px;
	font-weight: 400;
	transition: 0.5s;
}

.pricing-box table .lable-no-stop {
	text-align: center;
	width: 130px;
	padding: 0px 5px;
	position: static;
	clip-path: polygon(0% 0, 99% 0, 99% 100%, 0 104%);
}

.pricing-box .data-transfer {
	font-weight: 400 !important;
	font-size: 11px;
}

.pricing-box .table-money+span {
	font-size: 12px;
	font-weight: 500;
}

.table-btn {
	border-radius: 50px;
	background: #007BFF;
	border: 0;
	font-weight: 500;
}

.table-btn:hover {
	background: #066979;
}

.pricing-box .lable-no-stop.Unbeatable-value span {
	background: #fc6c28;
}

.pricing-box .table-money {
	font-size: 16px;
	font-weight: 700;
}

.price-heading-col {
	line-height: 1;
}

#navbarNavDropdown .navbar-nav {
	gap: 10px;
}

.table-card {
	background: #fff;
	border-radius: 5px;
	/* padding: 1.25em; */
	margin-top: 1em;
	box-shadow: 0px 0px 2px 1px #8080801a;
}

.invoice-header p span {
	font-weight: 600;
}

/* header css end  */

/* footer css  */
footer {
	background-color: #0A1A2F;
	padding: 50px 0 20px;
	color: #d7d7d7;
}

.col-footer a img {
	width: 30px;
	filter: invert(1);
}

.col-footer li a {
	color: #d7d7d7;
	text-decoration: none;
	font-size: 15px;
	font-weight: 500;
}

.col-footer h4 {
	font-weight: 700;
	font-size: 20px;
	color: #fff;
}

.col-footer ul {
	padding: 0;
	list-style: none;
	margin-bottom: 20px;
}

.col-footer li {
	padding: 3px 0;
}

/* footer end  */
section {
	padding: 60px 0;
}

.hero-section {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	padding: 120px 0;
}

.bannerstyle::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 65%;
	background-size: cover;
	background-position: top;
	z-index: -1;
	height: 500px;
}

.input-group #password+.text.text-danger,
.input-group #password_confirmation+.text.text-danger {
	position: absolute;
	bottom: -26px;
	left: 0;
}

.hero-section:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, #000000ad, #00000080);
	z-index: 0;
	backdrop-filter: blur(3px);
}

.hero-section .container {
	z-index: 9;
	position: relative;
}

h3 {
	font-size: 32px;
	font-weight: 600;
}

section.hero-section h2,
.hero-section p {
	color: #fff;
	font-size: 20px;
	line-height: 160%;
	font-weight: 300;
}

h1 {
	/*font-size: 3rem;*/
	color: #fff;
	/*font-weight: 700;*/
	font-size: clamp(32px, 5vw, 56px);
    font-weight: 900;
}

h2 {
	font-size: 36px;
	font-weight: 700;
	margin-bottom: 20px;
	color: #155089;
}

.cta-section h2 {
	color: #fff;
}

.about-card-header-text h4 {
	font-weight: 700;
}

.about-card-header h4 {
	font-weight: 700;
	color: #4b5563;
}

.banner-section p {
	font-size: 20px;
	font-weight: 300;
	line-height: 160%;
}

.banner-section h2 {
	font-size: 52px;
}

.product-card .prodcut-name {
	font-size: 16px;
}

.product-card .product-details {
	color: #6b7280;
	font-weight: 600;
	font-size: 13px;
	transition: 0.5s;
}

.hero-section .product-card .currency-col {
	margin-bottom: 15px;
}

.product-card .card {
	border-radius: 20px;
	transition: 0.5s;
}

.product-card .card-body {
	padding-top: 42px;
	transition: 0.5s;
	padding-left: 10px;
	padding-right: 10px;
}

.product-card .currency-col {
	display: flex;
	align-items: end;
	justify-content: center;
	/* margin-top: 20px;
        margin-bottom: 18px; */
}


.product-card .decimal {
	line-height: 1;
	font-size: 24px;
	font-weight: 800;
	margin-top: 3px;
}

.product-card .currency-symbol.curency-after {
	font-size: 18px;
	font-weight: 700;
	position: relative;
	top: -17px;
}

.monthly-col #price-period {
	font-size: 12px;
	font-weight: 600;
	color: #878787;
}

.product-card .monthly-col {
	margin-top: -5px;
}

.product-card #montly-price {
	font-size: 12px;
	font-weight: 600;
}

.btn-create {
	background: #4f46e5;
	display: inline-block;
	max-width: 220px;
	padding: 12px 25px;
	width: 100%;
	font-weight: 600;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	text-decoration: none;
	transition: background-color 0.3s, transform 0.1s, box-shadow 0.3s;
	/*box-shadow: 0 4px 15px rgba(79, 70, 229, 0.4);*/
}

.checkout .btn-create:hover,
.btn-create:hover {
	background: #007bffb5;
}

.product-card .product-card-footer p {
	font-size: 12px;
	line-height: 115%;
	color: #000;
	margin: 0;
}

.product-card .card {
	height: 100%;
	transition: 0.5s;
	box-shadow: 0px 0px 2px 1px #8080801a;
	border-radius: 5px;
}

.product-flex.buy-product .product-card h4 {
	min-height: 38px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;

}

.product-flex.buy-product {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 0fr));
	gap: 10px;
	justify-items: center;
	align-items: stretch;
	justify-content: center;
}

.product-flex {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(242px, 0fr));
	gap: 10px;
	justify-items: center;
	align-items: stretch;
	justify-content: center;
}


.product-card .Unbeatable-value span {
	background-color: #fc6c28;
}

.buy-product .product-card {
	margin-bottom: 25px;
	transition: 0.5s;
	width: 100%;

}

.buy-product .product-card .card-body h3 {
	font-weight: 700;
	font-size: 18px;
	color: #1f2937;
}

img {
	max-width: 100%;
	height: auto;
}

.about-card {
	/* min-height: 191px; */
	padding: 20px;
	gap: 10px;
	width: 100%;
	border-radius: 5px;
	background-color: #fff;
	align-items: center;
	transition: transform 0.3s;
	height: 95%;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
	border-radius: 15px;
}

.choose-cloudy .about-card {
	height: 96%;
	border-left: 5px solid #155089;
}

.cloude-about .about-card-header img {
	width: 80px;
	height: 80px;
	margin-bottom: 15px;
	margin-right: 20px;
	object-fit: contain;
}

.choose-cloudy .about-card-header {
	min-height: 244px;
	align-items: center;
	text-align: center;
	margin-bottom: 20px;
}

.mobile-logout {
	padding: 15px;
	display: inline-block;
	text-decoration: none;
	color: #000;
}

.big-header .dropdown-menu-currencie .form-select.currencySelector:hover {
	color: #ffffff;
	background-color: #ffffff00;
	border-color: #828c9b00;
	outline: 0;
	box-shadow: 0 0 0 0.05rem #828c9b00;
}

.header-currency select.currencySelector,
.header-currency select.currencySelector:focus-visible,
.header-currency select.currencySelector:focus {
	min-width: 66px;
	padding: 3px 6px 0px;
	border: 0;
	font-weight: 600;
	color: #fff;
	font-size: 15px;
	cursor: pointer;
	outline: 0;
	box-shadow: none;
	border-bottom: 2px solid transparent;
	background-color: #0b1c1f00;
}

.middle-navbar .form-select {
	filter: brightness(4.5);
	background-size: 19px 15px;
}

.middle-navbar select option {
	/* background: #007BFF; */
	color: #000;
}

.invoice-card .invoice-header div {
	width: 40%;
}

.about-card-header img {
	width: 20%;
	transition: fill 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.choose-cloudy .about-card-header img {
	margin: auto;
	margin-bottom: 20px;
}

.pricing-box .table-card h3 {
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 4px;
	padding: 20px 15px 12px;
	/* background-color: #f7f9fd; */
	box-shadow: 0px 0px 2px 1px #80808036;
}

.hero-section .product-card .product-details {
    min-height: 47px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.counter-card {
	width: 90%;
	margin: auto;
}

.counter-card h2 {
	margin-bottom: 1px;
	color: #1b4a7f;
}

.counter-card p {
	font-weight: 800;
	margin: 0;
}

.counter-section {
	background: #E5F0FF;
}

.choose-cloudy svg {
	fill: #5ac8f5;
	width: 15%;
}

.choose-cloudy svg path {
	stroke: #323c46;
	stroke-width: 11px;
}

.about-card-header-text {
	width: 100%;
}

.cloude-about.choose-cloudy .about-card {
	margin-bottom: 25px;
}


.about-card:hover {
	transform: translateY(-10px) !important;
	box-shadow: 0px 11px 8px 0px rgba(0, 0, 0, 0.1);
}

.about-card-header-text h4 {
	transition: color 0.3s ease-in-out;
}

.hero-section h4.prodcut-name {
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}

.about-card-header:hover .about-card-header-text h4,
.about-card-header:hover h4 {
	color: #1b4a7f;
}

.e-font-icon-svg {
	width: 48px;
	height: 48px;
	fill: #007d91;
	transition: fill 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.about-card-header:hover .e-font-icon-svg,
.about-card-header:hover img {
	fill: #007D91;
	transform: rotate(10deg);
}

.about-card-header-text p {
	color: #666;
}

.slick-arrow {
	border: 0;
	background: transparent;
}

.data-center img:hover {
	transform: translateY(-10px) !important;
	cursor: pointer;
}

.data-center img {
	width: 100%;
	height: 100%;
	padding: 8px 20px;
	object-fit: contain;
	background: #efefef;
	position: relative;
	background-color: #ffffff;
	border-radius: 15px;
	transition: all 0.3s ease;
	box-shadow: 0 3px 10px rgb(0 0 0 / 9%);
	overflow: hidden;
}

.data-center img:hover {
	filter: grayscale(0%);
}

.card-header {
	padding: 18px 20px;
	border-bottom: 1px solid #eef2ff;
	background-color: #f7f9fd;
	border-radius: 16px 16px 0 0;
}

.faq .accordion-item {
	border: 0;
}

.data-center {
	background: #fff;
}

.slick-prev.slick-arrow {
	position: absolute;
	left: -15px;
	top: 40%;
	background-image: url(../img/arrow.webp);
	background-size: 70%;
	background-repeat: no-repeat;
	background-position: center;
}

.slick-next.slick-arrow {
	position: absolute;
	right: -15px;
	top: 40%;
	background-image: url(../img/arrow.webp);
	background-size: 70%;
	background-repeat: no-repeat;
	background-position: center;
	transform: rotate(182deg);
}

.slick-arrow {
	border: 0;
	background: #ffffff;
	font-size: 0px;
	width: 30px;
	height: 30px;
	border-radius: 50px;
	z-index: 2;
	box-shadow: 0px 0px 2px 1px #8080801a;
}

section.we-work {
	background: #fff;
}

footer .social-icon svg {
	font-size: 30px;
	color: #d7d7d7;
}

.col-footer.footer-links li a,
.footer-links li {
	transition: 0.5s;
}

.col-footer.footer-links a:hover,
.col-footer.footer-links li:hover {
	color: #00b6ff;
	transform: translateX(1px);
}

.col-footer li a,
.col-footer.social-icon svg {
	transition: 0.5s;
}

.col-footer li a:hover {
	color: #00b6ff;
}

.col-footer.social-icon svg:hover {
	color: #00b6ff;
}


.banner-section p,
.banner-section h2 {
	color: #fff;
}

.configure-page h2 {
	font-weight: 700;
}

.breadcrumb-item {
	font-size: 14px;
	font-weight: 500;
}

.breadcrumb-item a {
	text-decoration: none;
}

.banner-section {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	min-height: 500px;
}

.banner-section:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 65%;
	background: linear-gradient(180deg, #00000057, #000000cf);
	z-index: -1;
	height: 500px;
	backdrop-filter: blur(3px);
}


.hosting-need {
	background: #007BFF;
}

.hosting-need h2,
.hosting-need p {
	color: #fff;
}

.product-card-footer.product-buy .product-margin p {
	font-weight: 600;
	font-size: 16px;
	line-height: 2.1;
	color: #323c46;
	margin-bottom: 16px;
}

.product-flex.buy-product .card {
	height: 100%;
	box-shadow: 0px 0px 2px 1px #8080801a;
	border-radius: 5px;
	border: 0;
}

.product-card-footer.product-buy {
	margin-top: 22px;
}

.operating-system .tab-content {
	width: 80%;
	margin: auto;
}

.operating-system .nav-link {
	background: #00bbff;
	color: #f8f8f8;
}

.operating-system .nav-pills .nav-link.active,
.operating-system .nav-pills .show>.nav-link {
	background-color: #1b4a7f;
}

.accordion-button:focus {
	box-shadow: none;
}

.slider-client-review {
	/* background: #fff; */
	/* border-radius: 10px;
        padding: 82px 50px;
        box-shadow: 0px 0px 2px 1px #8080801a; */
}

.client-review-card {
	text-align: start;
}

.client-review {
	padding: 80px 0;
	/* Subtle gradient background */
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}


/* 3. CARD LAYOUT (FLEXBOX) */
.slider-client-review {
	display: flex;
	justify-content: space-between;
	gap: 30px;
}

/* 4. INDIVIDUAL CARD (The Star of the Show!) */
.client-review-card {
	flex: 1;
	background-color: #ffffff;
	padding: 35px;
	border-radius: 15px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
	/* Soft initial shadow */
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	/* Smooth transition for hover */
	display: flex;
	flex-direction: column;
	min-height: 277px;
	/* Uniform height */
	text-align: left;
}

/* HOVER EFFECT for better UX */
.client-review-card:hover {
	transform: translateY(-8px);
	/* Card lifts up */
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
	/* Shadow becomes more pronounced */
}

/* 5. QUOTE ICON */
.quote-icon {
	font-size: 4em;
	color: #007bff;
	/* Accent color for the icon */
	line-height: 1;
	margin-bottom: 15px;
	opacity: 0.1;
	/* Very light, modern look */
	position: absolute;
	top: 10px;
	left: 20px;
}

/* 6. MESSAGE BODY */
.client-body {
	flex-grow: 1;
	position: relative;
	z-index: 10;
}

.client-body p {
	font-size: 1.1em;
	color: #444;
	line-height: 1.7;
	margin-bottom: 25px;
	font-style: italic;
	/* The review message is often italicized */
}

/* 7. CLIENT PROFILE (Name & Title) */
.client-review-footer {
	display: flex;
	align-items: center;
	margin-top: auto;
	/* Push to the bottom */
	padding-top: 15px;
	border-top: 1px solid #f0f0f0;
}

.client-avatar {
	width: 50px;
	height: 50px;
	background-color: #007bff;
	/* Placeholder color if image is missing */
	border-radius: 50%;
	margin-right: 15px;
	overflow: hidden;
	border: 2px solid #e6f0ff;
	/* Light border around avatar */
	flex-shrink: 0;
}

.client-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.client-profile-details {
	line-height: 1.3;
}

.client-profile-details .name {
	font-size: 1.1em;
	font-weight: 700;
	color: #1a4f80;
	margin: 0;
}

.client-profile-details .title {
	font-size: 0.9em;
	color: #777;
	margin: 0;
	font-weight: 500;
}

.client-review .slick-slide {

	padding-right: 5px;
	padding-left: 5px;
}

.client-review .slick-track {
	padding: 31px 0 !important;
}

/* Accordion Container Styling */
.accordion {
	border: none;
}

.counter-section {
	/* Deep Navy Blue/Dark Grey Background */
	background-color: #1e293b;
	/* Use strong contrast color for the section accent */
    border-top: 5px solid #007bff;
	padding: 100px 0;
	/* More padding for impact */
	font-family: 'Inter', sans-serif;
}

/* Individual Counter Card Styling */
.counter-card {
	padding: 20px 10px;
	background-color: transparent;
	transition: transform 0.3s ease;
}

/* Add a subtle hover effect for better UX */
.counter-card:hover {
	transform: translateY(-5px);
}

/* Counter Number Styling (The most important part) */
.counter-card h2 {
	font-size: 4.5em;
	/* Extra Large font size */
	font-weight: 900;
	/* Ultra bold */
	color: #ffffff;
	/* White number */
	line-height: 1;
	margin-bottom: 5px;
}

/* Suffix and Plus sign */
.counter-card .suffix {
	color: #00bcd4;
	/* Cyan/Teal Accent Color */
}

/* Counter Label Styling */
.counter-card p {
	font-size: 1.2em;
	/* Slightly larger label */
	font-weight: 500;
	color: #94a3b8;
	/* Soft light grey label */
	letter-spacing: 1px;
	/* Slight spacing for emphasis */
	text-transform: uppercase;
	margin: 0;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 992px) {
	.counter-card h2 {
		font-size: 3.5em;
	}

	.counter-section {
		padding: 60px 0;
	}
}

.faq .accordion-item {
	border: 1px solid #e0e6ed;
	margin-bottom: 12px;
	border-radius: 8px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
	overflow: hidden;
	transition: box-shadow 0.3s ease;
	border: 0;
}

/* Hover effect on item for better UX */
.faq .accordion-item:hover {
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
}

/* Accordion Button (Question) Styling */
.faq .accordion-button {
	font-size: 1.1em;
	font-weight: 600;
	color: #1a4f80;
	/* Dark blue question text */
	padding: 18px 25px;
	background-color: #ffffff;
	border-radius: 8px !important;
	border: none;
	transition: background-color 0.3s ease;
}

/* Active Accordion Button Styling (The light blue bar) */
.accordion-button:not(.collapsed) {
	color: #007bff;
	/* Blue text when active */
	background-color: #e6f0ff;
	/* Very light blue background */
	box-shadow: none;
	border-bottom: 1px solid #c7d8ed;
	/* Separator line */
}

/* Arrow (Chevron) Styling */
.accordion-button:not(.collapsed)::after {
	transform: rotate(-180deg);
	filter: brightness(0.8);
	/* Make the arrow slightly darker/bluer */
}

.accordion-button::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%231a4f80' class='bi bi-chevron-down' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
}

/* Accordion Body (Answer) Styling */
.faq .accordion-body {
	padding: 20px 25px;
	background-color: #f7f9fc;
	/* Light background for the answer area */
	color: #555;
	font-size: 1em;
	line-height: 1.6;
}

/* Image Column Styling */
.faq-image-col {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 30px;
}

.faq-image-col img {
	max-width: 100%;
	height: auto;
	/* Optional: Slight 3D effect on the image */
	transform: scale(1.05);
}

/* Responsive adjustments (for smaller screens) */
@media (max-width: 992px) {
	.faq-image-col {
		margin-top: 40px;
		padding-left: 15px;
	}
}

.faq .accordion-button {
	font-weight: 600;
	font-size: 1.1rem;
}

.walet img {
	width: 73px;
	margin-right: 11px;
}

.walet p {
	font-size: 1.5em;
	font-weight: 400;
}

.mobile-price-table .accordion-button::after {
	margin-left: unset;
	right: -3px;
	top: 13px;
	position: absolute;
}

.main-heading-price {
	width: 95%;
}

.main-heading-price h5 {
	font-size: 16px;
	font-weight: 700;
	color: #323c46;
	width: 49%;
}

.main-heading-price h5:nth-child(2) {
	text-align: end;
}

.mobile-price-table .accordion-body .main-heading-price h5,
.mobile-price-table .accordion-body .main-heading-price p {
	color: #323c46;
	font-size: 15px;
}

.mobile-price-table .accordion-body {
	padding-left: 0;
	padding-right: 0;
}

.mobile-price-table .accordion-button {
	padding: 12px 3px;
}

.mobile-price-table .accordion-button:not(.collapsed) {
	background-color: transparent;
}

.card-header h3 {
	font-weight: 700;
	color: #323c46;
	font-size: 22px;
	text-transform: capitalize;
}

.checkout .formsubmission .card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-color: #80808033;
	background: #fff;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
}

.middle-nav .dropdown-menu {
	display: none;
}

.middle-nav .nav-item:hover .dropdown-menu {
	display: block;
	position: absolute;
	padding: 15px;
	visibility: visible;
}

.navbar-nav.middle-nav a {
	color: #000;
	text-decoration: none;
}

.card-header .lable-no-stop {
	top: 0;
}

.card-header .lable-no-stop span {
	border-radius: 3px;
	padding: 3px 5px;
}

.checkout .card {
	background-color: #ffffff;
	border: none;
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	overflow: hidden;
}

.checkout .checkout-specifiction-style span {
	font-weight: 700;
	font-size: 14px;
}

.checkout-specifiction-style p {
	margin-bottom: 0;
}

.checkout-specifiction-style small {
	font-size: 12px;
	position: relative;
	top: -6px;
}

.checkout .style-d-flex {
	gap: 100px;
}

.checkout hr {
	border-color: #808080e0;
}

.checkout .length-select .form-check-label {
	border: 2px solid #00000091;
	padding: 30px 10px;
	text-align: center;
	width: 100%;
	cursor: pointer;
	font-size: 16px;
}

.length-select .form-check-input {
	position: relative;
	right: 9px;
	top: -5px;
}

.checkout .length-select {
	width: 100%;
	position: relative;
}

.checkout .form-check-label span {
	font-weight: 700;
}

.checkout .form-check {
	text-align: center;
	padding-left: 0;

}

.checkout .length-select {
	position: relative;
	width: 250px;
	    height: 92%;
}

.checkout-box .form-check .month-lab {
	background: #fff;
	position: relative;
	top: -12px;
	padding: 9px;
	font-size: 14px;
}

.monthlybilling {
	flex-wrap: wrap;
	align-items: start;
}

.checkout .form-check-label {
	font-size: 21px;
}

.checkout .money-save-lable {
	position: absolute;
	left: 50%;
	transform: translate(-50%, -55%);
	background: #DDF3E4;
	color: #008728;
	font-weight: 700;
	padding: 3px 15px;
	border-radius: 50px;
	font-size: 12px;
	width: 57%;
	border: 1px solid #0087282b;
	z-index: 99;
}

.checkout .form-check:has(.form-check-input:checked) .form-check-label {
	border: 2px solid blue;
	box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
}

.checkout .region-check .form-check-label {
	text-align: start;
	padding: 15px 47px;
	margin-bottom: 5px;
	font-size: 18px;
}

.checkout .term-length #pills-tab {
	border-bottom: 1px solid #0d6efd;
}

.checkout .template .length-select img {
	width: 71px;
	height: 71px;
	object-fit: contain;
	margin-bottom: 5px;
	background-color: transparent;
	mix-blend-mode: multiply;
}

.checkout .template .length-select .form-check-label {
	text-align: center;
	margin-bottom: 20px;
}

.checkout .template .form-check-label {
	padding: 30px 15px;
}

.checkout .summary-details h5 {
	font-size: 17px;
}

.checkout .summary-details h6 {
	font-size: 14px;
	margin-top: 23px;
}

/* .checkout .list-summary {
        padding-left: 16px;
    }

    .checkout .list-summary li {
        font-size: 12px;
    } */

.checkout .choose-payment-method .accordion-body .form-check-label {
	font-size: unset;
}

.checkout-box .choose-payment-method .form-check {
	padding: 3px 22px;
}

.total-amount h5 {
	font-weight: 700;
	color: #000000c4;
	position: relative;
}

.tooltip-style {
	border-radius: 50px;
	padding: 0;
	width: 13px;
	height: 13px;
	font-size: 10px;
	background-color: #a9a9a9;
	border: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 1px;
	right: -18px;
}

.checkout .checkout-box {
	position: sticky;
	top: 61px;
}

.forget-password {
	text-decoration: none;
}

.form-btn {
	background: #4f46e5;
	display: inline-block;
	padding: 12px 25px;
	font-weight: 600;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	text-decoration: none;
	transition: background-color 0.3s, transform 0.1s, box-shadow 0.3s;
	box-shadow: 0 4px 15px rgba(79, 70, 229, 0.4);
}

.form-btn:hover {
	color: #fff;
	background: #007bffb5;
}

.dropdown-menu-currencie input,
.formcreate input,
.formcreate select,
.dropdown-menu-currencie select {
	border-radius: 0.5rem;
	padding: 12px;
	border-color: rgb(209 213 219);
}

button.toggle-password {
	color: #9ca3af;
}

label.col-form-label {
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.formcreate .form-control:focus,
.formcreate .form-control:hover,
.formcreate .form-select:focus,
.formcreate .form-select:hover,
.dropdown-menu-currencie .form-control:focus,
.dropdown-menu-currencie .form-control:hover,
.dropdown-menu-currencie .form-select:focus,
.dropdown-menu-currencie .form-select:hover {
	color: #212529;
	background-color: #fff;
	border-color: #828c9b;
	outline: 0;
	box-shadow: 0 0 0 0.05rem #828c9b;
}

.paymentcustomer {
	gap: 20px;
	width: 76%;
	display: flex;
	align-items: center;
	justify-content: end;
}

.hero-section .product-card {
	transition: 0.5s;
	width: 100%;
}

.p-f-style {
	font-size: 18px;
	line-height: 150%;
}

.buy-product .product-card:hover,
.hero-section .product-card:hover {
	transform: translateY(-5px) !important;
}

.paymentcustomer p {
	margin: 0;
	width: 23px;
	height: 23px;
	background: #828C9B;
	color: #fff;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.paymentcustomer span {
	color: #828C9B;
	font-weight: 600;
}

.paymentcustomer .progress {
	width: 10%;
	height: 3px;
	background: #828c9b;
}

.choose-payment-method .accordion-button:not(.collapsed) {
	background-color: #ffffff;
	color: #000000;
}

.accordion-button span {
	font-weight: 600;
}

.choose-payment-method .form-check:has(.form-check-input:checked) .form-check-label {
	border: 0px solid blue;
	box-shadow: none;

}

.choose-payment-method .form-check-label {
	cursor: pointer;
}

.choose-payment-method .form-check {

	padding: 13px 31px;
}

.choose-payment-method .accordion-button {
	padding: 0;
}

.form-group.card-details input {
	border-radius: 0;
	padding: 12px;
	border-color: #c5c5c5;
}

.form-group.card-details .form-control:focus,
.form-group.card-details .form-control:hover {
	color: #212529;
	background-color: #fff;
	border-color: #828c9b;
	outline: 0;
	box-shadow: 0 0 0 0.05rem #828c9b;
}

/* .template .form-check-input {
        left: 23px;
        top: -24px;
        position: relative;
    } */

header .navbar-nav .nav-item a:hover,
header .navbar-nav .nav-item .dropdown-menu .active,
header #navbarNavDropdown .navbar-nav .nav-item.dropdown a.active {
	color: #1b4a7f;
	background: transparent;
}

.accordion-button:not(.collapsed) {
	color: #1b4a7f;
}

.cta-section {

	background: #007BFF;
	color: white;
	padding: 25px 50px;
	border-radius: 5px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.cta-section .startbtn {
	border-radius: 50px;
	color: #000;
	font-weight: 600;
	padding: 12px 60px;
	border: 1px solid #fff;
}

.cta-section .startbtn:hover {
	background: transparent;
	color: #fff;
}

.cta-content h2 {
	font-size: 36px;
	margin-bottom: 15px;
}

.cta-content p {
	font-size: 1.05rem;
	line-height: 1.6;
	margin-bottom: 25px;
	color: #ffffff;
}

.cta-content a {
	display: inline-block;
	background-color: #fff;
	color: #007BFF;
	padding: 12px 24px;
	font-weight: bold;
	text-decoration: none;
	border-radius: 6px;
	transition: background-color 0.3s ease;
}

.cta-content a:hover {
	background-color: #e2e8f0;
}

.cta-image img {
	width: 57%;
}

.mobile-price-box h3 {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 10px !important;
}

.product-margin ul {
	list-style: none;
	padding: 0;
}

.product-margin ul li {
	margin-bottom: 10px;
}

.template-cycle .money-save-lable {
	top: 0;
	transform: translate(-50%, -65%);
}

.template-cycle p {
	font-size: 16px;
}

.mobile-currency {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* --- Group Header Styling --- */
.table-card h3 {

	color: #004E98;
}

.table.caption-top {
	margin-bottom: 0 !important;
	border-collapse: separate;
	border-spacing: 0;
}

/* --- Table Header (thead) Styling --- */
.pricing-box .table thead th {
	border-bottom: 1px solid #eef2ff;
	background-color: #f7f9fd;
	color: #4b5563;
	font-weight: 700;
	font-size: 1rem;
	padding: 7px 15px;
	text-transform: uppercase;

}


.pricing-box table .price-heading-col p {
	color: #4b5563;
}


/* --- Table Body (tbody) Styling --- */
.table tbody tr {
	border-bottom: 1px solid #eeeeee;
	/* Minimal separator */
}

.table tbody tr:hover {
	background-color: #f7f9fd;
	/* Lightest blue highlight */
}

.pricing-box .table tbody tr td,
.pricing-box .table tbody tr th {
	padding: 10px 13px;
	position: relative;
}

/* --- Model Name Column Styling --- */
.modal-name {
	font-weight: 700;
	color: #1a202c;
}


/* Setup Fee Badge (Accent Color) */
.pricing-box .lable-no-stop span {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 700;
}

/* --- Specification Columns (Core, Memory, etc.) Styling --- */
.specification {
	color: #666;
	font-weight: 400;
}

.specification strong {
	color: #1f2937;
	font-weight: 700;
	font-size: 1.05rem;
}

.table-money {
	font-size: 2.5rem;
	font-weight: 900;
	color: #004e98;
}

.table-money+span {
	color: #666;
	font-weight: 500;
	font-size: 1.1rem;
}


.mobile-price-table .table-card {
	background: #fff;
	border-radius: 5px;
	padding: 1.75em 0.75em;
	margin-top: 1em;
	box-shadow: 0px 0px 2px 1px #8080801a;
}

:root {
	--primary-color: #007bff;
	/* Primary Blue for Checked State */
	--accent-color: #f8f9fa;
	/* Light background for cards */
	--border-color: #e2e8f0;
	/* Subtle border */
	--shadow-light: 0 4px 12px rgba(0, 0, 0, 0.05);
	--shadow-hover: 0 6px 15px rgba(0, 0, 0, 0.1);
	--border-radius: 0.75rem;
	/* Rounded corners for modern look */
}

.term-length h4 b {
	color: #1f2937;
	font-size: 22px;
	margin-bottom: 1.5rem;
}

.checkout-specifiction .description {
	font-size: 0.95rem;
	line-height: 1.5;
	color: #555;
	margin-bottom: 0;
}


.length-select {
	width: 100%;
}

.length-select .form-check {
	border: 2px solid var(--border-color);
	border-radius: var(--border-radius);
	padding: 1.5rem;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
	background-color: var(--accent-color);
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	margin-bottom: 1rem;

	border: none;
	padding: 0;
	background: none;
}

.monthlybilling>.length-select .form-check-label,
.region-check .length-select .form-check-label {
	/* Base Card Style */
	border: 2px solid var(--border-color);
	border-radius: var(--border-radius);
	background-color: var(--accent-color);
	transition: all 0.2s ease-in-out;
	padding: 1.5rem;

	/* Layout */
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	position: relative;
	cursor: pointer;
}

.length-select .form-check-label:hover {
	border-color: var(--primary-color);
	box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.2);
}

.length-select .form-check-input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.length-select .form-check-input:checked~.form-check-label {
	border-color: var(--primary-color);
	background-color: #e6f0ff;
	/* Very light blue background */
	box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
}

.length-select .form-check-input:checked~.form-check-label::after {
	content: '✓';
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 1.2rem;
	color: white;
	background-color: var(--primary-color);
	border-radius: 50%;
	width: 25px;
	height: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	z-index: 10;
	/* Ensure checkmark is on top */
}

.template .length-select .form-check-input {

	opacity: 1;
	box-shadow: none;
	background-color: transparent;
}

.template .length-select .form-check-input:checked::after {
	content: '✓';
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 1.2rem;
	color: white;
	background-color: var(--primary-color);
	border-radius: 50%;
	width: 25px;
	height: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	z-index: 10;
	/* Ensure checkmark is on top */
}

.length-select .form-check-label {
	display: block;
	cursor: pointer;
	padding: 0;
	width: 100%;
	height: 100%;
	position: relative;
	border: none;
	transition: all 0.2s ease-in-out;
}


.monthlybilling .length-select .month-lab {
	display: none;
}

.money-save-lable {
	font-size: 0.85rem;
	color: #888;
	margin-bottom: 0.5rem;
}

.money-save-lable .setupfee {
	font-weight: 600;
	color: #ff4500;
}

.monthlybilling .pricelabel {
	font-size: 1.6rem;
	font-weight: 800;
	color: #155089;
	display: block;
}


.region-check .length-select .form-check-label {
	padding: 1rem;
	text-align: center;
}

.region-check img {
	max-width: 60px;
	height: auto;
	margin: 0 auto 0.75rem auto;
	display: block;
	transition: transform 0.2s;
}

.region-check .form-check:hover .form-check-label img {
	transform: scale(1.05);
}

.templategetname {
	font-size: 1.1rem;
	font-weight: 700;
	color: #1f2937;
	display: block;
	/*margin-bottom: 0.25rem;*/
}

.template-cycle p {
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1.2;
}

.template-cycle b {
	color: #155089;
	font-size: 1rem;
}

.monthlybilling .length-select .form-check,
.region-check .length-select .form-check {
	border: none;
	padding: 0;
	background: none;
}

.length-select .form-check-input:checked~.form-check-label {
	border-color: var(--primary-color);
	background-color: #e6f0ff;
	box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
}


.sidebar-checkout {
	color: #1f2937;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.order-summary-box {
	padding: 18px 0;
}

.sidebar-checkout .card {
	/* Card Styles */
	background-color: #ffffff;
	border: none;
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	overflow: hidden;
}

.sidebar-checkout .card-header {
	/* Header Styles */
	padding: 18px 20px;
	border-bottom: 1px solid #eef2ff;
	background-color: #f7f9fd;
	border-radius: 16px 16px 0 0;
}

.sidebar-checkout .card-header h6 b {
	color: #1f2937;
	/* Darker, high-contrast text */
	font-size: 1.1rem;
}

.sidebar-checkout .card-body {
	padding: 20px;
}

.sidebar-checkout .choose-payment-method .form-check {
	padding: 6px 15px;
}

.sidebar-checkout .form-check-input {
	cursor: pointer;
}

/* Active radio state */
.sidebar-checkout .form-check-input:checked {
	background-color: #4f46e5;
	/* Primary purple color */
	border-color: #4f46e5;
	box-shadow: 0 0 0 3px #e0e7ff;
}

.sidebar-checkout .form-check-input:checked+.form-check-label {
	font-weight: 600;
	color: #1f2937;
}

.sidebar-checkout .form-check-label {
	font-weight: 500;
	color: #4b5563;
	transition: color 0.2s;
}

.sidebar-checkout .summary-details {
	padding-top: 0 !important;
}

.sidebar-checkout .summary-details h5 b {
	font-size: 1.15rem;
	color: #1f2937;
	margin-bottom: 20px;
	display: block;
}

.sidebar-checkout .summary-details h6 b {
	font-size: 0.9rem;
	color: #6b7280;
	margin-top: 15px;
	margin-bottom: 15px;
}

.sidebar-checkout .list-summary {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-checkout .list-summary li {
	font-size: 0.9rem;
	color: #4b5563;
	border-bottom: 1px dashed #f3f4f6;
	padding: 3px 0px;
}

.sidebar-checkout .list-summary li:last-child {
	border-bottom: none;
}

/* Totals Section */
.sidebar-checkout .total-amount>div {
	padding: 5px 0;
}

.sidebar-checkout .total-amount h5 {
	font-size: 1rem;
	margin: 0;
	font-weight: 500;
	color: #4b5563;
	width: 60%;
}

.sidebar-checkout .total-amount h5:last-child {
	font-weight: 600;
	color: #1f2937;
	width: 35%;
	text-align: end;
}


/* Due Today Highlight */
.sidebar-checkout .total-amount>.mt-4.d-flex:last-of-type {
	/* border-top: 2px solid #e0e7ff; */
	/* Clear separator */
	/* padding-top: 18px;
        margin-top: 18px !important; */
}

.sidebar-checkout .total-amount>.mt-4.d-flex:last-of-type h5 {
	/* font-size: 1.4rem;
        font-weight: 700;
        color: #4f46e5; */
	/* Striking primary color for the final price */
}

/* Next Button */
.sidebar-checkout .payment-now {
	color: #ffffff;
	border: none;
	border-radius: 10px;
	padding: 12px 20px;
	font-weight: 600;
	font-size: 1.05rem;
	transition: background-color 0.3s, transform 0.1s, box-shadow 0.3s;
	width: 100%;
	text-align: center;
	display: block;
	text-decoration: none;
	max-width: 100%;
}

/* Tooltip Button Styling (the '?' button) */
.sidebar-checkout .tooltip-style {
	background: #9ca3af;
	color: white;
	border-radius: 50%;
	width: 24px;
	height: 24px;
	font-size: 0.8rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	margin-right: 5px;
	cursor: help;
	transition: background-color 0.2s;
}

.sidebar-checkout .tooltip-style:hover {
	background-color: #4f46e5;
}

/* Footer text */
.sidebar-checkout .text-center p {
	font-size: 0.75rem;
	color: #9ca3af;
}

.sidebar-checkout .d-flex {
	display: flex;
	justify-content: space-between;
	align-items: start;
}

@media screen and (max-width: 1400px) {
	.product-flex {
		grid-template-columns: repeat(auto-fit, minmax(206px, 0fr));
	}

	.counter-card {
		margin: auto;
	}

	.checkout .length-select {
		position: relative;
		width: 31%;
	}

	.checkout .template .length-select {
		width: 100%;
	}
}


@media screen and (max-width: 1199px) {
	.product-flex {
		grid-template-columns: repeat(auto-fit, minmax(294px, 0fr));
		justify-content: start;
	}
    .big-header #navbarNavDropdown .nav-link {
        font-size: 13px;
    }
    .big-header #navbarNavDropdown .dropdown-toggle.parent {
        gap: 0px;
    }
}

@media (min-width: 992px) {
	.navbar-expand-lg .navbar-collapse {
		justify-content: end;
	}
}

@media screen and (max-width: 991px) {
	.checkout .length-select {
		width: 48%;
	}

	body {
		padding-top: 62px;
	}

	.checkout .template .length-select {
		width: 100%;
	}

	.product-flex {
		grid-template-columns: repeat(auto-fit, minmax(217px, 0fr));
	}

	.product-flex {
		flex-wrap: wrap;
		justify-content: center;
		padding: 0 10px;
	}

	.counter-card {
		text-align: center;
		margin-bottom: 40px;
	}

	.about-card-header img {
		width: 13%;
	}

	.choose-cloudy svg {
		width: 12%;
	}

	.about-card-header {
		align-items: start;
	}

	.buy-product {
		grid-template-columns: repeat(3, 1fr);
	}


	.top-bar {

		display: none;
	}

	.mobile-price-box .accordion-header {
		margin-bottom: 0;
		border: 0;
		outline: 0;
		box-shadow: none;
	}

	.mobile-price-table .accordion-button {
		border-bottom: 1px solid #00000045;
	}

	.product-card {
		margin-bottom: 30px;
	}

	.cloude-about .col-lg-6:nth-child(odd) .about-card-header,
	.cloude-about .col-lg-6:nth-child(odd) .about-card-header,
	.cloude-about .col-lg-6:nth-child(even) .about-card-header {

		text-align: center !important;
	}


}

@media screen and (max-width: 767px) {
	.verify-otp-btn {
		margin-bottom: 16px;
	}

	.cta-section {
		flex-direction: column;
		text-align: center;
		padding: 25px 15px;
	}

	.cta-image img {
		margin-top: 30px;
		max-width: 100%;
	}

	.data-center img {
		margin-bottom: 20px;
		filter: grayscale(0%);
	}

	.we-work img {
		filter: grayscale(0%);
	}

	.choose-cloudy .about-card-header {
		text-align: center !important;
	}

	.choose-cloudy .about-card-header img {
		margin: auto !important;
	}

	.slick-prev.slick-arrow,
	.slick-next.slick-arrow {
		display: none !important;
	}

	.about-card-header {
		display: grid !important;
		text-align: center;
	}

	.cloude-about .about-card-header img,
	.cloude-about .about-card-header svg {
		width: 20%;
		margin: auto;
		margin-bottom: 15px;
	}

	.about-card-header img {
		width: 20%;
		margin: auto;
	}

	.product-flex.buy-product {
		grid-template-columns: repeat(1, 1fr);
	}

	.cloude-about,
	.client-review {
		/* padding-top: 0; */
	}

	.hero-section .product-card,
	.hero-section .product-card p {
		width: 100%;
		flex-wrap: wrap;
		text-align: start;
	}

	.checkout .style-d-flex {
		flex-wrap: wrap;
	}

	.checkout .length-select {
		width: 100%;
	}

	.invoice-header {
		flex-wrap: wrap;
	}

	.invoice-card .invoice-header div {
		width: 100%;
	}

	.invoice-card .invoice-header div:nth-child(2) {
		text-align: start !important;
		margin-top: 17px;
	}

	.counter-card {
		margin-bottom: 0px;
	}

	.cloude-banner::before,
	.banner-section:after,
	.banner-section::before {
		height: 65%;
	}

	.pricing-banner::before {
		height: 100%;
	}

	.hero-section h1,
	.hero-section p {
		text-align: center;
	}

	h1 {
		font-size: 36px;
	}

	h2 {
		font-size: 28px;
		font-weight: 700;
		margin-bottom: 20px;
	}

	.operating-system .tab-content {
		width: 100%;
	}

	.product-flex .buy-product,
	.hero-section .product-flex {
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	}

	.faq {
		padding-bottom: 0;
	}

	.data-center .row {
		gap: 18px 0;
	}

}


.product-card {
	position: relative;
	padding: 0;
	/* margin: 15px 10px; */
	background-color: #ffffff;
	border-radius: 15px;
	transition: all 0.3s ease;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

.product-card:hover {
	/* More pronounced lift and primary color hint on hover */
	/* box-shadow: 0 10px 30px rgba(79, 70, 229, 0.15); */
	/* Blue-tinted shadow */
	/* transform: translateY(-5px); */
	/* Gentle hover lift effect */
}

/* Setup Fee Label (Top Right Badge) */
.lable-no-stop {
	position: absolute;
	top: 0;
	right: 0;
	background-color: #4f46e5;
	/* Primary brand color */
	color: #ffffff;
	padding: 4px 12px;
	border-bottom-left-radius: 10px;
	font-size: 0.8rem;
	font-weight: 600;
	z-index: 10;
	clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
	/* Adjust clip-path if you want a perfect badge shape, but this works to pull it slightly away from the corner */
}

.lable-no-stop span {
	display: block;
	margin-left: 5px;
}

/* Card Body Content */
.product-card .card {
	border: none;
	border-radius: 0;
	background: none;
}


/* Product Names/Titles */
.product-card .prodcut-name {
	margin-bottom: 5px;
	color: #6b7280;
	font-weight: 700;
	line-height: 1.2;
}

/* Main Product Group Name */
.product-card h3.prodcut-name {
	font-size: 18px;
	text-transform: uppercase;
	opacity: 0.8;
}

/* Package Name/Tier */
.product-card h4.prodcut-name {
	font-size: 1rem;
	font-weight: 500;
}

/* Pricing Area */
.product-card .currency-col-pro {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}


.product-card .pre-decimal-col {
	font-size: 40px;
	font-weight: 900;
	color: #1f2937;
}

.product-card .decimal-col {
	display: flex;
	flex-direction: column;
	text-align: left;
}

.product-card #montly-price {
	font-size: 0.9rem;
	color: #6b7280;
	font-weight: 500;
	text-transform: capitalize;
}


/* Description Footer */
.product-card .product-card-footer {
	border-top: 1px solid #f3f4f6;
	padding: 15px 0px 10px;
	/* min-height: 100px; */
}

.features-benefits {
	background-image: url(/public/frontend/assets/img/bg-f.webp);
	position: relative;
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

.features-benefits .container {
	z-index: 1;
	position: relative;
}

.features-benefits::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	background: #0000006b;
	width: 100%;
	height: 100%;
	z-index: 0;
	 backdrop-filter: blur(3px);
}

.features-benefits h2,
.features-benefits p {
	color: #fff;
}

.product-card .product-margin {
	font-size: 16px;
	color: #6b7280;
	line-height: 1.9;
	text-align: left;
	font-weight: 500;
}

.features-benefits .about-card-header p {
	color: #666;
}

.contact-link {
	color: #155089;
	text-decoration: none;
	font-size: 1.1rem;
	font-weight: 600;
	transition: color 0.2s;
}

.contact-link:hover {
	color: var(--primary-light);
	text-decoration: underline;
}

/* Locations Section Styling */
.locations-section {
	padding-top: 60px;
	padding-bottom: 60px;
}

.locations-section h2 {
	position: relative;
	padding-bottom: 15px;
}

.location-card {
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
	border-left: 5px solid #155089;
	/* Office */
}

/* Specific styling for Data Center cards */
.location-card:nth-child(n+4) {
	border-left-color: #155089;
}

/* Utility classes from custom variables */
.text-primary-light {
	color: #155089 !important;
}

.text-dark-blue {
	color: #155089 !important;
}

.bg-light-blue {
	background-color: var(--light-blue) !important;
}

.text-primary-main {
	color: #155089 !important;
}

/* Contact Details Card Styling */
.contact-details-section {
	background-color: #fff;
}

.contact-card {
	/* background-color: var(--light-blue); */
	border-radius: 12px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	/* border: 1px solid #dee2e6; */
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border-radius: 15px;
	box-shadow: 0 3px 10px rgb(0 0 0 / 9%);
}

.contact-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.contact-details-section .fa-phone-flip {
	transform: rotate(108deg);
}

.contact-card svg {
	width: 50px;
	height: 50px;
}

.monthly-col span {
	font-size: 12px;
	font-weight: 600;
}
.order-summary-lable {
    font-weight: 600;
    color: #4b5563;
    transition: color 0.2s;
}
.list-group-item span:nth-child(2) {
    text-align: end;
}
.list-group-item span {
    width: 50%;
}