/* ===== CSS VARIABLES ===== */
:root {
  --color-primary: #000000;
  --color-secondary: #373435;
  --color-text: #f5f5f5;
  --color-accent: #fdbe14;
  --color-softgray: #999999;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 10px;
}

body {
  background: var(--color-primary);
  font-family: "Montserrat", sans-serif;
  font-size: 1.4rem;
  overflow-x: hidden;
}

ul {
  list-style: none;
}

a {
  text-decoration: none;
  font-size: 1.4rem;
  display: inline-block;
}

button {
  font-family: "Montserrat", sans-serif;
  font-size: 1.6rem;
}

h1,
h2,
h3,
h4,
h5,
h5 {
  font-family: "Montserrat", sans-serif;
  color: #fffafa;
}

h2 {
  font-size: 3.8rem;
}

h3 {
  font-size: 2.1rem;
  line-height: 1.4;
  margin-bottom: 1.2rem;
}

p {
  font-size: 1.6rem;
  line-height: 1.4;
}

input,
textarea {
  border: none;
  outline: none;
  font-family: "Montserrat", sans-serif;
}

/* Header Start */

#site-header {
  position: fixed;
  top: 0;
  width: 100%;
  padding: 2.4rem 0;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 1) 70%,
    rgba(0, 0, 0, 0)
  );
  z-index: 10;
}

/* Inner header */
.nav {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav-left {
  display: flex;
  flex: 1;
  align-items: center;
}

.nav-center {
  text-align: center;
}

.nav-right {
  display: flex;
  justify-content: end;
  align-items: center;
  flex: 1;
  gap: 2.1rem;
}

.nav-links {
  list-style: none;
  display: flex;
  gap: 1.6rem;
}

.nav-links a {
  color: white;
  text-decoration: none;
  font-size: 1.35rem;
  transition: color 0.3s;
  letter-spacing: 0.05rem;
}

.nav-links a:hover {
  color: var(--color-accent);
}

.site-logo {
  max-height: 4.5rem;
}

.site-logo span {
  color: var(--color-accent);
}

.site-logo img {
  width: 30rem;
}

.nav-right a {
  color: white;
  border-radius: 50%;
  font-size: 1.3rem;
  transition: color 0.3s;
}

.nav-right a:hover {
  color: var(--color-accent);
}

.menu-toggle {
  display: none !important;
  background: none;
  border: none;
  color: #fff;
  font-size: 2.1rem;
  cursor: pointer;
}

/* Header End */

/* Footer Start */

.footer {
  background-color: var(--color-secondary);
  color: #eee;
  padding: 70px 0 0  0 ;
  font-family: sans-serif;
}

.footer-container {
  display: grid;
  grid-template-columns: 3fr 1fr 1fr 2fr;
  gap: 100px;
}

.footer-column {
  flex: 1 1 220px;
}

.footer-column h4 {
  font-size: 18px;
  margin-bottom: 20px;
  color: #fff;
}

.footer-text {
    color: var(--color-softgray);
    font-size: 1.6rem;
    line-height: 1.8;
    font-weight: 500;
    margin-bottom: 1.2rem;
}

.f-contact > div {
  margin-bottom: 25px;
}

.f-contact-info {
  font-size: 1.6rem;
  margin-bottom: 10px;
  color: var(--color-softgray)
}

.f-contact-info a {
  font-size: 1.7rem;
}


.footer-column ul {
  list-style: none;
  padding: 0;
}

.footer-column ul li {
  margin: 15px 0;
}

.footer-column a {
  font-size: 1.6rem;
  color: var(--color-softgray);
  text-decoration: none;
}

.footer-column a:hover {
  color: #fff;
}

.footer-logo {
  max-height: 50px;
  margin-bottom: 25px;
}

.footer-socials  {
  margin-top: 25px;
}

.footer-socials a {
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  border-radius: 50%;
  margin-right: 5px;
  background: var(--color-softgray);
  color: var(--color-primary);
}

.footer-socials a:hover  {
  background: #fff;
  color: var(--color-primary);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  text-align: center;
  padding: 20px 0;
  font-size: 14px;
  border-top: 1px solid rgba(256,256,256,0.1);
  margin-top: 70px;
}

.footer-bottom p {
  color: var(--color-softgray);
  font-size: 1.5rem;
}

.footer-bottom a {
  color: var(--color-softgray);
  margin: 0 5px;
}

.footer-bottom a:hover {
  color: #fff;
}

/* Footer End */

/* Hero Section Start */
.hero-section {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 10rem;
  overflow: hidden;
  z-index: -1;
}

.hero-logo {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  transition: transform 0.4s linear, top 0.4s linear;
  pointer-events: none;
  z-index: 11;
}

.hero-logo::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 120%;
  height: 120%;
  background: rgba(0, 0, 0, 0.65); 
  filter: blur(20px); 
  /* border-radius: 100%;          */
  z-index: 0;
}

