@import url('https://fonts.googleapis.com/css2?family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');

/* CSS Reset Code */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

/* CSS Reset Code */


html {
	scroll-behavior: smooth !important;
}


/*** Navbar ***/
.navbar-dark .navbar-nav .nav-link {
	font-family: 'Nunito', sans-serif;
	position: relative;
	margin-left: 25px;
	padding: 35px 0;
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 600;
	outline: none;
	transition: .5s;
}

.sticky-top.navbar-dark .navbar-nav .nav-link {
	padding: 20px 0;
	color: var(--dark);
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active {
	color: var(--primary);
}

.navbar-dark .navbar-brand h1 {
	color: #FFFFFF;
}

.navbar-dark .navbar-toggler {
	color: var(--primary) !important;
	border-color: var(--primary) !important;
}


/*Utility Classes*/
.primary_font {
	/*Generally for Paragraphs */
	font-family: Georgia, 'Times New Roman', Times, serif !important;
	font-size: 1.0rem;
}

.secondary_font {
	/*Generally for Headings */
	font-family: 'Roboto Slab', serif;
	font-size: 1.5rem;
}

.primary_button {
	width: 16vh;
	height: 7vh;
	background-color: #00008B;
	color: white;
	border-radius: 15px;
	border: 2px solid white;
	cursor: pointer;
}

.primary_button:hover {
	width: 16vh;
	margin: 10px;
	height: 7vh;
	font-weight: bold;
	background-color: white;
	color: #00008B;
	border-radius: 15px;
	border: 2px solid #00008B;
	cursor: pointer;
}

.secondary_button {}

.primary_heading {}

.primary_paragraph {
	color: white;
}

/*Utility Classes*/






html {
	scroll-behavior: smooth;
}

body {
	background-color: white;
}

.img-logo {
	width: 50px;
	height: 50px;
	background: white;
	border-radius: 25px;
	margin: 5% 20%;
}

.col {
	color: #00008B;
}

hr {
	border: 2px solid #020272;
}

h2 {
	font-size: 50px;
	color: #00008B;
}

h3 {
	font-size: 30px;
	color: #00008B;
	font-weight: bolder;
	text-align: center;
	text-transform: uppercase;
}

#section_heading {
	color: black;
	text-align: center;
	font-size: 27px;
}

.arrow {
	border: solid rgb(29, 26, 26);
	border-width: 0 2px 2px 0;
	display: inline-block;
	padding: 3px;
}

.down {
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.navbar {
	display: flex;
	background-color: #00008B !important;
	color: white !important;
	width: 100%;
	z-index: +5000;
	-webkit-box-shadow: 0 10px 10px -10px #000000;
	-moz-box-shadow: 0 10px 10px -10px #000000;
	box-shadow: 0 10px 10px -10px #000000;
}

.nav-list {
	display: flex;
	width: 100%;
	height: 10vh;
	align-items: center;

}

.nav-list li {
	padding: 23px;
	color: #FFFFFF !important;
	cursor: pointer;
}

.nav-list li a {
	color: #FFFFFF !important;
	cursor: pointer;
}

.nav-list li a:hover {
	cursor: pointer !important;
	color: black;
	font-weight: bold;
}

.navbar h1 {
	color: #FFFFFF !important;
}

* {
	box-sizing: border-box
}

.burger {
	display: none;
	position: absolute;
	cursor: pointer;
	right: 5%;
	top: 3%;
	float: right;
}

.line1 {
	display: none;
	width: 33px;
	cursor: pointer;
	background-color: #00008B;
	height: 4px;
	margin: 5px 3px;
}

.line2 {
	display: none;
	width: 33px;
	cursor: pointer;
	background-color: #00008B;
	height: 4px;
	margin: 5px 3px;
}

.line3 {
	display: none;
	width: 33px;
	cursor: pointer;
	background-color: #00008B;
	height: 4px;
	margin: 5px 3px;
}


/* Add a red background color to navbar links on hover */
.dropdown:hover .dropbtn {
	background-color: #05b9f5;
}

/* The dropdown container */
.dropdown {
	float: left;
	z-index: 2000;
}

.dropdown:hover .dropbtn {
	background-color: #05b9f5;
}

/* Dropdown button */
.dropdown .dropbtn {
	font-size: 16px;
	border: none;
	outline: none;
	color: white;
	padding: 14px 16px;
	background-color: inherit;
	font-family: inherit;
	/* Important for vertical align on mobile phones */
	margin: 0;
	/* Important for vertical align on mobile phones */
}



/* Dropdown content (hidden by default) */
.dropdown-content {
	display: none;
	position: absolute;
	background-color: white;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

/*Header Ends Here*/

/*Video Starts Here */
.carousel_section {
	position: relative;
	width: 100%;
	height: 100vh;
}

.carousel_section video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 90%;
	object-fit: cover;
}


/*Video Ends Here*/



/* Image Carousel */
.slideshow-container {
	max-width: 100%;
	max-height: 90vh;
	margin: auto;
	overflow: hidden;
	border: none !important;
}

.mySlides {
	display: none;
	height: 90vh;
}

.mySlides img {
	width: 100%;
	height: 90vh;
	/* background-size: cover; */
	background-position: center;
	object-fit: cover;
	overflow: hidden;
	background-repeat: no-repeat;
}

.prev,
.next {
	cursor: pointer;
	position:
		absolute;
	top: 50%;
	width: auto;
	margin-top: -22px;
	padding: 16px;
	color: #00008B;
	font-weight: bold;
	font-size: 30px;
	transition: .6s ease;
	border-radius: 0 3px 3px 0;
	z-index: 2;
}

.next {
	right: 0;
	border-radius: 3px 3px 3px 3px;
}

.prev {
	border-radius: 3px 3px 3px 3px;
	left: 0;
}

.prev:hover,
.next:hover {
	color: #f2f2f2;
	font-weight: bolder;
	background-color: rgba(0, 0, 0, 0.8)
}

.text_slider {
	color: white;
	font-size: 15px;
	font-weight: bolder;
	padding-top: 12px;
	padding-bottom: 12px;
	position: absolute;
	bottom: 25%;
	margin-left: 10%;
	margin-right: 10%;
	width: auto;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.6);
	animation: centerme 3s;
	-webkit-animation: centerme 3s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	z-index: 2;
}

.text_slider h4 {
	padding-left: 10px;
	padding-right: 10px;
}

@keyframes centerme {
	0% {
		left: 0;
	}

	100% {
		left: 45%;
		margin-top: -151px;
		margin-left: -151px;
	}

}

@-webkit-keyframes centerme {
	0% {
		left: 0;
	}

	100% {
		left: 51%;
		margin-left: -151px;
	}

}

.numbertext {
	color: #f2f2f2;
	font-size: 12px;
	padding: 8px 12px;
	position: absolute;
	top: 0
}

.dot {
	cursor: pointer;
	height: 15px;
	width: 15px;
	margin: 0 2px;
	background-color: rgb(2, 2, 2);
	border-radius: 50%;
	display: inline-block;
	transition: background-color .6s ease;
}

.active,
.dot:hover {
	/* background-color: #00008b; */
	/* border: 1px solid black; */
}

/* Image Caraousel */
/* ===== HERO SLIDER HEIGHT REDUCE ===== */
.slider {
  height: 60vh !important;       /* Pehle 100vh tha, ab 60vh — apni marzi se badlo */
  min-height: 380px !important;  /* Mobile par text kat na jaye */
  max-height: 600px !important;  /* Bade screen par zyada bada na ho */
  position: relative;
  overflow: hidden;
}

