﻿/*-------------------------------------------body, html--------------------------------------*/
body {
	font-family: "Helvetica";
	padding-top: 90px;
	background-color: #fafafa;
}

html {
	scroll-padding-top: 140px;
	scroll-behavior: smooth;
}

.submenu2

@media (max-width:768px) {
	html

{
	scroll-padding-top: 210px;
	scroll-behavior: smooth;
}

}

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
}


/*-------------------------------------------bannerbg--------------------------------------*/
/*.bannerbg {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/bannerbg.png) !important;
	overflow-y: auto;
	padding: 3rem 1rem;
	height: 100%;
	min-height: 230px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #099e2a;
	color: white;
}


.bannerbg11 {
	background: linear-gradient(90deg, rgb(35 102 1 / 0%), rgba(111, 193, 86, 1%)), url(../images/bannerbg.webp);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 230px;
	padding: 3rem 1rem;
	color: white;
}

	.bannerbg p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}

	.bannerbg h1 {
		font-size: 3.2em;
		color: rgb(255, 255, 255);
	}

@media(max-width:768px) {
	.bannerbg h1 {
		font-size: 2em !important;
		color: rgb(255, 255, 255);
	}

	.bannerbg {
		padding: 5rem 1rem;
	}
}*/
/*23 feb*/
/*-------------------------------------------bannerbg-oligo--------------------------------------*/
/*.bannerbg-oligo {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/bannerbg-test.png) !important;
	overflow-y: auto;
	padding: 3rem 1rem;
	height: 100%;
	min-height: 230px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #099e2a;
	color: white;
}*/
/*.bannerbg-oligo {
	background: linear-gradient(90deg, rgb(35 102 1 / 0%), rgba(111, 193, 86, 1%)), url(../images/bannerbg.webp);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 230px;
	padding: 3rem 1rem;
	color: white;
}

	.bannerbg-oligo p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}

	.bannerbg-oligo h1 {
		font-size: 3.2em;
		color: rgb(255, 255, 255);
	}

@media(max-width:768px) {
	.bannerbg-oligo h1 {
		font-size: 2em !important;
		color: rgb(255, 255, 255);
	}

	.bannerbg-oligo {
		padding: 5rem 1rem;
	}
}*/
/*----------------------------------------peptide---bannerbg--------------------------------------*/
.peptide-bannerbg {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/banner/peptide-banner.png) !important;
	overflow-y: auto;
	padding: 3rem 1rem;
	height: 100%;
	min-height: 230px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #099e2a;
	color: white;
}

	.peptide-bannerbg p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}
	.peptide-bannerbg pbold {
		font-size: 1.20rem;
		color: #e9f6e7;
		display: block;
		margin-top: 8px;
		font-weight: 600;
	}
	.peptide-bannerbg h1 {
		font-size: 3.2em;
		color: rgb(255, 255, 255);
	}

@media(max-width:768px) {
	.peptide-bannerbg h1 {
		font-size: 2em !important;
		color: rgb(255, 255, 255);
	}

	.peptide-bannerbg {
		padding: 5rem 1rem;
	}
}
/*-------------------------------------------bannerbg--------------------------------------*/
.bannerbg1 {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/bannerbg.gif) !important;
	overflow-y: auto;
	padding: 3rem 1rem;
	height: 100%;
	min-height: 230px;
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	background-color: #099e2a;
	color: white;
}

	.bannerbg1 p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}

	.bannerbg1 h1 {
		font-size: 3.2em;
		color: rgb(255, 255, 255);
	}

@media(max-width:768px) {
	.bannerbg1 h1 {
		font-size: 2em !important;
		color: rgb(255, 255, 255);
	}

	.bannerbg1 {
		padding: 5rem 1rem;
	}
}

/*-----------28 jan 26 form video banner------*/

/*.bannerbg2 {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/bannerbg.mp4) !important;
	overflow-y: hidden;
	padding: 3rem 1rem;
	height: 100vh;
	min-height: 230px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #333;
	color: white;
	position: relative;
}*/
/* VIDEO */
/*.banner-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}*/

/* CONTENT ABOVE VIDEO */
/*.banner-content {
	position: relative;
	z-index: 1;
}

.bannerbg2 p {*/
/*line-height: 30px;*/
/*font-size: 35px;
	color: #e9f6e7;
	text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
}

.bannerbg2 h1 {
	font-size: 80px;
	color: rgb(255, 255, 255);
}

@media(max-width:768px) {
	.bannerbg2 h1 {
		font-size: 49px !important;
	}

	.bannerbg2 p {
		font-size: 20px !important;
	}
}*/
/*19 march*/
.bannerbg-24mar {
	background: linear-gradient(90deg, rgba(28, 102, 59, 1) 0%, rgba(111, 193, 86, 1) 100%);
	background-image: url(../images/bannerbg.png); /* DEFAULT (Oligo) */
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #099e2a;
	overflow-y: auto;
	padding: 3rem 1rem;
	height: 100%;
	min-height: 230px;
	color: white;
}
.bannerbg {
	background: linear-gradient(90deg, rgb(35 102 1 / 0%), rgba(111, 193, 86, 1%)), url(../images/bannerbg.webp);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 230px;
	padding: 3rem 1rem;
	color: white;
}

	/* Peptide banner override */
	.bannerbg.peptide {
		background-image: url(../images/banner/peptide-banner.png);
	}

	/* Common text styles */
	.bannerbg h1 {
		font-size: 3.2em;
		color: #fff;
	}

	.bannerbg p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}

	.bannerbg small {
		font-size: 1.10rem;
		color: #e9f6e7;
		display: block;
		/*margin-top: 8px;*/
		font-weight: 600;
	}

	.bannerbg .pbold {
		font-size: 1.10rem;
		color: #e9f6e7;
		display: block;
		/*margin-top: 8px;*/
		font-weight: 600;
	}

	.bannerbg .banner-label {
		line-height: 30px;
		display: inline-block;
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}


/* Responsive */
@media (max-width: 768px) {
	.bannerbg {
		padding: 5rem 1rem;
	}

		.bannerbg h1 {
			font-size: 2em;
		}
}
/*19 march*/
/*-------------------------------------------.card, .card1, .card2, .card3, .biocardbg, .microcardbg--------------------------------------*/
.biocardbg,
.microcardbg,
.card,
.card2 {
	background: #ffffff;
	border: 1px solid #C8D6CF;
	border-radius: 12px;
	padding: 20px;
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease-in-out;
}

.card1 {
	background: #fbfdfb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 15px 20px;
	margin-bottom: 15px;
	transition: all 0.3s ease-in-out;
}

.card3 {
	background: #ffffff;
	border: 1px solid #f0f0f0;
	border-radius: 12px;
	padding: 15px 20px;
	margin-bottom: 15px;
	transition: all 0.3s ease-in-out;
}


/*12 feb start*/
.table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: #fbfdfb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	overflow: hidden;
}

	.table thead th {
		background-color: #f0fbf4; /* 13 feb */
		color: #145d2f; /* 13 feb */
		font-weight: bold;
		padding: 14px 18px;
		border-bottom: 1px solid #c8d6cf;
	}

	.table td {
		padding: 10px 15px;
		border-top: 1px solid #f0f0f0;
	}

	/* Optional: remove double border on first row */
	.table tbody tr:first-child td {
		border-top: none;
	}



.card1:has(.table),
.card3:has(.table)
/*.card:has(.table)
*/ {
	border: none;
	box-shadow: none;
	padding: 0;
	background: transparent;
	margin-bottom: 0;
}
/*12 feb end */
.label {
	font-size: 11px;
	text-transform: uppercase;
	color: gray;
}

.value {
	font-weight: 700;
	color: green;
	font-size: 15px;
}

.card-title {
	font-family: "Nunito Sans", sans-serif;
	font-size: 1.4em;
	padding-left: 2px;
}


.choosebg {
	background-color: #f4f4f4;
	border: 1px solid #69c940;
}

.biocardbg img {
	width: 30%;
	height: auto;
}

.card-body p {
	margin: 0px;
}

.microcardbg img {
	width: 30%;
	height: auto;
}
/*---------------------------------h1, h2, h3, p--------------------------------------*/
h1, h2, h3, p {
	font-family: "Helvetica";
}

h1 {
	color: #102e0b;
}

p {
	font-size: 15px;
}


/*---------------------------------#cdmo-text--------------------------------------*/
#cdmo-text {
	color: #69c941;
	font-weight: bold;
	border-bottom: 4px solid #ffffff;
}

/*---------------------------------btn-success, btn-info,--------------------------------------*/
.btn-success {
	background-color: #69c941;
	border: #69c941;
}

.btn-info {
	background-color: #1C663B;
	border: #1C663B;
}

.w-70 {
	width: 70% !important;
}

.tab-pane ul {
	padding: 0px;
}

.search-box {
	width: fit-content;
	height: fit-content;
	position: relative;
}
/*---------------------------------input-search, btn-search--------------------------------------*/
.input-search {
	height: 40px;
	width: 40px;
	border-style: none;
	padding: 10px;
	font-size: 15px;
	outline: none;
	border-radius: 25px;
	transition: all 0.5s ease-in-out;
	padding-right: 40px;
	color: #000000;
}

	.input-search::placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-size: 18px;
		letter-spacing: 2px;
		font-weight: 100;
	}