.hero-logo img {
  max-width: 70rem;
  height: auto;
  opacity: 0.9;
}

.swiper {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.swiper-slide img {
  /* height: 100px; */
  object-fit: cover;
}

.swiper-button-next,
.swiper-button-prev {
  display: none !important;
}

/* Hero Section End */

/* About Section Start */

.about-section {
  background: linear-gradient(to top, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0));
  padding: 50rem 0 10rem 0;
  margin-top: 90rem;
  z-index: 10;
  min-
}

.about-section.page {
  margin-top: 0;
  padding-top: 14.5rem;
}

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 4.8rem;
}

.about-heading {
  text-transform: capitalize;
  margin-bottom: 1.8rem;
}

.about-heading span {
  color: var(--color-accent);
}

.about-img {
  text-align: right;
}

.about-img img {
width: 100%;
}

.about-text {
  color: var(--color-softgray);
  font-size: 1.7rem;
  line-height: 1.7;
  font-weight: 500;
  margin-bottom: 1.2rem;
  text-align: justify;

}

.about-btn {
  background: var(--color-accent);
  color: var(--color-secondary);
  border: 2px solid var(--color-accent);
  padding: 0.7rem 1.4rem;
  border-radius: 3px;
  font-weight: 500;
  letter-spacing: 1px;
  transition: 0.2s ease-in-out;
  margin-top: 1.6rem;
}

.about-btn:hover {
  background: transparent;
  color: var(--color-accent);
}

.about-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-top: 2.4rem;
}

.about-feature-content {
  border: 1px solid rgba(256,256,256, 0.1);
  padding: 2.4rem 3.6rem;
}

.about-feature-content:nth-child(odd) {
  background: var(--color-secondary);
}

.about-feature-content img {
  width: 6rem;
  border-radius: 5px;
  margin-bottom: 1.8rem;
}

.about-feature-content h3 {
  color: #ddd;
  font-size: 1.8rem;
}

.about-feature-content p {
  font-size: 1.5rem;
  line-height: 1.7;
  color: var(--color-softgray);
  text-align: justify;
}

/* About Section End */

/* Why Us Section Start */
.why-us-section {
  padding: 9rem 0;
}

.why-us-heading h2 {
  text-align: left;
  margin-bottom: 3.6rem;
}

.why-us-heading span {
  color: var(--color-accent); /* example highlight color */
}

.why-us-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.why-us-content-box {
  display: flex;
  align-items: flex-start;
  gap: 5rem;
  padding: 4rem 4rem;
  border: 1px solid rgba(256,256,256,0.125);
  transition: transform 0.3s ease;
  border-collapse: collapse;
}

.why-us-content-box:nth-child(2),
.why-us-content-box:nth-child(3) {
  background: var(--color-secondary);
}

.why-us-icon img {
  width: 6.5rem;
  border-radius: 50%;
 filter: grayscale(100%);
  object-fit: contain;
}

.why-us-content h3 {
  margin: 0 0 10px;
  font-size: 1.8rem;
  color: #ddd;
}