.slider video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;             /* Video stretch/squish nahi hogi */
  transition: opacity 0.8s ease;
  opacity: 0;
}

.slider video.active {
  opacity: 1;
}

/* Arrows - Glassmorphism */
.slider .controls button {
	background: rgba(0, 0, 0, 0.35);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	width: 52px;
	height: 52px;
	font-size: 22px;
	color: white;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
}

.slider .controls button:hover {
	background: rgba(255, 255, 255, 0.25);
	transform: scale(1.1);
	border-color: rgba(255, 255, 255, 0.6);
}

.prev-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 24px;
	z-index: 20;
}

.next-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 24px;
	z-index: 20;
}

/* ===== Responsive Heights ===== */
@media (max-width: 1024px) {
	.slider {
		height: 60vh;
		min-height: 420px;
	}
}

@media (max-width: 768px) {
	.slider {
		height: 50vh;
		min-height: 350px;
	}
}

@media (max-width: 480px) {
	.slider {
		height: 40vh;
		min-height: 280px;
	}
}

/*Image Carousel */



/*about starts Here*/
.ab {
	width: 100%;
	height: 90vh;
	background-image: url('../Images/india_map.jpg');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	z-index: -1;
}

.ab_left {
	width: 40vw;
	height: 90vh;
	margin-top: 5%;
	float: left;
	margin-left: 5%;
	z-index: 2;
}

.ab_right {
	width: 45vw;
	height: 90vh;
	float: right;
	margin-right: 5%;
	overflow: hidden;
	z-index: 1;
}

.bg_img {
	width: 100vw;
	height: 80%;
	margin-top: 10%;
	background-size: contain;
	background-repeat: no-repeat;
}

#ab_btn {
	width: 120px;
	height: 50px;
	border: 1px solid #00008B;
	background-color: white;
	color: #00008B;
	cursor: pointer;
}

#ab_btn:hover {
	font-weight: bolder;
	background-color: #00008B;
	color: white;
	font-size: 18px;
	font-style: italic;
}

/*about ends Here*/



/* chatbot css  */
.chat_icon {
	position: fixed;
	width: 45px;
	height: 45px;
	right: 37px !important;
	bottom: 50px !important;
	font-size: 1.4rem;
	color: #00008B;
	cursor: pointer;
	z-index: 1000
}

.chat_box {
	position: fixed;
	right: 75px;
	bottom: 50px;
	width: 25vw;
	background: #dedede;
	height: 80vh;
	transition: all 0.7s ease-out;
	transform: scaleY(0);
	z-index: 1000;
}

.hidden {
	display: none !important;
}

.chat_box.active2 {
	transform: scaleY(1);
}

.conv-form-wrapper textarea {
	height: 40px !important;
	background: #8d8de2;
	overflow: hidden;
	resize: none;
}

#messages {
	padding-top: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
}

div.conv-form-wrapper div.options div.option {
	display: block !important;
}

.mycross {
	position: absolute;
	float: right;
	right: 15px;
	top: 20px;
	cursor: pointer;
	color: #00008B;
	z-index: 200;
}

div.conv-form-wrapper div#messages div.message.from {
	padding: 20px;
}

/* chatbot css  */

#map_box {
	border: 1px solid black;
	background-size: cover;
}

.con_text {
	margin-left: 20px;
	margin-right: 10px;
	color: black;
}

.con_text span {
	font-size: 25px;
	font-weight: bold;
	color: #00008b;
}

.stats {
	width: 100%;
	height: 300px;
	background: #009ee0;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0.8;
	z-index: -1;
}

.col-md-4 {
	text-align: center;
	padding-bottom: 50px;
	border-right: 1px dashed black;
}

.col-md-4:last-child {
	border-right: 0px solid black;
}

.row {
	width: 90%;
	height: inherit;
	margin: auto;
	padding: 10px;
}

.col-sm-3 {
	display: inline-block;
	width: 30%;
	height: 200px;
	color: white;
}

.col-sm-3 .number {
	margin-top: 60px;
	margin-bottom: 20px;
	font-size: 40px;
	display: inline-block;
}

.text_stat1 {
	font-size: 20px;
	font-weight: bold;
	color: white;
	z-index: 2;
	opacity: 1;
	margin-bottom: 20px;
}

.box_stats {
	z-index: 2;
	opacity: 1;
}

.counter {
	animation-duration: 1s;
	animation-delay: 0s;
}

.stat_text {
	z-index: 1;
	color: black;
}

.stat_text h2 {
	color: black;
	font-size: 50px;
	text-shadow: rgba(27, 7, 141, 0.8);
}

.stat_text p {
	font-size: 23px;
	font-style: oblique;
}

.page {
	border: 1px solid #00008B;
	;
	margin-left: 5%;
	margin-right: 5%;
	overflow-x: hidden;
	overflow-y: scroll;
	width: 90%;
	color: black;
}

.left table {
	border: 1px solid black;
	color: black;
}

.page h1 {
	font-size: 30px;
	font-weight: bold;
	color: #00008B;
}

.page p {
	font-family: sans-serif;
	color: black;
}

.page button {
	width: 150px;
	height: auto;
	background-color: white;
	color: #00008B;
}

.page button:hover {
	font-weight: bold;
	background-color: #00008B;
	color: white;
}

.left {
	margin: 5%;
	float: left;
	width: 40%;
	height: 30%;
}

.location {
	width: 100%;
	height: 100%;
	background-image: url('india map1.jpg');
	background-size: cover;
	background-repeat: no-repeat;
}

.loca_text {
	width: 40%;
	float: left;
	font-size: 30px;
	margin-top: 10%;
	margin-left: 5%;
	font-family: Georgia, 'Times New Roman', Times, serif;
	color: black;
}

.grid {
	display: grid;
	padding: 0%;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	grid-template-rows: 33.33% 33.33% 33.33%;
	grid-template-columns: 33.33% 33.33% 33.33%;

}

.cell {
	background: #00008B;
	border: 1px solid #555;
	width: 100%;
	height: 250px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
}

.cell h4 {
	font-weight: bold;
	margin-left: 10%;
	margin-right: 10%;
	margin-bottom: 10%;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 20px;
}

.cell img {
	height: 100%;
	width: 100%;
}

.button1 {
	background-color: #00008B;
	/* Green */
	border: none;
	color: white;
	padding: 16px 32px;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	margin: 4px 2px;
	transition-duration: 0.4s;
	cursor: pointer;
}

.btn {
	background-color: white;
	color: #00008B;
	border: 2px solid #00008B;
}

.btn :hover {
	background-color: #00008B;
	width: inherit;
	height: inherit;
	color: white;
	box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19);
}

.right {
	margin: 5%;
	float: right;
	width: 40%;
	height: 30%;
}

/* Links inside the dropdown */
.dropdown-content a {
	float: none;
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
	background-color: #ddd;
	color: black;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
	display: block;
}

/* Navbar */

.formdesign {
	font-size: 1.1rem;
}

.formdesign input {
	width: 50%;
	padding: 12px 20px;
	border: 1px solid blue;
	margin: 14px;
	border-radius: 4px;
	font-size: 15px;
}

.formerror {
	color: red;
	font-size: 12px;
}

.but {
	border-radius: 9px;
	border: 1px solid #00008B;
	background-color: white;
	color: #00008B;
	width: 100px;
	height: 50px;
	font-size: 25px;
	margin-left: 20px;
	margin-right: 20px;
	cursor: pointer;
}

