/* * {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
   font-family: 'Segoe UI', sans-serif;
}

body {
   background: #010e2c;
   color: white;
}

header {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
   padding: 20px 5%;
   background: #000814;
}

.logo {
   color: orange;
   font-weight: bold;
   font-size: 22px;
   line-height: 1;
}

.logo span {
   font-size: 14px;
   color: white;
}

nav {
   display: flex;
   flex-wrap: wrap;
   gap: 15px;
   margin-top: 10px;
}

nav a {
   color: white;
   text-decoration: none;
   font-weight: 600;
}

nav a:hover {
   text-decoration: underline;
}

main {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   padding: 40px 5%;
   gap: 40px;
}

.left,
.right {
   flex: 1 1 450px;
   min-width: 300px;
}

.left h1 {
   font-size: 36px;
   color: #ffcc00;
   margin-bottom: 20px;
}

.left p {
   font-size: 16px;
   line-height: 1.6;
   margin-bottom: 20px;
}

.contact-btn {
   background: white;
   color: black;
   padding: 12px 24px;
   border-radius: 8px;
   border: none;
   cursor: pointer;
   font-weight: bold;
}

.right {
   background: white;
   color: black;
   padding: 30px;
   border-radius: 12px;
}

form {
   display: flex;
   flex-direction: column;
}

form label {
   margin: 15px 0 5px;
   font-weight: 600;
}

select,
textarea {
   padding: 12px;
   border: 1px solid #ccc;
   border-radius: 8px;
   margin-bottom: 10px;
   width: 100%;
}

.formm-input {
   padding: 12px;
   border: 1px solid #ccc;
   border-radius: 8px;
   margin-bottom: 10px;
   width: 100%;
}

.phone-prefix {
   width: 100%;
   margin-bottom: 5px;
}

.checkbox-group {
   display: flex;
   flex-direction: column;
}

textarea {
   resize: vertical;
   height: 120px;
}

.register-btn {
   background: orange;
   color: white;
   border: none;
   padding: 14px;
   border-radius: 8px;
   font-size: 16px;
   cursor: pointer;
   margin-top: 10px;
}


@media (max-width: 768px) {
   header {
      flex-direction: column;
      align-items: flex-start;
   }

   nav {
      justify-content: flex-start;
      margin-top: 10px;
   }

   main {
      flex-direction: column;
      padding: 30px 5%;
   }

   .left h1 {
      font-size: 28px;
   }

   .left p {
      font-size: 15px;
   }
}

@media (max-width: 480px) {
   .left h1 {
      font-size: 24px;
   }

   form label {
      font-size: 14px;
   }

   .register-btn {
      font-size: 15px;
      padding: 12px;
   }
}

 */




body {
   margin: 0;
   padding: 0;
   /* background: url('your-background-image.jpg') no-repeat center center; */
   /* background: #010e2c; */
   background-size: cover;
   font-family: 'Segoe UI', sans-serif;
}

/* NAVBAR */
/* .navbar {
   background-color: rgba(0, 0, 0, 0.8);
}

.navbar-nav .nav-link {
   color: white;
   font-weight: 600;
}

.navbar-nav .nav-link.active {
   color: yellow;
} */



.navbar {
   background-color: rgba(0, 0, 0, 0.8);
}

.navbar-nav .nav-link {
   color: white;
   font-weight: 600;
   transition: color 0.3s;
}

.navbar-nav .nav-link:hover {
   color: yellow;
}

.navbar-nav .nav-link.active {
   color: black;
   background-color: white;
   border-radius: 8px;
   width: 100px;
   text-align: center;
   text-decoration: none;
}