.why-us-content p {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.7;
  color: var(--color-softgray);
  text-align: justify;
}

/* Why Us Section End */

/* Mission Section Start */
.mission-section {
  background: var(--color-secondary);
  padding: 9rem 0;
  text-align: center;
}

.mission-content h2 {
  margin-bottom: 1.8rem;
}

.mission-content h2 span {
  color: var(--color-accent);

}

.mission-content p {
  font-size:1.7rem;
  line-height: 1.8;
  color: var(--color-softgray);
  max-width: 65%;
  margin: auto;
}

/* Mission Section End */

/* Founder Section Start */
.founder-section {
  padding: 9rem 0;
  display: flex;
  align-items: center;
}

.founder-section.two {
    border-top: 1px solid rgba(256,256,256, 0.2);

}


.founder-grid.row {
  display: grid;
  align-items: center;
  justify-content: center;
}

.founder-grid.row1 {
  grid-template-columns: 3fr 2fr;
}
.founder-grid.row2 {
  grid-template-columns: 2fr 3fr;
}



.founder-grid img {
  width: 100%;
  border-radius: 1rem;
}


.founder-content {
  background: var(--color-secondary);
  padding: 5rem 6rem;
}

.founder-grid.row1 .founder-content {
  padding-right: 10rem;
  border-radius: 1rem 0 0 1rem;
}
.founder-grid.row2 .founder-content {
  padding-left: 10rem;
  border-radius: 0 1rem 1rem 0;
}

.founder-content h2 {
  font-size: 1.8rem;
  text-transform: capitalize;
  color: var(--color-accent);
  margin-bottom: 1.4rem;
}

.founder-content h3 {
  font-size: 2.1rem;
  font-weight: 500;
  margin-bottom: 1rem;
}

.founder-content p {
  color: var(--color-softgray);
  font-size: 1.6rem;
  line-height: 1.7;
  margin-bottom: 1.2rem;
  text-align: justify;
  
}

/* Founder Section End */


/* Counter Section Start */

.counter-section {
  background: radial-gradient(
    circle at center,
    rgba(50, 50, 50, 0.96) 0%,
    rgba(50, 50, 50, 0.96) 30%,
    rgba(0, 0, 0, 0.98),
    rgba(0, 0, 0, 0.98)
  );
}

.counter-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 9rem 0;
}

.counter-box:last-child {
  padding-bottom: 15rem;
}

.big-number {
  font-size: 21rem;
  font-weight: 700;
  color: #fff;
  -webkit-mask-image: linear-gradient(to bottom, white 30%, transparent 100%);
  mask-image: linear-gradient(to bottom, white 30%, transparent 100%);
}

.counter-subox {
  margin-top: -8.7rem;
  text-align: center;
  color: var(--color-softgray);
}

.label {
  font-size: 9rem;
  font-weight: 500;
}

.subtext {
  font-size: 3rem;
  font-weight: 500;
  margin-top: 0.5rem;
}

/* Counter Section End */

/* Contact Section Start */

.contact-section.page {
  padding: 15rem 0 5rem 0;
}

.contact-section {
  background: rgba(0, 0, 0, 0.95);
  padding: 5rem 0 10rem;
}

.contact-box {
  max-width: 50rem;
  margin: auto;
  text-align: center;
}

.contact-heading {
  margin-bottom: 3.2rem;
  color: white;
}

.contact-heading span {
  color: var(--color-accent);
  display: block;
}

.contact-form input {
  width: 100%;
  margin-bottom: 2.4rem;
  height: 5.4rem;
  padding: 2.4rem;
  border-radius: 7px;
  background: var(--color-secondary);
  font-size: 1.6rem;
  color: var(--color-softgray);
}

.contact-form textarea {
  width: 100%;
  background: var(--color-secondary);
  margin-bottom: 1.4rem;
  height: 18rem;
  padding: 2.4rem;
  border-radius: 7px;
  font-size: 1.6rem;
  color: var(--color-softgray);
}