.but:hover {
	background-color: #00008B;
	color: white;
}

.image {
	width: 100%;
	height: 47vh;
	background-image: url('../Images/Contact_bg.jpg');
	background-size: 100% 100%;
}

.contact {
	width: 100%;
	height: 100%;
}

.cont_map {
	width: 40%;
	height: 100%;
	float: left;
	background: #000;
}

.valid_form {
	width: 40%;
	height: 100%;
	float: right;
}

#box1 {
	font-size: 15px;
	color: black;
	font-family: Verdana, Tahoma, sans-serif;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 10%;
	margin-bottom: 10%;
	z-index: 1;
}

#box1 h3 {
	font-weight: bold;
	font-family: Georgia, 'Times New Roman', Times, serif;
	/* Heading Handwriting */
	font-size: 25px;
	line-height: 40px;
	font-style: italic;
	margin: 1em 0 0.5em 0;
	letter-spacing: 1px;
	color: #00008B;
	z-index: 2;
}

#box1 p {
	padding: 5px;
	margin-bottom: 5px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	/* Paragraph Handwriting */
	z-index: 2;
	opacity: 1;
}

.text {
	color: white;
	margin-left: 10%;
	margin-right: 50%;
	margin-bottom: 10px;
	margin-top: 15%;
	font-weight: bold;
	background: rgba(0, 0, 0, 0.6);
	z-index: +1;
}

.text h1 {
	color: white;
	font-size: 25px;
	text-decoration: underline;
	font-family: Georgia, 'Times New Roman', Times, serif;
}

.text p {
	color: white;
	z-index: +1;
}

.text ul {
	font-size: 20px;
}

.corp {
	width: 90%;
	height: 400px;
	margin-left: 5%;
	margin-right: 5%;
}

.corp_right {
	width: 45%;
	height: 300px;
	float: right;
}

.corp_left {
	width: 45%;
	height: 300px;
	float: left;
	text-align: left;
}

.corp_left p {
	margin-top: 2%;
	padding-left: 3%;
	text-align: left;
}

.corp_left strong {
	padding-left: 3%;
	text-align: left;
}

.corp_left h1 {
	font-size: 35px;
	color: black;
	padding-left: 3%;
	text-align: left;
}

.corp_left h3 {
	font-size: 20px;
	color: black;
	text-transform: uppercase;
	text-decoration: none;
	padding-left: 3%;
	text-align: left;
}

.btn1 {
	background-color: #00008B;
	color: white;
	margin: 10px;
	/*margin-left: 25% ; _*/
	text-align: center;
	width: 150px;
	height: 45px;
}

.btn1:hover {
	background-color: white;
	color: #00008B;
	font-weight: bolder;
	border: 2px solid #00008B;
}

.about1 {
	font-size: 15px;
	color: black;
	width: 100%;
	height: 90vh;
	overflow: hidden;
	background-image: url('../Images/about1.jpg');
	background-size: 100% 100%;
	z-index: 1;
}

/* ============ MOBILE ABOUT IMAGE FIX ============ */
@media (max-width: 768px) {
  .about1 {
    background-image: url('../Images/about_mobile.png') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }
}

/* ============ MOBILE ABOUT IMAGE FIX ============ */
@media (max-width: 450px) {
  .about1 {
    background-image: url('../Images/about_mobile.png') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }
}

.about1 h1 {
	font-size: 30px;
	color: #00008B;
}

#about_img {
	width: 300px;
	height: 300px;
	border-radius: 50%;
	margin-right: 10%;
	border: 2px solid #00008B;
	box-shadow: 8px 8px 6px #777777;
}

.text_about {
	color: black;
	padding: 10px;
	margin-left: 5%;
	margin-right: 55%;
	margin-bottom: 10%;
	z-index: +1;
}

/* Small blue underline accent */
.about-heading::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 50px;
	height: 3px;
	background: #00008B;
	border-radius: 2px;
}

/* ===================== PARAGRAPHS ===================== */
.text_about p {
	font-size: 15.5px;
	line-height: 1.8;
	color: #374151;
	margin-bottom: 22px;
}

/* First paragraph - slight emphasis */
.text_about p {
	color: #000000;
	font-weight: 500;
	font-family: Georgia, 'Times New Roman', Times, serif !important;
	font-size:14px;
}

/* ===================== ENTRANCE ANIMATIONS ===================== */
.reveal-item {
	opacity: 0;
	transform: translateY(25px);
	transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-item.revealed {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger effect for each element */
.reveal-item.revealed:nth-child(1) {
	transition-delay: 0s;
}

.reveal-item.revealed:nth-child(2) {
	transition-delay: 0.15s;
}

.reveal-item.revealed:nth-child(3) {
	transition-delay: 0.3s;
}

.reveal-item.revealed:nth-child(4) {
	transition-delay: 0.45s;
}

.reveal-item.revealed:nth-child(5) {
	transition-delay: 0.6s;
}

.director {
	width: 100%;
	height: 100vh;
	color: white;
	background-image: url('../Images/diretor_bg.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	overflow: hidden;
	z-index: -1;
}

.director1 {
	margin-top: 7%;
}

#right_box {
	width: 40%;
	height: 90vh;
	float: right;
}

#right_box {
	width: 50%;
	height: 578px;
	z-index: -1;
	opacity: .9;

}

.right_text {
	font-family: Georgia, 'Times New Roman', Times, serif;
	margin: 10%;
	color: black;
	z-index: +1;
}

.right_text h1 {
	font-size: 25px;
	font-weight: bold;
	color: black;
}

/* ===================== VISION & MISSION ===================== */
#vi_mi {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	background: #f8fafc;
	overflow: hidden;
	min-height: 578px;
}

/* LEFT: Image box */
#left_box {
	width: 50%;
	height: 578px;
	background-image: url('https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&q=80');
	background-size: cover;
	background-position: center;
	position: relative;
}

/* ===================== LEFT IMAGE ANIMATION ===================== */
.reveal-image {
	opacity: 0;
	transform: translateX(-60px) scale(1.05);
	transition: opacity 1.1s cubic-bezier(0.22, 1, 0.36, 1),
		transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-image.revealed {
	opacity: 1;
	transform: translateX(0) scale(1);
}

/* RIGHT: Text box */
#right_box {
	width: 40%;
	min-height: 578px;
	background: #ffffff;
	display: flex;
	align-items: center;
	position: relative;
	z-index: 1;
}

.right_text {
	color: #000000;
	width: 100%;
}

/* ===================== HEADING ===================== */
.vm-heading {
	font-size: 30px;
	font-weight: 700;
	color: #00008B;
	margin-bottom: 30px;
	position: relative;
	padding-bottom: 12px;
	letter-spacing: -0.01em;
}

.vm-heading::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 50px;
	height: 3px;
	background: #00008B;
	border-radius: 2px;
}

/* ===================== PARAGRAPHS ===================== */
.vm-para {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 15.5px;
	line-height: 1.85;
	color: #374151;
	margin-bottom: 24px;
}

.logo1 {
	height: 26px;
	width: auto;
	display: inline-block;
	vertical-align: middle;
	margin: 0 4px;
	transition: transform 0.3s ease;
}

.vm-para:hover .logo1 {
	transform: scale(1.08);
}