/* MAIN SECTION */
.hero {
   min-height: 100vh;
   display: flex;
   align-items: center;
   color: white;
   padding: 60px 20px;
   /* background: #010e2c; */

   background: url(./Assets/Img/arappormedianetworkMain_Img.jpg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
}

.hero h1 {
   font-size: 2.8rem;
   font-weight: 700;
   color: #ffcc00;
}

.hero p {
   font-size: 1.1rem;
   max-width: 500px;
}

.contact-btn {
   background: #ffcc00;
   color: #FFFFFF;
   border-radius: 10px;
   padding: 12px 24px;
   font-weight: bold;
   border: none;
}


/* FORM */
.report-form {
   width: 89%;
   background: white;
   padding: 30px;
   border-radius: 12px;
   box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

.report-form .formm-headerTxt {
   font-size: 14px;
   font-weight: 500;
   color: #000;
}

.report-form input,
.report-form textarea,
.report-form select {
   border-radius: 6px;
   font-size: 0.8rem;
}

.report-form input::placeholder {
   font-size: 12px;
   font-weight: 500;
   letter-spacing: 1px;
}

.report-form .formm-prblmTxt {
   resize: none;
   height: 90px;
}

.report-form .formm-prblmTxt::placeholder {
   font-size: 12px;
   font-weight: 500;
   letter-spacing: 1px;
}

.report-form label {
   font-weight: 600;
   color: #000;
   margin-bottom: 5px;
}

.checkbox-label {
   font-size: 14px;
   font-weight: bold;
}

.submit-btn {
   background-color: #ffa500;
   color: white;
   font-weight: bold;
   border: none;
   border-radius: 5px;
   padding: 12px;
   width: 100%;
}

@media (max-width: 768px) {
   .hero h1 {
      font-size: 2rem;
   }
}



/* <<<<---- Videoss pageee ---->>>>> */


.news-card {
   background-color: #0e2a52;
   color: white;
   border: none;
   background: transparent;
}

.news-image {
   border-radius: 8px;
   position: relative;
   overflow: hidden;
}

.vdnews-title {
   font-weight: 600;
   font-size: 15px;
   margin-top: 15px;
   color: #000;
}

@media (max-width: 576px) {
   .news-title {
      font-size: 1rem;
   }
}



/* <<<<---- Reels sectionn pageee ---->>>>> */

#reels-section {
   padding: 40px 30px;
   background-color: #f4f8fc;
   font-family: 'Segoe UI', sans-serif;
}

#reels-section .news-card {
   border-radius: 10px;
   overflow: hidden;
   position: relative;
   background-color: #fff;
}

#reels-section .news-img {
   width: 100%;
   height: auto;
   display: block;
}

.overlay-info {
   position: absolute;
   bottom: 0;
   background: rgba(255, 255, 255, 0.9);
   padding: 15px;
   width: 80%;
}