.contact-form button {
  background: var(--color-accent);
  padding: 1.2rem 2.8rem;
  border: 2px solid var(--color-accent);
  border-radius: 0.5rem;
  color: var(--color-secondary);
  font-size: 1.6rem;
  font-weight: 600;
  margin-top: 1rem;
  cursor: pointer;
}

.contact-form button:hover {
  background: transparent;
  color: var(--color-accent);
  transition: 0.2s ease-in;
}

.contact-page-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
}


.contact-page-grid img {
  width: 100%;
}


/* Contact Section End */

/* Contact Info Sections Start */

.cotact-info-section {
 background: var(--color-primary);
 padding: 7rem 0 12rem;
}

.contact-info-heading {
  text-align: center;
  margin-bottom: 3.6rem;
}

.contact-info-heading i {
  display: inline-block;
  color: var(--color-accent);
  font-size: 3.2rem;
  margin-bottom: 1rem;
}

.contact-info-heading h2 span {
  color: var(--color-accent);
}

.contact-info-heading a {
  color: var(--color-softgray);
  font-size: 1.8rem;
}

.contact-info-heading a:hover {
  color: var(--color-accent);
}

.contact-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  color: #fff;
}

.contact-info-box {
  text-align: center;
  padding: 3.6rem 1.8rem;
}

.contact-info-box:nth-child(odd) {
  background: var(--color-secondary);
}

.contact-info-box i {
  display: inline-block;
  font-size: 2.1rem;
  width: 3.6rem;
  height: 3.6rem;
  line-height: 3.6rem;
  text-align: center;
  border-radius: 100%;
  background: var(--color-accent);
  color: var(--color-secondary);
  margin-bottom: 1.2rem;
}
.contact-info-box h3 {
  font-size: 2.1rem;
  margin-bottom: 1.8rem;
}

.contact-info-box p, .contact-info-box a {
  font-size: 1.7rem;
  color: var(--color-softgray);
}

.contact-info-box a:hover {
  color: var(--color-accent);
}


/* Contact Info Sections End */


/* Services Section Start */

.service-section {
  background: rgba(0, 0, 0, 0.9);
}

.service-section.page {
  padding: 12rem 0 5rem 0;
}

.service-grid {
  display: grid;
  grid-template-columns: 1fr 3fr;
}

.service-grid-heading {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.service-grid-heading > div {
  padding: 0 5rem;
}


.service-grid-heading h2 {
    position: relative;
    margin-bottom: 3.6rem;
}

.service-grid-heading h2 span {
  color: var(--color-accent);
  display: block;

}



.service-grid-heading h2::before,
.service-grid-heading h2::after {
  content: "";
  position: absolute;
  height: 3px;
  background-color: var(--color-accent); /* goldish yellow */
  bottom: -10px;
  width: 50px;
}

.service-grid-heading::before {
  left: 0;
}

.service-grid-heading::after {
  right: 0;
}

.service-grid-heading p {
  color: var(--color-softgray);
  font-size: 1.6rem;
  line-height: 1.7;
}

.service-grid-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.service-box h3 {
  color: #ddd;
  font-size: 1.8rem;
  margin-bottom: 1rem;
}

.service-box {
  padding: 5rem 8rem;
  background: var(--color-secondary);
    transition: 0.2s ease-in;
}

.service-box.black {
  background: var(--color-primary);

}

.service-box:hover {
  transform: scale(1.04);
}


.service-box p {
  color: var(--color-softgray);
  line-height: 1.8;
  font-size: 1.5rem;
}

.service-box a {
  background: var(--color-accent);
  color: var(--color-secondary);
  padding: 0.8rem 1.2rem;
  font-weight: 500;
  letter-spacing: 0.05rem;
  margin-top: 2.4rem;
  border-radius: 3px;
  border: 1px solid var(--color-accent);
}

.service-box a:hover {
  background: transparent;
  color: var(--color-accent);
  transition: 0.2s ease-in;
}

/* Services Section End */


/* Single Service Section Start */

.single-service-page {
  padding: 15rem 0 10rem 0;
}

.single-service-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 5rem;
}