.btn-search {
	width: 40px;
	height: 40px;
	border-style: none;
	font-size: 20px;
	outline: none;
	cursor: pointer;
	border-radius: 50%;
	position: absolute;
	right: 0px;
	color: #000000;
	background-color: transparent;
	pointer-events: painted;
}

	.btn-search:focus ~ .input-search {
		width: 300px;
		border-radius: 0px;
		background-color: transparent;
		border-bottom: 1px solid rgba(0, 0, 0, 0.5);
		transition: all 500ms cubic-bezier(0, 0.11, 0.35, 2);
	}

.input-search:focus {
	width: 300px;
	border-radius: 0px;
	background-color: transparent;
	border-bottom: 1px solid rgba(0, 0, 0, 0.5);
	transition: all 500ms cubic-bezier(0, 0.11, 0.35, 2);
}
/*-------------------------------------------grid box--------------------------------------*/
.mission-box {
	background-color: #e4f7d9;
	padding: 20px;
	height: 100%;
	width: 100%;
}

	.mission-box h3 {
		font-weight: bold;
	}

	.mission-box a {
		color: green;
		font-weight: bold;
		text-decoration: none;
	}
/*---------------------------footer--------------------------------*/

.footer {
	position: relative;
	padding-top: 10px;
	background: #121518;
}


	.footer .footer-blog h3,
	.footer .footer-insta h3,
	.footer .footer-tags h3,
	.footer .footer-newsletter h3 {
		position: relative;
		margin-bottom: 20px;
		padding-bottom: 10px;
		font-size: 18px;
		font-weight: 400;
		color: #ffffff;
	}

		.footer .footer-blog h3::after,
		.footer .footer-insta h3::after,
		.footer .footer-tags h3::after,
		.footer .footer-newsletter h3::after {
			position: absolute;
			content: \"\";
			width: 50px;
			height: 2px;
			left: 0;
			bottom: 0;
			background: #ffffff;
		}

	.footer .footer-blog div {
		position: relative;
		padding-left: 15px;
	}


		.footer .footer-blog div a {
			display: contents;
			margin-bottom: 5px;
			font-size: 16px;
			color: #cccccc;
		}

			.footer .footer-blog div a:hover {
				color: #0085ff;
			}

		.footer .footer-blog div p {
			color: #757575;
			font-size: 13px;
		}
/*------------------------------header-----------------------------------*/
.btn-sm-expand {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	padding: 9px 12px;
	background: #1C663B;
	color: #ffffff;
	border: 1px solid #ced4da;
	border-radius: 0.35rem;
	transition: width 0.3s ease;
	overflow: hidden;
	white-space: nowrap;
	text-decoration: none;
	width: 40px;
}

	.btn-sm-expand i {
		flex-shrink: 0;
	}

	.btn-sm-expand span {
		margin-left: 8px;
		opacity: 0;
		transition: opacity 0.3s ease;
	}

	.btn-sm-expand:hover {
		width: auto;
	}

		.btn-sm-expand:hover span {
			opacity: 1;
			color: #ffffff;
		}

.btn-sm-expandmob {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	padding: 3px 8px;
	font-size: 12px;
	;
	color: #ffffff;
	border-radius: 0.35rem;
	transition: width 0.3s ease;
	overflow: hidden;
	white-space: nowrap;
	text-decoration: none;
	width: 30px;
}

	.btn-sm-expandmob i {
		flex-shrink: 0;
	}

	.btn-sm-expandmob span {
		margin-left: 8px;
		opacity: 0;
		transition: opacity 0.3s ease;
	}

	.btn-sm-expandmob:hover {
		width: 160px;
	}

		.btn-sm-expandmob:hover span {
			opacity: 1;
			color: #ffffff;
		}

.nav-link {
	display: block;
	padding: 7px 8px;
	font-weight: 400;
	color: rgb(100, 100, 100);
	border-right: 1px solid #ccc;
	line-height: 21px;
}

.navlink {
	display: block;
	padding: 7px 8px;
	width: 100%;
	font-weight: 400;
	color: rgb(255, 255, 255);
	border: 1px solid #ccc;
	line-height: 21px;
	margin-bottom: 10px;
	background-color: #000000;
}

.bg-light {
	background-color: #f0f0f0 !important;
	overflow: hidden;
}

.btn {
	font-weight: 500;
	transition: 0.5s;
}

	.btn.btn-primary {
		color: #ffffff;
	}

.btn-sm-square {
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	font-weight: normal;
}

.text-primary {
	color: #1C663B !important;
}

.submenu {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 300px;
}

	.submenu li {
		border-bottom: 1px solid #212121;
		transition: background-color 0.3s ease;
	}

		.submenu li:last-child {
			border-bottom: none;
		}

		.submenu li a {
			display: flex;
			align-items: center;
			padding: 0px 1px;
			text-decoration: none;
			color: #ffffff;
			font-size: 13px;
			transition: color 0.3s ease;
		}

			.submenu li a i {
				margin-right: 6px;
				color: #1C663B;
				transition: transform 0.3s ease;
			}

		.submenu li:hover {
			background-color: #69c941;
			border-radius: 4px;
		}

			.submenu li:hover a {
				color: #023020; /*#1C663B;*/
			}

			.submenu li:hover i {
				transform: translateX(5px);
			}

.tab-pane li {
	list-style: none;
}

	.tab-pane li h5 {
		color: #1C663B;
		font-size: 18px;
	}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background-color: #1C663B;
}


:root {
	--color-primary: rgba(5, 249, 255, 1);
	--transition: 0.4s;
}


.base-template__wrapper {
	justify-content: flex-start;
}

header a {
	color: #fff;
	text-decoration: none;
}

a {
	text-decoration: none;
}

.novicon a {
	color: white;
	text-decoration: none;
}


.header {
	align-items: center;
	position: relative;
	/*padding: 0 20px 0 40px;*/
	background-color: rgb(16 46 11)
}

.header__logo {
	max-width: 90px;
}

.header__wrapper {
	width: 100%;
	display: flex;
	align-items: center;
}

.header__navigation-wrapper {
	display: flex;
	width: 100%;
	justify-content: space-between;
	padding-left: 0px;
}

.header__list {
	display: flex;
	align-items: center;
	gap: 28px;
	margin: 0;
	padding: 0;
}

.header__list-item {
	display: flex;
	padding: 10px 0 10px;
	margin-bottom: -20px;
	gap: 8px;
	font-size: 16px;
}

	.header__list-item > a {
		display: flex;
		align-items: center;
		gap: 8px;
		transition: var(--transition);
	}

		.header__list-item > a svg path {
			transition: var(--transition);
		}

	.header__list-item .submenu-wrapper {
		position: absolute;
		width: 100%;
		top: 100%;
		left: 0;
		padding: 30px 30px 50px 30px;
		border-radius: 0px 0px 33px 33px;
		background-color: rgba(25, 27, 36, 1);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		z-index: 1031;
		height: max-content;
		max-height: auto;
		overflow: hidden;
		transition-delay: 550ms;
	}

.header__buttons-wrapper {
	display: flex;
	align-items: center;
	gap: 30px;
	margin-left: auto;
}

.header__button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	width: max-content;
	padding: 6px 20px;
	border-radius: 100px;
	gap: 8px;
	font-size: 16px;
	font-weight: 400;
	transition: var(--transition);
}

.submenu-list__title {
	width: max-content;
	margin-bottom: 25px;
	font-size: 12px;
	text-transform: uppercase;
	color: rgba(160, 161, 165, 1);
}

.submenu-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 295px;
	padding-left: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.submenu-list {
	display: flex;
	flex-direction: column;
	gap: 19px;
	max-width: 280px;
	padding-left: 0;
}

.submenu-list__item-wrapper {
	width: 100%;
	display: flex;
	align-items: center;
	padding: 6px 16px 6px 6px;
	gap: 16px;
	border-radius: 14px;
	transition: var(--transition);
}

	.submenu-list__item-wrapper > svg {
		margin-left: auto;
		opacity: 0;
		visibility: hidden;
		transition: var(--transition);
	}

/* Laptop view - arrow right end mein */
@media (min-width: 1025px) {
	.submenu-list__item-wrapper {
		justify-content: flex-start;
		position: relative;
	}

		.submenu-list__item-wrapper > svg {
			position: absolute;
			right: 16px !important;
			top: 50%;
			transform: translateY(-50%);
			margin-left: 0;
			opacity: 0;
			visibility: hidden;
		}
}

/* Mobile view adjustments */
@media (max-width: 1024px) {
	.submenu-list__item-wrapper > svg {
		visibility: visible;
	}
}

.submenu-list__wrapper {
	position: relative;
}

.submenu-content {
	position: absolute;
	right: 0;
	top: 0;
	max-width: calc(100% - 320px);
	opacity: 0;
	visibility: hidden;
	transition: var(--transition);
	width: 100%;
	transition-delay: 550ms;
	/*	10 jan 26 scoroller*/
	max-height: 400px; /* Adjust this height as needed for your design */
	overflow-x: hidden; /* Prevents horizontal scrolling */
	overflow-y: auto; /* Enables vertical scrolling if content overflows */
	/*--------*/
}
/* Width */
::-webkit-scrollbar {
	width: 12px;
}