.date-badge {
   display: inline-flex;
   align-items: center;
   background: white;
   padding: 6px 12px;
   border-radius: 20px;
   font-size: 0.8rem;
   font-weight: 500;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.category {
   background-color: #007bff;
   color: #fff;
   font-size: 0.75rem;
   font-weight: 600;
   padding: 4px 10px;
   border-radius: 5px;
   margin-right: 8px;
}

.news-title {
   font-size: 1rem;
   font-weight: 600;
   margin-top: 10px;
   color: #0d1b39;
}

.trending-title {
   font-size: 1.1rem;
   font-weight: bold;
}

.trending-card {
   display: flex;
   gap: 10px;
   margin-bottom: 15px;
}

.trending-card img {
   width: 60px;
   height: 60px;
   object-fit: cover;
   border-radius: 6px;
}

.trending-date {
   font-size: 0.75rem;
   color: #666;
   display: flex;
   align-items: center;
}

.trending-news-title {
   font-size: 0.85rem;
   font-weight: 600;
   color: #0d1b39;
}

.news-section {
   margin-top: 40px;
}






/* <<<<---- About pageee / Seperate page ---->>>>> */


.about-section {
   background-color: #f3f3f8;
   font-family: Arial, sans-serif;
   display: flex;
   flex-wrap: wrap;
   height: 160vh;
   overflow: hidden;
   padding: 40px;
   gap: 20px;
}

.about-left {
   flex: 1;
   min-width: 200px;
}

.about-title {
   font-weight: bold;
   font-size: 4rem;
}

.media-dot-net {
   color: #e5006e;
}

.about-description {
   font-size: 1.3rem;
   color: #333;
   /* margin-top: 10px; */
}

.about-descriptionList {
   font-size: 1.2rem;
   color: #333;
   margin-top: 14px;
}

.about-right {
   flex: 1;
   display: flex;
   gap: 20px;
   overflow: hidden;
   /* min-height: 500px; */
}

.scroll-column {
   flex: 1;
   overflow: hidden;
   position: relative;
   height: 100%;
}

.scroll-column img {
   width: 100%;
   object-fit: cover;
   border-radius: 12px;
   margin-bottom: 20px;
}

.scroll-up,
.scroll-down {
   display: flex;
   flex-direction: column;
   animation-timing-function: linear;
   animation-iteration-count: infinite;
}

.scroll-up {
   animation-name: scrollUp;
   animation-duration: 20s;
}

.scroll-down {
   animation-name: scrollDown;
   animation-duration: 20s;
}

@keyframes scrollUp {
   0% {
      transform: translateY(0);
   }

   100% {
      transform: translateY(-50%);
   }
}

@keyframes scrollDown {
   0% {
      transform: translateY(-50%);
   }

   100% {
      transform: translateY(0);
   }
}

/* @media (max-width: 768px) {
   .about-section {
      flex-direction: column;
      height: auto;
      padding: 20px;
   }

   .about-right {
      flex-direction: column;
   }

   .scroll-column {
      height: 300px;
   }

   .about-title {
      font-size: 2rem;
   }
} */



/* ✅ Responsive Design */
@media (max-width: 1024px) {
  .about-section {
    flex-direction: column;
    align-items: center;
    height: auto;
    padding: 30px 20px;
  }

  .about-left,
  .about-right {
    flex: 1 1 100%;
  }

  .about-right {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
  }

  .scroll-column {
    flex: none;
    width: 45%;
    height: 280px;
  }

  .scroll-column img {
    height: 100%;
  }
}

@media (max-width: 768px) {
  .about-section {
    flex-direction: column;
    padding: 20px;
  }

  .about-title {
    font-size: 2rem;
  }

  .about-description {
    font-size: 1rem;
  }

  .about-descriptionList {
    font-size: 0.95rem;
  }

  .about-right {
    flex-direction: column;
    gap: 15px;
  }

  .scroll-column {
    width: 100%;
    height: 250px;
  }

  .scroll-up,
  .scroll-down {
    animation: none; /* Stop animation for small devices */
  }
}

@media (max-width: 480px) {
  .about-section {
    padding: 15px;
    gap: 20px;
  }

  .about-title {
    font-size: 1.6rem;
  }

  .scroll-column {
    height: 200px;
  }
}







/* <<<< -----------About Evolution section ---->>>> */

.evolution-section {
   background-color: #d1cae5;
   padding: 40px 20px;
   position: relative;
   overflow: hidden;
}

.evolution-text {
   max-width: 700px;
   color: #000;
   font-size: 1.6rem;
   font-weight: 400;
   font-family: Arial, sans-serif;
}

.highlight-line {
   height: 4px;
   width: 160px;
   background: linear-gradient(to right, #e5006e, #6c63ff);
   border-radius: 4px;
   margin: 20px 0;
}

.background-pattern {
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
   height: 100%;
   background: url('./Assets/Img/aboutDNAbg_img.png') no-repeat center center;
   background-size: cover;
   pointer-events: none;
}

@media (max-width: 768px) {
   .evolution-text {
      font-size: 1rem;
   }

   .background-pattern {
      display: none;
   }
}


/* <<<<---- Aboutt Info Cards section ---->>>>> */

.aboutInfo-section {
   padding: 70px 20px;
   background-color: #f0ebfc;
   font-family: Arial, sans-serif;
}

.section-title {
   font-weight: bold;
   font-size: 2rem;
   text-align: center;
   margin-bottom: 35px;
}

.section-title .dot {
   color: #e5006e;
}

.info-card {
   background: radial-gradient(circle at 10px 10px, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
      #ebdff7;
   border: none;
   border-radius: 20px;
   padding: 20px;
   height: 100%;
   color: #111;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.info-card .infoCard-Header {
   font-size: 1.3rem;
   font-weight: "600";
   color: #000;
   margin-bottom: 15px;
}

.info-card .infoCard-Desc {
   font-size: 1.1rem;
   color: #333;
   line-height: 1.6;
   margin-top: 1rem;
}

@media (max-width: 767.98px) {
   .section-title {
      font-size: 1.75rem;
   }
}



/* <<<<---- Aboutt Leadership sectionn pageee ---->>>>> */


.leadership-section {
   background-color: #f0ebfc;
   /* background-color: #ebe7f2; */
   font-family: Arial, sans-serif;
   padding: 60px 20px;
   text-align: center;
}

.leadership-title {
   font-size: 3.8rem;
   font-weight: bold;
   margin-bottom: 40px;
}

.leadership-title .dot {
   color: #e5006e;
}

.leader-card {
   border-radius: 16px;
   padding: 30px 20px;
   text-align: center;
   height: 100%;
}

.leader-card img {
   max-width: 100%;
   height: auto;
   border-radius: 12px;
   margin-bottom: 20px;
}

.leader-name {
   font-weight: bold;
   font-size: 1.1rem;
   color: #2e00c2;
   text-decoration: underline;
   margin-bottom: 5px;
   display: inline-block;
}

.leader-role {
   color: #222;
   font-size: 1rem;
}

@media (max-width: 767.98px) {
   .leadership-title {
      font-size: 1.75rem;
   }
}


/* <!-- <<<<---- Aboutt page Call to Action sectionn pageee ---->>>>> --> */

.cta-section {
   background-color: #ec0e66;
   background-image:
      radial-gradient(circle at center,
         transparent 0%,
         rgba(255, 255, 255, 0.1) 2%,
         transparent 3.5%,
         transparent 7%,
         rgba(255, 255, 255, 0.1) 8.5%,
         transparent 10%,
         transparent 14%,
         rgba(255, 255, 255, 0.1) 15.5%,
         transparent 17%,
         transparent 21%,
         rgba(255, 255, 255, 0.1) 22.5%,
         transparent 24%,
         transparent 28%,
         rgba(255, 255, 255, 0.1) 29.5%,
         transparent 31%);
   background-repeat: no-repeat;
   background-size: cover;
   color: white;
   text-align: center;
   padding: 100px 20px;
   position: relative;
}

.cta-HeadTxt {
   font-size: 2.4rem;
   font-weight: 700;
   line-height: 1.5;
   margin-bottom: 10px;
   color: #ffa500;
}

.cta-text {
   font-size: 1.9rem;
   font-weight: 700;
   line-height: 1.5;
   margin-bottom: 40px;
}

.cta-btn {
   font-size: 1rem;
   font-weight: 600;
   padding: 12px 24px;
   border: 2px solid white;
   border-radius: 999px;
   color: white;
   background: transparent;
   display: inline-flex;
   align-items: center;
   gap: 8px;
   transition: all 0.3s ease;
   text-decoration: none;
}

.cta-btn:hover {
   background-color: white;
   color: #ec0e66;
}

.cta-btn svg {
   width: 1.2em;
   height: 1.2em;
}

@media (max-width: 767.98px) {
   .cta-text {
      font-size: 1.75rem;
   }
}


/* <<<< ======= Service Raise your voice section ======= >>>>>> */

.ctaaa-section {
   background: url("./Assets/Img/raiseVoicebg_Img.jpg") no-repeat center center/cover;
   min-height: 300px;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   padding: 60px 20px;
   color: white;
   position: relative;
}

.ctaaa-section::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /* background: rgba(0, 0, 0, 0.5); */
   z-index: 1;
}

.ctaa-Content {
   position: relative;
   z-index: 2;
   max-width: 1000px;
}

.ctaa-Content h1 {
   font-size: 2rem;
   margin-bottom: 15px;
}

.ctaa-Content p {
   font-size: 1.6rem;
   margin-bottom: 20px;
   line-height: 1.5;
}

.ctaa-Content button {
   background: #f5a623;
   color: #fff;
   border: none;
   padding: 10px 24px;
   font-size: 1.1rem;
   font-weight: 600;
   border-radius: 5px;
   cursor: pointer;
   transition: 0.3s;
   margin-top: 20px;
}

.ctaa-Content button:hover {
   background: #d48a1c;
}

@media (min-width: 767.98px) {
   .ctaa-Content h1 {
      font-size: 2.5rem;
   }

   .ctaa-Content p {
      font-size: 0.9rem;
      text-align: justify;
   }
}

@media (min-width: 1200px) {
   .ctaa-Content h1 {
      font-size: 3rem;
   }

   .ctaa-Content p {
      font-size: 1.5rem;
   }
}


/* <<<< ======= Service Main pageee ======= >>>>>> */


/* #service-Main .container {
   max-width: 1140px;
   margin: auto;
   padding: 0 15px;
} */

.hero-section {
   background-color: #3d0ca6;
   border-radius: 50px;
   padding: 55px 50px;
   position: relative;
   overflow: hidden;
   color: white;
   border-bottom: 10px solid #f0205e;
}

.hero-section::before {
   content: '';
   position: absolute;
   left: -10%;
   top: -20%;
   width: 120%;
   height: 150%;
   background: url('https://www.transparenttextures.com/patterns/cicada-stripes.png') repeat;
   opacity: 0.1;
   z-index: 0;
}

.hero-content {
   position: relative;
   z-index: 1;
}

.hero-title {
   font-weight: 500;
   font-size: 3.4rem;
   line-height: 1;
}

.hero-description {
   font-size: 1.3rem;
   margin-top: 1rem;
   line-height: 1.6;
}

.btn-custom {
   display: inline-flex;
   align-items: center;
   border: 2px solid white;
   border-radius: 30px;
   padding: 5px 15px;
   color: white;
   background-color: transparent;
   font-weight: 600;
   text-decoration: none;
   transition: all 0.3s ease;
   margin-top: 20px;
}

.btn-custom .circle {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   background-color: #f0205e;
   border-radius: 50%;
   width: 32px;
   height: 32px;
   margin-left: 10px;
   transition: background-color 0.3s ease;
}

.btn-custom .arrow-icon {
   width: 18px;
   height: 18px;
   color: #ffffff;
   transition: color 0.3s ease;
}

.btn-custom:hover {
   background-color: white;
   color: #f0205e;
}

.btn-custom:hover .circle {
   background-color: #f0205e;
}

.btn-custom:hover .arrow-icon {
   color: white;
}


.hero-image {
   border-radius: 0 30px 30px 0;
   max-width: 90%;
   height: auto;
}

@media (max-width: 991.98px) {
   .hero-title {
      font-size: 2.4rem;
   }

   .hero-section {
      padding: 40px 30px;
   }
}

@media (max-width: 767.98px) {
   .hero-section {
      border-radius: 30px;
      padding: 30px 20px;
      text-align: center;
   }

   .hero-title {
      font-size: 2rem;
      text-align: left;
   }

   .hero-description {
      font-size: 1rem;
      text-align: left;
   }

   .hero-image {
      border-radius: 30px;
      margin-top: 30px;
      max-width: 100%;
   }

   .btn-custom {
      justify-content: center;
      padding: 10px 20px;
   }
}



/* <<!-- <<<<----Service  Demand Data sectionn pageee ---->>>>> --> */

#demand-data-section .bg-light-purple {
   background-color: #d1cae5;
   padding: 80px 40px;
}

#demand-data-section .sticky-tab {
   position: sticky;
   top: 100px;
   z-index: 2;
}