/* ===================== TEXT ENTRANCE ANIMATIONS ===================== */
.reveal-item {
	opacity: 0;
	transform: translateY(25px);
	transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-item.revealed {
	opacity: 1;
	transform: translateY(0);
}

.right_text .reveal-item.revealed:nth-child(1) {
	transition-delay: 0.3s;
}

.right_text .reveal-item.revealed:nth-child(2) {
	transition-delay: 0.45s;
}

.right_text .reveal-item.revealed:nth-child(3) {
	transition-delay: 0.6s;
}

.right_text .reveal-item.revealed:nth-child(4) {
	transition-delay: 0.75s;
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
	#vi_mi {
		flex-direction: column;
	}

	#left_box,
	#right_box {
		width: 100%;
	}

	#left_box {
		height: 320px;
	}

	#right_box {
		min-height: auto;
	}

	.right_text {
		padding: 40px 8%;
	}

	.vm-heading {
		font-size: 26px;
	}

	.vm-para {
		font-size: 15px;
	}
}

.team {
	width: 60%;
	height: auto;
	float: left;
	margin-top: 30%;
	margin-left: 7%;
	position: absolute;
	background: pink;
}

.logo1 {
	width: 60px;
	height: 60px;
	display: inline;
	z-index: 2;
}

#quality {
	width: 100%;
	height: 50%;
	overflow: hidden;
}

/* ===================== WHY US SECTION ===================== */
#quality {
	width: 100%;
	min-height: 50vh;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	background: #f8fafc;
}

/* LEFT: Text side */
.why_left {
	width: 40%;
	min-height: 50vh;
	display: flex;
	align-items: center;
	padding: 60px 0;
	overflow: hidden;
	background: #d7dff7;
}

.why_text {
	margin-left: 10%;
	margin-right: 10%;
	max-width: 520px;
}

.why_text h1 {
	font-size: 34px;
	font-weight: 700;
	color: #374151; 
	text-transform: none;
	font-style: italic;
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 30px;
	letter-spacing: -0.01em;
}

/* Blue underline accent */
.why_text h1::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 60px;
	height: 3px;
	background: #00008B;
	border-radius: 2px;
}

/* Each list item */
.why_text ul {
	list-style: none;
	padding: 0;
	margin: 0 0 20px 0;
}

.why_text ul li {
	position: relative;
	padding-left: 32px;
	font-size: 15.5px;
	line-height: 1.7;
	color: #374151;
	margin-bottom: 14px;
	transition: color 0.3s ease;
}

/* Custom checkmark before each item */
.why_text ul li::before {
	content: '✓';
	position: absolute;
	left: 0;
	top: -1px;
	width: 22px;
	height: 22px;
	background: #00008B;
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: bold;
	box-shadow: 0 4px 10px rgba(0, 0, 139, 0.25);
	transition: all 0.3s ease;
}

.why_text ul li:hover {
	color: #00008B;
}

.why_text ul li:hover::before {
	background: #1d4ed8;
	transform: scale(1.1);
}

/* Paragraph inside list (DNA line) */
.why_text ul li p {
	margin: 0;
	padding: 0;
	display: block;
}

/* DNA highlight paragraph (jo italic blue hai) */
.why_text ul p {
	position: relative;
	margin-top: 20px !important;
	margin-bottom: 0 !important;
	padding: 18px 22px !important;
	background: #eff6ff;
	border-left: 4px solid #00008B;
	border-radius: 0 12px 12px 0;
	font-family: Georgia, 'Times New Roman', Times, serif !important;
	font-size: 12px !important;
	line-height: 1 !important;
	color: #374151;  !important;
	font-style: italic !important;
	font-weight: 700;
	box-shadow: 0 4px 15px rgba(0, 0, 139, 0.08);
}

/* Remove default ul marker for the second list */
.why_text ul:last-child li {
	padding-left: 32px;
}

/* RIGHT: Image side */
.why_right {
	width: 60%;
	min-height: 50vh;
	background-image: url('../Images/why_us.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
	transition: transform 0.6s ease;
}

/* Subtle blue tint overlay on image */
.why_right::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(248, 250, 252, 0.3) 0%, transparent 40%);
	pointer-events: none;
}

/* ===================== REVEAL ANIMATIONS ===================== */
.why_text h1,
.why_text ul li,
.why_text>ul>p {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

#quality.revealed .why_text h1,
#quality.revealed .why_text ul li,
#quality.revealed .why_text>ul>p {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger delays */
#quality.revealed .why_text h1 {
	transition-delay: 0s;
}

#quality.revealed .why_text ul:first-child li:nth-child(1) {
	transition-delay: 0.1s;
}

#quality.revealed .why_text ul:first-child li:nth-child(2) {
	transition-delay: 0.2s;
}

#quality.revealed .why_text ul:first-child li:nth-child(3) {
	transition-delay: 0.3s;
}

#quality.revealed .why_text ul:last-child li:nth-child(1) {
	transition-delay: 0.4s;
}

#quality.revealed .why_text ul:last-child li:nth-child(2) {
	transition-delay: 0.5s;
}

#quality.revealed .why_text>ul>p {
	transition-delay: 0.6s;
}

/* Image reveal */
.why_right {
	opacity: 0;
	transform: translateX(40px);
	transition: opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
		transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

#quality.revealed .why_right {
	opacity: 1;
	transform: translateX(0);
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
	#quality {
		flex-direction: column;
	}

	.why_left,
	.why_right {
		width: 100%;
	}

	.why_left {
		padding: 50px 0;
		min-height: auto;
	}

	.why_right {
		min-height: 320px;
	}

	.why_text {
		margin-left: 5%;
		margin-right: 5%;
	}

	.why_text h1 {
		font-size: 28px;
	}

	.why_text ul li {
		font-size: 15px;
	}
}

.excellence {
	width: 100%;
	min-height: 50vh;
	background: #ffffff;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}

/* LEFT: Image side */
.exe_left {
	width: 60%;
	min-height: 50vh;
	background-image: url('../Images/exellence.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
}

/* Subtle fade on right edge */
.exe_left::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to left, rgba(255, 255, 255, 0.2) 0%, transparent 40%);
	pointer-events: none;
}

/* RIGHT: Text side */
.exe_right {
	width: 40%;
	min-height: 50vh;
	display: flex;
	align-items: center;
	padding: 60px 0;
	overflow: hidden;
	background: #f8fafc;
}

.exe_text {
	margin-left: 10%;
	margin-right: 10%;
	max-width: 520px;
	width: 100%;
}

.exe_text h1 {
	font-size: 34px;
	font-weight: 700;
	color: #374151; 
	font-style: italic;
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 30px;
	letter-spacing: -0.01em;
}

.exe_text h1::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 60px;
	height: 3px;
	background: #00008B;
	border-radius: 2px;
}

/* ===================== CARD-STYLE LIST ITEMS (match Why Us) ===================== */
.exe_text ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.exe_text ul li {
	position: relative;
	background: #ffffff;
	border-left: 4px solid #00008B;
	border-radius: 0 12px 12px 0;
	padding: 14px 20px 14px 52px;
	margin-bottom: 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 139, 0.06);
	transition: all 0.3s ease;
}

.exe_text ul li p {
position: relative;
	background: #eff6ff;
	font-family: Georgia, 'Times New Roman', Times, serif !important;
	font-size: 12px !important;
	line-height: 1 !important;
	color: #374151;  !important;
	font-style: italic !important;
	font-weight: 700;
}

/* Circular checkmark */
.exe_text ul li::before {
	content: '✓';
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	background: #00008B;
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: bold;
	box-shadow: 0 4px 10px rgba(0, 0, 139, 0.25);
	transition: all 0.3s ease;
}