/* Track (background) */
::-webkit-scrollbar-track {
	background: #2e2e2e; /* dark background */
}

/* Handle (thumb) */
::-webkit-scrollbar-thumb {
	background-color: grey /* green thumb */
	border-radius: 10px;
}

	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
		background-color: #66bb6a;
	}

.submenu-list__item.has-submenu.active .submenu-content {
	opacity: 1;
	visibility: visible;
}

.submenu-list__item.has-submenu.active .submenu-list__item-wrapper {
	background-color: rgba(255, 255, 255, 0.04);
}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper > svg {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

.submenu-list__item-link {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.submenu-list__item-title {
	font-size: 16px;
	font-weight: 500;
	color: #fff;
}

.submenu-list__item-icon {
	display: flex;
}

.submenu-list__item-subtile {
	font-size: 12px;
	font-weight: 400;
	color: rgba(160, 161, 165, 1);
}

.submenu-content__title {
	width: max-content;
	margin-bottom: 25px;
	font-size: 12px;
	text-transform: uppercase;
	color: rgba(160, 161, 165, 1);
}

.submenu-content__list:not(.events) {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(5, 1fr); 
	gap: 7px;
	padding: 0;
}

.submenu-content__list.events {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	padding: 0;
}
.featured-box {
	grid-column: span 2; /* 👈 takes 2 columns (center wide box) */
}
/* Mobile view */
@media (max-width: 768px) {
	.submenu-content__list-item,
	.featured-box,
	.submenu-content__link {
		grid-column: 1 / -1 !important;
		width: 100%;
		padding:0px;
	}
}
.submenu-content__list-item {
	display: block;
	border-radius: 5px;
	background-color: rgba(255, 255, 255, 0.05);
	cursor: auto;
}

.submenu-content__link {
	display: flex;
	flex-direction: column;
	border-radius: 20px;
	padding: 10px 10px 20px;
	border: 1px solid transparent;
	transition: var(--transition);
}

.submenu-content__link-img {
	border-radius: 5px;
	overflow: hidden;
	transition: var(--transition);
}

	.submenu-content__link-img img {
		transition: 0.4s ease-in;
	}

.submenu-content__link-title {
	padding: 0 10px;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 12px;
}

.submenu-content__link-img h5 {
	padding: 0px;
	margin: 0px;
	color: #69c940;
	font-size: 16px;
}

.submenu-content__link-text {
	padding: 10px 0px;   /*27 apr 26 10px*/
	font-size: 13px;
	color: rgba(160, 161, 165, 1);
}

	.submenu-content__link-text ul {
		padding: 0px;
		margin: 0px;
		color: #fff;
	}

		.submenu-content__link-text ul li, .submenu-content__link-text ul li ul li {
			padding: 0px;
			margin: 0px;
			color: #fff;
			list-style: none;
		}

.submenu-content__link-wrapper {
	display: flex;
	gap: 20px;
	padding: 10px;
	border-radius: 20px;
	background-color: rgba(255, 255, 255, 0.05);
}

.submenu-content__list.events .submenu-content__link-img {
	width: 100%;
	max-width: 220px;
	flex: 1;
	border-radius: 13px;
	margin-bottom: 0;
}

.submenu-content__info {
	display: flex;
	flex-direction: column;
	flex: 1 0;
}

.submenu-content__category {
	display: flex;
	align-items: center;
	gap: 10px;
	width: max-content;
	padding: 10px 20px;
	margin-bottom: 20px;
	border-radius: 30px;
	font-size: 12px;
	font-weight: 500;
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: rgba(255, 255, 255, 0.7);
}

.submenu-content__list.events .submenu-content__link-title,
.submenu-content__list.events .submenu-content__link-text {
	padding: 0;
	margin-bottom: 12px;
}

.submenu-content__link-address,
.submenu-content__link-date {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 12px;
	font-size: 12px;
	font-weight: 400;
	color: rgba(160, 161, 165, 1);
}

	.submenu-content__link-address span,
	.submenu-content__link-date span {
		line-height: 0.9;
	}

.submenu-content__url {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	margin-bottom: 20px;
	color: rgba(255, 255, 255, 1);
	font-size: 14px;
	transition: var(--transition);
}

svg,
svg path {
	transition: var(--transition);
}


.header__burger {
	display: none;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	width: 24px;
	margin-left: auto;
}

	.header__burger i {
		width: 100%;
		height: 2px;
		background-color: #fff;
		border-radius: 13px;
		transition: var(--transition);
	}

	.header__burger.active i:nth-child(1) {
		transform: rotate(45deg) translate(4px, 4px);
	}

	.header__burger.active i:nth-child(2) {
		opacity: 0;
	}

	.header__burger.active i:nth-child(3) {
		transform: rotate(-45deg) translate(4px, -5px);
	}

@media (hover: hover) and (pointer: fine) {
	.header__list-item:hover .submenu-wrapper {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	.header__list-item:hover ~ .header__list-item .submenu-wrapper {
		display: none;
	}

	.header__list-item:hover > a,
	.header__list-item:hover > a svg path {
		color: var(--color-primary);
		fill: var(--color-primary);
	}

	.header__button:hover {
		background-color: rgba(255, 255, 255, 0.05);
	}

	.submenu-list__item.has-submenu:hover .submenu-list__item-wrapper {
		background-color: rgba(255, 255, 255, 0.04);
	}

		.submenu-list__item.has-submenu:hover .submenu-content,
		.submenu-list__item.has-submenu:hover .submenu-list__item-wrapper > svg {
			opacity: 1;
			visibility: visible;
			pointer-events: auto;
		}

	.submenu-content__list-item:hover .submenu-content__link {
		border-color: rgba(255, 255, 255, 0.3);
	}

	.submenu-content__list-item:hover .submenu-content__link-img img {
		transform: scale(1.05);
	}

	.submenu-content__url:hover,
	.submenu-content__url:hover svg path {
		color: var(--color-primary);
		stroke: var(--color-primary);
	}

		.submenu-content__url:hover svg {
			transform: translateX(5px);
		}
}

@media screen and (max-width: 1280px) {
	.header__navigation-wrapper {
		padding-left: 25px;
	}

	.submenu-list {
		max-width: 250px;
	}

	.submenu-content {
		max-width: calc(100% - 270px);
	}

	.submenu-content__url {
		margin-bottom: 0;
	}
}

@media screen and (max-width: 1024px) {
	.base-template__wrapper {
		max-height: 105vh;
	}

	.searchform {
		margin: 10px 6px;
	}

	ul.nav.justify-content-end.mt-2 {
		margin-top: 0px !important;
	}

	.header {
		padding: 16px 14px;
	}

	.header__burger {
		display: flex;
	}

	.header__navigation-wrapper {
		flex-direction: column;
		align-items: center;
		position: absolute;
		top: 100%;
		left: 0;
		padding: 20px;
		background-color: rgba(25, 27, 36, 1);
		border-radius: 0px 0px 33px 33px;
		opacity: 0;
		visibility: hidden;
		transition: var(--transition);
	}

		.header__navigation-wrapper.open {
			opacity: 1;
			visibility: visible;
			padding-bottom: 100px;
		}

	.header__list {
		flex-direction: column;
		gap: 30px;
	}

	.header__buttons-wrapper {
		flex-direction: column;
		margin-left: unset;
		margin-top: 50px;
		gap: 8px;
	}

	.header__navigation,
	.header__list {
		width: 100%;
	}

	.header__list-item {
		flex-direction: column;
		width: 100%;
		padding: 0;
		gap: 0;
		margin: 0;
	}

		.header__list-item.active a,
		.header__list-item.active a > svg path {
			fill: var(--color-primary);
			color: var(--color-primary);
		}

		.header__list-item .submenu-wrapper {
			position: static;
			padding: 0;
			max-height: 0;
			border-radius: 0;
			opacity: 1;
			visibility: visible;
			pointer-events: all;
			overflow: hidden;
			transition: max-height var(--transition);
		}

	.submenu-list {
		width: 100%;
		max-width: 100%;
		gap: 5px;
	}

	.submenu-list__wrapper {
		margin-top: 30px;
		display: flex;
		flex-direction: column;
	}

	.submenu-list__item {
		width: 100%;
		padding: 0;
		margin: 0;
	}

		.submenu-list__item:active .submenu-list__item-wrapper {
			background-color: rgba(255, 255, 255, 0.04);
		}

			.submenu-list__item:active .submenu-list__item-wrapper > svg {
				opacity: 1;
				visibility: visible;
			}

	.submenu-list__title {
		display: none;
	}

	.submenu-content {
		position: static;
		right: auto;
		top: auto;
		max-width: 100%;
		width: 100%;
		margin-top: 20px;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		overflow: hidden;
		max-height: 0;
	}

	.header__button {
		border: 1px solid rgba(255, 255, 255, 1);
	}
}

@media screen and (max-width: 1024px) {
	.submenu-list__item:active .submenu-list__item-wrapper {
		background-color: rgba(255, 255, 255, 0.04);
	}
}

.submenu-list__item-wrapper > svg {
	margin-left: inherit !important;
}

@media (width:768px) {
	li.nav-item a.btn {
		font-size: 12px;
		padding: 9px 4px;
	}

	.detection-accordi {
		display: flex;
		flex-wrap: wrap !important;
	}
}

@media screen and (max-width: 767.9px) {
	.header__buttons-wrapper,
	.header__button {
		width: 100%;
	}


	.lftmenu {
		left: 0%;
	}

	.submenu-content__list:not(.events) {
		grid-template-columns: repeat(1, 1fr);
	}
}

/*------------------------------searchform-----------------------------------*/
.searchform {
	height: 46px;
	border: 1px solid rgba(79, 79, 79, 0.889);
	overflow: hidden;
	border-radius: 50px;
}

	.searchform .form-control {
		width: calc(100% - 46px);
		border: none;
		background: #fff !important;
		color: rgba(0, 0, 0, 0.7) !important;
		font-size: 14px;
	}

		.searchform .form-control::-webkit-input-placeholder {
			color: rgba(0, 0, 0, 0.7) !important;
		}

		.searchform .form-control::-moz-placeholder {
			color: rgba(0, 0, 0, 0.7) !important;
		}

		.searchform .form-control:-ms-input-placeholder {
			color: rgba(0, 0, 0, 0.7) !important;
		}

		.searchform .form-control:-moz-placeholder {
			color: rgba(0, 0, 0, 0.7) !important;
		}

	.searchform .search {
		width: 46px;
		height: 46px;
	}

		.searchform .search span {
			font-size: 18px;
		}

/*.oligo-bg-icon {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 220px;
	opacity: 0.2;
	pointer-events: none;
}
*/
.novicon {
	display: none;
}

@media only screen and (max-width: 600px) {
	.btn-sm-expandmob {
		padding: 12px 0px;
		font-size: 16px;
	}

	.submenu-content {
		padding: 8px !important;
		margin: 10px auto !important;
	}

	.submenu-content__link-img {
		padding: 10px 12px !important;
	}

		.submenu-content__link-img h5 {
			font-size: 16px !important;
		}

	.submenu a {
		font-size: 15px !important;
	}

	.submenu-list__item-wrapper {
		display: flex;
		align-items: start;
	}

	.submenu-content {
		padding: 0px !important;
		margin: 64px 0px 0px -100% !important;
		position: relative;
		left: 0% !important;
	}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper {
		background-color: unset;
	}

	.submenu-content__link-text ul li, .submenu-content__link-text ul li ul li {
		padding: 10px 6px;
	}

	.header__navigation-wrapper.open {
		z-index: 1;
	}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper > svg {
		margin-top: 6px;
		transform: rotate(90deg);
		transition: transform 0.3s ease;
	}

	.searchform {
		height: 40px;
		border-radius: 50px;
	}

	.form-control {
		height: 40px !important;
	}

	a.navbar-brand.d-flex.align-items-center {
		margin: 0px;
		padding-top: 12px;
	}

	section.header {
		display: flex;
		justify-content: space-between;
	}

	.novicon {
		color: #fff;
		font-size: 16px;
	}

		.novicon i.fa.fa-phone {
			transform: rotate(100deg);
			transition: transform 0.3s ease;
			font-size: 12px;
			padding-inline: 5px;
		}

	.novicon {
		display: block;
	}

	.col-md-5.col-12.justify-content-end.text-end.offset-md-1 {
		padding-bottom: 3px;
	}

	.d-flex
	Specificity {
		display: flex !important;
		flex-direction: column;
	}
}

/* responsive for tablet */

@media (min-width: 768px) and (max-width: 1024px) {
	.submenu-content__list:not(.events) {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}

	.submenu-list__item-wrapper {
		width: 100%;
		display: flex;
		align-items: start !important;
	}

	.submenu-content {
		padding: 0px !important;
		margin: 60px 0px 0px -100% !important;
		position: relative;
	}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper {
		background-color: unset;
	}

	.submenu-content__link-text ul li, .submenu-content__link-text ul li ul li {
		padding: 10px 6px;
	}

	.submenu-content__link-img h5 {
		font-size: 16px;
	}

	.header__navigation-wrapper.open {
		z-index: 1;
	}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper > svg {
		margin-top: 6px;
		transform: rotate(90deg);
		transition: transform 0.3s ease;
	}

	.searchform {
		height: 40px;
		border-radius: 50px;
	}

	.form-control {
		height: 40px !important;
	}

	a.navbar-brand.d-flex.align-items-center {
		margin: 0px;
		padding-top: 12px;
	}

	section.header {
		display: flex;
		justify-content: space-between;
	}

	.novicon {
		color: #fff;
		font-size: 16px;
	}

		.novicon i.fa.fa-phone {
			transform: rotate(100deg);
			transition: transform 0.3s ease;
		}

	.novicon {
		display: block;
	}
}


@media(max-width:767px) {
	ul.header__list a {
		color: #000000;
	}

	.header__list-item.active a, .header__list-item.active a > svg path {
		fill: rgb(28 102 59);
		color: rgb(28 102 59);
	}

	.header__navigation-wrapper {
		background-color: rgb(255, 255, 255);
	}

	.header__buttons-wrapper .header__button {
		border: 1px solid rgb(28 102 59);
		color: rgb(28 102 59);
		fill: rgb(28 102 59);
	}

		.header__buttons-wrapper .header__button:hover {
			background: rgb(28 102 59);
			color: #fff;
		}

	.lftmenu {
		left: 0%;
	}

	.submenu-list__item {
		display: flex;
		margin-right: -100px;
		padding-bottom: 2px;
		cursor: pointer
	}

	.header__buttons-wrapper a, svg {
		color: #1C663B;
		fill: #1C663B;
	}

	.submenu-list__item.has-submenu.active .submenu-list__item-wrapper > svg {
		color: #000;
		fill: #000 !important;
	}

	.header__list-item .submenu-wrapper {
		background: unset;
	}

	ul.submenu-list {
		background: none !important;
	}

	.submenu-list__item-title {
		color: #000000;
	}

	.submenu-content__link {
		border: 1px solid #69c940;
		padding:0px;
	}

	.submenu-list__item-wrapper svg path {
		stroke: #000 !important;
	}

	li.header__list-item.has-submenu svg path {
		stroke: #000 !important;
	}

	.header__buttons-wrapper a.header__button.text-end svg path {
		stroke: rgb(28 102 59) !important;
		fill: rgb(28 102 59);
	}

	a.header__button.text-end:hover svg path {
		stroke: #fff !important;
		fill: #fff;
	}
}


@media (min-width:768px) and (max-width:1024px) {
	.submenu-list {
		background: unset !important;
	}

	.lftmenu {
		left: 0%;
	}
}

.submenu-list__item {
	display: flex;
	cursor: pointer;
}

.lftmenu {
	left: 24%;
}

.contact-item {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
}

.contact-icon {
	color: limegreen;
	font-size: 24px;
	margin-right: 5px;
	width: 30px;
	flex-shrink: 0;
	text-align: center;
}

.contact-text {
	margin-left: 12px;
	font-size: 16px;
	line-height: 2.4;
}

@media (min-width:1025px) and (max-width:2560px) {
	ul#company-submenu-list {
		min-height: 400px;
	}

	#company-submenu-wrapper {
		height: 460px;
	}

	.submenu-content.lftmenu {
		background-image: url(../images/mega-background.jpg);
		min-height: 400px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top;
	}

	.submenu-content.resources-submenu-content {
		background-image: url(../images/mega-background.jpg);
		min-height: 370px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top;
	}

	/*.submenu-content {
		background-image: url(../images/mega-background.jpg);
		min-height: 466px;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top;
	}*/
	/*23 feb start*/
	.submenu-content {
		min-height: 466px;
		background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)), url(../images/mega-background.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	/*23 feb end*/
}


@media (max-width:1024px) {
	.lftmenu {
		left: 0%;
	}
}

.oligo-main-subhead {
	padding: 6px 10px;
	background: #69c941;
	border-radius: 4px;
	margin-bottom: 5px;
	line-height: 1.1;
	width: max-content;
}

	.oligo-main-subhead:hover {
		background: #157347;
	}

	.oligo-main-subhead a {
		color: #fff !important;
		font-size: 14px;
	}

.oligo-services-note {
	color: #000;
	margin-top: 10px;
}

.oligo-services-note {
	background-color: #f8f9fa;
	border-left: 4px solid #28a745;
	padding: 8px 8px;
	display: flex;
	align-items: start;
	font-size: 1rem;
}

	.oligo-services-note i {
		margin-top: 5px;
	}


@media (min-width: 1200px) {
	.h1, h1 {
		font-size: 2.0rem;
		font-weight: bold;
	}

	.h2, h2 {
		font-size: 2.0rem;
	}
}

/*------------------------------breadcumb-----------------------------------*/
.breadcumb {
	color: #53b728;
	font-weight: 500;
	padding: 7px;
	transition: color 0.3s ease;
}

	.breadcumb:hover {
		color: green;
	}


.breadcrumb a {
	text-decoration: none;
	color: green;
	margin-right: 8px;
	position: relative;
}

	.breadcrumb a::after {
		margin-left: 8px;
		color: #666;
	}

.breadcrumb span {
	color: #555;
	font-weight: 500;
}

.breadcrumb a:hover {
	text-decoration: underline;
	color: black;
}

.check {
	color: green;
	font-weight: bold;
}

/*------------------------------accordion-----------------------------------*/
.accordion {
	border: solid 1px lightgray;
}

	.accordion .accordion-item1 {
		padding: 1px 0;
	}

.accordion-body h5 {
	font-size: 14px;
	margin: 0 0 6px;
	color: #214b32;
	text-transform: uppercase;
	letter-spacing: .02em;
}

.accordion-header {
	font-weight: bold;
	color: black;
	padding-bottom: 2px;
}
/*------------------------------06 jan-----------------------------------*/
.content h5 {
	font-size: 14px;
	margin: 0 0 6px;
	text-transform: uppercase;
	letter-spacing: .02em;
	font-weight: bolder;
}

.note.d-grid {
	display: grid;
	grid-template-columns: 1fr 36px 1fr 36px 1fr;
	align-items: center;
	gap: 8px;
}

@media (max-width: 576px) {

	.note.d-grid {
		grid-template-columns: 1fr !important;
	}

		.note.d-grid > div:nth-child(2),
		.note.d-grid > div:nth-child(4) {
			/*transform: rotate(90deg);*/
			justify-content: center;
		}

		.note.d-grid .rounded-pill {
			font-size: 14px;
			padding: 10px;
			white-space: normal;
			text-align: center;
		}
}

.menuitems {
	display: block;
	text-decoration: none;
	color: #2f9c2f;
	transition: background-color 0.3s, color 0.3s;
	padding-bottom: 2px;
}

	.menuitems:hover {
		background-color: #e6f4e6;
		color: #1b6e1b;
		font-weight: bold;
		text-decoration: none;
		padding-left: 10px;
		padding-bottom: 2px;
	}

.accordion .accordion-item1 {
	line-height: 1.1;
	padding-left: 5px;
}

.menuitems.active {
	background-color: #cce5cc;
	font-weight: bold;
	color: #145214;
	padding-bottom: 2px;
}

.text {
	color: #004000;
}

.capability-card {
	border: 1px solid #4CAF50;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	margin-left: 10px;
	width: 95%;
	margin-bottom: 20px;
	padding: 0;
	background: #fff;
	transition: transform 0.3s ease;
}

	.capability-header, .capability-card:hover {
		background: #d7fecf;
	}

.capability-header {
	background: linear-gradient(90deg, #4CAF50, #2E7D32);
	color: #fff;
	text-align: center;
	font-size: 1.2rem;
	font-weight: bold;
	padding: 2px;
	border-radius: 10px 10px 0 0;
}

@media (max-width: 600px) {
	.a {
		padding-top: 25px;
	}

	.c {
		margin-left: 0px !important;
	}
}

/*----------card image------------*/
.card_img {
	width: 60px;
	height: 60px;
}

.logo_img {
	width: 250px;
}

Select {
	width: 300px;
	padding: 5px;
	margin-top: 5px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background-color: #f9f9f9;
	transition: border-color 0.3s;
}

	select:focus {
		border-color: #28a745;
		outline: none;
	}

.selected-option {
	background-color: #d4edda !important;
	color: #155724;
}

.submenu-item {
	cursor: pointer;
	padding: 5px 15px;
}

	.submenu-item:hover {
		background-color: #f8f9fa;
	}

.active-menu {
	font-weight: bold;
	color: #4db827;
}

/*.breadcumb {
	color: #53b728;
	font-weight: 500;
	padding: 7px;
}
*/
.accordion-button {
	background-color: #b4e5a2;
}

	.accordion-button:not(.collapsed) {
		background-color: #b4e5a2;
	}

/*.breadcumb {
	color: #53b728;
	font-weight: 500;
	padding: 7px;
}*/

.d-flex.oligomodification {
	display: block !important;
	line-height: 2;
}

.card:hover .card-body a {
	font-size: 1em;
	color: #53b728;
}

.card .card-body a {
	font-size: 1em;
	color: #000;
}

/*.oligo-bg-icon {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	opacity: 0.3;
	pointer-events: none;
}

@media (max-width:767px) {
	.has-submenu.active .submenu-wrapper .oligo-bg-icon {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 100%;
		height: auto;
		opacity: 0.3;
		pointer-events: none;
	}
}*/
.oligo-bg-icon {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	opacity: 0.3;
	pointer-events: none;
}

@media (max-width: 768px) {
	.oligo-bg-icon {
		width: 220px;
		height: auto;
		opacity: 0.2;
	}
}

.sub-description-index p {
	font-size: 20px;
}


.feature-section {
	position: relative;
}

.curve-arrow {
	position: absolute;
	top: 580px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 1250px;
	z-index: 2;
	pointer-events: none;
}

@media (max-width: 768px) {
	.curve-arrow {
		display: none;
	}

	.tqm {
		display: none;
	}
}

/*----------details, summary------------*/
details {
	border: 1px solid var(--bs-border);
	border-radius: 8px;
	background: #fff;
	margin-bottom: 6px;
	border: solid 1px lightgray;
}

summary {
	cursor: pointer;
	padding: 6px 16px;
	font-weight: 700;
	color: var(--bs-green);
	list-style: none;
}

	summary::marker, summary::-webkit-details-marker {
		display: none;
	}

	summary::before {
		content: '\25B6';
		display: inline-block;
		margin-right: 8px;
		transition: transform 0.2s ease;
	}

details[open] summary::before {
	transform: rotate(90deg);
}

details .content {
	padding: 0 16px 16px;
	color: var(--bs-ink-soft);
}

.faqdetails {
	border: 1px solid lightgray;
	border-radius: 8px;
	background: #fff;
	margin-bottom: 12px;
	padding: 10px;
	max-width: 100%;
	width: 100%;
	overflow-x: auto;
	box-sizing: border-box;
}

/* Mobile optimization */
@media (max-width: 768px) {
	.faqdetails {
		font-size: 14px;
		padding: 8px;
		border-radius: 6px;
		width: 75%;
	}

		.faqdetails summary {
			font-size: 15px;
			font-weight: 600;
		}
}

.bg-light-green {
	background-color: #d7fecf;
}

/* ====== DETAILS/FAQ ===== */
.icon {
	width: 28px;
	height: 28px;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	top: -3px;
}

.stroke {
	stroke: var(--bs-green);
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round
}

/* ====== DETAILS/FAQ =====Form CSS */
.checks {
	display: flex;
	flex-wrap: wrap;
	gap: 10px
}

	.checks label {
		display: flex;
		align-items: center;
		gap: 6px
	}

summary {
	cursor: pointer;
}

/*----------toTopBtn------------*/
#toTopBtn {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 1;
}
/*----------pill------------*/
.pill {
	display: inline-block;
	padding: 2px 8px;
	border: 1px solid #dfe9ff;
	border-radius: 999px;
	background: #f7fbff;
	margin-bottom: 10px;
	margin-right: 5px;
	font-size: .78rem
}

.risk-pill {
	display: inline-block;
	margin-top: 6px;
	padding: 3px 8px;
	border-radius: 999px;
	background: #fff4e8;
	border: 1px solid #f3d2a7;
	color: #8a4b00;
	font-size: 12px;
	font-weight: 700;
}
.header-bgcolor {
	background: linear-gradient(135deg, #0a5f24 0%, #1d7a34 40%, #4caf50 100%);
	padding-top: 50px;
	padding-bottom: 50px;
	color: white;
}

	.header-bgcolor h1 {
		font-size: 3.2em;
		color: rgb(255, 255, 255);
	}

	.header-bgcolor p {
		line-height: 30px;
		font-size: 20px;
		color: #e9f6e7;
		text-shadow: 1px 1px 3px rgb(0 0 0 / 79%);
	}

@media(max-width:768px) {
	.header-bgcolor h1 {
		font-size: 2em !important;
		color: rgb(255, 255, 255);
	}
}

/*---------theme-btn, theme-green-btn, custom-btn filled & outline, badge-success-custom-------------*/
.theme-btn {
	background-color: #f5f5f5;
	color: #000;
	border: 1px solid lightgray;
	border-radius: 0.375rem;
	padding: 0.375rem 0.75rem;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
	text-decoration: none;
}

	.theme-btn:hover,
	.theme-btn.active {
		background-color: #e0e0e0;
		color: #000;
		border: 1px solid lightgray;
	}


/* Theme button */
.theme-green-btn {
	background-color: #69c941;
	color: white;
	border: 1px solid lightgray;
	border-radius: 0.375rem;
	padding: 0.375rem 0.75rem;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
	text-decoration: none;
	display: inline-block;
	border-radius: 5px;
	transition: 0.2s;
	font-weight: 300;
}

	.theme-green-btn:hover,
	.theme-green-btn.active {
		background: #157347;
		color: #fff;
		border-color: #157347;
	}


/* Filled and Outline button */
.custom-btn {
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 0.4em 1em;
	text-decoration: none;
	display: inline-block;
	border-radius: 5px;
	transition: 0.2s;
	font-weight: 300;
}

	/* Filled button */
	.custom-btn.filled {
		background: #69c941;
		border: 1px solid #69c941;
		color: #fff;
	}

	/* Outline button */
	.custom-btn.outline {
		background: #fff;
		color: #157347;
		border: 1px solid #157347;
	}

		/* Hover for both */
		.custom-btn.filled:hover,
		.custom-btn.outline:hover {
			background: #157347;
			color: #fff;
			border-color: #157347;
		}

.badge-success-custom {
	display: inline-block;
	padding: 0.5rem 1rem;
	border: 1px solid #dfe9ff;
	border-radius: 999px;
	background-color: #198754;
	color: #fff;
	margin-bottom: 10px;
	margin-right: 5px;
	font-size: 0.78rem;
}

	.badge-success-custom a {
		color: white;
	}

		.badge-success-custom a:hover {
			
			text-decoration: underline;
		}


/*---------text-imp-------------*/
.text-imp {
	color: green;
	font: bold;
}

.a:hover {
	text-decoration: underline;
}

/*---------header-fixed-------------*/
.header-fixed {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1050;
	background-color: #fff;
}

@media screen and (max-width: 1024px) {
	.header__navigation-wrapper {
		max-height: 80vh;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.submenu-wrapper {
		max-height: 70vh;
		overflow-y: auto;
	}
}

/*---------note, notes, note-border, note-imp-------------*/
.note {
	background: #fbfdfb;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 14px;
}

.note-green {
	background-color: #f0fbf4;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 15px 20px;
	margin-bottom: 15px;
	transition: all 0.3s ease-in-out;
}
.note-border-top {
	background: #f6fcf8;
	padding: 16px;
	border-radius: 12px;
	border: 1px solid #e2efe6;
	border-top: 4px solid #1f7a3a;
	box-shadow: 0 2px 6px rgba(0,0,0,0.04);
	transition: all 0.2s ease;
}

	.note-border-top p {
		color: #3b5a47;
		line-height: 1.4;
		font-weight: bold;
	}

.notes {
	border-left: 3px solid green;
	background: #f0fdf4;
	padding: 12px;
	border-radius: 10px;
	margin-top: 10px
}

.notes-border {
	border-left: 4px solid green;
	background: #f0fdf4;
	padding: 12px;
	border-radius: 10px;
	margin-top: 10px;
	border-right: 1px solid #e6ece7;
	border-top: 1px solid #e6ece7;
	border-bottom: 1px solid #e6ece7;
}

.note-border {
	background: #fbfdfb;
	border: 1px solid #B1DC98;
	border-radius: 12px;
	padding: 14px;
}

.note-imp {
	font-family: Arial, sans-serif;
	background: #f5f7f5;
	flex-wrap: wrap;
	background: #fbfdfb;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	padding: 8px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

	.note-imp::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		width: 40px;
		height: 100%;
		background: linear-gradient(to left, rgba(0,128,0,0.15), transparent);
		pointer-events: none;
	}

/*---------table-search-------------*/
.table-search {
	width: 280px;
	max-width: 100%;
	padding: 8px 10px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	font-size: .95rem
}

.dot {
	display: inline-grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #fff;
	border: 3px solid #1E5631;
	box-shadow: 0 6px 18px rgba(0,0,0,.08);
	font-weight: 800;
	color: #1E5631;
	margin: 0 auto 8px
}

.icons {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: inline-grid;
	place-items: center;
	background: linear-gradient(120deg,#1E5631,#4A913C);
	color: #fff;
	font-weight: 800;
	margin-right: 4px;
}

/*---------tag, tag-green, chip, chips, chips-imp, chips-imp-outline-------------*/
.tag {
	background: #eef7fc;
	color: #095b7d;
	border: 1px solid #d4ecfb;
	padding: .35rem .55rem;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: bold;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.tag-green {
	background: #e8f7ee;
	color: #03624b;
	border: 1px solid #B1DC98;
	padding: .35rem .55rem;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: bold;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
}
	.tag-green a {
		color: #03624b;
	}

		.tag-green a:hover {
			text-decoration: underline;
		}

.chip {
	display: inline-block;
	border: 1px solid #e6eee8;
	border-radius: 999px;
	padding: 6px 10px;
	background: #fff;
	font-weight: 700;
	color: green;
	cursor: pointer;
}

	.chip.active {
		background: #f3faf4;
		border-color: #1E5631;
		color: #1E5631;
	}

.chips {
	background: #eef7f1;
	color: #104b2e;
	border: 1px solid #d8efe2;
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 14px;
	white-space: nowrap;
	font-weight: bold;
}

.chips-imp {
	background: #eef7f1;
	color: black;
	border: 1px solid #d8efe2;
	padding: 6px 16px;
	border-radius: 10px;
	font-size: 14px;
	white-space: nowrap;
	margin-top: 6px;
	font-weight: bold;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.4;
	transition: all 0.2s ease;
}

	.chips-imp:hover {
		border: 1px solid #104b2e;
		cursor: pointer;
		background: #eaf3ee;
	}

.chips-imp-outline {
	color: black;
	border: 1px solid #d8efe2;
	padding: 6px 16px;
	border-radius: 10px;
	font-size: 14px;
	white-space: nowrap;
	margin-top: 6px;
	font-weight: bold;
	background: #eef7f1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.4;
	transition: all 0.2s ease;
	text-decoration: none;
}

	.chips-imp-outline:hover {
		background: black;
		color: #ffffff;
	}
/*---------num, stat-pill, step-------------*/
.num {
	display: flex;
	align-items: baseline;
	gap: 8px;
	line-height: 1;
	font-weight: 900;
	font-size: 28px;
	letter-spacing: -.01em;
	color: green;
}

.stat-pill {
	background: #eef7fc;
	color: #095b7d;
	border: 1px solid #d4ecfb;
	padding: .35rem .55rem;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: bold;
}

.step {
	position: relative;
}

	.step:not(:last-child)::after {
		content: "→";
		position: absolute;
		top: 0px;
		right: -30px;
		font-size: 38px;
		color: #1E5631;
		font-weight: bolder;
	}

/* Mobile (↓ arrow, centered) */
@media (max-width: 768px) {
	.step {
		width: 100%;
		margin-bottom: 40px;
	}

		.step:not(:last-child)::after {
			display: none;
			content: "↓";
			position: absolute;
			top: auto;
			bottom: -28px;
			left: 50%;
			right: auto;
			transform: translateX(-50%);
			font-size: 22px;
			color: #1E5631;
			font-weight: bold;
		}
}

.step .label {
	font-weight: 700;
	color: #10301b;
}

/*---------Accordion-------------*/
.accordion-item {
	border-radius: 15px;
	overflow: hidden;
	margin-bottom: 1rem;
}

.accordion-button {
	border: none;
	background-color: transparent !important;
	border-radius: 0;
	box-shadow: none;
	padding: 1rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

	.accordion-button::after {
		position: static;
		margin-left: auto;
		transition: transform 0.3s ease;
	}

	.accordion-button:not(.collapsed)::after {
		transform: rotate(-90deg);
	}

	.accordion-button:focus {
		box-shadow: none;
	}

.accordion-collapse .accordion-body:last-child {
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

/*---------label, sub-------------*/
.step .label {
	font-weight: bold;
	color: #10301b;
	font-size: 14px;
}

.step .sub {
	font-size: .9rem;
	color: #4c5b54;
	margin-top: 2px;
}

/* ===== Text Icon ===== */
.text-icon {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: linear-gradient(135deg, #00B050, #4A913C);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 16px rgba(0, 176, 80, .25);
	border: 2px solid #e6eee8;
	margin-bottom: 8px;
	color: white;
}

.arrow-right {
	width: 18px;
	height: 18px;
	border-top: 3px solid #00B050;
	border-right: 3px solid #00B050;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	right: -6px;
	margin-top: -20px;
}

.cards .col-lg-3:last-child .arrow-right {
	display: none;
}

@media (max-width: 992px) {
	.cards .col-lg-3 {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.arrow-right {
		display: none;
	}
}

.cards .col-12 {
	margin-bottom: 15px;
}

.track {
	position: relative;
}

	.track::before {
		content: '';
		position: absolute;
		top: 50%;
		left: 5%;
		right: 5%;
		height: 3px;
		background-color: #d9f0e5;
		z-index: 0;
		transform: translateY(-50%);
		border-radius: 2px;
	}

.circle {
	width: 25px;
	height: 25px;
	background-color: #00b050;
	border-radius: 50%;
	text-align: center;
	line-height: 24px;
	font-weight: bold;
	z-index: 1;
	position: relative;
	color: white;
}

	.circle.active {
		background-color: #1e5631;
		color: white;
	}

.bottom-left-link {
	position: fixed;
	bottom: 15px;
	left: 15px;
	background: #198754;
	color: white;
	padding: 10px 15px;
	border-radius: 8px;
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2);
	transition: 0.1s;
	scroll-behavior: smooth;
}

	.bottom-left-link:hover {
		background: #145c32;
	}

.fab {
	position: fixed;
	right: 15px;
	bottom: 15px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	z-index: 50;
}

	.fab a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		border-radius: 10px;
		background: green;
		color: #fff;
		text-decoration: none;
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
	}

		.fab a.secondary {
			background: #0f172a;
			color: #fff !important;
		}

		.fab a svg {
			fill: #fff !important;
		}

@media (max-width: 400px) {
	.fab a {
		width: 40px;
		height: 40px;
	}
}

.big {
	font-weight: 700;
	font-size: 1.2rem;
	color: #1e5631;
}

.node {
	filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .12));
}

.tag-box {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	fill: #5b6b64;
}

.title-box {
	font-size: 16px;
	font-weight: 700;
	fill: #1e5631;
}

.sub-box {
	font-size: 12px;
	font-weight: 500;
}

.floating-icons {
	position: fixed;
	bottom: 20px;
	right: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	z-index: 1000;
}

#upBtn {
	display: none;
}

#msgBtn,
#upBtn {
	width: 45px;
	height: 45px;
	align-items: center;
	justify-content: center;
}

	#msgBtn svg,
	#upBtn svg {
		pointer-events: none;
	}

.cta-banner {
	background: linear-gradient(180deg, #e8f7ee, #eafcf2);
	border: 1px solid #B1DC98;
	border-radius: 12px;
	padding: 20px;
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease-in-out;
}

.searchform .form-control {
	border: none !important;
	background: #fff !important;
	height: 46px !important;
}

.searchform input.form-control {
	border-radius: 50px 0 0 50px !important;
}

.searchform .form-control.search {
	border-radius: 0 50px 50px 0 !important;
}

.header_right:hover {
	color: var(--color-primary);
}
/* 06 jan */
#refs .list li {
	font-size: 14px;
	color: #4b5563;
	line-height: 1.5;
}

#refs li {
	font-size: 14px;
	color: #4b5563; /* muted gray tone */
	line-height: 1.5;
}

#refs h3 {
	font-size: 24px;
}
/*	14 Nov*/
@media (max-width: 700px) {
	.d-grid[style] {
		grid-template-columns: 1fr !important;
	}

	.d-grid svg {
		transform: rotate(90deg);
	}
}