#demand-data-section .heading {
   font-size: 2rem;
   font-weight: 600;
}

.demandSide-Header {
   font-size: 1.2rem;
   font-weight: 600;
   color: #000;
   margin: 0;
}

.demandSide-Desc {
   font-size: 1.1rem;
   font-weight: 400;
   color: #333;
   line-height: 1.5;
   margin-top: 10px;
}

.tab-label {
   width: 100%;
   max-width: 305px;
   background-color: #e6005c;
   color: white;
   padding: 20px 10px;
   border-radius: 15px 0 0 15px;
   font-size: 1.6rem;
   font-weight: 600;
   display: inline-block;
}

.card-content {
   background-color: white;
   border-radius: 20px;
   border: 1px solid #eee;
   overflow: hidden;
}

.image-wrapper img {
   border-top: 1px solid #ddd;
   border-bottom-left-radius: 16px;
   border-bottom-right-radius: 16px;
   max-width: 100%;
   height: auto;
}

@media (max-width: 767.98px) {
   #demand-data-section .heading {
      font-size: 1.5rem;
   }

   .tab-label {
      font-size: 1.25rem;
      border-radius: 20px;
      padding: 15px;
      margin-bottom: 1rem;
      text-align: center;
      display: inline-block;
      width: 100%;
   }

   .demandSide-Header {
      font-size: 1.1rem;
   }

   .demandSide-Desc {
      font-size: 0.95rem;
   }

   #demand-data-section .bg-light-purple {
      padding: 40px 20px;
   }
}