/* Hover effect */
.exe_text ul li:hover {
	transform: translateX(6px);
	box-shadow: 0 6px 18px rgba(0, 0, 139, 0.12);
	border-left-color: #1d4ed8;
}

.exe_text ul li:hover::before {
	background: #1d4ed8;
	transform: translateY(-50%) scale(1.15);
}

/* ===================== REVEAL ANIMATIONS ===================== */
.exe_text h1,
.exe_text ul li {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

#exe.revealed .exe_text h1,
#exe.revealed .exe_text ul li {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger delays for 8 items */
#exe.revealed .exe_text h1 {
	transition-delay: 0s;
}

#exe.revealed .exe_text ul li:nth-child(1) {
	transition-delay: 0.08s;
}

#exe.revealed .exe_text ul li:nth-child(2) {
	transition-delay: 0.16s;
}

#exe.revealed .exe_text ul li:nth-child(3) {
	transition-delay: 0.24s;
}

#exe.revealed .exe_text ul li:nth-child(4) {
	transition-delay: 0.32s;
}

#exe.revealed .exe_text ul li:nth-child(5) {
	transition-delay: 0.40s;
}

#exe.revealed .exe_text ul li:nth-child(6) {
	transition-delay: 0.48s;
}

#exe.revealed .exe_text ul li:nth-child(7) {
	transition-delay: 0.56s;
}

#exe.revealed .exe_text ul li:nth-child(8) {
	transition-delay: 0.64s;
}

/* Override hover transform when not yet revealed */
#exe:not(.revealed) .exe_text ul li:hover {
	transform: translateY(20px);
}

/* Image reveal */
.exe_left {
	opacity: 0;
	transform: translateX(-40px);
	transition: opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
		transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

#exe.revealed .exe_left {
	opacity: 1;
	transform: translateX(0);
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
	.excellence {
		flex-direction: column-reverse;
	}

	.exe_left,
	.exe_right {
		width: 100%;
	}

	.exe_left {
		min-height: 320px;
	}

	.exe_right {
		padding: 50px 0;
		min-height: auto;
	}

	.exe_text {
		margin-left: 5%;
		margin-right: 5%;
	}

	.exe_text h1 {
		font-size: 28px;
	}

	.exe_text ul li {
		padding: 12px 16px 12px 48px;
	}

	.exe_text ul li p {
		font-size: 14.5px;
	}

	.exe_text ul li::before {
		left: 14px;
		width: 20px;
		height: 20px;
		font-size: 12px;
	}
}

/* Image reveal (slide from left) */
.exe_left {
	opacity: 0;
	transform: translateX(-40px);
	transition: opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
		transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

#exe.revealed .exe_left {
	opacity: 1;
	transform: translateX(0);
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
	.excellence {
		flex-direction: column-reverse;
		/* Text upar, image neeche mobile pe */
	}

	.exe_left,
	.exe_right {
		width: 100%;
	}

	.exe_left {
		min-height: 320px;
	}

	.exe_right {
		padding: 50px 0;
		min-height: auto;
	}

	.exe_text {
		margin-left: 5%;
		margin-right: 5%;
	}

	.exe_text h1 {
		font-size: 28px;
	}

	.exe_text ul li {
		font-size: 15px;
	}
}


/*career starts here*/
.line {
	display: inline-block;
}

.formdesign1 {
	font-size: 20px;
}

.formdesign1 h2 {
	margin-left: 10px;
	color: white;
}

.formdesign1 input {
	width: 120%;
	overflow: hidden;
	border: 1px solid blue;
	text-align: center;
	border-radius: 4px;
	font-size: 15px;
	margin-left: 30px;
	margin-right: 20px;
}

.formdesign1 textarea {
	width: 90%;
	border-radius: 10px;
}

.formerror {
	color: red;
}

.careers {
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

.left_car {
	width: 50%;
	height: 100vh;
	float: left;
	overflow: hidden;
	background-image: url('../Images/career image.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.right_car {
	width: 50%;
	height: 100vh;
	float: right;
	z-index: 100;
	-webkit-box-shadow: 0 10px 10px -10px #000000;
	-moz-box-shadow: 0 10px 10px -10px #000000;
	box-shadow: 10px 10px 10px -10px #000000;
}

.right_car h2 {
	font-size: 20px;
	color: black;
	margin-left: 20px;
}

.right_car p {
	color: black;
	margin-left: 20px;
}

.right_car span {
	color: black;
	margin-left: 20px;
	font-family: georgia;
}

.right_car a {
	color: black;
}

/*creer ends here */



.cbox {
	width: 80%;
	height: 50%;
	margin-top: 2px;
	margin-left: 10%;
	margin-right: 10%;
	border: 5px solid #00008b;
	overflow: hidden;
	padding: 0;
}

.slider1 {
	width: 100%;
	height: 100%;
	margin-top: 0;
	padding: 0;
}

.slider1 img {
	margin-top: 0;
	padding: 0;
	object-fit: cover;
	background-size: cover;
}

.bttn1 {
	width: 10%;
	height: 10%;
	float: left;
	padding-right: 0;
	margin-left: 0;
	margin-top: 5%;
	color: #00008b;
	font-size: 120px;
	padding: 0;
	text-shadow: 2px 2px #ff0000;
}

.bttn2 {
	width: 10%;
	height: 10%;
	float: right;
	padding-left: 0;
	margin-right: 0;
	margin-top: 5%;
	color: #00008b;
	font-size: 120px;
	padding: 0;
}


#left_box {
	width: 60%;
	float: left;
	background-image: url('https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&q=80');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	overflow: hidden;
}

/* ===================== INNOVATION SECTION ===================== */
.inova {
	width: 100%;
	min-height: 85vh;
	background-image: url('../Images/inova_bg.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	overflow: hidden;
}

/* LEFT: Text side */
.inova_left {
	width: 50%;
	padding: 10px 0;
	display: flex;
	align-items: center;
	overflow: hidden;
}

.inova_text {
	margin-left: 10%;
	margin-right: 10%;
	max-width: 540px;
}

.inova-label {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	color: #00008B;
	letter-spacing: 0.25em;
	text-transform: uppercase;
}

.inova-heading {
	font-size: 38px;
	font-weight: 700;
	color: #00008B;
	font-style: italic;
	position: relative;
	padding-bottom: 8px;
	margin-bottom: 20px;
	letter-spacing: -0.01em;
}

.inova-heading::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 60px;
	height: 3px;
	background: #00008B;
	border-radius: 2px;
}

.inova-lead {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 18px;
	font-weight: 700;
	color: #00008B;
	line-height: 1.5;
	margin-bottom: 20px;
	padding-left: 18px;
	border-left: 4px solid #00008B;
}

.inova-para {
	font-family: 'Ubuntu', sans-serif;
	font-size: 15.5px;
	line-height: 1.75;
	color: #374151;
	margin-bottom: 18px;
}

/* Innovation process chips */
.inova-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 15px;
}

.inova-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #ffffff;
	color: #00008B;
	font-size: 13px;
	font-weight: 700;
	padding: 8px 16px;
	border-radius: 999px;
	box-shadow: 0 2px 10px rgba(0, 0, 139, 0.08);
	border: 1px solid rgba(0, 0, 139, 0.1);
	transition: all 0.3s ease;
}

.inova-chip:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(0, 0, 139, 0.15);
	background: #00008B;
	color: #fff;
}

/* RIGHT: Image side */
.inova_right {
	width: 50%;
	min-height: 85vh;
	position: relative;
	overflow: hidden;
}