.single-service-grid-content h2 {
  margin-bottom: 1.8rem;
  font-size: 3.2rem;
}

.single-service-grid-content h2 span {
  color: var(--color-accent);
}

.single-service-grid-content h3 {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 0.5rem;
  color: #ddd;
}

.single-service-grid-content p {
  font-size: 1.7rem;
  color: var(--color-softgray);
  text-align: justify;
  line-height: 2;
  width: 90%;
}

.single-service-grid-content .cta-button {
  display: inline-block;
  margin-top: 30px;
  padding: 10px 24px;
  background-color: var(--color-accent); /* or your brand color */
  color: var(--color-primary);
  border: 2px solid var(--color-accent);
  text-decoration: none;
  border-radius: 3px;
  font-weight: 600;
  transition: background-color 0.3s ease;
}

.single-service-grid-content .cta-button:hover {
  background-color: transparent;
  color: var(--color-accent);
}

.single-service-grid-features {
  margin-top: 3.6rem;
}


.single-service-grid-image img {
  width: 100%;
}


.single-service-feature-section {
  padding: 9rem 0;
  background: var(--color-primary);
}

.single-service-feature-heading {
  text-align: center;
  margin-bottom: 3.2rem;
}

.single-service-feature-heading h2 {
  font-size: 2.8rem;
  line-height: 1.3;
  text-transform: capitalize;
}

.single-service-feature-heading h2 span {
  color: var(--color-accent);
}

.single-service-features-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

.single-service-features-grid img {
  background: lightgray;
  height: 90px;
  border-radius: 50%;
  margin-bottom: 10px;
}
.single-service-features-grid li a {
  display: block;
  width: 100%;
  height: 100%;
}

.single-service-features-grid li:nth-child(even) {
  background: var(--color-primary);
}


.single-service-features-grid li:nth-child(odd) {
  background: var(--color-secondary);
}
/* 
.single-service-features-grid li:nth-child(even) {
  background: var(--color-secondary);
} */


.single-service-features-grid li:last-child {
  grid-column: span 3;
}

.single-service-features-grid li  {
  padding: 3rem 2.4rem;
  text-align: center;
  margin-bottom:0;
  border: 1px solid rgba(256,256,256,0.1);
  transition: 0.3s ease-in-out;
  z-index: 7;
}



.single-service-features-grid li h3 {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: var(--color-softgray);
}

.single-service-features-grid li p {
  font-size: 1.5rem;
  line-height: 1.6;
}

.single-service-features-grid li p strong {
  color: #fff;
}


.single-service-features-grid li:hover {
  transform: scale(1.05);
  background: var(--color-accent);
  z-index: 9;
}

.single-service-features-grid li:hover h3 {
  color: var(--color-primary);
}



/* Single Service Section End */



/* Clients Section Start */

.clients-section {
  padding: 10rem 0;
  background: rgba(0,0,0, 0.93);
  overflow-x: hidden;
  /* background-image: linear-gradient(120deg, var(--color-primary),var(--color-secondary)) ; */
}

.clients-heading {
  text-align: center;
  margin-bottom: 3.6rem;
}

.clients-heading span {
  color: var(--color-accent);
}

.clients-swiper img {
  border-radius: 5px;
}

/* Clients Section End */




/* Pivacy & Cookies Page Start */
.privacy-section {
  padding: 13rem 0 5rem 0;
}

.privacy-heading {
  border-bottom: 1px solid rgba(256, 256, 256, 0.2);
  padding-bottom: 2rem;
  margin-bottom: 3.2rem;
}

.privacy-heading h1 {
  font-size: 2.5rem;
  font-weight: 500;
  letter-spacing: 0.015rem;
}

.privacy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2.4rem;
}

.privacy-content-box {
  margin-bottom: 2.4rem;
}