/* <<<< ======= Blogg Main pageee ======= >>>>>> */




#blog-section {
   font-family: 'Segoe UI', sans-serif;
   background-color: #fff;
   color: #1a1a2e;
}

.blog-image {
   width: 100%;
   height: auto;
   border-radius: 5px;
}

.post-meta {
   font-size: 0.95rem;
   color: #555;
   margin-top: 15px;
}

.post-meta i {
   margin-right: 6px;
   color: #007bff;
}

.blog-title {
   font-weight: 700;
   font-size: 1.8rem;
   margin-top: 20px;
   margin-bottom: 10px;
   color: #150749;
}

.blog-desc {
   color: #6c757d;
   margin-bottom: 25px;
}

.learn-btn {
   background-color: #007bff;
   color: white;
   padding: 10px 25px;
   font-weight: 600;
   border-radius: 6px;
   border: none;
   transition: background 0.3s ease;
}

.learn-btn:hover {
   background-color: #0056b3;
}

.sidebar-heading {
   font-weight: 600;
   font-size: 1.2rem;
   color: #1a1a2e;
   margin-bottom: 15px;
   border-bottom: 1px solid #ccc;
   padding-bottom: 5px;
}

.category-item {
   position: relative;
   overflow: hidden;
   border-radius: 6px;
}