.fw-normal {
	font-size: 13px;
}

.list li::marker {
	color: green;
}
/*####----18 nov 25*/
.scheme, .scheme.capsules {
	margin: 12px 0 22px !important;
}

	.scheme.capsules {
		display: grid;
		grid-template-columns: 1fr 30px 1fr 30px 1.2fr;
		gap: 2px;
		align-items: center;
		border: 1px solid #e6ece7;
		border-radius: 14px;
		padding: 10px;
		background: linear-gradient(180deg, #fbfefc, #ffffff);
	}

@media (max-width: 700px) {
	.scheme.capsules {
		grid-template-columns: 1fr;
		grid-template-rows: auto !important;
		padding: 10px;
	}

	.cap-arrow svg {
		transform: rotate(90deg);
	}
}

@media (max-width: 768px) {
	.grid-layout {
		grid-template-columns: 1fr !important;
		grid-template-rows: auto !important;
	}
}

.cap-pill.carrier {
	background: linear-gradient(180deg, #e9f9ef, #d8f2e3);
}

.cap-pill {
	border-radius: 999px;
	padding: 10px 14px;
	font-weight: 800;
	text-align: center;
	color: #0f2a1b;
	border: 1px solid rgba(16, 75, 46, .12);
	box-shadow: 0 6px 14px rgba(0, 0, 0, .06), inset 0 0 0 1px rgba(255, 255, 255, .4);
}

	.cap-pill.linker {
		background: linear-gradient(180deg, #fff4d8, #ffe7a8);
		border-color: rgba(171, 126, 0, .25);
	}

	.cap-pill.payload {
		background: linear-gradient(180deg, #efe9ff, #e0d2ff);
		border-color: rgba(91, 45, 201, .25);
	}

.cap-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

	.cap-arrow svg {
		width: 26px;
		height: 26px;
		stroke: #1a6b3e;
		stroke-width: 2;
		fill: none;
		opacity: .9;
	}
/*07 may 2026*/
.checklist,
.diamond {
	padding: 0;
	list-style: none;
}

	.checklist li,
	.diamond li {
		position: relative;
		padding-left: 22px;
		color: var(--muted);
	}

		/* Checklist icon */
		.checklist li::before {
			content: "✓";
			position: absolute;
			left: 0;
			font-weight: 900;
			color: green;
		}

		/* Diamond icon */
		.diamond li::before {
			content: "";
			position: absolute;
			left: 0;
			top: 50%;
			width: 10px;
			height: 10px;
			background: #00B050;
			transform: translateY(-50%) rotate(45deg);
			border-radius: 1px;
		}
/*
.checklist {
	padding: 0;
	list-style: none;
}

	.checklist li {
		padding-left: 22px;
		position: relative;
		color: var(--muted)
	}

		.checklist li:before {
			content: "✓";
			position: absolute;
			left: 0;
			font-weight: 900;
			color: green;
		}*/

/*		28 jan start*/
.checkcross {
	padding: 0;
	list-style: none;
}

	.checkcross li {
		padding-left: 22px;
		position: relative;
		color: var(--muted)
	}

		.checkcross li:before {
			content: "✘";
			position: absolute;
			left: 0;
			font-weight: 900;
			color: #b42318;
		}

/*		28 jan end */

/*21 jan 26*/
.side-menu {
	width: 100%;
	position: sticky;
	top: 120px;
	max-height: calc(100vh - 110px);
	overflow-y: auto;
	border-radius: 10px;
	border: 1px solid #B1DC98; /* 28 jan 26*/
}

	.side-menu a {
		display: block;
		text-decoration: none;
	}

.submenu2 {
	display: none;
	padding-left: 16px;
}

	.submenu2.open {
		display: block;
		background-color: forestgreen;
	}

	.submenu2 ul {
		list-style: none;
		padding-left: 12px;
	}

submenu2 li > a {
	display: flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
}

.submenu2 li a {
	color: white !important;
}

	.submenu2 li a:hover {
		color: black !important;
	}

.rotate {
	transform: rotate(90deg);
	transition: transform 0.2s ease;
}

@media (max-width: 768px) {
	.submenu2 li a {
		color: black !important;
	}
}

.menufinalcat > a.active {
	background: #eee;
}

.menufinalcat.active {
	background-color: #007bff;
	color: #fff;
}






/* 23 jan */
th.sortable {
	cursor: pointer;
	position: relative;
	padding-right: 26px;
	user-select: none;
}

/* arrows container */
.sort-icons {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	line-height: 0;
}

/* triangle base */
.tri {
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	opacity: 0.25;
}

	/* up arrow */
	.tri.up {
		border-bottom: 6px solid #9aa0a6;
		margin-bottom: 2px;
	}

	/* down arrow */
	.tri.down {
		border-top: 6px solid #9aa0a6;
	}

/* active states */
th.sorted-asc .tri.up {
	opacity: 1;
	border-bottom-color: #000;
}

th.sorted-desc .tri.down {
	opacity: 1;
	border-top-color: #000;
}

/* hover polish */
th.sortable:hover .tri {
	opacity: 0.5;
}

/*12 march 2026*/
.spectrum-bar {
	height: 10px;
	border-radius: 50px;
	background: linear-gradient( 90deg, #7c3aed, #2563eb, #06b6d4, #22c55e, #eab308, #f97316, #ef4444, #991b1b );
}

/*from faqcontrol.ascx  14 mar 26*/

.faq-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
	gap: 8px;
}

@media (max-width: 400px) {
	.faq-grid {
		width: 100%;
		grid-template-columns: 1fr;
	}
}

.faq-grid details {
	margin-bottom: 10px;
}

	/* hide items after index 2 (i.e., show only first 3) */
	.faq-grid details.hidden {
		display: none;
	}

.faq-toggle-btn {
	margin-top: 15px;
	padding: 8px 16px;
	font-size: 15px;
	cursor: pointer;
}


/*speakandcontactusbinding.ascx
*/
.dynamic-checkboxlist {
	display: flex;
	align-items: center;
	gap: 5px;
}

.call-box {
	cursor: default;
}

.call-link {
	color: inherit;
	text-decoration: none;
	font-weight: 500;
}

	.call-link:hover {
		text-decoration: underline;
	}

/*------*/
/*16 mark 26*/
.sub-heading {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 10px;
	font-weight: bolder;
}

/*18 march*/
#accordionButtons .custom-btn.active {
	background-color: #198754 !important;
	color: #fff !important;
	border-color: #198754 !important;
}


.sub-headingcaps {
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-weight: 800;
	color: #5b6b74;
	font-size: 14px;
}
.sub-heading-green {
	z-index: 1;
	font-weight: 800;
	color: #145d2f;
	margin: 0 0 10px;
	font-size: 18px;
}
	.sub-heading-green.large {
		font-size: 23px;
	}
.img-fit {
	max-width: 900px;
	width: 100%;
	height: auto;
}
.img-fit-small {
	max-width: 700px;
	width: 100%;
	height: auto;
	border: 1px solid #f5ebeb;
	border-radius: 20px;
}
.img-fit-large {
	max-width: 1200px;
	width: 100%;
	height: auto;
}

.bg-cards {
	background-image: url("../images/oligo/quality-trust.webp");
	background-size: cover;
	color: white;
}

.banner-box {
	background: url('../images/bannerbg.webp') center/cover no-repeat;
	color: #fff;
	padding: 1.5rem;
	border-radius: 1rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
	position: relative;
}

	.banner-box::before {
		content: "";
		position: absolute;
		inset: 0;
		border-radius: inherit;
	}

	.banner-box > * {
		position: relative;
		z-index: 1;
	}

	.banner-box h2 {
		font-size: 2rem;
		margin: 0;
	}
.cta-dot {
	width: 10px;
	height: 10px;
	margin-right: 15px;
	border-radius: 50%;
	background: #00B050;
	box-shadow: 0 0 0 6px #00B05022;
}
.card-plus {
	background: #fffaf0;
	border: 1px solid #ffd699;
	border-radius: 12px;
	position: relative;
}

	.card-plus::before {
		content: "★";
		position: absolute;
		top: -10px;
		right: -10px;
		background: #ff9800;
		color: #fff;
		font-size: 12px;
		padding: 5px 10px;
		border-radius: 20px;
		box-shadow: 0 2px 6px rgba(0,0,0,0.2);
	}

/* option1 */
.pricing-card {
	border: 1px solid #e5e5e5;
	border-radius: 12px;
	padding: 18px;
	background: #fff;
	height: 100%;
	position: relative;
	transition: 0.25s ease;
	box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

	.pricing-card:hover {
		transform: translateY(-5px);
		box-shadow: 0 6px 18px rgba(0,0,0,0.08);
	}

	.pricing-card ul li {
		margin-bottom: 10px;
		font-size: 14px;
		line-height: 1.6;
	}

.sub-headings {
	text-align: center;
	font-size: 16px;
	font-weight: 600;
	padding: 8px 12px;
	border-radius: 20px;
	margin-bottom: 12px;
	color: #fff;
}

.standard .sub-headings {
	background: linear-gradient(135deg, #0f559b, #1e88e5);
}

.silver .sub-headings {
	color: white;
	background: linear-gradient(135deg, #83888d 0%, #9ba2a9 100%)
}

.gold .sub-headings {
	background: linear-gradient(145deg, #f4b400 0%, #e09d00 100%);
}

.gold-plus {
	border: 2px solid #f57c00;
	background: #fffaf3;
}

	.gold-plus .sub-headings {
		background: linear-gradient(145deg, #f57c00 0%, #e06a00 100%);
	}

.pricing-card::after {
	position: absolute;
	top: -10px;
	right: -10px;
	background: #ff9800;
	color: #fff;
	font-size: 12px;
	padding: 5px 10px;
	border-radius: 20px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.pricing-card.silver::after {
	content: "Popular";
	background: #054585;
}

.pricing-card.gold::after {
	content: "Top";
	background: #f07800;
}

.pricing-card.gold-plus::after {
	content: "Premium";
	background: #e91e63;
}

.pricing-card ul {
	list-style: none;
	padding: 10px 0 0;
	margin: 0;
	border-top: 1px dashed #eee;
}

/* Common left spacing */
.pricing-card ul,
.pricing-card p.text-muted {
	padding-left: 18px;
}

/* List items */
.pricing-card li {
	margin-bottom: 8px;
	font-size: 14px;
	line-height: 1.5;
	position: relative;
}

	/* Icon */
	.pricing-card li::before {
		content: "✔";
		position: absolute;
		left: -18px;
		color: #28a745;
		font-size: 12px;
	}

.pricing-card p.text-muted {
	font-size: 13px;
	margin-top: 10px;
}


/* option 2 */


.ultra-card {
	background: #fff;
	border-radius: 25px;
	padding: 60px 20px 30px;
	position: relative;
	text-align: center;
	transition: all 0.4s ease;
	box-shadow: 0 15px 35px rgba(0,0,0,0.3);
	height: 100%;
	display: flex;
	flex-direction: column;
}

	/* Metallic Borders like the image */
	.ultra-card.bronze {
		border: 4px solid #cd7f32;
	}

	.ultra-card.silver {
		border: 4px solid #bdc3c7;
	}

	.ultra-card.gold {
		border: 4px solid #d4af37;
	}

	.ultra-card.gold-plus {
		border: 4px solid #f57c00;
		background: #fffdf9;
	}

	.ultra-card:hover {
		transform: translateY(-15px);
	}

/* V-Shaped Ribbon (Exactly like image) */
.ultra-ribbon {
	position: absolute;
	top: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 140px;
	height: 80px;
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50% 80%, 0% 100%);
	font-size: 12px;
	font-weight: 800;
	padding-top: 15px;
	color: #333;
	z-index: 5;
}

.bronze .ultra-ribbon {
	background: linear-gradient(#cd7f32, #e6b980);
}

.silver .ultra-ribbon {
	background: linear-gradient(#bdc3c7, #ffffff);
}

.gold .ultra-ribbon, .gold-plus .ultra-ribbon {
	background: linear-gradient(#d4af37, #f9e29c);
}

/* Circular Badges with zigzag border (SVG filter alternative) */
.ultra-badge {
	position: absolute;
	top: 50px;
	right: -15px;
	width: 60px;
	height: 60px;
	background: #ff3b30;
	color: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	font-weight: bold;
	box-shadow: 0 4px 8px rgba(0,0,0,0.2);
	z-index: 10;
	border: 2px dashed rgba(255,255,255,0.5);
}

.popular .ultra-badge {
	background: #f39c12;
}

.elite .ultra-badge {
	background: #e91e63;
}

/* Pricing/Level text */
.ultra-price {
	font-size: 24px;
	font-weight: 800;
	margin-top: 30px;
	color: #444;
	letter-spacing: 1px;
}

.ultra-pkg-name {
	font-size: 15px;
	color: #888;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 20px;
}

/* Features List */
.ultra-features {
	list-style: none;
	padding: 20px 0;
	margin: 0;
	text-align: left;
	border-top: 1px solid #eee;
	flex-grow: 1;
}

	.ultra-features li {
		font-size: 13px;
		padding: 8px 0 8px 25px;
		position: relative;
		color: #555;
	}

		.ultra-features li::before {
			content: "✔";
			position: absolute;
			left: 0;
			font-weight: bold;
			color: #27ae60;
		}

/* Buttons with Gradient (Exactly like Image) */
.ultra-btn {
	border: none;
	padding: 12px;
	border-radius: 12px;
	font-weight: 800;
	color: white;
	text-transform: uppercase;
	transition: 0.3s;
	cursor: pointer;
	box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.bronze .ultra-btn {
	background: linear-gradient(to right, #cd7f32, #8b4513);
}

.silver .ultra-btn {
	background: linear-gradient(to right, #bdc3c7, #7f8c8d);
	color: #333;
}

.gold .ultra-btn, .gold-plus .ultra-btn {
	background: linear-gradient(to right, #d4af37, #b8860b);
}

.ultra-btn:hover {
	filter: brightness(1.1);
	transform: scale(1.05);
}

.ultra-muted {
	font-size: 11px;
	color: #999;
	font-style: italic;
	margin: 10px 0;
}

.ultra-promo {
	color: #f57c00;
	font-size: 12px;
	font-weight: 700;
}

.icon-wrapper {
	min-width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	border: 1px solid #d6eadf;
	margin-top: 2px;
}
/*01 may 2026*/
.cite {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: super;
	color: green;
}

	.cite .tip {
		position: absolute;
		left: 50%;
		bottom: 120%;
		transform: translateX(-50%);
		width: 300px;
		background: #0f2d1d;
		color: #fff;
		padding: 10px;
		border-radius: 8px;
		font-size: 12px;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.2s ease;
	}

		.cite .tip::after {
			content: "";
			position: absolute;
			top: 100%;
			left: 50%;
			transform: translateX(-50%);
			border: 6px solid transparent;
			border-top-color: #0f2d1d;
			margin-top: -1px;
		}

	.cite:hover .tip {
		opacity: 1;
		visibility: visible;
	}

/*01 may 2026*/
.plateTab {
	display: none;
}

	.plateTab.active {
		display: block;
	}

.tabs {
	display: inline-flex;
	background: #eaf4ee;
	padding: 6px;
	border-radius: 999px;
	gap: 6px;
}

.tabBtn {
	border: none;
	background: white;
	padding: 8px 18px;
	border-radius: 999px;
	font-size: 14px;
	color: green;
	cursor: pointer;
	font-weight: bold;
	transition: all 0.25s ease;
}

	/* hover effect */
	.tabBtn:hover {
		background: #1f8f4e;
		color: white;
	}

	/* active tab (green pill) */
	.tabBtn.active {
		background: #1f8f4e;
		color: #fff;
		box-shadow: 0 2px 6px rgba(31, 143, 78, 0.25);
	}
/*06 may 2026*/
.au-core {
	fill: url(#goldGrad);
	stroke: #9b6f00;
	stroke-width: 2;
}

.au-shell {
	fill: none;
	stroke: #D4A017;
	stroke-width: 3;
}

.au-label {
	font-size: 13px;
	fill: #334155;
}

.gold-chip {
	background: #fff8df;
	color: #6f4e00;
	border-color: #f0d98b;
	border: 1px solid #f0d98b;
	padding: .35rem .55rem;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: bold;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
}