.inova_right::before {
	content: '';
	position: absolute;
	inset: 0;
	/* background: linear-gradient(to right, rgba(248, 250, 252, 0.3) 0%, transparent 40%); */
	pointer-events: none;
}

/* ===================== INFRASTRUCTURE SECTION ===================== */
.infra {
	width: 100%;
	min-height: 100vh;
	background-image: url('../Images/infrastructure.jpg');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	position: relative;
	display: flex;
	align-items: center;
	padding: 80px 0;
	overflow: hidden;
}

/* Dark overlay for text readability */
.infra_overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(10, 15, 40, 0.92) 0%, rgba(10, 15, 40, 0.75) 40%, rgba(10, 15, 40, 0.5) 100%);
	z-index: 1;
}

.infra_container {
	width: 100%;
	position: relative;
	z-index: 2;
}

.infra_text {
	margin-left: 8%;
	margin-right: 50%;
	max-width: 600px;
	padding: 20px 0;
}

.infra-label {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	color: #60a5fa;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	margin-bottom: 12px;
}

.infra-heading {
	font-size: 42px;
	font-weight: 700;
	color: #ffffff;
	font-style: italic;
	position: relative;
	padding-bottom: 10px;
	margin-bottom: 10px;
	letter-spacing: -0.01em;
}

.infra-heading::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 60px;
	height: 3px;
	background: #60a5fa;
	border-radius: 2px;
}

.infra-sub {
	font-size: 15.5px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.85);
	margin-bottom: 34px;
}

/* List */
.infra-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.infra-list li {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 14px 18px;
	margin-bottom: 10px;
	background: rgba(255, 255, 255, 0.06);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-radius: 12px;
	border-left: 3px solid #60a5fa;
	transition: all 0.35s ease;
}

.infra-list li:hover {
	background: rgba(255, 255, 255, 0.12);
	transform: translateX(6px);
	border-left-color: #ffffff;
}

/*.infra-num {*/
/*	font-family: 'Roboto Slab', serif;*/
/*	font-size: 15px;*/
/*	font-weight: 700;*/
/*	color: #60a5fa;*/
/*	flex-shrink: 0;*/
/*	min-width: 28px;*/
/*	transition: color 0.3s ease;*/
/*}*/

.infra-list li:hover .infra-num {
	color: #ffffff;
}

.infra-item-text {
	font-family: 'Ubuntu', sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: #ffffff;
	font-weight: 500;
}