.category-img {
   width: 100%;
   height: 70px;
   object-fit: cover;
   border-radius: 6px;
}

.category-tag {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   background-color: #097bed;
   color: #fff;
   font-size: 0.75rem;
   padding: 1px 12px;
   border-radius: 20px;
   font-weight: 500;
}

.ad-box {
   margin-top: 40px;
}

.ad-box img {
   width: 100%;
   border-radius: 8px;
}

/* @media (max-width: 767.98px) {
   .blog-title {
      font-size: 1.5rem;
      text-align: justify;
   }

   .post-meta {
      text-align: center;
   }

   .blog-desc {
      text-align: justify;
   }

   .learn-btn {
      display: block;
      margin: 0 auto;
   }
} */


@media (max-width: 991.98px) {
   .sidebar-heading {
      margin-top: 2rem;
      text-align: center;
   }

   .category-tag {
      font-size: 0.75rem;
      padding: 3px 10px;
   }

   .category-img {
      height: 60px;
   }

   .blog-title {
      font-size: 1.25rem;
   }

   .blog-desc {
      font-size: 0.95rem;
   }

   .post-meta {
      font-size: 0.85rem;
      justify-content: center;
      gap: 1rem;
   }

   .learn-btn {
      width: 100%;
      text-align: center;
   }

   .ad-box img {
      margin-top: 2rem;
   }
}





/* <<<< ======= Contact Main pageee ======= >>>>>> */


.contacthero-section {
   background: linear-gradient(90deg, #003366, #004080);
   color: white;
   padding: 80px 20px;
   text-align: center;
}

.contacthero-section h1 {
   font-size: 3rem;
   font-weight: 700;
}

.contacthero-section p {
   font-size: 1rem;
   margin-top: 10px;
}

/* Form Section */
.contact-section {
   padding: 50px 20px;
   background-color: #fff;
}

.contact-section h2 {
   font-weight: 800;
   margin-bottom: 30px;
}

.form-control,
.form-select {
   background-color: #f8fafd;
   border: 1px solid #ccc;
   padding: 12px;
   font-size: 14px;
}

.form-control::placeholder {
   color: #bbb;
}

.form-control:focus,
.form-control:focus,
.form-control:focus {
   outline: none !important;
   box-shadow: none !important;
   border-color: #ccc !important;
}

.contsubmit-btn {
   /* width: "280px"; */
   background-color: #ff6b4d;
   color: white;
   border: none;
   padding: 10px 25px;
   font-weight: 600;
   border-radius: 4px;
   margin-top: 15px;
}

.submit-btn:hover {
   background-color: #e25a3b;
}





/* <<<<---- Footer pageee ---->>>>> */


.footer {
   background-color: #1d4536;
   color: white;
   padding: 50px 20px;
}

.footer a {
   color: white;
   text-decoration: none;
   font-size: 14px;
   font-weight: 400;
}

.footer .footerContact-txt {
   font-size: 14px;
   font-weight: 400;
   color: white;
   line-height: 23px;
}

.footer .mailHeader {
   font-size: 14px;
   font-weight: 400;
   color: white;
}

.footer .gmail-input {
   background-color: #1d4536;
   color: #FFFFFF;
   outline: none;
}

.footer .gmail-input::placeholder {
   color: #FFFFFF;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 1px;
}

.footer a:hover {
   text-decoration: underline;
}

.footer-logo-img {
   height: 105px;
   width: 320px;
}

.gmail-descTxt {
   font-size: 0.95rem;
   line-height: 1.2;
   margin: 0;
}

.subscribe-btn {
   width: 170px;
   background-color: #e6ff44;
   color: #000;
   font-size: 15px;
   font-weight: 500;
   padding: 10px 30px;
   border: none;
   border-radius: 5px;
}

.social-icons a {
   color: white;
   font-size: 20px;
   margin-left: 10px;
}

.footer-bottom {
   /* border-top: 1px solid #fff3; */
   margin-top: 40px;
   padding-top: 20px;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
}

@media (max-width: 768px) {
   .footer-bottom {
      flex-direction: column;
      align-items: flex-start;
      gap: 10px;
   }
}