.privacy-content-box h2 {
  font-size: 1.5rem;
  letter-spacing: 0.01rem;
  margin-bottom: 0.5rem;
  font-weight: 500;
}

.privacy-content-box p,
li {
  color: var(--color-softgray);
  font-size: 1.4rem;
  line-height: 1.6;
  margin-bottom: 1rem;
}

.privacy-content-box ul {
  list-style: circle;
  margin-left: 2.4rem;
}

.privacy-table {
  margin-bottom: 2.4rem;
  border-collapse: collapse;
}

.privacy-table th,
td {
  border: 1px solid rgba(256, 256, 256, 0.3);
  padding: 1.4rem 1.4rem;
}

.privacy-table th {
  color: #fff;
  text-align: left;
  font-weight: 500;
  letter-spacing: 0.025rem;
  font-size: 1.4rem;
}

.privacy-table td {
  color: var(--color-softgray);
  font-size: 1.4rem;
  line-height: 1.5;
}

.cookies-left {
  display: grid;
  grid-template-columns: 3fr 2fr 2fr 2fr;
  padding: 2rem 0;
  gap: 3.6rem;
  border-bottom: 1px solid rgba(256,256,256, 0.2);
}

.cookies-right {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 6rem 0 0 0;
  gap: 2.4rem;
}

.cookies-right h2 {
  margin-bottom:1.2rem;
}

/* Pivacy Page End */






/* Offcanvas Start */


.offcanvas {
  position: fixed;
  top: -150%;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #000;
  color: #fff;
  z-index: 99999;
  transition: top 0.4s ease-in-out;
  padding: 20px;
  box-sizing: border-box;
}

/* Show when active */
.offcanvas.active {
  top: 0;
}

/* Header with logo and close */
.offcanvas-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.offcanvas-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}

/* Logo */
.offcanvas-logo {
  max-height: 5rem;
  margin-bottom: 2.4rem;
}

.close-btn {
  background: none;
  border: none;
  font-size: 2rem;
  color: white;
  cursor: pointer;
}

.offcanvas-nav {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  gap: 2.8rem;
  text-align: center;
}

.offcanvas-nav a {
  color: white;
  text-decoration: none;
  font-size: 1.4rem;
  transition: color 0.2s;
}

.offcanvas-nav a:hover {
  color: #fdbe14; /* optional hover color */
}
 /* Floating*/ 

 .floating {
  position: fixed;
  bottom: 70px;
  right: 15px;
   z-index: 99;
 }

/* Scroll To Top start*/
#scrollToTopBtn {
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 30px;
  font-size: 20px;
  background-color: var(--color-accent);
  color: var(--color-secondary);
  border: none;
  outline: none;
  padding: 12px 16px;
  border-radius: 50%;
  cursor: pointer;
  display: none;
  transition: opacity 0.3s, visibility 0.3s;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  margin-bottom: 20px;
}

#scrollToTopBtn:hover {
  background-color: #fff;
}

/* Scroll To Top End */

/* Whatsapp Button Start */
.whatsapp-float i {
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 35px;
  text-align: center;
  background-color: #25d366;
  color: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  transition: background 0.3s;
  border-radius: 50%;
  animation: pulse 2s infinite;
}

.whatsapp-float i:hover {
  background-color: #1ebe5b;
}


@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(37, 211, 102, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}


/* Whatsapp Button End*/

/* Blogs Page Start */
.blogs-page {
  padding: 150px 0 70px 0;
  background-color: var(--color-primary);
}

.section-title {
  text-align: center;
  font-size: 24px;
  margin-bottom: 40px;
}
.section-title span {
  color: var(--color-accent); /* Accent color */
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
}

.blog-card {
  background: var(--color-secondary);
  border-radius: 7px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
  transition: transform 0.3s ease;
}
.blog-card:hover {
  transform: translateY(-5px);
}

.blog-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.blog-content {
  padding: 20px;
}


.blog-content h3 {
  color: #ddd;
  font-size: 20px;
  margin-bottom: 10px;
}

.blog-date {
  font-size: 14px;
  color: #888;
  margin-bottom: 10px;
}