/* ===================== REVEAL ANIMATIONS ===================== */
.reveal-item {
	opacity: 0;
	transform: translateY(25px);
	transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-item.revealed {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger delays for innovation section */
.inova_text .reveal-item.revealed:nth-child(1) {
	transition-delay: 0s;
}

.inova_text .reveal-item.revealed:nth-child(2) {
	transition-delay: 0.1s;
}

.inova_text .reveal-item.revealed:nth-child(3) {
	transition-delay: 0.2s;
}

.inova_text .reveal-item.revealed:nth-child(4) {
	transition-delay: 0.3s;
}

.inova_text .reveal-item.revealed:nth-child(5) {
	transition-delay: 0.4s;
}

.inova_text .reveal-item.revealed:nth-child(6) {
	transition-delay: 0.5s;
}

/* Stagger delays for infrastructure section */
.infra_text .reveal-item.revealed:nth-child(1) {
	transition-delay: 0s;
}

.infra_text .reveal-item.revealed:nth-child(2) {
	transition-delay: 0.1s;
}

.infra_text .reveal-item.revealed:nth-child(3) {
	transition-delay: 0.2s;
}

.infra-list li.reveal-item.revealed:nth-child(1) {
	transition-delay: 0.3s;
}

.infra-list li.reveal-item.revealed:nth-child(2) {
	transition-delay: 0.4s;
}

.infra-list li.reveal-item.revealed:nth-child(3) {
	transition-delay: 0.5s;
}

.infra-list li.reveal-item.revealed:nth-child(4) {
	transition-delay: 0.6s;
}

.infra-list li.reveal-item.revealed:nth-child(5) {
	transition-delay: 0.7s;
}

.infra-list li.reveal-item.revealed:nth-child(6) {
	transition-delay: 0.8s;
}

/* Image reveal (Innovation) */
.reveal-image {
	opacity: 0;
	transform: translateX(40px) scale(1.05);
	transition: opacity 1.1s cubic-bezier(0.22, 1, 0.36, 1),
		transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-image.revealed {
	opacity: 1;
	transform: translateX(0) scale(1);
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {

	/* Innovation */
	.inova {
		flex-direction: column;
		min-height: auto;
	}

	.inova_left,
	.inova_right {
		width: 100%;
	}

	.inova_left {
		padding: 60px 0;
	}

	.inova_right {
		min-height: 340px;
	}

	.inova_text {
		margin-left: 6%;
		margin-right: 6%;
	}

	.inova-heading {
		font-size: 30px;
	}

	.inova-lead {
		font-size: 16px;
	}

	.inova-para {
		font-size: 15px;
	}

	/* Infrastructure */
	.infra {
		padding: 60px 0;
		min-height: auto;
		background-attachment: scroll;
	}

	.infra_text {
		margin-left: 6%;
		margin-right: 6%;
		max-width: 100%;
	}

	.infra-heading {
		font-size: 32px;
	}

	.infra-sub {
		font-size: 15px;
	}

	.infra-list li {
		padding: 12px 14px;
		gap: 12px;
	}

	.infra-item-text {
		font-size: 14px;
	}
}

.why {
	width: 100%;
	height: 350px;
	background: rgb(233, 227, 227);
	background-size: 100% 100%;
	object-fit: cover;
	z-index: -1;

}

.why h1 {
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;
	margin-left: 5%;
	z-index: 2;
	opacity: 1;
}

.why p {
	font-size: 15px;
	margin-left: 5%;
	padding: 5px;
	z-index: 2;
	opacity: 1;
}

.why ul {
	list-style-type: disc;
	margin-left: 7%;
	font-weight: bold;
}

.founder {
	color: black;
}

.founder ul {
	list-style-type: disc;
}

.founder h4 {
	font-size: 30px;
}

.vision {
	font-size: 15px;
	color: black;
	width: 100%;
	overflow: hidden;
	background-image: url('vision.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	z-index: -1;
}

.vision h1 {
	font-size: 30px;
	font-weight: bold;
}

.Box {
	width: 50%;
	height: 30%;
	color: width;
	text-align: center;
	border: 1px solid black;
	float: right;
	margin: 5px;
}

.Box p {
	color: blanchedalmond;
	margin: 5px;
}

.location1 {
	width: 80%;
	height: 100vh;
	margin-left: 10%;
	margin-right: 10%;
	margin-bottom: 10%;
}

.right_loca {
	width: 50%;
	height: 250px;
	float: right;
}

.right_loca h3 {
	/* margin-left; */
	font-size: 20px;
	color: black;
}

.left_loca {
	width: 50%;
	height: 250px;
	float: left;
}

.location1 h1 {
	font-size: 30px;
}

.location1 h4 {
	font-size: 20px;
	margin-left: 3%;
	font-weight: bold;
	color: #00008B;
}

.location1 p {
	font-size: 15px;
	margin-left: 3%;
}

.mul_cap {
	width: 100%;
	height: auto;
	overflow: Hidden;
}

.mul_cap h1 {
	text-transform: uppercase;
	color: #00008b;
	text-align: center;
	font-size: 30px;
}

.mul_cap ul {
	list-style-image: url("https://img.icons8.com/ios-glyphs/15/000000/plus-math.png");
	margin-left: 12%;
}

.prod_slider {
	width: 100%;
	height: 578px;
	z-index: -1;
}

/*Prducts Page Styling Starts Here*/
#pro_image {
	width: 100%;
	height: 45vh;
	overflow: hidden;
}

.pro_info {
	width: 90%;
	height: auto;
	overflow: hidden;
	margin-left: 5%;
	margin-right: 5%;
	color: black;
}

.pro_info th {
	background-color: #00008B;
	color: white;
	font-weight: bold;
	padding: 3px;
}

.pro_info td {
	width: 150px;
	text-align: center;
}

.table_box {
	width: 100%;
	overflow: hidden;
}

.pro_info table {
	width: 100%;
	float: left;
}

.pro_info h1 {
	font-weight: bold;
	color: #00008b;
	font-size: 30px;
}

.pro_info p {
	font-size: 15px;
	color: black;
}

.pro_info ul {
	list-style-type: lower-roman;
	margin-left: 1.5%;
}

.pro_info table,
td,
th {
	border: 1px solid black;
	border-collapse: collapse;
}

.pro_info td {
	padding: 3px;
}

.bx {
	width: 150px;
	height: 35px;
	color: white;
	background: #00008b;
	overflow: hidden;
	font-weight: bold;
	font-size: 25px;
	display: inline-flex;
	justify-content: center;
	border-radius: 5px;
	align-items: center;
	position: relative;
	left: 45%;

}

.bx1 {
	width: 150px;
	height: 30px;
	color: white;
	background: #00008b;
	margin: 7px;
	overflow: hidden;
	position: relative;
	font-style: italic;
	text-align: center;
	border-radius: 5px;
	display: inline-block;
	margin-left: 70px;

}

/* Footer Starts Here */
.footer {
	color: white;
	background: linear-gradient(90deg, #1e3a8a 0%, #312e81 50%, #1e3a8a 100%) !important;
}

.footer span {
	color: white;
}

.footer h1 {
	color: white;
	font-size: 18px;
	text-transform: uppercase;
}

.footer a:hover {
	color: black;
	font-weight: bolder;
}

.get_touch {
	margin-right: 15%;
	color: white;
}

.get_touch span {
	color: white;
}

.but_mob {
	display: none;
}

.form-box {
	width: 80%;
	height: auto;
	margin: auto;
	overflow: hidden;
}

.form2 input {
	width: 80%;
	text-align: center;
	margin: auto;
	overflow: hidden;
}
/* Footer Starts Here */

/*Responsive CSS Quires*/
@media only screen and (max-width: 450px) {

	/* For mobile phones: */
	.menu {
		position: absolute;
		margin-left: 85%;
		padding-right: 1%;
		width: 30px;
		height: 30px;
		display: inline-block;
		cursor: pointer;
	}

	.menu img {
		filter: invert(100%);
	}

	.primary_font {
		/*Generally for Paragraphs */
		font-family: 'Ubuntu', sans-serif;
		font-size: 1rem;
		padding-right: 3.8%;
	}

	.secondary_font {
		/*Generally for Headings */
		font-family: 'Roboto Slab', serif;
		font-size: 1.0rem;
	}

	.primary_button {
		width: 18vh;
		height: 7vh;
		background-color: #00008B;
		color: white;
		border-radius: 15px;
		border: 2px solid white;
		cursor: pointer;
	}

	.primary_button:hover {
		width: 18vh;
		margin: 10px;
		height: 7vh;
		font-weight: bold;
		background-color: white;
		color: #00008B;
		border-radius: 15px;
		border: 2px solid #00008B;
		cursor: pointer;
	}

	header {
		height: auto;
		overflow: hidden;
	}

	.ab_right {
		display: none;
	}

	.ab_left {
		width: 100vw;
		padding-right: 5%;
	}

	#left_box {
		display: none;
	}

	#right_box {
		width: 100%;
	}

	.ab {
		background-image: url('../Images/indiamap_400.jpeg');
		opacity: 0.7;
		z-index: -1;
	}

	.ab_left {
		font-weight: bolder;
		color: black;
		z-index: 2;
		opacity: 1 !important;
	}

	.but_mob {
		display: none;
	}

	.prev {
		display: none;
	}

	.next {
		display: none;
	}

	.dot {
		display: none;
	}

	.col-sm-3 {
		display: inline-block;
		width: 30%;
		height: 30vh;
		color: white;
		margin-top: 10%;
	}

	.col-sm-3 .number {
		margin-top: 5%;
		margin-left: 5%;
		font-size: 40px;
		display: inline-block;
	}

	.stats {
		width: 100%;
		height: 300px;
		background: #009ee0;
		background-size: cover;
		background-repeat: no-repeat;
		opacity: 0.8;
		z-index: -1;
	}

	.row {
		width: 90%;
		height: inherit;
		margin: auto;
		padding: 10px;
	}

	.number {
		display: inline-block;
		flex-direction: row;
	}

	.f_logo {
		display: none;
	}

	.f-head {
		padding-left: 20%;
	}

	.f_para {
		padding-left: 20%;
	}

	.about1 {
		height: auto;
		background-image: url('../Images/about_mobile.png') !important;
	}

	#about_img {
		display: none;
	}

	#right_box {
		height: auto;
		overflow: hidden;
	}

	.why_right {
		display: none;
	}

	.why_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.why_text {
		padding-right: 3%;
		padding-bottom: 2%;
	}

	.excellence {
		height: auto !important;
		overflow: hidden;
	}

	.exe_left {
		display: none;
	}

	.exe_right {
		width: 100%;
		height: auto !important;
		overflow: hidden;
	}

	.exe_text {
		font-size: 1rem;
		padding-right: 3%;
		padding-bottom: 2%;
	}

	.infra_text {
		padding-left: 10%;
		padding-right: 10%;
		color: black;
		font-weight: bold;
		z-index: +1;
	}

	.grid {
		/*display: none !important;*/
		/*opacity: 0;*/
	}

	.left_car {
		display: none;
		height: auto;
		overflow: hidden;
	}

	.right_car {
		width: 100%;
		height: auto;
		overflow: hidden;
		padding-right: 2%;
	}

	.careers {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.formdesign1 input {
		width: 100%;
		overflow: hidden;
		border: 1px solid blue;
		text-align: center;
		border-radius: 3px;
		font-size: 1rem;
	}

	.formdesign1 textarea {
		width: 100%;
		margin-left: 0%;
		margin-right: 0%;
	}

	.inova {
		height: auto;
		overflow: hidden;
	}

	.inova_right {
		display: none;
	}

	.inova_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.inova_text {
		width: 90%;
		height: inherit;
		font-weight: bold;
	}


	.corp_right {
		display: none;
	}

	.corp_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.left_loca {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.right_loca {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.mul_cap {
		padding-right: 1%;
	}

	.mul_cap strong {
		margin-left: 4% !important;
		font-size: 1.1rem !important;
	}

	.formdesign input {
		width: 92% !important;
	}

	.formdesign textarea {
		width: 92% !important;
		margin-left: 0.87rem;
	}

	.mapl1 {
		display: none;
	}

	.mapr1 {
		display: none;
	}

	.mapl2 {
		display: none;
	}

	#pro_image {
		display: none;
	}

	.pro_info table {
		width: 90%;
		margin: auto;
		font-size: 1rem;
		overflow-x: auto !important;
		float: left;
	}

	.bx {
		left: 25%;
	}

	.bx1 {
		margin-left: 25%;
	}

	#ar {
		display: none !important;
	}

	div.conv-form-wrapper div.options div.option {
		display: block !important;
		width: 80% !important;
	}

	.carousel-cell-video {
		margin-top: 5%;
		height: 40vh;
		width: 90vh
	}

	iframe {
		border: 0;
		height: 50vh;
		width: 100vw;
	}
}

@media only screen and (min-width: 451px) and (max-width: 800px) {

	/* For tablet phones: */
	.menu {
		display: none;
	}

	.mapl1 {
		width: 50%;
	}

	.mapr1 {
		width: 50%;
	}

	.mapl2 {
		width: 50%;
	}

	.primary_font {
		/*Generally for Paragraphs */
		font-family: 'Ubuntu', sans-serif;
		font-size: 1.3rem;
	}

	.secondary_font {
		/*Generally for Headings */
		font-family: 'Roboto Slab', serif;
		font-size: 1.3rem;
	}

	.primary_button {
		width: 22vh;
		height: 10vh;
		background-color: #00008B;
		color: white;
		border-radius: 18px;
		border: 3px solid white;
		cursor: pointer;
	}

	.primary_button:hover {
		width: 22vh;
		margin: 10px;
		height: 10vh;
		font-weight: bold;
		background-color: white;
		color: #00008B;
		border-radius: 15px;
		border: 3px solid #00008B;
		cursor: pointer;
	}

	header {
		height: auto;
		overflow: hidden;
	}

	.ab_right {
		display: none;
	}

	.ab_left {
		width: 100vw;
		padding-right: 7%;
	}

	.text_about {
		width: 100%;
		padding-right: 5vh;
		height: auto;
		overflow: hidden;
	}

	#left_box {
		display: none;
	}

	#right_box {
		width: 100%;
	}

	.ab {
		background-image: url('../Images/indiamap_400.jpeg');
		opacity: 0.7;
		z-index: -1;
	}

	.ab_left {
		font-weight: bolder;
		color: black;
		z-index: 2;
		opacity: 1 !important;
	}

	.but_mob {
		display: none;
	}

	.prev {
		display: none;
	}

	.next {
		display: none;
	}

	.dot {
		display: none;
	}

	.col-sm-3 {
		display: inline-block;
		width: 30%;
		height: 30vh;
		color: white;
		margin-top: 10%;
	}

	.col-sm-3 .number {
		margin-top: 5%;
		margin-left: 5%;
		font-size: 40px;
		display: inline-block;
	}

	.stats {
		width: 100%;
		height: 300px;
		background: #009ee0;
		background-size: cover;
		background-repeat: no-repeat;
		opacity: 0.8;
		z-index: -1;
	}

	.row {
		width: 90%;
		height: inherit;
		margin: auto;
		padding: 10px;
	}

	.number {
		display: inline-block;
		flex-direction: row;
	}

	.f_logo {
		display: none;
	}

	.f-head {
		padding-left: 20%;
	}

	.f_para {
		padding-left: 20%;
	}

	.about1 {
		height: auto;
		background-image: url('../Images/aboutbg_400.jpeg');
	}

	#about_img {
		display: none;
	}

	#right_box {
		height: auto;
		overflow: hidden;
	}

	.why_right {
		display: none;
	}

	.why_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.why_text {
		padding-right: 3%;
		padding-bottom: 2%;
	}

	.excellence {
		height: auto !important;
		overflow: hidden;
	}

	.exe_left {
		display: none;
	}

	.exe_right {
		width: 100%;
		height: auto !important;
		overflow: hidden;
	}

	.exe_text {
		font-size: 1rem;
		padding-right: 3%;
		padding-bottom: 2%;
	}

	.infra_text {
		padding-left: 10%;
		padding-right: 10%;
		color: black;
		font-weight: bold;
		z-index: +1;
	}

	.grid {
		/*display: none !important;*/
		/*opacity: 0;*/
	}

	.left_car {
		display: none;
		height: auto;
		overflow: hidden;
	}

	.right_car {
		width: 100%;
		height: auto;
		overflow: hidden;
		padding-right: 2%;
	}

	.careers {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.formdesign1 input {
		width: 100%;
		overflow: hidden;
		border: 1px solid blue;
		text-align: center;
		border-radius: 3px;
		font-size: 1rem;
	}

	.formdesign1 textarea {
		width: 100%;
		margin-left: 0%;
		margin-right: 0%;
	}

	.inova {
		height: auto;
		overflow: hidden;
	}

	.inova_right {
		display: none;
	}

	.inova_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.inova_text {
		width: 90%;
		height: inherit;
		font-weight: bold;
	}


	.corp_right {
		display: none;
	}

	.corp_left {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.left_loca {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.right_loca {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.mul_cap {
		padding-right: 1%;
	}

	.mul_cap strong {
		margin-left: 4% !important;
		font-size: 1.1rem !important;
	}

	.formdesign input {
		width: 92% !important;
	}

	.formdesign textarea {
		width: 92% !important;
		margin-left: 0.87rem;
	}

	.mapl1 {
		display: none;
	}

	.mapr1 {
		display: none;
	}

	.mapl2 {
		display: none;
	}

	#pro_image {
		display: none;
	}

	.pro_info table {
		width: 90%;
		margin: auto;
		font-size: 1rem;
		overflow-x: auto !important;
		float: left;
	}

	.bx {
		left: 25%;
	}

	.bx1 {
		margin-left: 25%;
	}

	#ar {
		display: none !important;
	}

	.dropdown-content {
		display: none !important;
	}
}



@media only screen and (min-width: 800px) and (max-width: 1200px) {

	/* For Desktop phones: */
	.menu {
		display: none;
	}

	.mapl1 {
		width: 50%;
		height: 250px;
	}

	.mapr1 {
		width: 50%;
		height: 250px;
	}

	.mapl2 {
		width: 50%;
		height: 250px;
	}
}

@media only screen and (min-width: 1200px) {

	/* For Desktop phones: */
	.menu {
		display: none;
	}

	.col-md-4 {
		border-right: 0px dashed black;
		border-bottom: 1px dashed black;
		width: 50%;
		margin: auto auto;
	}

	.col-md-4:last-child {
		border-bottom: 0px dashed black;
	}

	.mapl1 {
		width: 50%;
		height: 250px;
	}

	.mapr1 {
		width: 50%;
		height: 250px;
	}

	.mapl2 {
		width: 50%;
		height: 250px;
	}
}


/*Responsive CSS Quires*/
/* ============ MOBILE ABOUT IMAGE FIX (WITH OPACITY OVERLAY) ============ */
@media (max-width: 768px) {
  .about1 {
    position: relative;
    background-image: url('../Images/about_mobile.png') !important; 
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    height: auto !important;
    min-height: 100vh;
  }

  /* Image ke upar halki white parat (overlay) */
  .about1::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(255, 255, 255, 0.10); /* 75% White, 25% Transparent */
    z-index: 0;
  }

  /* Text ko overlay ke upar laane ke liye */
  .text_about {
    position: relative;
    z-index: 1;
    background: transparent !important; /* White box hata diya */
    padding: 20px !important;
  }
  
  /* Text ko thoda aur clear karne ke liye halka sa shadow */
  .text_about p, .about-heading {
    text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.9);
  }
}

/* Chote mobile ke liye height fix */
@media (max-width: 450px) {
  .about1 {
    height: auto !important;
    min-height: 100vh !important;
    background-image: url('../Images/about_mobile.png') !important;
    background-size: cover !important;
    background-position: center !important;
  }
}