.blog-excerpt {
  font-size: 15px;
  line-height: 1.5;
  color: var(--color-softgray);
  margin-bottom: 15px;
}

.read-more {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: none;
  transition: color 0.2s;
}

.read-more:hover {
  color: #fff;
}

/* Blogs Page End */

/* Single Blog Page Start */

.single-blog-page {
  padding: 150px 0 70px 0;
}

.single-blog-header {
  text-align: center;
  margin-bottom: 30px;
}

.single-blog-header h1 {
  font-size: 32px;
  margin-bottom: 10px;
}

.blog-date {
  font-size: 14px;
  color: #999;
}

.single-blog-image img {
  width: 100%;
  max-height: 450px;
  object-fit: cover;
}

.single-blog-content {
  font-size: 15px;
  color: var(--color-softgray);
  background: var(--color-secondary);
  padding: 50px 50px;
}

.single-blog-content p {
  line-height: 1.8;
  text-align: justify;
}

.single-blog-content h3 {
  font-size: 20px;
  margin-top: 40px;
  margin-bottom: 10px;
  color: #ddd;
}

.blog-back-link {
  margin-top: 40px;
  text-align: center;
}

.blog-back-link .cta-button {
  display: inline-block;
  padding: 12px 24px;
  background-color: #007BFF;
  color: white;
  text-decoration: none;
  border-radius: 6px;
  font-weight: 600;
}

.blog-back-link .cta-button:hover {
  background-color: #0056b3;
}


/* Single Blog Page End */


/*career css */

    /*body {*/
    /*  margin: 0;*/
    /*  font-family: 'Poppins', sans-serif;*/
    /*  background-color: #000;*/
    /*  color: #fff;*/
    /*}*/

    .career-section {
      padding: 40px 20px;
    }

    .career-section .career-heading {
      font-size: 2.5rem;
      color: #fff;
      text-align: center;
      margin-bottom: 40px;
    }

    .career-section .career-heading span {
      color: #ffc107;
    }

    .career-form-wrapper {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 40px;
      flex-wrap: wrap;
    }

    .career-image {
      flex: 1;
      min-width: 300px;
      text-align: center;
    }

    .career-image img {
      width: 100%;
      max-width: 400px;
      height: auto;
      border-radius: 12px;
    }

    .career-form-box {
      flex: 1;
      min-width: 300px;
      /*background-color: #1e1e1e;*/
      padding: 30px;
      border-radius: 12px;
    }

    .career-form-box form {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      margin-top: 20px;
      justify-content: flex-end;
    }

    .career-form-group {
      display: flex;
      flex-direction: column;
      width: calc(50% - 10px);
    }

    .career-form-group-full {
      width: 100%;
    }

    label {
      margin-bottom: 5px;
      font-weight: 600;
      color: #fff;
      /*font-size: 0.95rem;*/
    }

    input, textarea {
      padding: 14px;
      border: none;
      border-radius: 8px;
      background-color: #2e2e2e;
      color: #fff;
      font-size: 1rem;
      font-family: 'Poppins', sans-serif;
    }
    /*#current-salary{*/
    /*    background-color: #2e2e2e;*/
    /*}*/

    textarea {
      resize: none;
      line-height: 1.3rem;
      height: 50px;
    }

    button {
      background-color: #ffc107;
      border: none;
      padding: 14px;
      /*font-size: 1rem;*/
      font-weight: bold;
      color: #000;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.3s ease;
      width: 100%;
      font-family: 'Poppins', sans-serif;
    }

    button:hover {
      background-color: #e6ac00;
    }

    ::placeholder {
      /*color: #bbb;*/
      font-family: 'Poppins', sans-serif;
      font-size: 1rem;
    }

    @media (max-width: 900px) {
      .career-form-wrapper {
        flex-direction: column;
        align-items: center;
      }

      .career-form-group {
        width: 100%;
      }

      .career-form-box form {
        justify-content: center;
      }
    }













